/* Moonverse Consolidated Production Stylesheet Bundle */

/* === Layer: index-Bz-C05ba.css === */
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@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-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--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-scroll-snap-strictness:proximity;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--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-ease:initial}}}@layer theme{:root,:host{--font-sans:"Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-orange-400:oklch(75% .183 55.934);--color-orange-500:oklch(70.5% .213 47.604);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-700:oklch(55.5% .163 48.998);--color-amber-800:oklch(47.3% .137 46.201);--color-emerald-400:oklch(76.5% .177 163.223);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-600:oklch(59.6% .145 163.225);--color-emerald-700:oklch(50.8% .118 165.612);--color-cyan-400:oklch(78.9% .154 211.53);--color-cyan-500:oklch(71.5% .143 215.221);--color-cyan-700:oklch(52% .105 223.128);--color-sky-400:oklch(74.6% .16 232.661);--color-sky-500:oklch(68.5% .169 237.323);--color-sky-600:oklch(58.8% .158 241.966);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-500:oklch(62.3% .214 259.815);--color-indigo-300:oklch(78.5% .115 274.713);--color-indigo-400:oklch(67.3% .182 276.935);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-600:oklch(51.1% .262 276.966);--color-indigo-700:oklch(45.7% .24 277.023);--color-purple-300:oklch(82.7% .119 306.383);--color-purple-400:oklch(71.4% .203 305.504);--color-purple-500:oklch(62.7% .265 303.9);--color-purple-600:oklch(55.8% .288 302.321);--color-pink-400:oklch(71.8% .202 349.761);--color-pink-500:oklch(65.6% .241 354.308);--color-rose-300:oklch(81% .117 11.638);--color-rose-400:oklch(71.2% .194 13.428);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-600:oklch(58.6% .253 17.585);--color-rose-700:oklch(51.4% .222 16.935);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--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:calc(1.5 / 1);--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-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-wider:.05em;--tracking-widest:.1em;--leading-tight:1.25;--leading-snug:1.375;--leading-relaxed:1.625;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--drop-shadow-sm:0 1px 2px #00000026;--ease-out:cubic-bezier(0, 0, .2, 1);--animate-ping:ping 1s cubic-bezier(0, 0, .2, 1) infinite;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--animate-bounce:bounce 1s infinite;--blur-xs:4px;--blur-sm:8px;--blur-md:12px;--blur-lg:16px;--blur-xl:24px;--blur-2xl:40px;--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-background:var(--background);--color-foreground:var(--foreground);--color-card:var(--card);--color-card-foreground:var(--card-foreground);--color-primary:var(--primary);--color-primary-foreground:var(--primary-foreground);--color-primary-hover:var(--primary-hover);--color-secondary:var(--secondary);--color-muted:var(--muted);--color-muted-foreground:var(--muted-foreground);--color-accent:var(--accent);--color-accent-foreground:var(--accent-foreground);--color-destructive:var(--destructive);--color-border:var(--border);--color-input:var(--input);--font-display:"Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}}@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,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, 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;-webkit-text-decoration:inherit;-webkit-text-decoration: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:where(:not(iframe)){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}:root,:root.dark{--background:#0f1523;--foreground:#cbd5e1;--card:#161f32;--card-foreground:#cbd5e1;--popover:#161f32;--popover-foreground:#cbd5e1;--primary:#818cf8;--primary-foreground:#080c14;--primary-hover:#6366f1;--secondary:#a78bfa;--secondary-foreground:#080c14;--muted:#1e293b;--muted-foreground:#94a3b8;--accent:#38bdf8;--accent-foreground:#080c14;--destructive:#f43f5e;--destructive-foreground:#fff;--border:#94a3b824;--input:#1b2438;--ring:#818cf8;--radius:.85rem;--gold:#f59e0b;--moon:#c7d2fe;--star:#a78bfa}:root.theme-light,:root.light,.theme-light,.light{--background:#f6f8fa;--foreground:#1e293b;--card:#fff;--card-foreground:#1e293b;--popover:#fff;--popover-foreground:#1e293b;--primary:#4338ca;--primary-foreground:#fff;--primary-hover:#3730a3;--secondary:#6d28d9;--secondary-foreground:#fff;--muted:#eef2f6;--muted-foreground:#475569;--accent:#0369a1;--accent-foreground:#fff;--destructive:#be123c;--destructive-foreground:#fff;--border:#0f172a1a;--input:#eef2f6;--ring:#4338ca;--gold:#b45309;--moon:#4338ca;--star:#6d28d9}:root.theme-sepia,.theme-sepia{--background:#f5f0e6;--foreground:#2d251e;--card:#faf6ed;--card-foreground:#2d251e;--popover:#faf6ed;--popover-foreground:#2d251e;--primary:#92400e;--primary-foreground:#fff;--primary-hover:#78350f;--secondary:#78350f;--secondary-foreground:#fff;--muted:#eae3d5;--muted-foreground:#5c4e43;--accent:#854d0e;--accent-foreground:#fff;--destructive:#9f1239;--destructive-foreground:#fff;--border:#3c2d1e1f;--input:#eae3d5;--ring:#92400e;--gold:#92400e;--moon:#b45309;--star:#78350f}:root.theme-midnight,.theme-midnight{--background:#080c14;--foreground:#d1d5db;--card:#0f1624;--card-foreground:#d1d5db;--popover:#0f1624;--popover-foreground:#d1d5db;--primary:#f59e0b;--primary-foreground:#080c14;--primary-hover:#d97706;--secondary:#a78bfa;--secondary-foreground:#080c14;--muted:#141c2c;--muted-foreground:#8b9bb4;--accent:#38bdf8;--accent-foreground:#080c14;--destructive:#f43f5e;--destructive-foreground:#fff;--border:#ffffff1a;--input:#141c2c;--ring:#f59e0b;--gold:#f59e0b;--moon:#fef08a;--star:#c084fc}html,body{font-family:var(--font-sans);background-color:var(--background);color:var(--foreground);min-height:100%;transition:background-color .25s,color .25s}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.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}.static{position:static}.sticky{position:sticky}.-inset-2{inset:calc(var(--spacing) * -2)}.-inset-3{inset:calc(var(--spacing) * -3)}.-inset-4{inset:calc(var(--spacing) * -4)}.inset-0{inset:0}.inset-x-0{inset-inline:0}.inset-x-8{inset-inline:calc(var(--spacing) * 8)}.-top-0\.5{top:calc(var(--spacing) * -.5)}.-top-1{top:calc(var(--spacing) * -1)}.-top-2\.5{top:calc(var(--spacing) * -2.5)}.-top-3\.5{top:calc(var(--spacing) * -3.5)}.top-0{top:0}.top-1{top:var(--spacing)}.top-1\.5{top:calc(var(--spacing) * 1.5)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.top-3{top:calc(var(--spacing) * 3)}.top-4{top:calc(var(--spacing) * 4)}.top-20{top:calc(var(--spacing) * 20)}.top-full{top:100%}.-right-0\.5{right:calc(var(--spacing) * -.5)}.-right-1{right:calc(var(--spacing) * -1)}.-right-2{right:calc(var(--spacing) * -2)}.right-0{right:0}.right-1{right:var(--spacing)}.right-1\.5{right:calc(var(--spacing) * 1.5)}.right-2{right:calc(var(--spacing) * 2)}.right-2\.5{right:calc(var(--spacing) * 2.5)}.right-3{right:calc(var(--spacing) * 3)}.right-3\.5{right:calc(var(--spacing) * 3.5)}.right-4{right:calc(var(--spacing) * 4)}.-bottom-1{bottom:calc(var(--spacing) * -1)}.bottom-0{bottom:0}.bottom-1{bottom:var(--spacing)}.bottom-1\.5{bottom:calc(var(--spacing) * 1.5)}.bottom-2\.5{bottom:calc(var(--spacing) * 2.5)}.bottom-3{bottom:calc(var(--spacing) * 3)}.bottom-4{bottom:calc(var(--spacing) * 4)}.bottom-20{bottom:calc(var(--spacing) * 20)}.bottom-full{bottom:100%}.-left-1{left:calc(var(--spacing) * -1)}.left-0{left:0}.left-1{left:var(--spacing)}.left-1\.5{left:calc(var(--spacing) * 1.5)}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing) * 2)}.left-2\.5{left:calc(var(--spacing) * 2.5)}.left-3{left:calc(var(--spacing) * 3)}.left-3\.5{left:calc(var(--spacing) * 3.5)}.left-6{left:calc(var(--spacing) * 6)}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-35{z-index:35}.z-40{z-index:40}.z-50{z-index:50}.order-1{order:1}.order-2{order:2}.order-3{order:3}.col-1{grid-column:1}.col-2{grid-column:2}.col-3{grid-column:3}.col-4{grid-column:4}.col-span-2{grid-column:span 2/span 2}.col-span-4{grid-column:span 4/span 4}.col-span-8{grid-column:span 8/span 8}.col-span-full{grid-column:1/-1}.container{width:100%}@media (width>=480px){.container{max-width:480px}}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.mx-0\.5{margin-inline:calc(var(--spacing) * .5)}.mx-auto{margin-inline:auto}.my-2{margin-block:calc(var(--spacing) * 2)}.my-3{margin-block:calc(var(--spacing) * 3)}.my-5{margin-block:calc(var(--spacing) * 5)}.my-6{margin-block:calc(var(--spacing) * 6)}.my-10{margin-block:calc(var(--spacing) * 10)}.-mt-8{margin-top:calc(var(--spacing) * -8)}.-mt-12{margin-top:calc(var(--spacing) * -12)}.-mt-16{margin-top:calc(var(--spacing) * -16)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-2\.5{margin-top:calc(var(--spacing) * 2.5)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-3\.5{margin-top:calc(var(--spacing) * 3.5)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mr-1{margin-right:var(--spacing)}.mb-0\.5{margin-bottom:calc(var(--spacing) * .5)}.mb-1{margin-bottom:var(--spacing)}.mb-1\.5{margin-bottom:calc(var(--spacing) * 1.5)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-2\.5{margin-bottom:calc(var(--spacing) * 2.5)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.ml-0\.5{margin-left:calc(var(--spacing) * .5)}.ml-1{margin-left:var(--spacing)}.ml-1\.5{margin-left:calc(var(--spacing) * 1.5)}.ml-2\.5{margin-left:calc(var(--spacing) * 2.5)}.ml-auto{margin-left:auto}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.line-clamp-4{-webkit-line-clamp:4;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.aspect-\[2\/3\]{aspect-ratio:2/3}.h-1{height:var(--spacing)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-12{height:calc(var(--spacing) * 12)}.h-14{height:calc(var(--spacing) * 14)}.h-16{height:calc(var(--spacing) * 16)}.h-18{height:calc(var(--spacing) * 18)}.h-20{height:calc(var(--spacing) * 20)}.h-22{height:calc(var(--spacing) * 22)}.h-24{height:calc(var(--spacing) * 24)}.h-26{height:calc(var(--spacing) * 26)}.h-28{height:calc(var(--spacing) * 28)}.h-36{height:calc(var(--spacing) * 36)}.h-44{height:calc(var(--spacing) * 44)}.h-48{height:calc(var(--spacing) * 48)}.h-56{height:calc(var(--spacing) * 56)}.h-\[14px\]{height:14px}.h-\[18px\]{height:18px}.h-full{height:100%}.h-px{height:1px}.max-h-40{max-height:calc(var(--spacing) * 40)}.max-h-56{max-height:calc(var(--spacing) * 56)}.max-h-60{max-height:calc(var(--spacing) * 60)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-72{max-height:calc(var(--spacing) * 72)}.max-h-96{max-height:calc(var(--spacing) * 96)}.max-h-\[85vh\]{max-height:85vh}.max-h-\[88vh\]{max-height:88vh}.max-h-\[90vh\]{max-height:90vh}.max-h-\[380px\]{max-height:380px}.min-h-\[100px\]{min-height:100px}.min-h-\[220px\]{min-height:220px}.min-h-screen{min-height:100vh}.w-1\.5{width:calc(var(--spacing) * 1.5)}.w-2{width:calc(var(--spacing) * 2)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-11{width:calc(var(--spacing) * 11)}.w-12{width:calc(var(--spacing) * 12)}.w-14{width:calc(var(--spacing) * 14)}.w-16{width:calc(var(--spacing) * 16)}.w-18{width:calc(var(--spacing) * 18)}.w-20{width:calc(var(--spacing) * 20)}.w-22{width:calc(var(--spacing) * 22)}.w-24{width:calc(var(--spacing) * 24)}.w-28{width:calc(var(--spacing) * 28)}.w-30{width:calc(var(--spacing) * 30)}.w-32{width:calc(var(--spacing) * 32)}.w-36{width:calc(var(--spacing) * 36)}.w-44{width:calc(var(--spacing) * 44)}.w-52{width:calc(var(--spacing) * 52)}.w-56{width:calc(var(--spacing) * 56)}.w-60{width:calc(var(--spacing) * 60)}.w-80{width:calc(var(--spacing) * 80)}.w-\[1\.5px\]{width:1.5px}.w-fit{width:fit-content}.w-full{width:100%}.w-px{width:1px}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-\[95vw\]{max-width:95vw}.max-w-\[100px\]{max-width:100px}.max-w-\[120px\]{max-width:120px}.max-w-\[130px\]{max-width:130px}.max-w-\[140px\]{max-width:140px}.max-w-\[190px\]{max-width:190px}.max-w-\[240px\]{max-width:240px}.max-w-\[260px\]{max-width:260px}.max-w-\[680px\]{max-width:680px}.max-w-\[840px\]{max-width:840px}.max-w-\[1040px\]{max-width:1040px}.max-w-\[calc\(100vw-1\.5rem\)\]{max-width:calc(100vw - 1.5rem)}.max-w-\[calc\(100vw-2rem\)\]{max-width:calc(100vw - 2rem)}.max-w-full{max-width:100%}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.max-w-none{max-width:none}.max-w-sm{max-width:var(--container-sm)}.max-w-xl{max-width:var(--container-xl)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:0}.min-w-\[14px\]{min-width:14px}.min-w-\[18px\]{min-width:18px}.min-w-\[56px\]{min-width:56px}.min-w-\[110px\]{min-width:110px}.min-w-\[140px\]{min-width:140px}.min-w-\[560px\]{min-width:560px}.flex-1{flex:1}.shrink-0{flex-shrink:0}.origin-bottom{transform-origin:bottom}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-0{--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-4{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0{--tw-translate-y:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-2{--tw-translate-y:calc(var(--spacing) * 2);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-16{--tw-translate-y:calc(var(--spacing) * 16);translate:var(--tw-translate-x) var(--tw-translate-y)}.scale-90{--tw-scale-x:90%;--tw-scale-y:90%;--tw-scale-z:90%;scale:var(--tw-scale-x) var(--tw-scale-y)}.scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}.scale-105{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x) var(--tw-scale-y)}.scale-110{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-bounce{animation:var(--animate-bounce)}.animate-ping{animation:var(--animate-ping)}.animate-pulse{animation:var(--animate-pulse)}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-zoom-in{cursor:zoom-in}.resize{resize:both}.resize-none{resize:none}.resize-y{resize:vertical}.snap-x{scroll-snap-type:x var(--tw-scroll-snap-strictness)}.snap-mandatory{--tw-scroll-snap-strictness:mandatory}.snap-start{scroll-snap-align:start}.scrollbar-none{scrollbar-width:none}.scrollbar-thin{scrollbar-width:thin}.list-disc{list-style-type:disc}.\[appearance\:textfield\]{appearance:textfield}.appearance-none{appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-around{justify-content:space-around}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-3\.5{gap:calc(var(--spacing) * 3.5)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}:where(.space-y-0\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * .5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * .5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-border\/20>:not(:last-child)){border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){:where(.divide-border\/20>:not(:last-child)){border-color:color-mix(in oklab, var(--color-border) 20%, transparent)}}:where(.divide-border\/30>:not(:last-child)){border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){:where(.divide-border\/30>:not(:last-child)){border-color:color-mix(in oklab, var(--color-border) 30%, transparent)}}:where(.divide-border\/40>:not(:last-child)){border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){:where(.divide-border\/40>:not(:last-child)){border-color:color-mix(in oklab, var(--color-border) 40%, transparent)}}:where(.divide-border\/60>:not(:last-child)){border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){:where(.divide-border\/60>:not(:last-child)){border-color:color-mix(in oklab, var(--color-border) 60%, transparent)}}.self-center{align-self:center}.self-end{align-self:flex-end}.self-start{align-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.scroll-smooth{scroll-behavior:smooth}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-\[2px\]{border-radius:2px}.rounded-\[10px\]{border-radius:10px}.rounded-full{border-radius:2147483647px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-2xl{border-top-left-radius:var(--radius-2xl);border-top-right-radius:var(--radius-2xl)}.rounded-bl-full{border-bottom-left-radius:2147483647px}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-y{border-block-style:var(--tw-border-style);border-block-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[\#1e293b\]{border-color:#1e293b}.border-\[\#dfd7ca\]{border-color:#dfd7ca}.border-\[\#e2e8f0\]{border-color:#e2e8f0}.border-accent\/30{border-color:var(--color-accent)}@supports (color:color-mix(in lab, red, red)){.border-accent\/30{border-color:color-mix(in oklab, var(--color-accent) 30%, transparent)}}.border-amber-200{border-color:var(--color-amber-200)}.border-amber-400{border-color:var(--color-amber-400)}.border-amber-400\/70{border-color:#fcbb00b3}@supports (color:color-mix(in lab, red, red)){.border-amber-400\/70{border-color:color-mix(in oklab, var(--color-amber-400) 70%, transparent)}}.border-amber-400\/90{border-color:#fcbb00e6}@supports (color:color-mix(in lab, red, red)){.border-amber-400\/90{border-color:color-mix(in oklab, var(--color-amber-400) 90%, transparent)}}.border-amber-500{border-color:var(--color-amber-500)}.border-amber-500\/20{border-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/20{border-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.border-amber-500\/25{border-color:#f99c0040}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/25{border-color:color-mix(in oklab, var(--color-amber-500) 25%, transparent)}}.border-amber-500\/30{border-color:#f99c004d}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/30{border-color:color-mix(in oklab, var(--color-amber-500) 30%, transparent)}}.border-amber-500\/40{border-color:#f99c0066}@supports (color:color-mix(in lab, red, red)){.border-amber-500\/40{border-color:color-mix(in oklab, var(--color-amber-500) 40%, transparent)}}.border-amber-700\/40{border-color:#b7500066}@supports (color:color-mix(in lab, red, red)){.border-amber-700\/40{border-color:color-mix(in oklab, var(--color-amber-700) 40%, transparent)}}.border-amber-700\/80{border-color:#b75000cc}@supports (color:color-mix(in lab, red, red)){.border-amber-700\/80{border-color:color-mix(in oklab, var(--color-amber-700) 80%, transparent)}}.border-blue-500\/30{border-color:#3080ff4d}@supports (color:color-mix(in lab, red, red)){.border-blue-500\/30{border-color:color-mix(in oklab, var(--color-blue-500) 30%, transparent)}}.border-blue-500\/40{border-color:#3080ff66}@supports (color:color-mix(in lab, red, red)){.border-blue-500\/40{border-color:color-mix(in oklab, var(--color-blue-500) 40%, transparent)}}.border-border,.border-border\/20{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/20{border-color:color-mix(in oklab, var(--color-border) 20%, transparent)}}.border-border\/25{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/25{border-color:color-mix(in oklab, var(--color-border) 25%, transparent)}}.border-border\/30{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/30{border-color:color-mix(in oklab, var(--color-border) 30%, transparent)}}.border-border\/40{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/40{border-color:color-mix(in oklab, var(--color-border) 40%, transparent)}}.border-border\/50{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/50{border-color:color-mix(in oklab, var(--color-border) 50%, transparent)}}.border-border\/60{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/60{border-color:color-mix(in oklab, var(--color-border) 60%, transparent)}}.border-border\/70{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/70{border-color:color-mix(in oklab, var(--color-border) 70%, transparent)}}.border-border\/80{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.border-border\/80{border-color:color-mix(in oklab, var(--color-border) 80%, transparent)}}.border-cyan-500\/30{border-color:#00b7d74d}@supports (color:color-mix(in lab, red, red)){.border-cyan-500\/30{border-color:color-mix(in oklab, var(--color-cyan-500) 30%, transparent)}}.border-destructive\/20{border-color:var(--color-destructive)}@supports (color:color-mix(in lab, red, red)){.border-destructive\/20{border-color:color-mix(in oklab, var(--color-destructive) 20%, transparent)}}.border-emerald-400{border-color:var(--color-emerald-400)}.border-emerald-500\/20{border-color:#00bb7f33}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/20{border-color:color-mix(in oklab, var(--color-emerald-500) 20%, transparent)}}.border-emerald-500\/25{border-color:#00bb7f40}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/25{border-color:color-mix(in oklab, var(--color-emerald-500) 25%, transparent)}}.border-emerald-500\/30{border-color:#00bb7f4d}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/30{border-color:color-mix(in oklab, var(--color-emerald-500) 30%, transparent)}}.border-emerald-500\/40{border-color:#00bb7f66}@supports (color:color-mix(in lab, red, red)){.border-emerald-500\/40{border-color:color-mix(in oklab, var(--color-emerald-500) 40%, transparent)}}.border-emerald-600{border-color:var(--color-emerald-600)}.border-indigo-500{border-color:var(--color-indigo-500)}.border-indigo-500\/20{border-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/20{border-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.border-indigo-500\/25{border-color:#625fff40}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/25{border-color:color-mix(in oklab, var(--color-indigo-500) 25%, transparent)}}.border-indigo-500\/30{border-color:#625fff4d}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/30{border-color:color-mix(in oklab, var(--color-indigo-500) 30%, transparent)}}.border-indigo-500\/40{border-color:#625fff66}@supports (color:color-mix(in lab, red, red)){.border-indigo-500\/40{border-color:color-mix(in oklab, var(--color-indigo-500) 40%, transparent)}}.border-muted-foreground\/40{border-color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.border-muted-foreground\/40{border-color:color-mix(in oklab, var(--color-muted-foreground) 40%, transparent)}}.border-orange-500\/40{border-color:#fe6e0066}@supports (color:color-mix(in lab, red, red)){.border-orange-500\/40{border-color:color-mix(in oklab, var(--color-orange-500) 40%, transparent)}}.border-pink-500\/30{border-color:#f6339a4d}@supports (color:color-mix(in lab, red, red)){.border-pink-500\/30{border-color:color-mix(in oklab, var(--color-pink-500) 30%, transparent)}}.border-pink-500\/40{border-color:#f6339a66}@supports (color:color-mix(in lab, red, red)){.border-pink-500\/40{border-color:color-mix(in oklab, var(--color-pink-500) 40%, transparent)}}.border-primary,.border-primary\/15{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/15{border-color:color-mix(in oklab, var(--color-primary) 15%, transparent)}}.border-primary\/20{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/20{border-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.border-primary\/25{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/25{border-color:color-mix(in oklab, var(--color-primary) 25%, transparent)}}.border-primary\/30{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/30{border-color:color-mix(in oklab, var(--color-primary) 30%, transparent)}}.border-primary\/40{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/40{border-color:color-mix(in oklab, var(--color-primary) 40%, transparent)}}.border-primary\/50{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/50{border-color:color-mix(in oklab, var(--color-primary) 50%, transparent)}}.border-primary\/60{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/60{border-color:color-mix(in oklab, var(--color-primary) 60%, transparent)}}.border-purple-400{border-color:var(--color-purple-400)}.border-purple-500\/30{border-color:#ac4bff4d}@supports (color:color-mix(in lab, red, red)){.border-purple-500\/30{border-color:color-mix(in oklab, var(--color-purple-500) 30%, transparent)}}.border-purple-500\/40{border-color:#ac4bff66}@supports (color:color-mix(in lab, red, red)){.border-purple-500\/40{border-color:color-mix(in oklab, var(--color-purple-500) 40%, transparent)}}.border-red-500\/40{border-color:#fb2c3666}@supports (color:color-mix(in lab, red, red)){.border-red-500\/40{border-color:color-mix(in oklab, var(--color-red-500) 40%, transparent)}}.border-rose-500{border-color:var(--color-rose-500)}.border-rose-500\/20{border-color:#ff235733}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/20{border-color:color-mix(in oklab, var(--color-rose-500) 20%, transparent)}}.border-rose-500\/25{border-color:#ff235740}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/25{border-color:color-mix(in oklab, var(--color-rose-500) 25%, transparent)}}.border-rose-500\/30{border-color:#ff23574d}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/30{border-color:color-mix(in oklab, var(--color-rose-500) 30%, transparent)}}.border-rose-500\/40{border-color:#ff235766}@supports (color:color-mix(in lab, red, red)){.border-rose-500\/40{border-color:color-mix(in oklab, var(--color-rose-500) 40%, transparent)}}.border-secondary\/20{border-color:var(--color-secondary)}@supports (color:color-mix(in lab, red, red)){.border-secondary\/20{border-color:color-mix(in oklab, var(--color-secondary) 20%, transparent)}}.border-secondary\/30{border-color:var(--color-secondary)}@supports (color:color-mix(in lab, red, red)){.border-secondary\/30{border-color:color-mix(in oklab, var(--color-secondary) 30%, transparent)}}.border-sky-400{border-color:var(--color-sky-400)}.border-sky-500{border-color:var(--color-sky-500)}.border-sky-500\/30{border-color:#00a5ef4d}@supports (color:color-mix(in lab, red, red)){.border-sky-500\/30{border-color:color-mix(in oklab, var(--color-sky-500) 30%, transparent)}}.border-slate-300{border-color:var(--color-slate-300)}.border-slate-400\/40{border-color:#90a1b966}@supports (color:color-mix(in lab, red, red)){.border-slate-400\/40{border-color:color-mix(in oklab, var(--color-slate-400) 40%, transparent)}}.border-slate-500\/30{border-color:#62748e4d}@supports (color:color-mix(in lab, red, red)){.border-slate-500\/30{border-color:color-mix(in oklab, var(--color-slate-500) 30%, transparent)}}.border-slate-600{border-color:var(--color-slate-600)}.border-transparent{border-color:#0000}.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)}}.bg-\[\#0f1523\]{background-color:#0f1523}.bg-\[\#080c14\]{background-color:#080c14}.bg-\[\#f5f0e6\]{background-color:#f5f0e6}.bg-\[\#f6f8fa\]{background-color:#f6f8fa}.bg-accent\/15{background-color:var(--color-accent)}@supports (color:color-mix(in lab, red, red)){.bg-accent\/15{background-color:color-mix(in oklab, var(--color-accent) 15%, transparent)}}.bg-amber-400{background-color:var(--color-amber-400)}.bg-amber-400\/8{background-color:#fcbb0014}@supports (color:color-mix(in lab, red, red)){.bg-amber-400\/8{background-color:color-mix(in oklab, var(--color-amber-400) 8%, transparent)}}.bg-amber-400\/12{background-color:#fcbb001f}@supports (color:color-mix(in lab, red, red)){.bg-amber-400\/12{background-color:color-mix(in oklab, var(--color-amber-400) 12%, transparent)}}.bg-amber-400\/20{background-color:#fcbb0033}@supports (color:color-mix(in lab, red, red)){.bg-amber-400\/20{background-color:color-mix(in oklab, var(--color-amber-400) 20%, transparent)}}.bg-amber-500{background-color:var(--color-amber-500)}.bg-amber-500\/5{background-color:#f99c000d}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/5{background-color:color-mix(in oklab, var(--color-amber-500) 5%, transparent)}}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/10{background-color:color-mix(in oklab, var(--color-amber-500) 10%, transparent)}}.bg-amber-500\/15{background-color:#f99c0026}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/15{background-color:color-mix(in oklab, var(--color-amber-500) 15%, transparent)}}.bg-amber-500\/20{background-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.bg-amber-500\/20{background-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.bg-amber-700\/80{background-color:#b75000cc}@supports (color:color-mix(in lab, red, red)){.bg-amber-700\/80{background-color:color-mix(in oklab, var(--color-amber-700) 80%, transparent)}}.bg-background,.bg-background\/80{background-color:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.bg-background\/80{background-color:color-mix(in oklab, var(--color-background) 80%, transparent)}}.bg-background\/85{background-color:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.bg-background\/85{background-color:color-mix(in oklab, var(--color-background) 85%, transparent)}}.bg-background\/90{background-color:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.bg-background\/90{background-color:color-mix(in oklab, var(--color-background) 90%, transparent)}}.bg-black{background-color:var(--color-black)}.bg-black\/20{background-color:#0003}@supports (color:color-mix(in lab, red, red)){.bg-black\/20{background-color:color-mix(in oklab, var(--color-black) 20%, transparent)}}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab, red, red)){.bg-black\/60{background-color:color-mix(in oklab, var(--color-black) 60%, transparent)}}.bg-black\/65{background-color:#000000a6}@supports (color:color-mix(in lab, red, red)){.bg-black\/65{background-color:color-mix(in oklab, var(--color-black) 65%, transparent)}}.bg-black\/70{background-color:#000000b3}@supports (color:color-mix(in lab, red, red)){.bg-black\/70{background-color:color-mix(in oklab, var(--color-black) 70%, transparent)}}.bg-blue-500\/15{background-color:#3080ff26}@supports (color:color-mix(in lab, red, red)){.bg-blue-500\/15{background-color:color-mix(in oklab, var(--color-blue-500) 15%, transparent)}}.bg-border,.bg-border\/40{background-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.bg-border\/40{background-color:color-mix(in oklab, var(--color-border) 40%, transparent)}}.bg-border\/60{background-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.bg-border\/60{background-color:color-mix(in oklab, var(--color-border) 60%, transparent)}}.bg-border\/80{background-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.bg-border\/80{background-color:color-mix(in oklab, var(--color-border) 80%, transparent)}}.bg-card,.bg-card\/20{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/20{background-color:color-mix(in oklab, var(--color-card) 20%, transparent)}}.bg-card\/25{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/25{background-color:color-mix(in oklab, var(--color-card) 25%, transparent)}}.bg-card\/30{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/30{background-color:color-mix(in oklab, var(--color-card) 30%, transparent)}}.bg-card\/40{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/40{background-color:color-mix(in oklab, var(--color-card) 40%, transparent)}}.bg-card\/50{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/50{background-color:color-mix(in oklab, var(--color-card) 50%, transparent)}}.bg-card\/60{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/60{background-color:color-mix(in oklab, var(--color-card) 60%, transparent)}}.bg-card\/70{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/70{background-color:color-mix(in oklab, var(--color-card) 70%, transparent)}}.bg-card\/80{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/80{background-color:color-mix(in oklab, var(--color-card) 80%, transparent)}}.bg-card\/85{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/85{background-color:color-mix(in oklab, var(--color-card) 85%, transparent)}}.bg-card\/90{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/90{background-color:color-mix(in oklab, var(--color-card) 90%, transparent)}}.bg-card\/95{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.bg-card\/95{background-color:color-mix(in oklab, var(--color-card) 95%, transparent)}}.bg-cyan-400{background-color:var(--color-cyan-400)}.bg-cyan-500\/15{background-color:#00b7d726}@supports (color:color-mix(in lab, red, red)){.bg-cyan-500\/15{background-color:color-mix(in oklab, var(--color-cyan-500) 15%, transparent)}}.bg-destructive\/10{background-color:var(--color-destructive)}@supports (color:color-mix(in lab, red, red)){.bg-destructive\/10{background-color:color-mix(in oklab, var(--color-destructive) 10%, transparent)}}.bg-emerald-400{background-color:var(--color-emerald-400)}.bg-emerald-500\/10{background-color:#00bb7f1a}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/10{background-color:color-mix(in oklab, var(--color-emerald-500) 10%, transparent)}}.bg-emerald-500\/15{background-color:#00bb7f26}@supports (color:color-mix(in lab, red, red)){.bg-emerald-500\/15{background-color:color-mix(in oklab, var(--color-emerald-500) 15%, transparent)}}.bg-emerald-600{background-color:var(--color-emerald-600)}.bg-indigo-400{background-color:var(--color-indigo-400)}.bg-indigo-500{background-color:var(--color-indigo-500)}.bg-indigo-500\/8{background-color:#625fff14}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/8{background-color:color-mix(in oklab, var(--color-indigo-500) 8%, transparent)}}.bg-indigo-500\/10{background-color:#625fff1a}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/10{background-color:color-mix(in oklab, var(--color-indigo-500) 10%, transparent)}}.bg-indigo-500\/15{background-color:#625fff26}@supports (color:color-mix(in lab, red, red)){.bg-indigo-500\/15{background-color:color-mix(in oklab, var(--color-indigo-500) 15%, transparent)}}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-input{background-color:var(--color-input)}.bg-muted{background-color:var(--color-muted)}.bg-muted-foreground\/30{background-color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.bg-muted-foreground\/30{background-color:color-mix(in oklab, var(--color-muted-foreground) 30%, transparent)}}.bg-muted\/10{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/10{background-color:color-mix(in oklab, var(--color-muted) 10%, transparent)}}.bg-muted\/15{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/15{background-color:color-mix(in oklab, var(--color-muted) 15%, transparent)}}.bg-muted\/20{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/20{background-color:color-mix(in oklab, var(--color-muted) 20%, transparent)}}.bg-muted\/30{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/30{background-color:color-mix(in oklab, var(--color-muted) 30%, transparent)}}.bg-muted\/40{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/40{background-color:color-mix(in oklab, var(--color-muted) 40%, transparent)}}.bg-muted\/50{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/50{background-color:color-mix(in oklab, var(--color-muted) 50%, transparent)}}.bg-muted\/60{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/60{background-color:color-mix(in oklab, var(--color-muted) 60%, transparent)}}.bg-muted\/70{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/70{background-color:color-mix(in oklab, var(--color-muted) 70%, transparent)}}.bg-muted\/80{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/80{background-color:color-mix(in oklab, var(--color-muted) 80%, transparent)}}.bg-orange-500\/15{background-color:#fe6e0026}@supports (color:color-mix(in lab, red, red)){.bg-orange-500\/15{background-color:color-mix(in oklab, var(--color-orange-500) 15%, transparent)}}.bg-pink-400{background-color:var(--color-pink-400)}.bg-pink-500\/15{background-color:#f6339a26}@supports (color:color-mix(in lab, red, red)){.bg-pink-500\/15{background-color:color-mix(in oklab, var(--color-pink-500) 15%, transparent)}}.bg-primary{background-color:var(--color-primary)}.bg-primary-foreground\/20{background-color:var(--color-primary-foreground)}@supports (color:color-mix(in lab, red, red)){.bg-primary-foreground\/20{background-color:color-mix(in oklab, var(--color-primary-foreground) 20%, transparent)}}.bg-primary\/5{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/5{background-color:color-mix(in oklab, var(--color-primary) 5%, transparent)}}.bg-primary\/10{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/10{background-color:color-mix(in oklab, var(--color-primary) 10%, transparent)}}.bg-primary\/15{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/15{background-color:color-mix(in oklab, var(--color-primary) 15%, transparent)}}.bg-primary\/20{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/20{background-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.bg-primary\/30{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/30{background-color:color-mix(in oklab, var(--color-primary) 30%, transparent)}}.bg-primary\/55{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/55{background-color:color-mix(in oklab, var(--color-primary) 55%, transparent)}}.bg-primary\/60{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/60{background-color:color-mix(in oklab, var(--color-primary) 60%, transparent)}}.bg-primary\/80{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/80{background-color:color-mix(in oklab, var(--color-primary) 80%, transparent)}}.bg-purple-500{background-color:var(--color-purple-500)}.bg-purple-500\/10{background-color:#ac4bff1a}@supports (color:color-mix(in lab, red, red)){.bg-purple-500\/10{background-color:color-mix(in oklab, var(--color-purple-500) 10%, transparent)}}.bg-purple-500\/15{background-color:#ac4bff26}@supports (color:color-mix(in lab, red, red)){.bg-purple-500\/15{background-color:color-mix(in oklab, var(--color-purple-500) 15%, transparent)}}.bg-red-500\/15{background-color:#fb2c3626}@supports (color:color-mix(in lab, red, red)){.bg-red-500\/15{background-color:color-mix(in oklab, var(--color-red-500) 15%, transparent)}}.bg-rose-400{background-color:var(--color-rose-400)}.bg-rose-500{background-color:var(--color-rose-500)}.bg-rose-500\/5{background-color:#ff23570d}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/5{background-color:color-mix(in oklab, var(--color-rose-500) 5%, transparent)}}.bg-rose-500\/8{background-color:#ff235714}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/8{background-color:color-mix(in oklab, var(--color-rose-500) 8%, transparent)}}.bg-rose-500\/10{background-color:#ff23571a}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/10{background-color:color-mix(in oklab, var(--color-rose-500) 10%, transparent)}}.bg-rose-500\/15{background-color:#ff235726}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/15{background-color:color-mix(in oklab, var(--color-rose-500) 15%, transparent)}}.bg-rose-500\/20{background-color:#ff235733}@supports (color:color-mix(in lab, red, red)){.bg-rose-500\/20{background-color:color-mix(in oklab, var(--color-rose-500) 20%, transparent)}}.bg-rose-600{background-color:var(--color-rose-600)}.bg-rose-600\/80{background-color:#e70044cc}@supports (color:color-mix(in lab, red, red)){.bg-rose-600\/80{background-color:color-mix(in oklab, var(--color-rose-600) 80%, transparent)}}.bg-rose-600\/90{background-color:#e70044e6}@supports (color:color-mix(in lab, red, red)){.bg-rose-600\/90{background-color:color-mix(in oklab, var(--color-rose-600) 90%, transparent)}}.bg-secondary\/10{background-color:var(--color-secondary)}@supports (color:color-mix(in lab, red, red)){.bg-secondary\/10{background-color:color-mix(in oklab, var(--color-secondary) 10%, transparent)}}.bg-secondary\/15{background-color:var(--color-secondary)}@supports (color:color-mix(in lab, red, red)){.bg-secondary\/15{background-color:color-mix(in oklab, var(--color-secondary) 15%, transparent)}}.bg-sky-500{background-color:var(--color-sky-500)}.bg-sky-500\/10{background-color:#00a5ef1a}@supports (color:color-mix(in lab, red, red)){.bg-sky-500\/10{background-color:color-mix(in oklab, var(--color-sky-500) 10%, transparent)}}.bg-slate-300{background-color:var(--color-slate-300)}.bg-slate-500\/10{background-color:#62748e1a}@supports (color:color-mix(in lab, red, red)){.bg-slate-500\/10{background-color:color-mix(in oklab, var(--color-slate-500) 10%, transparent)}}.bg-slate-600{background-color:var(--color-slate-600)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.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-gradient-to-b{--tw-gradient-position:to bottom in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-l{--tw-gradient-position:to left in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-t{--tw-gradient-position:to top 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-amber-400{--tw-gradient-from:var(--color-amber-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))}.from-amber-400\/15{--tw-gradient-from:#fcbb0026}@supports (color:color-mix(in lab, red, red)){.from-amber-400\/15{--tw-gradient-from:color-mix(in oklab, var(--color-amber-400) 15%, transparent)}}.from-amber-400\/15{--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-amber-500\/10{--tw-gradient-from:#f99c001a}@supports (color:color-mix(in lab, red, red)){.from-amber-500\/10{--tw-gradient-from:color-mix(in oklab, var(--color-amber-500) 10%, transparent)}}.from-amber-500\/10{--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-amber-500\/20{--tw-gradient-from:#f99c0033}@supports (color:color-mix(in lab, red, red)){.from-amber-500\/20{--tw-gradient-from:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.from-amber-500\/20{--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-amber-700\/20{--tw-gradient-from:#b7500033}@supports (color:color-mix(in lab, red, red)){.from-amber-700\/20{--tw-gradient-from:color-mix(in oklab, var(--color-amber-700) 20%, transparent)}}.from-amber-700\/20{--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-background{--tw-gradient-from:var(--color-background);--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-background\/90{--tw-gradient-from:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.from-background\/90{--tw-gradient-from:color-mix(in oklab, var(--color-background) 90%, transparent)}}.from-background\/90{--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-background\/95{--tw-gradient-from:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.from-background\/95{--tw-gradient-from:color-mix(in oklab, var(--color-background) 95%, transparent)}}.from-background\/95{--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-black\/95{--tw-gradient-from:#000000f2}@supports (color:color-mix(in lab, red, red)){.from-black\/95{--tw-gradient-from:color-mix(in oklab, var(--color-black) 95%, transparent)}}.from-black\/95{--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-card{--tw-gradient-from:var(--color-card);--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-card\/60{--tw-gradient-from:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.from-card\/60{--tw-gradient-from:color-mix(in oklab, var(--color-card) 60%, transparent)}}.from-card\/60{--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-card\/80{--tw-gradient-from:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.from-card\/80{--tw-gradient-from:color-mix(in oklab, var(--color-card) 80%, transparent)}}.from-card\/80{--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-card\/90{--tw-gradient-from:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.from-card\/90{--tw-gradient-from:color-mix(in oklab, var(--color-card) 90%, transparent)}}.from-card\/90{--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-indigo-500{--tw-gradient-from:var(--color-indigo-500);--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-primary{--tw-gradient-from:var(--color-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))}.from-primary\/10{--tw-gradient-from:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.from-primary\/10{--tw-gradient-from:color-mix(in oklab, var(--color-primary) 10%, transparent)}}.from-primary\/10{--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-primary\/20{--tw-gradient-from:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.from-primary\/20{--tw-gradient-from:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.from-primary\/20{--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-primary\/30{--tw-gradient-from:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.from-primary\/30{--tw-gradient-from:color-mix(in oklab, var(--color-primary) 30%, transparent)}}.from-primary\/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))}.from-rose-600{--tw-gradient-from:var(--color-rose-600);--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-slate-400\/20{--tw-gradient-from:#90a1b933}@supports (color:color-mix(in lab, red, red)){.from-slate-400\/20{--tw-gradient-from:color-mix(in oklab, var(--color-slate-400) 20%, transparent)}}.from-slate-400\/20{--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-transparent{--tw-gradient-from:transparent;--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-background\/60{--tw-gradient-via:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.via-background\/60{--tw-gradient-via:color-mix(in oklab, var(--color-background) 60%, transparent)}}.via-background\/60{--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)}.via-black\/80{--tw-gradient-via:#000c}@supports (color:color-mix(in lab, red, red)){.via-black\/80{--tw-gradient-via:color-mix(in oklab, var(--color-black) 80%, transparent)}}.via-black\/80{--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)}.via-card{--tw-gradient-via:var(--color-card);--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)}.via-card\/50{--tw-gradient-via:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.via-card\/50{--tw-gradient-via:color-mix(in oklab, var(--color-card) 50%, transparent)}}.via-card\/50{--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)}.via-card\/60{--tw-gradient-via:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.via-card\/60{--tw-gradient-via:color-mix(in oklab, var(--color-card) 60%, transparent)}}.via-card\/60{--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)}.via-card\/70{--tw-gradient-via:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.via-card\/70{--tw-gradient-via:color-mix(in oklab, var(--color-card) 70%, transparent)}}.via-card\/70{--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)}.via-card\/80{--tw-gradient-via:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.via-card\/80{--tw-gradient-via:color-mix(in oklab, var(--color-card) 80%, transparent)}}.via-card\/80{--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)}.via-card\/90{--tw-gradient-via:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.via-card\/90{--tw-gradient-via:color-mix(in oklab, var(--color-card) 90%, transparent)}}.via-card\/90{--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)}.via-indigo-500{--tw-gradient-via:var(--color-indigo-500);--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)}.via-primary{--tw-gradient-via:var(--color-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)}.via-primary\/5{--tw-gradient-via:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.via-primary\/5{--tw-gradient-via:color-mix(in oklab, var(--color-primary) 5%, transparent)}}.via-primary\/5{--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)}.via-primary\/10{--tw-gradient-via:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.via-primary\/10{--tw-gradient-via:color-mix(in oklab, var(--color-primary) 10%, transparent)}}.via-primary\/10{--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)}.via-primary\/50{--tw-gradient-via:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.via-primary\/50{--tw-gradient-via:color-mix(in oklab, var(--color-primary) 50%, transparent)}}.via-primary\/50{--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)}.via-purple-500\/5{--tw-gradient-via:#ac4bff0d}@supports (color:color-mix(in lab, red, red)){.via-purple-500\/5{--tw-gradient-via:color-mix(in oklab, var(--color-purple-500) 5%, transparent)}}.via-purple-500\/5{--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)}.via-transparent{--tw-gradient-via:transparent;--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-accent{--tw-gradient-to:var(--color-accent);--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-amber-300{--tw-gradient-to:var(--color-amber-300);--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-amber-400{--tw-gradient-to:var(--color-amber-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))}.to-amber-600\/20{--tw-gradient-to:#dd740033}@supports (color:color-mix(in lab, red, red)){.to-amber-600\/20{--tw-gradient-to:color-mix(in oklab, var(--color-amber-600) 20%, transparent)}}.to-amber-600\/20{--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-amber-800\/20{--tw-gradient-to:#953d0033}@supports (color:color-mix(in lab, red, red)){.to-amber-800\/20{--tw-gradient-to:color-mix(in oklab, var(--color-amber-800) 20%, transparent)}}.to-amber-800\/20{--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-background\/20{--tw-gradient-to:var(--color-background)}@supports (color:color-mix(in lab, red, red)){.to-background\/20{--tw-gradient-to:color-mix(in oklab, var(--color-background) 20%, transparent)}}.to-background\/20{--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-black\/40{--tw-gradient-to:#0006}@supports (color:color-mix(in lab, red, red)){.to-black\/40{--tw-gradient-to:color-mix(in oklab, var(--color-black) 40%, transparent)}}.to-black\/40{--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-card{--tw-gradient-to:var(--color-card);--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-card\/40{--tw-gradient-to:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.to-card\/40{--tw-gradient-to:color-mix(in oklab, var(--color-card) 40%, transparent)}}.to-card\/40{--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-card\/60{--tw-gradient-to:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.to-card\/60{--tw-gradient-to:color-mix(in oklab, var(--color-card) 60%, transparent)}}.to-card\/60{--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-indigo-400{--tw-gradient-to:var(--color-indigo-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))}.to-primary\/5{--tw-gradient-to:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.to-primary\/5{--tw-gradient-to:color-mix(in oklab, var(--color-primary) 5%, transparent)}}.to-primary\/5{--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-primary\/80{--tw-gradient-to:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.to-primary\/80{--tw-gradient-to:color-mix(in oklab, var(--color-primary) 80%, transparent)}}.to-primary\/80{--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-purple-500\/10{--tw-gradient-to:#ac4bff1a}@supports (color:color-mix(in lab, red, red)){.to-purple-500\/10{--tw-gradient-to:color-mix(in oklab, var(--color-purple-500) 10%, transparent)}}.to-purple-500\/10{--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-purple-600{--tw-gradient-to:var(--color-purple-600);--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-purple-600\/30{--tw-gradient-to:#9810fa4d}@supports (color:color-mix(in lab, red, red)){.to-purple-600\/30{--tw-gradient-to:color-mix(in oklab, var(--color-purple-600) 30%, transparent)}}.to-purple-600\/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))}.to-rose-500{--tw-gradient-to:var(--color-rose-500);--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-secondary\/20{--tw-gradient-to:var(--color-secondary)}@supports (color:color-mix(in lab, red, red)){.to-secondary\/20{--tw-gradient-to:color-mix(in oklab, var(--color-secondary) 20%, transparent)}}.to-secondary\/20{--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-slate-500\/20{--tw-gradient-to:#62748e33}@supports (color:color-mix(in lab, red, red)){.to-slate-500\/20{--tw-gradient-to:color-mix(in oklab, var(--color-slate-500) 20%, transparent)}}.to-slate-500\/20{--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-transparent{--tw-gradient-to:transparent;--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))}.fill-amber-300{fill:var(--color-amber-300)}.fill-amber-400{fill:var(--color-amber-400)}.fill-amber-500{fill:var(--color-amber-500)}.fill-amber-600{fill:var(--color-amber-600)}.fill-current{fill:currentColor}.fill-primary,.fill-primary\/30{fill:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.fill-primary\/30{fill:color-mix(in oklab, var(--color-primary) 30%, transparent)}}.fill-rose-400{fill:var(--color-rose-400)}.fill-rose-400\/20{fill:#ff667f33}@supports (color:color-mix(in lab, red, red)){.fill-rose-400\/20{fill:color-mix(in oklab, var(--color-rose-400) 20%, transparent)}}.fill-white{fill:var(--color-white)}.stroke-\[2\.5\]{stroke-width:2.5px}.object-cover{object-fit:cover}.object-center{object-position:center}.p-0{padding:0}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-1{padding:var(--spacing)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-2\.5{padding:calc(var(--spacing) * 2.5)}.p-3{padding:calc(var(--spacing) * 3)}.p-3\.5{padding:calc(var(--spacing) * 3.5)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.p-12{padding:calc(var(--spacing) * 12)}.px-0\.5{padding-inline:calc(var(--spacing) * .5)}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-5{padding-block:calc(var(--spacing) * 5)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-16{padding-block:calc(var(--spacing) * 16)}.py-24{padding-block:calc(var(--spacing) * 24)}.pt-0{padding-top:0}.pt-0\.5{padding-top:calc(var(--spacing) * .5)}.pt-1{padding-top:var(--spacing)}.pt-1\.5{padding-top:calc(var(--spacing) * 1.5)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-2\.5{padding-top:calc(var(--spacing) * 2.5)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-3\.5{padding-top:calc(var(--spacing) * 3.5)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-20{padding-top:calc(var(--spacing) * 20)}.pr-0\.5{padding-right:calc(var(--spacing) * .5)}.pr-1{padding-right:var(--spacing)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-2\.5{padding-right:calc(var(--spacing) * 2.5)}.pr-3{padding-right:calc(var(--spacing) * 3)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-5{padding-right:calc(var(--spacing) * 5)}.pr-7{padding-right:calc(var(--spacing) * 7)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-0\.5{padding-bottom:calc(var(--spacing) * .5)}.pb-1{padding-bottom:var(--spacing)}.pb-1\.5{padding-bottom:calc(var(--spacing) * 1.5)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-2\.5{padding-bottom:calc(var(--spacing) * 2.5)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-3\.5{padding-bottom:calc(var(--spacing) * 3.5)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-6{padding-bottom:calc(var(--spacing) * 6)}.pb-10{padding-bottom:calc(var(--spacing) * 10)}.pb-12{padding-bottom:calc(var(--spacing) * 12)}.pb-14{padding-bottom:calc(var(--spacing) * 14)}.pb-16{padding-bottom:calc(var(--spacing) * 16)}.pb-20{padding-bottom:calc(var(--spacing) * 20)}.pb-28{padding-bottom:calc(var(--spacing) * 28)}.pl-1{padding-left:var(--spacing)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-2\.5{padding-left:calc(var(--spacing) * 2.5)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-5{padding-left:calc(var(--spacing) * 5)}.pl-6{padding-left:calc(var(--spacing) * 6)}.pl-7{padding-left:calc(var(--spacing) * 7)}.pl-7\.5{padding-left:calc(var(--spacing) * 7.5)}.pl-8{padding-left:calc(var(--spacing) * 8)}.pl-8\.5{padding-left:calc(var(--spacing) * 8.5)}.pl-9{padding-left:calc(var(--spacing) * 9)}.pl-10{padding-left:calc(var(--spacing) * 10)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.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-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--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}.text-\[11px\]{font-size:11px}.leading-none{--tw-leading:1;line-height:1}.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)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-line{white-space:pre-line}.text-\[\#1e293b\]{color:#1e293b}.text-\[\#2d251e\]{color:#2d251e}.text-\[\#cbd5e1\]{color:#cbd5e1}.text-\[\#d1d5db\]{color:#d1d5db}.text-accent-foreground{color:var(--color-accent-foreground)}.text-amber-200{color:var(--color-amber-200)}.text-amber-300{color:var(--color-amber-300)}.text-amber-400{color:var(--color-amber-400)}.text-amber-500{color:var(--color-amber-500)}.text-amber-600{color:var(--color-amber-600)}.text-amber-700{color:var(--color-amber-700)}.text-amber-800{color:var(--color-amber-800)}.text-blue-400{color:var(--color-blue-400)}.text-blue-500{color:var(--color-blue-500)}.text-border,.text-border\/60{color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.text-border\/60{color:color-mix(in oklab, var(--color-border) 60%, transparent)}}.text-cyan-700{color:var(--color-cyan-700)}.text-destructive{color:var(--color-destructive)}.text-emerald-400{color:var(--color-emerald-400)}.text-emerald-500{color:var(--color-emerald-500)}.text-emerald-600{color:var(--color-emerald-600)}.text-foreground,.text-foreground\/75{color:var(--color-foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/75{color:color-mix(in oklab, var(--color-foreground) 75%, transparent)}}.text-foreground\/80{color:var(--color-foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/80{color:color-mix(in oklab, var(--color-foreground) 80%, transparent)}}.text-foreground\/90{color:var(--color-foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/90{color:color-mix(in oklab, var(--color-foreground) 90%, transparent)}}.text-indigo-400{color:var(--color-indigo-400)}.text-indigo-400\/60{color:#7d87ff99}@supports (color:color-mix(in lab, red, red)){.text-indigo-400\/60{color:color-mix(in oklab, var(--color-indigo-400) 60%, transparent)}}.text-indigo-400\/70{color:#7d87ffb3}@supports (color:color-mix(in lab, red, red)){.text-indigo-400\/70{color:color-mix(in oklab, var(--color-indigo-400) 70%, transparent)}}.text-indigo-500{color:var(--color-indigo-500)}.text-indigo-600{color:var(--color-indigo-600)}.text-indigo-700{color:var(--color-indigo-700)}.text-inherit{color:inherit}.text-muted-foreground,.text-muted-foreground\/30{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/30{color:color-mix(in oklab, var(--color-muted-foreground) 30%, transparent)}}.text-muted-foreground\/40{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/40{color:color-mix(in oklab, var(--color-muted-foreground) 40%, transparent)}}.text-muted-foreground\/50{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/50{color:color-mix(in oklab, var(--color-muted-foreground) 50%, transparent)}}.text-muted-foreground\/60{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/60{color:color-mix(in oklab, var(--color-muted-foreground) 60%, transparent)}}.text-muted-foreground\/70{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/70{color:color-mix(in oklab, var(--color-muted-foreground) 70%, transparent)}}.text-muted-foreground\/75{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/75{color:color-mix(in oklab, var(--color-muted-foreground) 75%, transparent)}}.text-muted-foreground\/80{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.text-muted-foreground\/80{color:color-mix(in oklab, var(--color-muted-foreground) 80%, transparent)}}.text-orange-500{color:var(--color-orange-500)}.text-pink-400{color:var(--color-pink-400)}.text-pink-500{color:var(--color-pink-500)}.text-primary{color:var(--color-primary)}.text-primary-foreground{color:var(--color-primary-foreground)}.text-primary\/60{color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.text-primary\/60{color:color-mix(in oklab, var(--color-primary) 60%, transparent)}}.text-primary\/70{color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.text-primary\/70{color:color-mix(in oklab, var(--color-primary) 70%, transparent)}}.text-primary\/75{color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.text-primary\/75{color:color-mix(in oklab, var(--color-primary) 75%, transparent)}}.text-primary\/80{color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.text-primary\/80{color:color-mix(in oklab, var(--color-primary) 80%, transparent)}}.text-primary\/85{color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.text-primary\/85{color:color-mix(in oklab, var(--color-primary) 85%, transparent)}}.text-primary\/90{color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.text-primary\/90{color:color-mix(in oklab, var(--color-primary) 90%, transparent)}}.text-purple-300{color:var(--color-purple-300)}.text-purple-400{color:var(--color-purple-400)}.text-purple-500{color:var(--color-purple-500)}.text-red-500{color:var(--color-red-500)}.text-rose-400{color:var(--color-rose-400)}.text-rose-500{color:var(--color-rose-500)}.text-rose-600{color:var(--color-rose-600)}.text-rose-700{color:var(--color-rose-700)}.text-secondary{color:var(--color-secondary)}.text-sky-400{color:var(--color-sky-400)}.text-sky-600{color:var(--color-sky-600)}.text-slate-400{color:var(--color-slate-400)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-slate-950{color:var(--color-slate-950)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.italic{font-style:italic}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.accent-primary{accent-color:var(--color-primary)}.opacity-0{opacity:0}.opacity-20{opacity:.2}.opacity-25{opacity:.25}.opacity-30{opacity:.3}.opacity-40{opacity:.4}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.opacity-80{opacity:.8}.opacity-90{opacity:.9}.opacity-100{opacity:1}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px 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)}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-2xs{--tw-shadow:0 1px 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-\[0_0_10px_rgba\(52\,211\,153\,0\.4\)\]{--tw-shadow:0 0 10px var(--tw-shadow-color,#34d39966);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_12px_rgba\(52\,211\,153\,0\.5\)\]{--tw-shadow:0 0 12px var(--tw-shadow-color,#34d39980);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_12px_rgba\(99\,102\,241\,0\.5\)\]{--tw-shadow:0 0 12px var(--tw-shadow-color,#6366f180);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_12px_rgba\(254\,240\,138\,0\.5\)\]{--tw-shadow:0 0 12px var(--tw-shadow-color,#fef08a80);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_15px_rgba\(56\,189\,248\,0\.5\)\]{--tw-shadow:0 0 15px var(--tw-shadow-color,#38bdf880);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_15px_rgba\(79\,70\,229\,0\.5\)\]{--tw-shadow:0 0 15px var(--tw-shadow-color,#4f46e580);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_15px_rgba\(168\,85\,247\,0\.5\)\]{--tw-shadow:0 0 15px var(--tw-shadow-color,#a855f780);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_15px_rgba\(251\,191\,36\,0\.6\)\]{--tw-shadow:0 0 15px var(--tw-shadow-color,#fbbf2499);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_16px_rgba\(56\,189\,248\,0\.5\)\]{--tw-shadow:0 0 16px var(--tw-shadow-color,#38bdf880);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_20px_rgba\(168\,85\,247\,0\.6\)\]{--tw-shadow:0 0 20px var(--tw-shadow-color,#a855f799);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_20px_rgba\(251\,191\,36\,0\.3\)\]{--tw-shadow:0 0 20px var(--tw-shadow-color,#fbbf244d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_20px_rgba\(251\,191\,36\,0\.6\)\]{--tw-shadow:0 0 20px var(--tw-shadow-color,#fbbf2499);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_25px_rgba\(251\,191\,36\,0\.2\)\]{--tw-shadow:0 0 25px var(--tw-shadow-color,#fbbf2433);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_50px_rgba\(244\,63\,94\,0\.15\)\]{--tw-shadow:0 0 50px var(--tw-shadow-color,#f43f5e26);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_8px_30px_-4px_rgba\(0\,0\,0\,0\.25\)\]{--tw-shadow:0 8px 30px -4px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_12px_24px_-6px_rgba\(0\,0\,0\,0\.6\)\]{--tw-shadow:0 12px 24px -6px var(--tw-shadow-color,#0009);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_20px_35px_-8px_rgba\(0\,0\,0\,0\.7\)\,0_0_20px_rgba\(245\,158\,11\,0\.28\)\]{--tw-shadow:0 20px 35px -8px var(--tw-shadow-color,#000000b3), 0 0 20px var(--tw-shadow-color,#f59e0b47);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.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)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px 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)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px 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)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px 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)}.shadow-xs{--tw-shadow:0 1px 2px 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)}.ring-1{--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)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + 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)}.ring-3{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + 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)}.ring-4{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + 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)}.shadow-primary\/20{--tw-shadow-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.shadow-primary\/20{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-primary) 20%, transparent) var(--tw-shadow-alpha), transparent)}}.shadow-rose-600\/25{--tw-shadow-color:#e7004440}@supports (color:color-mix(in lab, red, red)){.shadow-rose-600\/25{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-rose-600) 25%, transparent) var(--tw-shadow-alpha), transparent)}}.ring-amber-400{--tw-ring-color:var(--color-amber-400)}.ring-amber-400\/70{--tw-ring-color:#fcbb00b3}@supports (color:color-mix(in lab, red, red)){.ring-amber-400\/70{--tw-ring-color:color-mix(in oklab, var(--color-amber-400) 70%, transparent)}}.ring-amber-500\/30{--tw-ring-color:#f99c004d}@supports (color:color-mix(in lab, red, red)){.ring-amber-500\/30{--tw-ring-color:color-mix(in oklab, var(--color-amber-500) 30%, transparent)}}.ring-amber-700\/20{--tw-ring-color:#b7500033}@supports (color:color-mix(in lab, red, red)){.ring-amber-700\/20{--tw-ring-color:color-mix(in oklab, var(--color-amber-700) 20%, transparent)}}.ring-border\/50{--tw-ring-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.ring-border\/50{--tw-ring-color:color-mix(in oklab, var(--color-border) 50%, transparent)}}.ring-emerald-400{--tw-ring-color:var(--color-emerald-400)}.ring-indigo-400\/40{--tw-ring-color:#7d87ff66}@supports (color:color-mix(in lab, red, red)){.ring-indigo-400\/40{--tw-ring-color:color-mix(in oklab, var(--color-indigo-400) 40%, transparent)}}.ring-indigo-600{--tw-ring-color:var(--color-indigo-600)}.ring-pink-500\/30{--tw-ring-color:#f6339a4d}@supports (color:color-mix(in lab, red, red)){.ring-pink-500\/30{--tw-ring-color:color-mix(in oklab, var(--color-pink-500) 30%, transparent)}}.ring-primary,.ring-primary\/20{--tw-ring-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.ring-primary\/20{--tw-ring-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.ring-purple-500{--tw-ring-color:var(--color-purple-500)}.ring-sky-400{--tw-ring-color:var(--color-sky-400)}.ring-slate-400\/20{--tw-ring-color:#90a1b933}@supports (color:color-mix(in lab, red, red)){.ring-slate-400\/20{--tw-ring-color:color-mix(in oklab, var(--color-slate-400) 20%, transparent)}}.ring-offset-2{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.ring-offset-background{--tw-ring-offset-color:var(--color-background)}.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-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,)}.blur-sm{--tw-blur:blur(var(--blur-sm));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-xl{--tw-blur:blur(var(--blur-xl));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{--tw-drop-shadow-size:drop-shadow(0 1px 2px var(--tw-drop-shadow-color,#0000001a)) drop-shadow(0 1px 1px var(--tw-drop-shadow-color,#0000000f));--tw-drop-shadow:drop-shadow(0 1px 2px #0000001a) drop-shadow(0 1px 1px #0000000f);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-sm{--tw-drop-shadow-size:drop-shadow(0 1px 2px var(--tw-drop-shadow-color,#00000026));--tw-drop-shadow:drop-shadow(var(--drop-shadow-sm));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,)}.sepia{--tw-sepia:sepia(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,)}.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,)}.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,)!important}.backdrop-blur-2xl{--tw-backdrop-blur:blur(var(--blur-2xl));-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-lg{--tw-backdrop-blur:blur(var(--blur-lg));-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-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-sm{--tw-backdrop-blur:blur(var(--blur-sm));-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,)}.backdrop-blur-xs{--tw-backdrop-blur:blur(var(--blur-xs));-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-all{transition-property:all;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-opacity{transition-property:opacity;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-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.duration-500{--tw-duration:.5s;transition-duration:.5s}.duration-700{--tw-duration:.7s;transition-duration:.7s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.select-none{-webkit-user-select:none;user-select:none}.\[perspective\:1000px\]{perspective:1000px}.\[transform-style\:preserve-3d\]{transform-style:preserve-3d}@media (hover:hover){.group-hover\:-translate-x-0\.5:is(:where(.group):hover *){--tw-translate-x:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\:translate-x-0\.5:is(:where(.group):hover *){--tw-translate-x:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-hover\:scale-104:is(:where(.group):hover *){--tw-scale-x:104%;--tw-scale-y:104%;--tw-scale-z:104%;scale:var(--tw-scale-x) var(--tw-scale-y)}.group-hover\:scale-105:is(:where(.group):hover *){--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x) var(--tw-scale-y)}.group-hover\:scale-110:is(:where(.group):hover *){--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.group-hover\:border-primary:is(:where(.group):hover *),.group-hover\:border-primary\/50:is(:where(.group):hover *){border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.group-hover\:border-primary\/50:is(:where(.group):hover *){border-color:color-mix(in oklab, var(--color-primary) 50%, transparent)}}.group-hover\:bg-card\/90:is(:where(.group):hover *){background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.group-hover\:bg-card\/90:is(:where(.group):hover *){background-color:color-mix(in oklab, var(--color-card) 90%, transparent)}}.group-hover\:bg-primary\/15:is(:where(.group):hover *){background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.group-hover\:bg-primary\/15:is(:where(.group):hover *){background-color:color-mix(in oklab, var(--color-primary) 15%, transparent)}}.group-hover\:text-amber-600:is(:where(.group):hover *){color:var(--color-amber-600)}.group-hover\:text-emerald-400:is(:where(.group):hover *){color:var(--color-emerald-400)}.group-hover\:text-foreground:is(:where(.group):hover *){color:var(--color-foreground)}.group-hover\:text-indigo-400:is(:where(.group):hover *){color:var(--color-indigo-400)}.group-hover\:text-primary:is(:where(.group):hover *){color:var(--color-primary)}.group-hover\:opacity-100:is(:where(.group):hover *),.group-hover\/carousel\:opacity-100:is(:where(.group\/carousel):hover *),.group-hover\/cover\:opacity-100:is(:where(.group\/cover):hover *),.group-hover\/rail\:opacity-100:is(:where(.group\/rail):hover *){opacity:1}}.selection\:bg-amber-400\/30 ::selection{background-color:#fcbb004d}@supports (color:color-mix(in lab, red, red)){.selection\:bg-amber-400\/30 ::selection{background-color:color-mix(in oklab, var(--color-amber-400) 30%, transparent)}}.selection\:bg-amber-400\/30::selection{background-color:#fcbb004d}@supports (color:color-mix(in lab, red, red)){.selection\:bg-amber-400\/30::selection{background-color:color-mix(in oklab, var(--color-amber-400) 30%, transparent)}}.selection\:text-amber-200 ::selection{color:var(--color-amber-200)}.selection\:text-amber-200::selection{color:var(--color-amber-200)}.placeholder\:font-normal::placeholder{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.placeholder\:text-muted-foreground::placeholder,.placeholder\:text-muted-foreground\/60::placeholder{color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.placeholder\:text-muted-foreground\/60::placeholder{color:color-mix(in oklab, var(--color-muted-foreground) 60%, transparent)}}.placeholder\:normal-case::placeholder{text-transform:none}.focus-within\:border-primary\/60:focus-within{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.focus-within\:border-primary\/60:focus-within{border-color:color-mix(in oklab, var(--color-primary) 60%, transparent)}}@media (hover:hover){.hover\:scale-102:hover{--tw-scale-x:102%;--tw-scale-y:102%;--tw-scale-z:102%;scale:var(--tw-scale-x) var(--tw-scale-y)}.hover\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x) var(--tw-scale-y)}.hover\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.hover\:border-amber-400:hover{border-color:var(--color-amber-400)}.hover\:border-amber-400\/50:hover{border-color:#fcbb0080}@supports (color:color-mix(in lab, red, red)){.hover\:border-amber-400\/50:hover{border-color:color-mix(in oklab, var(--color-amber-400) 50%, transparent)}}.hover\:border-amber-500\/30:hover{border-color:#f99c004d}@supports (color:color-mix(in lab, red, red)){.hover\:border-amber-500\/30:hover{border-color:color-mix(in oklab, var(--color-amber-500) 30%, transparent)}}.hover\:border-amber-500\/40:hover{border-color:#f99c0066}@supports (color:color-mix(in lab, red, red)){.hover\:border-amber-500\/40:hover{border-color:color-mix(in oklab, var(--color-amber-500) 40%, transparent)}}.hover\:border-amber-500\/50:hover{border-color:#f99c0080}@supports (color:color-mix(in lab, red, red)){.hover\:border-amber-500\/50:hover{border-color:color-mix(in oklab, var(--color-amber-500) 50%, transparent)}}.hover\:border-amber-700\/60:hover{border-color:#b7500099}@supports (color:color-mix(in lab, red, red)){.hover\:border-amber-700\/60:hover{border-color:color-mix(in oklab, var(--color-amber-700) 60%, transparent)}}.hover\:border-blue-400\/50:hover{border-color:#54a2ff80}@supports (color:color-mix(in lab, red, red)){.hover\:border-blue-400\/50:hover{border-color:color-mix(in oklab, var(--color-blue-400) 50%, transparent)}}.hover\:border-border:hover,.hover\:border-border\/60:hover{border-color:var(--color-border)}@supports (color:color-mix(in lab, red, red)){.hover\:border-border\/60:hover{border-color:color-mix(in oklab, var(--color-border) 60%, transparent)}}.hover\:border-destructive\/40:hover{border-color:var(--color-destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:border-destructive\/40:hover{border-color:color-mix(in oklab, var(--color-destructive) 40%, transparent)}}.hover\:border-emerald-400\/50:hover{border-color:#00d29480}@supports (color:color-mix(in lab, red, red)){.hover\:border-emerald-400\/50:hover{border-color:color-mix(in oklab, var(--color-emerald-400) 50%, transparent)}}.hover\:border-emerald-500\/30:hover{border-color:#00bb7f4d}@supports (color:color-mix(in lab, red, red)){.hover\:border-emerald-500\/30:hover{border-color:color-mix(in oklab, var(--color-emerald-500) 30%, transparent)}}.hover\:border-emerald-500\/40:hover{border-color:#00bb7f66}@supports (color:color-mix(in lab, red, red)){.hover\:border-emerald-500\/40:hover{border-color:color-mix(in oklab, var(--color-emerald-500) 40%, transparent)}}.hover\:border-indigo-400\/50:hover{border-color:#7d87ff80}@supports (color:color-mix(in lab, red, red)){.hover\:border-indigo-400\/50:hover{border-color:color-mix(in oklab, var(--color-indigo-400) 50%, transparent)}}.hover\:border-indigo-500\/40:hover{border-color:#625fff66}@supports (color:color-mix(in lab, red, red)){.hover\:border-indigo-500\/40:hover{border-color:color-mix(in oklab, var(--color-indigo-500) 40%, transparent)}}.hover\:border-indigo-500\/60:hover{border-color:#625fff99}@supports (color:color-mix(in lab, red, red)){.hover\:border-indigo-500\/60:hover{border-color:color-mix(in oklab, var(--color-indigo-500) 60%, transparent)}}.hover\:border-orange-400\/50:hover{border-color:#ff8b1a80}@supports (color:color-mix(in lab, red, red)){.hover\:border-orange-400\/50:hover{border-color:color-mix(in oklab, var(--color-orange-400) 50%, transparent)}}.hover\:border-pink-400\/50:hover{border-color:#fb64b680}@supports (color:color-mix(in lab, red, red)){.hover\:border-pink-400\/50:hover{border-color:color-mix(in oklab, var(--color-pink-400) 50%, transparent)}}.hover\:border-primary\/30:hover{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:border-primary\/30:hover{border-color:color-mix(in oklab, var(--color-primary) 30%, transparent)}}.hover\:border-primary\/40:hover{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:border-primary\/40:hover{border-color:color-mix(in oklab, var(--color-primary) 40%, transparent)}}.hover\:border-primary\/50:hover{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:border-primary\/50:hover{border-color:color-mix(in oklab, var(--color-primary) 50%, transparent)}}.hover\:border-primary\/60:hover{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:border-primary\/60:hover{border-color:color-mix(in oklab, var(--color-primary) 60%, transparent)}}.hover\:border-purple-400\/50:hover{border-color:#c07eff80}@supports (color:color-mix(in lab, red, red)){.hover\:border-purple-400\/50:hover{border-color:color-mix(in oklab, var(--color-purple-400) 50%, transparent)}}.hover\:border-red-400\/50:hover{border-color:#ff656880}@supports (color:color-mix(in lab, red, red)){.hover\:border-red-400\/50:hover{border-color:color-mix(in oklab, var(--color-red-400) 50%, transparent)}}.hover\:border-rose-400\/50:hover{border-color:#ff667f80}@supports (color:color-mix(in lab, red, red)){.hover\:border-rose-400\/50:hover{border-color:color-mix(in oklab, var(--color-rose-400) 50%, transparent)}}.hover\:border-rose-500\/30:hover{border-color:#ff23574d}@supports (color:color-mix(in lab, red, red)){.hover\:border-rose-500\/30:hover{border-color:color-mix(in oklab, var(--color-rose-500) 30%, transparent)}}.hover\:border-rose-500\/50:hover{border-color:#ff235780}@supports (color:color-mix(in lab, red, red)){.hover\:border-rose-500\/50:hover{border-color:color-mix(in oklab, var(--color-rose-500) 50%, transparent)}}.hover\:border-sky-500\/30:hover{border-color:#00a5ef4d}@supports (color:color-mix(in lab, red, red)){.hover\:border-sky-500\/30:hover{border-color:color-mix(in oklab, var(--color-sky-500) 30%, transparent)}}.hover\:border-slate-400:hover{border-color:var(--color-slate-400)}.hover\:border-slate-500\/30:hover{border-color:#62748e4d}@supports (color:color-mix(in lab, red, red)){.hover\:border-slate-500\/30:hover{border-color:color-mix(in oklab, var(--color-slate-500) 30%, transparent)}}.hover\:bg-amber-400:hover{background-color:var(--color-amber-400)}.hover\:bg-amber-500:hover{background-color:var(--color-amber-500)}.hover\:bg-amber-500\/5:hover{background-color:#f99c000d}@supports (color:color-mix(in lab, red, red)){.hover\:bg-amber-500\/5:hover{background-color:color-mix(in oklab, var(--color-amber-500) 5%, transparent)}}.hover\:bg-amber-500\/10:hover{background-color:#f99c001a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-amber-500\/10:hover{background-color:color-mix(in oklab, var(--color-amber-500) 10%, transparent)}}.hover\:bg-amber-500\/20:hover{background-color:#f99c0033}@supports (color:color-mix(in lab, red, red)){.hover\:bg-amber-500\/20:hover{background-color:color-mix(in oklab, var(--color-amber-500) 20%, transparent)}}.hover\:bg-amber-500\/25:hover{background-color:#f99c0040}@supports (color:color-mix(in lab, red, red)){.hover\:bg-amber-500\/25:hover{background-color:color-mix(in oklab, var(--color-amber-500) 25%, transparent)}}.hover\:bg-background:hover{background-color:var(--color-background)}.hover\:bg-card:hover,.hover\:bg-card\/40:hover{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-card\/40:hover{background-color:color-mix(in oklab, var(--color-card) 40%, transparent)}}.hover\:bg-card\/60:hover{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-card\/60:hover{background-color:color-mix(in oklab, var(--color-card) 60%, transparent)}}.hover\:bg-card\/70:hover{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-card\/70:hover{background-color:color-mix(in oklab, var(--color-card) 70%, transparent)}}.hover\:bg-card\/80:hover{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-card\/80:hover{background-color:color-mix(in oklab, var(--color-card) 80%, transparent)}}.hover\:bg-destructive\/10:hover{background-color:var(--color-destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/10:hover{background-color:color-mix(in oklab, var(--color-destructive) 10%, transparent)}}.hover\:bg-destructive\/20:hover{background-color:var(--color-destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/20:hover{background-color:color-mix(in oklab, var(--color-destructive) 20%, transparent)}}.hover\:bg-emerald-500\/10:hover{background-color:#00bb7f1a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-emerald-500\/10:hover{background-color:color-mix(in oklab, var(--color-emerald-500) 10%, transparent)}}.hover\:bg-emerald-500\/20:hover{background-color:#00bb7f33}@supports (color:color-mix(in lab, red, red)){.hover\:bg-emerald-500\/20:hover{background-color:color-mix(in oklab, var(--color-emerald-500) 20%, transparent)}}.hover\:bg-emerald-700:hover{background-color:var(--color-emerald-700)}.hover\:bg-indigo-500\/10:hover{background-color:#625fff1a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-500\/10:hover{background-color:color-mix(in oklab, var(--color-indigo-500) 10%, transparent)}}.hover\:bg-indigo-500\/20:hover{background-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.hover\:bg-indigo-500\/20:hover{background-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.hover\:bg-indigo-700:hover{background-color:var(--color-indigo-700)}.hover\:bg-muted:hover{background-color:var(--color-muted)}.hover\:bg-muted-foreground\/50:hover{background-color:var(--color-muted-foreground)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted-foreground\/50:hover{background-color:color-mix(in oklab, var(--color-muted-foreground) 50%, transparent)}}.hover\:bg-muted\/40:hover{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/40:hover{background-color:color-mix(in oklab, var(--color-muted) 40%, transparent)}}.hover\:bg-muted\/50:hover{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/50:hover{background-color:color-mix(in oklab, var(--color-muted) 50%, transparent)}}.hover\:bg-muted\/60:hover{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/60:hover{background-color:color-mix(in oklab, var(--color-muted) 60%, transparent)}}.hover\:bg-muted\/70:hover{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/70:hover{background-color:color-mix(in oklab, var(--color-muted) 70%, transparent)}}.hover\:bg-muted\/80:hover{background-color:var(--color-muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/80:hover{background-color:color-mix(in oklab, var(--color-muted) 80%, transparent)}}.hover\:bg-primary:hover{background-color:var(--color-primary)}.hover\:bg-primary-hover:hover{background-color:var(--color-primary-hover)}.hover\:bg-primary\/10:hover{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/10:hover{background-color:color-mix(in oklab, var(--color-primary) 10%, transparent)}}.hover\:bg-primary\/15:hover{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/15:hover{background-color:color-mix(in oklab, var(--color-primary) 15%, transparent)}}.hover\:bg-primary\/20:hover{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/20:hover{background-color:color-mix(in oklab, var(--color-primary) 20%, transparent)}}.hover\:bg-primary\/25:hover{background-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/25:hover{background-color:color-mix(in oklab, var(--color-primary) 25%, transparent)}}.hover\:bg-rose-500\/10:hover{background-color:#ff23571a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-rose-500\/10:hover{background-color:color-mix(in oklab, var(--color-rose-500) 10%, transparent)}}.hover\:bg-rose-500\/20:hover{background-color:#ff235733}@supports (color:color-mix(in lab, red, red)){.hover\:bg-rose-500\/20:hover{background-color:color-mix(in oklab, var(--color-rose-500) 20%, transparent)}}.hover\:bg-rose-600:hover{background-color:var(--color-rose-600)}.hover\:bg-sky-500\/10:hover{background-color:#00a5ef1a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-sky-500\/10:hover{background-color:color-mix(in oklab, var(--color-sky-500) 10%, transparent)}}.hover\:bg-slate-500\/10:hover{background-color:#62748e1a}@supports (color:color-mix(in lab, red, red)){.hover\:bg-slate-500\/10:hover{background-color:color-mix(in oklab, var(--color-slate-500) 10%, transparent)}}.hover\:from-rose-500:hover{--tw-gradient-from:var(--color-rose-500);--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))}.hover\:to-rose-400:hover{--tw-gradient-to:var(--color-rose-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))}.hover\:text-amber-500:hover{color:var(--color-amber-500)}.hover\:text-amber-600:hover{color:var(--color-amber-600)}.hover\:text-black:hover{color:var(--color-black)}.hover\:text-blue-500:hover{color:var(--color-blue-500)}.hover\:text-destructive:hover{color:var(--color-destructive)}.hover\:text-emerald-400:hover{color:var(--color-emerald-400)}.hover\:text-emerald-500:hover{color:var(--color-emerald-500)}.hover\:text-foreground:hover{color:var(--color-foreground)}.hover\:text-indigo-300:hover{color:var(--color-indigo-300)}.hover\:text-indigo-400:hover{color:var(--color-indigo-400)}.hover\:text-indigo-500:hover{color:var(--color-indigo-500)}.hover\:text-orange-500:hover{color:var(--color-orange-500)}.hover\:text-pink-500:hover{color:var(--color-pink-500)}.hover\:text-primary:hover{color:var(--color-primary)}.hover\:text-primary-foreground:hover{color:var(--color-primary-foreground)}.hover\:text-primary-hover:hover{color:var(--color-primary-hover)}.hover\:text-purple-500:hover{color:var(--color-purple-500)}.hover\:text-red-500:hover{color:var(--color-red-500)}.hover\:text-rose-300:hover{color:var(--color-rose-300)}.hover\:text-rose-400:hover{color:var(--color-rose-400)}.hover\:text-rose-500:hover{color:var(--color-rose-500)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-70:hover{opacity:.7}.hover\:opacity-80:hover{opacity:.8}.hover\:opacity-90:hover{opacity:.9}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px 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)}.hover\:shadow-xs:hover{--tw-shadow:0 1px 2px 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)}.hover\:ring-2:hover{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + 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)}.hover\:ring-primary\/60:hover{--tw-ring-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.hover\:ring-primary\/60:hover{--tw-ring-color:color-mix(in oklab, var(--color-primary) 60%, transparent)}}.hover\:brightness-110:hover{--tw-brightness:brightness(110%);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,)}}.focus\:border-primary:focus,.focus\:border-primary\/60:focus{border-color:var(--color-primary)}@supports (color:color-mix(in lab, red, red)){.focus\:border-primary\/60:focus{border-color:color-mix(in oklab, var(--color-primary) 60%, transparent)}}.focus\:border-rose-400:focus{border-color:var(--color-rose-400)}.focus\:bg-card\/70:focus{background-color:var(--color-card)}@supports (color:color-mix(in lab, red, red)){.focus\:bg-card\/70:focus{background-color:color-mix(in oklab, var(--color-card) 70%, transparent)}}.focus\:ring-0:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + 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)}.focus\:ring-1: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)}.focus\:ring-primary:focus{--tw-ring-color:var(--color-primary)}.focus\:outline-hidden:focus{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.focus\:outline-hidden:focus{outline-offset:2px;outline:2px solid #0000}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}@media (hover:hover){.disabled\:hover\:bg-transparent:disabled:hover{background-color:#0000}}@media (width>=380px){.min-\[380px\]\:inline{display:inline}}@media (width>=480px){.xs\:hidden{display:none}.xs\:inline{display:inline}.xs\:w-32{width:calc(var(--spacing) * 32)}.xs\:w-40{width:calc(var(--spacing) * 40)}.xs\:max-w-none{max-width:none}.xs\:min-w-\[130px\]{min-width:130px}}@media (width>=40rem){.sm\:not-sr-only{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.sm\:top-4{top:calc(var(--spacing) * 4)}.sm\:right-5{right:calc(var(--spacing) * 5)}.sm\:right-6{right:calc(var(--spacing) * 6)}.sm\:bottom-6{bottom:calc(var(--spacing) * 6)}.sm\:left-3{left:calc(var(--spacing) * 3)}.sm\:left-4{left:calc(var(--spacing) * 4)}.sm\:left-5{left:calc(var(--spacing) * 5)}.sm\:order-1{order:1}.sm\:order-2{order:2}.sm\:col-span-2{grid-column:span 2/span 2}.sm\:mx-0{margin-inline:0}.sm\:my-8{margin-block:calc(var(--spacing) * 8)}.sm\:-mt-10{margin-top:calc(var(--spacing) * -10)}.sm\:-mt-16{margin-top:calc(var(--spacing) * -16)}.sm\:-mt-20{margin-top:calc(var(--spacing) * -20)}.sm\:mt-0{margin-top:0}.sm\:mt-10{margin-top:calc(var(--spacing) * 10)}.sm\:mt-14{margin-top:calc(var(--spacing) * 14)}.sm\:mb-3\.5{margin-bottom:calc(var(--spacing) * 3.5)}.sm\:mb-5{margin-bottom:calc(var(--spacing) * 5)}.sm\:mb-6{margin-bottom:calc(var(--spacing) * 6)}.sm\:ml-0{margin-left:0}.sm\:line-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.sm\:line-clamp-5{-webkit-line-clamp:5;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.sm\:block{display:block}.sm\:flex{display:flex}.sm\:hidden{display:none}.sm\:inline{display:inline}.sm\:inline-block{display:inline-block}.sm\:h-2\.5{height:calc(var(--spacing) * 2.5)}.sm\:h-3\.5{height:calc(var(--spacing) * 3.5)}.sm\:h-4{height:calc(var(--spacing) * 4)}.sm\:h-5{height:calc(var(--spacing) * 5)}.sm\:h-6{height:calc(var(--spacing) * 6)}.sm\:h-6\.5{height:calc(var(--spacing) * 6.5)}.sm\:h-7{height:calc(var(--spacing) * 7)}.sm\:h-9{height:calc(var(--spacing) * 9)}.sm\:h-10{height:calc(var(--spacing) * 10)}.sm\:h-11{height:calc(var(--spacing) * 11)}.sm\:h-12{height:calc(var(--spacing) * 12)}.sm\:h-14{height:calc(var(--spacing) * 14)}.sm\:h-20{height:calc(var(--spacing) * 20)}.sm\:h-22{height:calc(var(--spacing) * 22)}.sm\:h-28{height:calc(var(--spacing) * 28)}.sm\:h-32{height:calc(var(--spacing) * 32)}.sm\:h-48{height:calc(var(--spacing) * 48)}.sm\:h-52{height:calc(var(--spacing) * 52)}.sm\:h-60{height:calc(var(--spacing) * 60)}.sm\:max-h-\[82vh\]{max-height:82vh}.sm\:w-2\.5{width:calc(var(--spacing) * 2.5)}.sm\:w-3\.5{width:calc(var(--spacing) * 3.5)}.sm\:w-4{width:calc(var(--spacing) * 4)}.sm\:w-5{width:calc(var(--spacing) * 5)}.sm\:w-6{width:calc(var(--spacing) * 6)}.sm\:w-6\.5{width:calc(var(--spacing) * 6.5)}.sm\:w-7{width:calc(var(--spacing) * 7)}.sm\:w-9{width:calc(var(--spacing) * 9)}.sm\:w-10{width:calc(var(--spacing) * 10)}.sm\:w-11{width:calc(var(--spacing) * 11)}.sm\:w-12{width:calc(var(--spacing) * 12)}.sm\:w-14{width:calc(var(--spacing) * 14)}.sm\:w-16{width:calc(var(--spacing) * 16)}.sm\:w-20{width:calc(var(--spacing) * 20)}.sm\:w-28{width:calc(var(--spacing) * 28)}.sm\:w-32{width:calc(var(--spacing) * 32)}.sm\:w-34{width:calc(var(--spacing) * 34)}.sm\:w-36{width:calc(var(--spacing) * 36)}.sm\:w-40{width:calc(var(--spacing) * 40)}.sm\:w-44{width:calc(var(--spacing) * 44)}.sm\:w-64{width:calc(var(--spacing) * 64)}.sm\:w-72{width:calc(var(--spacing) * 72)}.sm\:w-96{width:calc(var(--spacing) * 96)}.sm\:w-auto{width:auto}.sm\:max-w-\[180px\]{max-width:180px}.sm\:max-w-\[200px\]{max-width:200px}.sm\:max-w-\[260px\]{max-width:260px}.sm\:max-w-md{max-width:var(--container-md)}.sm\:max-w-xs{max-width:var(--container-xs)}.sm\:flex-initial{flex:0 auto}.sm\:flex-none{flex:none}.sm\:-translate-y-3{--tw-translate-y:calc(var(--spacing) * -3);translate:var(--tw-translate-x) var(--tw-translate-y)}.sm\:scale-100{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y)}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.sm\:flex-col{flex-direction:column}.sm\:flex-row{flex-direction:row}.sm\:flex-nowrap{flex-wrap:nowrap}.sm\:items-center{align-items:center}.sm\:items-end{align-items:flex-end}.sm\:justify-center{justify-content:center}.sm\:justify-end{justify-content:flex-end}.sm\:justify-start{justify-content:flex-start}.sm\:gap-1{gap:var(--spacing)}.sm\:gap-1\.5{gap:calc(var(--spacing) * 1.5)}.sm\:gap-2{gap:calc(var(--spacing) * 2)}.sm\:gap-2\.5{gap:calc(var(--spacing) * 2.5)}.sm\:gap-3{gap:calc(var(--spacing) * 3)}.sm\:gap-3\.5{gap:calc(var(--spacing) * 3.5)}.sm\:gap-4{gap:calc(var(--spacing) * 4)}.sm\:gap-5{gap:calc(var(--spacing) * 5)}.sm\:gap-6{gap:calc(var(--spacing) * 6)}:where(.sm\:space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.sm\:space-y-3\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.sm\:space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.sm\:space-y-5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)))}:where(.sm\:space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.sm\:space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}.sm\:self-auto{align-self:auto}.sm\:self-end{align-self:flex-end}.sm\:rounded-2xl{border-radius:var(--radius-2xl)}.sm\:rounded-3xl{border-radius:var(--radius-3xl)}.sm\:rounded-\[14px\]{border-radius:14px}.sm\:rounded-xl{border-radius:var(--radius-xl)}.sm\:border-t-0{border-top-style:var(--tw-border-style);border-top-width:0}.sm\:border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.sm\:p-1\.5{padding:calc(var(--spacing) * 1.5)}.sm\:p-2{padding:calc(var(--spacing) * 2)}.sm\:p-2\.5{padding:calc(var(--spacing) * 2.5)}.sm\:p-3{padding:calc(var(--spacing) * 3)}.sm\:p-3\.5{padding:calc(var(--spacing) * 3.5)}.sm\:p-4{padding:calc(var(--spacing) * 4)}.sm\:p-5{padding:calc(var(--spacing) * 5)}.sm\:p-6{padding:calc(var(--spacing) * 6)}.sm\:p-7{padding:calc(var(--spacing) * 7)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.sm\:px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.sm\:px-3{padding-inline:calc(var(--spacing) * 3)}.sm\:px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.sm\:px-4{padding-inline:calc(var(--spacing) * 4)}.sm\:px-5{padding-inline:calc(var(--spacing) * 5)}.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:px-12{padding-inline:calc(var(--spacing) * 12)}.sm\:py-1{padding-block:var(--spacing)}.sm\:py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.sm\:py-2{padding-block:calc(var(--spacing) * 2)}.sm\:py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.sm\:py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.sm\:py-6{padding-block:calc(var(--spacing) * 6)}.sm\:py-7{padding-block:calc(var(--spacing) * 7)}.sm\:py-20{padding-block:calc(var(--spacing) * 20)}.sm\:pt-0{padding-top:0}.sm\:pr-8{padding-right:calc(var(--spacing) * 8)}.sm\:pb-4{padding-bottom:calc(var(--spacing) * 4)}.sm\:pb-14{padding-bottom:calc(var(--spacing) * 14)}.sm\:pb-16{padding-bottom:calc(var(--spacing) * 16)}.sm\:pl-3\.5{padding-left:calc(var(--spacing) * 3.5)}.sm\:pl-4{padding-left:calc(var(--spacing) * 4)}.sm\:pl-8\.5{padding-left:calc(var(--spacing) * 8.5)}.sm\:text-left{text-align:left}.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.sm\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.sm\:text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.sm\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.sm\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.sm\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.sm\:text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.sm\:text-\[10px\]{font-size:10px}.sm\:text-\[11px\]{font-size:11px}.sm\:text-\[13px\]{font-size:13px}}@media (width>=48rem){.md\:bottom-6{bottom:calc(var(--spacing) * 6)}.md\:col-span-4{grid-column:span 4/span 4}.md\:col-span-5{grid-column:span 5/span 5}.md\:col-span-7{grid-column:span 7/span 7}.md\:col-span-8{grid-column:span 8/span 8}.md\:col-span-12{grid-column:span 12/span 12}.md\:flex{display:flex}.md\:hidden{display:none}.md\:inline{display:inline}.md\:inline-block{display:inline-block}.md\:h-32{height:calc(var(--spacing) * 32)}.md\:h-36{height:calc(var(--spacing) * 36)}.md\:h-56{height:calc(var(--spacing) * 56)}.md\:w-44{width:calc(var(--spacing) * 44)}.md\:w-48{width:calc(var(--spacing) * 48)}.md\:w-64{width:calc(var(--spacing) * 64)}.md\:max-w-lg{max-width:var(--container-lg)}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:gap-6{gap:calc(var(--spacing) * 6)}:where(.md\:space-y-7>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 7) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 7) * calc(1 - var(--tw-space-y-reverse)))}:where(.md\:space-y-10>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)))}.md\:p-5{padding:calc(var(--spacing) * 5)}.md\:p-6{padding:calc(var(--spacing) * 6)}.md\:p-7{padding:calc(var(--spacing) * 7)}.md\:p-9{padding:calc(var(--spacing) * 9)}.md\:px-6{padding-inline:calc(var(--spacing) * 6)}.md\:px-8{padding-inline:calc(var(--spacing) * 8)}.md\:py-8{padding-block:calc(var(--spacing) * 8)}.md\:pb-4{padding-bottom:calc(var(--spacing) * 4)}.md\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.md\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.md\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.md\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}}@media (width>=64rem){.lg\:col-span-4{grid-column:span 4/span 4}.lg\:col-span-8{grid-column:span 8/span 8}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}.lg\:w-48{width:calc(var(--spacing) * 48)}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:gap-6{gap:calc(var(--spacing) * 6)}.lg\:px-8{padding-inline:calc(var(--spacing) * 8)}.lg\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}}@media (width>=80rem){.xl\:inline{display:inline}.xl\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xl\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.xl\:grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.xl\:gap-1{gap:var(--spacing)}.xl\:px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.xl\:px-3{padding-inline:calc(var(--spacing) * 3)}}@media (width>=96rem){.\32 xl\:inline{display:inline}}/* dark: utilities compiled for the app's class-based theme strategy (html.dark) instead of OS prefers-color-scheme */html.dark .dark\:bg-card-foreground{background-color:var(--color-card-foreground)}html.dark .dark\:fill-amber-400{fill:var(--color-amber-400)}html.dark .dark\:text-amber-200{color:var(--color-amber-200)}html.dark .dark\:text-amber-300{color:var(--color-amber-300)}html.dark .dark\:text-amber-400{color:var(--color-amber-400)}html.dark .dark\:text-cyan-400{color:var(--color-cyan-400)}html.dark .dark\:text-emerald-400{color:var(--color-emerald-400)}html.dark .dark\:text-indigo-300{color:var(--color-indigo-300)}html.dark .dark\:text-indigo-400{color:var(--color-indigo-400)}html.dark .dark\:text-rose-300{color:var(--color-rose-300)}html.dark .dark\:text-rose-400{color:var(--color-rose-400)}html.dark .dark\:text-sky-400{color:var(--color-sky-400)}html.dark .dark\:text-slate-200{color:var(--color-slate-200)}html.dark .dark\:text-slate-400{color:var(--color-slate-400)}html.dark @media (hover:hover){.dark\:group-hover\:text-amber-400:is(:where(.group):hover *),.dark\:hover\:text-amber-400:hover{color:var(--color-amber-400)}html.dark }html.dark .\[\&\:\:-webkit-inner-spin-button\]\:appearance-none::-webkit-inner-spin-button{appearance:none}.\[\&\:\:-webkit-outer-spin-button\]\:appearance-none::-webkit-outer-spin-button{appearance:none}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#94a3b840;border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:#fbbf2466}@keyframes twinkle{0%,to{opacity:.25;transform:scale(.95)}50%{opacity:.9;transform:scale(1.1)}}@keyframes floatSlow{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-8px)rotate(1deg)}}@keyframes poundPestle{0%{transform:translateY(-24px)rotate(-12deg)}45%{transform:translateY(8px)rotate(4deg)scaleY(.92)}55%{transform:translateY(8px)rotate(4deg)scaleY(.92)}to{transform:translateY(-24px)rotate(-12deg)}}@keyframes mochiSquish{0%,to{transform:scale(1)}50%{transform:scale(1.28,.65)}}@keyframes pulseGlow{0%,to{box-shadow:0 0 15px #fbbf2433}50%{box-shadow:0 0 30px #fbbf2473,0 0 10px #a78bfa4d}}@keyframes starlightShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-twinkle{animation:3s ease-in-out infinite twinkle}.animate-float{animation:5s ease-in-out infinite floatSlow}.animate-pound{transform-origin:30% 100%;animation:.75s ease-in-out infinite poundPestle}.animate-mochi{transform-origin:50% 100%;animation:.75s ease-in-out infinite mochiSquish}.animate-glow{animation:4s ease-in-out infinite pulseGlow}.shimmer-text{color:#0000;background:linear-gradient(90deg,#fbbf24 0%,#fff 50%,#fbbf24 100%) 0 0/200%;-webkit-background-clip:text;background-clip:text;animation:4s linear infinite starlightShimmer}.theme-light .shimmer-text{color:#0000;background:linear-gradient(90deg,#d97706 0%,#7c3aed 50%,#d97706 100%) 0 0/200%;-webkit-background-clip:text;background-clip:text}.theme-sepia .shimmer-text{color:#0000;background:linear-gradient(90deg,#b45309 0%,#78350f 50%,#b45309 100%) 0 0/200%;-webkit-background-clip:text;background-clip:text}.celestial-glass{-webkit-backdrop-filter:blur(16px);background:#161f32d9;border:1px solid #94a3b824;box-shadow:0 4px 20px -2px #00000040}.theme-light .celestial-glass{-webkit-backdrop-filter:blur(16px);background:#fffffff0;border:1px solid #0f172a14;box-shadow:0 4px 25px -4px #0f172a0d}.theme-sepia .celestial-glass{-webkit-backdrop-filter:blur(16px);background:#faf6edf2;border:1px solid #3c2d1e1a;box-shadow:0 4px 25px -4px #26221f0d}.theme-midnight .celestial-glass{-webkit-backdrop-filter:blur(16px);background:#0f1624e6;border:1px solid #ffffff14;box-shadow:0 4px 30px -4px #0000008c}.celestial-gradient{background:radial-gradient(circle at 50% -20%,#f59e0b1f,#0000 70%),radial-gradient(circle at 80% 20%,#818cf81a,#0000 50%),radial-gradient(circle at 10% 80%,#38bdf814,#0000 40%)}.stars-bg{background-image:radial-gradient(1px 1px at 20px 30px,#fff,#0000),radial-gradient(1px 1px at 40px 70px,#fef08a,#0000),radial-gradient(1.5px 1.5px at 90px 40px,#c7d2fe,#0000),radial-gradient(1px 1px at 160px 120px,#fff,#0000),radial-gradient(1.5px 1.5px at 240px 80px,#fef08a,#0000),radial-gradient(1px 1px at 320px 150px,#c7d2fe,#0000),radial-gradient(1.5px 1.5px at 380px 50px,#fff,#0000);background-repeat:repeat;background-size:400px 250px}.theme-light .stars-bg{background-image:radial-gradient(1.5px 1.5px at 20px 30px,#d977062e,#0000),radial-gradient(1px 1px at 40px 70px,#6366f124,#0000),radial-gradient(1.5px 1.5px at 90px 40px,#d9770626,#0000),radial-gradient(1px 1px at 160px 120px,#6366f11f,#0000),radial-gradient(1.5px 1.5px at 240px 80px,#d9770626,#0000),radial-gradient(1.5px 1.5px at 380px 50px,#6366f12e,#0000)}.theme-sepia .stars-bg{background-image:radial-gradient(1.5px 1.5px at 20px 30px,#b4530924,#0000),radial-gradient(1px 1px at 40px 70px,#78350f1a,#0000),radial-gradient(1.5px 1.5px at 90px 40px,#b453091f,#0000),radial-gradient(1.5px 1.5px at 240px 80px,#b453091f,#0000),radial-gradient(1.5px 1.5px at 380px 50px,#78350f1f,#0000)}.font-display{font-family:var(--font-display)}.book-spine{position:relative}.book-spine:before{content:"";pointer-events:none;z-index:10;background:linear-gradient(90deg,#00000059 0%,#ffffff26 50%,#0000 100%);width:4px;position:absolute;top:0;bottom:0;left:0}.celestial-card{background-color:var(--card);border:1px solid var(--border);border-radius:1rem;transition:all .25s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.celestial-card:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000 0%,#f59e0b59 50%,#0000 100%);height:1px;position:absolute;top:0;left:0;right:0}.theme-light .celestial-card:after{background:linear-gradient(90deg,#0000 0%,#4338ca40 50%,#0000 100%)}.theme-sepia .celestial-card:after{background:linear-gradient(90deg,#0000 0%,#92400e4d 50%,#0000 100%)}.theme-light .celestial-card{box-shadow:0 1px 3px #0f172a0f,0 1px 2px -1px #0f172a0a}.theme-sepia .celestial-card{box-shadow:0 1px 3px #3c2d1e0f,0 1px 2px -1px #3c2d1e0a}.theme-light [class*=bg-card\/30],.theme-light [class*=bg-card\/40],.theme-light [class*=bg-card\/50],.theme-light [class*=bg-card\/60]{background-color:#ffffffeb}.theme-sepia [class*=bg-card\/30],.theme-sepia [class*=bg-card\/40],.theme-sepia [class*=bg-card\/50],.theme-sepia [class*=bg-card\/60]{background-color:#fdfbf7f0}.theme-light [class*=border-border\/30],.theme-light [class*=border-border\/40],.theme-light [class*=border-border\/50]{border-color:#0f172a21}.theme-sepia [class*=border-border\/30],.theme-sepia [class*=border-border\/40],.theme-sepia [class*=border-border\/50]{border-color:#3c2d1e26}.theme-midnight [class*=border-border\/30],.theme-midnight [class*=border-border\/40],.theme-midnight [class*=border-border\/50]{border-color:#ffffff1f}select option{background-color:var(--card);color:var(--foreground)}.starlight-pill{letter-spacing:.05em;text-transform:uppercase;background:#94a3b814;border:1px solid #94a3b833;border-radius:9999px;align-items:center;gap:.25rem;padding:.125rem .5rem;font-size:.625rem;font-weight:700;line-height:1.25;display:inline-flex}.hover-lift{transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s cubic-bezier(.16,1,.3,1)}.hover-lift:hover{transform:translateY(-2px)}.hover-lift:active{transform:translateY(0)scale(.99)}.tactile-btn{transition:all .15s cubic-bezier(.16,1,.3,1)}.tactile-btn:active{transform:scale(.97)}.focus-ring:focus-visible{box-shadow:0 0 0 2px var(--background), 0 0 0 4px var(--primary);outline:none}@keyframes toastSlideIn{0%{opacity:0;transform:translateY(-12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.animate-toast-in{animation:.3s cubic-bezier(.16,1,.3,1) forwards toastSlideIn}.animate-fade-in,.animate-fadeIn{animation:.2s ease-out forwards fadeIn}.animate-scale-up,.animate-scaleUp{animation:.25s cubic-bezier(.16,1,.3,1) forwards scaleUp}@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-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-scroll-snap-strictness{syntax:"*";inherits:false;initial-value:proximity}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@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-ease{syntax:"*";inherits:false}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}

/* Fix (B21): the rotate utility class used by the resume/quick-nav progress
   ring was never emitted by the build; declare it explicitly next to the other
   scale/rotate transforms. */
.-rotate-90{transform:rotate(-90deg)}
.rotate-90{transform:rotate(90deg)}


/* === Layer: lunaria-quality.css === */
/* Lunaria/Moonverse quality layer: accessibility and viewport corrections.
   Palette, display fonts, corners, gradients and atmospheric styling stay intact. */
:root {
  scroll-padding-top: 5rem;
  scrollbar-gutter: stable;
}
:where(
  a,
  button,
  summary,
  [role="tab"],
  [role="switch"]
):focus-visible {
  outline: 1.5px solid color-mix(in srgb, var(--ring, #818cf8) 70%, transparent);
  outline-offset: 2px;
}
:where(
  input,
  textarea,
  select
):focus,
:where(
  input,
  textarea,
  select
):focus-visible {
  outline: none !important;
  outline-offset: 0 !important;
}
:where(button, [role="button"]):disabled {
  cursor: not-allowed;
}
:where(img, svg, video, canvas, iframe) {
  max-width: 100%;
}
:where(input, textarea, select) {
  min-width: 0;
}
main,
[id] {
  scroll-margin-top: 5rem;
}
.lunaria-skip {
  position: fixed;
  inset: 0.75rem auto auto 0.75rem;
  z-index: 99999;
  padding: 0.75rem 1.1rem;
  border: 2px solid var(--ring, #818cf8);
  border-radius: 0.75rem;
  background: var(--card, #161f32);
  color: var(--foreground, #fff);
  font-size: 0.875rem;
  font-weight: 700;
  box-shadow: 0 8px 28px #0005;
  transform: translateY(-150%);
  transition: transform 0.15s ease;
}
.lunaria-skip:focus {
  transform: translateY(0);
}
body.lunaria-dialog-open {
  overflow: hidden;
}
[role="dialog"][aria-modal="true"] {
  overscroll-behavior: contain;
}
[role="dialog"][aria-modal="true"] > div {
  max-height: min(92dvh, 60rem);
  overflow-y: auto;
  overscroll-behavior: contain;
}
/* Keep densely packed information panels readable on narrow screens. */
@media (max-width: 480px) {
  :where(main, section, article) {
    min-width: 0;
  }
  :where(.overflow-x-auto, .overflow-auto) {
    overscroll-behavior-x: contain;
  }
  [role="dialog"][aria-modal="true"] {
    padding: 0.65rem;
  }
  [role="dialog"][aria-modal="true"] > div {
    max-height: calc(100dvh - 1.3rem);
  }
  .lunaria-skip {
    inset: max(0.75rem, env(safe-area-inset-top)) auto auto 0.75rem;
  }
}
@media (pointer: coarse) {
  /* Larger controls for touch without enlarging decorative pills and badges. */
  :where(header, nav, footer) button:not([role="switch"]),
  :where(header, nav, footer) a {
    touch-action: manipulation;
  }
}
@media (prefers-reduced-motion: reduce) {
  :root {
    scroll-behavior: auto !important;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
@media (forced-colors: active) {
  :where(button, a, input, textarea, select):focus-visible {
    outline: 2px solid Highlight !important;
  }
  [role="switch"] {
    border: 1px solid ButtonText;
  }
}
/* Nonblocking illustration fallback for disconnected external cover services. */
.lunaria-cover-fallback {
  position: relative;
  background-image:
    radial-gradient(
      ellipse at 35% 25%,
      color-mix(in srgb, var(--primary, #818cf8) 18%, transparent),
      transparent 65%
    ),
    linear-gradient(150deg, var(--card, #161f32), var(--background, #0f1523));
}
.lunaria-cover-fallback::after {
  content: "✦";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;
  font-size: clamp(1.5rem, 4vw, 3.5rem);
  color: var(--primary, #818cf8);
  opacity: 0.32;
}
.lunaria-image-error {
  opacity: 0 !important;
}


/* === Layer: moonverse-design.css === */
/* Moonverse design system — semantic components + carefully scoped legacy refinements. */
:root {
  --mv-page: 1280px;
  --mv-serif: "Literata", Georgia, serif;
  --mv-radius: 20px;
  --mv-space: clamp(20px, 3vw, 40px);
  --foreground: #e6e8f1;
  --muted-foreground: #a5afc5;
  --mv-surface: color-mix(in srgb, var(--card) 88%, var(--background));
  --mv-shadow: 0 8px 30px #0000000a;
  color-scheme: dark;
  scroll-padding-top: 96px;
}
:root.theme-light,
:root.light {
  --background: #f7f7fb;
  --foreground: #252638;
  --card: #ffffff;
  --muted: #eeedf5;
  --muted-foreground: #62657a;
  --primary: #6553bd;
  --primary-hover: #5240aa;
  --border: #dad9e7;
  --mv-shadow: 0 8px 30px #37305a06;
  color-scheme: light;
}
:root.theme-sepia {
  --foreground: #352d28;
  --muted-foreground: #6b5b4e;
  color-scheme: light;
}
:root.theme-midnight {
  --foreground: #e9eaf2;
  --muted-foreground: #a3aec5;
  color-scheme: dark;
}
body {
  font-feature-settings: "ss01" on;
}
#root {
  min-height: 100dvh;
  isolation: isolate;
}
#root > .stars-bg {
  background-image: radial-gradient(
    ellipse at 90% 0%,
    color-mix(in srgb, var(--primary) 5%, transparent),
    transparent 50%
  );
}
header.celestial-glass {
  background: color-mix(in srgb, var(--background) 94%, transparent);
  border-width: 0 0 1px;
  box-shadow: none;
  backdrop-filter: blur(20px);
}
header > div:first-child {
  height: 76px;
  max-width: var(--mv-page);
  gap: 16px;
}
header a[href="/"] {
  min-height: 40px;
}
header a[href="/"] > div:last-child > span:first-child {
  font-size: 15px;
  letter-spacing: 0.17em;
}
header a[href="/"] > div:last-child > span:last-child {
  font-size: 8px;
  letter-spacing: 0.18em;
}
header button {
  min-height: 38px;
  border-radius: 12px;
}
header button[title="Daily Dewdrop Gathering"] {
  display: none !important;
}
header nav[aria-label="Primary"] {
  gap: 4px;
}
header nav[aria-label="Primary"] a {
  font-size: 13px;
  padding: 10px 12px;
  white-space: nowrap;
}
header nav[aria-label="Primary"] a:nth-child(3),
header nav[aria-label="Primary"] a:nth-child(5),
header nav[aria-label="Primary"] a:nth-child(6),
header nav[aria-label="Primary"] a:nth-child(7) {
  display: none !important;
}
header nav[aria-label="Primary"] a[aria-current] {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 10%, transparent);
}
header button[aria-label="Toggle navigation menu"] {
  display: flex !important;
}
#moonverse-navigation-drawer {
  display: block !important;
  max-height: calc(100dvh - 78px);
  overflow-y: auto;
  padding: 24px max(24px, calc((100vw - 1216px) / 2));
}
#moonverse-navigation-drawer > .grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
#moonverse-navigation-drawer a {
  min-height: 44px;
  font-size: 13px;
}
#moonverse-navigation-drawer > button {
  min-height: 44px;
}
#root main:not([data-reader="true"]) {
  max-width: var(--mv-page);
  padding: 32px var(--mv-space) 40px;
}
#root main[data-reader="true"] {
  max-width: none;
  padding: 0;
}
main > div:not(.mv-home) > h1,
main > div:not(.mv-home) > div > h1,
main > div:not(.mv-home) h1 {
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.25;
  letter-spacing: -0.035em;
}
main > div:not(.mv-home) > div > p.text-muted-foreground {
  max-width: 70ch;
}
main > div:not(.mv-home) {
  min-width: 0;
}
main[data-route="/stories"] > div {
  padding-left: 0;
  padding-right: 0;
}
main :where([class~="text-[9px]"]) {
  font-size: 11px;
}
main :where([class~="text-[10px]"]) {
  font-size: 11px;
}
main :where([class~="text-[11px]"]) {
  font-size: 12px;
}
main
  :where(
    input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
    textarea,
    select
  ) {
  font-size: 14px;
}
:where(
  input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
  select
) {
  min-height: 42px;
}
:where(button):not([role="switch"]) {
  min-height: 32px;
}
main :where(button):not([role="switch"]):not(.mv-icon-button) {
  min-height: 36px;
}
button[role="switch"] {
  position: relative;
}
button[role="switch"]::after {
  content: "";
  position: absolute;
  inset: -10px -4px;
}
:where(button, a, input, textarea, select) {
  -webkit-tap-highlight-color: transparent;
}
:where(button, a) {
  touch-action: manipulation;
}
main :where(h1, h2, h3, h4, p, a, span) {
  overflow-wrap: break-word;
}
main :where(.min-w-0) {
  min-width: 0;
}
main[data-route="/settings"] [role="tablist"] {
  gap: 8px;
  padding: 6px;
  border-radius: 16px;
}
main[data-route="/settings"] [role="tab"] {
  padding: 10px 18px;
  font-size: 13px;
}
main[data-route="/settings"] :where(label) {
  font-size: 13px;
}
main[data-route="/settings"] :where(input, textarea, select) {
  border-color: var(--border);
}
main nav[aria-label="Breadcrumb"] {
  margin-bottom: 18px;
  font-size: 12px;
}
main nav[aria-label="Breadcrumb"] a {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
}
/* Fixed surfaces scroll within the viewport, leaving their close action reachable. */
[role="dialog"][aria-modal="true"] {
  z-index: 80;
  padding: max(16px, env(safe-area-inset-top)) 16px
    max(16px, env(safe-area-inset-bottom));
}
[role="dialog"][aria-modal="true"] > div {
  max-height: calc(100dvh - 32px);
  border-radius: 24px;
  box-shadow: 0 24px 90px #0005;
}
[role="dialog"] button {
  min-height: 38px;
}
[role="dialog"] input {
  font-size: 16px;
}
[role="dialog"] :where(h2, h3) {
  text-wrap: balance;
}
/* Deliberate typography and spacious cards on the home page. */
.mv-home {
  display: flex;
  flex-direction: column;
  gap: 44px;
}
.mv-home h1,
.mv-home h2,
.mv-home h3,
.mv-home p {
  margin: 0;
}
.mv-welcome {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  padding: 4px 0 0;
}
.mv-eyebrow {
  color: var(--primary);
  font-size: 10px;
  line-height: 1.5;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  font-weight: 700;
}
.mv-welcome h1 {
  margin-top: 12px;
  font-size: clamp(30px, 3.2vw, 45px);
  letter-spacing: -0.045em;
  line-height: 1.2;
  font-weight: 600;
}
.mv-welcome h1 em {
  color: var(--primary);
  font-family: var(--mv-serif);
  font-weight: 400;
  font-size: 0.9em;
}
.mv-welcome-note {
  font-size: 12px;
  line-height: 1.8;
  color: var(--muted-foreground);
  white-space: pre-line;
  flex-shrink: 0;
  padding-bottom: 3px;
}
.mv-feature-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 254px;
  gap: 20px;
  margin-top: -16px;
}
.mv-feature {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  min-height: 375px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--mv-radius);
  background: linear-gradient(
    120deg,
    color-mix(in srgb, var(--primary) 7%, var(--card)),
    var(--card)
  );
}
.mv-feature-copy {
  min-width: 0;
  padding: 32px 0 24px 32px;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.mv-feature-kicker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.mv-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--primary) 10%, var(--card));
  color: var(--primary);
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 600;
  white-space: nowrap;
}
.mv-feature h2 {
  font-family: var(--mv-serif);
  font-size: clamp(23px, 2.2vw, 31px);
  line-height: 1.28;
  font-weight: 500;
  letter-spacing: -0.035em;
  text-wrap: balance;
}
.mv-feature-author {
  margin-top: 12px !important;
  color: var(--muted-foreground);
  font-size: 12px;
}
.mv-feature-synopsis {
  color: var(--muted-foreground);
  font-size: 13px;
  line-height: 1.8;
  margin-top: 14px !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.mv-feature-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 22px;
}
.mv-button {
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid var(--border);
  border-radius: 11px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 650;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  transition:
    background 0.15s,
    transform 0.15s;
}
.mv-button:hover {
  transform: translateY(-1px);
}
.mv-button-primary {
  background: var(--primary);
  color: var(--primary-foreground);
  border-color: var(--primary);
}
.mv-button-primary:hover {
  background: var(--primary-hover);
}
.mv-button-secondary {
  color: var(--foreground);
  background: var(--card);
}
.mv-button-secondary:hover {
  background: var(--muted);
}
.mv-text-link {
  color: var(--primary);
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
  align-items: center;
  min-height: 36px;
}
.mv-text-link:hover {
  text-decoration: underline;
  text-underline-offset: 5px;
}
.mv-feature-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: auto;
  padding-top: 22px;
}
.mv-count {
  color: var(--muted-foreground);
  font-size: 10px;
  letter-spacing: 0.15em;
}
.mv-feature-pagination > div {
  display: flex;
  gap: 6px;
}
.mv-icon-button {
  width: 34px;
  height: 34px;
  min-height: 34px !important;
  padding: 0;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 50%;
  color: var(--foreground);
  background: var(--card);
  font-size: 16px;
  cursor: pointer;
}
.mv-icon-button:hover {
  background: var(--muted);
  border-color: var(--primary);
  color: var(--primary);
}
.mv-feature-art {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 34px 20px;
  isolation: isolate;
  overflow: hidden;
}
.mv-feature-art::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(
    ellipse at 50% 50%,
    color-mix(in srgb, var(--primary) 17%, transparent),
    transparent 70%
  );
}
.mv-feature-cover {
  display: block;
  width: 157px;
  max-width: 85%;
  aspect-ratio: 2/3;
  border-radius: 4px 10px 10px 4px;
  overflow: hidden;
  transform: rotate(6deg);
  box-shadow:
    12px 22px 28px #0004,
    -4px 0 0 color-mix(in srgb, var(--foreground) 10%, var(--card));
  transition: transform 0.3s;
}
.mv-feature-cover:hover {
  transform: rotate(2deg) translateY(-4px);
}
.mv-feature-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mv-orbit {
  position: absolute;
  width: 290px;
  height: 290px;
  border: 1px solid color-mix(in srgb, var(--primary) 17%, transparent);
  border-radius: 50%;
  z-index: -1;
}
.mv-orbit-two {
  width: 370px;
  height: 370px;
}
.mv-art-star {
  position: absolute;
  top: 25px;
  right: 28px;
  font-size: 24px;
  color: var(--primary);
}
.mv-art-caption {
  margin-top: 28px;
  color: var(--muted-foreground);
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.mv-ritual {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 25px 24px;
  border-radius: var(--mv-radius);
  border: 1px solid var(--border);
  background: var(--card);
}
.mv-ritual-symbol {
  color: var(--primary);
  font-size: 42px;
  line-height: 1;
  margin-bottom: 22px;
}
.mv-ritual h2 {
  font-family: var(--mv-serif);
  font-weight: 400;
  font-size: 25px;
  line-height: 1.35;
  margin-top: 12px;
  letter-spacing: -0.035em;
}
.mv-ritual > p:not(.mv-eyebrow) {
  color: var(--muted-foreground);
  font-size: 12px;
  line-height: 1.9;
  margin: 12px 0 22px;
}
.mv-ritual .mv-button {
  width: 100%;
  margin-top: auto;
  font-size: 11px;
}
.mv-ritual .mv-text-link {
  margin-top: 9px;
  align-self: center;
  font-size: 11px;
}
.mv-genres {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: -20px;
}
.mv-genre {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card);
  transition:
    border-color 0.15s,
    transform 0.15s;
}
.mv-genre:hover {
  border-color: var(--primary);
  transform: translateY(-2px);
}
.mv-genre-symbol {
  font-size: 26px;
  color: var(--primary);
  width: 28px;
  text-align: center;
  flex-shrink: 0;
}
.mv-genre > span:nth-child(2) {
  flex: 1;
  min-width: 0;
}
.mv-genre strong {
  display: block;
  font-size: 12px;
  font-weight: 650;
}
.mv-genre > span:nth-child(2) > span {
  display: block;
  color: var(--muted-foreground);
  font-size: 10px;
  margin-top: 5px;
  line-height: 1.5;
}
.mv-genre > span:last-child {
  color: var(--muted-foreground);
  font-size: 13px;
}
.mv-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}
.mv-section-heading h2 {
  font-size: 23px;
  line-height: 1.3;
  font-weight: 650;
  letter-spacing: -0.035em;
  margin-top: 6px;
}
.mv-section-description {
  font-size: 12px;
  color: var(--muted-foreground);
  line-height: 1.7;
  margin-top: 7px !important;
}
.mv-heading-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.mv-heading-actions .mv-text-link {
  margin-left: 10px;
}
.mv-story-rail {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 90px) / 6);
  gap: 18px;
  overflow-x: auto;
  padding: 2px 0 12px;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
}
.mv-story-rail > article {
  scroll-snap-align: start;
}
.mv-story-card {
  border-radius: 12px;
  box-shadow: none !important;
  background: var(--card) !important;
  border: 1px solid var(--border) !important;
  transition: border-color 0.2s !important;
  min-width: 0;
}
.mv-story-card::after {
  display: none;
}
.mv-story-card:hover {
  transform: none !important;
  border-color: color-mix(
    in srgb,
    var(--primary) 60%,
    var(--border)
  ) !important;
}
.mv-story-card > .book-spine {
  border-radius: 0;
}
.mv-story-card > .book-spine > .absolute:first-of-type {
  max-width: calc(100% - 48px);
}
.mv-story-card
  > .book-spine
  > .absolute:first-of-type
  > span:first-child
  > span:nth-child(n + 2) {
  display: none;
}
.mv-story-card > .book-spine > .absolute:first-of-type > span:first-child {
  font-size: 10px;
  padding: 4px 7px;
}
.mv-story-card > .book-spine button {
  width: 30px;
  height: 30px;
  min-height: 30px !important;
  display: grid;
  place-items: center;
  padding: 6px;
}
.mv-story-card > div:last-child {
  padding: 13px 12px;
  gap: 10px;
}
.mv-story-card > div:last-child > div:first-child > a {
  font-size: 12px;
  line-height: 1.5;
  -webkit-line-clamp: 2;
  min-height: 3em;
  font-weight: 650;
}
.mv-story-card > div:last-child > div:first-child > p {
  font-size: 10px;
  line-height: 1.6;
}
.mv-story-card > div:last-child > div:first-child > p:first-of-type {
  display: none;
}
.mv-story-card > div:last-child > div:last-child {
  font-size: 10px;
}
.mv-story-card .group-hover\:scale-104 {
  transform: none !important;
}
.mv-filter-tabs {
  display: flex;
  gap: 6px;
  margin: -5px 0 18px;
}
.mv-filter {
  border-radius: 9px;
  padding: 7px 16px;
  font-size: 12px;
  color: var(--muted-foreground);
  background: var(--muted);
  cursor: pointer;
}
.mv-filter.is-active {
  background: var(--primary);
  color: var(--primary-foreground);
}
.mv-release-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.mv-release {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 19px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card);
  transition: border-color 0.15s;
}
.mv-release:hover {
  border-color: var(--primary);
}
.mv-release > div {
  min-width: 0;
  flex: 1;
}
.mv-release-series {
  font-size: 10px;
  color: var(--primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mv-release h3 {
  font-size: 13px;
  line-height: 1.6;
  font-weight: 600;
  margin: 5px 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mv-release-meta {
  color: var(--muted-foreground);
  font-size: 10px;
}
.mv-free {
  color: var(--foreground);
  background: var(--muted);
}
.mv-empty {
  padding: 24px;
  color: var(--muted-foreground);
}
.mv-collection-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.mv-collection {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 18px;
  overflow: hidden;
  padding: 0 22px 20px;
  background: var(--card);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transition: border-color 0.15s;
}
.mv-collection:hover {
  border-color: var(--primary);
}
.mv-collection-art {
  width: calc(100% + 44px);
  margin: 0 -22px 22px;
  height: 175px;
  display: flex;
  justify-content: center;
  align-items: center;
  isolation: isolate;
  background: radial-gradient(
    ellipse at 50% 100%,
    color-mix(in srgb, var(--primary) 16%, var(--muted)),
    var(--muted)
  );
}
.mv-collection-art img {
  height: 130px;
  width: 87px;
  border-radius: 5px;
  object-fit: cover;
  box-shadow: 0 8px 16px #0003;
}
.mv-collection-art img:first-child {
  transform: rotate(-12deg) translate(12px, 6px);
  z-index: -1;
}
.mv-collection-art img:last-child {
  transform: rotate(12deg) translate(-12px, 6px);
  z-index: -1;
}
.mv-collection-art img:nth-child(2) {
  z-index: 1;
}
.mv-collection h3 {
  font-family: var(--mv-serif);
  font-size: 19px;
  font-weight: 500;
  line-height: 1.4;
  margin: 11px 0;
  letter-spacing: -0.03em;
}
.mv-collection > p {
  font-size: 12px;
  color: var(--muted-foreground);
  line-height: 1.8;
  margin-bottom: 16px;
}
.mv-collection > .mv-text-link {
  margin-top: auto;
  font-size: 11px;
}
.mv-collection .mv-eyebrow {
  font-size: 9px;
}
.mv-themes {
  padding: 30px;
  display: flex;
  align-items: center;
  gap: 30px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: linear-gradient(
    120deg,
    color-mix(in srgb, var(--primary) 6%, var(--card)),
    var(--card)
  );
}
.mv-themes h2 {
  font-family: var(--mv-serif);
  font-weight: 400;
  font-size: 23px;
  line-height: 1.4;
  margin-top: 10px;
  width: 220px;
}
.mv-theme-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.mv-theme-link {
  padding: 9px 14px;
  border-radius: 30px;
  border: 1px solid var(--border);
  color: var(--foreground);
  font-size: 11px;
  background: var(--card);
}
.mv-theme-link:hover {
  border-color: var(--primary);
  color: var(--primary);
}
.mv-footer {
  margin-top: 36px;
  border-top: 1px solid var(--border);
  background: var(--card);
}
.mv-footer-inner {
  max-width: var(--mv-page);
  padding: 38px var(--mv-space) 22px;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.mv-footer-brand > a {
  font-size: 14px;
  letter-spacing: 0.16em;
  font-weight: 750;
}
.mv-footer-brand p {
  white-space: pre-line;
  color: var(--muted-foreground);
  font-size: 12px;
  line-height: 1.9;
  margin-top: 12px;
}
.mv-footer nav {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: flex-end;
  gap: 12px 24px;
  font-size: 12px;
}
.mv-footer a:hover {
  color: var(--primary);
}
.mv-footer-bottom {
  grid-column: 1/-1;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  border-top: 1px solid var(--border);
  padding-top: 20px;
  font-size: 10px;
  color: var(--muted-foreground);
}
.mv-demo-note {
  margin-left: auto;
}
nav[aria-label="Mobile"] {
  padding-bottom: max(8px, env(safe-area-inset-bottom));
  box-shadow: 0 -4px 24px #00000008;
}
nav[aria-label="Mobile"] a {
  min-width: 0;
  flex: 1;
  min-height: 52px;
}
nav[aria-label="Mobile"] a[aria-current] {
  background: color-mix(in srgb, var(--primary) 8%, transparent);
}
.mv-not-found {
  padding: 60px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}
.mv-not-found > span {
  font-size: 90px;
  color: var(--primary);
}
.mv-not-found h1 {
  font-family: var(--mv-serif);
  font-weight: 400;
}
.mv-not-found > p:not(.mv-eyebrow) {
  color: var(--muted-foreground);
  max-width: 45ch;
  font-size: 14px;
  line-height: 1.8;
}
header .animate-pulse,
header .animate-ping {
  animation: none;
}
@media (min-width: 1024px) {
  header nav.hidden.lg\:flex {
    display: flex !important;
  }
}
@media (max-width: 1199px) {
  .mv-feature-layout {
    grid-template-columns: minmax(0, 1fr) 220px;
  }
  .mv-feature {
    grid-template-columns: minmax(0, 1fr) 200px;
  }
  .mv-feature-copy {
    padding-left: 24px;
  }
  .mv-feature-art {
    padding-inline: 12px;
  }
  .mv-ritual {
    padding: 24px 20px;
  }
  .mv-story-rail {
    grid-auto-columns: calc((100% - 60px) / 4.4);
    gap: 15px;
  }
  .mv-genre {
    gap: 9px;
    padding: 16px 12px;
  }
  .mv-genre > span:nth-child(2) > span {
    display: none;
  }
  header nav[aria-label="Primary"] a {
    padding-inline: 8px;
    font-size: 12px;
  }
  header button[title^="Search"] > span {
    display: none;
  }
}
@media (max-width: 959px) {
  .mv-feature-layout {
    grid-template-columns: 1fr;
  }
  .mv-feature {
    grid-template-columns: minmax(0, 1fr) 260px;
  }
  .mv-ritual {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 6px 18px;
    align-items: center;
    padding: 20px;
  }
  .mv-ritual-symbol {
    grid-row: 1/4;
    margin: 0;
  }
  .mv-ritual .mv-eyebrow {
    grid-column: 2;
  }
  .mv-ritual h2 {
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
  }
  .mv-ritual > p:not(.mv-eyebrow) {
    grid-column: 2;
    margin: 0;
    font-size: 11px;
  }
  .mv-ritual .mv-button {
    grid-column: 3;
    grid-row: 1/3;
    margin: 0;
  }
  .mv-ritual .mv-text-link {
    grid-column: 3;
    grid-row: 3;
    margin: 0;
    min-height: 24px;
    justify-content: center;
  }
  .mv-welcome-note {
    display: none;
  }
  .mv-collection-grid {
    gap: 12px;
  }
  .mv-collection {
    padding-inline: 16px;
  }
  .mv-collection-art {
    width: calc(100% + 32px);
    margin-inline: -16px;
  }
  .mv-collection-art img {
    width: 65px;
    height: 98px;
  }
  .mv-collection-art {
    height: 145px;
  }
}
@media (max-width: 767px) {
  header > div:first-child {
    height: 66px;
    gap: 10px;
  }
  #moonverse-navigation-drawer {
    max-height: calc(100dvh - 130px);
    padding: 16px;
  }
  #moonverse-navigation-drawer > .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #root main:not([data-reader="true"]) {
    padding-top: 24px;
  }
  .mv-home {
    gap: 34px;
  }
  .mv-welcome {
    padding: 0 0 6px;
  }
  .mv-welcome h1 {
    font-size: 32px;
    line-height: 1.3;
  }
  .mv-welcome h1 em {
    display: block;
  }
  .mv-welcome .mv-eyebrow {
    font-size: 9px;
  }
  .mv-feature {
    grid-template-columns: minmax(0, 1fr) 180px;
    min-height: 360px;
  }
  .mv-feature-copy {
    padding: 26px 0 20px 24px;
  }
  .mv-feature h2 {
    font-size: 25px;
  }
  .mv-feature-cover {
    width: 120px;
  }
  .mv-feature-kicker {
    gap: 8px;
  }
  .mv-feature-kicker .mv-eyebrow {
    font-size: 8px;
  }
  .mv-feature-kicker .mv-pill {
    font-size: 9px;
  }
  .mv-art-caption {
    font-size: 8px;
    letter-spacing: 0.05em;
  }
  .mv-feature-actions {
    gap: 10px;
  }
  .mv-feature-actions .mv-text-link {
    display: none;
  }
  .mv-genres {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: -14px;
    gap: 10px;
  }
  .mv-genre {
    padding: 16px 12px;
  }
  .mv-genre > span:nth-child(2) > span {
    display: block;
    font-size: 9px;
  }
  .mv-section-heading {
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 18px;
  }
  .mv-section-heading h2 {
    font-size: 21px;
  }
  .mv-section-description {
    font-size: 11px;
    max-width: 45ch;
  }
  .mv-heading-actions .mv-icon-button {
    display: none;
  }
  .mv-heading-actions .mv-text-link {
    margin: 0;
    font-size: 10px;
    white-space: nowrap;
  }
  .mv-section-heading > .mv-text-link {
    font-size: 10px;
    white-space: nowrap;
  }
  .mv-story-rail {
    grid-auto-columns: calc((100% - 30px) / 3.3);
    gap: 12px;
  }
  .mv-release-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .mv-release {
    padding: 16px;
  }
  .mv-collection-grid {
    grid-template-columns: 1fr;
  }
  .mv-collection {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 8px 18px;
    padding: 16px;
    align-items: start;
  }
  .mv-collection-art {
    grid-column: 1;
    grid-row: 1/5;
    width: 120px;
    height: 170px;
    margin: 0;
    border-radius: 10px;
    overflow: hidden;
  }
  .mv-collection-art img {
    width: 66px;
    height: 100px;
    margin: 0 -20px;
    flex-shrink: 0;
  }
  .mv-collection h3 {
    margin: 0;
    font-size: 18px;
  }
  .mv-collection > p {
    margin: 0;
    font-size: 11px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .mv-collection > .mv-eyebrow {
    font-size: 8px;
  }
  .mv-collection > .mv-text-link {
    margin: 0;
    font-size: 10px;
  }
  .mv-themes {
    padding: 22px;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  .mv-themes h2 {
    width: auto;
    font-size: 22px;
  }
  .mv-footer {
    margin-top: 16px;
    padding-bottom: 80px;
  }
  .mv-footer-inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .mv-footer nav {
    justify-content: flex-start;
  }
  .mv-demo-note {
    width: 100%;
    margin: 0;
  }
  .mv-footer-bottom {
    gap: 14px;
  }
}
@media (max-width: 519px) {
  header > div:first-child {
    padding-inline: 16px;
    gap: 8px;
  }
  header > div:first-child > div:last-child {
    gap: 6px;
  }
  header button {
    min-height: 36px;
  }
  .mv-feature {
    grid-template-columns: minmax(0, 1fr) 115px;
    min-height: 0;
  }
  .mv-feature-copy {
    padding: 22px 0 18px 20px;
  }
  .mv-feature h2 {
    font-size: 22px;
  }
  .mv-feature-kicker {
    margin-bottom: 12px;
  }
  .mv-feature-kicker .mv-pill {
    display: none;
  }
  .mv-feature-author {
    font-size: 10px;
    line-height: 1.7;
  }
  .mv-feature-synopsis {
    font-size: 11px;
    -webkit-line-clamp: 3;
    line-height: 1.8;
  }
  .mv-feature-actions {
    margin-top: 16px;
  }
  .mv-feature-actions .mv-button {
    font-size: 10px;
    padding: 10px 12px;
  }
  .mv-feature-art {
    padding: 20px 6px 20px 0;
    justify-content: flex-start;
    padding-top: 68px;
  }
  .mv-feature-cover {
    width: 87px;
    max-width: 85%;
  }
  .mv-orbit {
    width: 180px;
    height: 180px;
    top: 54px;
  }
  .mv-orbit-two {
    width: 240px;
    height: 240px;
    top: 24px;
  }
  .mv-art-star {
    top: 24px;
    right: 22px;
    font-size: 18px;
  }
  .mv-art-caption {
    display: none;
  }
  .mv-feature-pagination {
    padding-top: 18px;
  }
  .mv-feature-pagination .mv-icon-button {
    width: 30px;
    height: 30px;
    min-height: 30px !important;
  }
  .mv-ritual {
    grid-template-columns: 1fr auto;
    gap: 8px 14px;
    padding: 18px;
  }
  .mv-ritual-symbol {
    display: none;
  }
  .mv-ritual .mv-eyebrow,
  .mv-ritual h2,
  .mv-ritual > p:not(.mv-eyebrow) {
    grid-column: 1;
  }
  .mv-ritual h2 {
    font-size: 14px;
    line-height: 1.5;
  }
  .mv-ritual > p:not(.mv-eyebrow) {
    display: none;
  }
  .mv-ritual .mv-button {
    grid-column: 2;
    grid-row: 1/3;
    font-size: 9px;
    padding: 10px;
  }
  .mv-ritual .mv-text-link {
    display: none;
  }
  .mv-genre strong {
    font-size: 11px;
  }
  .mv-genre > span:nth-child(2) > span {
    font-size: 8px;
  }
  .mv-genre-symbol {
    font-size: 22px;
    width: 22px;
  }
  .mv-story-rail {
    grid-auto-columns: calc((100% - 18px) / 2.35);
    gap: 12px;
  }
  .mv-section-heading h2 {
    font-size: 20px;
  }
  .mv-section-heading .mv-eyebrow {
    font-size: 8px;
  }
  .mv-section-description {
    display: none;
  }
  .mv-collection {
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 6px 14px;
  }
  .mv-collection-art {
    width: 88px;
    height: 160px;
  }
  .mv-collection h3 {
    font-size: 16px;
  }
  .mv-collection > .mv-eyebrow {
    font-size: 8px;
    letter-spacing: 0.08em;
  }
  .mv-collection > .mv-text-link {
    font-size: 9px;
    min-height: 30px;
  }
  .mv-filter {
    flex: 1;
    padding-inline: 10px;
  }
  main[data-route="/stories"] h1 {
    font-size: 28px;
  }
  main[data-reader="true"] aside[aria-label="Chapter reading dock"] > div {
    overflow-x: auto;
    justify-content: flex-start;
    scrollbar-width: none;
  }
  main[data-reader="true"]
    aside[aria-label="Chapter reading dock"]
    :where(button, a) {
    flex-shrink: 0;
  }
}
@media (pointer: coarse) {
  :where(
    input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
    select
  ) {
    font-size: 16px !important;
  }
  .mv-button {
    min-height: 44px;
  }
  .mv-icon-button {
    width: 40px;
    height: 40px;
    min-height: 40px !important;
  }
  .mv-story-card > .book-spine button {
    width: 34px;
    height: 34px;
    min-height: 34px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
/* Maintain primary library access at intermediate desktop breakpoints. */
@media (min-width: 1024px) {
  header nav.hidden.lg\:flex a:nth-child(8) {
    display: inline-flex !important;
  }
}
/* Small icon controls get a usable hit area without widening decorative badges. */
main button:not([role="switch"]):not(.mv-icon-button):has(> svg:only-child) {
  min-width: 30px;
  min-height: 32px;
}
.mv-story-card > div:last-child > div:last-child {
  gap: 4px;
  flex-wrap: wrap;
}
.mv-story-card > div:last-child > div:last-child > span {
  white-space: nowrap;
}
@media (max-width: 519px) {
  .mv-genre > span:nth-child(2) > span {
    display: none;
  }
}
.mv-home > *,
.mv-release,
.mv-release-grid,
.mv-section-heading > div {
  min-width: 0;
}
@media (max-width: 767px) {
  .mv-release-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
#moonverse-navigation-drawer {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  border-bottom: 1px solid var(--border);
  box-shadow: 0 18px 35px #0002;
}
header .absolute.right-0 {
  max-height: calc(100dvh - 96px);
  overflow-y: auto;
}
@media (max-width: 380px) {
  .mv-feature {
    grid-template-columns: minmax(0, 1fr) 92px;
  }
  .mv-feature-cover {
    width: 74px;
  }
  .mv-feature-art {
    padding-top: 76px;
  }
  .mv-feature h2 {
    font-size: 21px;
  }
  .mv-ritual {
    grid-template-columns: 1fr;
  }
  .mv-ritual .mv-button {
    grid-column: 1;
    grid-row: auto;
    margin-top: 6px;
    width: auto;
  }
}
.mv-preview-notice {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  padding: 14px 18px;
  margin-bottom: 24px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--primary) 6%, var(--card));
  font-size: 12px;
  color: var(--muted-foreground);
}
.mv-preview-notice strong {
  color: var(--primary);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
main button:not([role="switch"]) {
  min-width: 28px;
}
[role="dialog"][data-mv-panel] {
  padding: 0;
}
[role="dialog"][data-mv-panel] > div {
  max-height: 100dvh;
  height: 100dvh;
  border-radius: 24px 0 0 24px;
  padding-top: max(24px, env(safe-area-inset-top));
  padding-bottom: max(24px, env(safe-area-inset-bottom));
}
#moonverse-notifications {
  max-height: calc(100dvh - 100px);
}
@media (max-width: 639px) {
  #moonverse-notifications {
    position: fixed;
    top: 74px;
    left: 12px;
    right: 12px;
    width: auto;
    max-width: none;
  }
}


/* === Layer: moonverse-compact.css === */
/* Compact editorial styling: reduce empty layout space while preserving reading comfort. */
:root { --mv-page:1360px; --mv-space:clamp(12px,2vw,24px); --mv-radius:14px; --mv-shadow:0 2px 8px #29213d05; }
header > div:first-child { height:56px; padding-inline:var(--mv-space); gap:12px; }
header a[href='/'] > div:first-child { width:30px; height:30px; border-radius:10px; }
header a[href='/'] > div:last-child > span:first-child { font-size:13px; letter-spacing:.14em; }
header a[href='/'] > div:last-child > span:last-child { font-size:7px; margin-top:3px; }
header button { min-height:32px; border-radius:9px; }
header nav[aria-label='Primary'] a { padding:7px 10px; font-size:12px; }
#moonverse-navigation-drawer { padding:12px max(16px,calc((100vw - 1312px)/2)); max-height:calc(100dvh - 58px); }
#moonverse-navigation-drawer > .grid { gap:6px; }
#moonverse-navigation-drawer a,#moonverse-navigation-drawer > button { min-height:36px; padding-block:8px; font-size:12px; }
#root main:not([data-reader='true']) { padding:16px var(--mv-space) 20px; }
main > div:not(.mv-home) h1 { font-size:clamp(22px,2.3vw,29px); line-height:1.25; }
main nav[aria-label='Breadcrumb'] { margin-bottom:8px; font-size:11px; }
main nav[aria-label='Breadcrumb'] a { min-height:24px; }
main :where([class~='rounded-3xl']) { border-radius:16px; }
main :where([class~='rounded-2xl']) { border-radius:12px; }
main :where([class~='p-6']) { padding:18px; }
main :where([class~='p-8']) { padding:20px; }
main :where([class~='gap-6']) { gap:16px; }
main :where([class~='gap-8']) { gap:20px; }
main :where([class~='mb-6']) { margin-bottom:16px; }
main :where([class~='mb-8']) { margin-bottom:20px; }
main[data-route='/stories'] > div,main[data-route='/library'] > div,main[data-route='/discover'] > div { max-width:none; padding-inline:0; padding-bottom:16px; }
main[data-route='/settings'] > div,main[data-route='/profile'] > div { padding-inline:0; }
main:not([data-reader='true']) :where(input:not([type='range']):not([type='checkbox']):not([type='radio']),select) { min-height:36px; font-size:13px; }
main:not([data-reader='true']) :where(button):not([role='switch']):not(.mv-icon-button) { min-height:32px; }
main[data-route='/settings'] [role='tablist'] { padding:3px; gap:4px; border-radius:10px; }
main[data-route='/settings'] [role='tab'] { padding:7px 12px; font-size:12px; }
/* Homepage: shorter masthead, a purposeful feature card, and a denser discovery feed. */
.mv-home { gap:24px; }
.mv-welcome { align-items:center; gap:16px; padding:0; }
.mv-welcome h1 { margin-top:5px; font-size:clamp(24px,2.5vw,34px); }
.mv-welcome .mv-eyebrow { font-size:9px; letter-spacing:.11em; }
.mv-welcome-note { font-size:11px; line-height:1.6; }
.mv-feature-layout { grid-template-columns:minmax(0,1fr) 220px; gap:12px; margin-top:-8px; }
.mv-feature { min-height:250px; grid-template-columns:minmax(0,1fr) 176px; }
.mv-feature-copy { padding:20px 0 16px 22px; }
.mv-feature-kicker { gap:8px; margin-bottom:10px; }
.mv-feature h2 { font-size:clamp(22px,2vw,28px); line-height:1.3; }
.mv-feature-author { margin-top:7px!important; font-size:11px; }
.mv-feature-synopsis { margin-top:8px!important; font-size:12px; line-height:1.7; -webkit-line-clamp:2; }
.mv-feature-actions { margin-top:14px; gap:14px; }
.mv-button { min-height:34px; padding:7px 12px; font-size:11px; border-radius:8px; }
.mv-feature-pagination { padding-top:10px; }
.mv-feature-pagination > div { gap:4px; }
.mv-icon-button { width:30px; height:30px; min-height:30px!important; font-size:14px; }
.mv-text-link { min-height:30px; font-size:11px; }
.mv-feature-art { padding:22px 12px; }
.mv-feature-cover { width:112px; }
.mv-art-caption { font-size:8px; margin-top:20px; letter-spacing:.1em; }
.mv-art-star { top:14px; right:20px; font-size:20px; }
.mv-orbit { width:210px; height:210px; }
.mv-orbit-two { width:270px; height:270px; }
.mv-ritual { padding:20px; border-radius:14px; }
.mv-ritual-symbol { font-size:30px; margin-bottom:12px; }
.mv-ritual .mv-eyebrow { font-size:8px; }
.mv-ritual h2 { font-size:20px; margin-top:7px; }
.mv-ritual > p:not(.mv-eyebrow) { font-size:11px; line-height:1.65; margin:10px 0 14px; }
.mv-ritual .mv-button { font-size:10px; }
.mv-ritual .mv-text-link { margin-top:4px; min-height:24px; }
.mv-genres { gap:8px; margin-top:-12px; }
.mv-genre { padding:10px 12px; gap:9px; border-radius:10px; }
.mv-genre-symbol { font-size:22px; width:22px; }
.mv-genre strong { font-size:11px; }
.mv-genre > span:nth-child(2) > span { font-size:9px; margin-top:3px; }
.mv-section-heading { margin-bottom:12px; gap:12px; align-items:center; }
.mv-section-heading h2 { margin-top:4px; font-size:20px; }
.mv-section-heading .mv-eyebrow { font-size:8px; }
.mv-section-description { font-size:11px; margin-top:4px!important; }
.mv-story-rail { gap:12px; grid-auto-columns:calc((100% - 60px)/6); padding-bottom:8px; }
.mv-story-card { border-radius:10px; }
.mv-story-card > .book-spine { aspect-ratio:3/4; }
.mv-story-card > div:last-child { padding:9px 10px; gap:7px; }
.mv-story-card > div:last-child > div:first-child > a { font-size:12px; line-height:1.4; min-height:2.8em; }
.mv-story-card > div:last-child > div:first-child > p { font-size:10px; }
.mv-story-card > div:last-child > div:last-child { padding-top:5px; font-size:10px; }
.mv-filter-tabs { margin:-2px 0 10px; gap:4px; }
.mv-filter { min-height:30px!important; padding:5px 12px; border-radius:7px; font-size:11px; }
.mv-release-grid { gap:8px; }
.mv-release { padding:12px; gap:10px; border-radius:10px; }
.mv-release h3 { font-size:12px; line-height:1.5; margin:3px 0; -webkit-line-clamp:1; }
.mv-release-meta { font-size:10px; }
.mv-collection-grid { gap:10px; }
.mv-collection { display:grid; grid-template-columns:76px minmax(0,1fr); gap:5px 12px; padding:12px; border-radius:12px; align-items:start; }
.mv-collection-art { grid-column:1; grid-row:1/5; width:76px; height:118px; margin:0; border-radius:7px; overflow:hidden; }
.mv-collection-art img { width:45px; height:68px; margin:0 -14px; flex-shrink:0; }
.mv-collection h3 { font-family:inherit; font-weight:650; font-size:13px; line-height:1.4; margin:0; }
.mv-collection > .mv-eyebrow { font-size:8px; letter-spacing:.07em; }
.mv-collection > p { font-size:11px; line-height:1.6; margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.mv-collection > .mv-text-link { font-size:10px; margin:0; min-height:25px; }
.mv-themes { padding:18px; border-radius:12px; gap:20px; }
.mv-themes h2 { font-size:19px; width:200px; margin-top:6px; }
.mv-theme-links { gap:7px; }
.mv-theme-link { padding:7px 11px; font-size:10px; }
.mv-footer { margin-top:8px; }
.mv-footer-inner { padding:20px var(--mv-space) 14px; gap:16px; }
.mv-footer-brand > a { font-size:12px; }
.mv-footer-brand p { margin-top:6px; font-size:11px; line-height:1.6; white-space:normal; }
.mv-footer nav { font-size:11px; gap:10px 18px; }
.mv-footer-bottom { padding-top:12px; gap:16px; font-size:9px; }
/* Library: remove nested containers and replace cover showcases with useful, compact tiles. */
.mv-library { display:flex; flex-direction:column; gap:10px; }
.mv-library > * { margin-block:0!important; }
.mv-library > section:first-of-type { padding:10px 0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.mv-library > section:first-of-type::after { display:none; }
.mv-library > section:first-of-type h1 { font-size:25px; }
.mv-library > section:first-of-type p { font-size:11px; }
.mv-library > div.grid.grid-cols-3 { width:fit-content; max-width:100%; padding:3px; border-radius:9px; gap:3px; }
.mv-library > div.grid.grid-cols-3 button { padding:6px 12px; font-size:11px; }
.mv-library > div.grid.grid-cols-3 button[class*='bg-indigo-600'] { background:var(--primary); }
.mv-library > div:has(.mv-library-collection-grid) > div > .grid.grid-cols-3 { width:fit-content; max-width:100%; }
.mv-library h2 { font-size:14px; }
.mv-library-collection-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,310px),1fr)); gap:10px; }
.mv-library-collection { display:grid; grid-template-columns:62px minmax(0,1fr); align-items:start; gap:12px; min-width:0; padding:12px; border:1px solid var(--border); background:var(--card); border-radius:12px; box-shadow:0 2px 4px #30244603; transition:border-color .15s,box-shadow .15s; }
.mv-library-collection:hover { border-color:color-mix(in srgb,var(--primary) 55%,var(--border)); box-shadow:0 3px 12px #30244608; }
main button.mv-library-covers { position:relative; width:62px; height:88px; min-height:88px; padding:0; margin-top:2px; border:0; background:transparent; cursor:pointer; overflow:visible; }
.mv-library-covers img { position:absolute; left:calc(var(--cover-index)*6px); top:calc(var(--cover-index)*4px); width:48px; height:72px; object-fit:cover; border-radius:4px; border:1px solid var(--border); box-shadow:1px 3px 6px #0002; z-index:calc(3 - var(--cover-index)); }
.mv-library-covers > span { display:grid; place-items:center; width:54px; height:76px; color:var(--primary); font-size:28px; background:var(--muted); border-radius:7px; }
.mv-library-collection-info { min-width:0; }
.mv-library-collection-meta { display:flex; align-items:center; gap:8px; color:var(--muted-foreground); font-size:10px; line-height:1.5; margin-bottom:4px; }
main button.mv-visibility { min-height:24px; min-width:0; padding:2px 7px; font-size:9px; font-weight:600; color:var(--primary); background:color-mix(in srgb,var(--primary) 7%,transparent); border:1px solid color-mix(in srgb,var(--primary) 17%,transparent); border-radius:5px; cursor:pointer; }
.mv-shared-label { color:var(--primary); font-size:9px; }
main button.mv-library-title { display:block; min-height:0; min-width:0; width:100%; padding:0; margin:0; text-align:left; border:0; background:transparent; cursor:pointer; color:var(--foreground); }
.mv-library-title h3 { font-size:13px; line-height:1.45; font-weight:700; letter-spacing:-.02em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.mv-library-title:hover { color:var(--primary); }
.mv-library-summary { font-size:11px; line-height:1.6; color:var(--muted-foreground); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:4px 0 0; }
.mv-library-curator { font-size:10px; color:var(--muted-foreground); margin-top:4px; }
.mv-library-collection-actions { display:flex; align-items:center; gap:5px; margin-top:7px; border-top:1px solid color-mix(in srgb,var(--border) 70%,transparent); padding-top:4px; }
main button.mv-library-open { color:var(--primary); font-size:10px; font-weight:650; min-height:28px; padding:0; margin-right:auto; background:transparent; border:0; cursor:pointer; }
main button.mv-library-icon { min-width:28px; min-height:28px; width:28px; height:28px; display:grid; place-items:center; color:var(--muted-foreground); background:transparent; padding:5px; border:0; border-radius:6px; cursor:pointer; }
main button.mv-library-icon:hover { background:var(--muted); color:var(--primary); }
main button.mv-library-icon.mv-remove:hover { color:var(--destructive); }
/* Compact dialogs and secondary page surfaces. Reader prose keeps its own preferences. */
[role='dialog'][aria-modal='true'] > div { border-radius:16px; }
[role='dialog']:not([data-mv-panel]) :where([class~='p-6']) { padding:20px; }
[role='dialog']:not([data-mv-panel]) :where([class~='space-y-6']) { row-gap:16px; }
.mv-preview-notice { padding:9px 12px; margin-bottom:14px; font-size:11px; border-radius:9px; }
@media(min-width:760px) and (max-width:1023px) {
 .mv-feature-layout { grid-template-columns:minmax(0,1fr) 192px; }
 .mv-feature { grid-template-columns:minmax(0,1fr) 142px; }
 .mv-ritual { display:flex; flex-direction:column; align-items:flex-start; padding:16px; gap:0; }
 .mv-ritual-symbol { display:block; }
 .mv-ritual h2 { font-family:var(--mv-serif); font-size:18px; font-weight:400; margin-top:7px; }
 .mv-ritual > p:not(.mv-eyebrow) { display:block; margin:8px 0 12px; font-size:10px; }
 .mv-ritual .mv-button { margin-top:auto; }
 .mv-ritual .mv-text-link { margin-top:4px; align-self:center; }
 .mv-feature-cover { width:96px; }
 .mv-story-rail { grid-auto-columns:calc((100% - 48px)/5); }
 .mv-collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:759px) {
 header > div:first-child { height:52px; padding-inline:12px; gap:8px; }
 header button { min-height:32px; }
 #root main:not([data-reader='true']) { padding-top:12px; }
 .mv-home { gap:20px; }
 .mv-welcome { padding:0; }
 .mv-welcome h1 { font-size:27px; line-height:1.25; margin-top:5px; }
 .mv-welcome h1 em { display:inline; }
 .mv-feature-layout { grid-template-columns:minmax(0,1fr); gap:10px; margin-top:-6px; }
 .mv-feature { grid-template-columns:minmax(0,1fr) 138px; min-height:222px; }
 .mv-feature-copy { padding:16px 0 12px 16px; }
 .mv-feature h2 { font-size:22px; }
 .mv-feature-kicker { margin-bottom:8px; }
 .mv-feature-kicker .mv-eyebrow { font-size:8px; }
 .mv-feature-author { margin-top:5px!important; font-size:10px; }
 .mv-feature-synopsis { font-size:11px; -webkit-line-clamp:2; line-height:1.65; margin-top:7px!important; }
 .mv-feature-art { padding:22px 8px; justify-content:center; }
 .mv-feature-cover { width:90px; }
 .mv-art-star { top:12px; right:20px; font-size:16px; }
 .mv-art-caption { display:none; }
 .mv-feature-pagination { padding-top:8px; }
 .mv-feature-actions { margin-top:10px; }
 .mv-feature-actions .mv-button { font-size:10px; padding:7px 10px; }
 .mv-ritual { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3px 10px; padding:11px 14px; align-items:center; }
 .mv-ritual-symbol,.mv-ritual > p:not(.mv-eyebrow),.mv-ritual .mv-text-link { display:none; }
 .mv-ritual .mv-eyebrow { grid-column:1; grid-row:1; font-size:8px; }
 .mv-ritual h2 { grid-column:1; grid-row:2; font:600 12px/1.5 var(--font-sans); margin:0; }
 .mv-ritual .mv-button { grid-column:2; grid-row:1/3; padding:7px 9px; min-height:34px; margin:0; font-size:9px; width:auto; }
 .mv-genres { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-top:-10px; }
 .mv-genre { padding:9px 10px; min-height:42px; gap:8px; border-radius:9px; }
 .mv-genre > span:nth-child(2) > span { display:none; }
 .mv-genre strong { font-size:11px; }
 .mv-genre-symbol { width:20px; font-size:20px; }
 .mv-section-heading { margin-bottom:10px; gap:10px; }
 .mv-section-heading h2 { font-size:18px; }
 .mv-section-heading > .mv-text-link,.mv-heading-actions .mv-text-link { font-size:10px; }
 .mv-section-description { display:none; }
 .mv-story-rail { grid-auto-columns:calc((100% - 20px)/3.15); gap:10px; }
 .mv-release-grid { grid-template-columns:minmax(0,1fr); }
 .mv-release { padding:10px 12px; }
 .mv-collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .mv-collection { grid-template-columns:56px minmax(0,1fr); gap:5px 9px; padding:10px; }
 .mv-collection-art { width:56px; height:112px; }
 .mv-collection-art img { width:40px; height:60px; }
 .mv-collection h3 { font-size:12px; }
 .mv-collection > p { font-size:10px; }
 .mv-themes { padding:14px; gap:12px; }
 .mv-themes h2 { font-size:18px; width:auto; }
 .mv-footer { padding-bottom:66px; }
 .mv-footer-inner { padding-top:16px; gap:12px; }
 .mv-footer-bottom { padding-top:10px; gap:12px; }
 .mv-library > section:first-of-type { padding:5px 0; align-items:flex-start; }
 .mv-library > section:first-of-type h1 { font-size:23px; }
 .mv-library > section:first-of-type > div:last-child { padding:5px 7px; font-size:10px; gap:6px; }
 .mv-library > section:first-of-type p { max-width:38ch; font-size:10px; }
 .mv-library > div.grid.grid-cols-3 { width:100%; }
 .mv-library > div.grid.grid-cols-3 button { padding:5px 7px; font-size:10px; }
 .mv-library-collection-grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,285px),1fr)); }
 nav[aria-label='Mobile'] { padding-top:2px; padding-bottom:max(5px,env(safe-area-inset-bottom)); }
 nav[aria-label='Mobile'] a { min-height:45px; }
}
@media(max-width:479px) {
 .mv-welcome h1 { font-size:25px; }
 .mv-welcome h1 em { display:block; font-size:.88em; }
 .mv-feature { grid-template-columns:minmax(0,1fr) 94px; min-height:0; }
 .mv-feature h2 { font-size:20px; }
 .mv-feature-copy { padding-left:14px; }
 .mv-feature-cover { width:66px; }
 .mv-feature-art { padding:18px 6px 18px 0; }
 .mv-orbit { width:145px; height:145px; top:auto; }
 .mv-orbit-two { width:190px; height:190px; top:auto; }
 .mv-feature-kicker .mv-pill { display:none; }
 .mv-feature-pagination .mv-icon-button { width:28px; height:28px; min-height:28px!important; }
 .mv-story-rail { grid-auto-columns:calc((100% - 10px)/2.35); }
 .mv-collection-grid { grid-template-columns:minmax(0,1fr); }
 .mv-collection { grid-template-columns:64px minmax(0,1fr); }
 .mv-collection-art { width:64px; height:108px; }
 .mv-library > section:first-of-type { flex-wrap:wrap; gap:6px; }
 .mv-library > section:first-of-type > div:last-child { border:0; padding:0; background:none; }
 .mv-library .mv-library-collection-grid { grid-template-columns:minmax(0,1fr); }
 .mv-library-collection { gap:10px; padding:11px; }
 .mv-library > div.grid.grid-cols-3 button { gap:4px; }
}
@media(pointer:coarse) {
 header button { min-height:36px; }
 .mv-button { min-height:38px; }
 .mv-library-collection-actions { padding-block:2px; }
 main button.mv-library-icon { width:34px; height:34px; min-height:34px; }
 main button.mv-library-open { min-height:34px; }
 main button.mv-visibility { min-height:28px; padding-inline:9px; }
 main button.mv-library-title { min-height:28px; }
 nav[aria-label='Mobile'] a { min-height:48px; }
}
/* These text actions intentionally use their own compact sizes instead of toolbar minima. */
main[data-route='/library'] .mv-library-collection button.mv-library-title { min-height:24px; }
main[data-route='/library'] .mv-library-collection button.mv-visibility { min-height:24px; }
main[data-route='/library'] .mv-library-collection button.mv-library-open,main[data-route='/library'] .mv-library-collection button.mv-library-icon { min-height:28px; }
.mv-library > div:has(> .mv-library-collection-grid) { padding-top:8px; }
.mv-library > div > div:has(> .mv-library-collection-grid) { margin-top:12px; padding-top:10px; }
@media(pointer:coarse) { main[data-route='/library'] .mv-library-collection button.mv-visibility { min-height:28px; } main[data-route='/library'] .mv-library-collection button.mv-library-open,main[data-route='/library'] .mv-library-collection button.mv-library-icon { min-height:34px; } main[data-route='/library'] .mv-library-collection button.mv-library-title { min-height:28px; } }
.mv-library { gap:8px; position:relative; }
.mv-library > section:first-of-type { padding-block:3px 5px; }
.mv-library > div:has(> div > .mv-library-collection-grid) { display:flex; flex-direction:column; gap:12px; }
.mv-library > div:has(> div > .mv-library-collection-grid) > * { margin-block:0!important; }
.mv-library > div > div:has(> .mv-library-collection-grid) { display:flex; flex-direction:column; gap:8px; }
.mv-library > div > div:has(> .mv-library-collection-grid) > * { margin-block:0!important; }
.mv-library > div > div:has(> .mv-library-collection-grid) > div:first-child { gap:8px; }
.mv-library > div > div:has(> .mv-library-collection-grid) > div:first-child p { font-size:11px; line-height:1.5; }
@media(min-width:900px) {
 .mv-library { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px 16px; }
 .mv-library > nav { grid-column:1/-1; }
 .mv-library > section:first-of-type { grid-column:1; min-width:0; }
 .mv-library > section:first-of-type > div:last-child { position:absolute; right:0; top:2px; padding:0; border:0; background:none; font-size:10px; }
 .mv-library > div.grid.grid-cols-3 { grid-column:2; }
 .mv-library > div:not(.grid) { grid-column:1/-1; }
}
/* Shared cover fans become thumbnail previews rather than oversized showcases. */
.mv-book-stack[data-stack-size='sm'] { height:80px; }
.mv-book-stack[data-stack-size='sm'] [role='button'] { width:40px; }
.mv-book-stack[data-stack-size='md'] { height:120px; }
.mv-book-stack[data-stack-size='md'] [role='button'] { width:64px; }
.mv-book-stack[data-stack-size='lg'] { height:160px; }
.mv-book-stack[data-stack-size='lg'] [role='button'] { width:88px; }
.mv-book-stack [aria-label^='Previous story'],.mv-book-stack [aria-label^='Next story'] { width:26px; min-width:26px; min-height:26px!important; height:26px; }
.mv-book-stack [role='button']:focus-visible { outline-offset:2px!important; }
.mv-discovery-card { padding:12px; gap:10px; border-radius:12px; }
.mv-discovery-card > div:first-child { display:grid; grid-template-columns:100px minmax(0,1fr); align-items:start; gap:12px; }
.mv-discovery-card > div:first-child > * { margin-block:0!important; }
.mv-discovery-card .mv-book-stack { width:100px; height:130px; overflow:hidden; border:0; padding:0; }
.mv-discovery-card .mv-book-stack [role='button'] { width:50px; }
.mv-discovery-card .mv-book-stack [class*='top-2'] { display:none; }
.mv-discovery-card h3 { font-size:13px; line-height:1.45; }
.mv-discovery-card > div:last-child { padding-top:8px; }
@media(min-width:900px) { main[data-route='/discover'] > div > div.grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } }
@media(max-width:639px) {
 .mv-discovery-card > div:first-child { grid-template-columns:80px minmax(0,1fr); gap:10px; }
 .mv-discovery-card .mv-book-stack { width:80px; height:120px; }
 .mv-discovery-card .mv-book-stack [role='button'] { width:44px; }
}
.mv-library-heading { margin:0; font-size:13px; line-height:1.45; font-weight:700; letter-spacing:-.02em; }
.mv-library-heading .mv-library-title { font:inherit; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media(min-width:760px) { .mv-ritual { position:relative; } .mv-ritual-symbol { position:absolute; right:16px; top:14px; font-size:25px; margin:0; } .mv-ritual .mv-eyebrow { padding-right:24px; } .mv-ritual h2 { font-size:18px; margin-top:10px; } .mv-ritual > p:not(.mv-eyebrow) { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } }
/* Reading-directory layout inspired by the reference's catalog and update structure. */
:root { --mv-page:1280px; }
header > div:first-child { height:50px; }
#root main:not([data-reader='true']) { padding-top:12px; padding-bottom:16px; }
.mv-index { display:flex; flex-direction:column; gap:16px; }
.mv-index h1,.mv-index h2,.mv-index h3,.mv-index p { margin:0; }
.mv-index-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; min-width:0; }
.mv-index-heading { display:flex; align-items:baseline; gap:12px; min-width:0; }
.mv-index .mv-index-heading h1 { font-size:20px; line-height:1.3; font-weight:750; letter-spacing:-.03em; }
.mv-index-heading > span { font-size:11px; color:var(--muted-foreground); }
.mv-index-section-head > h2,.mv-index-tags h2 { font-size:15px; font-weight:750; letter-spacing:-.02em; }
.mv-index-tools { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.mv-index-link { display:inline-flex; align-items:center; min-height:28px; font-size:11px; color:var(--primary); font-weight:600; }
main .mv-index-daily { min-height:28px!important; padding:5px 9px; border:1px solid var(--border); background:var(--card); border-radius:6px; color:var(--primary); font-size:10px; font-weight:600; cursor:pointer; }
.mv-index-feature-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:12px; }
.mv-index-book { min-width:0; display:block; }
.mv-index-cover { height:clamp(140px,14vw,176px); border-radius:7px; position:relative; overflow:hidden; background:var(--muted); border:1px solid var(--border); }
.mv-index-cover img { height:100%; width:100%; object-fit:cover; transition:transform .2s; }
.mv-index-book:hover img { transform:scale(1.03); }
.mv-index-chapters { position:absolute; bottom:5px; right:5px; color:white; font-size:9px; line-height:1.5; background:#161225d9; padding:2px 5px; border-radius:4px; }
.mv-index-adult { position:absolute; top:5px; left:5px; color:white; font-size:9px; background:#a62646; padding:2px 4px; border-radius:4px; }
.mv-index-book h2 { font-size:12px; line-height:1.45; font-weight:650; margin-top:7px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.9em; }
.mv-index-book:hover h2 { color:var(--primary); }
.mv-index-book-meta { display:flex; justify-content:space-between; gap:6px; color:var(--muted-foreground); font-size:10px; margin-top:4px; }
.mv-index-genres { display:flex; flex-wrap:wrap; gap:6px; padding:9px 0; border-block:1px solid var(--border); }
.mv-index-genre { display:inline-flex; align-items:center; justify-content:center; min-height:27px; padding:4px 9px; border-radius:5px; border:1px solid var(--border); background:var(--card); color:var(--muted-foreground); font-size:10px; font-weight:500; }
.mv-index-genre:hover { color:var(--primary); border-color:var(--primary); }
.mv-index-columns { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:20px; align-items:start; }
.mv-index-filters { display:flex; gap:3px; }
main .mv-index-filters button { min-height:27px!important; padding:4px 9px; color:var(--muted-foreground); background:transparent; border-radius:5px; font-size:10px; cursor:pointer; }
.mv-index-filters button.is-active { background:var(--primary); color:var(--primary-foreground); }
.mv-index-update-list { border-top:1px solid var(--border); }
.mv-index-update { display:flex; align-items:center; gap:10px; padding:8px 3px; border-bottom:1px solid var(--border); min-width:0; }
.mv-index-update:hover { background:color-mix(in srgb,var(--primary) 4%,transparent); }
.mv-index-update > img { width:27px; height:36px; object-fit:cover; border-radius:3px; flex-shrink:0; }
.mv-index-update-copy { display:flex; flex-direction:column; min-width:0; flex:1; gap:2px; }
.mv-index-update-copy strong { font-size:12px; line-height:1.45; font-weight:650; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mv-index-update-copy > span { font-size:11px; line-height:1.45; color:var(--muted-foreground); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mv-index-update-data { display:flex; align-items:center; gap:14px; font-size:10px; color:var(--muted-foreground); white-space:nowrap; }
.mv-index-update-data > span:first-child { width:80px; text-align:right; }
.mv-index-update-data > span:last-child { width:58px; text-align:right; }
.mv-index-price { color:var(--primary); }
.mv-index-free { color:var(--muted-foreground); }
.mv-index-popular { padding:0 0 0 16px; border-left:1px solid var(--border); }
.mv-index-popular ol { list-style:none; padding:0; margin:0; }
.mv-index-popular li > a { display:flex; gap:8px; align-items:center; padding:8px 0; border-bottom:1px solid var(--border); }
.mv-index-rank { color:var(--primary); font-size:11px; font-weight:750; width:18px; flex-shrink:0; }
.mv-index-popular li img { width:26px; height:36px; object-fit:cover; border-radius:3px; flex-shrink:0; }
.mv-index-popular-copy { min-width:0; }
.mv-index-popular-copy > strong { font-size:11px; font-weight:650; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.mv-index-popular-copy > span { display:block; color:var(--muted-foreground); font-size:9px; margin-top:3px; }
.mv-index-collection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.mv-index-collection { display:flex; gap:12px; padding:12px; border:1px solid var(--border); background:var(--card); border-radius:8px; min-width:0; }
.mv-index-mini-covers { width:47px; height:64px; position:relative; flex-shrink:0; }
.mv-index-mini-covers img { width:36px; height:48px; object-fit:cover; position:absolute; top:calc(var(--index)*4px); left:calc(var(--index)*5px); z-index:calc(3 - var(--index)); border-radius:3px; box-shadow:1px 2px 4px #0003; }
.mv-index-collection > div:last-child { min-width:0; }
.mv-index-collection h3 { font-size:12px; font-weight:650; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.mv-index-collection p { font-size:10px; line-height:1.6; color:var(--muted-foreground); margin-top:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.mv-index-collection > div:last-child > span { display:block; font-size:9px; color:var(--primary); margin-top:5px; }
.mv-index-tags { display:flex; align-items:center; gap:16px; padding-top:10px; border-top:1px solid var(--border); }
.mv-index-tags > div { display:flex; flex-wrap:wrap; gap:6px; }
.mv-index-empty { padding:16px 0; font-size:12px; color:var(--muted-foreground); }
/* Series information becomes an information header instead of a large display card. */
main .mv-story-page { max-width:none; padding:0 0 16px; display:flex; flex-direction:column; gap:12px; }
.mv-story-page > * { margin-block:0!important; }
.mv-story-overview { border-radius:10px; box-shadow:none; }
.mv-story-overview > .absolute { opacity:.3; }
.mv-story-masthead { padding:14px; gap:16px; flex-direction:row; }
.mv-story-masthead .mv-story-cover { width:108px; margin:0; border-radius:6px; box-shadow:0 2px 7px #0002; }
.mv-story-info { display:flex; flex-direction:column; gap:7px; }
.mv-story-info > * { margin-block:0!important; }
.mv-story-page .mv-story-overview h1 { font-size:24px; line-height:1.3; letter-spacing:-.035em; }
.mv-story-info > div > p { font-size:11px; }
.mv-story-stats { display:flex; flex-wrap:wrap; gap:6px 16px; padding:7px 0; border-width:1px 0; }
.mv-story-stats > div { display:flex; align-items:baseline; gap:5px; padding:0; border:0!important; border-radius:0; background:transparent!important; box-shadow:none; overflow:visible; }
.mv-story-stats > div > * { margin-block:0!important; }
.mv-story-stats > div > span { font-size:9px!important; font-weight:500; letter-spacing:0; text-transform:none; }
.mv-story-stats svg { display:none; }
.mv-story-stats strong,.mv-story-stats > div > div { font-size:11px; }
.mv-story-info > div:has(> svg) { padding:5px 8px; border-radius:5px; font-size:10px; }
.mv-story-actions { padding-top:1px; gap:5px; }
.mv-story-actions > :where(a,button),.mv-story-actions > div > button { padding:6px 10px; min-height:30px!important; border-radius:6px; font-size:11px; }
.mv-story-actions > a { flex:0 1 auto; }
.mv-story-relations { padding-top:5px; }
.mv-story-relations > summary { cursor:pointer; font-size:10px; color:var(--muted-foreground); min-height:24px; list-style:disclosure-closed inside; }
.mv-story-relations[open] > summary { list-style-type:disclosure-open; margin-bottom:6px; }
.mv-story-relations > summary > svg { display:none; }
.mv-story-page > .grid { gap:12px; }
.mv-story-page .mv-story-synopsis,.mv-story-page .mv-story-chapters { padding:12px; border-radius:9px; }
.mv-story-synopsis > div:first-child { padding-bottom:6px; }
.mv-story-synopsis > div:first-child > span { display:none; }
.mv-story-synopsis > div:first-child > div > div { display:none; }
.mv-story-synopsis > div:first-child h3 { font-size:12px; text-transform:none; }
.mv-story-synopsis > * + * { margin-top:8px!important; }
.mv-story-synopsis .whitespace-pre-line { font-size:12px; line-height:1.65; }
.mv-story-extra { padding-top:7px; border-top:1px solid var(--border); }
.mv-story-extra > summary { cursor:pointer; font-size:11px; color:var(--primary); font-weight:600; min-height:25px; }
.mv-story-extra > div { margin-top:10px; }
.mv-story-chapters > * + * { margin-top:8px!important; }
.mv-story-chapters [id^='chapter-'] > a > div,.mv-story-chapters [id^='chapter-'] > button > div { min-height:30px; padding-block:5px; border-radius:4px; }
.mv-story-chapters .space-y-1\.5 > * + * { margin-top:3px; }
.mv-story-page details > summary:focus-visible { outline:2px solid var(--primary); outline-offset:3px; border-radius:4px; }
@media(min-width:1024px) { .mv-story-page > .grid { grid-template-columns:minmax(0,1fr) 280px; } .mv-story-page > .grid > div { grid-column:auto; } }
@media(max-width:959px) {
 .mv-index-feature-grid { grid-auto-flow:column; grid-template-columns:none; grid-auto-columns:calc((100% - 48px)/5.2); overflow-x:auto; gap:10px; padding-bottom:6px; scrollbar-width:thin; scroll-snap-type:x mandatory; }
 .mv-index-book { scroll-snap-align:start; }
 .mv-index-cover { height:160px; }
 .mv-index-columns { grid-template-columns:minmax(0,1fr) 240px; gap:14px; }
 .mv-index-update-data { flex-direction:column; gap:3px; align-items:flex-end; }
 .mv-index-update-data > span { width:auto!important; }
 .mv-index-heading > span { display:none; }
 .mv-index-collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:699px) {
 .mv-index { gap:12px; }
 .mv-index-section-head { gap:8px; margin-bottom:8px; }
 .mv-index .mv-index-heading h1 { font-size:18px; }
 .mv-index-tools { gap:6px; }
 .mv-index-tools > .mv-index-link { display:none; }
 .mv-index-feature-grid { grid-auto-columns:calc((100% - 24px)/3.2); gap:8px; }
 .mv-index-cover { height:138px; }
 .mv-index-book h2 { font-size:11px; }
 .mv-index-book-meta { font-size:9px; }
 .mv-index-columns { grid-template-columns:minmax(0,1fr); gap:16px; }
 .mv-index-popular { border-left:0; padding-left:0; }
 .mv-index-popular ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 14px; }
 .mv-index-update { padding-block:7px; gap:8px; }
 .mv-index-update-copy strong { font-size:11px; }
 .mv-index-update-copy > span { font-size:10px; }
 .mv-index-update-data { font-size:9px; }
 .mv-index-collection-grid { grid-template-columns:minmax(0,1fr); }
 .mv-index-tags { flex-direction:column; align-items:flex-start; gap:8px; }
 .mv-index-section-head > h2,.mv-index-tags h2 { font-size:14px; }
 .mv-story-masthead { padding:11px; gap:11px; }
 .mv-story-masthead .mv-story-cover { width:76px; }
 .mv-story-page .mv-story-overview h1 { font-size:20px; }
 .mv-story-stats { gap:4px 10px; }
 .mv-story-stats > div > span { font-size:9px!important; }
 .mv-story-stats strong { font-size:10px; }
 .mv-story-info > div:has(> svg) { font-size:9px; }
 .mv-story-actions { margin-left:-87px!important; padding-top:6px; }
 .mv-story-actions > :where(a,button),.mv-story-actions > div > button { font-size:10px; padding-inline:8px; }
 .mv-story-relations { margin-left:-87px!important; }
 .mv-story-extra > summary { font-size:10px; }
 .mv-library > section:first-of-type p { display:none; }
 .mv-library > section:first-of-type { padding-block:0; }
 .mv-library > section:first-of-type > div:last-child { font-size:9px; }
}
@media(max-width:379px) { .mv-index-feature-grid { grid-auto-columns:calc((100% - 20px)/2.65); } .mv-index-cover { height:128px; } .mv-story-page .mv-story-overview h1 { font-size:18px; } .mv-story-masthead .mv-story-cover { width:62px; } .mv-story-actions,.mv-story-relations { margin-left:-73px!important; } }
@media(pointer:coarse) { main .mv-index-daily,main .mv-index-filters button { min-height:34px!important; } .mv-index-genre { min-height:32px; } .mv-story-actions > :where(a,button),.mv-story-actions > div > button { min-height:36px!important; } .mv-story-extra > summary,.mv-story-relations > summary { min-height:32px; } }
.mv-story-synopsis .line-clamp-3 { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
@media(min-width:1024px) { .mv-story-page > .grid > aside { grid-column:auto; min-width:0; } }
.mv-story-synopsis .line-clamp-2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
main .mv-story-synopsis button.mv-story-synopsis-more { min-height:24px!important; padding-top:0; font-size:10px; }
.mv-story-synopsis > * + * { margin-top:6px!important; }
.mv-story-chapters > div[class~='bg-primary/10'] { display:none; }
@media(min-width:760px) {
 .mv-story-chapters select[aria-label='Filter by volume'] { max-width:170px; }
}
@media(pointer:coarse) { main .mv-story-synopsis button.mv-story-synopsis-more { min-height:30px!important; } }

/* Two clean synopsis lines remain readable beside the expansion control. */
.mv-story-synopsis .bg-gradient-to-t.pointer-events-none { display:none; }

main button.mv-library-title { min-height:24px; }

/* Keep all reading actions together on phones, with named icon controls. */
@media(max-width:479px) {
 .mv-story-actions { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) repeat(3,30px); gap:5px; }
 .mv-story-actions > a:first-child,.mv-story-actions > div { min-width:0; }
 .mv-story-actions > a,.mv-story-actions > button { justify-content:center; padding-inline:5px; }
 .mv-story-actions > a[title*='EPUB'] span { display:none; }
 .mv-story-actions > div > button { padding-inline:5px; gap:3px; }
}


/* === Layer: moonverse-story.css === */
/* Series workspace: flat surfaces, direct links, and compact information hierarchy. */
.mv-series { min-width:0; display:flex; flex-direction:column; gap:12px; }
.mv-series :where(h1,h2,p,dl,dd) { margin:0; }
.mv-series-breadcrumb { display:flex; align-items:center; gap:7px; min-width:0; font-size:10px; color:var(--muted-foreground); }
.mv-series-breadcrumb > :last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mv-series-breadcrumb a { flex-shrink:0; }
.mv-series-breadcrumb a:hover,.mv-series-byline a:hover { color:var(--primary); }
.mv-series-intro { display:grid; grid-template-columns:78px minmax(0,1fr); align-items:start; column-gap:14px; row-gap:8px; padding:0 0 12px; border-bottom:1px solid var(--border); }
main button.mv-series-cover { width:78px; height:112px; min-height:112px; padding:0; border:1px solid var(--border); border-radius:5px; overflow:hidden; background:var(--muted); cursor:zoom-in; }
.mv-series-cover img { width:100%; height:100%; object-fit:cover; }
.mv-series-identity { min-width:0; display:flex; flex-direction:column; gap:6px; }
.mv-series-titleline { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.mv-series-titleline h1 { font-size:23px; font-weight:750; line-height:1.25; letter-spacing:-.035em; }
.mv-series-status { color:var(--primary); background:color-mix(in srgb,var(--primary) 8%,transparent); font-size:9px; padding:3px 6px; border-radius:4px; white-space:nowrap; }
.mv-series-adult { color:#b42a50; font-size:9px; font-weight:700; }
.mv-series-byline { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; font-size:11px; line-height:1.6; color:var(--muted-foreground); }
.mv-series-byline > :first-child { color:var(--foreground); font-weight:550; }
.mv-series-byline > a { color:var(--primary); font-size:10px; }
.mv-series-metrics { display:flex; flex-wrap:wrap; gap:5px 17px; font-size:10px; line-height:1.7; }
.mv-series-metrics > div { display:flex; gap:5px; align-items:baseline; }
.mv-series-metrics dt { color:var(--muted-foreground); }
.mv-series-metrics dd { font-weight:650; }
.mv-series-metrics > div:first-child dd { color:var(--primary); }
.mv-series-summary { display:flex; gap:12px; align-items:baseline; }
.mv-series-summary p { min-width:0; font-size:11px; line-height:1.7; color:var(--muted-foreground); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
main .mv-series-summary button { min-height:24px; padding:0; background:transparent; border:0; flex-shrink:0; color:var(--primary); font-size:10px; cursor:pointer; }
.mv-series .mv-story-actions { display:flex; flex-wrap:wrap; gap:5px; margin:0!important; padding:0; }
.mv-series .mv-story-actions > :where(a,button),.mv-series .mv-story-actions > div > button { min-height:29px!important; padding:5px 9px; border-radius:5px; font-size:10px; box-shadow:none; }
.mv-series .mv-story-actions > a:first-child,.mv-series .mv-story-actions > div { min-width:0; flex:0 1 auto; }
.mv-series-context { grid-column:2; display:flex; flex-wrap:wrap; gap:6px 16px; align-items:center; font-size:9px; color:var(--muted-foreground); }
.mv-series-genres { display:flex; flex-wrap:wrap; gap:7px; }
.mv-series-genres a { color:var(--primary); font-weight:600; }
.mv-series-warning { font-size:9px; color:var(--muted-foreground); }
.mv-series-shelf { font-size:9px; margin-left:auto; }
.mv-series-workspace { display:grid; grid-template-columns:minmax(0,1fr) 258px; gap:22px; align-items:start; }
.mv-series-main { min-width:0; }
.mv-series-tabs { display:flex; gap:20px; border-bottom:1px solid var(--border); margin-bottom:10px; }
main .mv-series-tabs button { display:flex; align-items:center; gap:6px; min-height:34px; padding:0 0 8px; border:0; border-bottom:2px solid transparent; border-radius:0; background:transparent; color:var(--muted-foreground); font-size:12px; font-weight:600; cursor:pointer; }
main .mv-series-tabs button[aria-selected='true'] { color:var(--primary); border-bottom-color:var(--primary); }
.mv-series-tabs button > span { padding:0 5px; border-radius:4px; background:var(--muted); font-size:9px; }
.mv-series-panel[hidden] { display:none!important; }
.mv-series-panel:focus-visible { outline:2px solid var(--primary); outline-offset:4px; }
.mv-series-panel > .mv-story-chapters,.mv-series-panel > .mv-story-synopsis { padding:0; background:transparent; border:0; border-radius:0; box-shadow:none; }
.mv-series-panel > .mv-story-chapters > * + * { margin-top:8px!important; }
.mv-series-panel .mv-story-chapters button,.mv-series-panel .mv-story-chapters input,.mv-series-panel .mv-story-chapters select { border-radius:5px; }
.mv-series-panel .mv-story-chapters [id^='chapter-'] > a > div,.mv-series-panel .mv-story-chapters [id^='chapter-'] > button > div { min-height:31px; padding-block:5px; }
.mv-series-panel .mv-story-extra { margin-top:10px; }
.mv-series-panel .mv-story-synopsis .whitespace-pre-line { font-size:12px; line-height:1.8; }
.mv-series-aside { min-width:0; border-left:1px solid var(--border); padding-left:16px; display:flex; flex-direction:column; gap:18px; }
.mv-series-section-title { display:flex; justify-content:space-between; align-items:center; gap:8px; margin:0 0 4px; min-height:30px; }
.mv-series-section-title h2,.mv-series-related h2 { font-size:12px; line-height:1.5; font-weight:700; letter-spacing:-.01em; }
.mv-series-section-title > :last-child { color:var(--muted-foreground); font-size:9px; }
.mv-series-section-title > a:last-child { color:var(--primary); }
.mv-series-collection,.mv-series-recommendation { display:flex; align-items:center; gap:9px; padding:8px 0; border-bottom:1px solid var(--border); min-width:0; }
.mv-series-collection img,.mv-series-recommendation img { width:27px; height:37px; object-fit:cover; border-radius:3px; flex-shrink:0; }
.mv-series-collection > div,.mv-series-recommendation > div { min-width:0; flex:1; }
.mv-series-collection strong,.mv-series-recommendation strong { font-size:11px; line-height:1.45; font-weight:600; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.mv-series-collection > div > span,.mv-series-recommendation > div > span { display:block; font-size:9px; color:var(--muted-foreground); margin-top:3px; }
.mv-series-collection > span { color:var(--primary); font-size:12px; }
.mv-series-collection:hover strong,.mv-series-recommendation:hover strong { color:var(--primary); }
.mv-series-related { margin-top:16px; border-top:1px solid var(--border); padding-top:12px; }
.mv-series-related > div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; }
.mv-series-related a { display:flex; align-items:center; gap:8px; padding:9px 0; border-bottom:1px solid var(--border); font-size:11px; min-width:0; }
.mv-series-related a > span:first-child { color:var(--muted-foreground); font-size:9px; width:66px; flex-shrink:0; }
.mv-series-related a > strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:550; }
.mv-series-related a > span:last-child { color:var(--primary); margin-left:auto; }
.mv-series-discussion > section { padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.mv-series-discussion :where(.p-3,.p-3\.5,.p-4) { padding:10px; border-radius:6px; }
.mv-series-discussion textarea { min-height:64px; }
/* A flat cover strip replaces every legacy 3D carousel. */
.mv-flat-books { display:flex; align-items:center; justify-content:flex-start; gap:7px; min-width:0; max-width:100%; overflow-x:auto; padding:3px 0; scrollbar-width:thin; }
.mv-flat-books > a { width:48px; height:68px; flex:0 0 48px; border:1px solid var(--border); border-radius:4px; overflow:hidden; }
.mv-flat-books > a img { width:100%; height:100%; object-fit:cover; }
.mv-flat-books > a:hover { outline:1px solid var(--primary); outline-offset:1px; }
.mv-flat-books-sm > a { width:33px; height:47px; flex-basis:33px; }
.mv-flat-books-lg > a { width:58px; height:82px; flex-basis:58px; }
.mv-flat-empty { font-size:11px; color:var(--muted-foreground); padding:12px 0; }
main .mv-flat-books button { min-width:28px; min-height:28px; padding:4px; border-radius:4px; background:var(--muted); color:var(--primary); font-size:10px; }
.mv-flat-books [hidden] { display:none!important; }
/* Single collection thumbnails keep small cards flat as well. */
.mv-library-covers img,.mv-index-mini-covers img { transform:none; position:static; top:auto; left:auto; box-shadow:none; }
.mv-library-covers img:not(:first-child),.mv-index-mini-covers img:not(:first-child) { display:none; }
.mv-library-covers img { width:48px; height:72px; }
.mv-index-mini-covers img { width:42px; height:60px; }
@media(max-width:999px) {
 .mv-series-workspace { grid-template-columns:minmax(0,1fr) 220px; gap:16px; }
 .mv-series-aside { padding-left:12px; }
 .mv-series-titleline h1 { font-size:21px; }
 .mv-series-summary { flex-wrap:wrap; gap:0; }
}
@media(max-width:759px) {
 .mv-series-workspace { grid-template-columns:minmax(0,1fr); gap:18px; }
 .mv-series-aside { border-left:0; border-top:1px solid var(--border); padding:10px 0 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
 .mv-series-titleline h1 { font-size:20px; }
 .mv-series-breadcrumb { font-size:9px; }
 .mv-series-intro { grid-template-columns:66px minmax(0,1fr); gap:9px 11px; }
 main button.mv-series-cover { width:66px; height:94px; min-height:94px; }
 .mv-series-byline { font-size:10px; gap:2px 8px; }
 .mv-series-byline > [lang] { display:none; }
 .mv-series-metrics { gap:3px 12px; font-size:10px; }
 .mv-series-summary { grid-column:1/-1; }
 .mv-series-identity .mv-series-summary { display:none; }
 .mv-series .mv-story-actions { padding-top:3px; }
 .mv-series-context { grid-column:1/-1; gap:5px 12px; }
 .mv-series-shelf { display:none; }
 .mv-series-tabs { gap:20px; }
 .mv-series-related > div { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:479px) {
 .mv-series { gap:10px; }
 .mv-series-titleline { gap:5px 7px; }
 .mv-series-titleline h1 { font-size:18px; }
 .mv-series-metrics { gap:2px 10px; }
 .mv-series-aside { grid-template-columns:minmax(0,1fr); }
 .mv-series-recommendations > div:last-child { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; }
 .mv-series-recommendation strong { font-size:10px; }
 .mv-series .mv-series-metrics > div:last-child { display:none; }
}
@media(pointer:coarse) {
 .mv-series .mv-story-actions > :where(a,button),.mv-series .mv-story-actions > div > button { min-height:34px!important; }
 main .mv-series-tabs button { min-height:40px; }
}

.mv-series-panel .mv-story-synopsis-more { display:none!important; }
/* The overview has its own restrained type scale. */
.mv-story-page .mv-series-titleline h1 { font-size:23px; line-height:1.25; }
@media(max-width:999px) { .mv-story-page .mv-series-titleline h1 { font-size:21px; } }
@media(max-width:759px) { .mv-story-page .mv-series-titleline h1 { font-size:20px; } }
@media(max-width:479px) { .mv-story-page .mv-series-titleline h1 { font-size:18px; } }

/* ==========================================================================
   FLOATING QUICK READING NAVIGATION DOCK (Cherrymist Inspired)
   Desktop: Fixed bottom-4, centered pill max-w-[560px], pointer-events-none container
   Mobile: Fixed inset-x-3 bottom-3 z-50, rounded-full, backdrop-blur-xl, safe-area-inset
   ========================================================================== */

/* 1. Desktop Dock Wrapper */
.mv-story-quick-nav-desktop {
  display: block !important;
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 1rem !important; /* bottom-4 */
  z-index: 40 !important;
  pointer-events: none !important;
  animation: mvFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

@media (max-width: 767px) {
  .mv-story-quick-nav-desktop {
    display: none !important;
  }
}

/* 2. Mobile Dock Wrapper */
.mv-story-quick-nav-mobile {
  display: block !important;
  position: fixed !important;
  left: 0.75rem !important; /* inset-x-3 */
  right: 0.75rem !important;
  bottom: 0.75rem !important; /* bottom-3 */
  z-index: 50 !important;
  animation: mvFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) both !important;
  padding-bottom: max(0px, calc(env(safe-area-inset-bottom) - 0.75rem)) !important;
}

@media (min-width: 768px) {
  .mv-story-quick-nav-mobile {
    display: none !important;
  }
}

/* 3. The Pill Card */
.mv-quick-nav-pill {
  width: 100% !important;
  max-width: 560px !important;
  margin-inline: auto !important;
  pointer-events: auto !important;
  border-radius: 9999px !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.38), 0 0 0 1px color-mix(in srgb, var(--primary) 12%, transparent) !important;
  display: flex !important;
  align-items: center !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-story-quick-nav-desktop .mv-quick-nav-pill {
  height: 64px !important;
  padding-inline: 12px !important;
}

.mv-story-quick-nav-mobile .mv-quick-nav-pill {
  height: 68px !important;
  padding-inline: 10px !important;
}

/* Inner elements container */
.mv-quick-nav-row {
  position: relative !important;
  width: 100% !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

@media (min-width: 768px) {
  .mv-quick-nav-row {
    gap: 10px !important;
  }
}

/* 4. Circular Progress Indicator (44x44) */
.mv-quick-nav-progress {
  position: relative !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  flex-shrink: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-progress:hover {
  transform: scale(1.06) !important;
}

.mv-quick-nav-progress:active {
  transform: scale(0.94) !important;
}

.mv-quick-nav-progress svg {
  transform: rotate(-90deg) !important;
  width: 44px !important;
  height: 44px !important;
}

.mv-quick-nav-progress .stroke-muted {
  stroke: color-mix(in srgb, var(--muted-foreground) 25%, transparent) !important;
}

.mv-quick-nav-progress .stroke-primary {
  stroke: var(--primary) !important;
  transition: stroke-dashoffset 0.5s ease-out !important;
}

.mv-quick-nav-progress span {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--primary) !important;
  letter-spacing: -0.02em !important;
}

/* 5. Primary Start / Continue Reading Button */
.mv-quick-nav-cta {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 9999px !important;
  background: var(--primary) !important;
  color: var(--primary-foreground, #0d0f14) !important;
  font-size: 13.5px !important;
  font-weight: 650 !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px -3px color-mix(in srgb, var(--primary) 50%, transparent) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-cta:hover {
  background: color-mix(in srgb, var(--primary) 92%, #fff) !important;
  transform: scale(1.02) !important;
  box-shadow: 0 6px 20px -3px color-mix(in srgb, var(--primary) 65%, transparent) !important;
}

.mv-quick-nav-cta:active {
  transform: scale(0.98) !important;
}

.mv-quick-nav-cta svg {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}

/* 6. Notification / Track Bell Button */
.mv-quick-nav-track {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  flex-shrink: 0 !important;
  border-radius: 9999px !important;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  color: var(--foreground) !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-track:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  transform: scale(1.02) !important;
}

.mv-quick-nav-track:active {
  transform: scale(0.98) !important;
}

.mv-quick-nav-track[aria-pressed="true"],
.mv-quick-nav-track.is-tracked {
  border-color: color-mix(in srgb, var(--primary) 55%, transparent) !important;
  background: color-mix(in srgb, var(--primary) 15%, transparent) !important;
  color: var(--primary) !important;
  box-shadow: 0 0 12px color-mix(in srgb, var(--primary) 25%, transparent) !important;
}

.mv-quick-nav-track svg {
  width: 16px !important;
  height: 16px !important;
}

/* 7. Library / Shelf Button */
.mv-quick-nav-library {
  height: 44px !important;
  min-height: 44px !important;
  flex-shrink: 0 !important;
  border-radius: 9999px !important;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  color: var(--foreground) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 13px !important;
  cursor: pointer !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-library:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  transform: scale(1.02) !important;
}

.mv-quick-nav-library:active {
  transform: scale(0.98) !important;
}

.mv-quick-nav-library.is-saved {
  border-color: color-mix(in srgb, var(--primary) 40%, transparent) !important;
  background: color-mix(in srgb, var(--primary) 14%, transparent) !important;
  color: var(--primary) !important;
}

.mv-quick-nav-library svg {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}

/* 8. Hide global mobile bottom nav on story detail pages to avoid obstruction */
body:has(.mv-story-quick-nav) nav[aria-label="Mobile"],
.mv-story-page-active nav[aria-label="Mobile"] {
  display: none !important;
}

/* Story page bottom padding clearance */
.mv-story-page,
.mv-series {
  padding-bottom: 96px !important;
}

@media (max-width: 767px) {
  .mv-story-page,
  .mv-series {
    padding-bottom: 110px !important;
  }
  .mv-quick-nav-cta {
    font-size: 12px !important;
    padding: 0 10px !important;
    gap: 5px !important;
  }
  .mv-quick-nav-cta svg {
    width: 14px !important;
    height: 14px !important;
  }
  .mv-quick-nav-track {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
  .mv-quick-nav-library {
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 10px !important;
    gap: 4px !important;
  }
  .mv-quick-nav-progress {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
}

@media (max-width: 360px) {
  .mv-quick-nav-pill {
    padding-inline: 6px !important;
  }
  .mv-quick-nav-row {
    gap: 5px !important;
  }
  .mv-quick-nav-progress {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }
  .mv-quick-nav-progress svg {
    width: 38px !important;
    height: 38px !important;
  }
  .mv-quick-nav-progress circle {
    cx: 19 !important;
    cy: 19 !important;
    r: 17.5 !important;
  }
  .mv-quick-nav-cta {
    font-size: 11.5px !important;
    padding: 0 8px !important;
  }
  .mv-quick-nav-track {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }
  .mv-quick-nav-library {
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 8px !important;
  }
}

@keyframes mvFadeIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}



/* === Layer: moonverse-polish.css === */
/* Compact page system: consistent hierarchy, restrained surfaces, useful widths. */
:root { --mv-page:1320px; --mv-space:clamp(12px,1.7vw,22px); }
#root main:not([data-reader='true']) { padding-top:12px; }
#root main:not([data-reader='true']) > .mv-page { max-width:none; padding:0 0 16px; margin-inline:0; min-width:0; }
#root main:not([data-reader='true']) .mv-page h1 { font-size:24px; line-height:1.25; letter-spacing:-.035em; }
#root main:not([data-reader='true']) .mv-page h2 { font-size:16px; line-height:1.4; }
#root main:not([data-reader='true']) .mv-page h3 { font-size:13px; line-height:1.45; }
#root main .mv-page :where([class~='p-5'],[class~='p-6'],[class~='p-7'],[class~='p-8'],[class~='sm:p-5'],[class~='sm:p-6'],[class~='sm:p-7'],[class~='sm:p-8'],[class~='md:p-6']) { padding:14px; }
#root main .mv-page :where([class~='p-4'],[class~='sm:p-4']) { padding:12px; }
#root main .mv-page :where([class~='rounded-3xl'],[class~='sm:rounded-3xl']) { border-radius:10px; }
#root main .mv-page :where([class~='rounded-2xl'],[class~='sm:rounded-2xl']) { border-radius:8px; }
#root main .mv-page :where([class~='shadow-xl'],[class~='shadow-2xl'],[class~='shadow-lg'],[class~='shadow-md']) { box-shadow:0 2px 7px #1f193a08; }
#root main .mv-page :where([class~='gap-5'],[class~='gap-6'],[class~='gap-8'],[class~='sm:gap-6'],[class~='lg:gap-6']) { gap:14px; }
#root main .mv-page :where([class~='space-y-5'],[class~='space-y-6'],[class~='space-y-8'],[class~='sm:space-y-5'],[class~='sm:space-y-6'],[class~='sm:space-y-8']) > :not([hidden]) ~ :not([hidden]) { margin-top:12px; margin-bottom:0; }
#root main .mv-page.mv-page-heading { padding:0; }
#root main .mv-page-heading:not(.mv-profile-overview) { padding:2px 0 12px; border-width:0 0 1px; border-radius:0; background:transparent; box-shadow:none; backdrop-filter:none; }
#root main .mv-page-heading:not(.mv-profile-overview) > .absolute { display:none; }
#root main .mv-page-heading > p { margin-top:5px; }
#root main .mv-page :where(button):not([role='switch']) { min-height:30px; border-radius:6px; }
#root main .mv-page :where(input:not([type='checkbox']):not([type='radio']):not([type='range']),select) { min-height:32px; border-radius:6px; font-size:12px; }
#root main .mv-page :where(textarea) { border-radius:6px; font-size:12px; line-height:1.6; }
#root main .mv-page :where([class~='animate-pulse']) { animation:none; }
#root main .mv-page :where(.hover-lift:hover) { transform:none; }
#root main .mv-page-about,#root main .mv-page-terms,#root main .mv-page-privacy { max-width:960px; margin-inline:auto; }
#root main .mv-page-auth { padding-top:18px; padding-bottom:24px; }
#root main .mv-page-about > div:first-child { text-align:left; }
#root main .mv-page-about > div:first-child > svg { width:32px; height:32px; margin:0; }
#root main .mv-preview-notice { padding:6px 10px; margin-bottom:10px; border-radius:6px; font-size:10px; }
/* Discovery and community overviews: governed by modern subtle styling in moonverse-modern-subtle.css */
#root main .mv-page-achievements > .mv-page-heading { align-items:center; }
#root main .mv-page-achievements > .mv-page-heading > .absolute { display:none; }
#root main .mv-page-achievements > .grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr)); }
#root main .mv-page-achievements > .grid > div { padding:12px; gap:8px; }
#root main .mv-page-shop > .grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:10px; }
#root main .mv-page-shop > .grid > div { padding:12px; }
#root main .mv-page-membership > .mv-page-heading { padding-bottom:12px; }
/* Settings: stable navigation beside compact forms on wider screens. */
.mv-settings-workspace { display:grid; grid-template-columns:170px minmax(0,1fr); gap:20px; align-items:start; }
#root main .mv-settings-nav { position:sticky; top:65px; display:flex; flex-direction:column; align-items:stretch; gap:3px; border:0; padding:0; overflow:visible; }
#root main .mv-settings-nav button { justify-content:flex-start; text-align:left; padding:8px 10px; font-size:11px; }
.mv-settings-content { min-width:0; display:flex; flex-direction:column; gap:10px; }
.mv-settings-content > * { margin-block:0!important; }
#root main .mv-settings-content :where([class~='space-y-4'],[class~='space-y-5']) > :not([hidden]) ~ :not([hidden]) { margin-top:10px; }
#root main .mv-settings-content label { font-size:11px; }
/* Profile: shorten the ornamental banner and keep facts close to the identity. */
#root main .mv-profile-overview > div:first-child { height:65px; }
#root main .mv-profile-overview > div:nth-child(2) { margin-top:-20px; padding:0 14px 12px; gap:12px; }
#root main .mv-profile-stats { gap:0; padding:0; border:1px solid var(--border); border-radius:8px; background:var(--card); overflow:hidden; }
#root main .mv-profile-stats > div { padding:9px 12px; border:0; border-radius:0; border-right:1px solid var(--border); box-shadow:none; background:transparent; }
#root main .mv-profile-stats > div:last-child { border-right:0; }
#root main .mv-profile-stats > div > svg { display:none; }
#root main .mv-profile-stats > div > :last-child { font-size:9px; margin-top:3px; }
#root main .mv-profile-columns { grid-template-columns:minmax(240px,.8fr) minmax(0,2fr); gap:16px; }
#root main .mv-profile-columns > div { grid-column:auto; min-width:0; }
#root main .mv-page-profile [class*='aspect-[2/3]'] { aspect-ratio:3/4; max-height:170px; }
/* Leaderboard: accurate ranked rows replace oversized podium cards. */
.mv-page-leaderboard { display:flex; flex-direction:column; gap:12px; }
.mv-rank-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding-bottom:12px; border-bottom:1px solid var(--border); }
.mv-rank-heading h1 { margin:0; }
.mv-rank-heading p { margin-top:5px; font-size:12px; color:var(--muted-foreground); }
.mv-rank-heading > span { font-size:10px; color:var(--muted-foreground); padding-top:8px; white-space:nowrap; }
.mv-rank-filters { display:flex; gap:5px; }
.mv-rank-filters button { padding:5px 11px; font-size:11px; background:var(--card); color:var(--muted-foreground); border:1px solid var(--border); cursor:pointer; }
.mv-rank-filters button[aria-pressed='true'] { background:var(--primary); border-color:var(--primary); color:var(--primary-foreground); }
.mv-rank-table { border:1px solid var(--border); border-radius:8px; overflow:hidden; background:var(--card); }
.mv-rank-table-head,.mv-rank-row { display:grid; grid-template-columns:46px minmax(0,1fr) 130px; gap:12px; align-items:center; padding:11px 16px; }
.mv-rank-table-head { color:var(--muted-foreground); background:var(--muted); font-size:10px; }
.mv-rank-table-head > :last-child { text-align:right; }
.mv-rank-row { border-top:1px solid var(--border); }
.mv-rank-number { font-size:14px; font-weight:650; color:var(--muted-foreground); }
.is-top .mv-rank-number { color:var(--primary); }
.mv-rank-reader { display:flex; align-items:center; gap:10px; min-width:0; }
.mv-rank-reader > img { width:34px; height:34px; border-radius:50%; object-fit:cover; }
/* B25: monogram behind the avatar photo; shows through when the image fails. */
.mv-rank-avatar { position:relative; width:34px; height:34px; flex:none; }
.mv-rank-initial { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; border-radius:50%; background:linear-gradient(135deg, rgba(129,140,248,.22), rgba(56,189,248,.14)); border:1px solid var(--border); color:var(--primary); font-size:14px; font-weight:700; }
.mv-rank-avatar img { position:absolute; inset:0; width:34px; height:34px; border-radius:50%; object-fit:cover; }
.mv-rank-reader > div { min-width:0; }
.mv-rank-name { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.mv-rank-name strong { font-size:12px; }
.mv-rank-name span,.mv-rank-badge { color:var(--muted-foreground); font-size:9px; }
.mv-rank-reader p { font-size:10px; color:var(--muted-foreground); margin:2px 0; }
.mv-rank-badge { color:var(--primary); }
.mv-rank-score { display:flex; flex-direction:column; align-items:flex-end; gap:3px; }
.mv-rank-score strong { font-size:13px; }
.mv-rank-score span { color:var(--muted-foreground); font-size:9px; }
/* Story cover spacing and alignment. */
.mv-series-intro { grid-template-columns:76px minmax(0,1fr); column-gap:14px; row-gap:8px; padding-top:3px; padding-bottom:10px; }
main button.mv-series-cover { display:block; width:76px; height:108px; min-height:108px; margin-top:2px; padding:0; border-radius:5px; box-shadow:none; }
.mv-series-cover img { display:block; object-position:center; }
.mv-series-identity { gap:5px; }
/* Purposeful, labeled chapter tools and flat list rows. */
.mv-chapter-tools { display:flex; flex-direction:column; gap:7px; margin-bottom:8px; }
.mv-chapter-tools-primary { display:flex; align-items:center; gap:10px; }
.mv-chapter-filters { display:flex; gap:3px; }
main .mv-chapter-filters button { min-height:29px; padding:4px 8px; font-size:10px; color:var(--muted-foreground); background:var(--muted); border:1px solid transparent; cursor:pointer; display:flex; gap:5px; align-items:center; }
.mv-chapter-filters button > span { font-size:9px; opacity:.75; }
main .mv-chapter-filters button[aria-pressed='true'] { background:var(--primary); color:var(--primary-foreground); }
.mv-chapter-search { min-width:0; flex:1; position:relative; }
main .mv-chapter-search input { width:100%; height:30px; min-height:30px!important; padding:5px 30px 5px 9px; border:1px solid var(--border); border-radius:5px; background:var(--card); font-size:11px!important; }
main .mv-chapter-search button { position:absolute; right:3px; top:3px; padding:0; width:24px; min-height:24px!important; height:24px; color:var(--muted-foreground); font-size:16px; }
.mv-chapter-tools-secondary { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
main .mv-chapter-tools-secondary select { min-height:29px!important; height:29px; font-size:10px!important; max-width:190px; border:1px solid var(--border); border-radius:5px; background:var(--card); color:var(--foreground); padding:3px 24px 3px 8px; }
main .mv-chapter-expand { font-size:10px; min-height:29px!important; padding:3px 7px; background:var(--muted); color:var(--muted-foreground); border:1px solid var(--border); cursor:pointer; }
.mv-chapter-jump { display:flex; margin-left:auto; height:29px; border:1px solid var(--border); border-radius:5px; overflow:hidden; }
main .mv-chapter-jump input { width:61px; min-height:0!important; height:27px; padding:2px 5px; font-size:10px!important; background:var(--card); border:0; }
main .mv-chapter-jump button { padding:0 7px; min-height:27px!important; font-size:10px; background:var(--muted); color:var(--primary); border-left:1px solid var(--border); }
.mv-chapter-jump button:disabled { opacity:.4; }
.mv-series-panel .mv-story-chapters > * + * { margin-top:7px!important; }
.mv-series-panel .mv-story-chapters [id^='chapter-'] { border-radius:0; }
.mv-series-panel .mv-story-chapters [id^='chapter-'] > a > div,.mv-series-panel .mv-story-chapters [id^='chapter-'] > button > div { border-radius:4px; min-height:33px; padding:5px 8px; }
/* Discussion: compact composer, shared metadata, separated threads. */
.mv-series-discussion > section { display:flex; flex-direction:column; gap:10px; }
.mv-series-discussion > section > * { margin-block:0!important; }
.mv-series-discussion > section > div:first-child { padding-bottom:7px; gap:8px; }
.mv-series-discussion .mv-comment-composer { padding:9px; border-radius:6px; background:var(--card); }
.mv-series-discussion .mv-comment-composer textarea { min-height:60px; height:60px; padding:7px 8px; resize:vertical; }
.mv-series-discussion :where(form) { font-size:11px; }
.mv-series-discussion :where(button) { font-size:11px; }
.mv-series-discussion .mv-comment,.mv-series-discussion .mv-review { border-width:0 0 1px; border-radius:0; background:transparent; padding:11px 0; box-shadow:none; }
.mv-series-discussion .mv-comment > div:first-child { gap:9px; align-items:flex-start; }
.mv-series-discussion .mv-comment > div:first-child > div { display:flex; align-items:center; flex-wrap:wrap; gap:4px 7px; }
.mv-series-discussion .mv-comment > p,.mv-series-discussion .mv-review > p { font-size:12px; line-height:1.65; }
.mv-series-discussion .mv-comment > * + *,.mv-series-discussion .mv-review > * + * { margin-top:5px; }
.mv-series-discussion .mv-comment > div:first-child > button { min-width:37px; min-height:26px!important; background:var(--muted); border-radius:5px; justify-content:center; padding:3px 5px; flex-shrink:0; }
.mv-series-discussion .mv-comment > div:has(> button) { padding-top:0; }
.mv-series-discussion .mv-comment-reply { padding:7px 0 7px 9px; border:0; border-radius:0; background:transparent; }
.mv-series-discussion .mv-comment-reply > div { display:flex; flex-wrap:wrap; gap:4px 12px; }
.mv-series-discussion .mv-review-summary { display:grid; grid-template-columns:180px minmax(0,1fr); align-items:center; gap:14px; padding:10px; border-radius:6px; background:var(--muted); }
.mv-series-discussion .mv-review-summary > div:first-child { padding:0; border:0; }
.mv-series-discussion .mv-review-summary > div:last-child { margin:0; }
.mv-series-discussion .mv-review-summary .text-3xl,.mv-series-discussion .mv-review-summary .sm\:text-3xl { font-size:24px; }
.mv-series-discussion .mv-review > div:first-child { flex-wrap:wrap; gap:5px 12px; }
.mv-series-discussion .mv-review > h5 { font-size:12px; }
main .mv-spoiler-reveal { width:100%; min-height:30px; padding:6px 9px; }
/* Reading notes: clear rows, two-column profiles, and no nested panels. */
.mv-story-notes > summary { min-height:32px; display:list-item; font-size:12px; }
.mv-notes-body { display:flex; flex-direction:column; gap:12px; margin-top:7px!important; }
.mv-notes-body :where(h3,p,figure,blockquote,dl,dd) { margin:0; }
.mv-note-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:7px; }
.mv-note-heading h3,.mv-notes-themes h3,.mv-note-reading h3 { font-size:11px; font-weight:650; }
.mv-note-heading > span { color:var(--muted-foreground); font-size:10px; }
.mv-notes-pair > dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.mv-notes-pair > dl > div { min-width:0; padding-left:9px; border-left:2px solid color-mix(in srgb,var(--primary) 25%,var(--border)); }
.mv-notes-pair dt { font-size:10px; color:var(--primary); font-weight:650; margin-bottom:4px; }
.mv-notes-pair dd { font-size:12px; line-height:1.6; }
.mv-note-tags { display:flex; flex-wrap:wrap; gap:4px 8px; margin-top:5px; }
.mv-note-tags a { color:var(--primary); font-size:10px; line-height:1.6; }
.mv-note-tags a:hover { text-decoration:underline; }
.mv-notes-themes { border-block:1px solid var(--border); padding:8px 0; display:flex; flex-direction:column; gap:7px; }
.mv-notes-themes > div { display:grid; grid-template-columns:100px minmax(0,1fr); gap:10px; align-items:baseline; }
.mv-notes-themes .mv-note-tags { margin:0; }
.mv-notes-reading { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
main .mv-note-heading button { min-height:24px!important; font-size:10px; padding:1px 6px; color:var(--primary); background:var(--muted); border-radius:4px; }
.mv-note-quote blockquote { font-size:12px; line-height:1.65; font-style:italic; border-left:2px solid var(--border); padding-left:9px; }
.mv-note-quote figcaption { font-size:10px; color:var(--primary); margin-top:6px; }
.mv-note-quote figcaption span { display:block; color:var(--muted-foreground); font-size:9px; margin-top:2px; }
.mv-note-reading ul { padding-left:15px; margin:7px 0 0; font-size:11px; line-height:1.65; }
.mv-note-reading li + li { margin-top:4px; }
/* Menus and native dropdowns share a compact, readable surface. */
.mv-popover { border-radius:7px!important; padding:4px!important; box-shadow:0 6px 20px #16112920!important; max-height:min(420px,65dvh); overflow-y:auto; }
.mv-series .mv-popover { width:210px; }
.mv-popover [role='menuitem'] { min-height:32px!important; border-radius:4px!important; padding:5px 7px!important; font-size:11px!important; }
.mv-popover [role='menuitem'] > div > div:last-child > span:nth-child(2) { display:none; }
.mv-popover > div:first-child { font-size:9px; padding:5px 7px; }
main:not([data-reader='true']) select { color-scheme:inherit; }
main:not([data-reader='true']) select option { font-size:12px; background:var(--card); color:var(--foreground); }
@media(min-width:1200px) {
 .mv-chapter-tools { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; }
 .mv-chapter-tools-secondary { flex-wrap:nowrap; }
 .mv-chapter-tools:has(select[aria-label='Filter by volume']) { display:flex; }
}
@media(max-width:899px) {
 .mv-settings-workspace { display:flex; flex-direction:column; gap:12px; }
 #root main .mv-settings-nav { position:static; width:100%; flex-direction:row; align-items:center; overflow-x:auto; padding-bottom:4px; }
 #root main .mv-settings-nav button { white-space:nowrap; flex-shrink:0; }
 .mv-settings-content { width:100%; }
 .mv-series-discussion .mv-review-summary { grid-template-columns:minmax(0,1fr); gap:8px; }
 .mv-series-discussion .mv-review-summary > div:last-child { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:759px) {
 #root main:not([data-reader='true']) .mv-page h1 { font-size:21px; }
 #root main .mv-page-heading:not(.mv-profile-overview) { padding-bottom:10px; }
 .mv-series-intro { grid-template-columns:60px minmax(0,1fr); column-gap:11px; padding-top:2px; row-gap:8px; }
 main button.mv-series-cover { width:60px; height:86px; min-height:86px; margin-top:1px; }
 .mv-series .mv-story-actions { margin-left:-71px!important; padding-top:5px; }
 .mv-rank-heading { flex-direction:column; gap:5px; }
 .mv-rank-heading > span { padding:0; }
 .mv-rank-table-head,.mv-rank-row { grid-template-columns:28px minmax(0,1fr) 70px; gap:8px; padding:10px; }
 .mv-rank-reader { gap:8px; }
 .mv-rank-reader > img { width:28px; height:28px; }
 .mv-rank-avatar, .mv-rank-avatar img { width:28px; height:28px; }
 .mv-rank-initial { font-size:12px; }
 .mv-rank-name { gap:4px 7px; }
 .mv-rank-name strong { font-size:11px; }
 .mv-rank-reader p { font-size:9px; }
 .mv-rank-badge { display:none; }
 .mv-rank-score strong { font-size:12px; }
 .mv-rank-table-head { font-size:9px; }
 .mv-notes-reading { gap:14px; }
 #root main .mv-page-shop > .grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:479px) {
 .mv-chapter-tools-primary { flex-wrap:wrap; gap:6px; }
 .mv-chapter-search { flex:1 1 100%; }
 .mv-chapter-filters { width:100%; }
 main .mv-chapter-filters button { flex:1; justify-content:center; }
 .mv-chapter-tools-secondary { gap:5px; }
 main .mv-chapter-tools-secondary select { max-width:135px; }
 .mv-chapter-jump { margin-left:0; }
 .mv-notes-pair > dl,.mv-notes-reading { grid-template-columns:minmax(0,1fr); gap:12px; }
 .mv-notes-themes > div { grid-template-columns:78px minmax(0,1fr); }
 #root main .mv-page-shop > .grid { grid-template-columns:minmax(0,1fr); }
 #root main .mv-profile-overview > div:nth-child(2) { margin-top:-14px; align-items:flex-start; }
 .mv-series-discussion .mv-comment > p,.mv-series-discussion .mv-review > p { font-size:11px; }
}
@media(pointer:coarse) {
 #root main .mv-page :where(button):not([role='switch']),.mv-popover [role='menuitem'],main .mv-chapter-filters button { min-height:34px!important; }
 main .mv-chapter-tools-secondary select,main .mv-chapter-search input { min-height:34px!important; height:34px; }
}
.mv-rank-heading h1 { font-weight:750; }
main .mv-series-discussion button[aria-label^='Rate '] { min-width:28px; min-height:28px!important; border-radius:4px; }
main .mv-series-discussion button[aria-label^='Rate '][aria-pressed='true'] { background:color-mix(in srgb,var(--primary) 10%,transparent); }
@media(max-width:479px) {
 .mv-chapter-tools-secondary { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) 80px; }
 main .mv-chapter-tools-secondary select { width:100%; min-width:0; max-width:none; }
 .mv-chapter-jump { width:80px; }
 main .mv-chapter-jump input { min-width:0; width:50px; }
}


/* === Layer: moonverse-conversation.css === */
/* ==========================================================================
   MOONVERSE CONVERSATION & REVIEW SYSTEM (MODERN SUBTLE COMPACT SPECIFICATION)
   Compact, stylish, subtle, calm in every palette, iOS-grade micro-segmented
   controls, radiant golden star ratings, and hairline thread architecture.
   ========================================================================== */

/* 1. Root & Container Layout */
.mv-conversation {
  color: var(--foreground);
  min-width: 0;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  display: flex;
  flex-direction: column;
  gap: 12px;
  -webkit-font-smoothing: antialiased;
}
.mv-conversation :where(p, h2, h3, h4) {
  margin: 0;
}

/* 2. Heading & Segmented Tab Navigation */
.mv-talk-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
}
.mv-talk-heading > h2 {
  font-size: 14.5px;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: var(--foreground);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* Micro-segmented control */
.mv-talk-segments {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2.5px;
  background: color-mix(in srgb, var(--muted) 55%, var(--background));
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
  border-radius: 9px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
main .mv-talk-segments button,
.mv-talk-segments button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 29px !important;
  height: 29px;
  padding: 4px 10px;
  border-radius: 7px;
  font-size: 11.5px;
  font-weight: 550;
  color: var(--muted-foreground);
  background: transparent;
  border: 0;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
}
main .mv-talk-segments button:hover,
.mv-talk-segments button:hover {
  color: var(--foreground);
  background: color-mix(in srgb, var(--card) 45%, transparent);
}
main .mv-talk-segments button[aria-pressed='true'],
.mv-talk-segments button[aria-pressed='true'] {
  color: var(--foreground) !important;
  background: var(--card) !important;
  font-weight: 600;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07), 0 0 0 1px color-mix(in srgb, var(--border) 70%, transparent) !important;
}
main .mv-talk-segments button > svg,
.mv-talk-segments button > svg {
  width: 13px;
  height: 13px;
  color: currentColor;
  opacity: 0.85;
}
main .mv-talk-segments button[aria-pressed='true'] > svg {
  color: var(--primary);
  opacity: 1;
}

/* Segment count pills */
.mv-talk-segment-count {
  font-size: 9.5px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  padding: 1.5px 6px;
  border-radius: 9999px;
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  color: var(--primary);
  line-height: 1.2;
}
main .mv-talk-segments button[aria-pressed='true'] .mv-talk-segment-count {
  background: color-mix(in srgb, var(--primary) 16%, transparent);
  color: var(--primary);
}
.mv-talk-segment-short {
  display: none;
}

/* 3. Compact Dropdowns (Sort / Rating Filter) */
main .mv-conversation select,
.mv-conversation select,
.mv-talk-heading select,
.mv-talk-review-filter select {
  min-height: 30px !important;
  height: 30px;
  padding: 0 26px 0 10px !important;
  font-size: 11px !important;
  font-weight: 550 !important;
  line-height: 30px !important;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  border-radius: 7px !important;
  background-color: color-mix(in srgb, var(--card) 80%, var(--background)) !important;
  color: var(--foreground) !important;
  cursor: pointer;
  max-width: 136px;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 11px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  transition: all 0.15s ease !important;
}
main .mv-conversation select:hover,
.mv-conversation select:hover {
  border-color: color-mix(in srgb, var(--primary) 40%, var(--border)) !important;
}
main .mv-conversation select:focus,
.mv-conversation select:focus {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border)) !important;
  box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

/* 4. Compact Glass Composer */
.mv-talk-composer {
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  border-radius: 12px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--card) 85%, transparent), color-mix(in srgb, var(--card) 55%, var(--background)));
  padding: 12px 14px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  min-width: 0;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.mv-talk-composer:focus-within {
  border-color: color-mix(in srgb, var(--primary) 60%, var(--border));
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05), 0 0 0 2.5px color-mix(in srgb, var(--primary) 12%, transparent);
}
.mv-talk-composer-identity {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.mv-talk-composer-identity > div {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 3px 6px;
  min-width: 0;
}
.mv-talk-composer-identity strong {
  font-size: 12px;
  font-weight: 600;
  color: var(--foreground);
}
.mv-talk-composer-identity > div > span {
  font-size: 10.5px;
  color: var(--muted-foreground);
}
.mv-talk-composer-identity > button {
  margin-left: auto;
}

/* Avatars */
.mv-talk-avatar {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border-radius: 50%;
  overflow: hidden;
  background: color-mix(in srgb, var(--primary) 10%, var(--card));
  color: var(--primary);
  border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border));
  font-size: 11px;
  font-weight: 650;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}
.mv-talk-avatar img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mv-talk-avatar-small {
  width: 24px;
  height: 24px;
  flex-basis: 24px;
  font-size: 9.5px;
  border-width: 1px;
}

/* Textarea inside composer */
#root main .mv-conversation textarea,
main .mv-conversation textarea,
.mv-conversation textarea {
  display: block;
  width: 100%;
  height: 72px;
  min-height: 72px;
  max-height: 280px;
  border: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 4px 2px 8px !important;
  background: transparent !important;
  color: var(--foreground);
  font-size: 12.5px;
  line-height: 1.65;
  resize: vertical;
}
main .mv-conversation textarea::placeholder,
.mv-conversation textarea::placeholder {
  color: var(--muted-foreground);
  opacity: 0.8;
}

/* Composer footer */
.mv-talk-composer-footer {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 12px;
  border-top: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
  padding-top: 8px;
  margin-top: 4px;
}
.mv-talk-spoiler-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 500;
  color: var(--muted-foreground);
  cursor: pointer;
  user-select: none;
}
.mv-talk-spoiler-check:hover {
  color: var(--foreground);
}
.mv-talk-spoiler-check input {
  width: 13px;
  height: 13px;
  border-radius: 3px;
  accent-color: var(--primary);
  cursor: pointer;
}
.mv-talk-counter,
.mv-talk-key-hint {
  font-size: 10px;
  color: var(--muted-foreground);
  font-variant-numeric: tabular-nums;
}
.mv-talk-counter {
  margin-left: auto;
}

/* Action Buttons */
main .mv-talk-primary,
.mv-talk-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 30px !important;
  height: 30px;
  padding: 5px 13px;
  border: 1px solid var(--primary);
  border-radius: 7px;
  background: var(--primary);
  color: var(--primary-foreground);
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 1px 5px color-mix(in srgb, var(--primary) 25%, transparent);
  transition: all 0.15s cubic-bezier(0.16, 1, 0.3, 1);
}
main .mv-talk-primary:hover,
.mv-talk-primary:hover {
  background: var(--primary-hover);
  transform: translateY(-0.5px);
  box-shadow: 0 2px 8px color-mix(in srgb, var(--primary) 35%, transparent);
}
main .mv-talk-primary:active,
.mv-talk-primary:active {
  transform: translateY(0);
}
main .mv-talk-primary:disabled,
.mv-talk-primary:disabled {
  opacity: 0.45;
  cursor: default;
  transform: none;
  box-shadow: none;
}
main .mv-talk-icon,
.mv-talk-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 26px;
  min-height: 26px !important;
  height: 26px;
  padding: 4px;
  border-radius: 6px;
  color: var(--muted-foreground);
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: all 0.15s ease;
}
main .mv-talk-icon:hover,
.mv-talk-icon:hover {
  background: color-mix(in srgb, var(--muted) 60%, transparent);
  color: var(--foreground);
}

/* 5. Review Overview Breakdown Card (Compact & Balanced) */
.mv-talk-review-overview {
  display: grid;
  grid-template-columns: 100px minmax(140px, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 14px 18px;
  border: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
  border-radius: 12px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--card) 85%, transparent), color-mix(in srgb, var(--card) 60%, var(--background)));
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.mv-talk-average {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.mv-talk-average > strong {
  font-size: 30px;
  letter-spacing: -0.04em;
  font-weight: 750;
  line-height: 1;
  color: var(--foreground);
}
.mv-talk-average > span:last-child {
  font-size: 10.5px;
  color: var(--muted-foreground);
  font-weight: 500;
}

/* Stars */
.mv-talk-stars {
  display: inline-flex;
  align-items: center;
  gap: 2.5px;
  color: color-mix(in srgb, var(--border) 75%, transparent);
}
.mv-talk-stars svg {
  width: 13px;
  height: 13px;
}
.mv-talk-stars .is-filled,
.mv-talk-stars .is-filled svg {
  color: #f59e0b !important;
  fill: #f59e0b !important;
}

/* Rating distribution bars */
.mv-talk-distribution {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
main .mv-talk-distribution button,
.mv-talk-distribution button {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 8px;
  min-height: 20px !important;
  height: 20px;
  font-size: 10.5px;
  font-weight: 550;
  color: var(--muted-foreground);
  padding: 1px 4px;
  border-radius: 5px;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  transition: all 0.15s ease;
}
main .mv-talk-distribution button:hover,
.mv-talk-distribution button:hover {
  background: color-mix(in srgb, var(--muted) 40%, transparent);
  color: var(--foreground);
}
main .mv-talk-distribution button[aria-pressed='true'],
.mv-talk-distribution button[aria-pressed='true'] {
  color: var(--primary) !important;
  font-weight: 650;
  background: color-mix(in srgb, var(--primary) 8%, transparent);
}
.mv-talk-rating-track {
  height: 4px;
  border-radius: 9999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--muted) 75%, transparent);
}
.mv-talk-rating-track > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #f59e0b, #fbbf24);
  border-radius: 9999px;
  transition: width 0.25s ease;
}
.mv-talk-distribution button > :last-child {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-size: 10px;
}

/* 6. Review Composer & Star Picker */
.mv-talk-rating-picker {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
  padding: 4px 0 8px;
  font-size: 11px;
  color: var(--foreground);
}
.mv-talk-rating-picker > span:first-child {
  font-weight: 600;
  font-size: 11.5px;
}
.mv-talk-rating-picker > div {
  display: flex;
  gap: 3px;
}
main .mv-talk-rating-picker button,
.mv-talk-rating-picker button {
  width: 30px;
  min-height: 30px !important;
  height: 30px;
  padding: 4px;
  border: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
  background: color-mix(in srgb, var(--muted) 45%, var(--card));
  color: color-mix(in srgb, var(--muted-foreground) 80%, transparent);
  border-radius: 6px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s ease;
}
main .mv-talk-rating-picker button:hover,
.mv-talk-rating-picker button:hover {
  color: #f59e0b;
  border-color: color-mix(in srgb, #f59e0b 35%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--card));
  transform: scale(1.04);
}
main .mv-talk-rating-picker button.is-selected,
.mv-talk-rating-picker button.is-selected {
  color: #f59e0b !important;
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border)) !important;
  background: color-mix(in srgb, #f59e0b 12%, var(--card)) !important;
  box-shadow: 0 1px 6px rgba(245, 158, 11, 0.18) !important;
}
.mv-talk-rating-picker button svg {
  width: 14px;
  height: 14px;
}
.mv-talk-rating-value {
  font-size: 11px;
  font-weight: 650;
  color: #f59e0b;
  margin-left: 2px;
}

/* Review Headline */
main .mv-conversation .mv-talk-review-title,
.mv-conversation .mv-talk-review-title {
  width: 100%;
  min-height: 32px !important;
  height: 32px;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  background: color-mix(in srgb, var(--background) 50%, var(--card)) !important;
  color: var(--foreground) !important;
  border-radius: 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 10px !important;
  margin: 2px 0 8px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  transition: all 0.15s ease !important;
}
main .mv-conversation .mv-talk-review-title:focus,
.mv-conversation .mv-talk-review-title:focus {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border)) !important;
  box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}
main .mv-talk-composer.is-review textarea,
.mv-talk-composer.is-review textarea {
  min-height: 96px !important;
  height: 96px !important;
}

/* Review filter sub-heading */
.mv-talk-review-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 12px;
  font-weight: 600;
  color: var(--foreground);
  padding: 2px 0;
  margin-top: 2px;
}
.mv-talk-review-filter span {
  font-size: 12px;
  font-weight: 600;
  color: var(--foreground);
}

/* 7. Comments & Reviews Thread (Clean Hairline Architecture) */
.mv-talk-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.mv-talk-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 13px 2px;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 45%, transparent);
  min-width: 0;
}
.mv-talk-item:first-child {
  padding-top: 6px;
}
.mv-talk-item:last-child {
  border-bottom: 0;
}
.mv-talk-item-body {
  flex: 1;
  min-width: 0;
}
.mv-talk-author {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 7px;
  margin-bottom: 4px;
  min-width: 0;
  line-height: 1.45;
}
.mv-talk-author > strong {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--foreground);
}
.mv-talk-author > time,
.mv-talk-edited {
  font-size: 10.5px;
  color: var(--muted-foreground);
}
.mv-talk-edited {
  font-style: italic;
}
.mv-talk-badge {
  display: inline-block;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 9px;
  font-weight: 600;
  padding: 1.5px 6.5px;
  border: 1px solid color-mix(in srgb, var(--primary) 15%, var(--border));
  background: color-mix(in srgb, var(--primary) 6%, transparent);
  border-radius: 9999px;
  color: var(--primary);
}
.mv-talk-review h3 {
  font-size: 13px;
  font-weight: 650;
  line-height: 1.4;
  margin: 4px 0 3px;
  color: var(--foreground);
}
.mv-talk-content > p {
  font-size: 12.5px;
  line-height: 1.68;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--foreground);
}
.mv-talk-review .mv-talk-content p {
  color: var(--foreground);
}

/* Action buttons */
.mv-talk-item-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 6px;
}
main .mv-talk-action,
main .mv-talk-reply-toggle,
main .mv-talk-text-button,
.mv-talk-action,
.mv-talk-reply-toggle,
.mv-talk-text-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 26px !important;
  height: 26px;
  padding: 2px 7px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  font-size: 11px;
  font-weight: 550;
  color: var(--muted-foreground);
  cursor: pointer;
  transition: all 0.15s ease;
}
main .mv-talk-action:hover,
main .mv-talk-reply-toggle:hover,
.mv-talk-action:hover,
.mv-talk-reply-toggle:hover {
  color: var(--foreground);
  background: color-mix(in srgb, var(--muted) 50%, transparent);
}
main .mv-talk-action[aria-pressed='true'],
.mv-talk-action[aria-pressed='true'] {
  color: var(--primary) !important;
  background: color-mix(in srgb, var(--primary) 9%, transparent) !important;
  font-weight: 600;
}
.mv-talk-action-count {
  padding: 1px 5px;
  border-radius: 9999px;
  background: color-mix(in srgb, var(--muted) 75%, transparent);
  color: var(--muted-foreground);
  font-size: 9.5px;
  font-weight: 600;
  min-width: 16px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
main .mv-talk-action[aria-pressed='true'] .mv-talk-action-count {
  background: color-mix(in srgb, var(--primary) 16%, transparent);
  color: var(--primary);
}
.mv-talk-reply-toggle > svg {
  transition: transform 0.15s ease;
}
.mv-talk-reply-toggle[aria-expanded='true'] > svg {
  transform: rotate(180deg);
}
main .mv-talk-text-button {
  color: var(--primary);
  font-weight: 600;
  padding: 2px 0;
}

/* 8. Nested Replies */
.mv-talk-replies {
  margin-top: 8px;
  padding-left: 12px;
  border-left: 2px solid color-mix(in srgb, var(--primary) 20%, var(--border));
}
.mv-talk-item.is-reply {
  gap: 8px;
  padding: 8px 0;
  border-bottom: 0;
}
.mv-talk-item.is-reply .mv-talk-content > p {
  font-size: 12px;
  line-height: 1.62;
}
.mv-talk-item-body > .mv-talk-composer {
  margin-top: 8px;
}
main .mv-talk-composer.is-reply textarea,
.mv-talk-composer.is-reply textarea {
  min-height: 60px;
  height: 60px;
}
.mv-talk-composer.is-reply .mv-talk-key-hint {
  display: none;
}

/* 9. Spoiler Alerts & Notices */
main .mv-talk-spoiler,
.mv-talk-spoiler {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2px;
  width: 100%;
  min-height: 44px !important;
  padding: 8px 12px;
  border: 1px dashed color-mix(in srgb, var(--primary) 28%, var(--border));
  background: color-mix(in srgb, var(--card) 50%, var(--background));
  color: var(--muted-foreground);
  border-radius: 8px;
  text-align: left;
  cursor: pointer;
  transition: all 0.15s ease;
}
main .mv-talk-spoiler:hover,
.mv-talk-spoiler:hover {
  background: color-mix(in srgb, var(--card) 80%, var(--background));
  border-color: var(--primary);
}
.mv-talk-spoiler strong {
  font-size: 11px;
  font-weight: 600;
  color: var(--foreground);
}
.mv-talk-spoiler > span {
  font-size: 10.5px;
  color: var(--primary);
  font-weight: 500;
}
.mv-talk-spoiler-label {
  display: inline-block;
  font-size: 9px;
  font-weight: 600;
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 8%, transparent);
  padding: 1.5px 6px;
  margin-bottom: 4px;
  border-radius: 4px;
}

/* Notices */
.mv-talk-notice {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--border));
  background: color-mix(in srgb, var(--primary) 7%, var(--card));
  color: var(--primary);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 11.5px;
  font-weight: 550;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
}
.mv-talk-notice > button {
  margin-left: auto;
  min-width: 22px;
  min-height: 22px !important;
  padding: 3px;
}
.mv-talk-error {
  font-size: 11px;
  color: var(--destructive, #ef4444);
  font-weight: 550;
  margin-top: 6px !important;
}

/* Empty State */
.mv-talk-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 28px 16px;
  border: 1px dashed color-mix(in srgb, var(--border) 70%, transparent);
  border-radius: 12px;
  color: var(--muted-foreground);
  text-align: center;
  background: color-mix(in srgb, var(--card) 25%, transparent);
  margin-top: 4px;
}
.mv-talk-empty > svg {
  width: 22px;
  height: 22px;
  color: var(--primary);
  opacity: 0.75;
}
.mv-talk-empty strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--foreground);
}
.mv-talk-empty p {
  font-size: 11.5px;
  line-height: 1.6;
  max-width: 360px;
}

/* 10. Chapter Reader Discussion & Side Drawer */
.mv-chapter-conversation {
  width: 100%;
  margin: 24px auto 0;
  padding: 18px 0 12px;
  border-top: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.mv-talk-overlay {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  justify-content: flex-end;
  background: rgba(8, 11, 20, 0.45);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.mv-talk-drawer {
  width: min(100%, 460px);
  height: 100dvh;
  overflow-y: auto;
  background: var(--background);
  border-left: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
  padding: 16px;
  box-shadow: -6px 0 28px rgba(0, 0, 0, 0.12);
}
.mv-talk-drawer-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
}
.mv-talk-drawer-title h2 {
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.01em;
  margin: 0 0 3px;
  color: var(--foreground);
}
.mv-talk-drawer-title p {
  margin: 0;
  font-size: 11px;
  color: var(--muted-foreground);
}
.mv-talk-drawer .mv-talk-key-hint {
  display: none;
}

/* 11. Accessibility */
.mv-conversation :where(button, summary):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 70%, transparent);
  outline-offset: 1px;
}
.mv-conversation :where(input, select):focus,
.mv-conversation :where(input, select):focus-visible {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border)) !important;
  box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

/* 12. Viewport Scaling & Mobile Harmony */
@media (max-width: 1050px) {
  .mv-talk-key-hint {
    display: none;
  }
  .mv-talk-review-overview {
    grid-template-columns: 95px minmax(0, 1fr);
    gap: 14px;
  }
  .mv-talk-review-overview > .mv-talk-primary {
    grid-column: 1 / -1;
    justify-self: start;
    width: 100%;
  }
}

@media (max-width: 640px) {
  .mv-talk-heading {
    gap: 8px;
  }
  .mv-talk-heading > h2 {
    font-size: 14px;
  }
  .mv-talk-review-overview {
    padding: 12px 14px;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 12px;
  }
  .mv-talk-average > strong {
    font-size: 26px;
  }
}

@media (max-width: 479px) {
  .mv-talk-heading {
    flex-wrap: wrap;
    gap: 6px;
  }
  .mv-talk-segments {
    width: auto;
    flex: 1;
  }
  .mv-talk-segment-label {
    display: none;
  }
  .mv-talk-segment-short {
    display: inline;
  }
  .mv-talk-segments button > svg {
    display: none;
  }
  main .mv-talk-segments button,
  .mv-talk-segments button {
    padding: 4px 6px;
    gap: 4px;
    font-size: 10.5px;
    min-height: 28px !important;
    height: 28px;
  }
  .mv-talk-heading > select {
    margin-left: 0;
    width: 106px;
    max-width: 106px;
    flex: 0 0 106px;
    font-size: 10.5px !important;
    padding: 0 22px 0 7px !important;
  }
  .mv-talk-composer {
    padding: 10px 12px;
    border-radius: 10px;
  }
  .mv-talk-composer-identity > div {
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
  }
  .mv-talk-composer-footer {
    gap: 6px;
  }
  .mv-talk-counter {
    font-size: 9.5px;
  }
  .mv-talk-item {
    gap: 8px;
    padding: 11px 0;
  }
  .mv-talk-item > .mv-talk-avatar {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
    font-size: 9.5px;
  }
  .mv-talk-author {
    gap: 2px 5px;
  }
  .mv-talk-badge {
    max-width: 130px;
  }
  .mv-talk-content > p {
    font-size: 11.5px;
    line-height: 1.62;
  }
  .mv-talk-item-actions {
    gap: 3px 8px;
  }
  .mv-talk-replies {
    padding-left: 8px;
  }
  .mv-talk-reply-toggle {
    font-size: 9.5px !important;
  }
  .mv-talk-composer.is-reply .mv-talk-composer-footer .mv-talk-counter {
    display: none;
  }
  .mv-talk-review-overview {
    padding: 10px 12px;
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 10px;
  }
  .mv-talk-average > strong {
    font-size: 24px;
  }
  .mv-talk-distribution button {
    gap: 5px;
    font-size: 9.5px;
  }
  .mv-talk-drawer {
    padding: 14px;
  }
}

@media (max-width: 340px) {
  .mv-talk-segments button {
    padding: 3px 4px !important;
    font-size: 9.5px !important;
  }
  .mv-talk-segment-count {
    padding: 1px 4px !important;
    font-size: 9px !important;
  }
  .mv-talk-heading > select {
    width: 92px !important;
    max-width: 92px !important;
    flex: 0 0 92px !important;
    font-size: 9.5px !important;
  }
  .mv-talk-review-overview {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .mv-talk-average {
    align-items: center;
    text-align: center;
    width: 100%;
  }
}

@media (pointer: coarse) {
  main .mv-talk-action,
  main .mv-talk-reply-toggle,
  main .mv-talk-text-button,
  main .mv-talk-primary,
  main .mv-talk-segments button,
  main .mv-talk-rating-picker button {
    min-height: 32px !important;
  }
  main .mv-talk-distribution button {
    min-height: 24px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mv-talk-reply-toggle > svg,
  .mv-talk-primary,
  .mv-talk-segments button {
    transition: none !important;
  }
}


/* === Layer: moonverse-chapters.css === */
/* Dense, shared chapter catalog. Controls remain visible in every layout. */
.mvc-catalog {
  --mvc-line: color-mix(in srgb, var(--border) 55%, transparent);
  font-size: 12px;
  min-width: 0;
  color: var(--foreground);
  border: 1px solid var(--mvc-line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--card) 55%, transparent);
  overflow: hidden;
}
.mvc-catalog button,
.mvc-catalog input,
.mvc-catalog select {
  font: inherit;
}
.mvc-catalog button,
.mvc-catalog select {
  cursor: pointer;
}
.mvc-catalog :is(button, a):focus-visible,
.mvc-index-heading button:focus-visible {
  outline: 1.5px solid color-mix(in srgb, var(--primary) 70%, transparent);
  outline-offset: 2px;
}
.mvc-catalog :is(input, select):focus,
.mvc-catalog :is(input, select):focus-visible {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}
.mvc-catalog button:disabled,
.mvc-catalog select:disabled {
  opacity: 0.45;
  cursor: default;
}
.mvc-toolbar {
  padding: 9px 10px 8px;
  border-bottom: 1px solid var(--mvc-line);
  background: color-mix(in srgb, var(--muted) 12%, transparent);
}
.mvc-toolbar-top {
  display: flex;
  gap: 8px;
  align-items: center;
}
.mvc-access {
  display: flex;
  gap: 3px;
  flex-shrink: 0;
}
.mvc-access button {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 29px;
  padding: 3px 8px;
  border: 1px solid transparent;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 650;
  color: var(--muted-foreground);
}
.mvc-access button span {
  font-size: 10px;
  opacity: 0.7;
  font-variant-numeric: tabular-nums;
}
.mvc-access button[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--primary) 25%, transparent);
  background: color-mix(in srgb, var(--primary) 12%, transparent);
  color: var(--primary);
}
.mvc-search {
  position: relative;
  flex: 1;
  min-width: 100px;
}
.mvc-search input {
  width: 100%;
  height: 30px;
  background: color-mix(in srgb, var(--background) 60%, transparent);
  border: 1px solid var(--mvc-line);
  border-radius: 5px;
  padding: 4px 26px 4px 9px;
  font-size: 11px;
}
.mvc-search button {
  position: absolute;
  right: 2px;
  top: 2px;
  width: 26px;
  height: 26px;
  font-size: 17px;
  color: var(--muted-foreground);
}
.mvc-filters {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.1fr) 105px 105px 83px;
  gap: 6px;
  margin-top: 7px;
  align-items: end;
}
.mvc-select {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.mvc-select > span {
  font-size: 9px;
  line-height: 1.2;
  color: var(--muted-foreground);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 650;
}
.mvc-select select {
  min-width: 0;
  width: 100%;
  height: 29px;
  padding: 3px 22px 3px 7px;
  border: 1px solid var(--mvc-line);
  border-radius: 5px;
  background: var(--background);
  color: var(--foreground);
  font-size: 10px;
  text-overflow: ellipsis;
}
.mvc-jump {
  display: flex;
  height: 29px;
  border: 1px solid var(--mvc-line);
  border-radius: 5px;
  overflow: hidden;
  background: var(--background);
}
.mvc-jump input {
  width: 48px;
  min-width: 0;
  padding: 3px 4px 3px 7px;
  font-size: 10px;
  background: transparent;
  appearance: textfield;
}
.mvc-jump input::-webkit-inner-spin-button {
  appearance: none;
}
.mvc-jump button {
  min-width: 30px;
  padding: 3px;
  font-size: 10px;
  font-weight: 700;
  border-left: 1px solid var(--mvc-line);
  color: var(--primary);
}
.mvc-summary {
  display: flex;
  gap: 12px;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-bottom: 1px solid var(--mvc-line);
  font-size: 10px;
  color: var(--muted-foreground);
}
.mvc-summary button {
  min-height: 24px;
  color: var(--primary);
  font-size: 10px;
}
.mvc-summary button:last-child {
  margin-left: auto;
}
.mvc-row {
  display: grid;
  grid-template-columns: 39px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 39px;
  width: 100%;
  padding: 5px 10px 5px 0;
  text-align: left;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
  transition: background 0.12s;
  color: var(--foreground);
  background: transparent;
}
.mvc-results > div:last-child > .mvc-row,
.mvc-group > div:last-child > .mvc-row {
  border-bottom: 0;
}
.mvc-row:hover {
  background: color-mix(in srgb, var(--muted) 30%, transparent);
}
.mvc-number {
  font-size: 11px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  text-align: center;
  color: var(--muted-foreground);
  border-right: 1px solid var(--mvc-line);
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mvc-title {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mvc-title > span {
  font-size: 11px;
  font-weight: 550;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1.5;
}
.mvc-title small {
  font-size: 9px;
  color: var(--muted-foreground);
  line-height: 1.3;
}
.mvc-row-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvc-row-meta time {
  font-size: 9px;
}
.mvc-status {
  font-size: 9px;
  padding: 2px 5px;
  line-height: 1.3;
  border-radius: 3px;
  background: color-mix(in srgb, var(--muted) 40%, transparent);
}
.mvc-status.locked {
  color: color-mix(in srgb, var(--foreground) 65%, #b77714);
  background: #a16d161a;
}
.mvc-status.current {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 12%, transparent);
}
.mvc-free {
  font-size: 9px;
}
.mvc-read {
  color: color-mix(in srgb, var(--foreground) 55%, #2c9366);
  font-size: 12px;
}
.mvc-arrow {
  font-size: 17px;
  line-height: 1;
}
.mvc-row.is-current {
  background: color-mix(in srgb, var(--primary) 6%, transparent);
  box-shadow: inset 2px 0 var(--primary);
}
.mvc-row.is-current .mvc-number {
  color: var(--primary);
}
.mvc-row.is-target {
  box-shadow: inset 2px 0 var(--primary);
  background: color-mix(in srgb, var(--primary) 12%, transparent);
}
.mvc-group + .mvc-group {
  border-top: 1px solid var(--mvc-line);
}
.mvc-group-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 33px;
  padding: 6px 10px;
  background: color-mix(in srgb, var(--muted) 22%, transparent);
  text-align: left;
}
.mvc-group-toggle > span {
  width: 10px;
  color: var(--primary);
  font-size: 16px;
}
.mvc-group-toggle strong {
  font-size: 11px;
  font-weight: 650;
  line-height: 1.5;
}
.mvc-group-toggle small {
  margin-left: auto;
  flex-shrink: 0;
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvc-empty {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
  padding: 24px 12px;
  color: var(--muted-foreground);
  font-size: 11px;
}
.mvc-empty strong {
  color: var(--foreground);
  font-size: 12px;
}
.mvc-empty button {
  min-height: 29px;
  padding: 4px 10px;
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  color: var(--primary);
  border-radius: 4px;
}
.mvc-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 10px;
  border-top: 1px solid var(--mvc-line);
}
.mvc-pagination > button {
  min-height: 29px;
  font-size: 10px;
}
.mvc-pagination .mvc-select {
  max-width: 155px;
}
.mvc-pagination .mvc-select > span {
  display: none;
}
.mvc-overlay {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: color-mix(in srgb, var(--background) 80%, transparent);
  backdrop-filter: blur(8px);
}
.mvc-index-panel {
  display: flex;
  flex-direction: column;
  width: min(700px, 100%);
  max-height: min(85dvh, 760px);
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  box-shadow: 0 18px 65px #0005;
  overflow: hidden;
}
.mvc-index-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
}
.mvc-index-heading > div {
  min-width: 0;
}
.mvc-index-heading h2 {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
}
.mvc-index-heading p {
  font-size: 10px;
  color: var(--muted-foreground);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 3px;
}
.mvc-index-heading > button {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 21px;
  line-height: 1;
  color: var(--muted-foreground);
}
.mvc-index-catalog {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.mvc-index-catalog > .mvc-results {
  overflow-y: auto;
  overscroll-behavior: contain;
  min-height: 0;
  scrollbar-width: thin;
}
.mvc-index-catalog > .mvc-toolbar,
.mvc-index-catalog > .mvc-summary,
.mvc-index-catalog > .mvc-pagination {
  flex-shrink: 0;
}
.mvc-index-catalog .mvc-row {
  min-height: 44px;
}
.mvc-index-catalog .mvc-filters {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 95px 95px 83px;
}
@media (max-width: 767px) {
  .mvc-filters,
  .mvc-index-catalog .mvc-filters {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 83px;
  }
  .mvc-filters {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 83px;
  }
  .mvc-filters > .mvc-select:nth-child(1) {
    grid-column: 1/2;
    grid-row: 1;
  }
  .mvc-filters > .mvc-select:nth-child(2) {
    grid-column: 2/4;
    grid-row: 1;
  }
  .mvc-filters > .mvc-select:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
  }
  .mvc-filters > .mvc-select:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
  }
  .mvc-jump {
    grid-row: 2;
  }
  .mvc-row-meta time {
    display: none;
  }
  .mvc-row-meta {
    gap: 6px;
  }
  .mvc-toolbar {
    padding: 8px;
  }
  .mvc-overlay {
    padding: 10px;
  }
  .mvc-index-panel {
    max-height: 90dvh;
  }
  .mvc-index-catalog .mvc-filters > .mvc-select:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  .mvc-index-catalog .mvc-filters > .mvc-select:nth-child(2) {
    grid-column: 2/4;
    grid-row: 1;
  }
  .mvc-index-catalog .mvc-filters > .mvc-select:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
  }
  .mvc-index-catalog .mvc-filters > .mvc-select:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
  }
}
@media (max-width: 479px) {
  .mvc-toolbar-top {
    flex-wrap: wrap;
    gap: 6px;
  }
  .mvc-search {
    flex-basis: 100%;
  }
  .mvc-access {
    width: 100%;
  }
  .mvc-access button {
    flex: 1;
    justify-content: center;
  }
  .mvc-row {
    grid-template-columns: 31px minmax(0, 1fr) auto;
    gap: 7px;
    min-height: 40px;
    padding-right: 8px;
  }
  .mvc-number {
    font-size: 10px;
  }
  .mvc-row-meta {
    gap: 5px;
  }
  .mvc-row-meta .mvc-free {
    display: none;
  }
  .mvc-status {
    padding: 2px 4px;
    font-size: 8px;
  }
  .mvc-title > span {
    font-size: 11px;
  }
  .mvc-summary {
    padding: 4px 8px;
  }
  .mvc-index-heading {
    padding: 10px;
  }
  .mvc-group-toggle {
    padding: 6px 8px;
  }
  .mvc-group-toggle strong {
    font-size: 10px;
  }
  .mvc-group-toggle small {
    font-size: 8px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mvc-row {
    transition: none;
    scroll-behavior: auto;
  }
}
/* Keep controls dense despite the site-wide form defaults. */
main .mvc-catalog .mvc-select select {
  height: 29px;
  min-height: 29px !important;
  font-size: 10px !important;
  padding: 3px 22px 3px 7px !important;
}
main .mvc-catalog .mvc-search input {
  height: 30px;
  min-height: 30px !important;
  font-size: 11px !important;
  padding: 4px 28px 4px 9px !important;
}
main .mvc-catalog .mvc-search button {
  height: 26px;
  min-height: 26px !important;
  width: 26px;
  padding: 0;
}
main .mvc-catalog .mvc-access button {
  min-height: 29px !important;
}
main .mvc-catalog .mvc-jump input {
  height: 27px;
  min-height: 27px !important;
  padding: 3px 4px 3px 7px !important;
  font-size: 10px !important;
}
main .mvc-catalog .mvc-jump button {
  height: 27px;
  min-height: 27px !important;
  padding: 3px !important;
}
main .mvc-catalog .mvc-summary button {
  min-height: 24px !important;
}
main .mvc-catalog .mvc-group-toggle {
  min-height: 33px !important;
}
main .mvc-catalog .mvc-row {
  min-height: 39px !important;
}
main .mvc-index-catalog .mvc-row {
  min-height: 44px !important;
}
main .mvc-index-heading > button {
  min-height: 30px !important;
  padding: 0;
}
.mvc-index-heading > div:first-child {
  height: auto;
  padding: 0;
  gap: 0;
}
.mvc-index-heading :is(h2, p) {
  margin: 0;
}
.mvc-index-heading p {
  margin-top: 3px;
}


/* === Layer: moonverse-reader.css === */
/* A compact reading workspace; prose and navigation have separate density scales. */
.mvr-reader {
  min-height: 100dvh;
  padding-bottom: 96px;
  background: var(--background);
  color: var(--foreground);
  font-family: Inter, system-ui, sans-serif;
  --mvr-line: color-mix(in srgb, var(--border) 75%, transparent);
}
.mvr-reader :where(h1, h2, h3, p, dl, dd, fieldset) {
  margin: 0;
}
.mvr-reader :where(button, input, select, textarea) {
  font: inherit;
}
.mvr-reader button {
  cursor: pointer;
}
.mvr-reader button:disabled {
  opacity: 0.35;
  cursor: default;
}
.mvr-reader :is(a, button, summary):focus-visible {
  outline: 1.5px solid color-mix(in srgb, var(--primary) 70%, transparent);
  outline-offset: 2px;
}
.mvr-reader :is(select, input, textarea):focus,
.mvr-reader :is(select, input, textarea):focus-visible {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}
.mvr-reader svg {
  flex-shrink: 0;
}
.mvr-reader button[aria-pressed="true"],
.mvr-reader .is-active {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 10%, transparent);
}
.mvr-topbar {
  position: sticky;
  top: 0;
  z-index: 35;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 6px max(20px, calc((100vw - 1120px) / 2));
  border-bottom: 1px solid var(--mvr-line);
  background: color-mix(in srgb, var(--card) 94%, transparent);
  backdrop-filter: blur(12px);
}
.mvr-series-link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  font-size: 12px;
  font-weight: 600;
}
.mvr-series-link > span {
  max-width: 580px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mvr-top-actions {
  display: flex;
  gap: 4px;
  align-items: center;
  flex-shrink: 0;
}
.mvr-top-actions button,
.mvr-dock-controls :is(a, button) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 33px;
  height: 33px;
  min-height: 33px !important;
  border-radius: 5px;
  padding: 0;
  color: var(--muted-foreground);
  font-size: 13px;
  font-weight: 650;
}
.mvr-top-actions button:hover,
.mvr-dock-controls :is(a, button):hover {
  color: var(--primary);
  background: var(--muted);
}
.mvr-top-actions .mvr-theme-button {
  border: 1px solid var(--border);
  color: var(--primary);
}
.mvr-page {
  max-width: var(--mvr-width);
  margin: auto;
  padding: 14px 24px 0;
}
.mvr-reader[data-width="full"] .mvr-page {
  padding-inline: clamp(20px, 5vw, 72px);
}
.mvr-breadcrumb {
  display: flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  overflow: hidden;
  font-size: 10px;
  line-height: 1.6;
  color: var(--muted-foreground);
  margin-bottom: 20px;
}
.mvr-breadcrumb > a {
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.mvr-breadcrumb > a:first-child {
  flex-shrink: 0;
}
.mvr-breadcrumb > [aria-current] {
  flex-shrink: 0;
}
.mvr-breadcrumb > a:hover {
  color: var(--primary);
}
.mvr-chapter-heading {
  padding: 0 0 17px;
  border-bottom: 1px solid var(--mvr-line);
  margin-bottom: 17px;
}
.mvr-eyebrow {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  font-size: 9px;
  line-height: 1.5;
  color: var(--muted-foreground);
  margin-bottom: 7px;
}
.mvr-eyebrow > span:first-child {
  color: var(--primary);
  font-size: 9px;
  letter-spacing: 0.1em;
  font-weight: 700;
}
.mvr-eyebrow > span + span {
  padding-left: 9px;
  border-left: 1px solid var(--border);
}
.mvr-chapter-heading h1 {
  font-size: clamp(23px, 2.3vw, 29px);
  font-weight: 650;
  letter-spacing: -0.035em;
  line-height: 1.25;
}
.mvr-byline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 12px;
  margin-top: 9px;
  font-size: 10px;
  color: var(--muted-foreground);
}
.mvr-byline > span + span {
  position: relative;
}
.mvr-byline > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  min-height: 27px !important;
  margin-left: auto;
  border-radius: 4px;
}
.mvr-byline > button svg {
  width: 14px;
  height: 14px;
}
.mvr-resume {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  background: color-mix(in srgb, var(--primary) 7%, transparent);
  border: 1px solid color-mix(in srgb, var(--primary) 16%, var(--border));
  border-radius: 6px;
  padding: 6px 9px;
  margin: 0 0 16px;
  font-size: 10px;
  color: var(--muted-foreground);
}
.mvr-resume button {
  min-height: 27px !important;
  color: var(--primary);
  font-size: 10px;
  font-weight: 600;
}
.mvr-note {
  margin: 12px 0 18px;
  border-left: 2px solid color-mix(in srgb, var(--primary) 35%, var(--border));
  padding: 0 0 0 10px;
  color: var(--muted-foreground);
  font-size: 11px;
}
.mvr-note summary {
  cursor: pointer;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.6;
  min-height: 25px;
  list-style-position: inside;
  color: var(--primary);
}
.mvr-note > p {
  margin-top: 5px;
  line-height: 1.7;
  white-space: pre-line;
}
.mvr-prose {
  font-family: var(--mvr-font);
  font-size: var(--mvr-size);
  line-height: var(--mvr-leading);
  text-align: var(--mvr-align);
  overflow-wrap: break-word;
  color: var(--foreground);
  padding: 2px 0 8px;
  scroll-margin-top: 65px;
}
.mvr-prose p {
  font: inherit;
  line-height: inherit;
  white-space: pre-line;
  margin: 0 0 var(--mvr-spacing);
  text-indent: var(--mvr-indent);
}
.mvr-prose p:last-child {
  margin-bottom: 0;
}
.mvr-prose em {
  font-style: italic;
}
.mvr-prose strong {
  font-weight: 700;
}
.mvr-prose hr {
  width: 65px;
  margin: 26px auto;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--primary) 50%, var(--border));
}
.mvr-system-note {
  font-size: 0.85em;
  line-height: 1.7;
  text-align: left;
  border-left: 2px solid var(--primary);
  background: var(--muted);
  padding: 10px 12px;
  margin: 16px 0;
}
.mvr-footnote-ref {
  font-family: Inter, sans-serif;
  font-size: 0.7em;
  color: var(--primary);
  vertical-align: super;
  text-indent: 0;
}
.mvr-footnotes dl > div {
  display: flex;
  gap: 8px;
  padding: 5px 0;
  scroll-margin-top: 65px;
}
.mvr-footnotes dt {
  color: var(--primary);
  font-weight: 600;
}
.mvr-footnotes dd {
  line-height: 1.7;
}
.mvr-end-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 26px;
  padding: 14px 0;
  border-top: 1px solid var(--mvr-line);
  border-bottom: 1px solid var(--mvr-line);
}
.mvr-end-nav > :is(a, div) {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  padding: 5px 0;
}
.mvr-end-nav small {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--muted-foreground);
}
.mvr-end-nav strong {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mvr-end-nav .mvr-next {
  text-align: right;
  align-items: flex-end;
}
.mvr-end-nav a:hover strong {
  color: var(--primary);
}
.mvr-end-nav .mvr-next small {
  color: var(--muted-foreground);
}
.mvr-end-nav .mvr-next:hover small {
  color: var(--primary);
}
.mvr-end-nav a > span {
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvr-end-nav .is-disabled {
  opacity: 0.55;
}
.mvr-after-reading {
  margin-top: 16px;
}
.mvr-after-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 18px;
  padding: 0 0 13px;
  border-bottom: 1px solid var(--mvr-line);
  margin-bottom: 16px;
  font-size: 10px;
  color: var(--muted-foreground);
}
.mvr-after-actions button {
  min-height: 26px !important;
}
.mvr-after-actions button:first-child {
  color: var(--primary);
  font-weight: 600;
}
.mvr-locked {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
  padding: 34px 20px;
  border: 1px solid var(--mvr-line);
  border-radius: 9px;
  background: var(--card);
  margin: 22px 0;
}
.mvr-kicker {
  font-size: 9px;
  letter-spacing: 0.1em;
  color: var(--primary);
  font-weight: 600;
}
.mvr-locked h2 {
  font-size: 22px;
  letter-spacing: -0.025em;
  font-weight: 600;
}
.mvr-locked p {
  font-size: 12px;
  line-height: 1.7;
  max-width: 380px;
  color: var(--muted-foreground);
}
.mvr-locked > button:last-child {
  font-size: 11px;
  min-height: 30px !important;
  color: var(--primary);
}
.mvr-primary {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 33px !important;
  padding: 7px 12px;
  border-radius: 5px;
  font-size: 11px !important;
  font-weight: 600;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border: 1px solid var(--primary);
}
.mvr-primary:hover {
  background: var(--primary-hover) !important;
}
.mvr-reader .mvr-dock {
  position: fixed;
  bottom: max(12px, env(safe-area-inset-bottom));
  left: 50%;
  transform: translateX(-50%);
  z-index: 40;
  width: max-content;
  max-width: calc(100% - 24px);
  border: 1px solid var(--border);
  border-radius: 9px;
  background: color-mix(in srgb, var(--card) 97%, transparent);
  box-shadow: 0 5px 25px #0000001a;
  backdrop-filter: blur(16px);
  overflow: hidden;
}
.mvr-dock-progress {
  height: 2px;
  background: var(--muted);
  overflow: hidden;
}
.mvr-dock-progress > span {
  display: block;
  height: 100%;
  background: var(--primary);
  transition: width 0.15s;
}
.mvr-reader .mvr-dock > .mvr-dock-controls {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 5px 7px;
  overflow: visible;
  max-width: none;
}
.mvr-dock-controls .mvr-dock-series {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: auto;
  max-width: 220px;
  min-width: 0;
  height: 30px;
  padding: 0 7px 0 6px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--card) 65%, transparent);
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  color: var(--foreground);
  font-size: 11px;
  font-weight: 550;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.15s ease;
  flex-shrink: 1;
}
.mvr-dock-controls .mvr-dock-series svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: var(--primary);
  opacity: 0.9;
}
.mvr-dock-controls .mvr-dock-series-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  font-size: 10.5px;
  line-height: 1.2;
}
.mvr-dock-controls .mvr-dock-series-badge {
  display: inline-flex;
  align-items: center;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 1px 5px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--primary) 14%, transparent);
  color: var(--primary);
  flex-shrink: 0;
  line-height: 1.3;
}
.mvr-dock-controls .mvr-dock-series:hover {
  background: var(--accent);
  color: var(--accent-foreground);
  border-color: var(--primary);
  box-shadow: 0 1px 6px color-mix(in srgb, var(--primary) 18%, transparent);
}
.mvr-dock-controls .mvr-dock-series:hover .mvr-dock-series-badge {
  background: var(--primary);
  color: var(--primary-foreground);
}
.mvr-dock-divider {
  width: 1px;
  height: 18px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  margin: 0 3px;
  flex-shrink: 0;
  display: block;
}
.mvr-dock-controls .mvr-dock-index {
  width: 76px;
  gap: 6px;
  background: var(--muted);
  color: var(--foreground);
  font-size: 11px;
}
.mvr-dock-controls .mvr-dock-index svg {
  width: 14px;
  height: 14px;
}
.mvr-dock-position {
  font-size: 9px;
  min-width: 34px;
  text-align: center;
  color: var(--muted-foreground);
  font-variant-numeric: tabular-nums;
  margin-inline: 1px 6px;
}
.mvr-dock-controls .mvr-theme-button {
  color: var(--primary);
  border-left: 1px solid var(--border);
  border-radius: 0;
  padding-left: 5px;
  margin-left: 2px;
  width: 38px;
}
.mvr-focus-exit {
  position: fixed;
  top: 10px;
  right: 16px;
  z-index: 40;
  padding: 5px 9px;
  border: 1px solid var(--border);
  border-radius: 5px;
  font-size: 10px;
  min-height: 28px !important;
  background: var(--card);
  color: var(--muted-foreground);
}
.mvr-reader.is-focus .mvr-page {
  padding-top: 46px;
}
.mvr-reader.is-focus .mvr-chapter-heading {
  margin-bottom: 24px;
}
.mvr-notice {
  position: fixed;
  left: 50%;
  bottom: 74px;
  transform: translateX(-50%);
  z-index: 80;
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: calc(100% - 24px);
  width: max-content;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--card);
  box-shadow: 0 3px 20px #0002;
  font-size: 11px;
}
.mvr-notice > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  min-height: 25px !important;
}
.mvr-notice svg {
  width: 13px;
  height: 13px;
}
.mvr-overlay {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  justify-content: flex-end;
  background: color-mix(in srgb, var(--background) 65%, transparent);
  backdrop-filter: blur(5px);
}
.mvr-panel {
  display: flex;
  flex-direction: column;
  width: min(370px, 100%);
  height: 100dvh;
  background: var(--card);
  border-left: 1px solid var(--border);
  box-shadow: -8px 0 45px #0002;
  min-height: 0;
}
.mvr-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mvr-panel-heading h2 {
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.02em;
}
.mvr-panel-heading > button {
  width: 29px;
  height: 29px;
  min-height: 29px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted-foreground);
  border: 1px solid var(--border);
  border-radius: 5px;
}
.mvr-settings-body,
.mvr-tools-body,
.mvr-issue {
  padding: 12px 16px 18px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.mvr-settings-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 10px;
  color: var(--muted-foreground);
  margin-bottom: 14px;
}
.mvr-settings-caption button {
  min-height: 26px !important;
  font-size: 10px;
  color: var(--primary);
}
.mvr-setting {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  border: 0;
  padding: 0;
  margin: 0 0 16px;
}
.mvr-setting legend,
.mvr-setting > span,
.mvr-range > span {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 6px;
}
.mvr-segments {
  display: flex;
  gap: 3px;
  padding: 3px;
  background: var(--muted);
  border: 1px solid var(--mvr-line);
  border-radius: 6px;
}
.mvr-segments button {
  flex: 1;
  min-width: 0;
  min-height: 29px !important;
  padding: 3px;
  font-size: 10px;
  color: var(--muted-foreground);
  border-radius: 4px;
}
.mvr-segments button[aria-pressed="true"] {
  background: var(--card);
  color: var(--primary);
  box-shadow: 0 1px 4px #0001;
}
.mvr-font select,
.mvr-issue select {
  height: 33px;
  min-height: 33px !important;
  font-size: 12px !important;
  background: var(--background);
  border: 1px solid var(--border);
  border-radius: 5px;
  padding: 4px 9px;
  color: var(--foreground);
  width: 100%;
}
.mvr-font {
  gap: 0;
}
.mvr-range {
  display: block;
  margin: 0 0 15px;
}
.mvr-range > span {
  display: flex;
  justify-content: space-between;
}
.mvr-range output {
  font-size: 10px;
  font-weight: 500;
  color: var(--primary);
  font-variant-numeric: tabular-nums;
}
.mvr-range > div {
  display: flex;
  align-items: center;
  gap: 9px;
}
.mvr-range button {
  width: 29px;
  height: 29px;
  min-height: 29px !important;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--background);
  font-size: 14px;
  flex-shrink: 0;
}
.mvr-range input {
  accent-color: var(--primary);
  width: 100%;
  height: 25px;
  min-width: 0;
  cursor: pointer;
}
.mvr-indent {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  margin: 0 0 16px;
  cursor: pointer;
}
.mvr-indent input {
  accent-color: var(--primary);
  width: 14px;
  height: 14px;
}
.mvr-type-preview {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--background);
  margin-bottom: 15px;
}
.mvr-type-preview > span {
  font:
    500 9px Inter,
    sans-serif;
  color: var(--muted-foreground);
  display: block;
  margin-bottom: 7px;
  text-indent: 0;
}
.mvr-type-preview > p {
  font: inherit;
  line-height: inherit;
}
.mvr-settings-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 9px;
  color: var(--muted-foreground);
  border-top: 1px solid var(--border);
  padding-top: 12px;
}
.mvr-tools-context {
  font-size: 10px;
  color: var(--muted-foreground);
  margin: 2px 0 15px !important;
}
.mvr-tools-grid {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.mvr-tools-grid button {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  min-height: 37px !important;
  padding: 7px 9px;
  font-size: 12px;
  border-radius: 5px;
}
.mvr-tools-grid button:hover {
  background: var(--muted);
  color: var(--primary);
}
.mvr-tools-grid svg {
  color: var(--primary);
  width: 16px;
  height: 16px;
}
.mvr-shortcuts {
  border-top: 1px solid var(--border);
  margin-top: 17px;
  padding-top: 14px;
  font-size: 10px;
  color: var(--muted-foreground);
  line-height: 1.8;
}
.mvr-shortcuts strong {
  font-size: 11px;
  color: var(--foreground);
  font-weight: 600;
}
.mvr-tools-body nav {
  display: flex;
  gap: 20px;
  margin-top: 17px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  font-size: 11px;
  color: var(--primary);
}
.mvr-issue {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.mvr-issue > p {
  font-size: 11px;
  line-height: 1.7;
  color: var(--muted-foreground);
}
.mvr-issue label {
  display: flex;
  flex-direction: column;
  gap: 7px;
  font-size: 11px;
}
.mvr-issue textarea {
  min-height: 140px;
  padding: 9px;
  border: 1px solid var(--border);
  border-radius: 5px;
  font-size: 12px;
  line-height: 1.6;
  background: var(--background);
  resize: vertical;
}
.mvr-missing {
  text-align: center;
  padding: 70px 20px;
}
.mvr-missing h1 {
  font-size: 24px;
  margin-bottom: 14px;
}
.mvr-missing a {
  color: var(--primary);
}
@media (max-width: 767px) {
  .mvr-topbar {
    padding: 5px 14px;
    gap: 8px;
    min-height: 44px;
  }
  .mvr-series-link {
    font-size: 11px;
    gap: 6px;
  }
  .mvr-top-actions {
    gap: 2px;
  }
  .mvr-top-actions button {
    width: 30px;
    height: 30px;
    min-height: 30px !important;
  }
  .mvr-top-actions button:last-child {
    display: none;
  }
  .mvr-page {
    padding: 11px 20px 0;
  }
  .mvr-breadcrumb {
    margin-bottom: 17px;
    font-size: 9px;
    gap: 6px;
  }
  .mvr-chapter-heading {
    padding-bottom: 13px;
    margin-bottom: 14px;
  }
  .mvr-chapter-heading h1 {
    font-size: 24px;
  }
  .mvr-reader .mvr-dock > .mvr-dock-controls {
    padding: 5px 6px;
    gap: 2px;
  }
  .mvr-dock-controls .mvr-dock-series,
  .mvr-dock-divider {
    display: none;
  }
  .mvr-dock-controls :is(a, button) {
    width: 33px;
    height: 35px;
    min-height: 35px !important;
  }
  .mvr-dock-controls .mvr-dock-index {
    width: 74px;
  }
  .mvr-dock-controls .mvr-theme-button {
    width: 35px;
    padding-left: 2px;
    margin-left: 0;
  }
  .mvr-panel {
    width: min(350px, 100%);
  }
  .mvr-end-nav {
    gap: 12px;
  }
  .mvr-end-nav strong {
    font-size: 11px;
  }
  .mvr-end-nav small {
    font-size: 8px;
  }
  .mvr-reader.is-focus .mvr-page {
    padding-top: 44px;
  }
  .mvr-byline {
    font-size: 9px;
    gap: 5px 10px;
  }
}
@media (max-width: 479px) {
  .mvr-topbar {
    padding-inline: 12px;
  }
  .mvr-top-actions button {
    width: 28px;
    min-height: 30px !important;
  }
  .mvr-series-link > svg {
    width: 14px;
  }
  .mvr-page {
    padding-inline: 18px;
  }
  .mvr-chapter-heading h1 {
    font-size: 22px;
  }
  .mvr-breadcrumb > a:nth-of-type(2) {
    max-width: 170px;
  }
  .mvr-eyebrow {
    font-size: 8px;
    gap: 6px;
  }
  .mvr-eyebrow > span + span {
    font-size: 8px;
    padding-left: 6px;
  }
  .mvr-dock-position {
    display: none;
  }
  .mvr-dock-controls .mvr-dock-index {
    width: 69px;
  }
  .mvr-dock-controls :is(a, button) {
    width: 32px;
  }
  .mvr-dock-controls .mvr-theme-button {
    width: 34px;
  }
  .mvr-panel-heading {
    padding: 11px 14px;
  }
  .mvr-settings-body,
  .mvr-tools-body,
  .mvr-issue {
    padding-inline: 14px;
  }
  .mvr-notice {
    font-size: 10px;
  }
  .mvr-after-actions {
    gap: 4px 14px;
  }
  .mvr-focus-exit {
    right: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mvr-reader * {
    scroll-behavior: auto !important;
  }
  .mvr-dock-progress > span {
    transition: none;
  }
}
.mvr-reader .mvr-overlay {
  padding: 0 !important;
  align-items: stretch;
}
.mvr-reader .mvr-panel {
  height: 100%;
  max-height: 100dvh;
}
.mvr-reactions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--mvr-line);
}
.mvr-reactions > span:first-child {
  font-size: 10px;
  color: var(--muted-foreground);
  margin-right: 6px;
}
.mvr-reactions > button {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 29px !important;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 5px;
  font-size: 10px;
}
.mvr-reactions small {
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvr-reactions > span[role="status"] {
  font-size: 10px;
  flex-basis: 100%;
  color: var(--muted-foreground);
}
.mvr-audio {
  position: fixed;
  bottom: 74px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 42;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: calc(100% - 24px);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 5px 9px;
  box-shadow: 0 3px 20px #0001;
  font-size: 10px;
}
.mvr-audio > span {
  color: var(--muted-foreground);
  white-space: nowrap;
}
.mvr-audio button {
  min-height: 26px !important;
  font-size: 10px;
  color: var(--primary);
}
.mvr-prose .mvr-system-note p {
  font: inherit;
  line-height: inherit;
  text-indent: 0;
  margin: 0 0 5px;
  white-space: pre-line;
}
.mvr-prose .mvr-system-note p:last-child {
  margin-bottom: 0;
}

@media print {
  /* Keep the reading interface, not the prose, off the paper (C12) */
  .mvr-dock,
  .mvr-topbar,
  .mvr-after-reading {
    display: none !important;
  }
  .mvr-prose,
  #reader-prose {
    display: block !important;
    visibility: visible;
  }
}


/* === Layer: moonverse-explore.css === */
/* Compact Browse and Discover workspace. Single, flat covers throughout. */
.mve-explore {
  --mve-line: color-mix(in srgb, var(--border) 80%, transparent);
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding-bottom: 18px;
  color: var(--foreground);
  font-family: Inter, system-ui, sans-serif;
}
.mve-explore :where(h1, h2, h3, p, fieldset, legend) {
  margin: 0;
}
.mve-explore :where(button, input, select) {
  font: inherit;
}
.mve-explore button {
  cursor: pointer;
}
.mve-explore :where(a, button, summary):focus-visible {
  outline: 1.5px solid color-mix(in srgb, var(--primary) 70%, transparent);
  outline-offset: 2px;
}
.mve-explore :where(input, select):focus,
.mve-explore :where(input, select):focus-visible {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}
.mve-explore button:disabled {
  opacity: 0.4;
  cursor: default;
}
.mve-explore svg {
  flex-shrink: 0;
}
.mve-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 1px 0 12px;
  border-bottom: 1px solid var(--mve-line);
}
.mve-title-line {
  display: flex;
  gap: 13px;
  align-items: center;
  flex-wrap: wrap;
}
.mve-heading h1 {
  font-size: 25px;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -0.04em;
}
.mve-kicker {
  font-size: 8px;
  letter-spacing: 0.12em;
  color: var(--muted-foreground);
  padding-left: 13px;
  border-left: 1px solid var(--border);
}
.mve-heading > div > p {
  font-size: 11px;
  line-height: 1.6;
  margin-top: 5px;
  color: var(--muted-foreground);
}
.mve-heading-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.mve-page-tabs {
  display: flex;
  gap: 3px;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 3px;
  background: var(--muted);
}
.mve-page-tabs a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 27px;
  padding: 3px 11px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 550;
  color: var(--muted-foreground);
}
.mve-page-tabs a[aria-current="page"] {
  background: var(--card);
  color: var(--primary);
  box-shadow: 0 1px 4px #0000000b;
}
.mve-explore .mve-secondary,
.mve-explore .mve-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 31px !important;
  padding: 5px 10px;
  border: 1px solid var(--border);
  border-radius: 5px;
  font-size: 10px;
  font-weight: 550;
  white-space: nowrap;
  background: var(--card);
  color: var(--muted-foreground);
}
.mve-explore .mve-primary {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--primary-foreground);
}
.mve-secondary:hover {
  border-color: color-mix(in srgb, var(--primary) 50%, var(--border));
  color: var(--primary);
}
.mve-toolbar {
  display: flex;
  gap: 8px;
  align-items: center;
  min-width: 0;
}
.mve-search {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
}
.mve-search > svg {
  position: absolute;
  left: 10px;
  pointer-events: none;
  width: 14px;
  height: 14px;
  color: var(--muted-foreground);
}
#root main .mve-search input {
  height: 34px;
  min-height: 34px !important;
  width: 100%;
  padding: 6px 34px 6px 31px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--card);
  font-size: 11px;
  color: var(--foreground);
}
.mve-search input::placeholder {
  color: var(--muted-foreground);
  opacity: 0.85;
}
.mve-search:focus-within input {
  border-color: var(--primary);
}
#root main .mve-search button {
  position: absolute;
  right: 3px;
  top: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  min-height: 28px !important;
  padding: 0;
  color: var(--muted-foreground);
}
.mve-search button svg {
  width: 13px;
  height: 13px;
}
#root main .mve-explore select {
  height: 31px;
  min-height: 31px !important;
  max-width: 100%;
  border: 1px solid var(--border);
  border-radius: 5px;
  padding: 4px 26px 4px 8px;
  background: var(--card);
  color: var(--foreground);
  font-size: 10px;
}
.mve-toolbar > select {
  width: 150px;
  flex-shrink: 0;
}
.mve-toolbar .mve-filter-toggle {
  display: none;
}
.mve-browse-layout {
  display: grid;
  grid-template-columns: 186px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  min-width: 0;
}
.mve-filter-rail {
  position: sticky;
  top: 65px;
  min-width: 0;
  max-height: calc(100dvh - 85px);
  overflow-y: auto;
  scrollbar-width: thin;
  padding-right: 14px;
  border-right: 1px solid var(--mve-line);
}
.mve-filter-content {
  min-width: 0;
}
.mve-filter-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}
.mve-filter-heading h2 {
  font-size: 11px;
  font-weight: 650;
}
.mve-filter-heading > button {
  font-size: 9px;
  color: var(--primary);
  min-height: 26px !important;
}
.mve-genre-field {
  border: 0;
  padding: 0;
  margin-bottom: 15px;
}
.mve-genre-field legend,
.mve-filter-field > span {
  font-size: 9px;
  font-weight: 550;
  color: var(--muted-foreground);
  margin-bottom: 6px;
  display: block;
}
.mve-genre-field > button,
.mve-genre-options > button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  width: 100%;
  min-height: 27px !important;
  padding: 4px 7px;
  border-radius: 4px;
  font-size: 10px;
  text-align: left;
  color: var(--muted-foreground);
}
.mve-genre-field > button[aria-pressed="true"],
.mve-genre-options > button[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 11%, transparent);
  color: var(--primary);
  font-weight: 600;
}
.mve-genre-options > button:hover {
  background: var(--muted);
}
.mve-genre-options small,
.mve-genre-field > button small {
  font-size: 9px;
  color: var(--muted-foreground);
  font-variant-numeric: tabular-nums;
}
.mve-genre-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  margin-top: 3px;
}
.mve-filter-field {
  display: block;
  margin-bottom: 13px;
  min-width: 0;
}
.mve-filter-field > select {
  display: block;
  width: 100%;
  min-width: 0;
  text-overflow: ellipsis;
}
.mve-more-filters {
  border-top: 1px solid var(--mve-line);
  padding-top: 8px;
}
.mve-more-filters summary {
  font-size: 10px;
  color: var(--primary);
  cursor: pointer;
  min-height: 27px;
  line-height: 27px;
  margin-bottom: 5px;
}
.mve-results {
  min-width: 0;
}
.mve-results-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--mve-line);
}
.mve-status-tabs {
  display: flex;
  gap: 2px;
  min-width: 0;
}
.mve-status-tabs button,
.mve-explore .mve-library-filter {
  min-height: 28px !important;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 10px;
  color: var(--muted-foreground);
  white-space: nowrap;
}
.mve-status-tabs button[aria-pressed="true"] {
  background: var(--muted);
  color: var(--primary);
  font-weight: 600;
}
.mve-result-controls {
  display: flex;
  align-items: center;
  gap: 9px;
}
.mve-library-filter[aria-pressed="true"] {
  color: var(--primary) !important;
  background: color-mix(in srgb, var(--primary) 10%, transparent);
}
.mve-view-switch {
  display: flex;
  gap: 2px;
  border-left: 1px solid var(--border);
  padding-left: 8px;
}
.mve-explore .mve-view-switch button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 27px !important;
  width: 27px;
  padding: 0;
  border-radius: 4px;
  color: var(--muted-foreground);
}
.mve-view-switch button svg {
  width: 13px;
  height: 13px;
}
.mve-view-switch button[aria-pressed="true"] {
  background: var(--card);
  color: var(--primary);
  box-shadow: 0 1px 4px #0000000b;
}
.mve-result-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 27px;
  margin: 3px 0 5px;
  font-size: 10px;
  color: var(--muted-foreground);
}
.mve-result-summary > button {
  min-height: 25px !important;
  padding: 2px 0;
  font-size: 10px;
  color: var(--primary);
}
.mve-active-filters {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  margin: 1px 0 10px;
}
.mve-explore .mve-active-filters button {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 26px !important;
  padding: 3px 7px;
  border-radius: 4px;
  border: 1px solid color-mix(in srgb, var(--primary) 17%, var(--border));
  background: color-mix(in srgb, var(--primary) 5%, var(--card));
  font-size: 9px;
  color: var(--primary);
  max-width: 100%;
  overflow-wrap: anywhere;
}
.mve-active-filters svg {
  width: 11px;
  height: 11px;
}
.mve-books {
  min-width: 0;
}
.mve-books-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr));
  gap: 9px;
}
.mve-book {
  position: relative;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--card);
  transition:
    border-color 0.15s,
    background 0.15s;
}
.mve-book:hover {
  border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
  background: color-mix(in srgb, var(--card) 98%, var(--primary));
}
.mve-book-cards {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 25px;
  align-items: start;
  gap: 10px;
  padding: 9px;
  min-height: 108px;
}
.mve-cover {
  position: relative;
  display: block;
  isolation: isolate;
  overflow: hidden;
  background: var(--muted);
  border: 1px solid var(--mve-line);
  border-radius: 4px;
  aspect-ratio: 2/3;
  width: 100%;
  color: var(--primary);
}
.mve-cover > span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font:
    500 27px Georgia,
    serif;
}
.mve-cover img {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.mve-cover small {
  position: absolute;
  bottom: 3px;
  left: 3px;
  z-index: 1;
  font-size: 7px;
  line-height: 1;
  padding: 3px;
  border-radius: 2px;
  color: #fff;
  background: #492130dc;
}
.mve-book-copy {
  min-width: 0;
}
.mve-book-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  font-size: 8px;
  line-height: 1.3;
  color: var(--muted-foreground);
  margin: 1px 0 5px;
}
.mve-book-topline > span:first-child {
  color: var(--primary);
  font-weight: 550;
}
.mve-status {
  font-size: 8px;
}
.mve-status.is-complete {
  color: color-mix(in srgb, var(--foreground) 55%, #36875b);
}
.mve-book h2 {
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: -0.015em;
}
.mve-book h2 a {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.mve-book h2 a:hover {
  color: var(--primary);
}
.mve-book-author {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 9px;
  line-height: 1.5;
  color: var(--muted-foreground);
  margin: 4px 0 0 !important;
}
.mve-book-stats {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  font-size: 9px;
  line-height: 1.5;
  color: var(--muted-foreground);
  margin-top: 5px;
}
.mve-rating {
  color: var(--primary);
  font-weight: 600;
}
.mve-book-cards .mve-reads {
  display: none;
}
.mve-book-actions {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
}
.mve-explore .mve-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  min-height: 26px !important;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--muted-foreground);
  background: transparent;
}
.mve-icon svg {
  width: 13px;
  height: 13px;
}
.mve-explore .mve-icon:hover {
  background: var(--muted);
  color: var(--primary);
}
.mve-explore .mve-icon.is-saved {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 7%, transparent);
  border-color: color-mix(in srgb, var(--primary) 14%, var(--border));
}
.mve-books-list {
  border-top: 1px solid var(--border);
}
.mve-book-list {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 60px;
  align-items: center;
  gap: 12px;
  padding: 9px 6px;
  border-width: 0 0 1px;
  border-radius: 0;
  background: transparent;
}
.mve-book-list .mve-book-topline {
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 3px;
}
.mve-book-list .mve-book-author {
  display: inline-block;
  margin-right: 10px !important;
}
.mve-book-list .mve-book-stats {
  display: inline-flex;
  gap: 10px;
}
.mve-book-list .mve-book-description {
  font-size: 10px;
  line-height: 1.6;
  color: var(--muted-foreground);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
  margin-top: 4px;
}
.mve-book-list .mve-book-actions {
  flex-direction: row;
}
.mve-book-list h2 {
  font-size: 12px;
}
.mve-book-list h2 a {
  -webkit-line-clamp: 1;
}
.mve-books-covers {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(105px, 1fr));
  gap: 12px;
}
.mve-book-covers {
  border: 0;
  background: transparent;
  padding: 0;
}
.mve-book-covers:hover {
  background: transparent;
}
.mve-book-covers .mve-cover {
  height: 138px;
  aspect-ratio: auto;
}
.mve-book-covers .mve-book-copy {
  padding-top: 7px;
}
.mve-book-covers .mve-book-topline,
.mve-book-covers .mve-book-author,
.mve-book-covers .mve-reads {
  display: none;
}
.mve-book-covers h2 {
  font-size: 10px;
  line-height: 1.45;
  min-height: 2.9em;
}
.mve-book-covers .mve-book-actions {
  position: absolute;
  top: 4px;
  right: 4px;
  flex-direction: column;
  gap: 3px;
}
.mve-book-covers .mve-icon {
  background: var(--card);
}
.mve-book-covers .mve-book-stats {
  font-size: 9px;
  gap: 5px;
  margin-top: 4px;
}
.mve-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 45px 18px;
  border: 1px dashed var(--border);
  border-radius: 7px;
  background: color-mix(in srgb, var(--card) 40%, transparent);
  gap: 8px;
}
.mve-empty > span {
  font-size: 23px;
  color: var(--primary);
}
.mve-empty h2 {
  font-size: 15px;
  font-weight: 650;
}
.mve-empty p {
  font-size: 11px;
  color: var(--muted-foreground);
  line-height: 1.7;
  max-width: 360px;
}
.mve-empty > .mve-primary {
  margin-top: 6px;
}
.mve-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  padding: 15px 0 4px;
}
.mve-pagination button {
  min-height: 29px !important;
  padding: 4px 9px;
  font-size: 10px;
  color: var(--primary);
}
.mve-pagination select {
  max-width: 85px;
}
.mve-discover-filters {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--mve-line);
}
.mve-category-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  min-width: 0;
}
.mve-category-tabs button,
.mve-explore .mve-saved-filter {
  min-height: 28px !important;
  padding: 4px 9px;
  font-size: 10px;
  white-space: nowrap;
  border-radius: 4px;
  color: var(--muted-foreground);
}
.mve-category-tabs button[aria-pressed="true"],
.mve-saved-filter[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 11%, transparent);
  color: var(--primary);
  font-weight: 600;
}
.mve-saved-filter {
  flex-shrink: 0;
  border: 1px solid var(--border);
}
.mve-discover .mve-result-summary {
  margin: -5px 0 -4px;
}
.mve-shelves {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(282px, 100%), 1fr));
  gap: 10px;
}
.mve-shelf {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--card);
  transition: border-color 0.15s;
}
.mve-shelf:hover {
  border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
}
.mve-shelf-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 8px;
  line-height: 1.4;
  margin-bottom: 8px;
  color: var(--muted-foreground);
}
.mve-shelf-topline > span:first-child {
  color: var(--primary);
  font-weight: 600;
}
.mve-shelf h2 {
  font-size: 13px;
  line-height: 1.4;
  font-weight: 650;
  letter-spacing: -0.02em;
  margin-bottom: 5px;
}
.mve-explore .mve-shelf h2 > button {
  font: inherit;
  line-height: inherit;
  text-align: left;
  min-height: 35px !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  width: 100%;
  padding-right: 4px;
}
.mve-shelf h2 > button:hover {
  color: var(--primary);
}
.mve-shelf-description {
  font-size: 10px;
  line-height: 1.7;
  color: var(--muted-foreground);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin-bottom: 11px !important;
  min-height: 3.4em;
}
.mve-shelf-footer {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: auto;
  padding-top: 9px;
  border-top: 1px solid var(--mve-line);
}
.mve-shelf-covers {
  display: flex;
  gap: 3px;
  flex-shrink: 0;
}
.mve-shelf-covers a {
  display: block;
  width: 26px;
  height: 37px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: var(--muted);
}
.mve-shelf-covers img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mve-shelf-curator {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.mve-shelf-curator strong {
  font-size: 9px;
  font-weight: 550;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mve-shelf-curator > span {
  font-size: 8px;
  line-height: 1.4;
  white-space: nowrap;
  color: var(--muted-foreground);
}
.mve-explore .mve-shelf-save {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 28px !important;
  padding: 4px 6px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 9px;
  font-weight: 550;
  color: var(--muted-foreground);
  flex-shrink: 0;
}
.mve-shelf-save svg {
  width: 12px;
  height: 12px;
}
.mve-shelf-save.is-saved {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 7%, transparent);
  border-color: color-mix(in srgb, var(--primary) 15%, var(--border));
}
.mve-discover-footnote {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 13px 0 1px;
  font-size: 10px;
  color: var(--muted-foreground);
}
.mve-discover-footnote a {
  color: var(--primary);
}
.mve-explore .mve-overlay {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
  padding: 0 !important;
  background: color-mix(in srgb, var(--background) 70%, transparent);
  backdrop-filter: blur(6px);
}
.mve-drawer {
  display: flex;
  flex-direction: column;
  width: min(480px, 100%);
  height: 100%;
  max-height: 100dvh;
  min-height: 0;
  border-left: 1px solid var(--border);
  background: var(--card);
  box-shadow: -10px 0 40px #0002;
}
.mve-drawer-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mve-drawer-heading h2 {
  font-size: 14px;
  font-weight: 650;
}
.mve-drawer-body {
  overflow-y: auto;
  overscroll-behavior: contain;
  min-height: 0;
  padding: 16px;
  scrollbar-width: thin;
}
.mve-preview-intro {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 14px;
}
.mve-preview-intro .mve-cover {
  height: 112px;
  aspect-ratio: auto;
}
.mve-preview-status {
  display: block;
  font-size: 9px;
  color: var(--primary);
  font-weight: 550;
  margin: 2px 0 7px;
}
.mve-preview-intro h3,
.mve-collection-preview h3 {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 650;
  letter-spacing: -0.025em;
}
.mve-preview-intro p {
  font-size: 10px;
  line-height: 1.6;
  margin-top: 7px;
  color: var(--muted-foreground);
}
.mve-preview-intro small {
  display: block;
  font-size: 10px;
  color: var(--primary);
  margin-top: 6px;
}
.mve-preview-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.mve-preview-actions > .mve-primary {
  flex: 1;
}
.mve-preview-actions > .mve-icon {
  width: 31px;
  height: 31px;
  min-height: 31px !important;
}
.mve-preview-synopsis {
  font-size: 12px;
  line-height: 1.85;
  white-space: pre-line;
  margin-top: 16px !important;
  color: var(--muted-foreground);
}
.mve-preview-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 17px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}
.mve-preview-tags button {
  min-height: 26px !important;
  font-size: 9px;
  padding: 4px 7px;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--primary);
}
.mve-collection-byline {
  font-size: 10px;
  color: var(--muted-foreground);
  margin-top: 8px !important;
}
.mve-collection-description {
  font-size: 12px;
  line-height: 1.8;
  color: var(--muted-foreground);
  margin: 14px 0 !important;
}
.mve-collection-preview > .mve-shelf-save {
  min-height: 31px !important;
  padding: 6px 10px;
}
.mve-collection-books {
  margin-top: 19px;
  border-top: 1px solid var(--border);
}
.mve-collection-books > a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.mve-collection-books img {
  width: 36px;
  height: 52px;
  object-fit: cover;
  border: 1px solid var(--border);
  border-radius: 3px;
  flex-shrink: 0;
}
.mve-collection-books > a > span {
  min-width: 0;
  flex: 1;
}
.mve-collection-books strong {
  display: block;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
}
.mve-collection-books small {
  display: block;
  font-size: 9px;
  color: var(--muted-foreground);
  margin-top: 5px;
}
.mve-collection-books > a > svg {
  width: 13px;
  height: 13px;
  color: var(--primary);
}
@media (max-width: 1023px) {
  .mve-browse-layout {
    display: block;
  }
  .mve-filter-rail {
    display: none;
  }
  .mve-toolbar .mve-filter-toggle {
    display: inline-flex;
  }
  .mve-filter-rail.is-open {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: flex;
    justify-content: flex-end;
    align-items: stretch;
    max-height: none;
    overflow: hidden;
    padding: 0 !important;
    border: 0;
    background: color-mix(in srgb, var(--background) 70%, transparent);
    backdrop-filter: blur(5px);
  }
  .mve-filter-rail.is-open .mve-filter-content {
    width: min(330px, 100%);
    height: 100%;
    overflow-y: auto;
    background: var(--card);
    border-left: 1px solid var(--border);
    padding: 13px 16px 20px;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
  .mve-filter-heading {
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 13px;
  }
  .mve-filter-heading h2 {
    font-size: 14px;
  }
  .mve-filter-heading > .mve-icon {
    min-height: 26px !important;
  }
  .mve-filter-field > select {
    height: 33px !important;
  }
  .mve-genre-options {
    grid-template-columns: 1fr 1fr;
    gap: 4px;
  }
  .mve-genre-options > button,
  .mve-genre-field > button {
    min-height: 30px !important;
    font-size: 11px;
  }
  .mve-filter-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-top: 15px;
    border-top: 1px solid var(--border);
    padding-top: 12px;
  }
  .mve-filter-footer > button {
    font-size: 10px;
    min-height: 30px !important;
    color: var(--primary);
  }
  .mve-kicker {
    display: none;
  }
  .mve-heading-actions {
    gap: 8px;
  }
}
@media (max-width: 767px) {
  .mve-heading {
    align-items: flex-start;
    gap: 10px;
  }
  .mve-heading h1 {
    font-size: 23px;
  }
  .mve-heading > div > p {
    font-size: 10px;
    max-width: 330px;
  }
  .mve-heading-actions {
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
  }
  .mve-heading-actions > .mve-secondary {
    min-height: 27px !important;
    padding: 4px 8px;
    font-size: 9px;
  }
  .mve-page-tabs a {
    padding-inline: 8px;
    font-size: 9px;
    min-height: 26px;
  }
  .mve-toolbar {
    gap: 6px;
  }
  .mve-toolbar > select {
    width: 132px;
  }
  .mve-explore .mve-filter-toggle {
    min-height: 31px !important;
    padding: 5px 8px;
    font-size: 10px;
  }
  .mve-toolbar .mve-filter-toggle svg {
    display: none;
  }
  .mve-results-toolbar {
    gap: 6px;
  }
  .mve-result-controls {
    gap: 4px;
  }
  .mve-explore .mve-library-filter {
    font-size: 9px;
    padding-inline: 5px;
  }
  .mve-view-switch {
    padding-left: 5px;
  }
  .mve-view-switch button {
    width: 26px !important;
  }
  .mve-book-cards {
    min-height: 104px;
  }
  .mve-books-cards {
    grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
    gap: 8px;
  }
  .mve-books-covers {
    grid-template-columns: repeat(auto-fill, minmax(97px, 1fr));
    gap: 10px;
  }
  .mve-book-covers .mve-cover {
    height: 132px;
  }
  .mve-shelves {
    grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr));
  }
  .mve-category-tabs button {
    font-size: 9px;
    padding: 4px 7px;
  }
  .mve-shelf {
    padding: 11px;
  }
  .mve-drawer {
    width: min(450px, 100%);
  }
  .mve-drawer-heading {
    padding: 12px 14px;
  }
  .mve-drawer-body {
    padding: 14px;
  }
  .mve-book-list .mve-reads {
    display: none;
  }
  .mve-preview-intro h3 {
    font-size: 17px;
  }
}
@media (max-width: 479px) {
  .mve-explore {
    gap: 10px;
  }
  .mve-heading {
    flex-direction: column;
    gap: 8px;
    padding-bottom: 10px;
  }
  .mve-heading-actions {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 8px;
  }
  .mve-heading h1 {
    font-size: 22px;
  }
  .mve-heading > div > p {
    font-size: 10px;
    max-width: none;
  }
  .mve-toolbar {
    flex-wrap: wrap;
  }
  .mve-toolbar > .mve-search {
    flex-basis: 100%;
  }
  .mve-toolbar > select {
    flex: 1;
    width: auto;
  }
  .mve-toolbar > .mve-filter-toggle {
    flex: 1;
  }
  .mve-results-toolbar {
    flex-wrap: wrap;
    gap: 6px;
    padding-bottom: 7px;
  }
  .mve-status-tabs {
    flex: 1;
  }
  .mve-status-tabs button {
    font-size: 9px;
    padding: 4px 7px;
  }
  .mve-result-controls {
    justify-content: space-between;
    width: 100%;
  }
  .mve-result-controls .mve-library-filter {
    padding: 3px 0;
  }
  .mve-view-switch {
    border: 0;
    padding: 0;
  }
  .mve-book-cards {
    grid-template-columns: 52px minmax(0, 1fr) 25px;
    min-height: 98px;
    padding: 8px;
    gap: 9px;
  }
  .mve-book h2 {
    font-size: 11px;
  }
  .mve-book-stats {
    margin-top: 4px;
    font-size: 9px;
  }
  .mve-book-topline {
    font-size: 8px;
    margin-bottom: 4px;
  }
  .mve-book-cards .mve-book-topline .mve-status {
    font-size: 7px;
  }
  .mve-book-list {
    grid-template-columns: 34px minmax(0, 1fr) 26px;
    gap: 9px;
    padding: 8px 0;
  }
  .mve-book-list .mve-book-actions {
    flex-direction: column;
    gap: 3px;
  }
  .mve-book-list .mve-book-stats {
    display: flex;
    gap: 7px;
    margin-top: 3px;
  }
  .mve-book-list .mve-book-description {
    display: none;
  }
  .mve-book-list .mve-book-author {
    margin-top: 2px !important;
  }
  .mve-books-covers {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px 9px;
  }
  .mve-book-covers .mve-cover {
    height: 127px;
  }
  .mve-book-covers h2 {
    font-size: 9px;
  }
  .mve-book-covers .mve-icon {
    width: 24px;
    height: 24px;
    min-height: 24px !important;
  }
  .mve-book-covers .mve-book-stats {
    font-size: 8px;
    gap: 4px;
  }
  .mve-discover-filters {
    gap: 7px;
  }
  .mve-category-tabs {
    gap: 3px;
  }
  .mve-category-tabs button {
    font-size: 9px;
    padding-inline: 6px;
    min-height: 26px !important;
  }
  .mve-saved-filter {
    padding-inline: 6px !important;
    font-size: 9px !important;
  }
  .mve-discover .mve-result-summary {
    font-size: 9px;
    margin: 0;
  }
  .mve-shelf h2 {
    font-size: 13px;
  }
  .mve-shelf-description {
    font-size: 10px;
  }
  .mve-shelf-footer {
    gap: 10px;
  }
  .mve-shelf-covers a {
    width: 27px;
    height: 39px;
  }
  .mve-shelf-curator strong {
    font-size: 10px;
  }
  .mve-shelf-curator > span {
    font-size: 9px;
  }
  .mve-shelf-save {
    font-size: 9px;
  }
  .mve-preview-intro {
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 11px;
  }
  .mve-preview-intro .mve-cover {
    height: 96px;
  }
  .mve-preview-intro h3 {
    font-size: 16px;
  }
  .mve-preview-intro small {
    font-size: 9px;
  }
  .mve-preview-intro p {
    font-size: 9px;
  }
  .mve-preview-actions {
    flex-wrap: wrap;
  }
  .mve-preview-actions > .mve-primary {
    font-size: 10px;
  }
  .mve-preview-synopsis {
    font-size: 11px;
    line-height: 1.85;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mve-explore * {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
/* Covers lead the default view; controls stay compact around them. */
.mve-books-covers {
  grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
  gap: 17px 13px;
}
.mve-book-covers .mve-cover {
  height: auto;
  aspect-ratio: 2/3;
  max-height: 228px;
  box-shadow: 0 2px 7px #0000000e;
}
.mve-book-covers h2 {
  font-size: 11px;
  line-height: 1.5;
  min-height: 3em;
}
.mve-book-covers .mve-book-author {
  display: block;
  font-size: 9px;
  margin-top: 4px !important;
}
.mve-book-covers .mve-book-stats {
  font-size: 9px;
  margin-top: 4px;
  gap: 8px;
}
.mve-book-covers .mve-book-actions {
  gap: 4px;
  top: 5px;
  right: 5px;
}
.mve-book-covers .mve-icon {
  width: 26px;
  height: 26px;
  min-height: 26px !important;
  background: color-mix(in srgb, var(--card) 95%, transparent);
  box-shadow: 0 1px 4px #0001;
}
.mve-shelf-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
  max-width: 294px;
  margin: 0 auto 11px;
}
.mve-shelf-gallery > a {
  position: relative;
  display: block;
  aspect-ratio: 2/3;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--muted);
  overflow: hidden;
  box-shadow: 0 2px 6px #00000009;
}
.mve-shelf-gallery img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mve-shelf-gallery > a > span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font:
    500 25px Georgia,
    serif;
  color: var(--primary);
}
.mve-shelf-description {
  -webkit-line-clamp: 1;
  min-height: 1.7em;
  margin-bottom: 10px !important;
}
.mve-shelf h2 > button {
  min-height: 35px !important;
}
.mve-shelf-footer {
  gap: 7px;
  padding-top: 8px;
}
.mve-shelf-curator {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  flex-wrap: wrap;
}
.mve-shelf-curator > span {
  font-size: 8px;
}
.mve-shelf-footer > .mve-icon {
  border: 0;
  width: 24px;
  height: 26px;
  min-height: 26px !important;
}
.mve-shelf-footer > .mve-shelf-save {
  min-height: 27px !important;
}
.mve-more-genres {
  margin-top: 5px;
}
.mve-more-genres summary {
  font-size: 9px;
  color: var(--primary);
  cursor: pointer;
  line-height: 27px;
  min-height: 27px;
}
.mve-genre-options button > span {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (max-width: 767px) {
  .mve-books-covers {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  }
  .mve-book-covers .mve-cover {
    height: auto;
    aspect-ratio: 2/3;
  }
  .mve-book-covers h2 {
    font-size: 11px;
  }
  .mve-shelf-gallery {
    max-width: 294px;
  }
}
@media (max-width: 479px) {
  .mve-books-covers {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 17px 12px;
  }
  .mve-book-covers .mve-cover {
    height: auto;
    max-height: none;
    aspect-ratio: 2/3;
  }
  .mve-book-covers h2 {
    font-size: 11px;
    line-height: 1.5;
  }
  .mve-book-covers .mve-book-stats {
    font-size: 9px;
  }
  .mve-book-covers .mve-book-author {
    font-size: 9px;
  }
  .mve-result-controls {
    width: auto;
    flex: 1;
    justify-content: flex-end;
  }
  .mve-shelf-curator {
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
  }
  .mve-shelf-gallery {
    max-width: 294px;
    margin-bottom: 10px;
  }
  .mve-shelf-description {
    font-size: 10px;
    -webkit-line-clamp: 1;
  }
  .mve-discover .mve-toolbar {
    flex-wrap: nowrap;
  }
  .mve-discover .mve-toolbar > .mve-search {
    flex-basis: auto;
  }
  .mve-discover .mve-toolbar > select {
    flex: none;
    max-width: 120px;
  }
}
.mve-discover-filters > select {
  display: none;
}
@media (max-width: 639px) {
  .mve-category-tabs {
    display: none;
  }
  .mve-discover-filters > select {
    display: block;
    min-width: 0;
    flex: 1;
    max-width: 260px;
  }
  .mve-discover-filters {
    align-items: center;
  }
}
/* Compact cover-forward density: visible artwork with minimal surrounding UI. */
.mve-explore {
  gap: 8px;
}
.mve-heading {
  padding-bottom: 9px;
}
.mve-heading h1 {
  font-size: 23px;
}
.mve-heading > div > p {
  font-size: 10px;
  margin-top: 3px;
  line-height: 1.5;
}
.mve-kicker {
  display: none;
}
#root main .mve-search input {
  height: 31px;
  min-height: 31px !important;
  font-size: 10px;
}
#root main .mve-search button {
  top: 2px;
  height: 27px;
  min-height: 27px !important;
}
.mve-results-toolbar {
  padding-bottom: 6px;
}
.mve-result-summary {
  min-height: 25px;
  margin: 2px 0 5px;
  font-size: 9px;
}
.mve-books-covers {
  grid-template-columns: repeat(auto-fill, minmax(102px, 1fr));
  gap: 13px 10px;
}
.mve-book-covers .mve-cover {
  max-height: 170px;
}
.mve-book-covers .mve-book-copy {
  padding-top: 6px;
}
.mve-book-covers h2 {
  font-size: 10px;
  line-height: 1.45;
  min-height: 2.9em;
}
.mve-book-covers .mve-book-author {
  font-size: 8px;
  margin-top: 3px !important;
}
.mve-book-covers .mve-book-stats {
  font-size: 8px;
  gap: 6px;
  margin-top: 3px;
}
.mve-book-covers .mve-book-actions {
  top: 4px;
  right: 4px;
  gap: 3px;
}
.mve-book-covers .mve-icon {
  width: 24px;
  height: 24px;
  min-height: 24px !important;
}
.mve-book-cards {
  min-height: 99px;
  padding: 8px;
  grid-template-columns: 52px minmax(0, 1fr) 25px;
  gap: 9px;
}
.mve-book-list {
  grid-template-columns: 34px minmax(0, 1fr) 60px;
  padding-block: 7px;
  gap: 10px;
}
.mve-shelf {
  padding: 10px;
}
.mve-shelf-topline {
  margin-bottom: 7px;
}
.mve-shelf-gallery {
  max-width: 242px;
  gap: 5px;
  margin-bottom: 8px;
}
.mve-shelf-description {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  min-height: 1.7em;
}
.mve-shelf h2 {
  font-size: 12px;
  margin-bottom: 7px;
}
.mve-shelf h2 > button {
  min-height: 32px !important;
}
.mve-shelf-footer {
  padding-top: 7px;
}
.mve-shelf-curator strong {
  font-size: 9px;
}
.mve-shelves {
  gap: 9px;
}
.mve-discover-footnote {
  padding-top: 10px;
  font-size: 9px;
}
@media (max-width: 767px) {
  .mve-books-covers {
    grid-template-columns: repeat(auto-fill, minmax(103px, 1fr));
  }
  .mve-heading h1 {
    font-size: 22px;
  }
  .mve-shelf-gallery {
    max-width: 242px;
  }
}
@media (max-width: 479px) {
  .mve-explore {
    gap: 8px;
  }
  .mve-heading {
    gap: 6px;
    padding-bottom: 8px;
  }
  .mve-heading h1 {
    font-size: 21px;
  }
  .mve-heading > div > p {
    font-size: 9px;
  }
  .mve-page-tabs a {
    font-size: 9px;
    min-height: 24px;
    padding: 3px 9px;
  }
  .mve-page-tabs {
    padding: 2px;
  }
  .mve-toolbar {
    gap: 5px;
  }
  .mve-results-toolbar {
    row-gap: 3px;
  }
  .mve-books-covers {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px 9px;
  }
  .mve-book-covers .mve-cover {
    max-height: none;
  }
  .mve-book-covers h2 {
    font-size: 9px;
    line-height: 1.45;
  }
  .mve-book-covers .mve-book-author {
    font-size: 8px;
  }
  .mve-book-covers .mve-book-stats {
    font-size: 8px;
    gap: 5px;
  }
  .mve-book-list {
    grid-template-columns: 32px minmax(0, 1fr) 26px;
    gap: 9px;
  }
  .mve-shelf-gallery {
    max-width: 234px;
  }
  .mve-shelf-curator {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
  }
  .mve-shelf-curator > span {
    font-size: 8px;
  }
}
.mve-filter-heading>button:not(.mve-icon){min-width:28px}
.mve-heading>div:first-child{min-width:0;flex:1}
@media(max-width:767px){.mve-heading-actions{flex-direction:row;align-items:center}}
@media(max-width:479px){.mve-heading{flex-direction:row;align-items:center;gap:10px}.mve-heading-actions{width:auto;flex-shrink:0}.mve-heading h1{font-size:21px}.mve-heading-actions>.mve-secondary{font-size:9px;min-height:28px!important;padding-inline:7px}.mve-heading>div>p{font-size:9px}}


/* === Layer: moonverse-discover.css === */
.mve-community {
  gap: 0 !important;
  max-width: 1220px;
  margin-inline: auto;
  color: var(--foreground);
}
.mvd-intro {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 3px 0 20px;
  border-bottom: 1px solid var(--border);
}
.mvd-eyebrow {
  display: block;
  font-size: 9px;
  line-height: 1.5;
  font-weight: 650;
  letter-spacing: .15em;
  color: var(--primary);
  margin-bottom: 5px;
}
.mvd-intro h1 {
  font-size: clamp(23px, 2.5vw, 30px);
  line-height: 1.18;
  letter-spacing: -.035em;
  font-weight: 650;
}
.mvd-intro-copy {
  min-width: 0;
}
.mvd-intro-copy > p {
  font-size: 11px;
  line-height: 1.65;
  color: var(--muted-foreground);
  margin-top: 6px;
}
.mvd-stats {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 0;
}
.mvd-stats > div {
  display: flex;
  flex-direction: column-reverse;
  gap: 2px;
  padding: 0 22px;
  border-left: 1px solid var(--border);
}
.mvd-stats > div:last-child {
  padding-right: 0;
}
.mvd-stats dd {
  font-size: 23px;
  line-height: 1.1;
  font-weight: 600;
  letter-spacing: -.035em;
}
.mvd-stats dt {
  font-size: 10px;
  color: var(--muted-foreground);
}
.mvd-utility {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 13px 0;
}
.mvd-scope {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-shrink: 0;
}
.mvd-scope > button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 30px !important;
  border-radius: 5px;
  padding: 5px 10px;
  font-size: 11px;
  color: var(--muted-foreground);
  white-space: nowrap;
}
.mvd-scope > button[aria-pressed=true] {
  background: color-mix(in srgb, var(--primary) 9%, transparent);
  color: var(--primary);
  font-weight: 600;
}
.mvd-scope > button > span {
  font-size: 9px;
  min-width: 16px;
  border-radius: 3px;
  background: color-mix(in srgb, var(--primary) 8%, transparent);
  padding: 0 3px;
}
.mvd-utility > .mve-search {
  max-width: 440px;
  flex: 1;
  margin-left: auto;
}
#root main .mve-community .mve-search input {
  font-size: 11px;
  height: 33px;
  min-height: 33px !important;
  border-radius: 5px;
}
.mvd-my-lists {
  font-size: 10px;
  color: var(--primary);
  white-space: nowrap;
  line-height: 32px;
}
.mvd-directory {
  min-width: 0;
  padding-top: 9px;
}
.mvd-directory-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 9px;
}
.mvd-directory-heading > div {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.mvd-directory-heading h2 {
  font: 600 19px/1.35 var(--font-serif,Georgia,serif);
  letter-spacing: -.02em;
}
.mvd-results {
  font-size: 10px;
  color: var(--muted-foreground);
}
.mvd-clear {
  font-size: 10px;
  color: var(--primary);
  min-height: 26px !important;
  padding: 3px 6px;
  border-radius: 4px;
}
.mvd-filterbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 15px;
}
#root main .mve-community .mvd-filterbar > select {
  height: 29px;
  min-height: 29px !important;
  width: 170px;
  max-width: 100%;
  font-size: 10px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 3px 25px 3px 9px;
  color: var(--foreground);
}
.mvd-sort-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
}
.mvd-sort-tabs > span {
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: 8px;
  color: var(--muted-foreground);
  padding-right: 7px;
}
.mvd-sort-tabs button {
  font-size: 10px;
  min-height: 28px !important;
  color: var(--muted-foreground);
  padding: 4px 9px;
  border-radius: 4px;
  position: relative;
}
.mvd-sort-tabs button[aria-pressed=true] {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 7%, transparent);
  font-weight: 650;
}
.mvd-filterbar > select:last-child {
  display: none;
}
.mve-community .mve-shelves {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px 24px;
  align-items: start;
}
.mve-community .mve-shelf {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0 0 12px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  box-shadow: none;
}
.mvd-card-heading {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
}
.mve-community .mve-shelf h2 {
  font-size: 13px;
  line-height: 1.4;
  font-weight: 650;
  letter-spacing: -.015em;
  margin: 0;
  min-width: 0;
  flex: 1;
  min-height: 36px;
}
.mve-community .mve-shelf h2 > button {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  width: 100%;
  font: inherit;
  min-height: 24px !important;
  text-align: left;
  padding: 0;
  border: 0;
  border-radius: 2px;
  line-height: 1.4;
  color: var(--foreground);
}
.mvd-featured {
  font-size: 7px;
  text-transform: uppercase;
  font-weight: 650;
  letter-spacing: .04em;
  padding: 2px 4px;
  line-height: 1.5;
  border-radius: 3px;
  background: color-mix(in srgb, var(--primary) 9%, transparent);
  color: var(--primary);
  margin-top: 2px;
  flex-shrink: 0;
}
.mve-community .mve-shelf-description {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 18px;
  font-size: 10px;
  line-height: 1.8;
  color: var(--muted-foreground);
  margin: 2px 0 7px !important;
}
.mvd-byline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 21px;
  margin-bottom: 9px;
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvd-curator {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.mvd-curator img {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid var(--border);
}
.mvd-curator > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* B18: the stored curator badge (Grandmaster / Noble / S-Rank / …) */
.mvd-curator-badge {
  flex-shrink: 0;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 9999px;
  background: color-mix(in srgb, var(--primary) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--primary) 30%, transparent);
  color: var(--primary);
}
.mvd-updated {
  flex-shrink: 0;
  font-size: 8px;
}
.mve-community .mve-shelf-gallery {
  width: 100%;
  max-width: none;
  margin: 0 0 9px;
  gap: 6px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.mve-community .mve-shelf-gallery > a {
  aspect-ratio: 2/3;
  border-radius: 4px;
  box-shadow: none;
  max-height: none;
  overflow: hidden;
}
.mve-community .mve-shelf-gallery img {
  object-fit: cover;
  transition: filter .15s ease;
}
.mve-community .mve-shelf-gallery > a:hover img {
  filter: brightness(1.06);
}
.mvd-themes {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  min-height: 25px;
  margin-bottom: 7px;
  overflow: hidden;
}
.mvd-themes > a {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  max-width: 50%;
  border-radius: 3px;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  padding: 3px 5px;
  font-size: 8px;
  line-height: 1.4;
  color: var(--muted-foreground);
  background: color-mix(in srgb, var(--card) 55%, transparent);
  white-space: nowrap;
}
.mvd-themes > a > span {
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.mvd-themes small {
  font-size: 7px;
  color: var(--primary);
  flex-shrink: 0;
}
.mve-community .mve-shelf-footer {
  display: flex;
  align-items: center;
  gap: 9px;
  border-top: 0;
  padding: 0;
  margin-top: 0;
  min-height: 28px;
}
.mvd-shelf-counts {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 9px;
  color: var(--muted-foreground);
  margin-right: auto;
  min-width: 0;
  white-space: nowrap;
}
.mvd-favorites {
  color: var(--muted-foreground);
}
.mve-community .mve-shelf-save {
  min-height: 28px !important;
  font-size: 9px;
  border-color: transparent;
  background: transparent;
  padding: 4px 5px;
}
.mve-community .mve-shelf-save.is-saved {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 7%, transparent);
}
.mvd-open {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 9px;
  color: var(--primary);
  min-height: 28px !important;
  padding: 4px 0 4px 3px;
  white-space: nowrap;
}
.mvd-open svg {
  width: 12px;
  height: 12px;
}
.mve-community .mve-discover-footnote {
  margin-top: 15px;
  padding: 12px 0 4px;
  font-size: 10px;
}
.mve-community :is(button, a):focus-visible {
  outline: 1.5px solid color-mix(in srgb, var(--primary) 70%, transparent);
  outline-offset: 2px;
}
.mve-community :is(select, input):focus,
.mve-community :is(select, input):focus-visible {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}
.mve-community :is(.mvd-themes > a, .mvd-open, .mvd-my-lists, .mve-shelf h2 > button):hover {
  color: var(--primary);
}
@media (min-width: 1450px) {
  .mve-community .mve-shelf-gallery {
    max-width: 100%;
  }
}
@media (max-width: 1050px) {
  .mve-community .mve-shelves {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 23px 22px;
  }
  .mvd-intro {
    padding-bottom: 17px;
  }
  .mvd-stats > div {
    padding-inline: 17px;
  }
  .mvd-intro h1 {
    font-size: 26px;
  }
}
@media (min-width: 640px) and (max-width: 1050px) {
  .mve-community .mve-shelf-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 330px;
    margin-inline: 0;
  }
  .mve-community .mve-shelf-gallery > a {
    aspect-ratio: 2/3;
  }
}
@media (max-width: 639px) {
  .mvd-intro {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 13px;
  }
  .mvd-intro h1 {
    font-size: 24px;
  }
  .mvd-eyebrow {
    font-size: 8px;
    margin-bottom: 4px;
  }
  .mvd-intro-copy > p {
    font-size: 10px;
    max-width: 290px;
    line-height: 1.6;
    margin-top: 5px;
  }
  .mvd-stats {
    gap: 18px;
    flex-direction: row;
    width: 100%;
  }
  .mvd-stats > div {
    flex-direction: row-reverse;
    align-items: baseline;
    gap: 5px;
    padding: 0;
    border: 0;
  }
  .mvd-stats dd {
    font-size: 15px;
  }
  .mvd-stats dt {
    font-size: 9px;
  }
  .mvd-utility {
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px 0;
  }
  .mvd-utility > .mve-search {
    max-width: none;
    margin-left: 0;
    flex-basis: 100%;
    order: 3;
  }
  .mvd-scope > button {
    font-size: 10px;
    min-height: 28px !important;
    padding: 4px 9px;
  }
  .mvd-my-lists {
    margin-left: auto;
    font-size: 9px;
  }
  .mvd-directory {
    padding-top: 7px;
  }
  .mvd-directory-heading {
    margin-bottom: 8px;
  }
  .mvd-directory-heading h2 {
    font-size: 18px;
  }
  .mvd-results {
    font-size: 9px;
  }
  .mvd-filterbar {
    gap: 8px;
    margin-bottom: 14px;
    padding-bottom: 10px;
  }
  .mvd-sort-tabs {
    display: none;
  }
  .mvd-filterbar > select:last-child {
    display: block;
  }
  #root main .mve-community .mvd-filterbar > select {
    width: auto;
    flex: 1;
    font-size: 10px;
    min-width: 0;
    height: 31px;
    min-height: 31px !important;
  }
  .mve-community .mve-shelves {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  .mve-community .mve-shelf h2 {
    font-size: 14px;
    min-height: 0;
  }
  .mve-community .mve-shelf h2 > button {
    min-height: 24px !important;
  }
  .mvd-featured {
    font-size: 8px;
    margin-top: 3px;
  }
  .mve-community .mve-shelf-description {
    font-size: 10px;
    margin: 3px 0 6px !important;
  }
  .mvd-byline {
    margin-bottom: 8px;
    font-size: 10px;
  }
  .mvd-curator img {
    width: 18px;
    height: 18px;
  }
  .mvd-updated {
    font-size: 9px;
  }
  .mve-community .mve-shelf-gallery {
    gap: 6px;
    max-width: none;
    margin-bottom: 8px;
  }
  .mvd-themes {
    min-height: 26px;
    margin-bottom: 6px;
  }
  .mvd-themes > a {
    font-size: 9px;
    padding: 4px 6px;
  }
  .mvd-themes small {
    font-size: 8px;
  }
  .mvd-shelf-counts {
    font-size: 10px;
    gap: 12px;
  }
  .mve-community .mve-shelf-save,
  .mvd-open {
    font-size: 10px;
    min-height: 30px !important;
  }
  .mve-community .mve-discover-footnote {
    font-size: 9px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mve-community .mve-shelf-gallery img {
    transition: none;
  }
}


/* === Layer: moonverse-profile.css === */
.mvp-profile {
  width: 100%;
  max-width: 1100px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  color: var(--foreground);
  font-family:
    Inter,
    system-ui,
    sans-serif;
}
.mvp-profile * {
  min-width: 0;
}
.mvp-profile :is(h1, h2, h3, p, dl, dd) {
  margin: 0;
}
.mvp-profile :is(button, a, input, select, textarea) {
  -webkit-tap-highlight-color: transparent;
}
.mvp-profile button {
  cursor: pointer;
}
.mvp-profile button:disabled {
  cursor: default;
  opacity: .4;
}
.mvp-profile :is(a, button):focus-visible {
  outline: 1.5px solid color-mix(in srgb, var(--primary) 70%, transparent);
  outline-offset: 2px;
}
.mvp-profile :is(input, select, textarea):focus,
.mvp-profile :is(input, select, textarea):focus-visible {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}
.mvp-profile button:hover:not(:disabled),
.mvp-profile a:hover {
  color: var(--primary);
}
.mvp-identity {
  border: 1px solid var(--border);
  border-radius: 9px;
  overflow: hidden;
  background: var(--card);
}
.mvp-banner {
  height: 55px;
  background:
    linear-gradient(
      110deg,
      color-mix(in srgb, var(--primary) 13%, var(--card)),
      var(--card));
  background-position: center;
  background-size: cover;
  opacity: .75;
}
.mvp-identity-body {
  display: flex;
  align-items: flex-start;
  gap: 15px;
  padding: 0 18px 16px;
  position: relative;
  margin-top: -15px;
}
.mvp-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--card);
}
.mvp-avatar .animate-glow {
  animation: none !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 15%, transparent);
}
.mvp-identity-copy {
  flex: 1;
  padding-top: 19px;
}
.mvp-name-row {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}
.mvp-name-row h1 {
  font-size: 23px;
  line-height: 1.2;
  letter-spacing: -.035em;
  font-weight: 650;
  overflow-wrap: anywhere;
}
.mvp-badge {
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .025em;
  border: 1px solid color-mix(in srgb, var(--primary) 15%, var(--border));
  color: var(--primary);
  padding: 3px 6px;
  border-radius: 4px;
  background: color-mix(in srgb, var(--primary) 6%, transparent);
}
.mvp-handle {
  font-size: 10px;
  color: var(--muted-foreground);
  margin-top: 5px !important;
}
.mvp-bio {
  margin-top: 8px;
  max-width: 590px;
  font-size: 11px;
  line-height: 1.65;
  color: var(--muted-foreground);
}
.mvp-bio p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
  white-space: pre-line;
}
.mvp-bio p.is-open {
  -webkit-line-clamp: unset;
}
.mvp-bio button {
  font-size: 10px;
  min-height: 25px;
  color: var(--primary);
  padding-right: 7px;
}
.mvp-identity-actions {
  padding-top: 23px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
  max-width: 176px;
}
.mvp-profile .mvp-primary,
.mvp-profile .mvp-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 30px !important;
  border-radius: 5px;
  border: 1px solid var(--border);
  padding: 5px 10px;
  font-size: 10px;
  line-height: 1.4;
  font-weight: 550;
  white-space: nowrap;
}
.mvp-profile .mvp-primary {
  color: var(--primary-foreground);
  background: var(--primary);
  border-color: var(--primary);
}
.mvp-profile .mvp-primary:hover:not(:disabled) {
  color: var(--primary-foreground);
  filter: brightness(1.06);
}
.mvp-profile .mvp-primary svg {
  width: 12px;
  height: 12px;
}
.mvp-secondary {
  background: var(--card);
  color: var(--foreground);
}
.mvp-profile .mvp-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 30px;
  min-height: 28px !important;
  border: 1px solid var(--border);
  border-radius: 5px;
  flex-shrink: 0;
  color: var(--muted-foreground);
  background: var(--card);
}
.mvp-icon svg {
  width: 13px;
  height: 13px;
}
.mvp-preview-button {
  font-size: 9px;
  color: var(--muted-foreground);
  min-height: 25px !important;
  padding: 3px 5px;
}
.mvp-stats {
  display: flex;
  border-top: 1px solid var(--border);
  padding: 11px 18px;
  gap: 0;
}
.mvp-stats > div {
  display: flex;
  align-items: baseline;
  gap: 6px;
  padding: 0 21px;
  border-left: 1px solid var(--border);
}
.mvp-stats > div:first-child {
  padding-left: 0;
  border: 0;
}
.mvp-stats dd {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: 1.2;
}
.mvp-stats dt {
  font-size: 9px;
  color: var(--muted-foreground);
  line-height: 1.4;
}
.mvp-navigation {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--border);
  gap: 8px;
}
.mvp-navigation nav {
  display: flex;
  gap: 15px;
}
.mvp-navigation nav button {
  position: relative;
  min-height: 35px !important;
  padding: 5px 0 11px;
  font-size: 11px;
  color: var(--muted-foreground);
}
.mvp-navigation nav button[aria-current=page] {
  color: var(--primary);
  font-weight: 600;
}
.mvp-navigation nav button[aria-current=page]:after {
  content: "";
  position: absolute;
  bottom: -1px;
  inset-inline: 0;
  height: 2px;
  background: var(--primary);
}
.mvp-customize {
  font-size: 9px;
  color: var(--muted-foreground);
  padding-bottom: 6px;
}
.mvp-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 270px;
  gap: 24px;
  align-items: start;
}
.mvp-main-column,
.mvp-side-column {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.mvp-side-column {
  gap: 18px;
  border-left: 1px solid var(--border);
  padding-left: 20px;
}
.mvp-section {
  min-width: 0;
}
.mvp-section-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 11px;
  min-height: 26px;
}
.mvp-section-heading h2 {
  font-size: 13px;
  line-height: 1.4;
  font-weight: 650;
  letter-spacing: -.015em;
}
.mvp-text-button {
  font-size: 9px;
  line-height: 1.4;
  min-height: 26px !important;
  color: var(--primary);
  padding: 4px 1px;
}
.mvp-section-note {
  font-size: 8px;
  color: var(--muted-foreground);
}
.mvp-favorites {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.mvp-cover {
  position: relative;
  display: block;
  aspect-ratio: 2/3;
  overflow: hidden;
  background: var(--muted);
  border: 1px solid var(--border);
  border-radius: 4px;
  isolation: isolate;
}
.mvp-cover > span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  font: 24px Georgia, serif;
  z-index: -1;
}
.mvp-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mvp-cover > small {
  position: absolute;
  left: 4px;
  bottom: 4px;
  font-size: 8px;
  line-height: 1.4;
  min-width: 18px;
  background: var(--card);
  color: var(--foreground);
  padding: 2px 3px;
  text-align: center;
  border-radius: 2px;
}
.mvp-favorite-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 9px;
  font-weight: 550;
  line-height: 1.5;
  margin-top: 6px;
  min-height: 27px;
}
.mvp-favorite-meta {
  display: block;
  font-size: 8px;
  color: var(--muted-foreground);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 3px;
}
.mvp-reading-row {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.mvp-reading-row:first-child {
  padding-top: 0;
}
.mvp-reading-row > .mvp-cover {
  width: 34px;
  flex-shrink: 0;
}
.mvp-reading-copy {
  flex: 1;
}
.mvp-story-title {
  font-size: 11px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-weight: 550;
}
.mvp-reading-copy > p {
  font-size: 9px;
  color: var(--muted-foreground);
  margin-top: 3px !important;
}
.mvp-reading-progress {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 5px;
}
.mvp-profile progress {
  appearance: none;
  display: block;
  width: 100%;
  height: 4px;
  overflow: hidden;
  border: 0;
  border-radius: 4px;
  background: var(--muted);
  color: var(--primary);
}
.mvp-profile progress::-webkit-progress-bar {
  background: var(--muted);
}
.mvp-profile progress::-webkit-progress-value {
  background: var(--primary);
  border-radius: 4px;
}
.mvp-profile progress::-moz-progress-bar {
  background: var(--primary);
  border-radius: 4px;
}
.mvp-reading-progress progress {
  max-width: 100px;
}
.mvp-reading-progress > span {
  font-size: 8px;
  color: var(--muted-foreground);
  white-space: nowrap;
}
.mvp-read-link {
  width: 29px;
  height: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 5px;
  color: var(--primary);
  flex-shrink: 0;
}
.mvp-read-link svg {
  width: 13px;
  height: 13px;
}
.mvp-goal > div {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 9px;
}
.mvp-goal strong {
  font-size: 26px;
  letter-spacing: -.04em;
  font-weight: 600;
}
.mvp-goal span {
  font-size: 10px;
  color: var(--muted-foreground);
}
.mvp-goal > p {
  font-size: 9px;
  line-height: 1.65;
  color: var(--muted-foreground);
  margin-top: 8px !important;
}
.mvp-taste > a {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  position: relative;
  padding: 7px 0 8px;
  margin-bottom: 4px;
  font-size: 10px;
  border-bottom: 2px solid var(--muted);
}
.mvp-taste small {
  font-size: 8px;
  color: var(--muted-foreground);
}
.mvp-taste i {
  position: absolute;
  bottom: -2px;
  left: 0;
  height: 2px;
  max-width: 100%;
  background: color-mix(in srgb, var(--primary) 65%, transparent);
}
.mvp-taste p {
  font-size: 8px;
  line-height: 1.6;
  color: var(--muted-foreground);
  margin-top: 9px !important;
}

.mvp-empty {
  padding: 17px 12px;
  border: 1px dashed var(--border);
  border-radius: 5px;
  color: var(--muted-foreground);
  font-size: 11px;
  line-height: 1.7;
}
.mvp-empty :is(a, button) {
  display: inline-flex;
  color: var(--primary);
  font-size: 10px;
  margin-top: 7px;
}
.mvp-shelf-filter {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}
.mvp-profile :is(input:not([type=checkbox]), select, textarea) {
  background: var(--card);
  color: var(--foreground);
  border: 1px solid var(--border);
  border-radius: 5px;
  min-height: 33px !important;
  padding: 7px 10px;
  font:
    11px/1.5 Inter,
    system-ui,
    sans-serif;
}
.mvp-shelf-filter select {
  width: 180px;
}
.mvp-shelf-filter input {
  flex: 1;
}
.mvp-collections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 20px;
}
.mvp-collection {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.mvp-collection-covers {
  display: flex;
  gap: 3px;
  width: 88px;
  flex-shrink: 0;
}
.mvp-collection-covers img {
  display: block;
  width: 27px;
  height: 41px;
  object-fit: cover;
  border-radius: 2px;
  border: 1px solid var(--border);
}
.mvp-collection-copy {
  flex: 1;
}
.mvp-collection h3 {
  font-size: 11px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mvp-collection p {
  font-size: 9px;
  line-height: 1.6;
  color: var(--muted-foreground);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: 3px !important;
}
.mvp-collection small {
  display: block;
  font-size: 8px;
  color: var(--primary);
  margin-top: 4px;
}
.mvp-collection > svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  color: var(--primary);
}
.mvp-collection-filters {
  display: flex;
  gap: 5px;
  margin-bottom: 10px;
}
.mvp-collection-filters button {
  min-height: 28px !important;
  padding: 4px 9px;
  border-radius: 4px;
  color: var(--muted-foreground);
  font-size: 10px;
}
.mvp-collection-filters button[aria-pressed=true] {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 8%, transparent);
}
.mvp-activity-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 20px 24px;
}
.mvp-activity-grid > .mvp-section:last-child {
  grid-column: 1/-1;
}
.mvp-activity-summary {
  display: flex;
  align-items: baseline;
  gap: 9px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.mvp-activity-summary strong {
  font-size: 12px;
  font-weight: 550;
}
.mvp-activity-summary > span {
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvp-heatmap-wrap {
  overflow-x: auto;
  padding: 3px 3px 5px;
  scrollbar-width: thin;
}
.mvp-heatmap {
  display: grid;
  grid-template-rows: repeat(7, 24px);
  grid-auto-flow: column;
  grid-auto-columns: 24px;
  gap: 3px;
  width: max-content;
}
.mvp-profile .mvp-day {
  width: 24px;
  height: 24px;
  min-height: 24px !important;
  border-radius: 3px;
  background: var(--muted);
  border: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
}
.mvp-profile .mvp-day[data-level="1"] {
  background: color-mix(in srgb, var(--primary) 22%, var(--card));
}
.mvp-profile .mvp-day[data-level="2"] {
  background: color-mix(in srgb, var(--primary) 42%, var(--card));
}
.mvp-profile .mvp-day[data-level="3"] {
  background: color-mix(in srgb, var(--primary) 65%, var(--card));
}
.mvp-profile .mvp-day[data-level="4"] {
  background: var(--primary);
}
.mvp-day[aria-pressed=true] {
  outline: 2px solid var(--foreground);
  outline-offset: 1px;
}
.mvp-activity-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 7px;
  font-size: 8px;
  color: var(--muted-foreground);
}
.mvp-tropes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.mvp-tropes a {
  font-size: 9px;
  padding: 5px 7px;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--muted-foreground);
}
.mvp-achievements {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 22px;
}
.mvp-achievements article {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.mvp-achievement-icon {
  font-size: 18px;
  color: var(--primary);
  width: 24px;
  flex-shrink: 0;
}
.mvp-achievements article > div {
  flex: 1;
}
.mvp-achievements h3 {
  font-size: 11px;
  line-height: 1.5;
  font-weight: 550;
}
.mvp-achievements p {
  font-size: 9px;
  color: var(--muted-foreground);
  line-height: 1.6;
  margin-top: 3px !important;
}
.mvp-achievements small {
  display: block;
  font-size: 8px;
  color: var(--primary);
  margin-top: 4px;
}
.mvp-claimed {
  font-size: 9px;
  color: var(--primary);
  padding-top: 3px;
}
.mvp-achievements .mvp-secondary {
  font-size: 8px;
  min-height: 26px !important;
  padding: 4px 6px;
}
.mvp-preview-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: color-mix(in srgb, var(--primary) 5%, var(--card));
  color: var(--muted-foreground);
  font-size: 10px;
  line-height: 1.6;
}
.mvp-preview-notice button {
  color: var(--primary);
  min-height: 27px !important;
  font-size: 10px;
  flex-shrink: 0;
}
.mvp-profile .mvp-overlay {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
  padding: 0 !important;
  background: color-mix(in srgb, var(--background) 70%, transparent);
  backdrop-filter: blur(5px);
}
.mvp-dialog {
  display: flex;
  flex-direction: column;
  width: min(480px, 100%);
  height: 100%;
  max-height: 100dvh;
  background: var(--card);
  border-left: 1px solid var(--border);
  box-shadow: -10px 0 40px #0002;
}
.mvp-dialog-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mvp-dialog-heading h2 {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}
.mvp-dialog-body {
  min-height: 0;
  overflow-y: auto;
  padding: 16px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.mvp-form {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.mvp-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  font-size: 11px;
}
.mvp-field > span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}
.mvp-field small {
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvp-profile .mvp-field textarea {
  resize: vertical;
  min-height: 92px !important;
  max-height: 240px;
}
.mvp-form-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 7px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}
.mvp-form-note {
  font-size: 10px;
  line-height: 1.7;
  color: var(--muted-foreground);
}
.mvp-error {
  font-size: 11px;
  color: var(--destructive,#dc4848);
}
.mvp-editor-summary {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  font-size: 10px;
  margin-bottom: 10px;
}
.mvp-editor-summary strong {
  font-weight: 550;
}
.mvp-editor-summary > span {
  font-size: 9px;
  color: var(--muted-foreground);
}
.mvp-lineup {
  margin-bottom: 15px;
}
.mvp-lineup-row {
  display: flex;
  align-items: center;
  gap: 5px;
  border-bottom: 1px solid var(--border);
  padding: 7px 0;
}
.mvp-rank {
  font-size: 10px;
  color: var(--primary);
  width: 18px;
  flex-shrink: 0;
}
.mvp-lineup-title {
  flex: 1;
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mvp-lineup-row .mvp-icon {
  width: 26px;
  height: 26px;
  min-height: 26px !important;
  border: 0;
  background: transparent;
}
.mvp-editor-filter {
  display: flex;
  gap: 7px;
}
.mvp-editor-filter input {
  width: 100%;
  flex: 1;
}
.mvp-editor-filter select {
  max-width: 120px;
}
.mvp-picker-results {
  margin: 12px 0 16px;
  max-height: 300px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.mvp-pick {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.mvp-pick img {
  width: 26px;
  height: 39px;
  object-fit: cover;
  border-radius: 2px;
  flex-shrink: 0;
}
.mvp-pick > span {
  flex: 1;
}
.mvp-pick strong {
  display: block;
  font-size: 10px;
  font-weight: 550;
  line-height: 1.4;
}
.mvp-pick small {
  display: block;
  font-size: 8px;
  color: var(--muted-foreground);
  margin-top: 4px;
}
.mvp-pick .mvp-secondary {
  min-height: 27px !important;
  font-size: 9px;
  padding-inline: 7px;
}
.mvp-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  line-height: 1.7;
}
.mvp-check input {
  accent-color: var(--primary);
  width: 14px;
  height: 14px;
}
.mvp-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 950px) {
  .mvp-overview-grid {
    grid-template-columns: minmax(0, 1fr) 230px;
    gap: 18px;
  }
  .mvp-side-column {
    padding-left: 16px;
  }
  .mvp-identity-body {
    padding-inline: 15px;
  }
  .mvp-stats {
    padding-inline: 15px;
  }
  .mvp-stats > div {
    padding-inline: 15px;
  }
  .mvp-activity-grid {
    grid-template-columns: minmax(0, 1fr) 210px;
  }
  .mvp-collection-covers {
    width: 58px;
  }
  .mvp-collection-covers img:nth-child(3) {
    display: none;
  }
}
@media (max-width: 700px) {
  .mvp-profile {
    gap: 11px;
  }
  .mvp-overview-grid {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }
  .mvp-main-column,
  .mvp-side-column {
    width: 100%;
    gap: 18px;
  }
  .mvp-side-column {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    border: 0;
    padding: 0;
  }
  .mvp-side-column > .mvp-section:last-child {
    grid-column: 1/-1;
  }
  .mvp-side-column .mvp-heatmap {
    grid-auto-columns: 24px;
  }
  .mvp-identity-body {
    gap: 12px;
  }
  .mvp-identity-actions {
    max-width: 140px;
  }
  .mvp-name-row h1 {
    font-size: 21px;
  }
  .mvp-badge {
    font-size: 7px;
  }
  .mvp-bio {
    font-size: 10px;
  }
  .mvp-stats {
    padding-block: 10px;
  }
  .mvp-stats > div {
    padding-inline: 12px;
    gap: 4px;
  }
  .mvp-stats dd {
    font-size: 15px;
  }
  .mvp-stats dt {
    font-size: 8px;
  }
  .mvp-collections {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }
  .mvp-collection-covers {
    width: 88px;
  }
  .mvp-collection-covers img:nth-child(3) {
    display: block;
  }
  .mvp-activity-grid {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .mvp-achievements {
    grid-template-columns: minmax(0, 1fr);
  }
  .mvp-preview-notice {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }
  .mvp-customize {
    font-size: 8px;
  }
  .mvp-navigation nav {
    gap: 14px;
  }
  .mvp-navigation nav button {
    font-size: 10px;
  }
}
@media (max-width: 479px) {
  .mvp-banner {
    height: 39px;
  }
  .mvp-identity {
    border-radius: 7px;
  }
  .mvp-identity-body {
    padding: 0 11px 12px;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: -10px;
  }
  .mvp-avatar {
    width: 54px;
    height: 54px;
  }
  .mvp-avatar > div {
    transform: scale(.82);
  }
  .mvp-identity-copy {
    padding-top: 13px;
    flex-basis: calc(100% - 65px);
  }
  .mvp-name-row {
    gap: 5px;
  }
  .mvp-name-row h1 {
    font-size: 20px;
  }
  .mvp-badge {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mvp-handle {
    font-size: 9px;
  }
  .mvp-bio {
    margin-top: 6px;
    font-size: 10px;
  }
  .mvp-identity-actions {
    padding-top: 0;
    max-width: none;
    justify-content: flex-start;
    margin-left: 64px;
    gap: 6px;
    width: calc(100% - 64px);
  }
  .mvp-identity-actions .mvp-primary {
    font-size: 9px;
    min-height: 28px !important;
    padding: 4px 8px;
  }
  .mvp-identity-actions .mvp-icon {
    height: 28px;
    width: 28px;
  }
  .mvp-preview-button {
    font-size: 8px;
  }
  .mvp-stats {
    padding: 9px 11px;
    justify-content: space-between;
  }
  .mvp-stats > div {
    flex-direction: column;
    gap: 3px;
    padding: 0 9px;
  }
  .mvp-stats dd {
    font-size: 16px;
  }
  .mvp-stats dt {
    font-size: 7px;
  }
  .mvp-stats > div:last-child {
    padding-right: 0;
  }
  .mvp-customize {
    display: none;
  }
  .mvp-navigation nav {
    width: 100%;
    justify-content: space-between;
    gap: 10px;
  }
  .mvp-navigation nav button {
    font-size: 11px;
    min-height: 34px !important;
    padding-bottom: 10px;
  }
  .mvp-section-heading {
    margin-bottom: 9px;
  }
  .mvp-favorites {
    grid-template-columns: repeat(5, 88px);
    overflow-x: auto;
    padding-bottom: 8px;
    gap: 9px;
    scrollbar-width: thin;
    scroll-snap-type: x proximity;
  }
  .mvp-favorites > article {
    scroll-snap-align: start;
  }
  .mvp-favorite-title {
    font-size: 9px;
  }
  .mvp-favorite-meta {
    font-size: 8px;
  }
  .mvp-side-column {
    gap: 18px 15px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .mvp-side-column .mvp-section-heading {
    align-items: flex-start;
    gap: 5px;
    flex-wrap: wrap;
  }
  .mvp-side-column .mvp-section-note {
    display: none;
  }
  .mvp-goal strong {
    font-size: 24px;
  }
  .mvp-goal span {
    font-size: 9px;
  }
  .mvp-goal p {
    font-size: 9px;
  }
  .mvp-taste > a {
    font-size: 9px;
    gap: 5px;
  }
  .mvp-taste small {
    font-size: 7px;
  }
  .mvp-reading-row {
    gap: 9px;
  }
  .mvp-reading-row > .mvp-cover {
    width: 32px;
  }
  .mvp-story-title {
    font-size: 10px;
  }
  .mvp-shelf-filter {
    gap: 6px;
  }
  .mvp-shelf-filter select {
    width: 132px;
  }
  .mvp-profile .mvp-shelf-filter :is(select, input) {
    font-size: 10px;
    padding: 6px 8px;
  }
  .mvp-collection {
    gap: 10px;
  }
  .mvp-collection h3 {
    font-size: 11px;
  }
  .mvp-collection-covers {
    width: 72px;
    gap: 2px;
  }
  .mvp-collection-covers img {
    width: 23px;
    height: 35px;
  }
  .mvp-dialog-heading {
    padding: 12px 13px;
  }
  .mvp-dialog-body {
    padding: 13px;
  }
  .mvp-editor-summary {
    flex-wrap: wrap;
    gap: 4px;
  }
  .mvp-form {
    gap: 13px;
  }
  .mvp-activity-summary {
    gap: 5px;
  }
  .mvp-activity-footer {
    font-size: 8px;
    gap: 5px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mvp-profile * {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
.mvp-favorites .mvp-cover {
  max-width: 120px;
}
.mvp-overview-grid .mvp-collections {
  grid-template-columns: minmax(0, 1fr);
}
.mvp-heatmap {
  position: relative;
}


/* === Layer: moonverse-cosmetics.css === */
.mwc-avatar {
  --mwc-size:64px;
  position: relative;
  display: inline-flex;
  width: var(--mwc-size);
  height: var(--mwc-size);
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  isolation: isolate;
  vertical-align: middle;
}
.mwc-avatar-sm {
  --mwc-size:32px;
}
.mwc-avatar-md {
  --mwc-size:56px;
}
.mwc-avatar-lg {
  --mwc-size:88px;
}
.mwc-avatar-xl {
  --mwc-size:120px;
}
.mwc-avatar-core {
  position: absolute;
  inset: 17%;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(
      145deg,
      color-mix(in srgb, var(--mwc-a) 65%, #202137),
      #323347 80%);
  color: #fff;
  font:
    600 calc(var(--mwc-size)*.23)/1 Inter,
    system-ui,
    sans-serif;
  border: 1px solid color-mix(in srgb, var(--mwc-a) 40%, transparent);
}
.mwc-avatar-core > span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mwc-avatar-core img {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mwc-avatar[data-frame=none] .mwc-avatar-core {
  inset: 9%;
  border-color: var(--border);
}
.mwc-frame-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  color: var(--mwc-a);
}
.mwc-line,
.mwc-fine,
.mwc-flow,
.mwc-emblem {
  stroke: var(--mwc-a);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
  fill: none;
}
.mwc-fine {
  stroke: var(--mwc-b);
  stroke-width: .65;
  opacity: .75;
}
.mwc-aura {
  stroke: var(--mwc-b);
  stroke-width: 4;
  opacity: .15;
}
.mwc-gem,
.mwc-solid {
  fill: var(--mwc-b);
  stroke: var(--mwc-a);
  stroke-width: .5;
}
.mwc-ribbon {
  fill: color-mix(in srgb, var(--mwc-a) 17%, transparent);
  stroke: var(--mwc-a);
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.mwc-petal {
  fill: color-mix(in srgb, var(--mwc-b) 35%, var(--card));
  stroke: var(--mwc-a);
  stroke-width: .85;
}
.mwc-facet {
  fill: color-mix(in srgb, var(--mwc-a) 20%, var(--card));
  stroke: var(--mwc-b);
  stroke-width: .9;
  stroke-linejoin: round;
}
.mwc-pearl {
  fill: var(--mwc-b);
  stroke: var(--mwc-a);
  stroke-width: 1;
}
.mwc-orbit {
  transform-box: view-box;
  transform-origin: center;
  animation: mwc-orbit 42s linear infinite;
}
.mwc-counter {
  transform-box: view-box;
  transform-origin: center;
  animation: mwc-orbit 56s linear infinite reverse;
}
.mwc-flow {
  stroke-width: 2;
  animation: mwc-trace 18s linear infinite;
}
.mwc-breathe,
.mwc-sway {
  animation: mwc-breathe 6s ease-in-out infinite alternate;
}
.mwc-avatar-sm .mwc-frame-art :is(.mwc-orbit, .mwc-counter, .mwc-flow, .mwc-breathe, .mwc-sway) {
  animation: none;
}
.mwc-avatar-sm .mwc-frame-art .mwc-fine {
  stroke-width: 1;
  opacity: .6;
}
.mwc-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--foreground);
  vertical-align: middle;
  max-width: 100%;
  min-width: 0;
}
.mwc-badge > span {
  font-size: 9px;
  font-weight: 550;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.mwc-badge-art {
  width: 27px;
  height: 27px;
  flex-shrink: 0;
  overflow: visible;
}
.mwc-badge-xs .mwc-badge-art {
  width: 18px;
  height: 18px;
}
.mwc-badge-sm .mwc-badge-art {
  width: 25px;
  height: 25px;
}
.mwc-badge-md .mwc-badge-art {
  width: 48px;
  height: 48px;
}
.mwc-badge-lg .mwc-badge-art {
  width: 83px;
  height: 83px;
}
.mwc-medallion {
  fill: color-mix(in srgb, var(--mwc-a) 9%, var(--card));
  stroke: var(--mwc-a);
  stroke-width: 1.4;
}
.mwc-emblem {
  stroke-width: 2.1;
}
.mwc-badge-glint {
  animation: mwc-glint 5s ease-in-out infinite;
}
.mwc-badge-xs .mwc-badge-glint,
.mwc-badge-sm .mwc-badge-glint {
  animation: none;
}
@keyframes mwc-orbit {
  to {
    transform: rotate(360deg);
  }
}
@keyframes mwc-trace {
  to {
    stroke-dashoffset: -100;
  }
}
@keyframes mwc-breathe {
  from {
    opacity: .58;
  }
  to {
    opacity: 1;
  }
}
@keyframes mwc-glint {
  0%, 100% {
    opacity: .45;
  }
  50% {
    opacity: 1;
  }
}
:where(html[data-cosmetic-motion=off], [data-mwc-motion=off]) :is(.mwc-orbit, .mwc-counter, .mwc-flow, .mwc-breathe, .mwc-sway, .mwc-badge-glint) {
  animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
  :is(.mwc-orbit, .mwc-counter, .mwc-flow, .mwc-breathe, .mwc-sway, .mwc-badge-glint) {
    animation: none !important;
  }
}
.mww-bazaar {
  max-width: 1200px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: var(--foreground);
  font-family:
    Inter,
    system-ui,
    sans-serif;
}
.mww-bazaar :is(h1, h2, h3, p) {
  margin: 0;
}
.mww-bazaar *,
.mww-picker * {
  min-width: 0;
}
.mww-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.mww-eyebrow {
  display: block;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .15em;
  color: var(--primary);
  margin-bottom: 5px;
}
.mww-heading h1 {
  font-size: 27px;
  line-height: 1.1;
  letter-spacing: -.035em;
  font-weight: 650;
}
.mww-heading p {
  font-size: 11px;
  line-height: 1.6;
  color: var(--muted-foreground);
  margin-top: 6px;
}
.mww-balances {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 9px;
  color: var(--muted-foreground);
  flex-shrink: 0;
}
.mww-balances strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--foreground);
}
.mww-balances > a {
  color: var(--primary);
  font-size: 9px;
  padding-left: 15px;
  border-left: 1px solid var(--border);
}
.mww-dressing-room {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  padding: 18px 22px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background:
    radial-gradient(
      ellipse at 10% 20%,
      color-mix(in srgb, var(--primary) 8%, transparent),
      transparent 55%),
    var(--card);
}
.mww-preview-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 158px;
  border-right: 1px solid var(--border);
  padding-right: 22px;
}
.mww-look {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 7px;
}
.mww-look-identity {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 3px;
  max-width: 220px;
}
.mww-look-identity > strong {
  font-size: 13px;
  letter-spacing: -.025em;
  line-height: 1.4;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mww-preview-copy h2 {
  font: 600 22px/1.3 Georgia, serif;
  letter-spacing: -.025em;
}
.mww-preview-copy > p {
  font-size: 11px;
  line-height: 1.7;
  color: var(--muted-foreground);
  max-width: 460px;
  margin-top: 7px;
}
.mww-look-details {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 10px;
  margin-top: 9px;
}
.mww-look-details > span {
  color: var(--muted-foreground);
}
.mww-look-details strong {
  font-weight: 550;
}
.mww-preview-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 13px;
  flex-wrap: wrap;
}
.mww-bazaar button,
.mww-picker button {
  cursor: pointer;
}
.mww-bazaar button:disabled,
.mww-picker button:disabled {
  cursor: default;
  opacity: .4;
}
.mww-bazaar .mww-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 30px !important;
  padding: 5px 11px;
  font-size: 10px;
  background: var(--primary);
  color: var(--primary-foreground);
  border-radius: 5px;
}
.mww-try-note {
  font-size: 9px;
  color: var(--muted-foreground);
}
.mww-text-button {
  font-size: 9px;
  min-height: 27px !important;
  padding: 4px 0;
  color: var(--primary);
}
.mww-motion {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 9px;
  color: var(--muted-foreground);
  white-space: nowrap;
  line-height: 1.5;
}
.mww-motion input {
  width: 12px;
  height: 12px;
  accent-color: var(--primary);
}
.mww-dressing-room > .mww-motion {
  align-self: start;
  margin-top: 3px;
}
.mww-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 0 0;
}
.mww-type-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.mww-type-tabs button {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 30px !important;
  padding: 5px 9px;
  font-size: 10px;
  color: var(--muted-foreground);
  border-radius: 4px;
  white-space: nowrap;
}
.mww-type-tabs button[aria-pressed=true] {
  background: color-mix(in srgb, var(--primary) 8%, transparent);
  color: var(--primary);
  font-weight: 550;
}
.mww-type-tabs small {
  font-size: 8px;
  opacity: .7;
}
.mww-bazaar :is(input[type=search], select) {
  font:
    10px/1.5 Inter,
    system-ui,
    sans-serif;
  background: var(--card);
  color: var(--foreground);
  min-height: 31px !important;
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 5px 9px;
}
.mww-toolbar > input {
  flex: 1;
  max-width: 390px;
  margin-left: auto;
}
.mww-owned-filter {
  font-size: 9px;
  min-height: 30px !important;
  padding: 5px 9px;
  border: 1px solid var(--border);
  border-radius: 4px;
  white-space: nowrap;
  color: var(--muted-foreground);
}
.mww-owned-filter[aria-pressed=true] {
  background: color-mix(in srgb, var(--primary) 7%, transparent);
  color: var(--primary);
  border-color: color-mix(in srgb, var(--primary) 25%, var(--border));
}
.mww-filterbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--border);
}
.mww-filterbar > div {
  display: flex;
  gap: 7px;
  margin-right: auto;
}
.mww-filterbar > span {
  font-size: 9px;
  color: var(--muted-foreground);
}
.mww-filterbar select {
  min-width: 120px;
}
.mww-notice {
  min-height: 16px;
  font-size: 9px;
  line-height: 1.6;
  color: var(--muted-foreground);
}
.mww-catalog {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}
.mww-item {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 7px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: var(--card);
}
.mww-item.is-previewed {
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
}
.mww-bazaar .mww-item-preview {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  height: 127px;
  min-height: 127px !important;
  width: 100%;
  padding: 15px 10px 8px;
  background:
    radial-gradient(
      ellipse at center,
      color-mix(in srgb, var(--primary) 5%, transparent),
      transparent 70%);
  border-bottom: 1px solid var(--border);
}
.mww-item-preview .mwc-avatar {
  --mwc-size:92px;
}
.mww-item-realm {
  position: absolute;
  top: 7px;
  left: 8px;
  font-size: 7px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}
.mww-item-state {
  position: absolute;
  right: 7px;
  bottom: 6px;
  font-size: 7px;
  color: var(--primary);
  padding: 2px 4px;
  border-radius: 3px;
  background: var(--card);
}
.mww-item-copy {
  padding: 9px 9px 7px;
  flex: 1;
}
.mww-rarity {
  display: block;
  font-size: 7px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  margin-bottom: 4px;
}
.mww-rarity[data-rarity=celestial] {
  color: #aa8146;
}
.mww-rarity[data-rarity=epic] {
  color: #9c80b7;
}
.mww-rarity[data-rarity=rare] {
  color: #648fa5;
}
.mww-rarity[data-rarity=common] {
  color: #7d9d84;
}
.mww-item h3 {
  font-size: 10px;
  line-height: 1.45;
  font-weight: 600;
  min-height: 29px;
  overflow-wrap: anywhere;
}
.mww-item-copy > p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 8px;
  line-height: 1.7;
  color: var(--muted-foreground);
  margin-top: 5px;
  min-height: 27px;
}
.mww-item-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 7px 9px;
  border-top: 1px solid var(--border);
}
.mww-item-footer > span {
  font-size: 7px;
  color: var(--muted-foreground);
  white-space: nowrap;
}
.mww-bazaar .mww-item-action {
  font-size: 8px;
  min-height: 25px !important;
  padding: 4px 6px;
  border-radius: 4px;
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 6%, transparent);
  white-space: nowrap;
}
.mww-empty {
  text-align: center;
  padding: 35px 15px;
  border: 1px dashed var(--border);
  border-radius: 7px;
}
.mww-empty h2 {
  font-size: 17px;
  font-weight: 550;
}
.mww-empty p {
  font-size: 11px;
  color: var(--muted-foreground);
  margin-block: 10px 15px;
}
.mww-footnote {
  font-size: 9px;
  text-align: center;
  color: var(--muted-foreground);
  padding-top: 8px;
}
.mww-bazaar :is(button, a, input, select):focus-visible,
.mww-picker :is(button, a, input):focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 3px;
}
.mww-bazaar :is(a, button):hover:not(:disabled) {
  filter: brightness(1.04);
}
.mww-picker {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.mww-picker > .mww-look {
  padding: 5px 0 10px;
  border-bottom: 1px solid var(--border);
}
.mww-picker-note {
  font-size: 10px;
  line-height: 1.7;
  color: var(--muted-foreground);
}
.mww-picker-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
}
.mww-picker-tabs > button {
  min-height: 29px !important;
  font-size: 10px;
  padding: 4px 10px;
  color: var(--muted-foreground);
  border-radius: 4px;
}
.mww-picker-tabs > button[aria-pressed=true] {
  background: color-mix(in srgb, var(--primary) 8%, transparent);
  color: var(--primary);
}
.mww-picker-tabs > .mww-motion {
  margin-left: auto;
}
.mww-owned-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.mww-owned-option {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 7px;
  padding: 12px 7px 8px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--card);
  min-height: 106px !important;
}
.mww-owned-option[aria-pressed=true] {
  border-color: color-mix(in srgb, var(--primary) 50%, var(--border));
  background: color-mix(in srgb, var(--primary) 4%, var(--card));
}
.mww-owned-option > span:last-child {
  font-size: 8px;
  line-height: 1.5;
  text-align: center;
  min-height: 24px;
}
.mww-none {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  color: var(--muted-foreground);
}
.mww-picker-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}
.mww-picker-footer > a {
  font-size: 10px;
  color: var(--primary);
}
.mvp-avatar {
  width: 76px;
  height: 76px;
  background: transparent;
  border-radius: 0;
}
.mvp-avatar > .mwc-avatar {
  --mwc-size:76px;
  transform: none;
}
.mvp-banner {
  height: 43px;
}
.mvp-identity-body {
  margin-top: -16px;
  padding-bottom: 13px;
}
.mvp-identity-copy {
  padding-top: 17px;
}
.mvp-name-row > .mwc-badge {
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 6px 1px 2px;
  background: color-mix(in srgb, var(--primary) 3%, var(--card));
}
.mvp-name-row > .mwc-badge .mwc-badge-art {
  width: 19px;
  height: 19px;
}
.mvp-name-row > .mwc-badge > span {
  font-size: 8px;
}
.mvp-name-row h1 {
  font-size: 24px;
}
.mvp-profile .mvp-customize {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 29px !important;
  font-size: 9px;
  color: var(--primary);
  padding-bottom: 8px;
}
.mvp-profile .mvp-customize:before {
  content: "\2727";
  font-size: 13px;
}
.mvp-favorites {
  gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.mvp-favorites .mvp-cover {
  max-width: 108px;
}
.mvp-favorite-title {
  font-size: 9px;
}
.mvp-profile {
  gap: 12px;
}
.mv-talk-avatar:has(> .mwc-avatar) {
  width: 36px;
  height: 36px;
  overflow: visible;
  border: 0;
  background: none;
  border-radius: 0;
}
.mv-talk-avatar > .mwc-avatar {
  --mwc-size:36px;
}
.mv-talk-avatar-small:has(> .mwc-avatar) {
  width: 28px;
  height: 28px;
}
.mv-talk-avatar-small > .mwc-avatar {
  --mwc-size:28px;
}
.mv-talk-author > .mwc-badge-xs .mwc-badge-art {
  width: 17px;
  height: 17px;
}
@media (max-width: 1100px) {
  .mww-catalog {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .mww-dressing-room {
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 18px;
    padding: 15px 18px;
  }
  .mww-dressing-room > .mww-motion {
    grid-column: 2;
    justify-self: start;
    margin-top: -4px;
  }
  .mww-preview-stage {
    grid-row: 1/3;
    padding-right: 18px;
  }
  .mww-preview-copy h2 {
    font-size: 21px;
  }
  .mww-balances {
    gap: 11px;
  }
}
@media (max-width: 850px) {
  .mww-catalog {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
  }
  .mww-toolbar {
    flex-wrap: wrap;
    gap: 8px;
  }
  .mww-toolbar > input {
    order: 3;
    flex-basis: 100%;
    max-width: none;
  }
  .mww-owned-filter {
    margin-left: auto;
  }
  .mww-preview-stage {
    min-height: 150px;
  }
  .mww-preview-copy h2 {
    font-size: 19px;
  }
  .mww-heading h1 {
    font-size: 25px;
  }
  .mww-balances > a {
    display: none;
  }
}
@media (max-width: 639px) {
  .mww-catalog {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  .mww-dressing-room {
    grid-template-columns: 126px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
  }
  .mww-preview-stage {
    border-right: 0;
    padding-right: 0;
    min-height: 0;
  }
  .mww-preview-stage .mwc-avatar-xl {
    --mwc-size:98px;
  }
  .mww-look-identity > strong {
    font-size: 11px;
  }
  .mww-look-identity .mwc-badge > span {
    font-size: 8px;
    max-width: 95px;
  }
  .mww-look-identity .mwc-badge-art {
    width: 20px;
    height: 20px;
  }
  .mww-preview-copy > .mww-eyebrow {
    font-size: 7px;
    letter-spacing: .1em;
  }
  .mww-preview-copy h2 {
    font-size: 18px;
    line-height: 1.3;
  }
  .mww-preview-copy > p {
    font-size: 9px;
    line-height: 1.6;
    margin-top: 5px;
  }
  .mww-look-details {
    display: none;
  }
  .mww-preview-actions {
    gap: 5px;
    margin-top: 9px;
  }
  .mww-preview-actions .mww-primary {
    min-height: 28px !important;
    font-size: 9px;
    padding: 4px 9px;
  }
  .mww-preview-actions > a {
    display: none;
  }
  .mww-try-note {
    font-size: 8px;
  }
  .mww-dressing-room > .mww-motion {
    font-size: 8px;
  }
  .mww-item-preview .mwc-avatar {
    --mwc-size:82px;
  }
  .mww-bazaar .mww-item-preview {
    height: 118px;
    min-height: 118px !important;
  }
  .mww-badge-lg .mwc-badge-art {
    width: 72px;
    height: 72px;
  }
  .mww-heading p {
    font-size: 10px;
  }
  .mww-balances {
    align-items: flex-end;
    flex-direction: column;
    gap: 4px;
    font-size: 8px;
  }
  .mww-balances strong {
    font-size: 11px;
  }
  .mww-filterbar select {
    min-width: 0;
    width: 120px;
  }
  .mvp-name-row h1 {
    font-size: 22px;
  }
}
@media (max-width: 479px) {
  .mww-bazaar {
    gap: 10px;
  }
  .mww-heading h1 {
    font-size: 25px;
  }
  .mww-heading p {
    font-size: 9px;
    max-width: 210px;
  }
  .mww-heading .mww-eyebrow {
    font-size: 7px;
  }
  .mww-dressing-room {
    grid-template-columns: 106px minmax(0, 1fr);
    gap: 10px;
    padding: 11px 10px;
  }
  .mww-preview-stage .mwc-avatar-xl {
    --mwc-size:88px;
  }
  .mww-look-identity > strong {
    font-size: 10px;
  }
  .mww-look-identity .mwc-badge-art {
    width: 18px;
    height: 18px;
  }
  .mww-look-identity .mwc-badge > span {
    max-width: 75px;
    font-size: 7px;
  }
  .mww-preview-copy h2 {
    font-size: 17px;
  }
  .mww-preview-copy > p {
    font-size: 8px;
  }
  .mww-preview-actions .mww-text-button {
    font-size: 8px;
  }
  .mww-catalog {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }
  .mww-item h3 {
    font-size: 11px;
    min-height: 32px;
  }
  .mww-item-copy > p {
    font-size: 9px;
    min-height: 30px;
  }
  .mww-item-footer > span {
    font-size: 8px;
  }
  .mww-bazaar .mww-item-action {
    font-size: 9px;
    min-height: 27px !important;
    padding: 4px 6px;
  }
  .mww-bazaar .mww-item-preview {
    height: 124px;
    min-height: 124px !important;
  }
  .mww-item-preview .mwc-avatar {
    --mwc-size:88px;
  }
  .mww-item-realm,
  .mww-item-state {
    font-size: 7px;
  }
  .mww-type-tabs {
    gap: 2px;
  }
  .mww-type-tabs button {
    font-size: 9px;
    gap: 4px;
    padding: 4px 7px;
  }
  .mww-type-tabs small {
    font-size: 7px;
  }
  .mww-owned-filter {
    font-size: 8px;
    padding: 4px 6px;
  }
  .mww-filterbar {
    gap: 6px;
  }
  .mww-filterbar > div {
    gap: 5px;
  }
  .mww-filterbar select {
    width: 105px;
    font-size: 9px;
    padding: 5px 6px;
  }
  .mww-filterbar > .mww-text-button {
    font-size: 8px;
  }
  .mww-filterbar > span {
    font-size: 8px;
  }
  .mww-notice {
    font-size: 8px;
  }
  .mwc-avatar-lg {
    --mwc-size:78px;
  }
  .mvp-avatar {
    width: 65px;
    height: 65px;
  }
  .mvp-avatar > .mwc-avatar {
    --mwc-size:65px;
  }
  .mvp-identity-copy {
    padding-top: 13px;
    flex-basis: calc(100% - 75px);
  }
  .mvp-identity-body {
    margin-top: -11px;
    gap: 8px;
  }
  .mvp-identity-actions {
    margin-left: 73px;
    width: calc(100% - 73px);
  }
  .mvp-name-row h1 {
    font-size: 21px;
  }
  .mvp-name-row > .mwc-badge {
    padding: 0 4px 0 1px;
  }
  .mvp-name-row > .mwc-badge .mwc-badge-art {
    width: 16px;
    height: 16px;
  }
  .mvp-name-row > .mwc-badge > span {
    font-size: 7px;
  }
  .mvp-profile .mvp-customize {
    font-size: 0;
    padding: 0 2px 7px;
    min-width: 25px;
    flex-shrink: 0;
  }
  .mvp-profile .mvp-customize:before {
    font-size: 16px;
  }
  .mvp-navigation nav {
    gap: 9px;
  }
  .mvp-navigation nav button {
    font-size: 10px;
  }
  .mvp-favorites {
    grid-template-columns: repeat(5, 83px);
    gap: 9px;
  }
  .mvp-favorites .mvp-cover {
    max-width: none;
  }
  .mww-owned-grid {
    gap: 7px;
  }
  .mww-owned-option {
    padding: 10px 5px 7px;
  }
  .mww-owned-option > span:last-child {
    font-size: 8px;
  }
  .mww-owned-option .mwc-avatar {
    --mwc-size:54px;
  }
  .mww-owned-option .mwc-badge-art {
    width: 43px;
    height: 43px;
  }
}
.mwc-frame-art {
  mask-image:
    radial-gradient(
      circle closest-side,
      transparent 0 66%,
      #000 68%);
}
.mwc-emblem {
  stroke: color-mix(in srgb, var(--mwc-a) 67%, var(--foreground));
}
.mwc-medallion {
  stroke: color-mix(in srgb, var(--mwc-a) 78%, var(--foreground));
}
.mwc-line,
.mwc-flow {
  stroke: color-mix(in srgb, var(--mwc-a) 85%, var(--foreground));
}
@media (max-width: 479px) {
  .mww-filterbar {
    flex-wrap: wrap;
  }
  .mww-filterbar > div {
    flex: 1;
  }
  .mww-filterbar select {
    flex: 1;
    width: auto;
    min-width: 0;
  }
}
.mww-try-dock {
  position: fixed;
  z-index: 35;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(480px, calc(100% - 24px));
  border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--border));
  border-radius: 8px;
  box-shadow: 0 6px 30px #0002;
  background: var(--card);
  padding: 8px 10px;
}
.mww-try-dock > .mwc-avatar {
  --mwc-size:45px;
}
.mww-dock-copy {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.mww-dock-copy small {
  font-size: 7px;
  letter-spacing: .12em;
  color: var(--primary);
}
.mww-dock-copy strong {
  font-size: 10px;
  font-weight: 550;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mww-dock-copy > span {
  font-size: 8px;
  color: var(--muted-foreground);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mww-dock-reset {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 28px;
  min-height: 28px !important;
  font-size: 17px;
  color: var(--muted-foreground);
}
.mww-try-dock .mww-primary {
  font-size: 9px;
  white-space: nowrap;
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .mww-try-dock {
    bottom: calc(70px + env(safe-area-inset-bottom));
    gap: 6px;
    padding: 7px 8px;
  }
  .mww-try-dock > .mwc-avatar {
    --mwc-size:38px;
  }
  .mww-try-dock .mww-primary {
    font-size: 8px;
    padding: 4px 7px;
  }
  .mww-dock-copy strong {
    font-size: 9px;
  }
  .mww-dock-copy > span {
    font-size: 7px;
  }
}
.mv-talk-avatar:has(>.mwc-avatar){flex-basis:36px}.mv-talk-avatar-small:has(>.mwc-avatar){flex-basis:28px}
@media(min-width:851px){.mww-dressing-room{padding:15px 18px}.mww-preview-stage{min-height:120px}.mww-preview-stage>.mww-look{flex-direction:row;gap:10px}.mww-preview-stage .mwc-avatar-xl{--mwc-size:100px}.mww-preview-stage .mww-look-identity{align-items:flex-start;max-width:110px}.mww-look-details{display:none}.mww-preview-copy>p{font-size:10px;line-height:1.6;margin-top:5px}.mww-preview-actions{margin-top:10px}}
@media(min-width:851px) and (max-width:1100px){.mww-preview-stage .mwc-avatar-xl{--mwc-size:76px}.mww-preview-stage .mww-look-identity{max-width:80px}.mww-look-identity>strong{font-size:11px}.mww-preview-stage .mwc-badge>span{max-width:70px;font-size:8px}}

/* Sculpted SVG frames: a stable silhouette around independent magical layers. */
.mxf-art{mask-image:none;overflow:visible}
.mxf-art :is(path,circle){stroke-linecap:round;stroke-linejoin:round}
.mxf-rim{fill:none;stroke:color-mix(in srgb,var(--mwc-a) 80%,var(--foreground));stroke-width:2.1}
.mxf-metal,.mxf-gold{fill:none;stroke:var(--mwc-a);stroke-width:1.25}
.mxf-gold{stroke:var(--mwc-b);stroke-width:1.6}
.mxf-filigree,.mxf-engrave,.mxf-web,.mxf-seal{fill:none;stroke:var(--mwc-b);stroke-width:.65;opacity:.85}
.mxf-engrave{stroke-width:.75;opacity:1}
.mxf-web{opacity:.45}
.mxf-seal{stroke-width:1;opacity:.65}
.mxf-vine{fill:none;stroke:var(--mwc-b);stroke-width:2.5;opacity:.3}
.mxf-enamel,.mxf-bloom,.mxf-leaf,.mxf-ice,.mxf-silk,.mxf-water,.mxf-void{fill:color-mix(in srgb,var(--mwc-a) 35%,var(--card));stroke:var(--mwc-a);stroke-width:1.1}
.mxf-enamel{fill:color-mix(in srgb,var(--mwc-a) 32%,#222337)}
.mxf-bloom{fill:color-mix(in srgb,var(--mwc-a) 62%,#342440);stroke:var(--mwc-b);stroke-width:.8}
.mxf-leaf{fill:color-mix(in srgb,var(--mwc-a) 45%,#173c35);stroke:var(--mwc-b);stroke-width:.65}
.mxf-ice{fill:color-mix(in srgb,var(--mwc-a) 32%,#314e65);stroke:var(--mwc-b);stroke-width:.8}
.mxf-silk{fill:color-mix(in srgb,var(--mwc-a) 44%,#243856);stroke:var(--mwc-b);stroke-width:1}
.mxf-water{fill:color-mix(in srgb,var(--mwc-a) 34%,#1a4a65)}
.mxf-void{fill:#28213c;stroke:var(--mwc-b);stroke-width:1.2}
.mxf-jewel{fill:var(--mwc-b);stroke:color-mix(in srgb,var(--mwc-a) 50%,#fff);stroke-width:.65}
.mxf-star{fill:var(--mwc-b);stroke:none}
.mxf-pearl{fill:#e8f6ff;stroke:var(--mwc-a);stroke-width:1.4;filter:drop-shadow(0 0 2px var(--mwc-a))}
.mxf-eye{fill:#efffe2;filter:drop-shadow(0 0 2px #a2ffc5)}
.mxf-scales{fill:none;stroke:color-mix(in srgb,var(--mwc-a) 70%,#185951);stroke-width:5.5}
.mxf-dark-rim{fill:none;stroke:color-mix(in srgb,var(--mwc-a) 45%,#1f1a3b);stroke-width:5}
.mxf-nebula,.mxf-veil,.mxf-curtain{fill:none;stroke:var(--mwc-b);stroke-width:5;opacity:.3}
.mxf-veil{stroke:var(--mwc-a);stroke-width:8;opacity:.18}
.mxf-curtain{stroke-width:3;opacity:.6}
.mxf-dash,.mxf-energy{fill:none;stroke:var(--mwc-a);stroke-width:1.5}
.mxf-energy{stroke:var(--mwc-b);stroke-width:2.5;filter:drop-shadow(0 0 1.8px var(--mwc-a))}
.mxf-corona{fill:var(--mwc-b);stroke:none;opacity:.8}
.mxf-fire{fill:color-mix(in srgb,var(--mwc-a) 75%,#c95b32);stroke:var(--mwc-b);stroke-width:.9}
.mxf-electric{fill:color-mix(in srgb,var(--mwc-a) 50%,#4466b7);stroke:var(--mwc-b);stroke-width:1;filter:drop-shadow(0 0 1px var(--mwc-a))}
.mxf-bubble{fill:none;stroke:var(--mwc-b);stroke-width:.8}
/* The aperture clips only the ornament drawing; portrait and initials remain untouched. */
.mxf-art{mask-image:radial-gradient(circle closest-side,transparent 0 60%,#000 62%)}
.mxf-art :is(.mxf-spin,.mxf-reverse){transform-box:view-box;transform-origin:50% 50%;animation:mxf-revolve 18s linear infinite}
.mxf-art .mxf-reverse{animation-duration:27s;animation-direction:reverse}
.mxf-art[data-motif=storm] .mxf-spin{animation-duration:11s}
.mxf-art[data-motif=rift] .mxf-spin{animation-duration:14s}
.mxf-art[data-motif=prism] .mxf-reverse{animation-duration:22s}
.mxf-art .mxf-dash{animation:mxf-stream 5s linear infinite}
.mxf-art .mxf-twinkle{animation:mxf-spark 3.6s ease-in-out infinite}
.mxf-art .mxf-petal{animation:mxf-luster 4.5s ease-in-out infinite alternate}
.mxf-art :is(.mxf-wing-left,.mxf-wing-right){transform-box:view-box;transform-origin:50% 50%;animation:mxf-wing 5s ease-in-out infinite}
.mxf-art .mxf-wing-right{animation-name:mxf-wing-reverse}
.mxf-art .mxf-fox{animation:mxf-luster 4s ease-in-out infinite alternate}
.mxf-art .mxf-ember{animation:mxf-rise 4s ease-out infinite}
.mxf-art .mxf-float{animation:mxf-bob 6s ease-in-out infinite}
.mxf-art[data-motif=eclipse] .mxf-ornaments{animation:mxf-luster 5s ease-in-out infinite alternate}
.mxf-art[data-motif=aurora] .mxf-ornaments{animation:mxf-luster 4s ease-in-out infinite alternate}
@keyframes mxf-revolve{to{transform:rotate(360deg)}}
@keyframes mxf-stream{to{stroke-dashoffset:-100}}
@keyframes mxf-spark{0%,100%{opacity:.25}45%,60%{opacity:1}}
@keyframes mxf-luster{from{opacity:.68}to{opacity:1}}
@keyframes mxf-wing{0%,100%{transform:rotate(-1.5deg)}50%{transform:rotate(2.5deg)}}
@keyframes mxf-wing-reverse{0%,100%{transform:rotate(1.5deg)}50%{transform:rotate(-2.5deg)}}
@keyframes mxf-rise{0%{transform:translateY(4px);opacity:0}25%{opacity:1}100%{transform:translateY(-8px);opacity:0}}
@keyframes mxf-bob{0%,100%{transform:translateY(2px);opacity:.5}50%{transform:translateY(-3px);opacity:1}}
.mwc-avatar-sm .mxf-art *{animation:none!important;filter:none}
html[data-cosmetic-motion=off] .mxf-art *,[data-mwc-motion=off] .mxf-art *{animation:none!important}
@media(prefers-reduced-motion:reduce){.mxf-art *{animation:none!important}}
/* Keep catalog artwork live while on screen and suspend distant rows. */

.mww-item-preview .mxf-art{transition:filter .2s ease}
.mww-item-preview:hover .mxf-art{filter:drop-shadow(0 0 3px color-mix(in srgb,var(--mwc-a) 25%,transparent))}
@media(prefers-reduced-motion:reduce){.mww-item-preview .mxf-art{transition:none}}
.mwc-avatar:has(>.mxf-art)>.mwc-avatar-core{inset:19%}
.mxf-inspector{padding:0;border:1px solid var(--border);border-radius:14px;width:min(420px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;background:var(--card);color:var(--foreground);box-shadow:0 24px 100px #0006;margin:auto}
.mxf-inspector::backdrop{background:#0b0b1dbb;backdrop-filter:blur(5px)}
.mxf-inspector>header{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;border-bottom:1px solid var(--border)}
.mxf-inspector>header>span{font-size:8px;letter-spacing:.18em;color:var(--muted-foreground)}
.mxf-inspector>header>button{width:30px;height:30px;min-height:30px!important;font-size:22px;border-radius:5px;color:var(--muted-foreground)}
.mxf-inspector-stage{--card:#17182b;--foreground:#f2eaff;position:relative;isolation:isolate;height:310px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at center,#302842 0,#161625 50%,#0c101a 100%)}
.mxf-inspector-stage>.mwc-avatar-xl{--mwc-size:260px}
.mxf-stage-halo{position:absolute;inset:17%;border:1px solid #c5b3ed13;border-radius:50%;box-shadow:0 0 0 22px #bea7ed04,0 0 0 44px #bea7ed03}
.mxf-inspector-stage>button{position:absolute;top:calc(50% - 20px);width:30px;height:40px;min-height:40px!important;border:1px solid #fff2;border-radius:6px;color:#e0d3f9;background:#ffffff07;font:26px/1 system-ui}
.mxf-prev{left:10px}.mxf-next{right:10px}
.mxf-stage-index{position:absolute;bottom:12px;font-size:8px;letter-spacing:.2em;color:#a095b7}
.mxf-inspector-copy{padding:16px 20px 18px}
.mxf-inspector-copy>h2{font:500 23px/1.25 Georgia,serif;margin:7px 0}
.mxf-inspector-copy>p{font-size:11px;line-height:1.6;color:var(--muted-foreground);min-height:35px;margin:0}
.mxf-inspector-controls{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:14px 0 10px}
.mxf-inspector-controls>label{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted-foreground)}
.mxf-inspector-controls input{accent-color:var(--primary);width:13px;height:13px}
.mxf-inspector-copy>small{font-size:8px;line-height:1.5;display:block;color:var(--muted-foreground)}
.mxf-inspector button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.mxf-inspector button:hover{filter:brightness(1.15)}
@media(max-width:479px),(max-height:650px){.mxf-inspector-stage{height:230px}.mxf-inspector-stage>.mwc-avatar-xl{--mwc-size:200px}.mxf-inspector-copy{padding:12px 15px}.mxf-inspector-copy>h2{font-size:21px}.mxf-inspector-controls{margin:10px 0 8px}}
@media(max-height:450px){.mxf-inspector-stage{height:145px}.mxf-inspector-stage>.mwc-avatar-xl{--mwc-size:135px}.mxf-inspector-copy>p{min-height:0}.mxf-inspector-copy>h2{font-size:18px;margin:4px 0}}
.mww-bazaar:has(dialog[open]) :is(.mww-catalog,.mww-preview-stage) .mxf-art *{animation-play-state:paused}
/* Explicit preview playback is local; the catalog still honors reduced motion. */
@media(prefers-reduced-motion:reduce){
 [data-mwc-motion=preview] .mxf-art .mxf-spin{animation:mxf-revolve 18s linear infinite!important}
 [data-mwc-motion=preview] .mxf-art .mxf-reverse{animation:mxf-revolve 27s linear infinite reverse!important}
 [data-mwc-motion=preview] .mxf-art .mxf-dash{animation:mxf-stream 5s linear infinite!important}
 [data-mwc-motion=preview] .mxf-art .mxf-twinkle{animation:mxf-spark 3.6s ease-in-out infinite!important}
 [data-mwc-motion=preview] .mxf-art .mxf-petal{animation:mxf-luster 4.5s ease-in-out infinite alternate!important}
 [data-mwc-motion=preview] .mxf-art .mxf-wing-left{animation:mxf-wing 5s ease-in-out infinite!important}
 [data-mwc-motion=preview] .mxf-art .mxf-wing-right{animation:mxf-wing-reverse 5s ease-in-out infinite!important}
 [data-mwc-motion=preview] .mxf-art .mxf-fox{animation:mxf-luster 4s ease-in-out infinite alternate!important}
 [data-mwc-motion=preview] .mxf-art .mxf-ember{animation:mxf-rise 4s ease-out infinite!important}
 [data-mwc-motion=preview] .mxf-art .mxf-float{animation:mxf-bob 6s ease-in-out infinite!important}
}


/* === Layer: moonverse-account.css === */
/* Account rooms share a restrained, compact reading-library language. */
.mva-page{max-width:1120px;margin:0 auto;display:flex;flex-direction:column;gap:16px;color:var(--foreground);font-family:Inter,system-ui,sans-serif}
.mva-page svg,.mva-dialog svg,.mva-save svg,.mva-notification-trigger svg,.mvr-site-body svg{width:16px;height:16px;flex-shrink:0}
.mva-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:4px 0 1px}
.mva-eyebrow{font-size:8px;letter-spacing:.16em;color:var(--muted-foreground);text-transform:uppercase}
.mva-heading h1{font-size:27px;line-height:1.15;font-weight:650;letter-spacing:-.035em;margin:5px 0 6px}
.mva-heading p{font-size:11px;color:var(--muted-foreground);margin:0}
.mva-heading>a,.mva-heading-links{font-size:10px;color:var(--muted-foreground)}
.mva-heading-links{display:flex;align-items:center;gap:14px}
.mva-page :is(a,button){transition:background .15s,color .15s,border-color .15s}
.mva-page :is(button,input,select),.mva-dialog :is(button,input,select){font:inherit}
.mva-page button,.mva-dialog button{cursor:pointer}
.mva-page button:disabled,.mva-dialog button:disabled{opacity:.45;cursor:default}
.mva-page :is(button,a):focus-visible,.mva-dialog :is(button,a):focus-visible,.mva-save:focus-visible,.mva-notification-trigger:focus-visible{outline:1.5px solid color-mix(in srgb,var(--primary) 70%,transparent);outline-offset:2px}
.mva-page :is(input,select,textarea):focus,.mva-page :is(input,select,textarea):focus-visible,.mva-dialog :is(input,select,textarea):focus,.mva-dialog :is(input,select,textarea):focus-visible{outline:none!important;border-color:color-mix(in srgb,var(--primary) 70%,var(--border))!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)!important}
.mva-primary,.mva-page .mva-primary,.mva-dialog .mva-primary{background:#665098;color:#fff;border:1px solid #665098;border-radius:6px;min-height:32px;padding:7px 12px;font-size:10px;font-weight:550;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.mva-primary:hover{background:#54407e!important;border-color:#54407e!important}
.mva-secondary{background:var(--muted);color:var(--foreground);border:1px solid var(--border);border-radius:5px;padding:6px 10px;font-size:10px}
.mva-tabs{display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:thin}
.mva-tabs>button{font-size:11px;white-space:nowrap;color:var(--muted-foreground);border-bottom:2px solid transparent;padding:10px 0 11px;min-height:36px!important;background:none}
.mva-tabs>button[aria-current=page]{border-color:var(--primary);color:var(--foreground);font-weight:650}
.mva-library-layout{display:grid;grid-template-columns:150px minmax(0,1fr);gap:22px}
.mva-shelves{display:flex;flex-direction:column;gap:3px;border-right:1px solid var(--border);padding:0 13px 0 0}
.mva-shelves>button{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:34px!important;padding:7px 9px;border-radius:5px;font-size:10px;text-align:left;color:var(--muted-foreground)}
.mva-shelves>button>span{font-size:9px;font-variant-numeric:tabular-nums;opacity:.8}
.mva-shelves>button[aria-pressed=true]{background:color-mix(in srgb,var(--primary) 12%,var(--card));color:var(--foreground);font-weight:650}
.mva-shelves>button:hover{background:var(--muted)}
.mva-library-content{min-width:0}
.mva-toolbar{display:flex;align-items:center;gap:8px;font-size:10px;min-width:0}
.mva-toolbar>input{flex:1;min-width:80px;height:32px;border:1px solid var(--border);border-radius:5px;padding:6px 10px;background:var(--card);color:var(--foreground);font-size:10px}
.mva-toolbar>button,.mva-toolbar>select{min-height:32px!important;padding:5px 9px;border:1px solid var(--border);border-radius:5px;color:var(--muted-foreground);background:var(--card);font-size:10px;white-space:nowrap}
.mva-toolbar>button[aria-pressed=true]{background:color-mix(in srgb,var(--primary) 15%,var(--card));color:var(--foreground);border-color:var(--primary)}
.mva-view-switch{display:flex;border:1px solid var(--border);padding:2px;border-radius:5px;background:var(--card)}
.mva-view-switch>button{min-width:27px;min-height:26px!important;display:grid;place-items:center;color:var(--muted-foreground);border-radius:3px}
.mva-view-switch>button[aria-pressed=true]{color:var(--foreground);background:var(--muted)}
.mva-view-switch svg{width:13px;height:13px}
.mva-result-line{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:9px;color:var(--muted-foreground);margin:11px 0}
.mva-result-line>button{min-height:25px!important;font-size:9px}
.mva-library-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px 13px}
.mva-library-book{min-width:0;display:flex;flex-direction:column;gap:8px;position:relative}
.mva-cover{display:block;aspect-ratio:2/3;background:var(--muted);overflow:hidden;border-radius:5px;border:1px solid color-mix(in srgb,var(--border) 60%,transparent)}
.mva-cover>img{width:100%;height:100%;object-fit:cover}
.mva-library-book-copy{display:flex;flex-direction:column;gap:5px;min-width:0}
.mva-book-title{font-size:10px;line-height:1.5;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:30px}
.mva-book-title:hover{color:var(--primary)}
.mva-book-author{font-size:8px;color:var(--muted-foreground);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mva-library-book select{width:100%;background:var(--card);border:1px solid var(--border);color:var(--foreground);font-size:9px;border-radius:4px;height:27px;padding:4px 5px}
.mva-reading-progress{height:2px;border-radius:2px;background:var(--border);margin:3px 0}
.mva-reading-progress>span{display:block;height:100%;background:var(--primary);border-radius:2px}
.mva-between{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:10px}
.mva-library-book .mva-between{font-size:9px;white-space:nowrap}
.mva-between small{font-size:8px;color:var(--muted-foreground)}
.mva-between>a{color:var(--primary);font-weight:550}
.mva-book-tools{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding-top:4px}
.mva-book-tools>a{font-size:8px;color:var(--muted-foreground)}
.mva-library-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}
.mva-library-list .mva-library-book{flex-direction:row;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
.mva-library-list .mva-cover{width:73px;flex-shrink:0}
.mva-library-list .mva-library-book-copy{flex:1}
.mva-library-list .mva-book-title{font-size:11px;min-height:0}
.mva-library-list .mva-book-tools{border:0;padding:0}
.mva-library-list .mva-library-book select{height:25px}
.mva-empty{padding:32px 16px;text-align:center;color:var(--muted-foreground);font-size:11px;border:1px dashed var(--border);border-radius:6px;line-height:1.7}
.mva-empty h2,.mva-empty h3{font-size:14px;color:var(--foreground);margin:0 0 7px}
.mva-empty button{font-size:10px;text-decoration:underline;margin-top:8px}
.mva-empty svg{margin:0 auto 10px}
.mva-save-wrap{display:inline-flex;position:relative;vertical-align:middle}
.mva-save{display:inline-flex!important;align-items:center;justify-content:center;border-radius:5px!important;width:29px;min-width:29px;height:29px;min-height:29px!important;background:#222333e8!important;color:#fff!important;border:1px solid #ffffff66!important;box-shadow:0 1px 4px #0002;transition:background .15s,box-shadow .15s;cursor:pointer}
.mva-save:hover{background:#38364f!important;box-shadow:0 0 0 2px #ffffff66}
.mva-save[data-saved=true]{background:#665098!important;border-color:#9b87c5!important;color:#fff!important}
.mva-save[data-saved=true] svg{fill:currentColor;stroke-width:1.5}
.mva-save-inline{background:var(--card)!important;color:var(--foreground)!important;border-color:var(--border)!important;box-shadow:none}
.mva-save-inline:hover{background:var(--muted)!important;color:var(--foreground)!important;box-shadow:none}
.mva-save-inline[data-saved=true]{background:#665098!important;color:#fff!important}
.mv-story-card .mva-save-wrap{position:absolute;right:6px;top:6px;z-index:12}
.mv-story-card :is(.absolute.bottom-2,.absolute.bottom-1){gap:5px}
.mv-story-card :is(.absolute.bottom-2,.absolute.bottom-1) .mva-save-wrap{position:static}
.mva-dialog{color:var(--foreground);background:var(--card);padding:0;border:1px solid var(--border);border-radius:11px;max-height:calc(100dvh - 24px);width:min(480px,calc(100vw - 24px));overflow:auto;margin:auto;box-shadow:0 20px 80px #0004}
.mva-dialog::backdrop{background:#13132399;backdrop-filter:blur(4px)}
.mva-dialog>header{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);gap:12px}
.mva-dialog>header h2{font-size:15px;font-weight:600;margin:0}
.mva-dialog>header>button{width:29px;height:29px;min-height:29px!important;display:grid;place-items:center;color:var(--muted-foreground);border-radius:4px}
.mva-dialog>header>button:hover{background:var(--muted);color:var(--foreground)}
.mva-dialog-body{padding:16px}
.mva-context{font-size:11px;line-height:1.7;color:var(--muted-foreground);margin:0 0 12px}
.mva-save-dialog{max-width:350px}
.mva-shelf-options{display:flex;flex-direction:column;gap:3px;margin:8px 0 14px}
.mva-shelf-options>button{min-height:36px!important;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;border-radius:5px;font-size:12px;text-align:left}
.mva-shelf-options>button[aria-pressed=true]{background:color-mix(in srgb,var(--primary) 13%,var(--card));font-weight:600;color:var(--foreground)}
.mva-shelf-options>button:hover{background:var(--muted)}
.mva-save-dialog footer{padding-top:12px;border-top:1px solid var(--border);font-size:10px}
.mva-danger{color:#b0445b!important;font-size:10px;min-height:28px!important}
html.dark .mva-danger{color:#e9a4b2!important}
.mva-bookmarks>div:first-child{margin-bottom:12px}
.mva-bookmarks h2{font-size:15px;font-weight:600;margin:0}
.mva-bookmark-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.mva-bookmark-row .mva-cover{width:33px;flex-shrink:0}
.mva-bookmark-row>div{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0;font-size:12px}
.mva-bookmark-row>div>a:last-child{font-size:10px;color:var(--muted-foreground)}
.mva-bookmark-row>button{display:grid;place-items:center;width:29px;height:29px;min-height:29px!important;color:var(--muted-foreground)}
.mva-topup-content{display:flex;flex-direction:column;gap:13px}
.mva-mini-balance{display:flex;align-items:center;gap:9px;font-size:11px;background:var(--muted);border:1px solid var(--border);border-radius:6px;padding:11px}
.mva-mini-balance>strong{margin-left:auto;font-size:20px;font-variant-numeric:tabular-nums;font-weight:550}
.mva-topup-content>.mva-context{margin:0;font-size:10px}
.mva-packs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.mva-packs>button{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;border:1px solid var(--border);border-radius:6px;min-height:108px!important;padding:9px 3px;background:var(--card);color:var(--foreground)}
.mva-packs>button[aria-pressed=true]{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--card));box-shadow:inset 0 0 0 1px var(--primary)}
.mva-pack-label{font-size:7px;color:var(--muted-foreground);height:12px}
.mva-packs strong{font-size:21px;font-weight:550;letter-spacing:-.03em}
.mva-packs small{font-size:7px;color:var(--muted-foreground);white-space:nowrap}
.mva-pack-price{font-size:10px;font-weight:600;margin-top:1px}
.mva-custom{display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--border);padding:1px 0 12px}
.mva-custom>label{font-size:10px;white-space:nowrap}
.mva-custom input{width:80px;min-width:0;height:30px;padding:5px 7px;border:1px solid var(--border);border-radius:4px;font-size:11px;background:var(--background);color:var(--foreground)}
.mva-custom>span{font-size:8px;color:var(--muted-foreground)}
.mva-quote{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px}
.mva-quote strong{font-size:15px}
.mva-wide{width:100%}
.mva-error{font-size:10px;color:#b0445b;margin:-5px 0 0}
.mva-notice{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--primary) 35%,var(--border));border-radius:6px;background:color-mix(in srgb,var(--primary) 8%,var(--card));font-size:11px;line-height:1.6;margin:0}
.mva-notice button{min-width:25px;min-height:25px!important}
.mva-small{font-size:8px;color:var(--muted-foreground)}
.mva-wallet-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--border);border-radius:8px;background:var(--card)}
.mva-wallet-summary>div{display:flex;align-items:center;gap:12px;padding:17px 18px;border-right:1px solid var(--border)}
.mva-wallet-summary>div:last-child{border:0}
.mva-wallet-summary>div>svg{width:21px;height:21px;color:var(--primary)}
.mva-wallet-summary>div>span:has(small){display:flex;flex-direction:column;gap:5px}
.mva-wallet-summary small{font-size:7px;letter-spacing:.15em;color:var(--muted-foreground)}
.mva-wallet-summary strong{font-size:20px;line-height:1.1;font-weight:550;white-space:nowrap}
.mva-wallet-summary>div:last-child strong{font-size:14px}
.mva-wallet-summary>div>:last-child:is(a,button){margin-left:auto;white-space:nowrap;font-size:9px}
.mva-dew-symbol{font-size:27px;color:var(--primary)}
.mva-pass{border:1px solid color-mix(in srgb,var(--primary) 30%,var(--border));border-radius:8px;padding:23px;display:grid;grid-template-columns:52px minmax(0,1fr) 180px;gap:20px;align-items:center;background:linear-gradient(120deg,color-mix(in srgb,var(--primary) 8%,var(--card)),var(--card) 65%)}
.mva-pass-seal{width:50px;height:65px;display:grid;place-items:center;clip-path:polygon(50% 0,100% 22%,92% 80%,50% 100%,8% 80%,0 22%);background:color-mix(in srgb,var(--primary) 16%,var(--card));color:var(--primary)}
.mva-pass-seal svg{width:26px;height:26px}
.mva-pass h2{font:500 26px/1.2 Georgia,serif;margin:7px 0}
.mva-pass p{font-size:11px;color:var(--muted-foreground);margin:0}
.mva-pass ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;padding:0;margin:20px 0 0;list-style:none}
.mva-pass li{display:flex;gap:8px;align-items:flex-start}
.mva-pass li>svg{width:13px;height:13px;color:var(--primary);margin-top:2px}
.mva-pass li>span{display:flex;flex-direction:column;gap:4px}
.mva-pass li strong{font-size:10px;font-weight:550}
.mva-pass li small{font-size:9px;color:var(--muted-foreground);line-height:1.5}
.mva-pass-action{display:flex;flex-direction:column;gap:8px;border-left:1px solid var(--border);padding-left:20px}
.mva-pass-action>strong{font-size:22px;line-height:1.3;font-weight:600}
.mva-pass-action small{font-size:8px;line-height:1.6;color:var(--muted-foreground)}
.mva-pass-action .mva-primary{margin-top:3px}
.mva-wallet-links{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.mva-wallet-links>section{padding:17px 18px;border:1px solid var(--border);border-radius:7px;background:var(--card)}
.mva-wallet-links h2{font-size:13px;font-weight:600;margin:0 0 7px}
.mva-wallet-links p{font-size:10px;color:var(--muted-foreground);line-height:1.7;margin:0 0 8px;max-width:410px}
.mva-wallet-links :is(a,button){font-size:10px;color:var(--primary);min-height:28px!important}
.mva-epubs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}
.mva-epubs>article{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--border);padding:15px 0}
.mva-epubs img{width:43px;aspect-ratio:2/3;object-fit:cover;border-radius:4px;background:var(--muted)}
.mva-epubs article>div{flex:1;min-width:0}
.mva-epubs h3{font-size:12px;font-weight:600;line-height:1.5;margin:0}
.mva-epubs p{font-size:10px;color:var(--muted-foreground);margin:4px 0}
.mva-epubs small{font-size:8px;color:var(--muted-foreground)}
.mva-epubs .mva-secondary{font-size:9px;max-width:105px}
.mva-ledger-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px}
.mva-ledger-layout>section{border:1px solid var(--border);background:var(--card);border-radius:7px;padding:18px}
.mva-ledger-layout h2{font-size:14px;font-weight:600;margin:0 0 8px}
.mva-ledger-layout p{font-size:10px;line-height:1.7;color:var(--muted-foreground);margin:0 0 14px}
.mva-redeem form{display:flex;gap:7px}
.mva-redeem input{min-width:0;width:100%;padding:7px 9px;font-size:11px;border:1px solid var(--border);border-radius:5px;background:var(--background);color:var(--foreground)}
.mva-redeem details{font-size:10px;color:var(--muted-foreground);margin-top:14px}
.mva-redeem summary{cursor:pointer;min-height:24px}
.mva-code-examples{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.mva-code-examples button{background:var(--muted);font-size:9px;padding:5px 6px;min-height:26px!important;border-radius:3px}
.mva-ledger ol{list-style:none;padding:0;margin:0}
.mva-ledger li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);font-size:10px}
.mva-ledger li>div{display:flex;flex-direction:column;gap:5px}
.mva-ledger li strong{font-size:11px;font-weight:550}
.mva-ledger li small{font-size:8px;color:var(--muted-foreground)}
.mva-ledger li>span{font-size:9px;text-align:right}
.mva-confirm p{font-size:12px;line-height:1.8;margin:0 0 14px}
.mva-notification-trigger{position:relative;display:grid;place-items:center;width:33px;height:33px;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--foreground)}
.mva-notification-trigger>span{position:absolute;right:-4px;top:-4px;border:2px solid var(--background);background:#a83f63;color:#fff;min-width:17px;height:17px;border-radius:10px;font:600 8px/13px system-ui;padding:0 3px}
.mva-notification-popover{position:fixed;top:58px;bottom:auto;right:20px;left:auto;margin:0;width:min(410px,calc(100vw - 24px));max-height:calc(100dvh - 80px)}
.mva-notification-popover::backdrop{background:#13132333;backdrop-filter:none}
.mva-notification-popover .mva-dialog-body{padding:0}
.mva-notification-header-bar{display:flex;flex-direction:column;gap:7px;padding:8px 10px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--card) 95%,var(--background))}
.mva-notif-pills-scroll{display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:1px}
.mva-notif-pills-scroll::-webkit-scrollbar{display:none}
.mva-notif-pill{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:9999px;font-size:10px;font-weight:600;white-space:nowrap;background:var(--muted);color:var(--muted-foreground);border:1px solid transparent;cursor:pointer;transition:all .15s ease;min-height:24px}
.mva-notif-pill:hover{color:var(--foreground);background:color-mix(in srgb,var(--muted) 70%,var(--foreground))}
.mva-notif-pill.is-active{background:var(--primary);color:var(--primary-foreground);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.mva-notif-pill-badge{display:inline-block;padding:0 4px;font-size:8px;font-weight:750;border-radius:9999px;background:rgba(255,255,255,.25);color:inherit;line-height:12px}
.mva-notif-pill.is-active .mva-notif-pill-badge{background:rgba(255,255,255,.35);color:#fff}
.mva-notification-subtoolbar{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mva-notif-unread-btn{display:inline-flex;align-items:center;gap:5px;padding:2.5px 7px;border-radius:6px;border:1px solid var(--border);background:var(--card);color:var(--muted-foreground);font-size:9px;font-weight:600;cursor:pointer;transition:all .15s ease;min-height:22px}
.mva-notif-unread-btn.is-active{border-color:var(--primary);color:var(--foreground);background:color-mix(in srgb,var(--primary) 12%,var(--card))}
.mva-unread-pill-dot{width:5px;height:5px;border-radius:50%;background:#f59e0b}
.mva-notif-mark-all-btn{padding:2.5px 7px;border-radius:6px;border:1px solid var(--border);background:transparent;color:var(--muted-foreground);font-size:9px;cursor:pointer;transition:all .15s ease;min-height:22px}
.mva-notif-mark-all-btn:hover:not(:disabled){color:var(--foreground);border-color:var(--foreground)}
.mva-notif-mark-all-btn:disabled{opacity:.4;cursor:not-allowed}
.mva-notification-list{max-height:min(440px,calc(100dvh - 190px));overflow-y:auto;overscroll-behavior:contain}
.mva-notif-item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border);transition:background .15s ease}
.mva-notif-item.is-unread{background:color-mix(in srgb,var(--primary) 6%,var(--card));border-left:3px solid var(--primary);padding-left:9px}
.mva-notif-item.is-read{opacity:.88}
.mva-notif-item:hover{background:color-mix(in srgb,var(--muted) 45%,var(--card))}
.mva-notif-thumb{width:36px;height:48px;object-fit:cover;border-radius:4px;flex-shrink:0;border:1px solid var(--border)}
.mva-notification-symbol{display:grid;place-items:center;width:31px;height:31px;background:var(--muted);color:var(--primary);border-radius:5px;flex-shrink:0}
.mva-notification-symbol.is-announcement{background:rgba(245,158,11,.15);color:#f59e0b}
.mva-notif-link{flex:1;min-width:0;text-decoration:none;color:inherit;cursor:pointer}
.mva-notification-copy{display:flex;flex-direction:column;gap:3px}
.mva-notification-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted-foreground)}
.mva-notification-meta time{font-size:8px;white-space:nowrap}
.mva-notif-cat-tag{display:inline-block;padding:1px 6px;border-radius:4px;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border:1px solid}
.mva-cat-announcement{background:rgba(245,158,11,.15);color:#d97706;border-color:rgba(245,158,11,.35)}
.dark .mva-cat-announcement,.theme-midnight .mva-cat-announcement{color:#fbbf24}
.mva-cat-chapter{background:color-mix(in srgb,var(--primary) 15%,transparent);color:var(--primary);border-color:color-mix(in srgb,var(--primary) 35%,transparent)}
.mva-cat-community{background:rgba(16,185,129,.15);color:#059669;border-color:rgba(16,185,129,.35)}
.dark .mva-cat-community,.theme-midnight .mva-cat-community{color:#34d399}
.mva-cat-new{background:rgba(99,102,241,.15);color:#6366f1;border-color:rgba(99,102,241,.35)}
.dark .mva-cat-new,.theme-midnight .mva-cat-new{color:#818cf8}
.mva-cat-default{background:var(--muted);color:var(--muted-foreground);border-color:var(--border)}
.mva-notif-title{display:block;font-size:11px;font-weight:700;color:var(--foreground);line-height:1.4;margin-top:1px}
.mva-notif-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:10px;color:var(--muted-foreground);line-height:1.5;margin-top:1px}
.mva-notif-check-btn{width:24px;min-width:24px;height:24px;min-height:24px!important;border-radius:6px;border:1px solid var(--border);background:var(--card);color:var(--muted-foreground);display:grid;place-items:center;flex-shrink:0;cursor:pointer;transition:all .15s ease}
.mva-notif-check-btn:hover{border-color:var(--primary);color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--card))}
.mva-notification-feed .mva-empty{margin:12px;border-style:none;padding:25px 15px}
.mva-profile-utilities{padding:0 1px;border-bottom:1px solid var(--border);margin-top:-4px}
.mva-profile-utilities>summary{font-size:10px;line-height:1.5;color:var(--muted-foreground);cursor:pointer;padding:5px 0 10px;min-height:29px}
.mva-profile-utilities>nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:0 0 11px}
.mva-profile-utilities a{font-size:10px;color:var(--primary);min-height:25px;display:flex;align-items:center}
/* Retain the complete collection editor, with a quieter compact presentation. */
.mva-legacy-library .mv-page-library{max-width:1120px;padding:0!important}
.mva-legacy-library .mv-page-heading{border:0!important;background:none!important;box-shadow:none!important;padding:4px 0!important;backdrop-filter:none!important}
.mva-legacy-library .mv-page-heading h1{font-size:26px!important;font-weight:600!important;letter-spacing:-.03em}
.mva-legacy-library .celestial-card{border-radius:6px!important;box-shadow:none!important;transform:none!important}
.mva-legacy-library .grid.grid-cols-3{border:0!important;border-bottom:1px solid var(--border)!important;border-radius:0!important;background:none!important;padding:0!important;display:flex!important;gap:12px}
.mva-legacy-library .grid.grid-cols-3>button{background:none!important;color:var(--muted-foreground)!important;box-shadow:none!important;min-height:36px!important;border-radius:0!important;padding:8px 0!important;font-size:11px!important}
.mva-legacy-library .grid.grid-cols-3>button.bg-indigo-600{color:var(--foreground)!important;border-bottom:2px solid var(--primary)!important}
.mva-legacy-library .grid.grid-cols-3>button>span:last-child{background:var(--muted)!important;color:var(--foreground)!important}
.mva-legacy-library :is(input,select){font-size:11px!important}
.mva-legacy-library .rounded-3xl{border-radius:10px!important}
.mva-legacy-library .mv-library-collection-card{padding:12px!important}
/* Reader: leave the chapter through an intentional compact navigation panel. */
.mvr-site-body{padding:14px 17px 18px}
.mvr-site-body>p{font-size:10px;line-height:1.7;color:var(--muted-foreground);margin:0 0 13px}
.mvr-site-body>nav{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.mvr-site-body>nav>a{display:flex;align-items:center;gap:9px;padding:12px 10px;border:1px solid var(--border);border-radius:5px;font-size:11px;min-height:41px}
.mvr-site-body>nav>a:hover{background:var(--muted);border-color:var(--primary)}
.mvr-site-body>nav svg{color:var(--primary)}
.mvr-site-notifications,.mvr-site-topup{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;padding:9px 10px!important;min-height:34px!important;border:1px solid var(--border);border-radius:5px;font-size:10px;margin-top:10px;background:var(--muted);color:var(--foreground)}
.mvr-site-topup{background:#665098;color:#fff;border-color:#665098;margin-top:7px}
.mvr-reader .mvr-dock-controls .mvr-dock-bookmark[aria-pressed=true],.mvr-byline button[aria-pressed=true]{background:#665098!important;color:#fff!important;border-color:#665098!important}
.mvr-dock-bookmark[aria-pressed=true] svg,.mvr-byline button[aria-pressed=true] svg{fill:currentColor}
.mvr-panel-notifications{max-width:440px!important}
.mvr-top-actions svg{width:16px;height:16px}
@media(max-width:1100px){.mva-library-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.mva-library-list{grid-template-columns:repeat(2,minmax(0,1fr))}.mva-wallet-summary>div{gap:8px;padding:14px 12px}.mva-wallet-summary>div>svg{display:none}.mva-wallet-summary strong{font-size:18px}.mva-pass{grid-template-columns:minmax(0,1fr) 175px}.mva-pass-seal{display:none}}
@media(max-width:850px){.mva-library-layout{grid-template-columns:1fr;gap:10px}.mva-shelves{border:0;padding:0;flex-direction:row;gap:4px;overflow-x:auto}.mva-shelves>button{white-space:nowrap;gap:8px;padding:6px 9px;min-height:30px!important}.mva-library-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.mva-library-list{grid-template-columns:repeat(2,minmax(0,1fr))}.mva-ledger-layout{grid-template-columns:1fr}.mva-wallet-summary>div{flex-wrap:wrap}.mva-wallet-summary>div>:last-child:is(a,button){margin:1px 0 0;width:100%;justify-content:flex-start;text-align:left}.mva-wallet-summary>div>.mva-primary{justify-content:center;min-height:27px!important}.mva-wallet-summary>div:last-child strong{font-size:12px}}
@media(max-width:639px){.mva-page{gap:12px}.mva-heading{gap:10px}.mva-heading h1{font-size:25px}.mva-heading p{font-size:10px;line-height:1.6;max-width:235px}.mva-heading-links{flex-direction:column;align-items:flex-end;gap:8px}.mva-heading-links>span{display:none}.mva-heading-links .mva-primary{font-size:9px;padding:6px 8px;min-height:30px}.mva-tabs{gap:16px}.mva-tabs>button{font-size:10px;padding:8px 0 10px}.mva-library-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 10px}.mva-library-list{grid-template-columns:1fr}.mva-toolbar{flex-wrap:wrap;gap:6px}.mva-toolbar>input{flex-basis:calc(100% - 80px)}.mva-toolbar>select{flex:1}.mva-toolbar>button{font-size:9px}.mva-shelves>button{font-size:9px}.mva-shelves>button>span{font-size:8px}.mva-book-title{font-size:10px}.mva-result-line{font-size:8px;margin:9px 0}.mva-result-line>button{font-size:8px}.mva-packs{gap:4px}.mva-packs>button{padding:8px 2px}.mva-packs strong{font-size:19px}.mva-packs small{font-size:6px}.mva-pack-label{font-size:6px}.mva-dialog-body{padding:13px}.mva-custom{gap:7px}.mva-custom>span{font-size:7px}.mva-custom input{width:69px}.mva-wallet-summary>div{padding:13px 10px;gap:6px}.mva-wallet-summary strong{font-size:19px}.mva-wallet-summary small{font-size:6px}.mva-wallet-summary>div:last-child strong{font-size:11px;white-space:normal}.mva-wallet-summary>div>:last-child:is(a,button){font-size:8px}.mva-pass{grid-template-columns:1fr;padding:18px;gap:17px}.mva-pass h2{font-size:25px}.mva-pass ul{gap:12px;margin-top:16px}.mva-pass-action{border-left:0;border-top:1px solid var(--border);padding:14px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:7px 10px}.mva-pass-action>strong{font-size:20px}.mva-pass-action .mva-primary{grid-column:2;grid-row:1/3;margin:0;align-self:center}.mva-pass-action small:last-child{grid-column:1/-1}.mva-wallet-links{grid-template-columns:1fr;gap:10px}.mva-wallet-links>section{padding:14px}.mva-epubs{grid-template-columns:1fr}.mva-epubs>article{padding:12px 0}.mva-notification-popover{right:12px;top:58px}.mva-notification-header-bar{padding:7px 8px;gap:6px}.mva-notif-pill{padding:2px 7px;font-size:9px}.mva-bookmarks>div:first-child{align-items:flex-start;flex-direction:column;gap:5px}.mva-profile-utilities>nav{gap:7px 16px}.mvr-reader .mvr-dock>.mvr-dock-controls{gap:3px}.mvr-dock-controls .mvr-dock-focus{display:none!important}.mvr-dock-controls .mvr-dock-position{display:none!important}.mvr-dock-controls :is(a,button){min-width:29px!important;width:29px;height:32px!important}.mvr-dock-controls .mvr-dock-index{width:auto;min-width:57px!important;padding:0 5px!important}.mvr-dock-controls .mvr-dock-series{display:none!important}.mvr-dock-controls .mvr-theme-button{min-width:29px!important;width:29px}.mvr-dock-controls .mvr-theme-button span{display:none}.mvr-top-actions{gap:2px}.mvr-top-actions button{min-width:27px!important;width:27px!important;padding:4px!important}}
@media(max-width:359px){.mva-packs{grid-template-columns:repeat(3,minmax(0,1fr))}.mva-packs>button{min-height:95px!important}.mva-packs strong{font-size:21px}.mva-custom{flex-wrap:wrap}.mva-custom>span{width:100%}.mva-book-tools>a{font-size:7px}.mva-library-book .mva-between{font-size:8px;gap:3px}.mva-wallet-summary>div{padding:11px 8px}.mva-wallet-summary strong{font-size:17px}.mva-wallet-summary>div:last-child strong{font-size:10px}}
@media(max-height:500px){.mva-topup-sheet{max-height:calc(100dvh - 12px)}.mva-notification-popover{top:8px;max-height:calc(100dvh - 16px)}.mva-notification-list{max-height:calc(100dvh - 130px)}}
@media(prefers-reduced-motion:reduce){.mva-page *,.mva-dialog *,.mva-save{transition:none!important}}
/* The original header sizing must not constrain page introductions. */
.mva-page{max-width:1120px!important}
.mva-page>.mva-heading{height:auto!important;min-height:0!important;max-height:none!important;padding:4px 0!important}
.mva-heading>div{height:auto!important;min-height:0!important;max-height:none!important}
.mva-heading h1{font-size:27px!important;line-height:1.18!important}
.mva-heading .mva-eyebrow{display:block;line-height:1.5}
.mva-heading p{line-height:1.6!important}
@media(max-width:639px){.mva-heading h1{font-size:24px!important}}
.mvr-panel-site{height:auto!important;max-height:calc(100dvh - 24px)!important;align-self:flex-start;margin:12px!important;border:1px solid var(--border);border-radius:9px!important;overflow-y:auto}
.mvr-overlay:has(.mvr-panel-site){align-items:flex-start}
.mv-index-cover>a{display:block;width:100%;height:100%}
.mv-index-cover>a>img{width:100%;height:100%;object-fit:cover}
.mv-index-cover>.mva-save-wrap{position:absolute;top:6px;right:6px;z-index:4}
.mv-index-book h2>a{color:inherit}
.mv-series-cover-wrap{position:relative;align-self:start}
.mv-series-cover-wrap>.mva-save-wrap{position:absolute;right:4px;bottom:4px;z-index:5}
.mv-series-cover-wrap>.mva-save-wrap .mva-save{width:27px;min-width:27px;height:27px;min-height:27px!important}
.mv-series-cover-wrap>.mv-series-cover{width:100%!important}
@media(min-width:1200px){.mva-library-grid:not(.mva-library-list){grid-template-columns:repeat(7,minmax(0,1fr))}}

/* Announcements Toolbar & Community Layout */
.mva-ann-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  width: 100%;
}
.mva-ann-tags {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  overflow-x: auto;
  flex: 1 1 0%;
  min-width: 220px;
  padding: 2px 0;
}
.mva-ann-search {
  position: relative;
  width: 15rem;
  flex-shrink: 0;
}
@media (max-width: 639px) {
  .mva-ann-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }
  .mva-ann-tags {
    width: 100%;
    min-width: 0;
  }
  .mva-ann-search {
    width: 100%;
  }
}


/* === Layer: moonverse-navigation.css === */
/* One navigation room, shared by every burger and reader entry point. */
.mvn-trigger-wrap{display:inline-flex;align-items:center}
.mvn-trigger{display:inline-flex;align-items:center;justify-content:center;width:33px;height:33px;min-width:33px;min-height:33px!important;padding:0;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--foreground);cursor:pointer}
.mvn-trigger svg{width:17px;height:17px;flex-shrink:0;stroke-width:1.7}
.mvn-trigger:hover{background:var(--muted);color:var(--primary)}
.mvn-trigger:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.mvn-menu{position:fixed!important;inset:12px 12px auto auto!important;margin:0!important;width:min(370px,calc(100vw - 24px));max-height:calc(100dvh - 24px)!important;border-radius:10px;overflow-y:auto;overscroll-behavior:contain}
.mvn-menu>.mva-dialog-body{padding:0}
.mvn-menu>header{position:sticky;top:0;z-index:2;background:var(--card);height:auto!important;min-height:50px!important;padding:10px 14px}
.mvn-menu>header>h2{font:600 14px/1.4 Inter,system-ui,sans-serif!important}
.mvn-body{padding:13px 14px 14px;display:flex;flex-direction:column;gap:11px}
.mvn-story{display:flex;align-items:center;gap:9px;background:color-mix(in srgb,var(--primary) 7%,var(--card));border:1px solid var(--border);border-radius:6px;padding:10px;font-size:11px;min-width:0}
.mvn-story>span{min-width:0;flex:1;display:flex;flex-direction:column;gap:3px}
.mvn-story small{font-size:6px;letter-spacing:.16em;color:var(--muted-foreground)}
.mvn-story strong{font-size:10px;font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mvn-story>svg{width:15px;height:15px;color:var(--primary)}
.mvn-destinations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.mvn-destinations>a,.mvn-more nav>a{display:flex;align-items:center;gap:8px;min-width:0;min-height:37px;padding:8px 9px;border:1px solid var(--border);border-radius:5px;background:var(--card);color:var(--foreground);font-size:10px;font-weight:450;line-height:1.4}
.mvn-destinations>a>svg,.mvn-more nav>a>svg{width:15px;height:15px;color:var(--primary);flex-shrink:0}
.mvn-destinations>a:hover,.mvn-more nav>a:hover{background:var(--muted);border-color:var(--primary)}
.mvn-destinations>a[aria-current=page]{background:color-mix(in srgb,var(--primary) 12%,var(--card));border-color:color-mix(in srgb,var(--primary) 55%,var(--border));font-weight:600}
.mvn-more{border-bottom:1px solid var(--border);padding-bottom:6px;font-size:10px;color:var(--muted-foreground)}
.mvn-more>summary{cursor:pointer;padding:2px 1px 5px;min-height:25px;line-height:1.6}
.mvn-more nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:5px 0}
.mvn-more nav>a{font-size:9px;min-height:32px}
.mvn-daily{display:flex;align-items:center;gap:7px;font-size:9px!important;min-height:29px!important;color:var(--muted-foreground);padding:4px 1px}
.mvn-themes{border:0;min-width:0;padding:0;margin:0}
.mvn-themes>legend{font-size:8px;letter-spacing:.04em;color:var(--muted-foreground);margin:0 0 6px}
.mvn-themes>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;border:1px solid var(--border);background:var(--muted);padding:3px;border-radius:5px}
.mvn-themes button{font-size:9px;min-height:26px!important;padding:4px;border-radius:3px;color:var(--muted-foreground)}
.mvn-themes button[aria-pressed=true]{background:var(--card);color:var(--foreground);box-shadow:0 1px 3px #0001}
.mvn-notifications{display:flex;align-items:center;gap:8px;font-size:10px!important;line-height:1.4;width:100%;min-height:34px!important;padding:7px 9px;background:var(--muted);border:1px solid var(--border);border-radius:5px;text-align:left;color:var(--foreground)}
.mvn-notifications>small{font-size:8px;color:var(--muted-foreground);margin-left:auto;white-space:nowrap}
.mvn-notifications>svg{width:14px;height:14px;flex-shrink:0}
.mvn-topup{width:100%;font-size:10px!important;min-height:33px!important}
.mvn-back{display:flex;align-items:center;gap:5px;padding:6px 12px;font-size:10px!important;min-height:32px!important;color:var(--muted-foreground);border-bottom:1px solid var(--border);width:100%;text-align:left}
.mvn-back>svg{width:13px;height:13px}
.mvn-menu :is(button,a,summary):focus-visible{outline:2px solid var(--primary);outline-offset:2px}
/* Reader dock icons use the exact same fixed geometry and stroke weight. */
.mvr-reader .mvr-dock-controls>button>svg,.mvr-reader .mvr-dock-controls>a>svg{width:17px;height:17px;min-width:17px;flex-shrink:0;stroke-width:1.7;display:block}
.mvr-reader .mvr-top-actions>button>svg{width:17px;height:17px;stroke-width:1.7}
.mvr-reader .mvr-dock-controls>button[aria-label="Site navigation"]{border:0;background:transparent;color:var(--muted-foreground);padding:0}
.mvr-reader .mvr-dock-controls>button[aria-label="Site navigation"]:hover{background:var(--muted);color:var(--primary)}
.mvr-dock-reaction{position:relative}
.mrx-dock-count{position:absolute;top:0;right:0;min-width:11px;height:11px;border-radius:7px;background:#665098;color:#fff;padding:0 2px;font:600 7px/11px Inter,system-ui,sans-serif}
@media(max-width:479px){.mvn-body{padding:11px;gap:9px}.mvn-destinations>a{font-size:9px;min-height:35px;padding:7px 8px}.mvn-menu{width:calc(100vw - 24px)}}
@media(max-width:339px){.mvr-dock-controls .mvr-dock-settings{display:none!important}}
@media(max-width:359px){.mvr-reader .mvr-dock-controls :is(a,button){width:28px!important;min-width:28px!important}.mvr-reader .mvr-dock-controls .mvr-dock-index{width:53px!important;min-width:53px!important;font-size:10px;gap:4px}.mvr-reader .mvr-dock-controls .mvr-dock-index svg{width:13px;height:13px;min-width:13px}.mvr-reader .mvr-dock>.mvr-dock-controls{padding:5px 6px;gap:3px}}
@media(max-height:500px){.mvn-menu{inset:8px 8px auto auto!important;max-height:calc(100dvh - 16px)!important}.mvn-body{gap:8px}}
.mv-header-auth-action{display:inline-flex;align-items:center;justify-content:center;height:33px;min-height:33px;line-height:1;text-decoration:none;vertical-align:middle;box-sizing:border-box}



/* === Layer: moonverse-reactions.css === */
/* Thirteen expressive vector reactions, progressively revealed. */
.mrx-bar{width:100%;border:1px solid var(--border);border-radius:7px;padding:12px;background:color-mix(in srgb,var(--card) 80%,transparent)}
.mrx-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:9px}
.mrx-heading-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mrx-heading h2{display:flex;align-items:center;gap:7px;font-size:12px!important;line-height:1.5;font-weight:550;margin:0}
.mrx-most-felt-pill{font-size:8px;font-weight:600;padding:2px 7px;border-radius:10px;background:color-mix(in srgb,var(--primary) 14%,transparent);color:var(--primary);text-transform:uppercase;letter-spacing:0.04em}
.mrx-heading-meta{font-size:9px;color:var(--muted-foreground)}
.mrx-heading svg{width:16px;height:16px;color:var(--primary)}
.mrx-rank-tag{display:inline-block;margin-left:5px;font-size:7px;font-weight:700;text-transform:uppercase;padding:1px 4px;border-radius:3px;background:color-mix(in srgb,var(--primary) 18%,transparent);color:var(--primary);vertical-align:middle;line-height:1.3}
.mrx-reaction[aria-pressed=true] .mrx-rank-tag{background:#ffffff30;color:#fff}
.mrx-bar-empty{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px}
.mrx-empty-info{display:flex;align-items:center;gap:10px}
.mrx-empty-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:7px;background:color-mix(in srgb,var(--primary) 12%,transparent);color:var(--primary);flex-shrink:0}
.mrx-empty-icon svg{width:17px;height:17px}
.mrx-empty-text h2{font-size:12px!important;font-weight:600;margin:0 0 2px;line-height:1.3;display:flex;align-items:center}
.mrx-empty-text p{font-size:9px;color:var(--muted-foreground);margin:0;line-height:1.4}
.mrx-empty-cta{display:inline-flex;align-items:center;gap:6px;min-height:32px!important;padding:6px 12px;border-radius:6px;border:1px solid color-mix(in srgb,var(--primary) 40%,var(--border));background:var(--card);color:var(--primary);font-size:10px!important;font-weight:550;cursor:pointer;transition:background .15s,color .15s,border-color .15s;flex-shrink:0}
.mrx-empty-cta:hover{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary)}
.mrx-empty-cta svg{width:14px;height:14px}
.mrx-quick{display:flex;flex-wrap:wrap;gap:6px}
.mrx-reaction{display:grid;grid-template-columns:17px minmax(0,1fr) auto;align-items:center;gap:6px;min-width:0;min-height:32px!important;padding:6px 8px;border:1px solid var(--border);border-radius:5px;background:var(--card);color:var(--foreground);font-size:10px!important;line-height:1.4;cursor:pointer;text-align:left;transition:background .15s,border-color .15s}
.mrx-reaction>svg{width:17px!important;height:17px!important;flex-shrink:0;stroke-width:1.7;color:var(--primary)}
.mrx-reaction>span{font-size:10px;line-height:1.4}
.mrx-reaction>small{font-size:8px;color:var(--muted-foreground);font-variant-numeric:tabular-nums;min-width:9px;text-align:right}
.mrx-reaction:hover{background:var(--muted);border-color:var(--primary)}
/* C5: the #1 ranked reaction chip; the class was emitted but never styled. */
.mrx-top{border-color:color-mix(in srgb,var(--primary) 45%,transparent)!important;background:color-mix(in srgb,var(--primary) 8%,var(--card))!important}
.mrx-top>small{color:var(--primary)!important;font-weight:700}
.mvr-reader .mrx-reaction[aria-pressed=true],.mrx-picker .mrx-reaction[aria-pressed=true]{background:#665098;color:#fff;border-color:#665098;box-shadow:inset 0 0 0 1px #ffffff15}
.mrx-reaction[aria-pressed=true]>svg,.mrx-reaction[aria-pressed=true]>small{color:#fff!important}
.mrx-more{display:flex;align-items:center;justify-content:center;gap:6px;min-height:32px!important;border:1px dashed var(--border);border-radius:5px;padding:6px 9px;font-size:9px!important;color:var(--muted-foreground);background:transparent;cursor:pointer}
.mrx-more svg{width:14px;height:14px}
.mrx-more small{font-size:7px}
.mrx-more:hover{color:var(--foreground);border-color:var(--primary);background:var(--muted)}
.mrx-status{font-size:9px!important;line-height:1.5;color:var(--muted-foreground);margin:8px 0 0!important}
.mrx-status:empty{display:none}
.mrx-picker{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow-y:auto}
.mrx-picker .mva-dialog-body{padding:13px 15px}
.mrx-picker-intro{display:flex;align-items:center;gap:7px;color:var(--muted-foreground);font-size:10px;margin-bottom:11px;line-height:1.5}
.mrx-picker-intro svg{color:var(--primary);width:16px;height:16px}
.mrx-picker input[type=search]{width:100%;height:32px;padding:6px 9px;border-radius:5px;border:1px solid var(--border);font-size:11px;background:var(--background);color:var(--foreground)}
.mrx-categories{display:flex;align-items:center;gap:4px;margin:9px 0 10px}
.mrx-categories>button{font-size:9px;min-height:27px!important;border:1px solid transparent;border-radius:4px;padding:4px 7px;color:var(--muted-foreground)}
.mrx-categories>button[aria-pressed=true]{border-color:var(--border);background:var(--muted);color:var(--foreground)}
.mrx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-height:min(350px,calc(100dvh - 265px));overflow-y:auto;overscroll-behavior:contain;padding:2px}
.mrx-grid .mrx-reaction{min-height:39px!important;padding:7px;gap:6px}
.mrx-grid .mrx-reaction>span{font-size:9px;line-height:1.4}
.mrx-grid .mrx-reaction>small{font-size:8px}
.mrx-picker-footer{display:flex;align-items:center;gap:12px;border-top:1px solid var(--border);margin-top:12px;padding-top:10px;font-size:10px}
.mrx-picker-footer>span{color:var(--muted-foreground);font-size:9px;margin-right:auto}
.mrx-picker-footer>button{font-size:9px;min-height:29px!important}
.mrx-picker-footer>button:disabled{opacity:.4;cursor:default}
.mrx-empty{text-align:center;padding:24px 12px;font-size:11px;color:var(--muted-foreground)}
.mrx-empty button{font-size:10px;text-decoration:underline;min-height:29px!important}
.mrx-picker :is(button,input):focus-visible,.mrx-bar button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
@media(max-width:639px){.mrx-heading h2{font-size:11px!important}.mrx-bar{padding:10px}.mrx-heading-meta{font-size:8px}.mrx-bar-empty{flex-direction:column;align-items:stretch;gap:9px}.mrx-empty-cta{justify-content:center;width:100%;min-height:34px!important}.mrx-quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.mrx-quick .mrx-reaction{font-size:9px!important;padding:6px 7px;gap:5px}.mrx-quick .mrx-reaction>span{font-size:9px}.mrx-more{grid-column:1/-1;min-height:29px!important}.mrx-picker .mva-dialog-body{padding:11px}.mrx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.mrx-grid .mrx-reaction{min-height:37px!important}.mrx-categories>button{font-size:8px;padding:4px 5px}.mrx-picker-intro{font-size:9px}.mrx-picker-footer{margin-top:10px;padding-top:8px}}
@media(prefers-reduced-motion:reduce){.mrx-reaction{transition:none}}


/* === Layer: moonverse-search.css === */
/* Search: one input, progressive filters, compact covers and a bounded result window. */
.mvs-dialog{position:fixed;inset:clamp(12px,6vh,56px) 0 auto;margin:0 auto;padding:0;width:min(660px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - clamp(24px,12vh,112px));border:1px solid var(--border);border-radius:12px;background:var(--popover);color:var(--foreground);font-family:var(--mv-ui-font,Inter,sans-serif);font-size:12px;overflow:hidden;box-shadow:0 24px 80px #0005}
.mvs-dialog[open]{display:flex;flex-direction:column}
.mvs-dialog::backdrop{background:#090b1960;backdrop-filter:blur(4px)}
.mvs-dialog *{box-sizing:border-box}
.mvs-dialog button,.mvs-dialog input,.mvs-dialog select{font:inherit;color:inherit}
.mvs-dialog button{display:inline-flex;align-items:center;justify-content:center;gap:5px;cursor:pointer;border:1px solid transparent;background:transparent;border-radius:5px;padding:4px 7px;min-height:28px;line-height:1.2}
.mvs-dialog button:disabled{cursor:default;opacity:.4}
.mvs-dialog button:not(:disabled):hover{background:var(--accent);color:var(--accent-foreground)}
.mvs-dialog :is(button,input,select,a):focus-visible{outline:2px solid var(--ring);outline-offset:-2px}
.mvs-dialog .mvs-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.mvs-dialog .mvs-header{display:flex;align-items:center;gap:6px;padding:10px!important;min-height:60px;flex-shrink:0;border-bottom:1px solid var(--border)}
.mvs-dialog .mvs-input-wrap{display:flex;flex:1;min-width:0;align-items:center;gap:8px;margin:0;padding:0 9px;height:38px;min-height:38px;border:1px solid var(--border);border-radius:7px;background:var(--background)}
.mvs-input-wrap>svg{flex-shrink:0;color:var(--primary)}
.mvs-dialog .mvs-input-wrap input{flex:1;width:0;min-width:0;height:36px!important;min-height:0!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0;box-shadow:none!important;font-size:12px!important;outline:0!important;color:var(--foreground)}
.mvs-dialog .mvs-input-wrap:focus-within{border-color:color-mix(in srgb,var(--primary) 70%,var(--border));outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)}
.mvs-input-wrap input::-webkit-search-cancel-button{display:none}
.mvs-input-wrap input::placeholder{color:var(--muted-foreground);opacity:1}
.mvs-dialog .mvs-input-wrap button{width:26px;min-height:28px;padding:4px;flex-shrink:0}
.mvs-dialog .mvs-close{min-width:30px;min-height:36px;padding:5px;color:var(--muted-foreground)}
.mvs-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0;padding:7px 10px;border-bottom:1px solid var(--border)}
.mvs-toolbar-actions{display:flex;align-items:center;gap:6px;min-width:0}
.mvs-dialog .mvs-filter-toggle{display:inline-flex;align-items:center;gap:4px;font-size:10px;min-height:28px;padding:3px 8px;border:1px solid var(--border);border-radius:5px;background:var(--card);color:var(--foreground);white-space:nowrap;cursor:pointer;transition:background .12s,border-color .12s}
.mvs-dialog .mvs-filter-toggle:hover{background:var(--accent);border-color:color-mix(in srgb,var(--primary) 30%,var(--border))}
.mvs-dialog .mvs-filter-toggle[aria-expanded=true]{border-color:var(--primary);color:var(--primary);background:var(--accent)}
.mvs-filter-toggle b{font-size:8.5px;background:var(--primary);color:var(--primary-foreground);border-radius:4px;padding:1px 4px;font-variant-numeric:tabular-nums}
.mvs-filter-toggle>svg{width:12px;height:12px;flex-shrink:0}
.mvs-dialog .mvs-scopes{display:flex;align-items:center;gap:2px;border:1px solid var(--border);padding:2px;border-radius:6px;background:color-mix(in srgb,var(--muted) 60%,transparent)}
.mvs-dialog .mvs-scopes button{min-height:26px;padding:4px 10px;font-size:10px;color:var(--muted-foreground)}
.mvs-dialog .mvs-scopes button[aria-pressed=true]{background:var(--card);color:var(--primary);box-shadow:0 1px 3px #0001;border-color:var(--border)}
.mvs-dialog .mvs-sort{min-width:0;max-width:145px;min-height:28px;border:1px solid var(--border);border-radius:5px;background:var(--card);padding:3px 20px 3px 7px;font-size:10px;color:var(--foreground);box-shadow:none}
.mvs-scroll{overflow:auto;overscroll-behavior:contain;min-height:0;flex:1;padding:0 10px 6px;scrollbar-width:thin;scrollbar-gutter:stable}
.mvs-dialog .mvs-advanced{margin:8px 0;padding:9px;border:1px solid var(--border);background:color-mix(in srgb,var(--card) 65%,transparent);border-radius:7px}
.mvs-filter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mvs-filter-grid label{display:flex;flex-direction:column;gap:4px;min-width:0}
.mvs-filter-grid label>span{font-size:9px;color:var(--muted-foreground);font-weight:600}
.mvs-dialog .mvs-filter-grid select{width:100%;min-width:0;min-height:30px;padding:4px 20px 4px 7px;border:1px solid var(--border);border-radius:5px;background:var(--card);font-size:10px;text-overflow:ellipsis}
.mvs-dialog .mvs-clear-filters{margin-top:6px;font-size:10px;color:var(--primary);padding-left:0}
.mvs-alphabet{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:2px;padding:7px 0 6px;border-bottom:1px solid var(--border)}
.mvs-dialog .mvs-alphabet button{min-width:0;min-height:27px;padding:3px 0;font-size:10px;font-weight:650;font-variant-numeric:tabular-nums;color:var(--muted-foreground)}
.mvs-dialog .mvs-alphabet button:disabled{opacity:1;color:color-mix(in srgb,var(--muted-foreground) 40%,var(--popover))}
.mvs-dialog .mvs-alphabet button[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground);box-shadow:0 2px 4px #0002}
.mvs-recents{display:flex;align-items:center;gap:6px;padding:6px 0;border-bottom:1px solid var(--border);color:var(--muted-foreground)}
.mvs-recents>svg{width:13px;height:13px;flex-shrink:0}
.mvs-recents>div{display:flex;gap:4px;overflow:hidden;flex:1;min-width:0}
.mvs-dialog .mvs-recents>div button{display:block;min-width:0;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px;background:color-mix(in srgb,var(--muted) 65%,transparent);padding:4px 7px}
.mvs-dialog .mvs-history-clear{font-size:9px;color:var(--muted-foreground);flex-shrink:0}
.mvs-section-label{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:30px;padding:4px 2px;color:var(--muted-foreground);font-size:9px}
.mvs-dialog .mvs-section-label h3{font-size:10px!important;font-weight:600!important;letter-spacing:0!important;text-transform:none!important;margin:0;line-height:1.4;color:var(--foreground)}
.mvs-dialog .mvs-section-label button{font-size:9px;min-height:24px;color:var(--primary)}
.mvs-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 5px}
.mvs-dialog .mvs-result{display:flex;align-items:center;gap:9px;min-width:0;min-height:36px;padding:5px 7px;text-decoration:none;color:var(--foreground);border:1px solid transparent;border-radius:6px;transition:background .12s,border-color .12s}
.mvs-dialog .mvs-result:hover,.mvs-dialog .mvs-result:focus-visible{background:var(--accent);border-color:color-mix(in srgb,var(--primary) 30%,var(--border))}
.mvs-story{grid-column:1/-1;position:relative}
.mvs-story.is-menu-open{z-index:40}
.mvs-story+.mvs-story{border-top-color:color-mix(in srgb,var(--border) 65%,transparent)!important}
.mvs-result>svg:last-child{flex-shrink:0;width:12px;height:12px;color:var(--muted-foreground);margin-left:4px}
.mvs-dialog .mvs-cover{display:grid;place-items:center;flex-shrink:0;position:relative;width:32px;height:48px;border-radius:3px;overflow:hidden;background:var(--muted);color:var(--muted-foreground);box-shadow:0 1px 4px #0002}
.mvs-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mvs-cover img[hidden]{display:none}
.mvs-cover>svg{width:15px;height:15px}
.mvs-result-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mvs-result-copy>strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:11px;font-weight:650;line-height:1.35;overflow-wrap:anywhere}
.mvs-author,.mvs-native{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted-foreground);line-height:1.4}
.mvs-meta{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--muted-foreground);line-height:1.4;font-variant-numeric:tabular-nums;flex-wrap:wrap}
.mvs-meta b{font-size:8px;line-height:1.2;border:1px solid var(--border);border-radius:3px;padding:1px 3px;color:var(--foreground);font-weight:600}
.mvs-shelf-badge{display:inline-flex;align-items:center;gap:3px;padding:1px 6px;font-size:8.5px;font-weight:650;line-height:1.25;border-radius:4px;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--foreground);background:var(--muted);border:1px solid var(--border)}
.mvs-shelf-badge svg{width:9.5px;height:9.5px;flex-shrink:0}
.mvs-shelf-badge.is-reading{color:#818cf8;background:rgba(99,102,241,.12);border-color:rgba(99,102,241,.28)}
.mvs-shelf-badge.is-to-read{color:var(--mv-gold,#f59e0b);background:color-mix(in srgb,var(--mv-gold,#f59e0b) 12%,transparent);border-color:color-mix(in srgb,var(--mv-gold,#f59e0b) 28%,transparent)}
.mvs-shelf-badge.is-on-hold{color:#94a3b8;background:rgba(148,163,184,.12);border-color:rgba(148,163,184,.28)}
.mvs-shelf-badge.is-completed{color:var(--mv-mint,#10b981);background:color-mix(in srgb,var(--mv-mint,#10b981) 12%,transparent);border-color:color-mix(in srgb,var(--mv-mint,#10b981) 28%,transparent)}
.mvs-shelf-badge.is-favorites{color:#fb7185;background:rgba(244,63,94,.12);border-color:rgba(244,63,94,.28)}
.mvs-progress{display:inline-flex;align-items:center;gap:3.5px;padding:1px 6px;font-size:8.5px;font-weight:650;line-height:1.25;border-radius:4px;color:var(--mv-mint,#10b981);background:color-mix(in srgb,var(--mv-mint,#10b981) 12%,transparent);border:1px solid color-mix(in srgb,var(--mv-mint,#10b981) 28%,transparent);white-space:nowrap}
.mvs-progress>svg{width:9.5px;height:9.5px;flex-shrink:0}
.mvs-progress.is-complete{color:var(--mv-gold,#f59e0b);background:color-mix(in srgb,var(--mv-gold,#f59e0b) 12%,transparent);border-color:color-mix(in srgb,var(--mv-gold,#f59e0b) 28%,transparent)}
.mvs-dialog .mvs-bookmark-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;min-width:28px;min-height:28px;padding:0;border:1px solid transparent;border-radius:5px;background:transparent;color:var(--muted-foreground);cursor:pointer;flex-shrink:0;margin-left:auto;transition:all .15s ease}
.mvs-dialog .mvs-bookmark-btn:hover{color:var(--primary);background:var(--accent);border-color:color-mix(in srgb,var(--primary) 25%,var(--border))}
.mvs-dialog .mvs-bookmark-btn.is-saved{color:var(--mv-gold,#f59e0b)}
.mvs-dialog .mvs-bookmark-btn.is-saved:hover{color:var(--mv-gold,#f59e0b);background:color-mix(in srgb,var(--mv-gold,#f59e0b) 15%,transparent);border-color:color-mix(in srgb,var(--mv-gold,#f59e0b) 30%,transparent)}
.mvs-dialog .mvs-bookmark-btn svg{width:14px;height:14px;display:block;pointer-events:none}
.mvs-shelf-popover{position:absolute;right:8px;top:calc(100% - 2px);z-index:120;min-width:170px;background:var(--popover,var(--card));border:1px solid var(--border);border-radius:8px;box-shadow:0 12px 36px #0006,0 2px 8px #0003;padding:5px;display:flex;flex-direction:column;gap:2px;animation:mvsFadeIn .12s cubic-bezier(.16,1,.3,1)}
.mvs-shelf-popover.is-up{top:auto;bottom:calc(100% - 2px)}
@keyframes mvsFadeIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
.mvs-shelf-popover-header{display:flex;align-items:center;justify-content:space-between;padding:3px 6px 5px;border-bottom:1px solid var(--border);font-size:8.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-foreground)}
.mvs-dialog .mvs-shelf-popover-close{width:20px;height:20px;min-width:20px;min-height:20px;padding:2px;border:0;color:var(--muted-foreground);border-radius:4px}
.mvs-dialog .mvs-shelf-popover-close:hover{color:var(--foreground);background:var(--accent)}
.mvs-dialog .mvs-shelf-option{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:7px!important;width:100%!important;padding:5px 8px!important;min-height:26px!important;font-size:10px!important;border-radius:5px!important;border:1px solid transparent!important;background:transparent!important;color:var(--foreground)!important;text-align:left!important;cursor:pointer!important;transition:all .1s ease!important}
.mvs-dialog .mvs-shelf-option:hover{background:var(--accent)!important;color:var(--foreground)!important}
.mvs-dialog .mvs-shelf-option.is-active{background:color-mix(in srgb,var(--primary) 12%,transparent)!important;color:var(--primary)!important;font-weight:650!important}
.mvs-shelf-option svg{width:12px;height:12px;flex-shrink:0}
.mvs-shelf-option .mvs-check{margin-left:auto;color:var(--primary);display:flex;align-items:center}
.mvs-shelf-divider{height:1px;background:var(--border);margin:3px 0}
.mvs-dialog .mvs-shelf-remove{color:var(--destructive,#ef4444)!important}
.mvs-dialog .mvs-shelf-remove:hover{background:rgba(239,68,68,.12)!important;color:#ef4444!important}
.mvs-saved{flex-shrink:0;color:var(--primary)}
.mvs-saved svg{width:12px;height:14px;display:block}
.mvs-page-icon{display:grid;place-items:center;width:30px;height:30px;border:1px solid color-mix(in srgb,var(--border) 45%,transparent);border-radius:7px;background:color-mix(in srgb,var(--primary) 12%,transparent);color:var(--primary);flex-shrink:0}
.mvs-page .mvs-result-copy>strong{font-size:10px}
.mvs-empty{padding:28px 12px;text-align:center;color:var(--muted-foreground)}
.mvs-empty>svg{width:22px;height:22px;color:var(--primary);margin:auto}
.mvs-dialog .mvs-empty h3{font-size:13px!important;font-weight:650!important;color:var(--foreground);margin:8px 0 4px}
.mvs-empty p{font-size:11px;line-height:1.5;margin:0 0 8px}
.mvs-dialog .mvs-empty button{font-size:10px;border-color:var(--border);background:var(--card);color:var(--primary)}
.mvs-notice{font-size:10px;padding:5px;color:var(--muted-foreground)}
.mvs-footer{display:flex;align-items:center;justify-content:space-between;gap:7px;flex-shrink:0;min-height:38px;border-top:1px solid color-mix(in srgb,var(--border) 30%,transparent);padding:6px 12px;background:color-mix(in srgb,var(--card) 45%,transparent);color:var(--muted-foreground);font-size:9.5px;border-bottom-left-radius:12px;border-bottom-right-radius:12px}
.mvs-pagination{display:flex;align-items:center;gap:4px;white-space:nowrap;font-variant-numeric:tabular-nums}
.mvs-pagination>span{margin-right:4px}
.mvs-dialog .mvs-pagination button{min-width:28px;min-height:28px;font-size:14px;border-color:var(--border);background:var(--card);color:var(--primary)}
.mvn-search{display:flex;align-items:center;gap:8px;padding:8px 9px;min-height:34px!important;border:1px solid var(--border);border-radius:5px;font-size:10px!important;background:var(--background);color:var(--foreground);text-align:left;cursor:pointer}
.mvn-search svg{width:15px;height:15px;color:var(--primary)}
.mvn-search small{margin-left:auto;font-size:8px;color:var(--muted-foreground)}
@media(max-width:479px){.mvs-dialog{inset:8px 0 auto;width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.mvs-dialog .mvs-header{padding:8px!important;gap:4px;min-height:54px}.mvs-dialog .mvs-input-wrap{padding:0 6px;gap:5px}.mvs-dialog .mvs-input-wrap input{font-size:16px!important}.mvs-dialog .mvs-filter-toggle{padding:3px 6px;font-size:9px;min-height:26px}.mvs-filter-toggle>svg{width:13px;height:13px}.mvs-dialog .mvs-close{min-width:26px;padding:4px}.mvs-toolbar{padding:5px 8px}.mvs-scroll{padding:0 7px 5px}.mvs-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mvs-dialog .mvs-filter-grid select{min-height:33px}.mvs-dialog .mvs-alphabet button{min-height:28px}.mvs-dialog .mvs-result{padding:5px;gap:7px}.mvs-dialog .mvs-scopes button{padding:4px 8px}.mvs-dialog .mvs-sort{max-width:125px;font-size:9px}.mvs-footer{padding:4px 8px;font-size:8px}.mvs-result-copy>strong{font-size:11px}.mvs-dialog .mvs-bookmark-btn{width:26px;height:26px;min-width:26px;min-height:26px}.mvs-shelf-popover{min-width:155px;right:4px}}
@media(max-width:399px){.mvs-alphabet{grid-template-columns:repeat(10,minmax(0,1fr))}.mvs-dialog .mvs-filter-toggle>span{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}.mvs-dialog .mvs-filter-toggle{min-width:32px}.mvs-dialog .mvs-input-wrap input{font-size:16px!important}.mvs-keys{max-width:125px;line-height:1.4}.mvs-results{gap:2px}.mvs-page .mvs-result-copy>strong{font-size:9px}}
@media(max-height:500px){.mvs-dialog{inset:6px 0 auto;max-height:calc(100dvh - 12px)}.mvs-dialog .mvs-header{padding:6px 9px!important;min-height:49px}.mvs-toolbar{padding-block:4px}.mvs-footer{min-height:34px}}
@media(prefers-reduced-motion:reduce){.mvs-dialog *{transition:none!important;animation:none!important}.mvs-dialog::backdrop{backdrop-filter:none}}


/* === Layer: moonverse-aesthetic.css === */
/* Moonverse / Orchid & Ink. A shared visual system above the compact layout layers. */
:root,:root.light,:root.theme-light{
 --background:#f5f3f8;--foreground:#292335;--card:#fffdfd;--card-foreground:#292335;--popover:#fffdfd;--popover-foreground:#292335;
 --muted:#ede9f3;--muted-foreground:#70677e;--border:#dfd8e8;--input:#d8cfe4;--ring:#8857b7;
 --primary:#7642a5;--primary-foreground:#fff;--accent:#e9dff4;--accent-foreground:#5f318c;--secondary:#eee6f7;--secondary-foreground:#5e377f;
 --mv-orchid:#ad7be0;--mv-mint:#29776d;--mv-rose:#b44d77;--mv-gold:#95651e;--mv-surface:#fffdfd;--mv-surface-raised:#fff;
 --mv-wash:rgba(156,107,205,.095);--mv-wash-secondary:rgba(74,145,137,.055);--mv-elevated:0 6px 22px #3c1f5e08,0 1px 2px #3c1f5e06;
 --mv-hairline:rgba(255,255,255,.8);--mv-hero-start:#f2eafa;--mv-hero-end:#fbf8fd;--mv-display:Literata,Georgia,serif;
 color-scheme:light;
}
:root.dark,:root.dark.theme-dark{
 --background:#14111b;--foreground:#f0eaf7;--card:#1e1928;--card-foreground:#f0eaf7;--popover:#241e30;--popover-foreground:#f0eaf7;
 --muted:#2a2336;--muted-foreground:#b2a6c3;--border:#3a3049;--input:#433650;--ring:#c5a0ef;
 --primary:#c9a5f1;--primary-foreground:#261334;--accent:#332541;--accent-foreground:#e0c4fd;--secondary:#30243e;--secondary-foreground:#e4cff9;
 --mv-orchid:#c59aef;--mv-mint:#89d1c0;--mv-rose:#e8a1bc;--mv-gold:#e5c084;--mv-surface:#1e1928;--mv-surface-raised:#282032;
 --mv-wash:rgba(166,104,218,.11);--mv-wash-secondary:rgba(104,176,161,.045);--mv-elevated:0 8px 25px #08040e24,0 1px 2px #08040e30;
 --mv-hairline:rgba(240,217,255,.045);--mv-hero-start:#30203e;--mv-hero-end:#211a2e;color-scheme:dark;
}
:root.theme-midnight,:root.dark.theme-midnight{
 --background:#0e0d14;--foreground:#f0ebf7;--card:#191620;--card-foreground:#f0ebf7;--popover:#221c2c;--popover-foreground:#f0ebf7;
 --muted:#272131;--muted-foreground:#afa3bf;--border:#342b40;--input:#41324f;--ring:#c298f3;
 --primary:#c6a0f1;--primary-foreground:#251231;--accent:#30213f;--accent-foreground:#dfc4ff;--secondary:#2b2138;--secondary-foreground:#e1c5fa;
 --mv-orchid:#bf91ee;--mv-mint:#8bcfc0;--mv-rose:#e3a0b9;--mv-gold:#e2bd7d;--mv-surface:#191620;--mv-surface-raised:#231c2e;
 --mv-wash:rgba(145,88,201,.1);--mv-wash-secondary:rgba(95,161,146,.035);--mv-elevated:0 8px 28px #03010635,0 1px 3px #03010640;
 --mv-hairline:rgba(235,208,255,.05);--mv-hero-start:#2a1b38;--mv-hero-end:#191521;color-scheme:dark;
}
:root.theme-sepia,:root.light.theme-sepia{
 --background:#f4eee5;--foreground:#342b2c;--card:#fffbf3;--card-foreground:#342b2c;--popover:#fffbf3;--popover-foreground:#342b2c;
 --muted:#eae0d5;--muted-foreground:#78665f;--border:#ded0c4;--input:#d8c6b9;--ring:#956065;
 --primary:#8b4c64;--primary-foreground:#fff;--accent:#efdae0;--accent-foreground:#773f54;--secondary:#eee0dc;--secondary-foreground:#704151;
 --mv-orchid:#b27a8e;--mv-mint:#447c6b;--mv-rose:#a94768;--mv-gold:#9b6828;--mv-surface:#fffbf3;--mv-surface-raised:#fffdf8;
 --mv-wash:rgba(167,106,124,.075);--mv-wash-secondary:rgba(153,126,82,.05);--mv-elevated:0 6px 22px #5c3b2609,0 1px 2px #5c3b2608;
 --mv-hairline:rgba(255,255,255,.7);--mv-hero-start:#f0dfe2;--mv-hero-end:#faf0e6;color-scheme:light;
}
html{background:var(--background);scrollbar-color:color-mix(in srgb,var(--primary) 30%,var(--muted)) var(--background)}
body{background:radial-gradient(ellipse 850px 470px at 8% 0,var(--mv-wash),transparent 76%),radial-gradient(ellipse 650px 420px at 100% 12%,var(--mv-wash-secondary),transparent 80%),var(--background);color:var(--foreground)}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background:url('./moonverse-grain.svg');opacity:.025}
#root{position:relative;z-index:1}
::selection{background:color-mix(in srgb,var(--primary) 25%,transparent);color:var(--foreground)}
/* Shared header: compact floating controls, a quieter brand, definite active navigation. */
#root header:has(nav[aria-label=Primary]){background:color-mix(in srgb,var(--card) 88%,transparent);backdrop-filter:blur(18px);border-color:var(--border);box-shadow:0 1px 0 var(--mv-hairline)}
#root header:has(nav[aria-label=Primary])>div:first-child{height:56px}
#root header:has(nav[aria-label=Primary]) a[aria-label="Moonverse home"]>div:first-child{border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--card));border-color:color-mix(in srgb,var(--primary) 25%,var(--border));color:var(--primary);box-shadow:inset 0 1px var(--mv-hairline)}
#root header:has(nav[aria-label=Primary]) a[aria-label="Moonverse home"] svg{color:var(--primary)}
#root header:has(nav[aria-label=Primary]) a[aria-label="Moonverse home"]>div:last-child>span:first-child{font-family:'Plus Jakarta Sans',Inter,sans-serif;font-weight:750;letter-spacing:.105em;font-size:13px}
#root header:has(nav[aria-label=Primary]) a[aria-label="Moonverse home"]>div:last-child>span:last-child{color:var(--primary);font-size:6px;letter-spacing:.18em}
#root nav[aria-label=Primary]{gap:3px;padding:3px;border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--muted) 40%,transparent)}
#root nav[aria-label=Primary] a{padding:6px 11px;border-radius:999px;font-size:11px;color:var(--muted-foreground);border:1px solid transparent}
#root nav[aria-label=Primary] a:hover{background:var(--muted);color:var(--foreground)}
#root nav[aria-label=Primary] a[aria-current=page]{background:var(--card);border-color:var(--border);color:var(--primary);box-shadow:0 1px 3px #0001}
#root header button[aria-label="Search Moonverse"]{border-radius:999px;background:color-mix(in srgb,var(--muted) 55%,transparent);border-color:var(--border)}
#root header :is(button[aria-label="Color Mode"],button[aria-label="User profile menu"],.mva-notification-trigger,.mvn-trigger){border-radius:9px;background:var(--card);border-color:var(--border)}
#root nav[aria-label=Mobile]{background:color-mix(in srgb,var(--card) 94%,transparent);backdrop-filter:blur(18px);box-shadow:0 -6px 22px #00000008;border-color:var(--border)}
#root nav[aria-label=Mobile] a[aria-current=page]{color:var(--primary)}
/* Distinct title hierarchy; story names on cards remain compact sans-serif. */
#root main:not([data-reader=true]) h1{font-family:var(--mv-display);font-weight:600;letter-spacing:-.04em;line-height:1.24}
#root main .mv-index .mv-index-heading h1{font-size:25px}
#root main :is(.mva-heading h1,.mve-title-line h1,.mvd-intro h1,.mww-heading h1,.mv-rank-heading h1,.mvp-name-row h1){font-size:27px}
:is(.mv-index-section-head>h2,.mv-index-tags>h2,.mvp-section-heading h2,.mvd-directory-heading h2,.mva-bookmarks h2,.mv-rank-heading h1){font-family:var(--mv-display);font-weight:550;letter-spacing:-.025em}
.mv-index-section-head>h2,.mv-index-tags>h2{font-size:18px}
:is(.mva-eyebrow,.mve-kicker,.mvd-eyebrow,.mww-eyebrow){color:var(--primary);font-size:8px;letter-spacing:.16em;font-weight:600}
/* Shallow title rooms provide color without tall hero sections. */
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading){position:relative;isolation:isolate;padding:13px 15px!important;border:1px solid var(--border)!important;border-radius:12px;background:linear-gradient(115deg,var(--mv-hero-start),var(--mv-hero-end));box-shadow:inset 0 1px 0 var(--mv-hairline),var(--mv-elevated);overflow:hidden;gap:12px}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading)::before{content:'';position:absolute;inset:0;z-index:-1;background:url('./moonverse-atmosphere.svg') right center/auto 155px no-repeat;opacity:.5;pointer-events:none}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) h1{margin-block:3px 5px}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) p{font-size:11px;line-height:1.6}
/* One surface scale for cards and panels; typography and layout retain their own density. */
:is(.mve-book-cards,.mve-shelf,.mv-index-collection,.mww-item,.mva-wallet-summary>div,.mva-pass,.mva-wallet-links>article,.mva-redeem,.mva-ledger,.mv-rank-table,.mvp-collection,.mvp-identity){border-color:var(--border);background:var(--card);border-radius:11px;box-shadow:inset 0 1px 0 var(--mv-hairline),var(--mv-elevated)}
:is(.mve-book-cards,.mve-shelf,.mv-index-collection,.mww-item,.mvp-collection){transition:border-color .18s,background .18s,box-shadow .18s}
:is(.mve-book-cards,.mve-shelf,.mv-index-collection,.mww-item,.mvp-collection):hover{border-color:color-mix(in srgb,var(--primary) 48%,var(--border));box-shadow:0 6px 22px color-mix(in srgb,var(--primary) 8%,transparent)}
#root main .mv-page :where([class~='rounded-2xl'],[class~='rounded-3xl']):not(.mwc-avatar):not(.mwc-art){border-color:var(--border)}
#root main .mv-page :where([class~='bg-card'],[class~='celestial-glass']){background-color:var(--card);box-shadow:inset 0 1px var(--mv-hairline),var(--mv-elevated)}
/* Actions use the theme's actual foreground, including light lilac on deep ink. */
:is(.mva-primary,.mvp-primary,.mve-primary,.mww-primary,.mv-talk-primary,.mv-button-primary){background:var(--primary)!important;border-color:var(--primary)!important;color:var(--primary-foreground)!important;box-shadow:inset 0 1px #ffffff1c,0 2px 6px #0000000a;border-radius:7px}
:is(.mva-primary,.mvp-primary,.mve-primary,.mww-primary,.mv-talk-primary,.mv-button-primary):hover{background:color-mix(in srgb,var(--primary) 88%,var(--foreground))!important;border-color:var(--primary)!important;color:var(--primary-foreground)!important}
:is(.mve-secondary,.mvp-secondary,.mva-secondary,.mww-text-button){border-radius:7px}
:where(button,a,summary,[role="tab"]):focus-visible{outline-color:var(--ring)!important}
:where(input[type=checkbox],input[type=radio],input[type=range]){accent-color:var(--primary)}
/* Tabs and filters: pill rails, crisp active ink, deliberately visible selected states. */
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs,.mv-series-tabs){gap:5px;padding:4px;border:1px solid var(--border);border-radius:9px;background:color-mix(in srgb,var(--card) 75%,transparent);box-shadow:inset 0 1px var(--mv-hairline)}
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs,.mv-series-tabs)>:is(a,button){padding:6px 11px;min-height:30px!important;border:1px solid transparent;border-radius:6px;background:transparent;font-size:10px;color:var(--muted-foreground)}
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs,.mv-series-tabs)>:is(a,button):is([aria-current=page],[aria-selected=true],[aria-pressed=true],.is-active){color:var(--primary);background:var(--accent);border-color:color-mix(in srgb,var(--primary) 20%,var(--border));box-shadow:inset 0 1px var(--mv-hairline)}
:is(.mve-status-tabs,.mvd-sort-tabs,.mvd-scope,.mww-type-tabs,.mv-talk-segments,.mvc-access,.mv-index-filters){border-radius:8px}
:is(.mve-status-tabs,.mvd-sort-tabs,.mvd-scope,.mww-type-tabs,.mv-talk-segments,.mvc-access,.mv-index-filters) button:is([aria-pressed=true],[aria-selected=true],.is-active){background:var(--accent)!important;color:var(--accent-foreground)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 20%,var(--border));border-color:transparent}
:is(.mve-filter-rail,.mva-shelves){border-radius:10px;background:color-mix(in srgb,var(--card) 65%,transparent);border:1px solid var(--border);padding:10px}
:is(.mve-filter-rail,.mva-shelves) :is(button[aria-pressed=true],button[aria-current=page]){color:var(--primary);background:var(--accent);border-color:color-mix(in srgb,var(--primary) 25%,var(--border))}
:is(.mve-search input,.mva-toolbar>input,.mvc-search input,.mvs-input-wrap,.mvs-filter-grid select){background:color-mix(in srgb,var(--background) 70%,var(--card));border-color:var(--border)}
/* Homepage: a featured shelf, jewel-tone genre chips, framed update columns. */
.mv-index-featured{padding:13px;border:1px solid var(--border);border-radius:13px;background:linear-gradient(115deg,color-mix(in srgb,var(--primary) 7%,var(--card)),var(--card));box-shadow:inset 0 1px var(--mv-hairline),var(--mv-elevated)}
.mv-index-heading>span{font-size:10px}
.mv-index-cover{border-radius:8px;border-color:color-mix(in srgb,var(--primary) 18%,var(--border));box-shadow:0 3px 8px #0002}
.mv-index-book h2{font-family:Inter,system-ui,sans-serif;font-size:11px;line-height:1.5;font-weight:550;letter-spacing:-.015em}
.mv-index-book-meta>span:last-child{color:var(--mv-gold)}
.mv-index-genres{border:0;padding:0;gap:6px}
.mv-index-genre{border-radius:999px;padding:5px 11px;background:var(--card);box-shadow:0 1px 3px #00000005;color:var(--primary);border-color:color-mix(in srgb,var(--primary) 18%,var(--border))}
.mv-index-genre:nth-child(3n){color:var(--mv-mint);background:color-mix(in srgb,var(--mv-mint) 6%,var(--card));border-color:color-mix(in srgb,var(--mv-mint) 22%,var(--border))}
.mv-index-genre:nth-child(4n){color:var(--mv-rose);background:color-mix(in srgb,var(--mv-rose) 6%,var(--card));border-color:color-mix(in srgb,var(--mv-rose) 22%,var(--border))}
.mv-index-columns{gap:14px}
:is(.mv-index-updates,.mv-index-popular){min-width:0;padding:12px;border:1px solid var(--border);border-radius:11px;background:color-mix(in srgb,var(--card) 85%,transparent);box-shadow:var(--mv-elevated)}
.mv-index-update-list{border-top:0}
.mv-index-update{padding:8px 2px;border-color:color-mix(in srgb,var(--border) 72%,transparent)}
.mv-index-update:last-child,.mv-index-popular li:last-child>a{border-bottom:0}
.mv-index-update-copy strong{font-size:11px;font-weight:550}
.mv-index-update-copy>span{font-size:10px}
.mv-index-rank{font-family:var(--mv-display);font-weight:550;font-size:15px;color:var(--primary)}
.mv-index-popular li:first-child .mv-index-rank{color:var(--mv-gold)}
.mv-index-free{color:var(--mv-mint)}
.mv-index-mini-covers{display:flex;align-items:center;gap:3px;width:77px;height:57px;overflow:hidden}
.mv-index-mini-covers img{position:static;transform:none;width:23px;height:36px;box-shadow:0 2px 5px #0002;border-radius:3px}
.mv-index-mini-covers img:nth-child(2){height:46px}
.mv-index-collection{align-items:center;gap:10px;padding:11px}
.mv-index-tags{border-top:0;background:color-mix(in srgb,var(--primary) 4%,var(--card));border:1px solid var(--border);border-radius:10px;padding:11px 13px}
/* Browse and community lists: art gets a frame; each list feels like a kept collection. */
.mve-book-cards{padding:9px}
:is(.mve-cover,.mva-cover,.mvp-cover,.mve-shelf-gallery img){border-radius:7px;box-shadow:0 3px 8px #0000001a;border-color:color-mix(in srgb,var(--foreground) 10%,var(--border))}
.mve-book-copy h2,.mve-book-copy h3{font-weight:550}
.mve-book-topline>a{font-size:12px}
.mve-rating{color:var(--mv-gold)}
.mve-status{color:var(--mv-mint);background:color-mix(in srgb,var(--mv-mint) 8%,transparent);border-color:color-mix(in srgb,var(--mv-mint) 20%,var(--border))}
.mvd-intro{margin-bottom:2px}
.mvd-stats dd{font-family:var(--mv-display);color:var(--primary);font-weight:500}
.mve-community .mve-shelves{gap:12px}
.mve-community .mve-shelf{padding:12px;border:1px solid var(--border)!important;border-radius:12px;background:var(--card);box-shadow:var(--mv-elevated)}
.mve-community .mve-shelf:nth-child(3n+2){background:linear-gradient(145deg,color-mix(in srgb,var(--mv-mint) 3%,var(--card)),var(--card))}
.mve-community .mve-shelf:nth-child(3n+3){background:linear-gradient(145deg,color-mix(in srgb,var(--mv-rose) 3%,var(--card)),var(--card))}
.mvd-card-heading h2,.mvd-card-heading h3{font-family:var(--mv-display);font-size:15px;font-weight:500;letter-spacing:-.015em}
.mvd-featured{color:var(--mv-gold);background:color-mix(in srgb,var(--mv-gold) 8%,var(--card));border-color:color-mix(in srgb,var(--mv-gold) 18%,var(--border))}
.mvd-themes a{border-radius:999px;color:var(--primary);background:color-mix(in srgb,var(--primary) 6%,var(--card))}
/* Profile: character, not a taller banner. Existing custom banners remain visible. */
.mvp-identity{border-radius:13px;box-shadow:var(--mv-elevated);position:relative}
.mvp-banner{opacity:1;position:relative}
.mvp-banner::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,color-mix(in srgb,var(--mv-hero-start) 88%,transparent),color-mix(in srgb,var(--mv-hero-end) 20%,transparent)),url('./moonverse-atmosphere.svg') right center/auto 150px;pointer-events:none}
.mvp-identity-copy h1{font-family:var(--mv-display);font-weight:500!important}
.mvp-handle{color:var(--primary)}
.mvp-stats{background:color-mix(in srgb,var(--primary) 5%,var(--card));border-color:var(--border)}
.mvp-stats strong{font-family:var(--mv-display);color:var(--primary);font-weight:500}
.mvp-overview-grid{gap:14px}
.mvp-section{padding:12px!important;border:1px solid var(--border)!important;border-radius:11px;background:color-mix(in srgb,var(--card) 88%,transparent);box-shadow:var(--mv-elevated)}
.mvp-side-column{border-left:0;padding-left:0}
.mvp-section-heading h2{font-size:16px!important;color:var(--foreground)}
.mvp-goal>div>strong{font-family:var(--mv-display);color:var(--primary)}
.mvp-taste>div>div>span,.mvp-reading-progress>span,.mva-reading-progress>span{background:linear-gradient(90deg,var(--primary),var(--mv-mint));border-radius:3px}
.mvp-reading-row{border-color:var(--border)}
.mva-profile-utilities{background:color-mix(in srgb,var(--card) 70%,transparent);border:1px solid var(--border);border-radius:8px;padding:0 10px}
/* Library, wallet and topup retain their compact structures with a clearer surface hierarchy. */
.mva-library-grid:not(.mva-library-list) .mva-library-book{border:1px solid var(--border);border-radius:10px;padding:8px;background:var(--card);box-shadow:var(--mv-elevated)}
.mva-library-grid:not(.mva-library-list) .mva-book-tools{border-color:color-mix(in srgb,var(--primary) 15%,var(--border))}
.mva-library-grid:not(.mva-library-list){gap:12px 10px}
.mva-wallet-summary>div{background:linear-gradient(130deg,var(--card),color-mix(in srgb,var(--primary) 5%,var(--card)));border-top:2px solid color-mix(in srgb,var(--primary) 55%,var(--border))}
.mva-wallet-summary>div:nth-child(2){border-top-color:var(--mv-mint)}
.mva-wallet-summary>div:nth-child(3){border-top-color:var(--mv-gold)}
.mva-wallet-summary strong{font-family:var(--mv-display);font-weight:500}
.mva-pass{background:linear-gradient(115deg,var(--mv-hero-start),var(--card));position:relative;overflow:hidden}
.mva-pass-seal{color:var(--mv-gold);border-color:color-mix(in srgb,var(--mv-gold) 40%,var(--border));background:color-mix(in srgb,var(--mv-gold) 8%,var(--card))}
.mva-packs>button{background:var(--card);border-radius:9px;box-shadow:inset 0 1px var(--mv-hairline)}
.mva-packs>button[aria-pressed=true]{background:var(--accent);border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}
.mva-pack-label{background:var(--primary);color:var(--primary-foreground)}
.mva-notification-list>article[data-read=false]{background:color-mix(in srgb,var(--primary) 6%,var(--card));border-left:2px solid var(--primary)}
.mva-notification-symbol{background:var(--accent);color:var(--primary)}
/* Story pages: cover rim, compact tinted introduction, clear tabs and chapter group hierarchy. */
.mv-series-intro{padding:12px!important;border:1px solid var(--border);border-radius:12px;background:linear-gradient(115deg,color-mix(in srgb,var(--primary) 7%,var(--card)),var(--card));box-shadow:var(--mv-elevated)}
main button.mv-series-cover{border-radius:7px;box-shadow:0 4px 12px #0002,0 0 0 1px color-mix(in srgb,var(--primary) 20%,var(--border))}
.mv-series-titleline h1{font-size:24px!important;font-family:var(--mv-display);font-weight:550;letter-spacing:-.03em}
.mv-series-status{color:var(--mv-mint);background:color-mix(in srgb,var(--mv-mint) 9%,var(--card));border:1px solid color-mix(in srgb,var(--mv-mint) 20%,var(--border));border-radius:999px}
.mv-series-tabs{padding:3px}
.mvc-toolbar{background:color-mix(in srgb,var(--card) 85%,transparent);border:1px solid var(--border);border-radius:9px;padding:9px}
.mvc-group{border-color:var(--border);border-radius:9px;overflow:hidden}
.mvc-group-toggle{background:color-mix(in srgb,var(--primary) 5%,var(--card));color:var(--foreground)}
.mvc-group-toggle strong{font-family:var(--mv-display);font-weight:550}
.mvc-row{border-color:color-mix(in srgb,var(--border) 65%,transparent)}
.mvc-row:nth-child(even){background:color-mix(in srgb,var(--card) 65%,transparent)}
.mvc-row:hover{background:color-mix(in srgb,var(--primary) 7%,var(--card))}
.mvc-free{color:var(--mv-mint)}
.mvc-number{color:var(--primary)}
/* Conversation and reviews: subtle thread surfaces, a purposeful composer, no oversized bubbles. */
.mv-talk-composer{border:1px solid var(--border);border-radius:10px;background:var(--card);box-shadow:inset 0 1px var(--mv-hairline),var(--mv-elevated)}
.mv-talk-composer:focus-within{border-color:color-mix(in srgb,var(--primary) 55%,var(--border))}
.mv-talk-item{border-color:var(--border)}
.mv-talk-content{color:var(--foreground)}
.mv-talk-replies{border-color:color-mix(in srgb,var(--primary) 30%,var(--border))}
.mv-talk-review-overview{border-radius:10px;background:linear-gradient(110deg,color-mix(in srgb,var(--primary) 6%,var(--card)),var(--card));border:1px solid var(--border)}
.mv-talk-average{color:var(--mv-gold);font-family:var(--mv-display)}
.mv-talk-rating-track>span{background:var(--mv-gold)}
.mv-talk-action[aria-pressed=true]{background:var(--accent);color:var(--accent-foreground)}
/* Atelier and community screens share the same palette; mystical frame art keeps its own colors. */
.mww-dressing-room{border:1px solid var(--border);background:linear-gradient(115deg,var(--mv-hero-start),var(--card));border-radius:12px;box-shadow:var(--mv-elevated)}
.mww-preview-stage{background:radial-gradient(ellipse at center,color-mix(in srgb,var(--primary) 12%,transparent),transparent 70%)}
.mww-item-preview{background:radial-gradient(ellipse at center,color-mix(in srgb,var(--mwc-a,var(--primary)) 9%,var(--card)),var(--card))}
.mww-try-dock{border-color:color-mix(in srgb,var(--primary) 35%,var(--border));background:var(--popover);box-shadow:0 8px 28px #0003;border-radius:11px}
.mv-rank-table-head{background:color-mix(in srgb,var(--primary) 7%,var(--card))}
.mv-rank-number{font-family:var(--mv-display)}
.mv-rank-row.is-top{background:linear-gradient(90deg,color-mix(in srgb,var(--primary) 5%,var(--card)),var(--card))}
#root main .mv-page-community>div:first-child:has(h1){background:linear-gradient(115deg,var(--mv-hero-start),var(--card));border:1px solid var(--border);box-shadow:var(--mv-elevated)}
#root main .mv-page-community :where([class*='cursor-pointer']):has(>div h3){background:var(--card);border-color:var(--border);box-shadow:var(--mv-elevated)}
#root main .mv-settings-nav{padding:6px;border:1px solid var(--border);border-radius:10px;background:var(--card);box-shadow:var(--mv-elevated)}
/* Panels, menus and search: consistent glass edge, lilac active states and bounded compact content. */
:is(.mva-dialog,.mvs-dialog,.mvp-dialog,.mve-drawer,.mvc-index-panel,.mvr-panel,.mv-talk-drawer){border-color:color-mix(in srgb,var(--primary) 24%,var(--border));border-radius:13px;box-shadow:0 24px 90px #09041240,0 0 0 1px var(--mv-hairline);background:var(--popover);color:var(--popover-foreground)}
:is(.mva-dialog,.mvs-dialog)::backdrop{background:color-mix(in srgb,var(--background) 72%,#160c2499);backdrop-filter:blur(7px)}
:is(.mva-dialog>header,.mvs-header,.mvp-dialog-heading,.mve-drawer-heading,.mvr-panel-heading,.mvc-index-heading){background:linear-gradient(110deg,color-mix(in srgb,var(--primary) 7%,var(--popover)),var(--popover));border-color:var(--border)}
.mvn-menu>header{background:var(--popover)}
.mvn-destinations>a{background:color-mix(in srgb,var(--card) 65%,var(--popover));border-radius:7px;box-shadow:inset 0 1px var(--mv-hairline)}
.mvn-destinations>a[aria-current=page]{background:var(--accent);color:var(--accent-foreground)}
.mvn-themes button[aria-pressed=true],.mvs-modes button[aria-pressed=true],.mvs-scopes button[aria-pressed=true]{background:var(--accent);color:var(--accent-foreground);border-color:color-mix(in srgb,var(--primary) 28%,var(--border))}
.mvs-result:focus-visible,.mvs-result:hover{background:color-mix(in srgb,var(--primary) 8%,var(--card));border-color:color-mix(in srgb,var(--primary) 25%,var(--border))}
.mvs-page{background:color-mix(in srgb,var(--primary) 3%,var(--card));border-radius:7px}
.mvs-cover{border-radius:5px;box-shadow:0 2px 7px #0002}
.mvs-meta>span:first-child{color:var(--mv-mint)}
.mvs-meta>span:nth-last-child(2){color:var(--mv-gold)}
/**** Reader: quiet prose and clearly separated tools. No ornamental backgrounds behind paragraphs. ****/
.mvr-reader{background:radial-gradient(ellipse 900px 450px at 50% 0,color-mix(in srgb,var(--primary) 4%,transparent),transparent 80%),var(--background)}
.mvr-topbar{background:color-mix(in srgb,var(--card) 94%,transparent);border-color:var(--border);box-shadow:0 1px 0 var(--mv-hairline)}
.mvr-breadcrumb{color:var(--muted-foreground)}
.mvr-title{font-family:var(--mv-display);font-weight:500;letter-spacing:-.03em}
.mvr-dock-controls{background:var(--popover);border-color:color-mix(in srgb,var(--primary) 24%,var(--border));box-shadow:0 7px 30px #0002,inset 0 1px var(--mv-hairline);border-radius:13px}
.mvr-dock-index{background:var(--accent)!important;color:var(--accent-foreground)!important;border-radius:7px!important}
.mvr-theme-button{color:var(--primary)}
.mrx-bar{background:var(--card);border-radius:10px;box-shadow:var(--mv-elevated)}
.mvr-reader .mrx-reaction[aria-pressed=true],.mrx-picker .mrx-reaction[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary)}
.mrx-reaction[aria-pressed=true]>svg,.mrx-reaction[aria-pressed=true]>small{color:var(--primary-foreground)!important}
.mrx-dock-count{background:var(--primary);color:var(--primary-foreground)}
/**** Footer, low-traffic routes and empty states receive the same finish. ****/
.mv-footer{background:color-mix(in srgb,var(--card) 65%,transparent);border-top:1px solid var(--border)}
.mv-footer-brand>a{font-family:var(--mv-display);font-weight:500;letter-spacing:.04em;color:var(--primary)}
.mv-footer-bottom{border-color:var(--border)}
:is(.mve-empty,.mva-empty,.mvp-empty,.mvc-empty,.mvs-empty,.mv-not-found){background:color-mix(in srgb,var(--primary) 3%,var(--card));border-color:var(--border);border-radius:10px}
@media(max-width:767px){
 #root header:has(nav[aria-label=Primary])>div:first-child{height:52px}
 #root main :is(.mva-heading h1,.mve-title-line h1,.mvd-intro h1,.mww-heading h1,.mv-rank-heading h1,.mvp-name-row h1){font-size:24px}
 #root main .mv-index .mv-index-heading h1{font-size:23px}
 :is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading){padding:11px!important;border-radius:10px}
 .mv-index-featured{padding:10px;border-radius:11px}
 .mv-index-heading>span{font-size:9px}
 .mv-index-section-head>h2,.mv-index-tags>h2{font-size:16px}
 .mv-index-collection{gap:9px}
 .mv-index-mini-covers{width:63px}
 .mv-index-mini-covers img{width:19px}
 .mva-library-grid:not(.mva-library-list) .mva-library-book{padding:6px;border-radius:8px}
 .mva-book-title{font-size:9px}
 .mvp-section{padding:10px!important}
 .mve-community .mve-shelf{padding:10px}
 .mv-series-intro{padding:10px!important}
 .mv-series-titleline h1{font-size:21px!important}
 .mva-shelves{padding:5px;border-radius:8px}
 .mva-shelves>button{border-radius:6px}
}
@media(max-width:479px){
 .mv-index-heading{align-items:flex-start;gap:4px}
 .mv-index-heading>span{font-size:8px}
 .mv-index-section-head{gap:8px}
 .mv-index-tools{gap:7px}
 .mv-index-columns{gap:10px}
 :is(.mv-index-updates,.mv-index-popular){padding:10px}
 .mv-index-update-copy strong{font-size:10px}
 .mv-index-update-copy>span{font-size:9px}
 .mv-index-genre{font-size:9px;padding:4px 9px}
 .mv-series-titleline h1{font-size:20px!important}
 .mva-library-grid:not(.mva-library-list){gap:12px 7px}
 .mve-book-cards{padding:7px}
}
@media(prefers-reduced-motion:reduce){:is(.mve-book-cards,.mve-shelf,.mv-index-collection,.mww-item,.mvp-collection){transition:none}.mv-index-book:hover img{transform:none}}
/* Structure-specific finishes, kept separate from generic tab styling. */
#root>.stars-bg{background:transparent}
.mvp-stats dd{font-family:var(--mv-display);font-weight:500;color:var(--primary)}
.mvp-navigation>nav{gap:4px}
.mvp-navigation>nav>button{padding:6px 10px;border:1px solid transparent;border-radius:6px;min-height:30px!important}
.mvp-navigation>nav>button[aria-current=page]{background:var(--accent);color:var(--accent-foreground);border-color:color-mix(in srgb,var(--primary) 20%,var(--border))}
.mvp-navigation>nav>button[aria-current=page]::after{display:none}
.mva-wallet-links>section{background:var(--card);border-color:var(--border);border-radius:11px;box-shadow:var(--mv-elevated)}
.mvr-chapter-heading h1{font-family:var(--mv-display);font-weight:500;letter-spacing:-.03em}
#root main .mv-series-tabs>button{padding:6px 10px;min-height:31px!important;border:1px solid transparent;border-radius:6px;background:transparent;font-size:11px;line-height:1.4}
#root main .mv-series-tabs>button[aria-selected=true]{background:var(--accent);color:var(--accent-foreground);border:1px solid color-mix(in srgb,var(--primary) 25%,var(--border));box-shadow:inset 0 1px var(--mv-hairline)}
#root main .mv-series-tabs>button>span{background:color-mix(in srgb,var(--primary) 8%,var(--card));color:var(--primary);font-size:8px}
@media(max-width:479px){#root main .mv-series-tabs>button{font-size:10px;padding:6px 8px}}
#root main :is(.mv-page-achievements,.mv-page-settings,.mv-page-community) .mv-page-heading:has(h1){position:relative;isolation:isolate;padding:12px 14px;border:1px solid var(--border);border-radius:11px;background:linear-gradient(115deg,var(--mv-hero-start),var(--card));box-shadow:inset 0 1px var(--mv-hairline),var(--mv-elevated);overflow:hidden}
#root main :is(.mv-page-achievements,.mv-page-settings,.mv-page-community) .mv-page-heading:has(h1)::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('./moonverse-atmosphere.svg') right center/auto 140px no-repeat;opacity:.4}
#root main .mv-page-admin>div:first-child:has(h1){background:linear-gradient(115deg,var(--mv-hero-start),var(--card));padding:12px 14px;border:1px solid var(--border);border-radius:11px;box-shadow:var(--mv-elevated)}
#root main .mv-page-admin>div:nth-child(3){flex-wrap:wrap;gap:5px;padding:4px;border:1px solid var(--border);border-radius:8px;background:var(--card)}
#root main .mv-page-admin>div:nth-child(3)>button{font-size:10px;min-height:30px;padding:6px 10px}
#root main .mv-page-admin :is(form,[class~='bg-card']){border-color:var(--border)}
@media(max-width:479px){#root main :is(.mv-page-achievements,.mv-page-settings,.mv-page-community) .mv-page-heading:has(h1){padding:10px}.mv-page-admin>div:first-child h1{font-size:22px!important}}
:root,:root.light,:root.theme-light{--primary-hover:#64358f}
:root.dark,:root.dark.theme-dark{--primary-hover:#d6b9f8}
:root.theme-midnight,:root.dark.theme-midnight{--primary-hover:#d4b3fa}
:root.theme-sepia,:root.light.theme-sepia{--primary-hover:#794056}


/* === Layer: moonverse-library.css === */
/* Library: shared chrome, quiet tools, context-specific book geometry. */
.mva-library{gap:12px;--library-line:color-mix(in srgb,var(--primary) 13%,var(--border))}
.mva-library>.mva-heading{padding:12px 15px!important;min-height:92px}
.mva-library>.mva-tabs{margin:0;align-self:stretch}
.mva-library>.mva-tabs button{display:flex;align-items:center;gap:6px;white-space:nowrap}
.mva-library-layout{grid-template-columns:130px minmax(0,1fr);gap:16px;align-items:start}
.mva-library .mva-shelves{border:1px solid var(--library-line);padding:5px;border-radius:10px;background:linear-gradient(150deg,color-mix(in srgb,var(--primary) 5%,var(--card)),var(--card));gap:3px;position:sticky;top:76px}
.mva-library .mva-shelves button{border:0;padding:7px 8px;border-radius:6px;font-size:10px;min-height:32px!important;gap:5px}
.mva-library .mva-shelves button span{font-size:9px;border-radius:4px;padding:0 4px;background:color-mix(in srgb,var(--muted) 70%,transparent)}
.mva-library .mva-shelves button[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground)}
.mva-library-content{min-width:0}
.mva-library .mva-toolbar{padding:6px;background:color-mix(in srgb,var(--card) 85%,transparent);border:1px solid var(--library-line);border-radius:9px;gap:5px}
.mva-library .mva-toolbar input{background:var(--background);min-width:110px}
.mva-library .mva-result-line{padding:6px 1px 9px;font-size:10px}
.mva-library .mva-result-line button{font-size:9px;color:var(--muted-foreground)}
.mva-library-grid:not(.mva-library-list){grid-template-columns:repeat(auto-fill,minmax(116px,1fr));gap:12px 10px}
.mva-library-grid:not(.mva-library-list) .mva-library-book{padding:7px!important;gap:0;border-color:var(--library-line);background:linear-gradient(170deg,var(--card),color-mix(in srgb,var(--muted) 28%,var(--card)));box-shadow:0 2px 4px #00000005,0 6px 14px #00000008;border-radius:9px;min-width:0;transition:border-color .15s,box-shadow .15s}
.mva-library .mva-library-book:hover{border-color:color-mix(in srgb,var(--primary) 38%,var(--border));box-shadow:var(--mv-elevated)}
.mva-cover{position:relative;isolation:isolate;aspect-ratio:2/3;flex-shrink:0;border:1px solid color-mix(in srgb,var(--foreground) 12%,var(--border));background:linear-gradient(155deg,var(--muted),color-mix(in srgb,var(--primary) 12%,var(--card)));box-shadow:0 3px 7px #0002}
.mva-cover>img{position:absolute;inset:0;display:block;object-fit:cover;width:100%;height:100%}
.mva-cover>img[hidden]{display:none}
.mva-cover-fallback{position:absolute;inset:0;display:grid;align-content:center;text-align:center;padding:7px;overflow:hidden;font:500 11px/1.5 var(--mv-display);color:var(--primary);overflow-wrap:anywhere}
.mva-library-book-copy{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.mva-book-status{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:29px;margin-top:4px}
.mva-shelf-label{font-size:8px;line-height:1.4;font-weight:600;color:var(--primary);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mva-shelf-label[data-shelf=reading]{color:var(--mv-mint)}
.mva-shelf-label[data-shelf=favorites]{color:var(--mv-rose)}
.mva-shelf-label[data-shelf=completed]{color:var(--muted-foreground)}
.mva-library .mva-book-status .mva-save{width:28px;min-width:28px;height:28px;min-height:28px!important;border-radius:6px}
.mva-library .mva-book-status .mva-save[data-saved=true]{background:color-mix(in srgb,var(--primary) 11%,var(--card))!important;color:var(--primary)!important;border-color:color-mix(in srgb,var(--primary) 24%,var(--border))!important}
.mva-library .mva-book-title{font-size:10px;line-height:1.45;min-height:2.9em;font-weight:650;letter-spacing:-.01em}
.mva-library .mva-book-author{font-size:9px;line-height:1.5;margin-bottom:4px}
.mva-library .mva-reading-progress{height:3px;margin-top:auto;border-radius:2px;background:var(--muted);overflow:hidden}
.mva-library .mva-reading-progress>span{display:block;height:100%;background:var(--primary);border-radius:inherit}
.mva-library .mva-library-book-copy>.mva-between{padding-top:3px;gap:4px;font-size:9px;min-height:25px}
.mva-library .mva-library-book-copy>.mva-between a{white-space:nowrap;font-size:9px;font-weight:650}
.mva-library-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.mva-library-list .mva-library-book{padding:10px 0;gap:10px;align-items:start;border-bottom:1px solid var(--library-line);border-radius:0;box-shadow:none!important}
.mva-library-list .mva-cover{width:64px;height:96px;aspect-ratio:2/3}
.mva-library-list .mva-book-status{margin:0;min-height:26px}
.mva-library-list .mva-book-title{font-size:11px;min-height:0}
.mva-library-list .mva-book-author{margin-bottom:0}
.mva-library-list .mva-library-book-copy{min-height:96px}
.mva-library .mva-bookmark-row{padding:9px;border:1px solid var(--library-line);border-radius:9px;background:var(--card);gap:10px}
.mva-library .mva-bookmark-row .mva-cover{width:38px;height:57px;aspect-ratio:2/3}
.mva-library .mva-bookmarks{display:flex;flex-direction:column;gap:8px}
/* The existing collection editor now lives under the same library masthead. */
.mva-collections{width:100%;max-width:none;margin:0;padding:0;min-width:0}
.mva-collections>div{margin-top:0!important}
.mva-collections>div>div{gap:10px}
.mva-collections .celestial-card{background:var(--card);border-color:var(--library-line);box-shadow:var(--mv-elevated)}
.mva-collections>div>div>.grid.grid-cols-3{display:flex;gap:3px;width:fit-content;max-width:100%;padding:3px;border-radius:8px;background:color-mix(in srgb,var(--card) 85%,transparent);border:1px solid var(--library-line)}
.mva-collections>div>div>.grid.grid-cols-3 button{font-size:10px;padding:5px 10px;min-height:30px!important;gap:4px}
.mva-collections h2{font-family:var(--mv-display);font-weight:600;font-size:15px}
.mva-collections h2+p,.mva-collections p.text-xs{font-size:11px;line-height:1.5}
.mva-collections .mv-library-collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mva-collections .mv-library-collection{grid-template-columns:112px minmax(0,1fr);gap:11px;padding:11px;border-radius:10px;border-color:var(--library-line);background:linear-gradient(145deg,color-mix(in srgb,var(--primary) 4%,var(--card)),var(--card));box-shadow:var(--mv-elevated);align-items:center}
main .mva-collections button.mv-library-covers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:4px;width:112px;height:76px;min-height:76px!important;padding:0;margin:0;overflow:hidden;transform:none}
.mva-collections .mv-library-covers img{position:static;display:block;inset:auto;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;transform:none;box-shadow:0 2px 5px #0002;border-radius:3px;z-index:auto}
.mva-collections .mv-library-covers img:only-child{grid-column:2}
.mva-collections .mv-library-covers img:nth-child(2):last-child{grid-column:2}
.mva-collections .mv-library-covers>span{grid-column:1/-1;width:100%;height:68px;background:color-mix(in srgb,var(--primary) 6%,var(--muted));border:1px dashed var(--library-line)}
.mva-collections .mv-library-collection-meta{font-size:9px;margin-bottom:2px}
.mva-collections .mv-library-title{font-size:13px!important;line-height:1.4;font-weight:650;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mva-collections .mv-library-summary{font-size:10px;line-height:1.5;margin-top:3px}
.mva-collections .mv-library-collection-actions{margin-top:5px;padding-top:3px}
/* Contextual covers: promotional cards, story identity, rows and tiny references. */
.mv-index-cover{height:auto!important;aspect-ratio:2/3}
.mv-index-cover>a>img{display:block}
.mve-book-covers .mve-cover{height:auto;max-height:none;aspect-ratio:2/3}
main button.mv-series-cover{width:88px;height:132px;min-height:132px;aspect-ratio:2/3;flex-shrink:0}
.mv-series-cover-wrap{width:88px}
.mvp-favorites .mvp-cover{aspect-ratio:2/3;height:auto}
.mvp-reading-row>.mvp-cover{width:40px;height:60px;aspect-ratio:2/3}
.mvp-collection-covers img{width:27px;height:40.5px;aspect-ratio:2/3;object-fit:cover}
.mva-notification-list article>img{width:32px;height:48px;object-fit:cover;flex-shrink:0}
.mva-epubs article>img{width:42px;height:63px;object-fit:cover;flex-shrink:0}
@media(max-width:959px){
 .mva-library-layout{grid-template-columns:minmax(0,1fr);gap:10px}
 .mva-library .mva-shelves{position:static;flex-direction:row;overflow-x:auto;gap:3px;border-right:1px solid var(--library-line)}
 .mva-library .mva-shelves button{flex-shrink:0;padding:5px 8px;min-height:30px!important}
 .mva-collections .mv-library-collection{grid-template-columns:92px minmax(0,1fr);gap:9px}
 main .mva-collections button.mv-library-covers{width:92px}
}
@media(max-width:639px){
 .mva-library{gap:10px}
 .mva-library>.mva-heading{padding:11px!important;min-height:0;align-items:start}
 .mva-library .mva-heading-links{gap:6px;font-size:9px}
 .mva-library .mva-heading-links>span{max-width:110px;text-align:right}
 .mva-library>.mva-tabs{gap:3px;padding:3px}
 .mva-library>.mva-tabs button{font-size:10px;padding:6px 9px;min-height:32px!important}
 .mva-library .mva-toolbar{flex-wrap:wrap}
 .mva-library .mva-toolbar input{flex-basis:100%;width:100%}
 .mva-library .mva-toolbar select{flex:1;min-width:0;font-size:10px}
 .mva-library-grid:not(.mva-library-list){grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 7px}
 .mva-library-grid:not(.mva-library-list) .mva-library-book{padding:5px!important;border-radius:7px}
 .mva-library .mva-book-title{font-size:10px}
 .mva-library .mva-book-author{font-size:8px}
 .mva-library .mva-book-status{gap:2px}
 .mva-library .mva-shelf-label{font-size:8px}
 .mva-library-list{grid-template-columns:minmax(0,1fr)}
 .mva-collections .mv-library-collection-grid{grid-template-columns:minmax(0,1fr)}
 .mva-collections .mv-library-collection{grid-template-columns:112px minmax(0,1fr);padding:10px;gap:10px}
 main .mva-collections button.mv-library-covers{width:112px;height:72px;min-height:72px!important}
 main button.mv-series-cover{width:70px;height:105px;min-height:105px}
 .mv-series-cover-wrap{width:70px}
}
@media(max-width:359px){
 .mva-library-grid:not(.mva-library-list){grid-template-columns:repeat(2,minmax(0,1fr))}
 .mva-collections .mv-library-collection{grid-template-columns:88px minmax(0,1fr);gap:8px}
 main .mva-collections button.mv-library-covers{width:88px}
 .mva-library .mva-heading-links{align-items:end}
}
@media(prefers-reduced-motion:reduce){.mva-library .mva-library-book{transition:none}}
.mv-series-intro{grid-template-columns:88px minmax(0,1fr);column-gap:12px}
.mva-library .mva-result-line{margin:4px 0}
main .mva-collections button.mv-library-title{min-height:0!important;padding-block:0!important}
main .mva-collections button.mv-library-open,main .mva-collections button.mv-library-icon{min-height:28px!important;height:28px}
@media(max-width:639px){.mv-series-intro{grid-template-columns:70px minmax(0,1fr);column-gap:10px}}
.mva-collection-dialog{width:min(480px,calc(100vw - 24px))}
.mva-collection-form{font-size:11px}
.mva-collection-form :is(input,textarea){width:100%;font-size:11px;min-height:32px}
.mva-collection-form .max-h-72{max-height:min(360px,calc(100dvh - 260px));overflow:auto}
.mva-collection-thumb{width:32px!important;height:48px!important;aspect-ratio:2/3;object-fit:cover;flex-shrink:0}
.mva-collection-story-cover{width:44px!important;height:66px!important;aspect-ratio:2/3;object-fit:cover;flex-shrink:0}
/* Tiny profile previews shrink as a group while retaining each book's proportions. */
.mvp-collection-covers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:3px}
.mvp-collection-covers img{width:100%;height:auto!important;aspect-ratio:2/3;min-width:0;align-self:start}
.mvs-cover{height:64.5px}
@media(max-width:639px){.mvs-cover{height:60px}}
/* Keep collection calls to action on the same compact scale as shelf controls. */
.mva-collections :is(button,a)[class*='bg-primary']{font-size:11px;line-height:1.4;padding:6px 10px;min-height:32px!important}
/* Small references stay distinct from gallery cards and keep an upright book silhouette. */
.mv-index-update>img{width:27px;height:40.5px}
.mv-index-popular img,.mv-series-collection img,.mv-series-recommendation img{width:27px;height:40.5px;object-fit:cover;flex-shrink:0}
.mv-index-mini-covers img,.mv-index-mini-covers img:nth-child(2){width:23px;height:34.5px;flex-shrink:0;object-fit:cover}
.mv-flat-books>a{width:48px;height:72px;flex-basis:48px}
.mv-flat-books-sm>a{width:33px;height:49.5px;flex-basis:33px}
.mv-flat-books-lg>a{width:58px;height:87px;flex-basis:58px}
@media(max-width:639px){.mv-index-mini-covers img,.mv-index-mini-covers img:nth-child(2){width:19px;height:28.5px}}
.mv-index-popular li img{width:27px;height:40.5px}
.mv-index-mini-covers img:not(:first-child){display:block}


/* === Layer: moonverse-depth.css === */
/* Moonverse / Nocturne. Ink, moonlight, and compact editorial hierarchy. */
:root,:root.light,:root.theme-light{
 --background:#ffffff;--foreground:#282c34;--card:#ffffff;--card-foreground:#282c34;--popover:#ffffff;--popover-foreground:#282c34;
 --muted:#f1f2f4;--muted-foreground:#505561;--border:#dfe2e7;--input:#c7cbd3;--ring:#5d55a8;
 --primary:#5d55a8;--primary-foreground:#ffffff;--accent:#f0eef9;--accent-foreground:#4f478f;--secondary:#f5f4fa;--secondary-foreground:#4f478f;
 --mv-mint:#286c63;--mv-rose:#9f4263;--mv-gold:#8b5e22;--mv-surface:#ffffff;--mv-surface-raised:#ffffff;
 --mv-canvas-glow:transparent;--mv-edge:#ffffff;--mv-inset:#f7f8fa;--mv-shadow-ink:#24283b;
 --mv-shadow-sm:0 1px 2px #24283b08,0 3px 8px #24283b06;
 --mv-shadow-md:0 2px 3px #24283b08,0 7px 20px #24283b09;
 --mv-shadow-lg:0 9px 25px #24283b19,0 25px 70px #24283b18;
 --mv-elevated:var(--mv-shadow-md);--mv-hairline:#ffffff;--mv-ui-font:'Plus Jakarta Sans',Inter,system-ui,sans-serif;
 --primary-hover:color-mix(in srgb,var(--primary) 86%,var(--foreground));--mv-wash:transparent;--mv-wash-secondary:transparent;--mv-display:Literata,Georgia,serif;--mv-moon:#e5c68d;--mv-label:#534394;
 --mv-hero-base:#202637;--mv-hero-end:#37344f;--mv-hero-ink:#fffaf0;--mv-hero-muted:#dbdbe8;--mv-hero-accent:#e9d4a4;
}
:root.dark,:root.dark.theme-dark{
 --background:#111620;--foreground:#efeef5;--card:#1b2230;--card-foreground:#efeef5;--popover:#232b3b;--popover-foreground:#efeef5;
 --muted:#2b3446;--muted-foreground:#b7bfce;--border:#394253;--input:#515b70;--ring:#c1b6f1;
 --primary:#c1b6f1;--primary-foreground:#29223e;--accent:#393149;--accent-foreground:#eee2ff;--secondary:#303248;--secondary-foreground:#e2d9f8;
 --mv-mint:#91d3c2;--mv-rose:#e7a5bf;--mv-gold:#e5c68d;--mv-surface:#1b2230;--mv-surface-raised:#263043;
 --mv-canvas-glow:#39395035;--mv-edge:#ffffff0c;--mv-inset:#151c28;--mv-shadow-ink:#02050c;
 --mv-shadow-sm:0 1px 2px #02050c35,0 3px 9px #02050c20;
 --mv-shadow-md:0 2px 4px #02050c35,0 8px 22px #02050c25;
 --mv-shadow-lg:0 9px 25px #02050c70,0 25px 70px #02050c70;
 --mv-hairline:#ffffff0c;--mv-label:#c9b9ff;--mv-hero-base:#202737;--mv-hero-end:#37334d;
}
:root.theme-midnight,:root.dark.theme-midnight{
 --background:#080f18;--foreground:#edf2fa;--card:#141f2d;--card-foreground:#edf2fa;--popover:#1b2a3b;--popover-foreground:#edf2fa;
 --muted:#26364b;--muted-foreground:#b0c0d5;--border:#344a62;--input:#4b6582;--ring:#b7c5fa;
 --primary:#b7c5fa;--primary-foreground:#192a43;--accent:#263c55;--accent-foreground:#e1edff;--secondary:#24344a;--secondary-foreground:#e1edff;
 --mv-mint:#8dd5c2;--mv-rose:#f0aec7;--mv-gold:#e5c68d;--mv-surface:#141f2d;--mv-surface-raised:#213247;
 --mv-canvas-glow:#23415c30;--mv-edge:#dceaff10;--mv-inset:#0d1724;--mv-shadow-ink:#01040a;
 --mv-shadow-sm:0 1px 2px #01040a45,0 4px 9px #01040a30;
 --mv-shadow-md:0 2px 4px #01040a50,0 8px 22px #01040a40;
 --mv-shadow-lg:0 9px 25px #01040a80,0 25px 70px #01040a80;
 --mv-hairline:#e3edff10;--mv-label:#bdcdfa;--mv-hero-base:#172a3e;--mv-hero-end:#303950;
}
/* Soft Cream Paper: near-white paper, charcoal text, and a restrained sage accent. */
:root.theme-sepia,:root.light.theme-sepia{
 --background:#faf9f6;--foreground:#292b24;--card:#fffefa;--card-foreground:#292b24;--popover:#fffefa;--popover-foreground:#292b24;
 --muted:#f0f0ea;--muted-foreground:#4f5247;--border:#dedfd6;--input:#c5c8bc;--ring:#59674b;
 --primary:#59674b;--primary-foreground:#ffffff;--accent:#edf0e8;--accent-foreground:#46553b;--secondary:#f2f4ee;--secondary-foreground:#46553b;
 --mv-mint:#3d6d5c;--mv-rose:#924e65;--mv-gold:#86652b;--mv-surface:#fffefa;--mv-surface-raised:#ffffff;
 --mv-canvas-glow:transparent;--mv-edge:#ffffff;--mv-inset:#f5f5f0;--mv-shadow-ink:#35392e;
 --mv-shadow-sm:0 1px 2px #35392e08,0 4px 9px #35392e06;
 --mv-shadow-md:0 2px 3px #35392e09,0 8px 20px #35392e09;
 --mv-shadow-lg:0 9px 25px #35392e16,0 25px 70px #35392e16;
 --primary-hover:color-mix(in srgb,var(--primary) 86%,var(--foreground));--mv-orchid:#819576;--mv-wash:transparent;--mv-wash-secondary:transparent;--mv-hairline:#ffffff;--mv-label:#3a4630;
 --mv-hero-base:#293029;--mv-hero-end:#3c4635;--mv-hero-ink:#fffdf7;--mv-hero-muted:#dce1d5;--mv-hero-accent:#e7d6af;
}
/* Canvas and navigation occupy their own level above content. */
body{background:radial-gradient(ellipse 750px 430px at 30% -60px,var(--mv-canvas-glow),transparent 85%),linear-gradient(150deg,color-mix(in srgb,var(--background) 90%,var(--card)),var(--background));background-attachment:fixed}
body::before{opacity:.018}
#root header:has(nav[aria-label=Primary]){background:color-mix(in srgb,var(--card) 94%,transparent);border-bottom:1px solid var(--border);box-shadow:0 1px 0 var(--mv-edge),0 5px 18px color-mix(in srgb,var(--mv-shadow-ink) 7%,transparent)}
#root nav[aria-label=Primary]{background:var(--mv-inset);border-color:color-mix(in srgb,var(--border) 85%,transparent);box-shadow:inset 0 1px 3px #00000008}
#root nav[aria-label=Primary] a{font-weight:600;font-family:var(--mv-ui-font);padding:6px 12px}
#root nav[aria-label=Primary] a[aria-current=page]{background:var(--primary);border-color:var(--primary);color:var(--primary-foreground);box-shadow:0 2px 6px color-mix(in srgb,var(--primary) 20%,transparent)}
#root header button[aria-label='Search Moonverse']{background:var(--mv-inset);box-shadow:inset 0 1px 3px #00000008;border-color:var(--border)}
#root header :is(button[aria-label='Color Mode'],button[aria-label='User profile menu'],.mva-notification-trigger,.mvn-trigger){box-shadow:inset 0 1px 0 var(--mv-edge),var(--mv-shadow-sm)}
#root nav[aria-label=Mobile]{background:color-mix(in srgb,var(--popover) 97%,transparent);box-shadow:0 -4px 22px #00000012;border-top:1px solid var(--border)}
#root nav[aria-label=Mobile] a{border-radius:8px}
#root nav[aria-label=Mobile] a[aria-current=page]{background:var(--accent);color:var(--accent-foreground);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 20%,transparent)}
/* Page titles get a shallow, saturated signature masthead. */
#root main:not([data-reader=true]) h1{font-family:var(--mv-ui-font);font-weight:750;letter-spacing:-.045em;line-height:1.24}
#root main :is(.mva-heading h1,.mve-title-line h1,.mvd-intro h1,.mww-heading h1,.mv-rank-heading h1,.mvp-name-row h1){font-size:26px}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading){
 background:radial-gradient(ellipse 350px 210px at 95% -30%,#b397ff35,transparent 85%),linear-gradient(115deg,var(--mv-hero-base),var(--mv-hero-end));
 color:var(--mv-hero-ink);border:1px solid #aa8cdb45!important;border-radius:12px;box-shadow:inset 0 1px 0 #ffffff20,var(--mv-shadow-md)
}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading)::before{opacity:.2;background-size:auto 170px}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) :is(h1,h2,strong,dd){color:var(--mv-hero-ink)}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) :is(p,small,dt,.mva-heading-links>span,.mww-balances>span){color:var(--mv-hero-muted)}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) :is(.mva-eyebrow,.mve-kicker,.mvd-eyebrow,.mww-eyebrow){color:#e0caff;font-size:8px;letter-spacing:.18em}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) a:not([class*='primary']){color:var(--mv-hero-accent)}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) :is(.mva-primary,.mve-primary,.mww-primary){background:#e3d5ff!important;border-color:#e3d5ff!important;color:#2c1a48!important;box-shadow:0 2px 7px #00000025,inset 0 1px #ffffff60}
:is(.mva-heading,.mve-heading,.mww-heading) .mve-secondary{background:#ffffff0c;border-color:#ffffff40;color:#f4edff}
.mvd-stats>div,.mww-balances>span{background:#ffffff0a;border-color:#ffffff20;box-shadow:inset 0 1px #ffffff08}
/* Each content level is legible without adding height to cards. */
:is(.mv-index-featured,.mv-index-updates,.mv-index-popular,.mv-index-tags,.mvp-section,.mva-library-content .mva-toolbar,.mvc-catalog,.mv-rank-table){background:var(--card);border-color:var(--border);box-shadow:inset 0 1px 0 var(--mv-edge),var(--mv-shadow-md)}
:is(.mv-index-updates,.mv-index-popular,.mvp-section,.mva-ledger,.mva-redeem){border-top:2px solid color-mix(in srgb,var(--primary) 65%,var(--border))!important}
:is(.mv-index-section-head>h2,.mv-index-tags>h2,.mvp-section-heading h2,.mvd-directory-heading h2,.mva-bookmarks h2,.mv-series-section-title h2){font-family:var(--mv-ui-font);font-weight:750;letter-spacing:-.03em}
.mv-index-section-head>h2,.mv-index-tags>h2{font-size:16px}
.mv-index-featured{background:linear-gradient(120deg,color-mix(in srgb,var(--primary) 8%,var(--card)),var(--card));border-top:2px solid var(--primary)}
.mv-index-book h2{font-weight:650}
.mv-index-genre{background:var(--card);border-color:var(--border);box-shadow:var(--mv-shadow-sm);font-weight:600}
:is(.mve-book-cards,.mve-shelf,.mv-index-collection,.mww-item,.mvp-collection,.mva-collections .mv-library-collection){background:linear-gradient(150deg,var(--card),color-mix(in srgb,var(--card) 88%,var(--muted)));border:1px solid var(--border);box-shadow:inset 0 1px 0 var(--mv-edge),var(--mv-shadow-sm);border-radius:10px;transition:border-color .16s,box-shadow .16s}
:is(.mve-book-cards,.mve-shelf,.mv-index-collection,.mww-item,.mvp-collection,.mva-collections .mv-library-collection):hover{border-color:color-mix(in srgb,var(--primary) 65%,var(--border));box-shadow:inset 0 1px 0 var(--mv-edge),var(--mv-shadow-md)}
.mve-book-covers .mve-cover,.mv-index-cover,.mvp-favorites .mvp-cover{box-shadow:0 2px 3px #00000015,0 7px 14px #00000022;border-color:color-mix(in srgb,var(--foreground) 15%,var(--border));border-radius:6px}
.mve-book-copy h2,.mva-book-title,.mvp-favorite h3{font-weight:650}
.mve-community .mve-shelf{border-top:2px solid color-mix(in srgb,var(--primary) 55%,var(--border));background:linear-gradient(160deg,color-mix(in srgb,var(--primary) 5%,var(--card)),var(--card))}
.mve-community .mve-shelf:nth-child(3n+2){border-top-color:color-mix(in srgb,var(--mv-mint) 65%,var(--border));background:linear-gradient(160deg,color-mix(in srgb,var(--mv-mint) 5%,var(--card)),var(--card))}
.mve-community .mve-shelf:nth-child(3n){border-top-color:color-mix(in srgb,var(--mv-rose) 60%,var(--border));background:linear-gradient(160deg,color-mix(in srgb,var(--mv-rose) 4%,var(--card)),var(--card))}
.mvd-card-heading h2,.mvd-card-heading h3{font-family:var(--mv-ui-font);font-weight:750;font-size:14px}
.mvd-featured{background:color-mix(in srgb,var(--mv-gold) 12%,var(--card));color:var(--mv-gold)}
/* Recessed rails distinguish filters from the cards they control. */
:is(.mve-filter-rail,.mva-library .mva-shelves,.mva-tabs,.mvp-navigation,.mve-page-tabs,.mv-series-tabs,.mvd-utility,.mww-toolbar){background:var(--mv-inset);border-color:var(--border);box-shadow:inset 0 1px 3px #0000000c}
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs)>:is(button,a):is([aria-current=page],[aria-selected=true],.is-active),#root main .mv-series-tabs button[aria-selected=true]{background:var(--primary)!important;color:var(--primary-foreground)!important;border-color:var(--primary)!important;box-shadow:inset 0 1px #ffffff20,0 2px 5px #00000014}
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs,.mv-series-tabs)>:is(button,a){font-weight:600}
:is(.mve-status-tabs,.mvd-sort-tabs,.mvd-scope,.mww-type-tabs,.mv-talk-segments,.mvc-access,.mv-index-filters) button:is([aria-pressed=true],[aria-selected=true],.is-active){background:var(--primary)!important;color:var(--primary-foreground)!important;box-shadow:0 2px 5px #00000012;border-color:var(--primary)}
:is(.mv-talk-segment-count,.mvd-scope button span,.mvc-access button span){color:inherit}
:is(.mve-filter-rail,.mva-library .mva-shelves) button[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground);box-shadow:0 2px 5px #00000014}
:is(.mve-search input,.mva-toolbar>input,.mvc-search input,.mvs-input-wrap,.mvs-filter-grid select){background:var(--mv-inset);border-color:var(--border);box-shadow:inset 0 1px 3px #00000008}
:is(input,textarea,select){scroll-margin-block:80px}
:is(input,select,textarea):focus{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--ring) 14%,transparent)}
:where(a,button,summary,[role="tab"],[role="switch"]):focus-visible{outline:1.5px solid color-mix(in srgb,var(--ring) 70%,transparent);outline-offset:2px}
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]),textarea,select):focus,:where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]),textarea,select):focus-visible{outline:none!important;outline-offset:0!important;border-color:color-mix(in srgb,var(--primary) 70%,var(--border))!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent),0 1px 2px rgba(0,0,0,0.04)!important}
:where(button):disabled{cursor:not-allowed}
/* Primary and secondary controls have physical edges, distinct active and pressed states. */
:is(.mva-primary,.mvp-primary,.mve-primary,.mww-primary,.mv-talk-primary,.mv-button-primary){background:linear-gradient(135deg,var(--primary),color-mix(in srgb,var(--primary) 86%,#4f2597))!important;border:1px solid color-mix(in srgb,var(--primary) 75%,#32165a)!important;color:var(--primary-foreground)!important;box-shadow:inset 0 1px #ffffff25,0 2px 5px color-mix(in srgb,var(--primary) 22%,transparent);font-weight:650;border-radius:7px}
:is(.mve-secondary,.mvp-secondary,.mva-secondary){background:var(--card);border-color:var(--border);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
:is(.mva-primary,.mvp-primary,.mve-primary,.mww-primary,.mv-talk-primary):active:not(:disabled){box-shadow:inset 0 2px 5px #00000018}
:is(.mva-primary,.mvp-primary,.mve-primary,.mww-primary,.mv-talk-primary):disabled{box-shadow:none;filter:saturate(.45)}
/* Story identity is the strongest visual plane; chapter tools remain functional and compact. */
.mv-series-intro{background:radial-gradient(ellipse 500px 240px at 100% 0,#bb97ff18,transparent 85%),linear-gradient(115deg,var(--mv-hero-base),var(--mv-hero-end));border-color:#ae8fdb40;box-shadow:inset 0 1px #ffffff18,var(--mv-shadow-md);color:var(--mv-hero-ink)}
#root main .mv-series-titleline h1{font-family:var(--mv-ui-font);font-size:24px!important;font-weight:750;letter-spacing:-.035em;color:var(--mv-hero-ink)}
.mv-series-byline,.mv-series-metrics dt,.mv-series-summary p,.mv-series-context,.mv-series-warning,.mv-series-shelf{color:var(--mv-hero-muted)}
.mv-series-byline>:first-child,.mv-series-metrics dd{color:var(--mv-hero-ink)}
.mv-series-byline>a,.mv-series-genres a,.mv-series-summary button,.mv-series-metrics>div:first-child dd{color:var(--mv-hero-accent)}
.mv-series-status{background:#80e5c219;border-color:#80e5c242;color:#aff2dc}
.mv-series-adult{color:#ffc0d6}
main button.mv-series-cover{box-shadow:0 3px 5px #00000045,0 9px 22px #00000030;border-color:#ffffff45}
.mv-series .mv-story-actions>:is(a,button),.mv-series .mv-story-actions>div>button{background:#ffffff0d;border:1px solid #ffffff35;color:#f5efff;box-shadow:inset 0 1px #ffffff0a;border-radius:6px}
.mv-series .mv-story-actions>a:first-child{background:#e3d5ff!important;border-color:#e3d5ff!important;color:#2c1a48!important;box-shadow:0 2px 6px #00000025}
.mv-series .mv-story-actions>:is(a,button):hover,.mv-series .mv-story-actions>div>button:hover{background:#ffffff1c;color:#ffffff}
.mv-series-intro :is(a,button):focus-visible{outline-color:#e4d5ff!important}
.mv-series-aside{border-left:0;padding-left:0;gap:12px}
.mv-series-aside>section{border:1px solid var(--border);border-radius:10px;padding:9px 10px;background:var(--card);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
.mv-series-section-title{border-bottom:1px solid var(--border);padding-bottom:5px;margin-bottom:2px}
.mv-series-section-title h2{font-size:12px}
.mvc-catalog{border-color:var(--border);background:var(--card)}
.mvc-toolbar{border-radius:0;background:var(--mv-inset);border-width:0 0 1px;box-shadow:inset 0 1px var(--mv-edge)}
.mvc-group-toggle{background:color-mix(in srgb,var(--primary) 9%,var(--card));border-color:var(--border)}
.mvc-row{background:var(--card);transition:background .12s;border-color:color-mix(in srgb,var(--border) 65%,transparent)}
.mvc-row:nth-child(even){background:color-mix(in srgb,var(--muted) 28%,var(--card))}
.mvc-row:hover{background:var(--accent)}
.mvc-row.is-current{box-shadow:inset 3px 0 var(--primary)}
/**** Discussions: compact conversation tiles and clear reply indentation. ****/
.mv-talk-composer{background:var(--card);border-color:var(--border);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm);border-top:2px solid color-mix(in srgb,var(--primary) 65%,var(--border))}
.mv-talk-composer:focus-within{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--ring) 12%,transparent),var(--mv-shadow-sm)}
.mv-talk-list{gap:8px}
.mv-talk-list>.mv-talk-item{padding:10px!important;border:1px solid var(--border);border-radius:9px;background:var(--card);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
.mv-talk-item.is-reply{background:transparent;box-shadow:none;border:0}
.mv-talk-replies{border-left:2px solid color-mix(in srgb,var(--primary) 45%,var(--border));padding-left:9px}
.mv-talk-author>strong{font-family:var(--mv-ui-font);font-weight:700}
.mv-talk-review-overview{background:linear-gradient(130deg,color-mix(in srgb,var(--primary) 9%,var(--card)),var(--card));box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm);border-color:var(--border)}
.mv-talk-action[aria-pressed=true]{color:var(--primary);background:var(--accent);border-radius:5px;padding-inline:5px}
.mv-talk-badge{background:var(--accent);color:var(--accent-foreground);border-color:color-mix(in srgb,var(--primary) 22%,var(--border))}
/* Profile retains custom artwork while its information cards have clearer hierarchy. */
.mvp-identity{box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-md);border-color:var(--border)}
.mvp-banner::after{background:linear-gradient(100deg,#17172d9c,#47356835),url('./moonverse-atmosphere.svg') right center/auto 150px}
.mvp-stats{background:var(--mv-inset);border-color:var(--border);box-shadow:inset 0 1px 3px #00000008}
.mvp-stats strong{font-family:var(--mv-ui-font);font-weight:750}
.mvp-section-heading h2{font-size:14px!important}
.mvp-goal{background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 9%,var(--card)),var(--card));border:1px solid var(--border);border-radius:9px;padding:10px}
.mvp-cover{border-radius:5px}
.mva-library-grid:not(.mva-library-list) .mva-library-book{background:linear-gradient(160deg,var(--card),color-mix(in srgb,var(--card) 86%,var(--muted)));border-color:var(--border);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
.mva-library .mva-book-status .mva-save[data-saved=true]{background:var(--accent)!important;color:var(--accent-foreground)!important}
.mva-reading-progress,.mvp-reading-progress{background:var(--muted)}
.mva-reading-progress>span,.mvp-reading-progress>span{background:linear-gradient(90deg,var(--primary),var(--mv-mint))!important;box-shadow:0 0 4px color-mix(in srgb,var(--primary) 25%,transparent)}
.mva-library .mva-shelf-label{font-weight:650}
.mva-wallet-summary>div,.mva-wallet-links>section,.mva-pass,.mva-redeem,.mva-ledger{box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-md);background:var(--card);border-color:var(--border)}
.mva-pass{background:linear-gradient(115deg,color-mix(in srgb,var(--primary) 10%,var(--card)),var(--card));border-top:2px solid var(--primary)}
.mva-wallet-summary strong,.mva-pass h2{font-family:var(--mv-ui-font);font-weight:750}
.mva-packs>button{box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
.mva-packs>button[aria-pressed=true]{border-color:var(--primary);background:var(--accent);box-shadow:inset 0 0 0 1px var(--primary),var(--mv-shadow-sm)}
/* Dialogs sit above the page; their header and body are visibly different levels. */
:is(.mva-dialog,.mvs-dialog,.mvp-dialog,.mve-drawer,.mvc-index-panel,.mvr-panel,.mv-talk-drawer){background:var(--popover);border:1px solid color-mix(in srgb,var(--primary) 32%,var(--border));box-shadow:0 0 0 1px var(--mv-edge),var(--mv-shadow-lg);border-radius:12px}
:is(.mva-dialog,.mvs-dialog)::backdrop{background:#090b195c;backdrop-filter:blur(6px)}
:is(.mva-dialog>header,.mvp-dialog-heading,.mve-drawer-heading,.mvr-panel-heading,.mvc-index-heading){background:linear-gradient(110deg,var(--mv-inset),var(--popover));border-color:var(--border);box-shadow:inset 0 1px var(--mv-edge)}
:is(.mva-dialog>header h2,.mvs-header h2,.mve-drawer-heading h2,.mvr-panel-heading h2){font-family:var(--mv-ui-font);font-weight:750}
.mvn-menu>header{background:linear-gradient(115deg,var(--mv-hero-base),var(--mv-hero-end));color:var(--mv-hero-ink);border-color:#ffffff20}
.mvn-menu>header :is(h2,button){color:var(--mv-hero-ink)}
.mvn-destinations>a{box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm);background:var(--card);border-color:var(--border)}
.mvn-destinations>a>svg{background:var(--accent);border-radius:5px;padding:4px;box-sizing:content-box;color:var(--accent-foreground)}
.mvn-destinations>a[aria-current=page]{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary)}
.mvn-destinations>a[aria-current=page]>svg{background:#ffffff22;color:inherit}
.mvn-themes>div,.mvs-modes,.mvs-scopes{background:var(--mv-inset);border-color:var(--border);box-shadow:inset 0 1px 3px #00000008}
.mvn-themes button[aria-pressed=true],.mvs-modes button[aria-pressed=true],.mvs-scopes button[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground);box-shadow:0 2px 5px #00000012;border-color:var(--primary)}
.mvs-result{border:1px solid transparent;border-radius:7px}
.mvs-result:hover,.mvs-result:focus-visible{background:var(--accent);border-color:color-mix(in srgb,var(--primary) 40%,var(--border))}
.mvs-advanced{background:var(--mv-inset);border-color:var(--border);border-radius:8px}
.mva-notification-list>article[data-read=false]{background:color-mix(in srgb,var(--primary) 9%,var(--card));border-left-color:var(--primary)}
/* Reader prose remains calm; navigation, reactions and tools receive the new finish. */
.mvr-reader{background:var(--background)}
.mvr-topbar{background:color-mix(in srgb,var(--card) 96%,transparent);box-shadow:0 1px var(--mv-edge),var(--mv-shadow-sm)}
.mvr-dock-controls{background:var(--popover);border:1px solid color-mix(in srgb,var(--primary) 40%,var(--border));box-shadow:inset 0 1px var(--mv-edge),0 6px 12px #0000001c,0 14px 38px #0000002a;border-radius:12px}
.mvr-dock-index{background:var(--primary)!important;color:var(--primary-foreground)!important;box-shadow:inset 0 1px #ffffff22}
.mvr-dock-controls :is(button,a):hover{background:var(--accent);color:var(--accent-foreground)}
.mrx-bar{background:var(--card);border:1px solid var(--border);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
.mrx-reaction{background:var(--mv-inset);border-color:var(--border)}
.mvr-reader .mrx-reaction[aria-pressed=true],.mrx-picker .mrx-reaction[aria-pressed=true]{background:var(--primary);color:var(--primary-foreground);box-shadow:0 2px 5px #00000014}
/* Secondary routes use the same compact surface language. */
.mww-dressing-room{background:linear-gradient(125deg,color-mix(in srgb,var(--primary) 9%,var(--card)),var(--card));border-color:var(--border);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-md)}
.mww-item-preview{background:radial-gradient(ellipse at center,color-mix(in srgb,var(--mwc-a,var(--primary)) 14%,var(--card)),var(--card))}
.mww-item.is-equipped{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary),var(--mv-shadow-sm)}
.mv-rank-table-head{background:var(--mv-inset)}
.mv-rank-row.is-top{background:linear-gradient(90deg,color-mix(in srgb,var(--primary) 10%,var(--card)),var(--card))}
.mv-rank-row.is-top .mv-rank-number{color:var(--mv-gold);font-family:var(--mv-ui-font);font-weight:750}
#root main .mv-settings-nav{background:var(--mv-inset);box-shadow:inset 0 1px 3px #00000008}
#root main .mv-page :where([class~='bg-card'],[class~='celestial-glass']){background-color:var(--card);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
#root main .mv-page-community :where([class*='cursor-pointer']):has(>div h3){background:var(--card);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-sm)}
:is(.mve-empty,.mva-empty,.mvp-empty,.mvc-empty,.mvs-empty,.mv-not-found){background:linear-gradient(130deg,color-mix(in srgb,var(--primary) 7%,var(--card)),var(--card));border:1px dashed color-mix(in srgb,var(--primary) 35%,var(--border));box-shadow:inset 0 1px var(--mv-edge)}
.mv-footer{background:var(--card);border-top:1px solid var(--border);box-shadow:0 -1px 0 var(--mv-edge)}
.mv-footer-brand>a{font-family:var(--mv-ui-font);font-weight:750;letter-spacing:.08em}
@media(max-width:767px){
 #root main :is(.mva-heading h1,.mve-title-line h1,.mvd-intro h1,.mww-heading h1,.mv-rank-heading h1,.mvp-name-row h1){font-size:23px}
 #root main .mv-series-titleline h1{font-size:20px!important;line-height:1.3}
 .mv-series-aside>section{padding:8px 9px}
 .mvn-destinations>a>svg{padding:3px}
 .mv-talk-list>.mv-talk-item{padding:9px!important}
}
@media(prefers-reduced-motion:no-preference){
 dialog[open]{animation:mv-prism-dialog .14s ease-out}
 @keyframes mv-prism-dialog{from{opacity:.5;translate:0 4px}to{opacity:1;translate:0 0}}
}
@media(prefers-reduced-motion:reduce){
 :is(.mve-book-cards,.mve-shelf,.mv-index-collection,.mww-item,.mvp-collection,.mvc-row){transition:none}
 dialog[open]{animation:none}
}
:root{--primary-hover:color-mix(in srgb,var(--primary) 86%,var(--foreground))}
:is(.mvc-access,.mv-talk-segments,.mvd-scope,.mv-index-filters) button[aria-pressed=true]>span{opacity:1}
/* Preserve readable text on filled controls when pointer hover changes secondary colors. */
:is(.mva-primary,.mvp-primary,.mve-primary,.mww-primary,.mv-talk-primary):hover:not(:disabled){background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 92%,var(--foreground)),var(--primary))!important;color:var(--primary-foreground)!important}
:is(.mva-heading,.mve-heading,.mww-heading) :is(.mva-primary,.mve-primary,.mww-primary):hover{background:#f0e7ff!important;color:#2c1a48!important}
#root main .mv-series-summary button{color:var(--mv-hero-accent)}
/* Inverted mastheads keep their own text roles in every palette. */
#root main :is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) :is(p,small,dt,.mva-heading-links>span,.mww-balances>span){color:var(--mv-hero-muted)}
#root main :is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) :is(h1,h2,dd,strong){color:var(--mv-hero-ink)}
.mvp-navigation nav{gap:4px}
.mvp-navigation nav button{border:1px solid transparent;border-radius:6px;padding:6px 10px;min-height:30px!important;font-weight:600}
.mvp-navigation nav button[aria-current=page]{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary);box-shadow:inset 0 1px #ffffff20,0 2px 5px #00000014}
.mvp-navigation nav button[aria-current=page]:after{display:none}
.mvp-navigation nav button[aria-current=page]:hover{color:var(--primary-foreground)}
.mvc-empty>a{display:inline-flex;align-items:center;min-height:28px;padding:4px 8px;border-radius:6px;background:var(--accent);color:var(--accent-foreground);font-size:11px;font-weight:650}
#root main .mva-collections button.mv-library-title{min-height:28px!important;display:flex;align-items:center;text-align:left}
@media(pointer:coarse){#root main .mva-collections button.mv-library-title{min-height:32px!important}}
/* Information-heavy legacy headers use an accent edge, leaving embedded tools readable. */
#root main :is(.mv-page-achievements,.mv-page-settings,.mv-page-community) .mv-page-heading:has(h1),#root main .mv-page-admin>div:first-child:has(h1){border-left:3px solid var(--primary);background:linear-gradient(115deg,color-mix(in srgb,var(--primary) 9%,var(--card)),var(--card));box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-md)}
#root main .mv-page-auth{padding-block:24px!important}
#root main .mv-page-auth>div{display:flex;flex-direction:column;gap:14px;max-width:390px;padding:20px!important;border-radius:12px;border-top:3px solid var(--primary);background:var(--card);box-shadow:inset 0 1px var(--mv-edge),var(--mv-shadow-lg)}
#root main .mv-page-auth>div>*{margin-block:0!important}
#root main .mv-page-auth input{background:var(--mv-inset)!important;color:var(--foreground);border:1px solid var(--border);border-radius:6px;font-size:11px;min-height:34px}
#root main .mv-page-auth input::placeholder{color:var(--muted-foreground);opacity:1}
#root main .mv-page-auth h1{font-size:23px}

/* Action icons inherit the inverted hero's ink rather than the page palette. */
.mv-series .mv-story-actions>button>svg,.mv-series .mv-story-actions>a>svg,.mv-series .mv-story-actions>div>button>svg{color:inherit!important}
@media(max-width:479px){
 .mv-series .mv-story-actions:not(:has(>a)){display:flex;flex-wrap:wrap;gap:5px}
 .mv-series .mv-story-actions:not(:has(>a))>div{width:auto;flex:0 1 auto}
 .mv-series .mv-story-actions:not(:has(>a))>button{width:32px;min-width:32px;flex:0 0 32px}
}
/* A reserved portrait keeps a broken or slow promotional image from becoming a blank tile. */
.mv-index-cover-image{position:relative;display:block;width:100%;height:100%;isolation:isolate}
.mv-index-cover-image>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.mv-index-cover-image>img[hidden]{display:none}
.mv-cover-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:12px;color:#f7f1ff;background:radial-gradient(ellipse at 75% 20%,#aa85e933,transparent 70%),linear-gradient(155deg,#24233f,#49316b);text-align:center}
.mv-cover-fallback>span{font-size:27px;line-height:1;color:#dac3ff}
.mv-cover-fallback>strong{font:650 11px/1.5 var(--mv-ui-font);display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.mv-cover-fallback>small{position:absolute;bottom:10px;left:0;right:0;font:600 6px/1.3 var(--mv-ui-font);letter-spacing:.18em;color:#dacbed}
.mv-series .mv-story-actions>div>button svg{color:inherit!important}
.mv-series .mv-story-actions>div>button svg.fill-primary{fill:currentColor!important}
/* Profile reading rows: one chapter cue, a quiet progress track, and a clear resume action. */
.mvp-reading-rows{display:grid;gap:6px}
.mvp-profile .mvp-reading-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px;border:1px solid var(--border);border-radius:8px;background:color-mix(in srgb,var(--muted) 17%,var(--card));min-width:0}
.mvp-profile .mvp-reading-row>.mvp-cover{width:40px;height:60px;aspect-ratio:2/3;border-radius:4px}
.mvp-profile .mvp-reading-copy{min-width:0}
.mvp-profile .mvp-story-title{font-size:12px;line-height:1.45;font-weight:650}
.mvp-profile .mvp-reading-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 7px;font-size:10px;line-height:1.4;margin-top:3px!important;color:var(--muted-foreground)}
.mvp-reading-shelf{padding:1px 5px;border:1px solid var(--border);border-radius:4px;font-size:8px;line-height:1.4;background:var(--card)}
.mvp-profile .mvp-reading-progress{display:block;width:min(100%,180px);height:3px;gap:0;padding:0;margin-top:7px;background:transparent;border:0;box-shadow:none;overflow:hidden;border-radius:3px}
.mvp-profile .mvp-reading-progress progress{width:100%;max-width:none;height:3px;margin:0;border-radius:3px}
.mvp-profile .mvp-reading-progress progress::-webkit-progress-value{background:linear-gradient(90deg,var(--primary),var(--mv-mint))}
.mvp-profile .mvp-reading-progress progress::-moz-progress-bar{background:linear-gradient(90deg,var(--primary),var(--mv-mint))}
.mvp-profile .mvp-read-link{width:auto;min-width:72px;height:30px;min-height:30px;display:inline-flex;justify-content:center;align-items:center;gap:5px;padding:5px 8px;border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border));border-radius:6px;background:var(--accent);color:var(--accent-foreground);font-size:10px;font-weight:650;white-space:nowrap}
.mvp-profile .mvp-read-link svg{width:13px;height:13px;flex-shrink:0}
.mvp-profile .mvp-read-link:hover{background:color-mix(in srgb,var(--primary) 16%,var(--card));border-color:var(--primary);color:var(--accent-foreground)}
@media(max-width:479px){.mvp-profile .mvp-reading-row{gap:8px;padding:7px}.mvp-profile .mvp-story-title{font-size:11px}.mvp-profile .mvp-read-link{min-width:65px;padding:5px 6px;font-size:9px}.mvp-profile .mvp-reading-meta{font-size:9px}}

/* Wallet, membership, and the indexed EPUB shelf: compact surfaces with distinct purposes. */
.mva-membership{gap:14px}
.mva-membership .mva-heading{padding:17px 22px;min-height:86px}
.mva-membership .mva-heading>div{min-width:0}
.mva-membership .mva-heading> a{margin-right:0;flex-shrink:0;font-size:10px;color:var(--mv-hero-ink)}
.mva-wallet-summary{border:0;background:none;gap:10px;box-shadow:none!important;overflow:visible}
.mva-wallet-summary>div{position:relative;min-width:0;border:1px solid var(--border)!important;border-radius:10px;padding:15px;gap:11px;box-shadow:var(--mv-inset),var(--mv-shadow-sm);background:linear-gradient(115deg,color-mix(in srgb,var(--primary) 5%,var(--card)),var(--card) 65%)}
.mva-wallet-summary>div:first-child{border-top:2px solid var(--primary)!important}
.mva-wallet-summary>div:nth-child(2){border-top:2px solid var(--mv-mint)!important}
.mva-wallet-summary>div:nth-child(3){border-top:2px solid var(--mv-gold)!important}
.mva-wallet-summary>div>svg,.mva-wallet-summary .mva-dew-symbol{display:block;box-sizing:content-box;width:19px;height:19px;padding:8px;border-radius:10px;background:color-mix(in srgb,var(--primary) 10%,var(--card));color:var(--primary);flex-shrink:0;line-height:19px;text-align:center;font-size:21px}
.mva-wallet-summary>div:nth-child(2)>.mva-dew-symbol{color:var(--foreground);background:color-mix(in srgb,var(--mv-mint) 16%,var(--card))}
.mva-wallet-summary>div:nth-child(3)>svg{color:var(--foreground);background:color-mix(in srgb,var(--mv-gold) 17%,var(--card))}
.mva-wallet-summary small{font-size:8px;letter-spacing:.12em;font-weight:700}
.mva-wallet-summary strong{font-size:23px;letter-spacing:-.04em}
.mva-wallet-summary>div:last-child strong{font-size:14px;letter-spacing:-.025em;white-space:normal}
.mva-wallet-summary>div>:last-child:is(a,button){font-size:10px}
.mva-wallet-summary>div>span:has(small){gap:4px;min-width:0}
.mva-membership>.mva-tabs{margin:0;gap:5px;padding:4px;min-height:39px}
.mva-pass{padding:22px;gap:18px;grid-template-columns:48px minmax(0,1fr) 190px;border-radius:12px;border-top:2px solid var(--primary);background:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--primary) 14%,transparent),transparent 55%),linear-gradient(110deg,var(--card),color-mix(in srgb,var(--primary) 4%,var(--card)))}
.mva-pass h2{font-size:25px;letter-spacing:-.045em;margin:6px 0 7px}
.mva-pass-seal{display:grid;width:45px;height:58px;background:linear-gradient(140deg,var(--primary),color-mix(in srgb,var(--primary) 50%,var(--mv-rose)));color:var(--primary-foreground)}
.mva-pass ul{gap:11px 18px;margin-top:17px}
.mva-pass li strong{font-size:11px;font-weight:700}
.mva-pass li small{font-size:10px;line-height:1.45}
.mva-pass li>svg{flex-shrink:0;border-radius:50%;padding:2px;background:color-mix(in srgb,var(--primary) 11%,transparent);width:15px;height:15px}
.mva-pass-action{padding-left:18px;gap:7px}
.mva-pass-action>strong{font-size:23px;letter-spacing:-.035em}
.mva-pass-action small{font-size:9px}
.mva-pass-action .mva-primary:disabled{opacity:1;color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--card));border:1px solid color-mix(in srgb,var(--primary) 32%,var(--border));box-shadow:none}
.mva-wallet-links{gap:12px}
.mva-wallet-links>section{padding:17px 18px;border-radius:10px;border-left:3px solid color-mix(in srgb,var(--primary) 60%,var(--border))}
.mva-wallet-links>section:nth-child(2){border-left-color:var(--mv-mint)}
.mva-wallet-links h2{font-family:var(--mv-ui-font);font-size:14px;font-weight:700;letter-spacing:-.025em}
.mva-wallet-links p{font-size:11px;line-height:1.65;margin:7px 0 12px}
.mva-wallet-links :is(a,button){font-size:11px;font-weight:650}
.mva-ledger-layout{grid-template-columns:300px minmax(0,1fr);gap:12px}
.mva-ledger-layout>section{border-radius:11px;padding:18px}
.mva-ledger-layout h2{font-size:16px;font-weight:750;letter-spacing:-.03em;font-family:var(--mv-ui-font)}
.mva-ledger-layout p{font-size:11px;line-height:1.6}
.mva-redeem form{padding:10px;background:var(--muted);border-radius:8px;gap:7px}
.mva-redeem input{min-width:0;font-size:11px;background:var(--card)}
.mva-redeem summary{font-size:11px;font-weight:650}
.mva-code-examples{flex-wrap:wrap}
.mva-code-examples button{font-size:9px}
.mva-ledger-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mva-ledger-heading h2{margin:0}
.mva-ledger-heading>span{border-radius:5px;background:var(--muted);padding:4px 7px;font-size:9px;color:var(--muted-foreground);white-space:nowrap}
.mva-ledger li{font-size:11px;align-items:center;padding:12px 0}
.mva-ledger li>div{display:grid;gap:4px}
.mva-ledger li strong{font-weight:650}
.mva-ledger time{font-size:9px;color:var(--muted-foreground)}
.mva-ledger li>span{font-size:10px;line-height:1.5;text-align:right;overflow-wrap:anywhere;max-width:45%}
.mva-topup-sheet{width:min(600px,calc(100vw - 24px))}
.mva-topup-content{gap:12px}
.mva-mini-balance{border-radius:8px;background:linear-gradient(100deg,color-mix(in srgb,var(--primary) 10%,var(--card)),var(--card));padding:12px;border:1px solid var(--border)}
.mva-mini-balance strong{font:750 22px/1.2 var(--mv-ui-font);letter-spacing:-.04em}
.mva-packs{gap:6px}
.mva-packs>button{border-radius:8px;padding:12px 5px;position:relative;background:var(--card);box-shadow:var(--mv-inset)}
.mva-packs>button[aria-pressed=true]{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 13%,var(--card));box-shadow:inset 0 0 0 1px var(--primary),var(--mv-shadow-sm)}
.mva-packs strong{font-size:25px;font-family:var(--mv-ui-font);font-weight:750;letter-spacing:-.04em}
.mva-pack-label{font-size:8px;letter-spacing:0;font-weight:700}
.mva-packs small{font-size:8px}
.mva-pack-price{font-size:11px;font-weight:700}
.mva-custom{padding:10px;border-radius:8px;border:1px solid var(--border);background:var(--card)}
.mva-custom label{font-size:11px}
.mva-custom>span{font-size:9px;line-height:1.5}
.mva-quote{padding:11px 12px;border:1px solid var(--border);border-radius:8px;background:var(--muted);font-size:11px}
.mva-topup-content>.mva-small{font-size:9px;line-height:1.5;gap:8px;flex-wrap:wrap}

.mva-membership .mva-edition-library{border:1px solid var(--border);background:var(--card);border-radius:12px;box-shadow:var(--mv-inset),var(--mv-shadow-md);min-width:0;overflow:clip}
.mva-membership .mva-edition-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 18px 13px;background:linear-gradient(110deg,color-mix(in srgb,var(--primary) 7%,var(--card)),var(--card))}
.mva-membership .mva-edition-heading h2{font:750 18px/1.2 var(--mv-ui-font);letter-spacing:-.04em;margin:0 0 5px}
.mva-membership .mva-edition-heading p{font-size:11px;line-height:1.5;color:var(--muted-foreground);margin:0}
.mva-membership .mva-edition-owned{border:1px solid var(--border);border-radius:6px;background:var(--card);padding:5px 9px;font-size:10px;color:var(--primary);font-weight:700;white-space:nowrap}
.mva-membership .mva-edition-controls{display:flex;align-items:center;gap:8px;padding:0 18px 13px;background:var(--card)}
.mva-membership .mva-edition-search{flex:1;display:flex;align-items:center;gap:8px;min-width:100px;padding:0 10px;height:35px;background:var(--muted);border:1px solid var(--input);border-radius:7px;box-shadow:inset 0 1px 3px #00000005}
.mva-membership .mva-edition-search>svg{color:var(--muted-foreground);width:15px;height:15px;flex-shrink:0}
.mva-membership .mva-edition-search input{width:100%;min-width:0;font:11px var(--mv-ui-font);color:var(--foreground);border:0;background:transparent;outline:none;padding:8px 0}
.mva-membership .mva-edition-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.mva-membership .mva-edition-search:focus-within{outline:2px solid var(--primary);outline-offset:2px}
.mva-membership .mva-edition-search>button{border:0;padding:0;width:24px;height:28px;min-height:28px!important;display:grid;place-items:center;color:var(--muted-foreground);flex-shrink:0;border-radius:4px}
.mva-membership .mva-edition-owned-toggle{font-size:10px;font-weight:650;border:1px solid var(--border);border-radius:7px;background:var(--card);padding:7px 10px;min-height:35px!important;white-space:nowrap;box-shadow:var(--mv-shadow-sm)}
.mva-membership .mva-edition-owned-toggle>span{display:flex;align-items:center;gap:6px}
.mva-membership .mva-edition-owned-toggle svg{width:14px;height:14px}
.mva-membership .mva-edition-owned-toggle[aria-pressed=true]{background:var(--accent);color:var(--accent-foreground);border-color:var(--primary)}
.mva-membership .mva-edition-count{font-size:10px;color:var(--muted-foreground);white-space:nowrap;min-width:103px;text-align:right;font-variant-numeric:tabular-nums}
.mva-membership .mva-alphabet{display:flex;align-items:center;gap:12px;padding:9px 18px;background:var(--muted);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.mva-membership .mva-alphabet-label{font-size:9px;letter-spacing:.1em;font-weight:800;color:var(--muted-foreground);white-space:nowrap}
.mva-membership .mva-alphabet>div{display:grid;grid-template-columns:repeat(26,minmax(0,1fr));gap:3px;flex:1}
.mva-membership .mva-alphabet button{font:750 11px/1 var(--mv-ui-font);padding:0;min-width:0;min-height:28px!important;border:1px solid color-mix(in srgb,var(--primary) 27%,var(--border));border-radius:5px;color:var(--primary);background:var(--card);box-shadow:var(--mv-shadow-sm)}
.mva-membership .mva-alphabet button:not(:disabled):hover{color:var(--primary-foreground);background:var(--primary);border-color:var(--primary);transform:translateY(-1px)}
.mva-membership .mva-alphabet button:disabled{color:var(--muted-foreground);opacity:.36;background:transparent;box-shadow:none;border-color:transparent;cursor:default}
.mva-membership .mva-alphabet button:focus-visible,.mva-membership .mva-edition-library button:focus-visible,.mva-membership .mva-edition-title a:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.mva-membership .mva-edition-groups{padding:0 18px 4px}
.mva-membership .mva-letter-group h3{display:flex;align-items:center;gap:9px;margin:0;padding:12px 0 8px;border-bottom:1px solid var(--border);scroll-margin-top:70px;outline-offset:3px}
.mva-membership .mva-letter-group h3>span{font:800 16px/1 var(--mv-ui-font);color:var(--primary);width:25px;height:27px;display:grid;place-items:center;border-radius:5px;background:color-mix(in srgb,var(--primary) 10%,var(--card))}
.mva-membership .mva-letter-group h3>small{font-size:9px;color:var(--muted-foreground);font-weight:500}
.mva-membership .mva-edition-story{display:grid;grid-template-columns:minmax(220px,1.05fr) minmax(0,1.25fr);gap:20px;padding:10px 0;align-items:center;border-bottom:1px solid var(--border)}
.mva-membership .mva-edition-story:last-child{border-bottom:0}
.mva-membership .mva-edition-story-info{display:flex;gap:11px;align-items:center;min-width:0}
.mva-membership .mva-edition-cover{position:relative;width:40px;height:60px;flex:0 0 40px;overflow:hidden;border-radius:4px;background:linear-gradient(150deg,var(--accent),var(--muted));box-shadow:0 2px 5px #0002,inset 0 0 0 1px var(--border)}
.mva-membership .mva-edition-cover>span{position:absolute;inset:5px;font:700 7px/1.4 var(--mv-ui-font);overflow:hidden;overflow-wrap:anywhere;color:var(--accent-foreground)}
.mva-membership .mva-edition-cover img{display:block;position:absolute;width:100%;height:100%;object-fit:cover}
.mva-membership .mva-edition-title{min-width:0}
.mva-membership .mva-edition-title h4{font:700 12px/1.5 var(--mv-ui-font);margin:0 0 4px;overflow-wrap:anywhere;letter-spacing:-.015em}
.mva-membership .mva-edition-title a:hover{color:var(--primary)}
.mva-membership .mva-edition-title small{font-size:9px;color:var(--muted-foreground)}
.mva-membership .mva-edition-volumes{padding:0;margin:0;list-style:none;min-width:0}
.mva-membership .mva-edition-volumes li{display:grid;grid-template-columns:minmax(0,1fr) 164px;align-items:center;gap:12px;padding:0}
.mva-membership .mva-edition-volumes li+li{border-top:1px dashed var(--border);padding-top:8px;margin-top:8px}
.mva-membership .mva-edition-description{display:grid;gap:5px;min-width:0}
.mva-membership .mva-edition-description strong{font-size:11px;line-height:1.5;font-weight:550;overflow-wrap:anywhere}
.mva-membership .mva-edition-description small{font-size:9px;line-height:1.5;color:var(--muted-foreground)}
.mva-membership .mva-edition-access{display:grid;justify-items:end;gap:5px;min-width:0}
.mva-membership .mva-edition-access .mva-secondary{font-size:10px;font-weight:650;min-height:30px!important;padding:6px 10px;border-radius:6px;white-space:nowrap}
.mva-membership .mva-edition-access button:disabled{opacity:.55;cursor:default;box-shadow:none}
.mva-membership .mva-edition-price{font-size:11px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.4}
.mva-membership .mva-edition-state{font-size:9px;font-weight:650;line-height:1.4;color:var(--primary)}
.mva-membership .mva-edition-state.is-owned{background:color-mix(in srgb,var(--mv-mint) 15%,var(--card));color:var(--foreground);padding:3px 6px;border-radius:4px}
.mva-membership .mva-edition-shortfall{font-size:8px;color:var(--muted-foreground);line-height:1.4;text-align:right}
.mva-membership .mva-edition-footer{display:flex;justify-content:space-between;gap:10px;padding:11px 18px;border-top:1px solid var(--border);background:color-mix(in srgb,var(--muted) 45%,var(--card));color:var(--muted-foreground);font-size:9px;line-height:1.5}
.mva-membership .mva-edition-footer small{font-size:9px;text-align:right}
.mva-membership .mva-edition-empty{padding:30px 15px}
.mva-membership .mva-edition-empty>svg{color:var(--primary);width:24px;height:24px;margin:auto auto 9px}
.mva-membership .mva-edition-empty h3{font-size:15px;font-weight:700;letter-spacing:-.025em}
.mva-membership .mva-edition-empty p{font-size:11px;line-height:1.7}
.mva-membership .mva-edition-empty button{margin-top:10px;font-size:11px}
@media(max-width:1000px){
 .mva-wallet-summary>div{padding:13px 12px;gap:8px;flex-wrap:wrap}
 .mva-wallet-summary>div>:last-child:is(a,button){margin:2px 0 0 43px;width:calc(100% - 43px);text-align:left;justify-content:flex-start;font-size:9px}
 .mva-wallet-summary>div>.mva-primary{justify-content:center}
 .mva-wallet-summary strong{font-size:21px}
 .mva-pass{grid-template-columns:minmax(0,1fr) 175px}
 .mva-pass-seal{display:none}
 .mva-membership .mva-edition-story{grid-template-columns:minmax(180px,1fr) minmax(0,1.3fr);gap:15px}
 .mva-membership .mva-edition-volumes li{grid-template-columns:minmax(0,1fr) 145px;gap:10px}
}
@media(max-width:850px){
 .mva-ledger-layout{grid-template-columns:1fr}
 .mva-membership .mva-alphabet>div{grid-template-columns:repeat(13,minmax(0,1fr));gap:4px}
 .mva-membership .mva-alphabet{align-items:flex-start}
 .mva-membership .mva-alphabet-label{padding-top:9px}
 .mva-wallet-summary>div>:last-child:is(a,button){margin-left:0;width:100%}
 .mva-wallet-summary>div>svg,.mva-wallet-summary .mva-dew-symbol{padding:6px;width:16px;height:16px;font-size:18px;line-height:16px;border-radius:7px}
 .mva-membership .mva-edition-story{grid-template-columns:1fr;gap:4px;padding:12px 0}
 .mva-membership .mva-edition-volumes{margin-left:51px}
 .mva-membership .mva-edition-volumes li{grid-template-columns:minmax(0,1fr) 164px;padding:3px 0 0}
 .mva-membership .mva-edition-title h4{font-size:12px}
}
@media(max-width:639px){
 .mva-membership{gap:11px}
 .mva-membership .mva-heading{padding:15px;min-height:82px;align-items:flex-start}
 .mva-membership .mva-heading h1{font-size:24px;line-height:1.1}
 .mva-membership .mva-heading> a{font-size:9px;padding-top:2px;white-space:nowrap}
 .mva-membership .mva-heading p{font-size:10px;max-width:230px}
 .mva-wallet-summary{gap:6px}
 .mva-wallet-summary>div{padding:10px 9px;gap:7px;align-content:start;border-radius:8px}
 .mva-wallet-summary>div>svg,.mva-wallet-summary .mva-dew-symbol{display:none}
 .mva-wallet-summary strong{font-size:21px}
 .mva-wallet-summary small{font-size:7px;letter-spacing:.06em}
 .mva-wallet-summary>div:last-child strong{font-size:12px;line-height:1.3}
 .mva-wallet-summary>div>:last-child:is(a,button){font-size:9px;min-height:27px!important;margin-top:3px;line-height:1.4;white-space:normal}
 .mva-wallet-summary>div>.mva-primary{padding:5px 4px}
 .mva-membership>.mva-tabs{gap:2px;padding:3px;min-height:38px}
 .mva-membership>.mva-tabs>button{font-size:9px;padding:7px 8px;white-space:nowrap}
 .mva-pass{padding:16px;grid-template-columns:1fr;gap:15px}
 .mva-pass h2{font-size:23px}
 .mva-pass p{font-size:11px;line-height:1.6}
 .mva-pass ul{gap:12px 10px;margin-top:15px}
 .mva-pass li{gap:6px}
 .mva-pass li strong{font-size:10px}
 .mva-pass li small{font-size:9px}
 .mva-pass-action{padding:13px 0 0}
 .mva-pass-action>strong{font-size:22px}
 .mva-pass-action .mva-primary{font-size:10px;padding:8px}
 .mva-wallet-links>section{padding:14px}
 .mva-ledger-layout>section{padding:14px}
 .mva-ledger li{gap:10px}
 .mva-membership .mva-edition-heading{padding:14px 12px 11px;gap:8px;align-items:flex-start}
 .mva-membership .mva-edition-heading h2{font-size:17px}
 .mva-membership .mva-edition-heading p{font-size:10px;max-width:245px}
 .mva-membership .mva-edition-owned{font-size:9px;padding:4px 6px}
 .mva-membership .mva-edition-controls{padding:0 12px 11px;flex-wrap:wrap;gap:7px}
 .mva-membership .mva-edition-search{flex-basis:calc(100% - 105px);padding:0 8px}
 .mva-membership .mva-edition-search>svg{display:none}
 .mva-membership .mva-edition-owned-toggle{padding:7px 8px;font-size:9px}
 .mva-membership .mva-edition-owned-toggle svg{width:12px;height:12px}
 .mva-membership .mva-edition-count{text-align:left;flex-basis:100%;font-size:9px}
 .mva-membership .mva-alphabet{gap:8px;padding:8px 12px}
 .mva-membership .mva-alphabet-label{font-size:8px;padding-top:9px}
 .mva-membership .mva-alphabet>div{gap:3px;grid-template-columns:repeat(13,minmax(0,1fr))}
 .mva-membership .mva-alphabet button{font-size:10px;min-height:27px!important;border-radius:4px}
 .mva-membership .mva-edition-groups{padding:0 12px 4px}
 .mva-membership .mva-letter-group h3{padding:11px 0 7px;scroll-margin-top:64px}
 .mva-membership .mva-edition-story{padding:11px 0;gap:5px}
 .mva-membership .mva-edition-story-info{gap:10px;align-items:flex-start}
 .mva-membership .mva-edition-cover{width:36px;height:54px;flex-basis:36px}
 .mva-membership .mva-edition-title h4{font-size:12px;line-height:1.5;margin-bottom:3px}
 .mva-membership .mva-edition-title small{font-size:9px}
 .mva-membership .mva-edition-volumes{margin-left:46px;margin-top:-5px}
 .mva-membership .mva-edition-volumes li{grid-template-columns:minmax(0,1fr) 136px;gap:9px}
 .mva-membership .mva-edition-description strong{font-size:10px}
 .mva-membership .mva-edition-description small{font-size:9px}
 .mva-membership .mva-edition-price{font-size:10px}
 .mva-membership .mva-edition-access .mva-secondary{font-size:9px;padding:6px 8px;min-height:29px!important}
 .mva-membership .mva-edition-state{font-size:8px}
 .mva-membership .mva-edition-shortfall{font-size:8px}
 .mva-membership .mva-edition-footer{padding:10px 12px;flex-direction:column;gap:3px}
 .mva-membership .mva-edition-footer small{text-align:left}
 .mva-topup-sheet{width:calc(100vw - 20px)}
 .mva-packs{gap:5px;grid-template-columns:repeat(3,minmax(0,1fr))}
 .mva-packs>button{padding:10px 5px;min-height:104px!important}
 .mva-packs strong{font-size:25px}
 .mva-pack-label,.mva-packs small{font-size:8px}
 .mva-pack-price{font-size:11px}
 .mva-topup-content>.mva-context{font-size:10px;line-height:1.6}
 .mva-custom{flex-wrap:wrap;gap:7px}
 .mva-custom>span{width:100%;font-size:9px}
}
@media(max-width:370px){
 .mva-membership .mva-edition-volumes{margin-left:0;margin-top:2px}
 .mva-membership .mva-edition-volumes li{grid-template-columns:minmax(0,1fr) 128px}
 .mva-membership .mva-alphabet{gap:5px;padding-inline:9px}
 .mva-membership .mva-alphabet>div{gap:2px}
 .mva-membership .mva-alphabet-label{display:none}
 .mva-membership .mva-edition-count{font-size:9px}
 .mva-wallet-summary>div{padding:9px 7px}
 .mva-membership>.mva-tabs>button{padding:7px 6px;font-size:8px}
 .mva-wallet-summary>div:last-child strong{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.mva-membership .mva-alphabet button:not(:disabled):hover{transform:none}}

/* Private profile wallet: one compact top-up entry into the shared global sheet. */
.mvp-profile .mvp-wallet-section{border:1px solid var(--border);border-top:2px solid var(--primary);border-radius:10px;overflow:hidden;background:var(--card);box-shadow:var(--mv-inset),var(--mv-shadow-md);min-width:0}
.mvp-profile .mvp-wallet-topup{display:flex;align-items:center;gap:10px;text-align:left;width:100%;padding:13px 12px;border:0;background:linear-gradient(115deg,color-mix(in srgb,var(--primary) 10%,var(--card)),var(--card));color:var(--foreground);border-radius:0;min-height:80px;transition:background .15s}
.mvp-profile .mvp-wallet-topup:hover{background:color-mix(in srgb,var(--primary) 15%,var(--card));color:var(--foreground)}
.mvp-profile .mvp-wallet-topup:focus-visible{outline:2px solid var(--primary);outline-offset:-3px}
.mvp-profile .mvp-wallet-icon{display:grid;place-items:center;width:33px;height:37px;border:1px solid color-mix(in srgb,var(--primary) 25%,var(--border));border-radius:9px;color:var(--primary);background:var(--card);box-shadow:var(--mv-shadow-sm);flex-shrink:0}
.mvp-profile .mvp-wallet-icon svg{width:18px;height:18px}
.mvp-profile .mvp-wallet-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.mvp-profile .mvp-wallet-copy>small{font-size:7px;font-weight:750;letter-spacing:.13em;color:var(--muted-foreground)}
.mvp-profile .mvp-wallet-copy>strong{font:750 17px/1.3 var(--mv-ui-font);letter-spacing:-.035em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.mvp-profile .mvp-wallet-copy>span{font-size:10px;color:var(--primary);font-weight:600}
.mvp-profile .mvp-wallet-plus{margin-left:auto;flex-shrink:0;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--primary);color:var(--primary-foreground);font-size:19px;line-height:1}
.mvp-profile .mvp-wallet-section>footer{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--muted);border-top:1px solid var(--border);padding:8px 12px;font-size:9px;line-height:1.5}
.mvp-profile .mvp-wallet-section>footer>span{color:var(--muted-foreground);white-space:nowrap}
.mvp-profile .mvp-wallet-section>footer>a{color:var(--primary);font-weight:650}

/* Nocturne: distinct canvas, editorial shelves, and precise working surfaces. */
body{background:radial-gradient(ellipse 760px 350px at 50% -120px,var(--mv-canvas-glow),transparent 90%),var(--background);background-attachment:fixed}
body::before{opacity:.012}
#root main:not([data-reader=true]){padding-top:18px}
#root main:not([data-reader=true]) :is(.mva-page,.mve-explore,.mvp-profile,.mww-wardrobe,.mv-index,.mv-series){font-family:var(--mv-ui-font)}
#root header:has(nav[aria-label=Primary]){background:color-mix(in srgb,var(--card) 96%,transparent);box-shadow:0 1px 0 var(--mv-edge),0 3px 12px #00000006;backdrop-filter:blur(16px)}
#root nav[aria-label=Primary]{border:0;background:transparent;box-shadow:none;gap:2px}
#root nav[aria-label=Primary] a{position:relative;padding:7px 11px;border-radius:5px;color:var(--muted-foreground);font-size:11px}
#root nav[aria-label=Primary] a[aria-current=page]{background:var(--accent);border-color:transparent;color:var(--accent-foreground);box-shadow:none}
#root nav[aria-label=Primary] a[aria-current=page]::after{content:'';position:absolute;left:11px;right:11px;bottom:-6px;height:2px;background:var(--primary);border-radius:1px}
#root header :is(button[aria-label='Color Mode'],button[aria-label='User profile menu'],.mva-notification-trigger,.mvn-trigger){border-radius:8px;box-shadow:0 1px 2px #00000006}
#root header button[aria-label='Search Moonverse']{border-radius:7px;border-color:var(--border);background:var(--mv-inset);box-shadow:inset 0 1px 2px #00000004}
#root nav[aria-label=Mobile]{padding-bottom:env(safe-area-inset-bottom,0px);background:var(--card);border-top:1px solid var(--border);box-shadow:0 -3px 14px #00000008}
#root nav[aria-label=Mobile] a{position:relative;color:var(--muted-foreground);border-radius:6px}
#root nav[aria-label=Mobile] a[aria-current=page]{background:var(--accent);color:var(--accent-foreground);box-shadow:none}
#root nav[aria-label=Mobile] a[aria-current=page]::before{content:'';position:absolute;top:0;width:18px;height:2px;border-radius:1px;background:var(--primary)}
/* Display type belongs to story identities and page titles; working labels stay sans. */
#root main :is(.mva-heading h1,.mve-title-line h1,.mvd-intro h1,.mww-heading h1,.mv-rank-heading h1){font-family:var(--mv-display);font-weight:550;font-size:27px;letter-spacing:-.045em;line-height:1.25}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading){position:relative;isolation:isolate;border:1px solid color-mix(in srgb,var(--mv-hero-base) 60%,var(--border))!important;border-radius:9px;background:linear-gradient(112deg,var(--mv-hero-base),var(--mv-hero-end));box-shadow:inset 0 1px #ffffff14,0 3px 10px #0000000c;overflow:hidden}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading)::before{background:none;opacity:1;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 30%,#e5c68d07)}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading)::after{content:'';position:absolute;width:130px;height:130px;right:25px;top:-70px;border:1px solid #e5c68d22;border-radius:50%;box-shadow:0 0 0 13px #e5c68d05,0 0 0 30px #e5c68d04;z-index:-1;pointer-events:none}
:is(.mva-heading,.mve-heading,.mvd-intro,.mww-heading,.mv-rank-heading) :is(.mva-eyebrow,.mve-kicker,.mvd-eyebrow,.mww-eyebrow){color:var(--mv-hero-accent);font-size:8px;letter-spacing:.16em;font-weight:650}
.mvd-stats>div,.mww-balances>span{border:1px solid #ffffff1c;border-radius:6px;background:#ffffff08}
/* The home shelf reads like a curated reading room, with artwork doing the talking. */
.mv-index{gap:15px}
.mv-index-featured{position:relative;isolation:isolate;border:1px solid var(--border);border-radius:11px;background:var(--card);box-shadow:var(--mv-shadow-md);padding:15px!important;overflow:hidden}
.mv-index-featured::before{content:'';position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--primary),var(--mv-gold) 55%,transparent);pointer-events:none}
.mv-index-featured>.mv-index-section-head{margin-bottom:12px;align-items:center}
.mv-index .mv-index-heading{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.mv-index .mv-index-heading .mv-home-kicker{display:block;font:750 8px/1.5 var(--mv-ui-font);letter-spacing:.17em;color:var(--mv-label)}
#root main .mv-index .mv-index-heading h1{font:550 28px/1.2 var(--mv-display);letter-spacing:-.045em;margin:0}
.mv-index-heading>span:not(.mv-home-kicker){display:none}
.mv-index-tools{gap:10px;flex-shrink:0;align-items:center}
.mv-index-tools .mv-index-daily{border-radius:6px;background:var(--accent);color:var(--accent-foreground);border-color:color-mix(in srgb,var(--primary) 25%,var(--border));box-shadow:none;font-size:10px;font-weight:650}
.mv-index .mv-index-book h2{font:650 11px/1.5 var(--mv-ui-font);letter-spacing:-.015em;margin-top:7px;min-height:3em}
.mv-index .mv-index-book-meta{font-size:9px;margin-top:5px;color:var(--muted-foreground)}
.mv-index-cover,.mve-book-covers .mve-cover,.mvp-favorites .mvp-cover{border-radius:5px;box-shadow:0 1px 2px #0002,0 5px 10px #0002}
.mv-index .mv-index-feature-grid{padding-bottom:5px;scrollbar-color:color-mix(in srgb,var(--primary) 30%,var(--border)) transparent;scrollbar-width:thin}
.mv-index-genres{gap:6px;padding-block:0}
.mv-index-genre{box-shadow:none!important;border-radius:5px!important;border-color:var(--border);background:color-mix(in srgb,var(--card) 80%,var(--background));font-size:10px;font-weight:600;padding:5px 9px}
.mv-index-genre:hover{border-color:var(--primary);background:var(--accent);color:var(--accent-foreground)}
.mv-index-genres>.mv-index-genre:first-child{background:var(--foreground);border-color:var(--foreground);color:var(--card)}
:is(.mv-index-updates,.mv-index-popular,.mvp-section,.mva-ledger,.mva-redeem){border-top:1px solid var(--border)!important;border-radius:9px;box-shadow:var(--mv-shadow-sm)}
:is(.mv-index-section-head>h2,.mv-index-tags h2,.mvp-section-heading h2,.mvd-directory-heading h2){font:750 14px/1.45 var(--mv-ui-font);letter-spacing:-.03em}
.mv-index-updates>.mv-index-section-head,.mv-index-popular>.mv-index-section-head{padding-bottom:10px;border-bottom:1px solid var(--border);margin-bottom:0}
.mv-index-update{padding-block:10px;border-color:color-mix(in srgb,var(--border) 65%,transparent);border-radius:0}
.mv-index-update:hover{background:var(--accent)}
.mv-index-update-copy strong{font-size:11px;line-height:1.5;font-weight:650}
.mv-index-update-copy>span{font-size:10px;line-height:1.5}
.mv-index-popular ol{counter-reset:ranking}
.mv-index-popular ol>a,.mv-index-popular li>a{border-color:color-mix(in srgb,var(--border) 65%,transparent)}
.mv-index-rank{font-family:var(--mv-display);font-size:18px;font-weight:500;color:var(--mv-gold)}
.mv-index-collection{border-radius:8px;border-color:var(--border);background:var(--card);box-shadow:var(--mv-shadow-sm);padding:11px}
.mv-index-collection:nth-child(2){background:linear-gradient(115deg,color-mix(in srgb,var(--mv-rose) 5%,var(--card)),var(--card))}
.mv-index-collection:nth-child(3){background:linear-gradient(115deg,color-mix(in srgb,var(--mv-mint) 5%,var(--card)),var(--card))}
.mv-index-collection h3{font-family:var(--mv-display);font-weight:550;font-size:13px;letter-spacing:-.025em}
.mv-index-tags{border-radius:9px;box-shadow:none;border:1px solid var(--border)}
/* Small, useful personal entry point. No new shelf state or progress calculation. */
.mv-home-return{display:flex;align-items:center;gap:13px;border:1px solid var(--border);border-left:2px solid var(--mv-mint);border-radius:8px;background:var(--card);padding:8px 10px;min-width:0;box-shadow:var(--mv-shadow-sm)}
.mv-home-return-label{display:flex;align-items:center;gap:7px;flex:0 0 160px;min-width:0}
.mv-home-return-label>span:first-child{font-size:24px;color:var(--mv-mint);line-height:1}
.mv-home-return-label>span:last-child{display:flex;flex-direction:column;gap:4px}
.mv-home-return-label strong{font-size:10px;font-weight:750;line-height:1.5}
.mv-home-return-label small{font-size:9px;color:var(--muted-foreground);line-height:1.5}
.mv-home-return-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex:1;min-width:0}
.mv-home-return-story{display:flex;align-items:center;gap:9px;min-width:0;border-left:1px solid var(--border);padding:3px 8px;min-height:49px;border-radius:0 5px 5px 0}
.mv-home-return-story:hover{background:var(--accent)}
.mv-home-return-story:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
.mv-home-return-cover{position:relative;isolation:isolate;display:block;width:30px;height:45px;flex:0 0 30px;overflow:hidden;border-radius:3px;background:var(--accent);box-shadow:0 1px 3px #0002}
.mv-home-return-cover>span{position:absolute;inset:4px;font-size:6px;line-height:1.3;overflow:hidden;overflow-wrap:anywhere;color:var(--accent-foreground)}
.mv-home-return-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mv-home-return-copy{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.mv-home-return-copy strong{font-size:10px;line-height:1.5;font-weight:650;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mv-home-return-copy small{font-size:9px;line-height:1.4;color:var(--muted-foreground)}
.mv-home-return-arrow{font-size:17px;color:var(--primary);flex-shrink:0}
/* Working rails are lighter than content. Selection is a deliberate ink tab. */
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs,.mv-series-tabs){border-radius:7px;background:var(--mv-inset);box-shadow:none;border-color:var(--border);gap:3px;padding:3px}
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs,.mv-series-tabs)>:is(button,a){border-radius:4px;min-height:30px!important;font-size:10px;font-weight:650}
:is(.mva-tabs,.mvp-navigation,.mve-page-tabs)>:is(button,a):is([aria-current=page],[aria-selected=true],.is-active),#root main .mv-series-tabs button[aria-selected=true]{background:var(--card)!important;color:var(--primary)!important;border-color:color-mix(in srgb,var(--primary) 30%,var(--border))!important;box-shadow:inset 0 -2px var(--primary),0 1px 3px #00000008}
:is(.mve-filter-rail,.mva-library .mva-shelves,.mww-toolbar,.mvd-utility){border-radius:8px;box-shadow:none;background:var(--card)}
:is(.mve-search,.mvc-search,.mva-toolbar>input,.mvs-input-wrap,.mvs-filter-grid select){border-radius:6px;background:var(--mv-inset);box-shadow:inset 0 1px 2px #00000004}
:is(.mve-book-cards,.mve-shelf,.mww-item,.mvp-collection,.mva-collections .mv-library-collection){border-radius:9px;border-color:var(--border);background:var(--card);box-shadow:var(--mv-shadow-sm)}
:is(.mve-book-cards,.mve-shelf,.mww-item,.mvp-collection,.mva-collections .mv-library-collection):hover{border-color:color-mix(in srgb,var(--primary) 55%,var(--border));box-shadow:var(--mv-shadow-md)}
.mve-community .mve-shelf{border-top:1px solid var(--border);background:var(--card)}
.mve-community .mve-shelf:nth-child(3n+2),.mve-community .mve-shelf:nth-child(3n){border-top-color:var(--border);background:var(--card)}
.mvd-card-heading h2,.mvd-card-heading h3{font-family:var(--mv-display);font-weight:550;font-size:17px;letter-spacing:-.035em;line-height:1.45}
.mvd-featured{background:color-mix(in srgb,var(--mv-gold) 11%,var(--card));color:var(--mv-gold);border:1px solid color-mix(in srgb,var(--mv-gold) 25%,var(--border))}
.mvd-card-footer{background:var(--mv-inset);border-color:var(--border)}
.mva-library .mva-library-grid:not(.mva-library-list) .mva-library-book{background:var(--card);box-shadow:var(--mv-shadow-sm);border-radius:7px}
.mva-library .mva-book-status{border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent);padding-bottom:3px;margin-bottom:3px}
.mva-library .mva-book-status .mva-save[data-saved=true]{background:transparent!important;color:var(--primary)!important;border-color:transparent!important;box-shadow:none}
.mva-library .mva-book-status .mva-save[data-saved=true]:hover{background:var(--accent)!important}
.mva-library .mva-book-title{font-size:11px;line-height:1.5;min-height:3em}
.mva-library-list .mva-book-title{min-height:0}
.mva-library .mva-shelves button[aria-pressed=true]{background:var(--accent);color:var(--accent-foreground);box-shadow:inset 2px 0 var(--primary)}
.mva-library .mva-shelves button[aria-pressed=true] span{background:var(--card)}
.mva-collections .mv-library-collection h2{font-family:var(--mv-display);font-size:15px;letter-spacing:-.025em}
/* Story identity gets a quiet night-sky plane, not a larger poster. */
.mv-series-intro{position:relative;z-index:30;isolation:isolate;border-radius:10px;background:radial-gradient(ellipse 400px 170px at 95% 0,#e5c68d08,transparent),linear-gradient(110deg,var(--mv-hero-base),var(--mv-hero-end));border-color:#d9d0eb28;box-shadow:inset 0 1px #ffffff14,var(--mv-shadow-sm)}
#root main .mv-series-titleline h1{font-family:var(--mv-display);font-weight:550;letter-spacing:-.035em;font-size:25px!important;line-height:1.35}
.mv-series-metrics{border-color:#ffffff1c}
.mv-series-metrics dd{font-family:var(--mv-ui-font);font-weight:750}
.mv-series .mv-story-actions>a:first-child{background:var(--mv-moon)!important;border-color:var(--mv-moon)!important;color:#31291b!important;box-shadow:inset 0 1px #ffffff40,0 2px 5px #0002}
.mv-series .mv-story-actions>a:first-child:hover{background:#f3dba8!important;color:#31291b!important}
.mv-series .mv-series-genres a{border-color:#ffffff26;border-radius:4px;background:#ffffff08;color:var(--mv-hero-accent)}
.mv-series-aside>section{border-radius:7px;box-shadow:none;border-color:var(--border);background:var(--card)}
.mvc-catalog{border-radius:8px;box-shadow:var(--mv-shadow-sm);overflow:hidden}
.mvc-toolbar{background:var(--mv-inset);border-color:var(--border)}
.mvc-group-toggle{background:var(--card);box-shadow:inset 3px 0 color-mix(in srgb,var(--primary) 65%,var(--border))}
.mvc-row{background:var(--card)}
.mvc-row:nth-child(even){background:color-mix(in srgb,var(--mv-inset) 40%,var(--card))}
.mvc-row:hover{background:var(--accent)}
.mvc-row.is-current{box-shadow:inset 3px 0 var(--mv-mint)}
.mvc-index-panel{border-radius:9px}
.mv-talk-list>.mv-talk-item{border-radius:7px;box-shadow:none;background:var(--card);border-color:var(--border)}
.mv-talk-composer{border-radius:8px;box-shadow:var(--mv-shadow-sm);border-top:1px solid var(--border)}
.mv-talk-review-overview{background:var(--card);border-radius:8px;box-shadow:none}
.mv-talk-replies{border-left:1px solid color-mix(in srgb,var(--primary) 50%,var(--border));padding-left:10px}
.mv-talk-action{border-radius:4px}
.mv-talk-list>.mv-talk-item:hover{border-color:color-mix(in srgb,var(--primary) 30%,var(--border))}
/* Account surfaces carry less decoration; personal artwork remains the accent. */
.mvp-identity{border-radius:10px;box-shadow:var(--mv-shadow-sm)}
.mvp-banner::after{background:linear-gradient(95deg,#111c2bb8,#34304740),url('./moonverse-atmosphere.svg') right center/auto 150px}
.mvp-stats{background:var(--mv-inset);box-shadow:none}
.mvp-section{border-radius:8px;box-shadow:var(--mv-shadow-sm)}
.mvp-section-heading{border-bottom:1px solid var(--border);padding-bottom:8px;margin-bottom:10px}
.mvp-profile .mvp-goal{background:var(--mv-inset);border:0;border-radius:6px}
.mvp-profile .mvp-goal strong{font-family:var(--mv-display);font-weight:500;font-size:32px}
.mvp-profile .mvp-wallet-section{border-radius:8px;box-shadow:var(--mv-shadow-sm)}
.mvp-profile .mvp-wallet-topup{background:linear-gradient(105deg,color-mix(in srgb,var(--primary) 7%,var(--card)),var(--card))}
.mvp-profile .mvp-reading-progress{background:transparent}
.mva-wallet-summary>div{border-radius:8px;box-shadow:var(--mv-shadow-sm);background:var(--card)}
.mva-pass{border-radius:9px;background:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--mv-gold) 7%,transparent),transparent 60%),var(--card);box-shadow:var(--mv-shadow-sm)}
.mva-pass h2{font-family:var(--mv-display);font-size:25px;font-weight:550}
.mva-pass-seal{background:var(--primary);color:var(--primary-foreground)}
.mva-membership .mva-edition-library{border-radius:9px;box-shadow:var(--mv-shadow-sm)}
.mva-membership .mva-edition-heading{background:var(--card)}
.mva-membership .mva-letter-group h3>span{font-family:var(--mv-display);font-weight:550;font-size:19px;background:transparent;color:var(--primary)}
.mva-membership .mva-alphabet{background:var(--mv-inset)}
.mva-membership .mva-alphabet button:not(:disabled){box-shadow:inset 0 -2px var(--primary);background:var(--card)}
.mva-membership .mva-alphabet button:not(:disabled):hover{color:var(--primary-foreground);background:var(--primary)}
.mva-membership .mva-edition-story{border-color:color-mix(in srgb,var(--border) 75%,transparent)}
.mva-membership .mva-edition-state.is-owned{color:var(--mv-mint);background:transparent;padding-inline:0}
.mva-membership .mva-ledger,.mva-membership .mva-redeem{border-radius:8px;box-shadow:var(--mv-shadow-sm)}
.mva-topup-sheet .mva-packs>button{border-radius:6px;box-shadow:none}
.mva-topup-sheet .mva-packs>button[aria-pressed=true]{box-shadow:inset 0 -3px var(--primary);background:var(--accent);border-color:var(--primary)}
.mva-topup-sheet .mva-pack-label{border-radius:3px;background:transparent;color:var(--muted-foreground)}
/* Menus and dialogs feel like tools with a quiet surface and a strong hierarchy. */
:is(.mva-dialog,.mvs-dialog,.mvp-dialog,.mve-drawer,.mvc-index-panel,.mvr-panel,.mv-talk-drawer){border-radius:10px;border-color:var(--border);box-shadow:0 0 0 1px var(--mv-edge),var(--mv-shadow-lg)}
:is(.mva-dialog>header,.mvp-dialog-heading,.mve-drawer-heading,.mvr-panel-heading,.mvc-index-heading){background:var(--mv-inset);box-shadow:none}
.mvn-menu>header{background:linear-gradient(110deg,var(--mv-hero-base),var(--mv-hero-end));border-bottom:1px solid #ffffff20}
.mvn-menu>.mva-dialog-body{background:var(--popover)}
.mvn-destinations>a,.mvn-more nav>a{border-radius:6px;box-shadow:none;background:var(--card);min-height:40px}
.mvn-destinations>a>svg{border:1px solid var(--border);background:var(--mv-inset);color:var(--primary);border-radius:5px;padding:5px;box-sizing:content-box}
.mvn-destinations>a[aria-current=page]{background:var(--accent);border-color:color-mix(in srgb,var(--primary) 35%,var(--border));color:var(--accent-foreground);box-shadow:inset 2px 0 var(--primary)}
.mvn-destinations>a[aria-current=page]>svg{background:var(--card);color:var(--primary)}
.mvn-themes>div,.mvs-modes,.mvs-scopes{border-radius:6px;box-shadow:none;background:var(--mv-inset)}
.mvn-themes button[aria-pressed=true],.mvs-modes button[aria-pressed=true],.mvs-scopes button[aria-pressed=true]{background:var(--card);color:var(--primary);box-shadow:inset 0 -2px var(--primary),0 1px 3px #00000008}
.mvs-header h2{font-family:var(--mv-ui-font)!important;font-weight:750!important}
.mvs-input-wrap{border-radius:7px;min-height:42px}
.mvs-result{border-radius:6px}
.mvs-result:hover,.mvs-result:focus-visible{background:var(--accent);border-color:transparent}
.mvs-advanced{background:var(--mv-inset);border-radius:6px;border:1px solid var(--border)}
.mva-notification-list>article[data-read=false]{background:color-mix(in srgb,var(--primary) 6%,var(--card));border-left:2px solid var(--primary)}
/* Reader format preferences remain authoritative; only its tools receive this treatment. */
.mvr-topbar{background:color-mix(in srgb,var(--card) 96%,transparent);box-shadow:0 1px 0 var(--mv-edge)}
.mvr-chapter-header{border-bottom:1px solid var(--border);padding-bottom:14px}
.mvr-reader .mvr-chapter-header h1{font-family:var(--mv-display);font-weight:550;letter-spacing:-.03em}
.mvr-breadcrumb{font-size:10px;color:var(--muted-foreground)}
.mvr-dock-controls{background:var(--popover);border-color:var(--border);border-radius:10px;box-shadow:inset 0 1px var(--mv-edge),0 4px 10px #00000020,0 10px 30px #00000030}
.mvr-dock-controls .mvr-dock-index{border-radius:5px;background:var(--primary)!important;color:var(--primary-foreground)!important}
.mvr-reader .mvr-dock-controls :is(a,button)[aria-pressed=true]:not(.mvr-dock-index){background:var(--accent);color:var(--accent-foreground)}
.mrx-bar{background:var(--card);border-radius:8px;box-shadow:none}
.mrx-reaction{border-radius:6px;background:var(--mv-inset)}
.mww-dressing-room{background:var(--card);border-radius:9px;box-shadow:var(--mv-shadow-sm)}
.mww-item-preview{background:radial-gradient(ellipse at center,color-mix(in srgb,var(--mwc-a,var(--primary)) 9%,var(--card)),var(--card))}
.mww-item.is-equipped{border-color:var(--primary);box-shadow:inset 0 -3px var(--primary),var(--mv-shadow-sm)}
.mv-rank-table{border-radius:8px;box-shadow:var(--mv-shadow-sm);overflow:hidden}
.mv-rank-table-head{background:var(--mv-inset)}
.mv-rank-row.is-top{background:linear-gradient(90deg,color-mix(in srgb,var(--mv-gold) 7%,var(--card)),var(--card))}
.mv-rank-row.is-top .mv-rank-number{font-family:var(--mv-display);color:var(--mv-gold);font-weight:550}
#root main .mv-settings-nav{background:var(--mv-inset);box-shadow:none;border:1px solid var(--border);border-radius:8px}
#root main .mv-page :where([class~='bg-card'],[class~='celestial-glass']){background:var(--card);box-shadow:var(--mv-shadow-sm);border-radius:9px}
#root main .mv-page :where([class~='rounded-3xl'],[class~='rounded-2xl']):not(.mwc-avatar):not(.mwc-art){border-radius:10px}
:is(.mve-empty,.mva-empty,.mvp-empty,.mvc-empty,.mvs-empty,.mv-not-found){background:var(--card);border-color:color-mix(in srgb,var(--primary) 35%,var(--border));box-shadow:none;border-radius:8px}
.mv-footer{position:relative;background:var(--mv-inset);box-shadow:none;border-top:1px solid var(--border);padding-block:20px}
.mv-footer-brand>a{font-size:14px;letter-spacing:.12em}
.mv-footer nav a:hover{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 .mv-index-cover,.mve-book-covers .mve-cover{transition:box-shadow .18s,translate .18s}
 .mv-index-book:hover .mv-index-cover,.mve-book-covers:hover .mve-cover{translate:0 -2px;box-shadow:0 3px 5px #0002,0 8px 15px #0002}
}
@media(max-width:1000px){
 .mv-home-return-label{flex-basis:140px}
 .mv-home-return-rows{gap:4px}
 .mv-home-return-story{gap:7px;padding-inline:7px}
}
@media(max-width:767px){
 #root main:not([data-reader=true]){padding-top:13px}
 #root main :is(.mva-heading h1,.mve-title-line h1,.mvd-intro h1,.mww-heading h1,.mv-rank-heading h1){font-size:23px}
 #root main .mv-series-titleline h1{font-size:21px!important;line-height:1.4}
 .mv-index-featured{padding:12px!important}
 #root main .mv-index .mv-index-heading h1{font-size:24px}
 .mv-index .mv-index-heading .mv-home-kicker{font-size:7px}
 .mv-index-tools{gap:7px}
 .mv-index-tools :is(a,button){font-size:9px}
 .mv-index .mv-index-book h2{font-size:10px}
 .mv-home-return{flex-direction:column;align-items:stretch;gap:7px;padding:9px}
 .mv-home-return-label{flex-basis:auto;gap:6px}
 .mv-home-return-label>span:last-child{display:flex;flex-direction:row;align-items:center;gap:8px}
 .mv-home-return-label strong{font-size:10px}
 .mv-home-return-label small{font-size:8px}
 .mv-home-return-label>span:first-child{font-size:18px}
 .mv-home-return-rows{display:flex;overflow-x:auto;scroll-snap-type:x proximity;gap:8px;padding-bottom:2px;scrollbar-width:thin}
 .mv-home-return-story{flex:1 0 min(265px,90%);border:1px solid var(--border);border-radius:6px;padding:6px;scroll-snap-align:start;background:var(--card);min-height:55px}
 .mv-home-return-story:only-child{flex-basis:100%}
 .mv-home-return-copy strong{font-size:10px}
 .mv-home-return-copy small{font-size:9px}
 .mv-home-return-cover{width:28px;height:42px;flex-basis:28px}
 .mvd-card-heading h2,.mvd-card-heading h3{font-size:16px}
 .mva-library .mva-book-title{font-size:10px}
 .mv-index-update{padding-block:9px}
 .mvn-destinations>a{min-height:38px}
}
@media(max-width:420px){
 .mv-index-featured>.mv-index-section-head{align-items:flex-start;gap:8px}
 #root main .mv-index .mv-index-heading h1{font-size:22px}
 .mv-index-tools{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
 .mv-index-tools .mv-index-daily{min-height:26px!important;padding:4px 6px;font-size:8px}
 .mv-index-tools>a{min-height:24px;display:inline-flex;align-items:center;font-size:8px}
 .mv-home-return-label small{display:none}
 .mv-index-genres{gap:5px}
 .mv-index-genre{padding:5px 7px;font-size:9px}
}
@media(pointer:coarse){
 .mva-tabs>button,.mve-page-tabs>a,.mvp-navigation nav>button,.mvn-themes button{min-height:32px!important}
 .mva-membership .mva-alphabet button{min-height:30px!important}
 .mva-library .mva-book-status .mva-save{width:32px;height:32px;min-height:32px!important}
}
@media(prefers-reduced-motion:reduce){.mv-index-cover,.mve-book-covers .mve-cover{transition:none;translate:none}}
/* Saved cover marks use a stable moon-gold state over unpredictable artwork. */
.mva-save.mva-save-cover{background:#1c2333e8!important;color:#fffaf0!important;border-color:#ffffff66!important;box-shadow:0 1px 4px #0003}
.mva-save.mva-save-cover[data-saved=true]{background:#e5c68d!important;color:#2f2930!important;border-color:#f4dfb8!important}
.mva-save.mva-save-cover:hover{background:#303a51!important;color:#fffaf0!important;box-shadow:0 0 0 2px #ffffff70}
.mva-save.mva-save-cover[data-saved=true]:hover{background:#f2d9aa!important;color:#2f2930!important}
img[hidden],[hidden]{display:none!important}
@media(max-width:639px){.mva-membership .mva-alphabet>div{grid-template-columns:repeat(9,minmax(24px,1fr))}}
.mvp-navigation nav button[aria-current=page],.mvp-navigation nav button[aria-current=page]:hover{background:var(--card);color:var(--primary);border-color:color-mix(in srgb,var(--primary) 30%,var(--border));box-shadow:inset 0 -2px var(--primary),0 1px 3px #00000008}
.mv-index .mv-index-rank{width:24px;min-width:24px;white-space:nowrap;overflow-wrap:normal;line-height:1.2;font-variant-numeric:tabular-nums}

/* Light palettes keep neutral reading surfaces without atmospheric color washes. */
:root.light body::before,:root.theme-light body::before,:root.theme-sepia body::before{opacity:0}
:root.light .mva-pass,:root.theme-light .mva-pass,:root.theme-sepia .mva-pass{background:var(--card)}
:root.light .mva-wallet-links>section,:root.theme-light .mva-wallet-links>section,:root.theme-sepia .mva-wallet-links>section{background:var(--card)}

/* Story reading shelf modal & dialog safety */
.mv-series-intro { position: relative; z-index: 30; }
.mva-dialog.mva-save-dialog {
  max-width: 380px;
  width: min(380px, calc(100vw - 24px));
  border-radius: 14px;
}
.mva-save-dialog .mva-shelf-options > button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 8px;
  transition: all 0.15s ease;
}
.mva-save-dialog .mva-shelf-options > button:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 1px;
}

/* Notification popover scroll containment and bottom clearance */
.mva-notification-list {
  padding-bottom: 12px;
}
.mva-notification-list > article:last-child {
  border-bottom: none;
}

/* Accessible touch targets across all viewports (WCAG 2.5.5 / 2.5.8 compliant) */
.mv-footer nav a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 0;
}
.mv-footer-bottom a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 2px 0;
}
.mv-footer-brand > a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
}
.mve-book h2 a,
.mve-book-list h2 a {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
}
.mvd-themes > a {
  min-height: 28px;
  padding: 3px 8px;
}
.mv-series-byline > a {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 2px 6px;
  border-radius: 4px;
}
.mv-series-breadcrumb a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 6px;
  border-radius: 4px;
}
.mv-series-genres a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 26px;
  padding: 2px 8px;
  border-radius: 4px;
}
.mv-series-section-title a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 2px 6px;
  border-radius: 4px;
}
.mve-discover-footnote a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 2px 6px;
  border-radius: 4px;
}
.mvr-series-link {
  min-height: 32px;
  padding: 2px 4px;
  border-radius: 6px;
}
.mvr-after-actions :is(button, a) {
  min-height: 28px !important;
  display: inline-flex;
  align-items: center;
  padding: 2px 6px;
  border-radius: 4px;
}
.mva-library-book-copy .mva-between a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 2px 6px;
  border-radius: 4px;
}
.mvp-profile .mvp-story-title {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
}
.mva-heading > a,
.mva-heading-links > a,
.mww-balances > a,
.mva-wallet-links section > a,
.mva-edition-title h4 a {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 2px 6px;
  border-radius: 4px;
}
.mv-talk-spoiler-check,
.mww-motion {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.mv-talk-spoiler-check input,
.mww-motion input {
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
}

/* Safe-area insets & Mobile Navigation layout polish */
.safe-bottom,
#root nav[aria-label="Mobile"] {
  padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px)) !important;
}

@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .mvr-reader {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
  .mvr-dock {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

.mvr-topbar {
  padding-top: max(6px, env(safe-area-inset-top, 0px)) !important;
}

.mvr-panel-heading {
  padding-top: max(12px, env(safe-area-inset-top, 0px)) !important;
}

.mvr-settings-body,
.mvr-tools-body,
.mvr-issue {
  padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
}

@media (max-width: 479px) {
  .mvs-dialog {
    inset: max(8px, env(safe-area-inset-top, 0px)) 0 auto;
    width: calc(100vw - 16px);
    max-height: calc(100dvh - max(16px, calc(env(safe-area-inset-top, 0px) + env(safe-area-inset-bottom, 0px) + 8px)));
  }
  .mvs-footer {
    padding-bottom: max(4px, env(safe-area-inset-bottom, 0px));
  }
  .mxf-inspector {
    max-height: calc(100dvh - max(24px, calc(env(safe-area-inset-top, 0px) + env(safe-area-inset-bottom, 0px))));
  }
}

@media (max-width: 639px) {
  .mvc-overlay {
    padding-top: max(10px, env(safe-area-inset-top, 0px));
    padding-bottom: max(10px, env(safe-area-inset-bottom, 0px));
  }
}


/* === Layer: moonverse-modern-subtle.css === */
/* Moonverse / Modern Subtle Design System — Master Edition v6
   Comprehensive, cohesive, stylish, compact, and subtle visual architecture across ALL pages and aspects of the site.
   - Zero bold/harsh outlines on entry fields (inputs, textareas, selects, search bars).
   - Standardized 1px subtle borders, dual-layer ambient lighting, and delicate glassmorphism.
   - Refined typography hierarchies, tabular-nums for stats, micro-badges, and compact segmented controls.
   - Complete card and surface coverage: Home (.mv-index-book, .mv-index-featured, .mv-home-return-story),
     Browse (.mve-book, .mve-toolbar), Story Detail (.mv-series-intro, .mv-series-panel, .mv-notes-pair),
     Library (.mva-library-book), Profile (.mvp-identity, .mvp-section, .mvp-reading-row),
     Bazaar (.mww-item), Reader (.lunaria-dock-bar), and Community (.mv-community-grid, .mv-thread-card, .mv-sidebar-card).
   - Seamless cohesion across Dark Obsidian, Light Alabaster, Sepia Parchment, and Midnight Sky themes.
*/

/* ==========================================================================
   1. GLOBAL SMOOTHING, OPTICAL NUMERICS & BASE CANVAS
   ========================================================================== */

/* C10: serif token referenced below (reader/explore headings) but never defined;
   declared once so every var(--mv-font-serif) consumer resolves deliberately. */
html {
  --mv-font-serif: "Cinzel", "Playfair Display", Georgia, serif;
}

html, body {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

/* Tabular numerals for stats, dates, scores, chapter counts to prevent layout jitter */
.mv-badge,
.mve-score,
.mv-badge-rating,
.mv-meta-chip,
.mve-meta-chip,
.mva-meta-chip,
.mv-coins-badge,
.mv-sidebar-card span,
.mv-thread-card span,
.mve-book-stats,
.mva-reading-progress,
[data-tabular="true"] {
  font-variant-numeric: tabular-nums !important;
}

/* ==========================================================================
   2. UNIVERSAL ENTRY FIELDS: Zero Bold Outlines & Subtle Ambient Focus
   ========================================================================== */

:is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not(.mvs-input-wrap input),
  textarea,
  select,
  .mvs-input-wrap,
  .mva-redeem input,
  .mv-conversation textarea,
  .mve-search-input,
  .mvr-input,
  .mva-toolbar input,
  .mve-toolbar input
) {
  outline: none !important;
  outline-offset: 0 !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-color: color-mix(in srgb, var(--border) 60%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 60%, transparent) !important;
  transition: border-color 0.18s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.18s cubic-bezier(0.16, 1, 0.3, 1),
              background-color 0.18s ease !important;
  -webkit-appearance: none;
  appearance: none;
}

/* Focused state: subtle border tint with soft, low-contrast ambient halo */
:is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not(.mvs-input-wrap input),
  textarea,
  select,
  .mvs-input-wrap,
  .mva-redeem input,
  .mv-conversation textarea,
  .mve-search-input,
  .mvr-input,
  .mva-toolbar input,
  .mve-toolbar input
):focus,
:is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not(.mvs-input-wrap input),
  textarea,
  select,
  .mvs-input-wrap,
  .mva-redeem input,
  .mv-conversation textarea,
  .mve-search-input,
  .mvr-input,
  .mva-toolbar input,
  .mve-toolbar input
):focus-within,
:is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not(.mvs-input-wrap input),
  textarea,
  select,
  .mvs-input-wrap,
  .mva-redeem input,
  .mv-conversation textarea,
  .mve-search-input,
  .mvr-input,
  .mva-toolbar input,
  .mve-toolbar input
):focus-visible {
  outline: none !important;
  outline-offset: 0 !important;
  border-color: color-mix(in srgb, var(--primary) 75%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent),
              0 1px 2px rgba(0, 0, 0, 0.04) !important;
  background-color: color-mix(in srgb, var(--card) 90%, transparent) !important;
}

/* Subtle placeholder styling */
::placeholder {
  color: color-mix(in srgb, var(--muted-foreground) 75%, transparent) !important;
  font-weight: 400;
}

/* Interactive elements: clean, non-chunky focus-visible rings */
:where(a, button, summary, [role="tab"], [role="switch"]):focus-visible {
  outline: 1.5px solid color-mix(in srgb, var(--ring, var(--primary)) 65%, transparent) !important;
  outline-offset: 2px !important;
}

/* Remove default focus outline on mouse clicks */
:where(a, button, [role="tab"]):focus:not(:focus-visible) {
  outline: none !important;
}

/* ==========================================================================
   3. WHOLE-SITE HEADER, NAVBAR & NAVIGATION DOCK
   ========================================================================== */

header.sticky,
.mv-header {
  border-bottom: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background: color-mix(in srgb, var(--background) 88%, transparent) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
}

/* Nav links: sleek rounded pill style */
.mv-header a,
.mv-header button {
  border-radius: 0.5rem !important;
  transition: all 0.15s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Mobile bottom nav dock: sleek floating aesthetic */
nav[aria-label="Mobile"] {
  border-top: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  background: color-mix(in srgb, var(--card) 92%, transparent) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: 0 -4px 20px -2px rgba(0, 0, 0, 0.12) !important;
}

/* Quick search trigger button in header */
.mvs-trigger-btn {
  border-radius: 0.625rem !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  transition: all 0.15s ease !important;
}
.mvs-trigger-btn:hover {
  border-color: color-mix(in srgb, var(--primary) 40%, transparent) !important;
  background: color-mix(in srgb, var(--card) 90%, transparent) !important;
}

/* ==========================================================================
   4. UNIVERSAL CARD & SURFACE ARCHITECTURE ACROSS ALL PAGES
   ========================================================================== */

/* Universal Card Selectors across ALL rooms:
   - Community: .celestial-card, .mv-page-heading, .mv-thread-card, .mv-ann-card, .mv-sidebar-card
   - Home: .mv-index-featured, .mv-index-book, .mv-home-return-story, .mv-index-update, .mv-index-collection
   - Browse & Discover: .mve-card, .mve-book, .mve-trope-card
   - Story Detail: .mv-series-intro, .mv-series-identity, .mv-series-panel, .mv-story-synopsis, .mv-notes-pair, .mv-notes-body
   - Library: .mva-card, .mva-library-book, .mva-collection-card
   - Profile: .mvp-identity, .mvp-section, .mvp-reading-row, .mvp-favorites, .mvp-wallet-section
   - Bazaar: .mww-item, .mv-bazaar-item, .mva-shop-item, .mva-topup-tier
*/
:is(
  .celestial-card,
  .mv-page-heading,
  .mv-index-featured,
  .mv-home-return,
  .mv-index-updates,
  .mv-index-popular,
  .mv-index-tags,
  .mv-index-book,
  .mv-home-return-story,
  .mv-index-update,
  .mv-index-collection,
  .mve-card,
  .mve-book,
  .mve-trope-card,
  .mv-series-intro,
  .mv-series-panel,
  .mv-story-synopsis,
  .mv-notes-pair,
  .mv-notes-body,
  .mva-card,
  .mva-library-book,
  .mva-collection-card,
  .mvp-identity,
  .mvp-section,
  .mvp-reading-row,
  .mvp-favorites,
  .mvp-wallet-section,
  .mww-item,
  .mv-bazaar-item,
  .mva-shop-item,
  .mva-topup-tier,
  .mv-thread-card,
  .mv-ann-card,
  .mv-sidebar-card
) {
  border-width: 1px !important;
  border-style: solid !important;
  border-color: color-mix(in srgb, var(--border) 40%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 65%, transparent) !important;
  backdrop-filter: blur(14px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(180%) !important;
  border-radius: 0.875rem !important; /* Standard 14px radius */
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05),
              0 1px 3px rgba(0, 0, 0, 0.03),
              0 4px 14px -3px rgba(0, 0, 0, 0.04) !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.2s ease,
              box-shadow 0.2s ease,
              background-color 0.2s ease !important;
}

/* Universal Hover Elevation on Interactive Cards */
:is(
  .mv-index-book,
  .mv-home-return-story,
  .mv-index-collection,
  .mve-card,
  .mve-book,
  .mva-card,
  .mva-library-book,
  .mva-collection-card,
  .mvp-reading-row,
  .mww-item,
  .mv-bazaar-item,
  .mva-shop-item,
  .mva-topup-tier,
  .mv-thread-card,
  .mv-ann-card,
  .mv-sidebar-card:hover,
  .hover-lift
):hover {
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border)) !important;
  background-color: color-mix(in srgb, var(--card) 85%, transparent) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),
              0 8px 24px -4px rgba(0, 0, 0, 0.1),
              0 14px 32px -6px rgba(0, 0, 0, 0.06) !important;
}

/* Major Room Containers: 16px radius */
.mv-index-featured,
.mv-page-heading,
.mv-series-intro,
.mvp-identity {
  border-radius: 1rem !important;
}

/* Novel Cover Image Framing */
:is(
  .mv-index-cover img,
  .mve-cover img,
  .mve-cover-wrap img,
  .mv-story-card img,
  .mva-cover img,
  .mva-library-covers img,
  .mv-cover img,
  .mvp-cover img
) {
  border-radius: 0.625rem !important; /* 10px cover radius */
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  box-shadow: 0 2px 8px -1px rgba(0, 0, 0, 0.12) !important;
}

/* ==========================================================================
   5. TYPOGRAPHY HIERARCHIES, EYEBROWS & MICRO-BADGES
   ========================================================================== */

/* Universal Eyebrow labels */
.mv-eyebrow,
.mva-eyebrow,
.mve-eyebrow,
.mvp-eyebrow {
  font-size: 0.625rem !important; /* 10px */
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--muted-foreground) !important;
}

/* Badges: subtle, delicate, non-garish */
.mv-badge,
.mve-badge,
.mva-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem !important; /* 11px */
  font-weight: 700;
  padding: 0.125rem 0.4375rem !important;
  border-radius: 0.375rem !important;
  border-width: 1px;
  border-style: solid;
  line-height: 1.3;
  letter-spacing: 0.01em;
}

/* Micro metadata chips */
.mv-meta-chip,
.mve-meta-chip,
.mva-meta-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  font-weight: 500;
}

/* Micro rating badges */
.mv-badge-rating,
.mve-score {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  padding: 0.125rem 0.375rem !important;
  border-radius: 0.375rem !important;
  background: color-mix(in srgb, var(--card) 90%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
}

/* ==========================================================================
   6. INTERACTIVE CONTROLS, SEGMENTED BARS & BUTTONS
   ========================================================================== */

/* Segmented Control Containers (Tabs, Filter Bars across ALL rooms) */
div[role="tablist"],
.mv-segmented-bar,
.mva-tabs,
.mva-shelves-nav,
.mve-status-tabs,
.mvp-navigation,
.mv-settings-nav {
  padding: 3px !important;
  border-radius: 0.75rem !important;
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
}

div[role="tablist"] button[role="tab"],
.mv-segmented-bar button,
.mva-tabs button,
.mve-status-tabs button,
.mvp-navigation button,
.mv-settings-nav button {
  height: 2.25rem !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  border-radius: 0.625rem !important;
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer;
}

div[role="tablist"] button[role="tab"][aria-selected="true"],
.mv-segmented-bar button.is-active,
.mva-tabs button.is-active,
.mve-status-tabs button[aria-pressed="true"],
.mv-settings-nav button.active {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08), 0 4px 10px -2px rgba(0, 0, 0, 0.06) !important;
}

/* Universal Button Polish */
.mv-button-primary,
button.btn-primary,
.mva-primary {
  border-radius: 0.625rem !important;
  font-weight: 700 !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.01em !important;
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.mv-button-primary:hover,
button.btn-primary:hover,
.mva-primary:hover {
  transform: translateY(-0.5px);
  box-shadow: 0 4px 12px -2px rgba(var(--primary-rgb, 99, 102, 241), 0.35) !important;
}

/* Progress indicator on cards across all rooms */
.mv-progress-bar,
.mva-progress-bar,
.mva-reading-progress,
.mvp-reading-progress {
  height: 3px !important;
  border-radius: 9999px !important;
  background: color-mix(in srgb, var(--muted) 80%, transparent) !important;
  overflow: hidden;
}
.mv-progress-fill,
.mva-progress-fill,
.mva-reading-progress > div,
.mvp-reading-progress > div {
  height: 100% !important;
  border-radius: 9999px !important;
  background: linear-gradient(to right, var(--primary), color-mix(in srgb, var(--primary) 70%, #38bdf8)) !important;
}

/* ==========================================================================
   7. ROOM-SPECIFIC WIDTHS & CANVAS ALIGNMENT
   ========================================================================== */

/* Ensure all rooms fill the standard 1276px <main> container width seamlessly */
.mv-index,
.mve-explore,
.mv-series,
.mva-library,
.mvp-profile,
.mv-page-community,
.mv-settings-workspace,
.mv-bazaar,
.mv-membership {
  width: 100% !important;
  max-width: 100% !important;
}

/* ==========================================================================
   8. COMMUNITY PAVILION: Master Architectural & Aesthetic Overhaul
   ========================================================================== */

/* 1. Page Canvas & Layout */
#root main .mv-page-community,
.mv-page-community {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 16px 80px 16px !important;
  box-sizing: border-box !important;
}

@media (min-width: 768px) {
  #root main .mv-page-community,
  .mv-page-community {
    padding: 0 24px 90px 24px !important;
  }
}

.mv-community-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1.25rem !important;
  align-items: start !important;
  width: 100% !important;
}

.mv-community-main {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  width: 100% !important;
}

.mv-community-sidebar {
  display: none !important;
  flex-direction: column !important;
  gap: 1rem !important;
  flex-shrink: 0 !important;
  width: 100% !important;
}

@media (min-width: 1024px) {
  .mv-community-grid {
    grid-template-columns: minmax(0, 1fr) 340px !important;
    gap: 1.75rem !important;
  }
  .mv-community-sidebar {
    display: flex !important;
    position: sticky !important;
    top: 5rem !important;
  }
}

@media (min-width: 1280px) {
  .mv-community-grid {
    grid-template-columns: minmax(0, 1fr) 360px !important;
    gap: 2rem !important;
  }
}

/* 2. Hero Header Banner (.mv-page-heading) */
#root main .mv-page-community .mv-page-heading,
.mv-page-community .mv-page-heading {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  padding: 24px 28px !important;
  border-radius: 16px !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) linear-gradient(115deg, color-mix(in srgb, var(--primary) 8%, var(--card)), var(--card)) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  border-left: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important; /* overrides legacy 3px border */
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 4px 20px -4px rgba(0, 0, 0, 0.15) !important;
  margin-bottom: 20px !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

@media (min-width: 640px) {
  #root main .mv-page-community .mv-page-heading,
  .mv-page-community .mv-page-heading {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
}

/* Ambient celestial glow in top right */
#root main .mv-page-community .mv-page-heading::after,
.mv-page-community .mv-page-heading::after {
  content: "" !important;
  position: absolute !important;
  top: -50px !important;
  right: -50px !important;
  width: 240px !important;
  height: 240px !important;
  background: radial-gradient(circle, color-mix(in srgb, var(--primary) 14%, transparent) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

/* Title h1 with Cinzel / Playfair serif typography */
#root main .mv-page-community .mv-page-heading h1,
.mv-page-community .mv-page-heading h1 {
  font-family: Cinzel, "Playfair Display", Georgia, serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
  color: var(--foreground) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

@media (min-width: 768px) {
  #root main .mv-page-community .mv-page-heading h1,
  .mv-page-community .mv-page-heading h1 {
    font-size: 28px !important;
  }
}

#root main .mv-page-community .mv-page-heading h1 svg,
.mv-page-community .mv-page-heading h1 svg {
  width: 22px !important;
  height: 22px !important;
  color: var(--primary) !important;
  flex-shrink: 0 !important;
}

/* Subtitle */
#root main .mv-page-community .mv-page-heading p,
.mv-page-community .mv-page-heading p {
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: var(--muted-foreground) !important;
  margin: 4px 0 0 0 !important;
  max-width: 600px !important;
}

/* Action Button ("New Thread" / "Post Announcement") */
#root main .mv-page-community .mv-page-heading button,
.mv-page-community .mv-page-heading button {
  height: 38px !important;
  border-radius: 9999px !important;
  padding: 0 18px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border: none !important;
  box-shadow: 0 2px 10px -2px color-mix(in srgb, var(--primary) 45%, transparent) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

#root main .mv-page-community .mv-page-heading button:hover,
.mv-page-community .mv-page-heading button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 16px -2px color-mix(in srgb, var(--primary) 55%, transparent) !important;
  filter: brightness(1.06) !important;
}

#root main .mv-page-community .mv-page-heading button:active,
.mv-page-community .mv-page-heading button:active {
  transform: translateY(0) !important;
}

/* 3. Section Tabs Navigation (iOS/macOS Segmented Track) */
#root main .mv-page-community [role="tablist"],
.mv-page-community [role="tablist"],
#root main .mv-page-community .grid.grid-cols-3,
.mv-page-community .grid.grid-cols-3 {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  padding: 4px !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  gap: 4px !important;
  margin-bottom: 20px !important;
}

#root main .mv-page-community [role="tablist"] [role="tab"],
.mv-page-community [role="tablist"] [role="tab"] {
  height: 38px !important;
  border-radius: 9px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 0 12px !important;
  background: transparent !important;
  color: var(--muted-foreground) !important;
  border: 1px solid transparent !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  user-select: none !important;
}

#root main .mv-page-community [role="tablist"] [role="tab"]:hover,
.mv-page-community [role="tablist"] [role="tab"]:hover {
  color: var(--foreground) !important;
  background: color-mix(in srgb, var(--card) 50%, transparent) !important;
}

#root main .mv-page-community [role="tablist"] [role="tab"][aria-selected="true"],
.mv-page-community [role="tablist"] [role="tab"][aria-selected="true"] {
  background: color-mix(in srgb, var(--primary) 18%, var(--card)) !important;
  color: var(--primary) !important;
  font-weight: 700 !important;
  border-color: color-mix(in srgb, var(--primary) 45%, transparent) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12) !important;
}

#root main .mv-page-community [role="tablist"] [role="tab"] svg,
.mv-page-community [role="tablist"] [role="tab"] svg {
  width: 15px !important;
  height: 15px !important;
  flex-shrink: 0 !important;
}

/* Badges inside tab buttons */
#root main .mv-page-community [role="tablist"] [role="tab"] span:last-child,
.mv-page-community [role="tablist"] [role="tab"] span:last-child {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  padding: 1px 6px !important;
  border-radius: 9999px !important;
  line-height: 1 !important;
}

#root main .mv-page-community [role="tablist"] [role="tab"][aria-selected="true"] span:last-child,
.mv-page-community [role="tablist"] [role="tab"][aria-selected="true"] span:last-child {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
}

#root main .mv-page-community [role="tablist"] [role="tab"][aria-selected="false"] span:last-child,
.mv-page-community [role="tablist"] [role="tab"][aria-selected="false"] span:last-child {
  background: color-mix(in srgb, var(--muted) 70%, transparent) !important;
  color: var(--muted-foreground) !important;
}

/* 4. Category Tags & Search Toolbar */
#root main .mv-page-community .mva-ann-toolbar,
.mv-page-community .mva-ann-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
  flex-wrap: nowrap !important;
}

#root main .mv-page-community .mva-ann-tags,
.mv-page-community .mva-ann-tags {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  flex: 1 1 0% !important;
  min-width: 0 !important;
  padding: 2px 0 !important;
}

#root main .mv-page-community .mva-ann-tags::-webkit-scrollbar,
.mv-page-community .mva-ann-tags::-webkit-scrollbar {
  display: none !important;
}

#root main .mv-page-community .mva-ann-tags button,
.mv-page-community .mva-ann-tags button {
  height: 34px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 9999px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  color: var(--muted-foreground) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
  flex-shrink: 0 !important;
}

#root main .mv-page-community .mva-ann-tags button:hover,
.mv-page-community .mva-ann-tags button:hover {
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--border) 80%, transparent) !important;
}

#root main .mv-page-community .mva-ann-tags button.bg-primary,
#root main .mv-page-community .mva-ann-tags button.bg-amber-500,
#root main .mv-page-community .mva-ann-tags button.font-bold,
.mv-page-community .mva-ann-tags button.bg-primary,
.mv-page-community .mva-ann-tags button.bg-amber-500,
.mv-page-community .mva-ann-tags button.font-bold {
  background: color-mix(in srgb, var(--primary) 18%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  color: var(--primary) !important;
  font-weight: 700 !important;
  box-shadow: 0 1px 4px color-mix(in srgb, var(--primary) 25%, transparent) !important;
}

#root main .mv-page-community .mva-ann-tags button span:last-child,
.mv-page-community .mva-ann-tags button span:last-child {
  font-size: 10px !important;
  font-weight: 700 !important;
  padding: 1px 6px !important;
  border-radius: 9999px !important;
  margin-left: 2px !important;
}

/* Search input */
#root main .mv-page-community .mva-ann-search,
.mv-page-community .mva-ann-search {
  position: relative !important;
  width: 220px !important;
  flex-shrink: 0 !important;
}

#root main .mv-page-community .mva-ann-search input,
.mv-page-community .mva-ann-search input {
  width: 100% !important;
  height: 36px !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 55%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  padding: 0 30px 0 34px !important;
  font-size: 12.5px !important;
  color: var(--foreground) !important;
  transition: all 0.2s ease !important;
}

#root main .mv-page-community .mva-ann-search input:focus,
.mv-page-community .mva-ann-search input:focus {
  border-color: color-mix(in srgb, var(--primary) 65%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent) !important;
  outline: none !important;
}

#root main .mv-page-community .mva-ann-search svg,
.mv-page-community .mva-ann-search svg {
  position: absolute !important;
  left: 11px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--muted-foreground) !important;
  pointer-events: none !important;
}

@media (max-width: 639px) {
  #root main .mv-page-community .mva-ann-toolbar,
  .mv-page-community .mva-ann-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }
  #root main .mv-page-community .mva-ann-tags,
  .mv-page-community .mva-ann-tags {
    width: 100% !important;
  }
  #root main .mv-page-community .mva-ann-search,
  .mv-page-community .mva-ann-search {
    width: 100% !important;
  }
}

/* 5. Thread Cards & Announcement Cards */
#root main .mv-page-community .mv-thread-card,
#root main .mv-page-community .mv-ann-card,
.mv-page-community .mv-thread-card,
.mv-page-community .mv-ann-card {
  padding: 18px 20px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.12) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 12px !important;
  text-decoration: none !important;
}

#root main .mv-page-community .mv-thread-card:hover,
#root main .mv-page-community .mv-ann-card:hover,
.mv-page-community .mv-thread-card:hover,
.mv-page-community .mv-ann-card:hover {
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, var(--primary) 35%, var(--border)) !important;
  background: color-mix(in srgb, var(--card) 80%, transparent) !important;
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.22) !important;
}

/* Pinned styles */
#root main .mv-page-community .mv-thread-card.is-pinned,
.mv-page-community .mv-thread-card.is-pinned {
  border-color: color-mix(in srgb, var(--primary) 40%, transparent) !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 7%, var(--card)), color-mix(in srgb, var(--card) 65%, transparent)) !important;
}

#root main .mv-page-community .mv-ann-card.is-pinned,
.mv-page-community .mv-ann-card.is-pinned {
  border-color: color-mix(in srgb, #f59e0b 40%, transparent) !important;
  background: linear-gradient(135deg, color-mix(in srgb, #f59e0b 6%, var(--card)), color-mix(in srgb, var(--card) 65%, transparent)) !important;
}

/* Titles */
#root main .mv-page-community .mv-thread-card h3,
#root main .mv-page-community .mv-ann-card h3,
.mv-page-community .mv-thread-card h3,
.mv-page-community .mv-ann-card h3 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--foreground) !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  transition: color 0.15s ease !important;
}

#root main .mv-page-community .mv-thread-card:hover h3,
.mv-page-community .mv-thread-card:hover h3 {
  color: var(--primary) !important;
}

#root main .mv-page-community .mv-ann-card:hover h3,
.mv-page-community .mv-ann-card:hover h3 {
  color: #f59e0b !important;
}

/* Snippet Preview */
#root main .mv-page-community .mv-thread-card p,
#root main .mv-page-community .mv-ann-card p,
.mv-page-community .mv-thread-card p,
.mv-page-community .mv-ann-card p {
  font-size: 12.5px !important;
  line-height: 1.6 !important;
  color: var(--muted-foreground) !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Card Header Badges Row */
#root main .mv-page-community .mv-thread-card > div:first-child,
#root main .mv-page-community .mv-ann-card > div:first-child,
.mv-page-community .mv-thread-card > div:first-child,
.mv-page-community .mv-ann-card > div:first-child {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* Card Footer Stats Row */
#root main .mv-page-community .mv-thread-card > div:last-child,
#root main .mv-page-community .mv-ann-card > div:last-child,
.mv-page-community .mv-thread-card > div:last-child,
.mv-page-community .mv-ann-card > div:last-child {
  border-top: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  padding-top: 10px !important;
  margin-top: 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 11.5px !important;
  color: var(--muted-foreground) !important;
}

/* 6. Thread & Announcement Detail View */
#root main .mv-page-community .mv-community-main > .space-y-4 > article,
#root main .mv-page-community .mv-community-main > .space-y-6 > article,
#root main .mv-page-community article.celestial-card,
#root main .mv-page-community article.rounded-3xl,
.mv-page-community article.celestial-card,
.mv-page-community article.rounded-3xl {
  padding: 24px 28px !important;
  border-radius: 16px !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 4px 20px -4px rgba(0, 0, 0, 0.18) !important;
  margin-top: 12px !important;
}

@media (max-width: 639px) {
  #root main .mv-page-community article.celestial-card,
  #root main .mv-page-community article.rounded-3xl,
  .mv-page-community article.celestial-card,
  .mv-page-community article.rounded-3xl {
    padding: 16px 18px !important;
  }
}

#root main .mv-page-community article h2,
.mv-page-community article h2 {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: var(--foreground) !important;
  letter-spacing: -0.01em !important;
  line-height: 1.35 !important;
  margin: 10px 0 !important;
}

@media (min-width: 640px) {
  #root main .mv-page-community article h2,
  .mv-page-community article h2 {
    font-size: 22px !important;
  }
}

/* Detail article body text */
#root main .mv-page-community article .whitespace-pre-line,
.mv-page-community article .whitespace-pre-line {
  font-size: 13.5px !important;
  line-height: 1.7 !important;
  color: var(--foreground) !important;
  opacity: 0.92 !important;
}

/* Back button */
#root main .mv-page-community .mv-community-main button:has(svg.lucide-arrow-left),
.mv-page-community .mv-community-main button:has(svg.lucide-arrow-left) {
  height: 34px !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 55%, transparent) !important;
  color: var(--foreground) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: all 0.15s ease !important;
  cursor: pointer !important;
}

#root main .mv-page-community .mv-community-main button:has(svg.lucide-arrow-left):hover,
.mv-page-community .mv-community-main button:has(svg.lucide-arrow-left):hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 40%, var(--border)) !important;
}

/* Reply Box & Form */
#root main .mv-page-community form:has(textarea),
.mv-page-community form:has(textarea) {
  padding: 20px 22px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  backdrop-filter: blur(14px) !important;
}

#root main .mv-page-community textarea,
.mv-page-community textarea {
  border-radius: 10px !important;
  padding: 12px 14px !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: var(--foreground) !important;
  background: color-mix(in srgb, var(--card) 75%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  box-sizing: border-box !important;
}

#root main .mv-page-community textarea:focus,
.mv-page-community textarea:focus {
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

/* Reply list cards */
#root main .mv-page-community .rounded-3xl:has(p.text-xs),
#root main .mv-page-community [class*="rounded-3xl"][class*="mt-6"],
.mv-page-community [class*="rounded-3xl"][class*="mt-6"] {
  padding: 18px 20px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.1) !important;
}

/* 7. Sidebar Cards */
#root main .mv-page-community .mv-sidebar-card,
.mv-page-community .mv-sidebar-card {
  padding: 16px 18px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.12) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}

#root main .mv-page-community .mv-sidebar-card h3,
.mv-page-community .mv-sidebar-card h3 {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--foreground) !important;
  margin: 0 !important;
}

#root main .mv-page-community .mv-sidebar-card > div:first-child,
.mv-page-community .mv-sidebar-card > div:first-child {
  border-bottom: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  padding-bottom: 8px !important;
}

/* 8. Leaderboard View Harmonization */
#root main .mv-page-leaderboard,
.mv-page-leaderboard {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

#root main .mv-page-leaderboard :is(.rounded-2xl, .rounded-3xl):has(table, [role="table"], .divide-y),
.mv-page-leaderboard :is(.rounded-2xl, .rounded-3xl):has(table, [role="table"], .divide-y) {
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  padding: 16px 20px !important;
}

/* 9. Community Theme Harmonization */
.theme-light .mv-page-community .mv-page-heading {
  background: rgba(255, 255, 255, 0.8) linear-gradient(115deg, rgba(99, 102, 241, 0.06), #ffffff) !important;
  border-color: rgba(226, 232, 240, 0.8) !important;
  box-shadow: 0 4px 20px -4px rgba(0, 0, 0, 0.05) !important;
}

.theme-sepia .mv-page-community .mv-page-heading {
  background: rgba(249, 246, 240, 0.85) linear-gradient(115deg, rgba(180, 83, 9, 0.06), #f9f6f0) !important;
  border-color: rgba(224, 216, 202, 0.85) !important;
}

.theme-midnight .mv-page-community .mv-page-heading {
  background: rgba(11, 17, 32, 0.85) linear-gradient(115deg, rgba(245, 158, 11, 0.06), #0b1120) !important;
  border-color: rgba(30, 41, 59, 0.85) !important;
}

/* ==========================================================================
   9. CHAPTER READER WORKSPACE (/chapter/...)
   ========================================================================== */

/* Floating reader dock: modern pill aesthetic */
.mv-reader-dock,
.lunaria-dock-bar {
  border-radius: 9999px !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  background: color-mix(in srgb, var(--card) 88%, transparent) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  box-shadow: 0 8px 30px -4px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.05) !important;
}

/* Reader top progress bar */
.mv-reader-progress {
  height: 2px !important;
  background: linear-gradient(to right, var(--primary), color-mix(in srgb, var(--primary) 70%, #38bdf8)) !important;
  box-shadow: 0 0 8px var(--primary) !important;
}

/* Reader TOC & Settings Drawers */
.mvr-drawer {
  border-radius: 1.125rem !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  background: color-mix(in srgb, var(--card) 95%, transparent) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

/* ==========================================================================
   10. UNIVERSAL MODALS, SEARCH DIALOG & COMMAND PALETTE
   ========================================================================== */

dialog,
[role="dialog"] {
  border-radius: 1.125rem !important; /* 18px radius */
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 85%, transparent) !important;
  backdrop-filter: blur(20px) saturate(190%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(190%) !important;
  box-shadow: 0 24px 60px -12px rgba(0, 0, 0, 0.45),
              inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

dialog::backdrop,
[role="dialog"]::backdrop {
  background: rgba(9, 11, 25, 0.65) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

[role="dialog"] > div {
  border-radius: 1.125rem !important; /* 18px modal radius */
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  box-shadow: 0 20px 45px -10px rgba(0, 0, 0, 0.35),
              0 0 0 1px color-mix(in srgb, var(--border) 30%, transparent) !important;
}

/* ==========================================================================
   SEARCH MODAL / COMMAND PALETTE (.mvs-dialog)
   Tailored, Stylish, Compact & Subtle Design Architecture
   Fully Cohesive with Site-Wide Modern Obsidian / Alabaster Glass
   ========================================================================== */

dialog.mvs-dialog,
.mvs-dialog {
  position: fixed !important;
  inset: clamp(16px, 6vh, 52px) 0 auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  width: min(640px, calc(100vw - 24px)) !important;
  max-width: none !important;
  max-height: calc(100dvh - clamp(24px, 10vh, 96px)) !important;
  border-radius: 14px !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, rgba(255, 255, 255, 0.06)) !important;
  background: color-mix(in srgb, var(--background) 92%, var(--card) 8%) !important;
  backdrop-filter: blur(28px) saturate(190%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(190%) !important;
  color: var(--foreground) !important;
  font-family: var(--mv-ui-font, "Plus Jakarta Sans", Inter, -apple-system, sans-serif) !important;
  font-size: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 24px 64px -12px rgba(0, 0, 0, 0.55),
              0 0 0 1px rgba(255, 255, 255, 0.04),
              inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  flex-direction: column !important;
  z-index: 60 !important;
}

.mvs-dialog::backdrop {
  background: rgba(8, 12, 20, 0.68) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

/* Modal Header Bar */
.mvs-dialog .mvs-header,
header.mvs-header {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 14px !important;
  min-height: 52px !important;
  flex-shrink: 0 !important;
  background: transparent !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Input Wrap & Inner Input */
.mvs-dialog .mvs-input-wrap {
  display: flex !important;
  flex: 1 !important;
  min-width: 0 !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: 8px !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  background: color-mix(in srgb, var(--card) 45%, transparent) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15) !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease !important;
}

.mvs-dialog .mvs-input-wrap:focus-within {
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent), inset 0 1px 2px rgba(0, 0, 0, 0.15) !important;
  background: color-mix(in srgb, var(--card) 75%, transparent) !important;
}

.mvs-dialog .mvs-input-wrap svg {
  color: var(--muted-foreground) !important;
  opacity: 0.85 !important;
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}

.mvs-dialog .mvs-input-wrap input,
.mvs-dialog .mvs-input-wrap input:focus,
.mvs-dialog .mvs-input-wrap input:focus-visible {
  flex: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 34px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
  color: var(--foreground) !important;
  line-height: 1.4 !important;
}

.mvs-dialog .mvs-input-wrap input::placeholder {
  color: var(--muted-foreground) !important;
  opacity: 0.75 !important;
}

.mvs-dialog .mvs-input-wrap button {
  width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  border-radius: 5px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--muted-foreground) !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  cursor: pointer !important;
  transition: all 0.14s ease !important;
}

.mvs-dialog .mvs-input-wrap button:hover {
  background: color-mix(in srgb, var(--card) 80%, transparent) !important;
  color: var(--foreground) !important;
}

.mvs-dialog .mvs-close {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  border-radius: 8px !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background: color-mix(in srgb, var(--card) 45%, transparent) !important;
  color: var(--muted-foreground) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  transition: all 0.15s ease !important;
}

.mvs-dialog .mvs-close:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--border) 60%, transparent) !important;
}

/* Toolbar: Scopes, Filter Toggle, Sort Dropdown */
.mvs-dialog .mvs-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
  padding: 6px 14px !important;
  min-height: 36px !important;
  background: transparent !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 20%, transparent) !important;
}

.mvs-dialog .mvs-scopes {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  border-radius: 7px !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  padding: 2px !important;
  box-shadow: none !important;
}

.mvs-dialog .mvs-scopes button {
  min-height: 24px !important;
  padding: 2px 10px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  border-radius: 5px !important;
  color: var(--muted-foreground) !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  transition: all 0.14s ease !important;
  cursor: pointer !important;
}

.mvs-dialog .mvs-scopes button:hover:not([aria-pressed="true"]) {
  color: var(--foreground) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
}

.mvs-dialog .mvs-scopes button[aria-pressed="true"] {
  background: color-mix(in srgb, var(--card) 95%, transparent) !important;
  color: var(--foreground) !important;
  font-weight: 600 !important;
  border-color: color-mix(in srgb, var(--border) 50%, transparent) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12) !important;
}

.mvs-dialog .mvs-toolbar-actions {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
}

.mvs-dialog .mvs-filter-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  min-height: 26px !important;
  padding: 3px 9px !important;
  border-radius: 6px !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  color: var(--muted-foreground) !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.mvs-dialog .mvs-filter-toggle:hover {
  background: color-mix(in srgb, var(--card) 75%, transparent) !important;
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--border) 55%, transparent) !important;
}

.mvs-dialog .mvs-filter-toggle.is-open,
.mvs-dialog .mvs-filter-toggle[aria-expanded="true"] {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
  background: color-mix(in srgb, var(--primary) 12%, var(--card)) !important;
}

.mvs-dialog .mvs-filter-toggle b {
  font-size: 9.5px !important;
  font-weight: 700 !important;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border-radius: 9999px !important;
  padding: 1px 5px !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
}

.mvs-dialog .mvs-sort {
  min-width: 0 !important;
  max-width: 135px !important;
  min-height: 26px !important;
  border-radius: 6px !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  padding: 3px 20px 3px 8px !important;
  font-size: 11px !important;
  color: var(--muted-foreground) !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease !important;
  cursor: pointer !important;
}

.mvs-dialog .mvs-sort:hover,
.mvs-dialog .mvs-sort:focus {
  border-color: color-mix(in srgb, var(--border) 60%, transparent) !important;
  outline: none !important;
  color: var(--foreground) !important;
}

/* Advanced Filter Drawer */
.mvs-dialog .mvs-filters {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 10px 14px !important;
  background: color-mix(in srgb, var(--card) 30%, transparent) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 20%, transparent) !important;
}

.mvs-dialog .mvs-filter-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.mvs-dialog .mvs-filter-grid label {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  font-size: 10.5px !important;
  font-weight: 550 !important;
  color: var(--muted-foreground) !important;
}

.mvs-dialog .mvs-filter-grid select {
  height: 28px !important;
  font-size: 11px !important;
  border-radius: 6px !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  color: var(--foreground) !important;
  padding: 0 8px !important;
}

.mvs-dialog .mvs-clear-filters {
  align-self: flex-start !important;
  font-size: 10.5px !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  padding: 2px 4px !important;
  text-decoration: underline !important;
}

.mvs-dialog .mvs-clear-filters:hover {
  color: var(--foreground) !important;
}

/* ==========================================================================
   THE A–Z ALPHABET SCRUBBER RIBBON (.mvs-alphabet)
   Sleek, Compact, Subtle Horizontal Index Ribbon
   ========================================================================== */

.mvs-dialog .mvs-alphabet {
  display: grid !important;
  grid-template-columns: repeat(14, minmax(0, 1fr)) !important;
  gap: 2px !important;
  padding: 6px 14px 6px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 20%, transparent) !important;
  flex-shrink: 0 !important;
}

.mvs-dialog .mvs-alphabet button {
  min-width: 0 !important;
  height: 22px !important;
  min-height: 22px !important;
  padding: 0 !important;
  font-size: 10.5px !important;
  font-weight: 550 !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--muted-foreground) !important;
  border-radius: 4px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.12s ease !important;
}

.mvs-dialog .mvs-alphabet button:hover:not(:disabled):not([aria-pressed="true"]) {
  background: color-mix(in srgb, var(--card) 75%, transparent) !important;
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--border) 35%, transparent) !important;
}

.mvs-dialog .mvs-alphabet button[aria-pressed="true"] {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  font-weight: 700 !important;
  box-shadow: 0 1px 3px color-mix(in srgb, var(--primary) 30%, transparent) !important;
  border-color: transparent !important;
}

.mvs-dialog .mvs-alphabet button:disabled {
  opacity: 0.2 !important;
  cursor: default !important;
  pointer-events: none !important;
}

/* ==========================================================================
   CLEAR HIERARCHY DIVIDER & STATUS BRIDGE (.mvs-section-label)
   ========================================================================== */

.mvs-dialog .mvs-section-label {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 14px 4px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  flex-shrink: 0 !important;
}

.mvs-section-heading-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}

.mvs-index-badge.is-active {
  font-size: 10px !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
  line-height: 1 !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  background: color-mix(in srgb, var(--primary) 18%, transparent) !important;
  color: var(--primary) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 35%, transparent) !important;
}

.mvs-dialog .mvs-section-label h3 {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--muted-foreground) !important;
  margin: 0 !important;
}

.mvs-section-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.mvs-clear-index-btn {
  font-size: 10.5px !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  border: 0 !important;
  cursor: pointer !important;
  padding: 2px 4px !important;
  border-radius: 4px !important;
  transition: color 0.15s ease !important;
}

.mvs-clear-index-btn:hover {
  color: var(--primary) !important;
  text-decoration: underline !important;
}

/* Scroll Area */
.mvs-dialog .mvs-scroll {
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  min-height: 0 !important;
  flex: 1 !important;
  padding: 4px 10px 10px !important;
  background: transparent !important;
  scrollbar-width: thin !important;
}

/* Recent Searches */
.mvs-dialog .mvs-recents {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 10px !important;
  margin-bottom: 6px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
}

.mvs-dialog .mvs-recents svg {
  color: var(--muted-foreground) !important;
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
}

.mvs-dialog .mvs-recents > div {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  flex: 1 !important;
}

.mvs-dialog .mvs-recents button {
  font-size: 10.5px !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  background: color-mix(in srgb, var(--card) 70%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  color: var(--foreground) !important;
  cursor: pointer !important;
}

.mvs-dialog .mvs-recents button:hover {
  border-color: color-mix(in srgb, var(--primary) 50%, var(--border)) !important;
  color: var(--primary) !important;
}

.mvs-dialog .mvs-history-clear {
  font-size: 10px !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  border: 0 !important;
  cursor: pointer !important;
  text-decoration: underline !important;
}

/* ==========================================================================
   STORY ROW LIST (.mvs-results & .mvs-result)
   Clean, Compact & Elegant Rows
   ========================================================================== */

.mvs-dialog .mvs-results {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  padding: 0 !important;
}

.mvs-dialog .mvs-result {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  text-decoration: none !important;
  color: inherit !important;
  cursor: pointer !important;
  transition: all 0.14s ease !important;
  position: relative !important;
}

.mvs-dialog .mvs-result:hover,
.mvs-dialog .mvs-result:focus,
.mvs-dialog .mvs-result[aria-selected="true"] {
  background: color-mix(in srgb, var(--card) 75%, transparent) !important;
  border-color: color-mix(in srgb, var(--border) 40%, transparent) !important;
  outline: none !important;
  transform: translateX(2px) !important;
}

/* Pristine Book Cover Thumbnail */
.mvs-dialog .mvs-cover {
  width: 32px !important;
  height: 44px !important;
  min-width: 32px !important;
  border-radius: 5px !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, rgba(255, 255, 255, 0.08)) !important;
  background: color-mix(in srgb, var(--card) 90%, transparent) !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
  flex-shrink: 0 !important;
}

.mvs-dialog .mvs-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.mvs-dialog .mvs-cover svg {
  color: var(--muted-foreground) !important;
  opacity: 0.5 !important;
  width: 16px !important;
  height: 16px !important;
}

/* Page icon */
.mvs-dialog .mvs-page-icon {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 6px !important;
  background: color-mix(in srgb, var(--card) 80%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--primary) !important;
  flex-shrink: 0 !important;
}

.mvs-dialog .mvs-page-icon svg {
  width: 15px !important;
  height: 15px !important;
}

/* Story Text Details */
.mvs-dialog .mvs-result-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  flex: 1 !important;
}

.mvs-dialog .mvs-result-copy > strong {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--foreground) !important;
  line-height: 1.35 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.mvs-dialog .mvs-native {
  font-size: 10px !important;
  color: var(--muted-foreground) !important;
  opacity: 0.8 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.mvs-dialog .mvs-author {
  font-size: 11px !important;
  color: var(--muted-foreground) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.mvs-dialog .mvs-meta {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-top: 1px !important;
  flex-wrap: wrap !important;
}

.mvs-dialog .mvs-meta span {
  font-size: 10px !important;
  color: var(--muted-foreground) !important;
  font-variant-numeric: tabular-nums !important;
}

/* Delicate Shelf & Progress Pills */
.mvs-dialog .mvs-shelf-badge,
.mvs-dialog .mvs-progress {
  font-size: 9.5px !important;
  font-weight: 600 !important;
  padding: 1.5px 7px !important;
  border-radius: 9999px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.02em !important;
  font-variant-numeric: tabular-nums !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  white-space: nowrap !important;
}

.mvs-dialog .mvs-shelf-badge {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  color: var(--muted-foreground) !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
}

.mvs-dialog .mvs-shelf-badge[data-shelf="reading"] {
  background: rgba(59, 130, 246, 0.14) !important;
  color: #60a5fa !important;
  border-color: rgba(59, 130, 246, 0.3) !important;
}

.mvs-dialog .mvs-shelf-badge[data-shelf="completed"] {
  background: rgba(16, 185, 129, 0.14) !important;
  color: #34d399 !important;
  border-color: rgba(16, 185, 129, 0.3) !important;
}

.mvs-dialog .mvs-shelf-badge[data-shelf="plan-to-read"] {
  background: rgba(245, 158, 11, 0.14) !important;
  color: #fbbf24 !important;
  border-color: rgba(245, 158, 11, 0.3) !important;
}

.mvs-dialog .mvs-shelf-badge[data-shelf="on-hold"] {
  background: rgba(148, 163, 184, 0.14) !important;
  color: #cbd5e1 !important;
  border-color: rgba(148, 163, 184, 0.3) !important;
}

.mvs-dialog .mvs-shelf-badge[data-shelf="favorites"] {
  background: rgba(236, 72, 153, 0.14) !important;
  color: #f472b6 !important;
  border-color: rgba(236, 72, 153, 0.3) !important;
}

.mvs-dialog .mvs-progress {
  background: color-mix(in srgb, var(--card) 90%, transparent) !important;
  color: var(--muted-foreground) !important;
  border: 1px solid color-mix(in srgb, var(--border) 30%, transparent) !important;
}

/* Quick Bookmark Action */
.mvs-dialog .mvs-bookmark-btn {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 6px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--muted-foreground) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  transition: all 0.14s ease !important;
  flex-shrink: 0 !important;
}

.mvs-dialog .mvs-bookmark-btn:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--border) 40%, transparent) !important;
}

.mvs-dialog .mvs-bookmark-btn.is-active {
  color: var(--primary) !important;
}

/* Floating Shelf Popover */
.mvs-shelf-popover {
  position: absolute !important;
  z-index: 55 !important;
  border-radius: 10px !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, rgba(255, 255, 255, 0.08)) !important;
  background: color-mix(in srgb, var(--card) 95%, var(--background)) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: 0 16px 40px -8px rgba(0, 0, 0, 0.45) !important;
  padding: 4px !important;
  min-width: 170px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.mvs-shelf-popover button {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 6px 10px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--foreground) !important;
  cursor: pointer !important;
  transition: background-color 0.12s ease !important;
}

.mvs-shelf-popover button:hover {
  background: color-mix(in srgb, var(--foreground) 8%, transparent) !important;
}

.mvs-shelf-popover button.is-active {
  font-weight: 600 !important;
  color: var(--primary) !important;
}

/* Footer Status Bar */
.mvs-dialog .mvs-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 5px 14px !important;
  min-height: 28px !important;
  flex-shrink: 0 !important;
  background: color-mix(in srgb, var(--card) 30%, transparent) !important;
  border-top: 1px solid color-mix(in srgb, var(--border) 20%, transparent) !important;
  font-size: 10.5px !important;
  color: var(--muted-foreground) !important;
}

.mvs-dialog .mvs-keys {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.mvs-dialog .mvs-keys kbd {
  font-family: inherit !important;
  font-size: 9.5px !important;
  padding: 1px 4px !important;
  border-radius: 3px !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  color: var(--muted-foreground) !important;
}

.mvs-dialog .mvs-pagination {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 14px !important;
  justify-content: center !important;
  border-top: 1px solid color-mix(in srgb, var(--border) 18%, transparent) !important;
}

.mvs-dialog .mvs-pagination button {
  font-size: 11px !important;
  padding: 3px 10px !important;
  border-radius: 5px !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  color: var(--foreground) !important;
  cursor: pointer !important;
}

.mvs-dialog .mvs-pagination button:hover:not(:disabled) {
  background: color-mix(in srgb, var(--card) 80%, transparent) !important;
}

.mvs-dialog .mvs-pagination button:disabled {
  opacity: 0.3 !important;
  cursor: default !important;
}

/* ==========================================================================
   THEME ADAPTATIONS (LIGHT, SEPIA, MIDNIGHT)
   ========================================================================== */

/* Light Theme: Pristine Crystalline Alabaster Glass */
.theme-light .mvs-dialog {
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 20px 50px -10px rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
  color: #0f172a !important;
}

.theme-light .mvs-dialog::backdrop {
  background: rgba(15, 23, 42, 0.35) !important;
}

.theme-light .mvs-dialog .mvs-input-wrap {
  background: rgba(241, 245, 249, 0.8) !important;
  border-color: rgba(203, 213, 225, 0.8) !important;
}

.theme-light .mvs-dialog .mvs-result:hover {
  background: rgba(241, 245, 249, 0.85) !important;
  border-color: rgba(203, 213, 225, 0.6) !important;
}

/* Sepia Theme: Warm Ivory Parchment */
.theme-sepia .mvs-dialog {
  background: rgba(247, 243, 235, 0.95) !important;
  border: 1px solid rgba(180, 83, 9, 0.2) !important;
  box-shadow: 0 20px 50px -10px rgba(45, 20, 5, 0.15) !important;
  color: #2e1065 !important;
}

.theme-sepia .mvs-dialog::backdrop {
  background: rgba(45, 20, 5, 0.4) !important;
}

/* Midnight Theme: Pure OLED Obsidian */
.theme-midnight .mvs-dialog {
  background: rgba(7, 10, 16, 0.96) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 24px 70px -12px rgba(0, 0, 0, 0.85) !important;
}

/* ==========================================================================
   MOBILE RESPONSIVENESS (<480px)
   ========================================================================== */

@media (max-width: 479px) {
  .mvs-dialog {
    width: calc(100vw - 16px) !important;
    inset: 8px 8px auto !important;
    border-radius: 12px !important;
    max-height: calc(100dvh - 16px) !important;
  }

  .mvs-dialog .mvs-alphabet {
    grid-template-columns: repeat(10, minmax(0, 1fr)) !important;
    gap: 2px !important;
    padding: 4px 10px 6px !important;
  }

  .mvs-dialog .mvs-alphabet button {
    height: 20px !important;
    font-size: 10px !important;
  }

  .mvs-dialog .mvs-header {
    padding: 8px 10px !important;
    min-height: 48px !important;
  }

  .mvs-dialog .mvs-toolbar {
    padding: 4px 10px !important;
  }

  .mvs-dialog .mvs-filter-grid {
    grid-template-columns: 1fr !important;
  }

  .mvs-dialog .mvs-results {
    padding: 0 !important;
  }

  .mvs-dialog .mvs-result {
    padding: 6px 8px !important;
  }
}

/* ==========================================================================
   11. THEME-SPECIFIC HARMONY & CONTRAST
   ========================================================================== */

/* Sepia theme warm parchment adjustments */
.theme-sepia {
  --border: #e0d8ca;
  --card: #f9f6f0;
}

/* Midnight theme OLED deep dark adjustments */
.theme-midnight {
  --border: #1e293b;
  --card: #0b1120;
}

/* Light theme subtle border softening */
.theme-light {
  --border: #e2e8f0;
  --card: #ffffff;
}

/* ==========================================================================
   12. HOMEPAGE COMPREHENSIVE CARD ARCHITECTURE & GEOMETRY
   ========================================================================== */

/* 1. Major Homepage Containers (16px radius, unified glassmorphism) */
:is(
  .mv-index-featured,
  .mv-home-return,
  .mv-index-updates,
  .mv-index-popular,
  .mv-index-tags
) {
  border-width: 1px !important;
  border-style: solid !important;
  border-color: color-mix(in srgb, var(--border) 40%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 65%, transparent) !important;
  backdrop-filter: blur(14px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(180%) !important;
  border-radius: 1rem !important; /* 16px */
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05),
              0 1px 3px rgba(0, 0, 0, 0.03),
              0 4px 14px -3px rgba(0, 0, 0, 0.04) !important;
}

/* 2. Featured Stories Container & Book Cards */
.mv-index-featured {
  padding: 18px 20px !important;
}

.mv-index-feature-grid {
  gap: 14px !important;
}

.mv-index-book {
  padding: 8px 8px 10px !important;
  border-radius: 12px !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-color: color-mix(in srgb, var(--border) 35%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 75%, transparent) !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04),
              inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.22s ease !important;
}

.mv-index-book:hover {
  transform: translateY(-3px) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, var(--border)) !important;
  background-color: color-mix(in srgb, var(--card) 90%, transparent) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),
              0 8px 22px -4px rgba(0, 0, 0, 0.16) !important;
}

.mv-index-cover {
  border-radius: 8px !important;
  overflow: hidden !important;
  aspect-ratio: 2/3 !important;
  width: 100% !important;
  height: auto !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.14) !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
}

.mv-index-cover img {
  border-radius: 7px !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.25s ease !important;
}

.mv-index-book:hover .mv-index-cover img {
  transform: scale(1.03) !important;
}

.mv-index-chapters {
  font-variant-numeric: tabular-nums !important;
  border-radius: 4px !important;
  font-size: 9.5px !important;
  font-weight: 600 !important;
  backdrop-filter: blur(8px) !important;
}

.mv-index-book h2 {
  margin-top: 8px !important;
  font-size: 11.5px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  padding: 0 2px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 2.8em !important;
  transition: color 0.18s ease !important;
}

.mv-index-book:hover h2 {
  color: var(--primary) !important;
}

.mv-index-book-meta {
  margin-top: 4px !important;
  padding: 0 2px !important;
  font-size: 10px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  color: var(--muted-foreground) !important;
}

.mv-index-book-meta > span:last-child {
  color: #fbbf24 !important; /* Gold star */
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums !important;
}

/* 3. Continue Reading Shelf (.mv-home-return) */
.mv-home-return {
  padding: 10px 16px !important;
}

.mv-home-return-story {
  padding: 6px 12px !important;
  border-radius: 10px !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 80%, transparent) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-home-return-story:hover {
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border)) !important;
  background-color: color-mix(in srgb, var(--card) 95%, transparent) !important;
  box-shadow: 0 4px 14px -2px rgba(0, 0, 0, 0.12) !important;
}

.mv-home-return-cover {
  border-radius: 6px !important;
  overflow: hidden !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18) !important;
}

/* 4. Genre Navigation Filter Bar (.mv-index-genres) */
.mv-index-genres {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 2px 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

.mv-index-genre {
  padding: 5px 14px !important;
  border-radius: 9999px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 60%, transparent) !important;
  color: var(--muted-foreground) !important;
  white-space: nowrap !important;
  transition: all 0.18s ease !important;
}

.mv-index-genre:hover,
.mv-index-genre.is-active {
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, var(--border)) !important;
  background-color: color-mix(in srgb, var(--primary) 12%, var(--card)) !important;
}

/* 5. Latest Updates Container & Rows (.mv-index-updates) */
.mv-index-columns {
  display: grid !important;
  gap: 18px !important;
}

.mv-index-updates {
  padding: 16px 18px !important;
}

.mv-index-filters button {
  padding: 3px 10px !important;
  border-radius: 9999px !important;
  font-size: 10.5px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--muted-foreground) !important;
  transition: all 0.18s ease !important;
}

.mv-index-filters button.is-active {
  background: color-mix(in srgb, var(--primary) 18%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, var(--border)) !important;
  color: var(--foreground) !important;
  font-weight: 600 !important;
}

.mv-index-update-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  margin-top: 10px !important;
  border-top: none !important;
}

.mv-index-update {
  padding: 9px 12px !important;
  border-radius: 10px !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 55%, transparent) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.mv-index-update:hover {
  transform: translateX(3px) !important;
  background-color: color-mix(in srgb, var(--primary) 8%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 40%, var(--border)) !important;
  box-shadow: 0 3px 10px -2px rgba(0, 0, 0, 0.08) !important;
}

.mv-index-update img {
  border-radius: 6px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16) !important;
}

.mv-index-update-data span {
  font-variant-numeric: tabular-nums !important;
}

.mv-index-free {
  color: #34d399 !important; /* Emerald */
  font-weight: 600 !important;
}

.mv-index-price {
  color: #fbbf24 !important; /* Amber */
  font-weight: 600 !important;
}

/* 6. Popular Sidebar Container & Ranked Items (.mv-index-popular) */
.mv-index-popular {
  padding: 16px 18px !important;
}

.mv-index-popular ol {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin-top: 10px !important;
  padding: 0 !important;
  list-style: none !important;
}

.mv-index-popular li a {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 7px 10px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  transition: all 0.18s ease !important;
}

.mv-index-popular li a:hover {
  background-color: color-mix(in srgb, var(--primary) 8%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 30%, transparent) !important;
}

.mv-index-rank {
  font-variant-numeric: tabular-nums !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  color: var(--primary) !important;
  width: 20px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
}

.mv-index-popular img {
  border-radius: 6px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16) !important;
}

.mv-index-popular-copy strong {
  font-size: 11.5px !important;
  font-weight: 600 !important;
}

.mv-index-popular-copy span {
  font-size: 10px !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--muted-foreground) !important;
}

/* 7. Curated Collections (.mv-index-collection) */
.mv-index-collection-grid {
  display: grid !important;
  gap: 14px !important;
  margin-top: 12px !important;
}

.mv-index-collection {
  padding: 14px 16px !important;
  border-radius: 14px !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 65%, transparent) !important;
  backdrop-filter: blur(14px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(180%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05),
              0 1px 3px rgba(0, 0, 0, 0.03) !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.22s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.22s ease !important;
}

.mv-index-collection:hover {
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border)) !important;
  background-color: color-mix(in srgb, var(--card) 85%, transparent) !important;
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.12) !important;
}

.mv-index-mini-covers img {
  border-radius: 5px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22) !important;
}

/* 8. Explore Themes Bar (.mv-index-tags) */
.mv-index-tags {
  padding: 12px 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.mv-index-tags h2 {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--foreground) !important;
  white-space: nowrap !important;
}

.mv-index-tags > div {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.mv-index-tags a {
  padding: 4px 12px !important;
  border-radius: 9999px !important;
  font-size: 11px !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  background-color: color-mix(in srgb, var(--card) 70%, transparent) !important;
  color: var(--muted-foreground) !important;
  transition: all 0.18s ease !important;
}

.mv-index-tags a:hover {
  color: var(--primary) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, var(--border)) !important;
  background-color: color-mix(in srgb, var(--primary) 10%, var(--card)) !important;
  transform: translateY(-1px) !important;
}



/* ==========================================================================
   14. STORY & SERIES DETAIL WORKSPACE (.mv-series)
   Stylish, Subtle, Compact & Cohesive Master Design Architecture
   ========================================================================== */

/* 1. Breadcrumbs */
.mv-series-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  font-size: 11px !important;
  color: var(--muted-foreground) !important;
  padding: 2px 2px 4px !important;
}

.mv-series-breadcrumb a {
  color: var(--muted-foreground) !important;
  transition: color 0.15s ease !important;
  text-decoration: none !important;
}

.mv-series-breadcrumb a:hover {
  color: var(--primary) !important;
}

.mv-series-breadcrumb span[aria-current="page"] {
  color: var(--foreground) !important;
  font-weight: 550 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* 2. Hero Room Container (.mv-series-intro) */
.mv-series-intro {
  display: grid !important;
  grid-template-columns: 104px minmax(0, 1fr) !important;
  column-gap: 16px !important;
  row-gap: 10px !important;
  align-items: start !important;
  padding: 14px 18px !important;
  border-radius: 12px !important;
  border: 1px solid color-mix(in srgb, var(--border) 28%, transparent) !important;
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  box-shadow: 0 2px 12px -2px rgba(0, 0, 0, 0.2),
              inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  position: relative !important;
}

/* Inner Identity Reset: completely transparent, clean flex flow, zero double cards */
.mv-series-identity {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  min-width: 0 !important;
}

/* Novel Cover Thumbnail */
main button.mv-series-cover {
  width: 104px !important;
  height: 148px !important;
  min-height: 148px !important;
  padding: 0 !important;
  border-radius: 7px !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, rgba(255, 255, 255, 0.1)) !important;
  background: color-mix(in srgb, var(--card) 90%, transparent) !important;
  box-shadow: 0 4px 14px -3px rgba(0, 0, 0, 0.3),
              0 1px 3px rgba(0, 0, 0, 0.2) !important;
  cursor: zoom-in !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.22s ease !important;
  display: block !important;
}

main button.mv-series-cover:hover {
  transform: scale(1.02) !important;
  box-shadow: 0 8px 20px -3px rgba(0, 0, 0, 0.4) !important;
}

.mv-series-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* 3. Titleline & Byline */
.mv-series-titleline {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.mv-series-titleline h1 {
  font-family: var(--mv-font-serif, "Literata", Georgia, serif) !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
  color: var(--foreground) !important;
}

.mv-series-status {
  font-size: 9.5px !important;
  font-weight: 600 !important;
  padding: 2px 7px !important;
  border-radius: 9999px !important;
  background: color-mix(in srgb, var(--primary) 12%, transparent) !important;
  color: var(--primary) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 28%, transparent) !important;
  white-space: nowrap !important;
}

.mv-series-adult {
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 1.5px 6px !important;
  border-radius: 9999px !important;
  background: rgba(244, 63, 94, 0.12) !important;
  color: #fb7185 !important;
  border: 1px solid rgba(244, 63, 94, 0.25) !important;
}

.mv-series-byline {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px 10px !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  color: var(--muted-foreground) !important;
}

.mv-series-byline > :first-child {
  color: var(--foreground) !important;
  font-weight: 550 !important;
}

.mv-series-byline > span[lang="ko"] {
  color: var(--muted-foreground) !important;
  font-size: 10.5px !important;
  opacity: 0.8 !important;
}

.mv-series-byline > a {
  color: var(--primary) !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 0.14s ease !important;
}

.mv-series-byline > a:hover {
  text-decoration: underline !important;
}

/* 4. Metrics & Stats Shelf (.mv-series-metrics) */
.mv-series-metrics {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 14px !important;
  padding: 4px 10px !important;
  margin: 1px 0 !important;
  border-radius: 7px !important;
  background: color-mix(in srgb, var(--background) 45%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  width: fit-content !important;
  max-width: 100% !important;
}

.mv-series-metrics > div {
  display: flex !important;
  align-items: baseline !important;
  gap: 4px !important;
}

.mv-series-metrics dt {
  color: var(--muted-foreground) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
}

.mv-series-metrics dd {
  color: var(--foreground) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  font-variant-numeric: tabular-nums !important;
}

.mv-series-metrics > div:first-child dd {
  color: #fbbf24 !important; /* Gold rating star */
  font-weight: 700 !important;
}

/* 5. Summary Snippet */
.mv-series-summary {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.mv-series-summary p {
  min-width: 0 !important;
  font-size: 11.5px !important;
  line-height: 1.55 !important;
  color: var(--muted-foreground) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

main .mv-series-summary button {
  min-height: 20px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  flex-shrink: 0 !important;
  color: var(--primary) !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.14s ease !important;
}

main .mv-series-summary button:hover {
  text-decoration: underline !important;
}

/* 6. Action Buttons Bar (.mv-story-actions) */
.mv-series .mv-story-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 3px 0 0 !important;
  padding: 0 !important;
}

/* Primary Read / Continue Button */
.mv-series .mv-story-actions > a:first-child,
.mv-series .mv-story-actions > button:first-child {
  min-height: 32px !important;
  padding: 0 14px !important;
  border-radius: 7px !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border: 1px solid transparent !important;
  box-shadow: 0 2px 8px -2px color-mix(in srgb, var(--primary) 35%, transparent) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  cursor: pointer !important;
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
  text-decoration: none !important;
}

.mv-series .mv-story-actions > a:first-child:hover,
.mv-series .mv-story-actions > button:first-child:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 3px 10px -2px color-mix(in srgb, var(--primary) 45%, transparent) !important;
}

/* Secondary Action Buttons (Shelf Status, EPUB, Collection) */
.mv-series .mv-story-actions > :where(a:not(:first-child), button:not(:first-child)),
.mv-series .mv-story-actions > div > button {
  min-height: 32px !important;
  padding: 0 11px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  border: 1px solid color-mix(in srgb, var(--border) 35%, transparent) !important;
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  color: var(--foreground) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  cursor: pointer !important;
  transition: all 0.16s ease !important;
  text-decoration: none !important;
}

.mv-series .mv-story-actions > :where(a:not(:first-child), button:not(:first-child)):hover,
.mv-series .mv-story-actions > div > button:hover {
  border-color: color-mix(in srgb, var(--primary) 40%, var(--border)) !important;
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  transform: translateY(-1px) !important;
}

/* 7. Context: Genre Pills & Content Warnings */
.mv-series-context {
  grid-column: 1 / -1 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  align-items: center !important;
  padding-top: 10px !important;
  border-top: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  margin-top: 2px !important;
  font-size: 10.5px !important;
  color: var(--muted-foreground) !important;
}

.mv-series-genres {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  align-items: center !important;
}

.mv-series-genres a {
  padding: 2.5px 9px !important;
  border-radius: 9999px !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  color: var(--muted-foreground) !important;
  background: color-mix(in srgb, var(--card) 50%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 30%, transparent) !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  display: inline-flex !important;
  align-items: center !important;
}

.mv-series-genres a:hover {
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border)) !important;
  background: color-mix(in srgb, var(--primary) 10%, var(--card)) !important;
  transform: translateY(-1px) !important;
}

.mv-series-warning {
  font-size: 10px !important;
  padding: 2px 8px !important;
  border-radius: 5px !important;
  background: rgba(245, 158, 11, 0.08) !important;
  color: #fbbf24 !important;
  border: 1px solid rgba(245, 158, 11, 0.2) !important;
  margin: 0 !important;
}

.mv-series-shelf {
  font-size: 10px !important;
  font-weight: 550 !important;
  color: var(--primary) !important;
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

/* 8. Main Workspace Grid & Tabs */
.mv-series-workspace {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 260px !important;
  gap: 18px !important;
  align-items: start !important;
  margin-top: 6px !important;
}

/* Modern Segmented Tab Bar */
#root main .mv-series-tabs,
.mv-series-tabs {
  display: flex !important;
  gap: 3px !important;
  padding: 3px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 50%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 28%, transparent) !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin-bottom: 12px !important;
}

#root main .mv-series-tabs button,
main .mv-series-tabs button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 26px !important;
  padding: 2px 10px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  border: 0 !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  cursor: pointer !important;
  transition: all 0.14s ease !important;
}

#root main .mv-series-tabs button:hover:not([aria-selected="true"]),
main .mv-series-tabs button:hover:not([aria-selected="true"]) {
  color: var(--foreground) !important;
  background: color-mix(in srgb, var(--foreground) 5%, transparent) !important;
}

#root main .mv-series-tabs button[aria-selected="true"],
main .mv-series-tabs button[aria-selected="true"] {
  background: color-mix(in srgb, var(--card) 95%, transparent) !important;
  color: var(--foreground) !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12),
              inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

#root main .mv-series-tabs button > span,
.mv-series-tabs button > span {
  padding: 0.5px 5px !important;
  border-radius: 9999px !important;
  font-size: 9.5px !important;
  font-weight: 650 !important;
  font-variant-numeric: tabular-nums !important;
  background: color-mix(in srgb, var(--border) 50%, transparent) !important;
  color: var(--muted-foreground) !important;
  line-height: 1.2 !important;
}

#root main .mv-series-tabs button[aria-selected="true"] > span,
main .mv-series-tabs button[aria-selected="true"] > span {
  background: color-mix(in srgb, var(--primary) 18%, transparent) !important;
  color: var(--primary) !important;
}

/* 9. Chapter Catalog (.mvc-catalog) */
.mvc-catalog {
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 28%, transparent) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px -2px rgba(0, 0, 0, 0.2) !important;
}

.mvc-toolbar {
  padding: 8px 12px !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
}

.mvc-access button {
  min-height: 26px !important;
  padding: 2px 9px !important;
  border-radius: 5px !important;
  font-size: 10.5px !important;
  font-weight: 550 !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  transition: all 0.14s ease !important;
}

.mvc-access button:hover {
  background: color-mix(in srgb, var(--card) 75%, transparent) !important;
  color: var(--foreground) !important;
}

.mvc-access button[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 14%, transparent) !important;
  color: var(--primary) !important;
  border-color: color-mix(in srgb, var(--primary) 30%, transparent) !important;
}

.mvc-search input {
  height: 28px !important;
  background: color-mix(in srgb, var(--background) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 30%, transparent) !important;
  border-radius: 5px !important;
  font-size: 11px !important;
  color: var(--foreground) !important;
}

.mvc-filters select {
  height: 26px !important;
  border-radius: 5px !important;
  font-size: 10.5px !important;
  border: 1px solid color-mix(in srgb, var(--border) 30%, transparent) !important;
  background: color-mix(in srgb, var(--background) 55%, transparent) !important;
  color: var(--foreground) !important;
  padding: 0 6px !important;
}

.mvc-row {
  display: flex !important;
  align-items: center !important;
  padding: 8px 12px !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 18%, transparent) !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: all 0.14s ease !important;
}

.mvc-row:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  transform: translateX(2px) !important;
}

.mvc-row.is-current {
  background: color-mix(in srgb, var(--primary) 8%, var(--card)) !important;
  border-left: 2px solid var(--primary) !important;
}

.mvc-number {
  font-variant-numeric: tabular-nums !important;
  font-weight: 650 !important;
  font-size: 10.5px !important;
  color: var(--primary) !important;
  min-width: 26px !important;
}

.mvc-title {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--foreground) !important;
}

.mvc-free {
  color: #34d399 !important; /* Mint */
  font-weight: 600 !important;
  font-size: 10px !important;
}

.mvc-status.locked {
  color: #fbbf24 !important; /* Gold Lumina */
  font-weight: 600 !important;
  font-size: 10px !important;
}

/* 10. Series Panel About Luxury Redesign (#series-panel-about) */

/* 10.1 Panel Container: Compact, subtle card plane, zero double borders */
#series-panel-about.mv-series-panel {
  padding: 14px 16px !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 28%, transparent) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  box-shadow: 0 2px 12px -2px rgba(0, 0, 0, 0.2),
              inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  box-sizing: border-box !important;
}

@media (max-width: 767px) {
  #series-panel-about.mv-series-panel {
    padding: 12px 14px !important;
    gap: 12px !important;
    border-radius: 10px !important;
  }
}

@media (max-width: 379px) {
  #series-panel-about.mv-series-panel {
    padding: 10px 11px !important;
    gap: 10px !important;
    border-radius: 9px !important;
  }
}

/* 10.2 Inner Synopsis Container: Seamless flow, zero nested border clashing */
#series-panel-about .mv-story-synopsis {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

/* 10.3 Synopsis Header Bar */
#series-panel-about .mv-story-synopsis > div:first-child {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-bottom: 8px !important;
  margin-bottom: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
}

#series-panel-about .mv-story-synopsis > div:first-child > div:first-child {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}

/* Starlight / Lore Icon Badge */
#series-panel-about .mv-story-synopsis > div:first-child > div > div {
  display: flex !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 6px !important;
  background: color-mix(in srgb, var(--primary) 10%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 22%, transparent) !important;
  color: var(--primary) !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

#series-panel-about .mv-story-synopsis > div:first-child h3 {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: var(--foreground) !important;
  margin: 0 !important;
}

/* Story Lore Micro-Badge */
#series-panel-about .mv-story-synopsis > div:first-child > span {
  display: inline-flex !important;
  font-size: 9.5px !important;
  font-weight: 600 !important;
  padding: 1.5px 6px !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--primary) 8%, transparent) !important;
  color: var(--primary) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, transparent) !important;
  letter-spacing: 0.02em !important;
}

/* 10.4 Synopsis Body Prose & Expand Toggle */
#series-panel-about .mv-story-synopsis .whitespace-pre-line {
  font-size: 12px !important;
  line-height: 1.65 !important;
  color: color-mix(in srgb, var(--foreground) 88%, transparent) !important;
}

#series-panel-about .mv-story-synopsis button.mv-story-synopsis-more {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  padding-top: 3px !important;
  cursor: pointer !important;
  transition: all 0.16s ease !important;
  background: transparent !important;
  border: 0 !important;
}

#series-panel-about .mv-story-synopsis button.mv-story-synopsis-more:hover {
  text-decoration: underline !important;
  filter: brightness(1.15) !important;
}

/* 10.5 Reading Notes & Details Card (.mv-story-extra.mv-story-notes) */
#series-panel-about .mv-story-notes {
  margin: 2px 0 0 !important;
  border-radius: 9px !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  overflow: hidden !important;
  box-shadow: none !important;
  transition: border-color 0.18s ease !important;
}

#series-panel-about .mv-story-notes[open] {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--border)) !important;
}

/* Interactive Details Summary Header */
#series-panel-about .mv-story-notes > summary {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 7px 11px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--foreground) !important;
  cursor: pointer !important;
  user-select: none !important;
  background: color-mix(in srgb, var(--card) 45%, transparent) !important;
  transition: all 0.16s ease !important;
}

#series-panel-about .mv-story-notes > summary::-webkit-details-marker {
  display: none !important;
}

#series-panel-about .mv-story-notes > summary::after {
  content: "▾" !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--muted-foreground) !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), color 0.18s ease !important;
}

#series-panel-about .mv-story-notes[open] > summary::after {
  transform: rotate(180deg) !important;
  color: var(--primary) !important;
}

#series-panel-about .mv-story-notes > summary:hover {
  background: color-mix(in srgb, var(--card) 70%, transparent) !important;
  color: var(--primary) !important;
}

/* Notes Body Container */
#series-panel-about .mv-notes-body {
  padding: 12px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  border-top: 1px solid color-mix(in srgb, var(--border) 22%, transparent) !important;
}

/* 10.6 Character Dynamics Section (.mv-notes-pair) */
#series-panel-about .mv-notes-pair {
  padding: 10px 12px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  margin: 0 !important;
}

#series-panel-about .mv-note-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  margin-bottom: 8px !important;
  flex-wrap: wrap !important;
}

#series-panel-about .mv-note-heading h3 {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: var(--foreground) !important;
  margin: 0 !important;
}

#series-panel-about .mv-note-heading span {
  font-size: 9px !important;
  font-weight: 600 !important;
  padding: 1.5px 6px !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--primary) 10%, transparent) !important;
  color: var(--primary) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, transparent) !important;
}

#series-panel-about .mv-notes-pair > dl {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
}

@media (max-width: 639px) {
  #series-panel-about .mv-notes-pair > dl {
    grid-template-columns: 1fr !important;
  }
}

#series-panel-about .mv-notes-pair > dl > div {
  padding: 7px 10px !important;
  border-radius: 6px !important;
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 22%, transparent) !important;
  border-left: 2px solid var(--primary) !important;
  min-width: 0 !important;
}

#series-panel-about .mv-notes-pair dt {
  font-size: 9px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: var(--primary) !important;
  margin-bottom: 2px !important;
}

#series-panel-about .mv-notes-pair dd {
  font-size: 11px !important;
  font-weight: 550 !important;
  color: var(--foreground) !important;
  line-height: 1.45 !important;
  margin: 0 0 4px 0 !important;
}

/* Subtle Interactive Note Pills (.mv-note-tags) */
#series-panel-about .mv-note-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  margin: 0 !important;
}

#series-panel-about .mv-note-tags a {
  padding: 2px 6px !important;
  border-radius: 5px !important;
  font-size: 9.5px !important;
  font-weight: 500 !important;
  background: color-mix(in srgb, var(--primary) 8%, var(--muted)) !important;
  color: var(--primary) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 18%, transparent) !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
  display: inline-flex !important;
  align-items: center !important;
}

#series-panel-about .mv-note-tags a:hover {
  background: color-mix(in srgb, var(--primary) 18%, var(--muted)) !important;
  border-color: var(--primary) !important;
  transform: translateY(-1px) !important;
}

/* 10.7 Atmosphere & Themes Section (.mv-notes-themes) */
#series-panel-about .mv-notes-themes {
  padding: 9px 12px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}

#series-panel-about .mv-notes-themes > div {
  display: grid !important;
  grid-template-columns: 100px minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: center !important;
}

@media (max-width: 599px) {
  #series-panel-about .mv-notes-themes > div {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }
}

#series-panel-about .mv-notes-themes h3 {
  font-size: 10px !important;
  font-weight: 650 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: var(--muted-foreground) !important;
  margin: 0 !important;
}

/* 10.8 Reading Highlights & Memorable Quote (.mv-notes-reading) */
#series-panel-about .mv-notes-reading {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

@media (max-width: 767px) {
  #series-panel-about .mv-notes-reading {
    grid-template-columns: 1fr !important;
  }
}

/* Memorable Quote Editorial Card - Subtle, non-loud styling */
#series-panel-about .mv-note-quote {
  padding: 10px 12px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 45%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  border-left: 2px solid color-mix(in srgb, var(--primary) 50%, var(--border)) !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

#series-panel-about .mv-note-quote .mv-note-heading {
  margin-bottom: 6px !important;
}

#series-panel-about .mv-note-quote .mv-note-heading h3 {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: var(--primary) !important;
}

#series-panel-about .mv-note-quote button {
  min-height: 22px !important;
  padding: 1px 7px !important;
  border-radius: 5px !important;
  font-size: 9.5px !important;
  font-weight: 600 !important;
  background: color-mix(in srgb, var(--primary) 10%, transparent) !important;
  color: var(--primary) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, transparent) !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

#series-panel-about .mv-note-quote button:hover {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
}

#series-panel-about .mv-note-quote blockquote {
  font-family: Georgia, "Literata", "Merriweather", serif !important;
  font-style: italic !important;
  font-size: 11.5px !important;
  line-height: 1.58 !important;
  color: var(--foreground) !important;
  margin: 0 0 6px 0 !important;
  padding-left: 8px !important;
  border-left: 2px solid color-mix(in srgb, var(--primary) 35%, transparent) !important;
}

#series-panel-about .mv-note-quote figcaption {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: var(--muted-foreground) !important;
}

#series-panel-about .mv-note-quote figcaption span {
  font-size: 9.5px !important;
  font-weight: 450 !important;
  opacity: 0.8 !important;
  margin-left: 3px !important;
}

/* "Read this for" Checklist Section */
#series-panel-about .mv-note-reading:not(figure) {
  padding: 10px 12px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 40%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  margin: 0 !important;
}

#series-panel-about .mv-note-reading:not(figure) h3 {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: var(--primary) !important;
  margin: 0 0 8px 0 !important;
}

#series-panel-about .mv-note-reading:not(figure) ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

#series-panel-about .mv-note-reading:not(figure) li {
  position: relative !important;
  padding-left: 14px !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  color: var(--foreground) !important;
}

#series-panel-about .mv-note-reading:not(figure) li::before {
  content: "✦" !important;
  position: absolute !important;
  left: 0 !important;
  top: 1px !important;
  color: var(--primary) !important;
  font-size: 8.5px !important;
  line-height: 1.5 !important;
}

/* 10.9 Connected Works / Series Universe (.mv-series-related) */
#series-panel-about .mv-series-related {
  margin: 2px 0 0 !important;
  padding-top: 12px !important;
  border-top: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

#series-panel-about .mv-series-related h2 {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  color: var(--foreground) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

#series-panel-about .mv-series-related > div {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important;
  gap: 8px !important;
}

@media (max-width: 359px) {
  #series-panel-about .mv-series-related > div {
    grid-template-columns: 1fr !important;
  }
}

#series-panel-about .mv-series-related a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 10px !important;
  border-radius: 7px !important;
  background: color-mix(in srgb, var(--card) 50%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 30%, transparent) !important;
  text-decoration: none !important;
  transition: all 0.16s cubic-bezier(0.16, 1, 0.3, 1) !important;
  min-width: 0 !important;
}

#series-panel-about .mv-series-related a:hover {
  border-color: color-mix(in srgb, var(--primary) 40%, var(--border)) !important;
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 2px 8px -1px rgba(0, 0, 0, 0.15) !important;
}

/* Kind badge */
#series-panel-about .mv-series-related a > span:first-child {
  font-size: 8.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  background: color-mix(in srgb, var(--primary) 10%, transparent) !important;
  color: var(--primary) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, transparent) !important;
  flex-shrink: 0 !important;
  width: auto !important;
}

/* Title text */
#series-panel-about .mv-series-related a > strong {
  font-size: 11px !important;
  font-weight: 550 !important;
  color: var(--foreground) !important;
  flex: 1 1 0% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Arrow indicator */
#series-panel-about .mv-series-related a > span:last-child {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--primary) !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
  transition: transform 0.16s ease !important;
}

#series-panel-about .mv-series-related a:hover > span:last-child {
  transform: translate(2px, -2px) !important;
}

/* 11. Sidebar Elements (.mv-series-aside) */
.mv-series-aside {
  border-left: 1px solid color-mix(in srgb, var(--border) 28%, transparent) !important;
  padding-left: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.mv-series-section-title h2 {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--foreground) !important;
}

.mv-series-collection,
.mv-series-recommendation {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 8px !important;
  border-radius: 7px !important;
  border: 1px solid transparent !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 18%, transparent) !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: all 0.15s ease !important;
}

.mv-series-collection:hover,
.mv-series-recommendation:hover {
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border-color: color-mix(in srgb, var(--border) 28%, transparent) !important;
  transform: translateX(2px) !important;
}

.mv-series-collection img,
.mv-series-recommendation img {
  width: 28px !important;
  height: 38px !important;
  border-radius: 4px !important;
  object-fit: cover !important;
  flex-shrink: 0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

.mv-series-collection strong,
.mv-series-recommendation strong {
  font-size: 11px !important;
  font-weight: 550 !important;
  line-height: 1.35 !important;
}

.mv-series-collection > div > span,
.mv-series-recommendation > div > span {
  font-size: 9.5px !important;
  color: var(--muted-foreground) !important;
  font-variant-numeric: tabular-nums !important;
}

/* 12. Responsive Refinements */
@media (max-width: 999px) {
  .mv-series-intro {
    grid-template-columns: 92px minmax(0, 1fr) !important;
    gap: 12px 14px !important;
    padding: 12px 14px !important;
  }

  main button.mv-series-cover {
    width: 92px !important;
    height: 132px !important;
    min-height: 132px !important;
  }

  .mv-series-workspace {
    grid-template-columns: minmax(0, 1fr) 220px !important;
    gap: 14px !important;
  }
}

@media (max-width: 759px) {
  .mv-series-intro {
    grid-template-columns: 84px minmax(0, 1fr) !important;
    gap: 10px 12px !important;
    padding: 10px 12px !important;
  }

  main button.mv-series-cover {
    width: 84px !important;
    height: 120px !important;
    min-height: 120px !important;
  }

  .mv-series-titleline h1 {
    font-size: 17px !important;
  }

  .mv-series-metrics {
    gap: 5px 10px !important;
    padding: 3px 8px !important;
    font-size: 9.5px !important;
  }

  .mv-series-workspace {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .mv-series-aside {
    border-left: 0 !important;
    border-top: 1px solid color-mix(in srgb, var(--border) 25%, transparent) !important;
    padding-left: 0 !important;
    padding-top: 12px !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}

@media (max-width: 639px) {
  .mv-series {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  .mv-series-intro {
    display: grid !important;
    grid-template-columns: 80px minmax(0, 1fr) !important;
    gap: 8px 10px !important;
    padding: 10px 12px !important;
    align-items: start !important;
    box-sizing: border-box !important;
  }

  .mv-series-identity {
    display: contents !important;
  }

  main button.mv-series-cover {
    grid-column: 1 !important;
    grid-row: 1 / span 3 !important;
    width: 80px !important;
    height: 114px !important;
    min-height: 114px !important;
    margin: 0 !important;
  }

  .mv-series-titleline,
  .mv-series-byline,
  .mv-series-metrics {
    grid-column: 2 !important;
    min-width: 0 !important;
  }

  .mv-series-summary {
    grid-column: 1 / -1 !important;
    margin-top: 2px !important;
  }

  /* Compact yet stylish 2-tier ergonomic story actions */
  .mv-series .mv-story-actions {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    gap: 5px !important;
    width: 100% !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .mv-series .mv-story-actions > * {
    width: auto !important;
    margin: 0 !important;
  }

  /* Tier 1: Primary Read/Continue CTA & Shelf Dropdown */
  .mv-series .mv-story-actions > a:first-child,
  .mv-series .mv-story-actions > button:first-child {
    flex: 1 1 calc(50% - 2.5px) !important;
    min-width: 0 !important;
    max-width: calc(50% - 2.5px) !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 8px !important;
    font-size: 11px !important;
    border-radius: 7px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
  }

  .mv-series .mv-story-actions > div:first-child,
  .mv-series .mv-story-actions > div:nth-child(2) {
    flex: 1 1 calc(50% - 2.5px) !important;
    min-width: 0 !important;
    max-width: calc(50% - 2.5px) !important;
    height: 34px !important;
    box-sizing: border-box !important;
  }

  .mv-series .mv-story-actions > div > button {
    width: 100% !important;
    height: 100% !important;
    min-height: 34px !important;
    padding: 0 8px !important;
    font-size: 11px !important;
    border-radius: 7px !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    gap: 4px !important;
  }

  /* When Shelf is the primary/only action on Row 1 (e.g. no chapters yet) */
  .mv-series .mv-story-actions:not(:has(> a:first-child)) > div:first-child {
    flex: 1 1 auto !important;
    max-width: 100% !important;
  }

  /* Tier 2: Supporting Actions (EPUB, Collection, Share) */
  .mv-series .mv-story-actions > a:not(:first-child) {
    flex: 1 1 0% !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 8px !important;
    font-size: 10.5px !important;
    border-radius: 7px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    box-sizing: border-box !important;
  }

  .mv-series .mv-story-actions > a[title*="EPUB"] span {
    display: inline !important;
  }

  .mv-series .mv-story-actions > button {
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 7px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  .mv-series .mv-story-actions > button:not([title*="Share"]) {
    flex: 1 1 0% !important;
    min-width: 0 !important;
    padding: 0 8px !important;
    gap: 4px !important;
    font-size: 10.5px !important;
  }

  .mv-series .mv-story-actions > button:not([title*="Share"]) span {
    display: inline !important;
  }

  .mv-series .mv-story-actions > button[title*="Share"] {
    flex: 0 0 32px !important;
    width: 32px !important;
    padding: 0 !important;
  }

  .mv-series-context {
    grid-column: 1 / -1 !important;
  }

  #root main .mv-series-tabs,
  .mv-series-tabs {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 2.5px !important;
    padding: 2.5px !important;
    box-sizing: border-box !important;
  }

  #root main .mv-series-tabs button,
  .mv-series-tabs button {
    padding: 3px 2px !important;
    font-size: 10px !important;
    min-width: 0 !important;
    justify-content: center !important;
    gap: 3px !important;
  }

  #root main .mv-series-tabs button > span,
  .mv-series-tabs button > span {
    padding: 0 3px !important;
    font-size: 8.5px !important;
  }

  .mv-series-aside {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 359px) {
  .mv-series-intro {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 6px 8px !important;
    padding: 8px 10px !important;
  }

  main button.mv-series-cover {
    width: 72px !important;
    height: 102px !important;
    min-height: 102px !important;
  }

  .mv-series .mv-story-actions > a:first-child,
  .mv-series .mv-story-actions > button:first-child {
    font-size: 10.5px !important;
    padding: 0 6px !important;
  }

  .mv-series .mv-story-actions > div > button {
    font-size: 10.5px !important;
    padding: 0 6px !important;
  }
}


/* ==========================================================================
   SECTION 15: BROWSE STORIES LUXURY OVERHAUL (.mve-explore, .mve-browse)
   Celestial Obsidian & Alabaster Glass Design Standard
   ========================================================================== */

/* 1. Root Container & Spacing */
#root main .mve-explore.mve-browse,
.mve-explore.mve-browse {
  gap: 16px !important;
  padding-bottom: 32px !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
}

/* 2. Page Header Banner (.mve-heading) */
#root main .mve-heading,
.mve-explore .mve-heading {
  background: linear-gradient(135deg, color-mix(in srgb, var(--card) 80%, transparent), color-mix(in srgb, var(--background) 90%, transparent)) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid color-mix(in srgb, var(--border) 65%, transparent) !important;
  border-radius: 16px !important;
  padding: 22px 26px !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 8px 30px -10px rgba(0, 0, 0, 0.25) !important;
}

#root main .mve-heading::before,
.mve-explore .mve-heading::before {
  content: "" !important;
  position: absolute !important;
  top: -40% !important;
  right: -10% !important;
  width: 320px !important;
  height: 240px !important;
  background: radial-gradient(circle, color-mix(in srgb, var(--primary) 14%, transparent) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

#root main .mve-heading > *,
.mve-explore .mve-heading > * {
  position: relative !important;
  z-index: 1 !important;
}

#root main .mve-heading .mve-title-line,
.mve-explore .mve-heading .mve-title-line {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

#root main .mve-heading h1,
.mve-explore .mve-heading h1 {
  font-family: var(--font-serif, "Cinzel", "Playfair Display", Georgia, serif) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--foreground) !important;
  line-height: 1.15 !important;
  margin: 0 !important;
}

#root main .mve-heading .mve-kicker,
.mve-explore .mve-heading .mve-kicker {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--primary) !important;
  background: color-mix(in srgb, var(--primary) 12%, transparent) !important;
  padding: 3px 9px !important;
  border-radius: 9999px !important;
  border: 1px solid color-mix(in srgb, var(--primary) 28%, transparent) !important;
}

#root main .mve-heading p,
.mve-explore .mve-heading p {
  font-size: 13.5px !important;
  color: var(--muted-foreground) !important;
  margin: 5px 0 0 0 !important;
  line-height: 1.45 !important;
}

#root main .mve-secondary.mve-random,
.mve-explore .mve-secondary.mve-random {
  height: 38px !important;
  border-radius: 9999px !important;
  padding: 0 18px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 75%, transparent) !important;
  color: var(--foreground) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

#root main .mve-secondary.mve-random:hover:not(:disabled),
.mve-explore .mve-secondary.mve-random:hover:not(:disabled) {
  background: color-mix(in srgb, var(--primary) 16%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 45%, transparent) !important;
  color: var(--primary) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--primary) 18%, transparent) !important;
}

/* 3. Search & Toolbar (.mve-toolbar) */
#root main .mve-toolbar,
.mve-explore .mve-toolbar {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
  margin: 0 0 4px 0 !important;
}

#root main .mve-toolbar .mve-search,
.mve-explore .mve-toolbar .mve-search {
  flex: 1 !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

#root main .mve-toolbar .mve-search input,
.mve-explore .mve-toolbar .mve-search input {
  width: 100% !important;
  height: 42px !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  padding: 0 14px 0 38px !important;
  font-size: 13.5px !important;
  color: var(--foreground) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#root main .mve-toolbar .mve-search input:focus,
.mve-explore .mve-toolbar .mve-search input:focus {
  border-color: color-mix(in srgb, var(--primary) 65%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent), 0 2px 8px color-mix(in srgb, var(--primary) 8%, transparent) !important;
  outline: none !important;
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
}

#root main .mve-toolbar .mve-search svg,
.mve-explore .mve-toolbar .mve-search svg {
  position: absolute !important;
  left: 13px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--muted-foreground) !important;
  pointer-events: none !important;
}

/* Sort Control Component (.mve-sort-control) */
#root main .mve-toolbar .mve-sort-control,
.mve-explore .mve-toolbar .mve-sort-control {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 42px !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  padding: 0 14px !important;
  cursor: pointer !important;
  color: var(--foreground) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  user-select: none !important;
  flex-shrink: 0 !important;
}

#root main .mve-toolbar .mve-sort-control:hover,
.mve-explore .mve-toolbar .mve-sort-control:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--border) 80%, transparent) !important;
}

#root main .mve-toolbar .mve-sort-control:focus-within,
.mve-explore .mve-toolbar .mve-sort-control:focus-within {
  border-color: color-mix(in srgb, var(--primary) 65%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

#root main .mve-toolbar .mve-sort-control > svg:first-child,
.mve-explore .mve-toolbar .mve-sort-control > svg:first-child {
  width: 15px !important;
  height: 15px !important;
  color: var(--muted-foreground) !important;
  flex-shrink: 0 !important;
  pointer-events: none !important;
  transition: color 0.15s ease !important;
}

#root main .mve-toolbar .mve-sort-control:hover > svg:first-child,
.mve-explore .mve-toolbar .mve-sort-control:hover > svg:first-child {
  color: var(--foreground) !important;
}

#root main .mve-toolbar .mve-sort-control .mve-sort-text,
.mve-explore .mve-toolbar .mve-sort-control .mve-sort-text {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 5px !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

#root main .mve-toolbar .mve-sort-control .mve-sort-label,
.mve-explore .mve-toolbar .mve-sort-control .mve-sort-label {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--muted-foreground) !important;
  pointer-events: none !important;
}

#root main .mve-toolbar .mve-sort-control .mve-sort-val,
.mve-explore .mve-toolbar .mve-sort-control .mve-sort-val {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--foreground) !important;
  pointer-events: none !important;
}

#root main .mve-toolbar .mve-sort-control > svg:last-of-type,
.mve-explore .mve-toolbar .mve-sort-control > svg:last-of-type {
  width: 13px !important;
  height: 13px !important;
  color: var(--muted-foreground) !important;
  flex-shrink: 0 !important;
  pointer-events: none !important;
  margin-left: 2px !important;
  transition: color 0.15s ease !important;
}

#root main .mve-toolbar .mve-sort-control:hover > svg:last-of-type,
.mve-explore .mve-toolbar .mve-sort-control:hover > svg:last-of-type {
  color: var(--foreground) !important;
}

#root main .mve-toolbar .mve-sort-control .mve-sort-native-select,
.mve-explore .mve-toolbar .mve-sort-control .mve-sort-native-select {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  cursor: pointer !important;
  z-index: 2 !important;
  border: none !important;
  background: transparent !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* Backwards compatibility for bare .mve-select */
#root main .mve-toolbar .mve-select,
.mve-explore .mve-toolbar .mve-select {
  position: relative !important;
}

#root main .mve-toolbar .mve-select select,
.mve-explore .mve-toolbar .mve-select select {
  height: 42px !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  padding: 0 34px 0 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--foreground) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

#root main .mve-toolbar .mve-select select:focus,
.mve-explore .mve-toolbar .mve-select select:focus {
  border-color: color-mix(in srgb, var(--primary) 65%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent) !important;
  outline: none !important;
}

/* Filters Button Toggle (.mve-filter-toggle) */
#root main .mve-toolbar .mve-filter-toggle,
.mve-explore .mve-toolbar .mve-filter-toggle {
  height: 42px !important;
  border-radius: 10px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  background: color-mix(in srgb, var(--card) 65%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  color: var(--foreground) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  user-select: none !important;
  flex-shrink: 0 !important;
}

#root main .mve-toolbar .mve-filter-toggle svg,
.mve-explore .mve-toolbar .mve-filter-toggle svg {
  width: 15px !important;
  height: 15px !important;
  color: var(--muted-foreground) !important;
  flex-shrink: 0 !important;
  transition: color 0.15s ease !important;
}

#root main .mve-toolbar .mve-filter-toggle:hover,
.mve-explore .mve-toolbar .mve-filter-toggle:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--border) 80%, transparent) !important;
}

#root main .mve-toolbar .mve-filter-toggle:hover svg,
.mve-explore .mve-toolbar .mve-filter-toggle:hover svg {
  color: var(--foreground) !important;
}

#root main .mve-toolbar .mve-filter-toggle.is-active,
.mve-explore .mve-toolbar .mve-filter-toggle.is-active {
  background: color-mix(in srgb, var(--primary) 16%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  color: var(--primary) !important;
}

#root main .mve-toolbar .mve-filter-toggle.is-active svg,
.mve-explore .mve-toolbar .mve-filter-toggle.is-active svg {
  color: var(--primary) !important;
}

#root main .mve-toolbar .mve-filter-toggle .mve-filter-btn-text,
.mve-explore .mve-toolbar .mve-filter-toggle .mve-filter-btn-text {
  font-size: 13px !important;
  font-weight: 600 !important;
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  line-height: 1 !important;
}

#root main .mve-toolbar .mve-filter-toggle .mve-filter-badge,
.mve-explore .mve-toolbar .mve-filter-toggle .mve-filter-badge {
  font-size: 11px !important;
  font-weight: 700 !important;
  min-width: 19px !important;
  height: 19px !important;
  padding: 0 5px !important;
  border-radius: 9999px !important;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  box-shadow: 0 1px 4px color-mix(in srgb, var(--primary) 40%, transparent) !important;
}

/* 4. Browse Layout & Sidebar (.mve-browse-layout, .mve-filter-rail) */
#root main .mve-browse-layout,
.mve-explore .mve-browse-layout {
  display: grid !important;
  grid-template-columns: 215px minmax(0, 1fr) !important;
  gap: 24px !important;
  align-items: start !important;
  transition: grid-template-columns 0.25s ease !important;
}

#root main .mve-browse-layout.is-sidebar-collapsed,
.mve-explore .mve-browse-layout.is-sidebar-collapsed {
  grid-template-columns: 1fr !important;
}

@media (min-width: 1024px) {
  #root main .mve-filter-rail,
  .mve-explore .mve-filter-rail {
    position: sticky !important;
    top: 76px !important;
    border: none !important;
    padding: 0 !important;
    display: block !important;
  }
}

#root main .mve-filter-content,
.mve-explore .mve-filter-content {
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 55%, transparent) !important;
  border-radius: 14px !important;
  padding: 16px !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 4px 16px -4px rgba(0, 0, 0, 0.15) !important;
}

#root main .mve-filter-heading,
.mve-explore .mve-filter-heading {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 12px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
}

#root main .mve-filter-heading h2,
.mve-explore .mve-filter-heading h2 {
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--foreground) !important;
  margin: 0 !important;
}

#root main .mve-filter-heading button,
.mve-explore .mve-filter-heading button {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  transition: opacity 0.15s ease !important;
}

#root main .mve-filter-heading button:hover,
.mve-explore .mve-filter-heading button:hover {
  text-decoration: underline !important;
}

#root main .mve-genre-field,
.mve-explore .mve-genre-field {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#root main .mve-genre-field legend,
.mve-explore .mve-genre-field legend {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--muted-foreground) !important;
  margin-bottom: 8px !important;
}

#root main .mve-genre-field > button,
.mve-explore .mve-genre-field > button {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  color: var(--foreground) !important;
  margin-bottom: 6px !important;
  transition: all 0.15s ease !important;
  cursor: pointer !important;
}

#root main .mve-genre-field > button:hover,
.mve-explore .mve-genre-field > button:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--border) 75%, transparent) !important;
}

#root main .mve-genre-field > button[aria-pressed="true"],
.mve-explore .mve-genre-field > button[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 18%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  color: var(--primary) !important;
  font-weight: 600 !important;
}

#root main .mve-genre-field > button small,
.mve-explore .mve-genre-field > button small {
  font-size: 10px !important;
  padding: 1px 6px !important;
  border-radius: 9999px !important;
  background: color-mix(in srgb, var(--primary) 20%, transparent) !important;
  color: var(--primary) !important;
  font-weight: 600 !important;
}

#root main .mve-genre-options,
.mve-explore .mve-genre-options {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 5px !important;
}

#root main .mve-genre-options button,
.mve-explore .mve-genre-options button {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 5px 8px !important;
  border-radius: 7px !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  background: color-mix(in srgb, var(--card) 45%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  color: var(--foreground) !important;
  transition: all 0.15s ease !important;
  cursor: pointer !important;
}

#root main .mve-genre-options button:hover,
.mve-explore .mve-genre-options button:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--border) 70%, transparent) !important;
  transform: translateY(-1px) !important;
}

#root main .mve-genre-options button[aria-pressed="true"],
.mve-explore .mve-genre-options button[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 18%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  color: var(--primary) !important;
  font-weight: 600 !important;
}

#root main .mve-genre-options button small,
.mve-explore .mve-genre-options button small {
  font-size: 9.5px !important;
  padding: 1px 5px !important;
  border-radius: 9999px !important;
  background: color-mix(in srgb, var(--muted) 35%, transparent) !important;
  color: var(--muted-foreground) !important;
}

#root main .mve-genre-options button[aria-pressed="true"] small,
.mve-explore .mve-genre-options button[aria-pressed="true"] small {
  background: color-mix(in srgb, var(--primary) 25%, transparent) !important;
  color: var(--primary) !important;
}

#root main details.mve-more-genres summary,
.mve-explore details.mve-more-genres summary {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  cursor: pointer !important;
  padding: 6px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

#root main .mve-filter-field,
.mve-explore .mve-filter-field {
  margin-top: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

#root main .mve-filter-field span,
.mve-explore .mve-filter-field span {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--muted-foreground) !important;
}

#root main .mve-filter-field select,
.mve-explore .mve-filter-field select {
  height: 36px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  padding: 0 26px 0 10px !important;
  font-size: 12px !important;
  color: var(--foreground) !important;
  cursor: pointer !important;
}

#root main .mve-filter-field select:focus,
.mve-explore .mve-filter-field select:focus {
  border-color: color-mix(in srgb, var(--primary) 65%, var(--border)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent) !important;
  outline: none !important;
}

/* 5. Results Section & Results Toolbar (.mve-results-toolbar) */
#root main .mve-results-toolbar,
.mve-explore .mve-results-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  margin-bottom: 14px !important;
  flex-wrap: nowrap !important;
}

#root main .mve-quick-filters,
.mve-explore .mve-quick-filters {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

#root main .mve-status-tabs,
.mve-explore .mve-status-tabs {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px !important;
  border-radius: 9999px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  gap: 2px !important;
  flex-shrink: 0 !important;
}

#root main .mve-pill-prefix,
.mve-explore .mve-pill-prefix {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--muted-foreground) !important;
  padding: 0 4px 0 10px !important;
  user-select: none !important;
  opacity: 0.85 !important;
}

#root main .mve-status-tabs button,
.mve-explore .mve-status-tabs button {
  padding: 4px 14px !important;
  border-radius: 9999px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  border: none !important;
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

#root main .mve-status-tabs button:hover,
.mve-explore .mve-status-tabs button:hover {
  color: var(--foreground) !important;
}

#root main .mve-status-tabs button[aria-pressed="true"],
.mve-explore .mve-status-tabs button[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 20%, var(--card)) !important;
  color: var(--primary) !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}

#root main .mve-library-filter,
.mve-explore .mve-library-filter {
  padding: 5px 13px !important;
  border-radius: 9999px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  color: var(--muted-foreground) !important;
  transition: all 0.18s ease !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
}

#root main .mve-library-filter svg,
.mve-explore .mve-library-filter svg {
  width: 14px !important;
  height: 14px !important;
  flex-shrink: 0 !important;
}

#root main .mve-library-filter:hover,
.mve-explore .mve-library-filter:hover {
  color: var(--foreground) !important;
  border-color: color-mix(in srgb, var(--border) 75%, transparent) !important;
}

#root main .mve-library-filter.is-active,
#root main .mve-library-filter[aria-pressed="true"],
.mve-explore .mve-library-filter.is-active,
.mve-explore .mve-library-filter[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 18%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  color: var(--primary) !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 4px color-mix(in srgb, var(--primary) 25%, transparent) !important;
}

#root main .mve-result-controls,
.mve-explore .mve-result-controls {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}

#root main .mve-quick-count,
.mve-explore .mve-quick-count {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--muted-foreground) !important;
  white-space: nowrap !important;
  padding-right: 4px !important;
}

#root main .mve-view-switch,
.mve-explore .mve-view-switch {
  display: inline-flex !important;
  padding: 3px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  gap: 2px !important;
}

#root main .mve-view-switch button,
.mve-explore .mve-view-switch button {
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

#root main .mve-view-switch button:hover,
.mve-explore .mve-view-switch button:hover {
  color: var(--foreground) !important;
}

#root main .mve-view-switch button[aria-pressed="true"],
.mve-explore .mve-view-switch button[aria-pressed="true"] {
  background: color-mix(in srgb, var(--primary) 20%, var(--card)) !important;
  color: var(--primary) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

/* 6. Result Summary & Active Filters (.mve-result-summary, .mve-active-filters) */
#root main .mve-result-summary,
.mve-explore .mve-result-summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 12px !important;
  color: var(--muted-foreground) !important;
  margin-bottom: 10px !important;
}

#root main .mve-result-summary button,
.mve-explore .mve-result-summary button {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  padding: 2px 4px !important;
}

#root main .mve-result-summary button:hover,
.mve-explore .mve-result-summary button:hover {
  text-decoration: underline !important;
}

#root main .mve-active-filters,
.mve-explore .mve-active-filters {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 14px !important;
}

#root main .mve-active-filters button,
.mve-explore .mve-active-filters button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 10px 4px 12px !important;
  border-radius: 9999px !important;
  font-size: 12px !important;
  background: color-mix(in srgb, var(--primary) 10%, var(--card)) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 32%, transparent) !important;
  color: var(--foreground) !important;
  transition: all 0.15s ease !important;
  cursor: pointer !important;
}

#root main .mve-active-filters button:hover,
.mve-explore .mve-active-filters button:hover {
  background: color-mix(in srgb, var(--destructive) 14%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--destructive) 45%, transparent) !important;
}

#root main .mve-active-filters .mve-chip-cat,
.mve-explore .mve-active-filters .mve-chip-cat {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: var(--primary) !important;
  opacity: 0.9 !important;
}

#root main .mve-active-filters .mve-chip-val,
.mve-explore .mve-active-filters .mve-chip-val {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--foreground) !important;
}

#root main .mve-active-filters .mve-chip-x,
.mve-explore .mve-active-filters .mve-chip-x {
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  margin-left: 2px !important;
  color: var(--muted-foreground) !important;
  transition: color 0.15s ease !important;
}

#root main .mve-active-filters button:hover .mve-chip-x,
.mve-explore .mve-active-filters button:hover .mve-chip-x {
  color: var(--destructive) !important;
}

/* 7. Book Cards: Covers Mode (.mve-books-covers, .mve-book-covers) */
#root main .mve-books-covers,
.mve-explore .mve-books-covers {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(136px, 1fr)) !important;
  gap: 22px 14px !important;
}

#root main .mve-book.mve-book-covers,
.mve-explore .mve-book.mve-book-covers {
  display: flex !important;
  flex-direction: column !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  position: relative !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#root main .mve-book.mve-book-covers:hover,
.mve-explore .mve-book.mve-book-covers:hover {
  transform: translateY(-4px) !important;
}

#root main .mve-book-covers .mve-cover,
.mve-explore .mve-book-covers .mve-cover {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  background: color-mix(in srgb, var(--card) 80%, black) !important;
  box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.35), 0 0 0 1px color-mix(in srgb, var(--border) 40%, transparent) !important;
  transition: box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: block !important;
}

#root main .mve-book.mve-book-covers:hover .mve-cover,
.mve-explore .mve-book.mve-book-covers:hover .mve-cover {
  box-shadow: 0 10px 24px -4px rgba(0, 0, 0, 0.45), 0 0 0 1px color-mix(in srgb, var(--primary) 40%, transparent) !important;
}

#root main .mve-book-covers .mve-cover img,
.mve-explore .mve-book-covers .mve-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.35s ease !important;
}

#root main .mve-book.mve-book-covers:hover .mve-cover img,
.mve-explore .mve-book.mve-book-covers:hover .mve-cover img {
  transform: scale(1.03) !important;
}

#root main .mve-book-covers .mve-cover::after,
.mve-explore .mve-book-covers .mve-cover::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, transparent 28%, transparent 70%, rgba(0,0,0,0.65) 100%) !important;
  opacity: 0.7 !important;
  transition: opacity 0.2s ease !important;
}

#root main .mve-book-covers .mve-cover small,
.mve-explore .mve-book-covers .mve-cover small {
  position: absolute !important;
  bottom: 8px !important;
  left: 8px !important;
  z-index: 5 !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  background: rgba(239, 68, 68, 0.85) !important;
  color: #fff !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.3) !important;
}

/* Tactile Frosted Glass Roundels for Book Actions on Covers */
#root main .mve-book-covers .mve-book-actions,
.mve-explore .mve-book-covers .mve-book-actions {
  position: absolute !important;
  top: 7px !important;
  right: 7px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  z-index: 5 !important;
}

#root main .mve-book-covers .mve-book-actions button.mva-save,
#root main .mve-book-covers .mve-book-actions button.mve-icon,
.mve-explore .mve-book-covers .mve-book-actions button.mva-save,
.mve-explore .mve-book-covers .mve-book-actions button.mve-icon {
  width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  border-radius: 9999px !important;
  background: rgba(12, 16, 24, 0.72) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  padding: 0 !important;
}

#root main .mve-book-covers .mve-book-actions button.mva-save:hover,
#root main .mve-book-covers .mve-book-actions button.mve-icon:hover,
.mve-explore .mve-book-covers .mve-book-actions button.mva-save:hover,
.mve-explore .mve-book-covers .mve-book-actions button.mve-icon:hover {
  background: rgba(20, 26, 38, 0.95) !important;
  transform: scale(1.08) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  color: #fff !important;
}

#root main .mve-book-covers .mve-book-actions button.mva-save[data-saved="true"],
.mve-explore .mve-book-covers .mve-book-actions button.mva-save[data-saved="true"] {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border-color: var(--primary) !important;
}

#root main .mve-book-covers .mve-book-actions svg,
.mve-explore .mve-book-covers .mve-book-actions svg {
  width: 14px !important;
  height: 14px !important;
}

#root main .mve-book-covers .mve-book-copy,
.mve-explore .mve-book-covers .mve-book-copy {
  margin-top: 8px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

#root main .mve-book-covers .mve-book-topline,
.mve-explore .mve-book-covers .mve-book-topline {
  display: none !important;
}

#root main .mve-book-covers .mve-book-copy h2,
.mve-explore .mve-book-covers .mve-book-copy h2 {
  font-size: 13px !important;
  line-height: 1.35 !important;
  min-height: 2.7em !important;
  height: auto !important;
  margin: 0 !important;
}

#root main .mve-book-covers .mve-book-copy h2 a,
.mve-explore .mve-book-covers .mve-book-copy h2 a {
  font-family: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: var(--foreground) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

#root main .mve-book-covers .mve-book-copy h2 a:hover,
.mve-explore .mve-book-covers .mve-book-copy h2 a:hover {
  color: var(--primary) !important;
}

#root main .mve-book-covers .mve-book-author,
.mve-explore .mve-book-covers .mve-book-author {
  font-size: 11.5px !important;
  color: var(--muted-foreground) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin: 0 !important;
}

#root main .mve-book-covers .mve-book-stats,
.mve-explore .mve-book-covers .mve-book-stats {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 11px !important;
  color: var(--muted-foreground) !important;
  margin-top: 2px !important;
}

#root main .mve-book-covers .mve-rating,
.mve-explore .mve-book-covers .mve-rating {
  font-weight: 600 !important;
  color: #fbbf24 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
}

/* 8. Book Cards: Cards Mode (.mve-books-cards, .mve-book-cards) */
#root main .mve-books-cards,
.mve-explore .mve-books-cards {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)) !important;
  gap: 14px !important;
}

#root main .mve-book.mve-book-cards,
.mve-explore .mve-book.mve-book-cards {
  display: grid !important;
  grid-template-columns: 88px 1fr auto !important;
  gap: 14px !important;
  padding: 14px !important;
  border-radius: 14px !important;
  background: color-mix(in srgb, var(--card) 55%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  align-items: start !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 4px 14px -4px rgba(0, 0, 0, 0.15) !important;
}

#root main .mve-book.mve-book-cards:hover,
.mve-explore .mve-book.mve-book-cards:hover {
  background: color-mix(in srgb, var(--card) 80%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 30%, var(--border)) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.25) !important;
}

#root main .mve-book-cards .mve-cover,
.mve-explore .mve-book-cards .mve-cover {
  width: 88px !important;
  aspect-ratio: 2 / 3 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3) !important;
  display: block !important;
}

#root main .mve-book-cards .mve-cover img,
.mve-explore .mve-book-cards .mve-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

#root main .mve-book-cards .mve-book-topline,
.mve-explore .mve-book-cards .mve-book-topline {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-bottom: 4px !important;
}

#root main .mve-book-cards .mve-book-topline span:first-child,
.mve-explore .mve-book-cards .mve-book-topline span:first-child {
  padding: 2px 8px !important;
  border-radius: 9999px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  background: color-mix(in srgb, var(--primary) 14%, transparent) !important;
  color: var(--primary) !important;
}

#root main .mve-book-cards .mve-status,
.mve-explore .mve-book-cards .mve-status {
  font-size: 10px !important;
  color: var(--muted-foreground) !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  background: color-mix(in srgb, var(--muted) 35%, transparent) !important;
}

#root main .mve-book-cards .mve-status.is-complete,
.mve-explore .mve-book-cards .mve-status.is-complete {
  color: #10b981 !important;
  background: rgba(16, 185, 129, 0.12) !important;
}

#root main .mve-book-cards .mve-book-copy h2,
.mve-explore .mve-book-cards .mve-book-copy h2 {
  margin: 0 !important;
}

#root main .mve-book-cards .mve-book-copy h2 a,
.mve-explore .mve-book-cards .mve-book-copy h2 a {
  font-size: 14px !important;
  font-weight: 650 !important;
  color: var(--foreground) !important;
  text-decoration: none !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  line-height: 1.35 !important;
}

#root main .mve-book-cards .mve-book-copy h2 a:hover,
.mve-explore .mve-book-cards .mve-book-copy h2 a:hover {
  color: var(--primary) !important;
}

#root main .mve-book-cards .mve-book-author,
.mve-explore .mve-book-cards .mve-book-author {
  font-size: 12px !important;
  color: var(--muted-foreground) !important;
  margin: 3px 0 0 0 !important;
}

#root main .mve-book-cards .mve-book-stats,
.mve-explore .mve-book-cards .mve-book-stats {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 11.5px !important;
  color: var(--muted-foreground) !important;
  margin-top: 8px !important;
}

#root main .mve-book-cards .mve-rating,
.mve-explore .mve-book-cards .mve-rating {
  font-weight: 600 !important;
  color: #fbbf24 !important;
}

#root main .mve-book-cards .mve-book-actions,
.mve-explore .mve-book-cards .mve-book-actions {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  align-items: center !important;
}

#root main .mve-book-cards .mve-book-actions button.mva-save,
#root main .mve-book-cards .mve-book-actions button.mve-icon,
.mve-explore .mve-book-cards .mve-book-actions button.mva-save,
.mve-explore .mve-book-cards .mve-book-actions button.mve-icon {
  width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  color: var(--foreground) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

#root main .mve-book-cards .mve-book-actions button.mva-save:hover,
#root main .mve-book-cards .mve-book-actions button.mve-icon:hover,
.mve-explore .mve-book-cards .mve-book-actions button.mva-save:hover,
.mve-explore .mve-book-cards .mve-book-actions button.mve-icon:hover {
  background: color-mix(in srgb, var(--primary) 15%, var(--card)) !important;
  border-color: color-mix(in srgb, var(--primary) 40%, transparent) !important;
  color: var(--primary) !important;
}

#root main .mve-book-cards .mve-book-actions button.mva-save[data-saved="true"],
.mve-explore .mve-book-cards .mve-book-actions button.mva-save[data-saved="true"] {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border-color: var(--primary) !important;
}

/* 9. Book Cards: List Mode (.mve-books-list, .mve-book-list) */
#root main .mve-books-list,
.mve-explore .mve-books-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  border: none !important;
}

#root main .mve-book.mve-book-list,
.mve-explore .mve-book.mve-book-list {
  display: grid !important;
  grid-template-columns: 72px 1fr auto !important;
  gap: 16px !important;
  padding: 14px 16px !important;
  border-radius: 12px !important;
  background: color-mix(in srgb, var(--card) 45%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  align-items: start !important;
  transition: all 0.2s ease !important;
}

#root main .mve-book.mve-book-list:hover,
.mve-explore .mve-book.mve-book-list:hover {
  background: color-mix(in srgb, var(--card) 75%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 28%, var(--border)) !important;
}

#root main .mve-book-list .mve-cover,
.mve-explore .mve-book-list .mve-cover {
  width: 72px !important;
  aspect-ratio: 2 / 3 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
  display: block !important;
}

#root main .mve-book-list .mve-cover img,
.mve-explore .mve-book-list .mve-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

#root main .mve-book-list .mve-book-copy h2 a,
.mve-explore .mve-book-list .mve-book-copy h2 a {
  font-size: 14.5px !important;
  font-weight: 650 !important;
  color: var(--foreground) !important;
  text-decoration: none !important;
}

#root main .mve-book-list .mve-book-copy h2 a:hover,
.mve-explore .mve-book-list .mve-book-copy h2 a:hover {
  color: var(--primary) !important;
}

#root main .mve-book-list .mve-book-description,
.mve-explore .mve-book-list .mve-book-description {
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: var(--muted-foreground) !important;
  margin-top: 6px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* 10. Quick Preview Drawer (.mve-drawer, .mve-drawer-preview) */
#root main .mve-overlay,
.mve-explore .mve-overlay {
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  background: rgba(0, 0, 0, 0.65) !important;
}

#root main .mve-drawer,
.mve-explore .mve-drawer {
  background: color-mix(in srgb, var(--card) 95%, black) !important;
  border-left: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  box-shadow: -12px 0 36px rgba(0, 0, 0, 0.55) !important;
}

#root main .mve-drawer-heading,
.mve-explore .mve-drawer-heading {
  border-bottom: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  padding: 18px 22px !important;
}

#root main .mve-drawer-heading h2,
.mve-explore .mve-drawer-heading h2 {
  font-family: var(--font-serif, "Cinzel", "Playfair Display", Georgia, serif) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--foreground) !important;
}

#root main .mve-drawer-actions button,
.mve-explore .mve-drawer-actions button,
#root main .mve-drawer-actions a,
.mve-explore .mve-drawer-actions a {
  border-radius: 9px !important;
  height: 38px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
}

#root main .mve-drawer-tags button,
.mve-explore .mve-drawer-tags button {
  padding: 4px 10px !important;
  border-radius: 9999px !important;
  font-size: 11.5px !important;
  background: color-mix(in srgb, var(--primary) 12%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 28%, transparent) !important;
  color: var(--primary) !important;
}

/* 11. Responsive Breakpoints & Mobile Optimization */
@media (max-width: 1023px) {
  #root main .mve-browse-layout,
  .mve-explore .mve-browse-layout {
    display: block !important;
  }

  #root main .mve-filter-rail,
  .mve-explore .mve-filter-rail {
    display: none !important;
  }

  #root main .mve-filter-rail.is-open,
  .mve-explore .mve-filter-rail.is-open {
    display: flex !important;
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    max-height: none !important;
    z-index: 55 !important;
    justify-content: flex-end !important;
    align-items: stretch !important;
    background: rgba(0, 0, 0, 0.65) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: none !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  #root main .mve-filter-rail.is-open .mve-filter-content,
  .mve-explore .mve-filter-rail.is-open .mve-filter-content {
    width: min(340px, 92vw) !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow-y: auto !important;
    background: color-mix(in srgb, var(--card) 96%, black) !important;
    border-left: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
    box-shadow: -12px 0 36px rgba(0, 0, 0, 0.55) !important;
    border-radius: 0 !important;
    padding: 18px 20px 24px !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
  }

  #root main .mve-filter-footer,
  .mve-explore .mve-filter-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-top: auto !important;
    padding-top: 16px !important;
    border-top: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
    position: sticky !important;
    bottom: 0 !important;
    background: color-mix(in srgb, var(--card) 96%, black) !important;
    z-index: 10 !important;
  }

  #root main .mve-filter-footer button,
  .mve-explore .mve-filter-footer button {
    height: 38px !important;
    border-radius: 9px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 0 16px !important;
    cursor: pointer !important;
  }

  #root main .mve-filter-footer button.mve-primary,
  .mve-explore .mve-filter-footer button.mve-primary {
    background: var(--primary) !important;
    color: var(--primary-foreground) !important;
    border: none !important;
  }
}

@media (max-width: 767px) {
  #root main .mve-heading,
  .mve-explore .mve-heading {
    padding: 16px 18px !important;
    border-radius: 12px !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  #root main .mve-heading .mve-heading-actions,
  .mve-explore .mve-heading .mve-heading-actions {
    width: 100% !important;
  }

  #root main .mve-secondary.mve-random,
  .mve-explore .mve-secondary.mve-random {
    width: 100% !important;
    justify-content: center !important;
  }

  #root main .mve-toolbar,
  .mve-explore .mve-toolbar {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  #root main .mve-toolbar .mve-search,
  .mve-explore .mve-toolbar .mve-search {
    width: 100% !important;
    flex: none !important;
  }

  #root main .mve-toolbar .mve-sort-control,
  .mve-explore .mve-toolbar .mve-sort-control,
  #root main .mve-toolbar .mve-select,
  .mve-explore .mve-toolbar .mve-select {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }

  #root main .mve-toolbar .mve-sort-control .mve-sort-text,
  .mve-explore .mve-toolbar .mve-sort-control .mve-sort-text {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  #root main .mve-toolbar .mve-sort-control .mve-sort-val,
  .mve-explore .mve-toolbar .mve-sort-control .mve-sort-val {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #root main .mve-toolbar .mve-select select,
  .mve-explore .mve-toolbar .mve-select select {
    width: 100% !important;
  }

  #root main .mve-toolbar .mve-filter-toggle,
  .mve-explore .mve-toolbar .mve-filter-toggle {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    justify-content: center !important;
  }

  /* Critical Mobile Fix: Segmented status tabs stack cleanly above controls */
  #root main .mve-results-toolbar,
  .mve-explore .mve-results-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  #root main .mve-quick-filters,
  .mve-explore .mve-quick-filters {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  #root main .mve-status-tabs,
  .mve-explore .mve-status-tabs {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  #root main .mve-pill-prefix,
  .mve-explore .mve-pill-prefix {
    flex-shrink: 0 !important;
    padding: 0 4px 0 8px !important;
  }

  #root main .mve-status-tabs button,
  .mve-explore .mve-status-tabs button {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 6px 4px !important;
    font-size: 11.5px !important;
  }

  #root main .mve-library-filter,
  .mve-explore .mve-library-filter {
    width: 100% !important;
    justify-content: center !important;
    padding: 7px 12px !important;
  }

  #root main .mve-result-controls,
  .mve-explore .mve-result-controls {
    width: 100% !important;
    justify-content: space-between !important;
  }

  /* 2-Column Mobile Book Grid */
  #root main .mve-books-covers,
  .mve-explore .mve-books-covers {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 12px !important;
  }
}

@media (max-width: 480px) {
  #root main .mve-books-covers,
  .mve-explore .mve-books-covers {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px 10px !important;
  }

  #root main .mve-book.mve-book-cards,
  .mve-explore .mve-book.mve-book-cards {
    grid-template-columns: 76px 1fr !important;
    padding: 10px !important;
  }

  #root main .mve-book.mve-book-cards .mve-book-actions,
  .mve-explore .mve-book.mve-book-cards .mve-book-actions {
    grid-column: 1 / -1 !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    margin-top: 6px !important;
  }

  #root main .mve-book.mve-book-list,
  .mve-explore .mve-book.mve-book-list {
    grid-template-columns: 64px 1fr !important;
    padding: 10px 12px !important;
  }

  #root main .mve-book.mve-book-list .mve-book-actions,
  .mve-explore .mve-book.mve-book-list .mve-book-actions {
    grid-column: 1 / -1 !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    margin-top: 6px !important;
  }
}

@media (max-width: 360px) {
  #root main .mve-heading h1,
  .mve-explore .mve-heading h1 {
    font-size: 22px !important;
  }

  #root main .mve-pill-prefix,
  .mve-explore .mve-pill-prefix {
    display: none !important;
  }

  #root main .mve-books-covers,
  .mve-explore .mve-books-covers {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px 8px !important;
  }

  #root main .mve-status-tabs button,
  .mve-explore .mve-status-tabs button {
    padding: 5px 2px !important;
    font-size: 10.5px !important;
  }
}

/* ==========================================================================
   SECTION 16: CONVERSATION & REVIEW SYSTEM LUXURY OVERHAUL (.mv-conversation)
   Modern Subtle Specification · Compact, stylish, subtle, calm in every palette,
   iOS-grade micro-segmented controls, radiant golden star ratings, and hairline
   thread architecture with zero boxed-comment clutter.
   ========================================================================== */

/* 1. Root & Heading Architecture */
#root main .mv-conversation,
.mv-conversation {
  color: var(--foreground) !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  gap: 12px !important;
  -webkit-font-smoothing: antialiased;
}

#root main .mv-talk-heading,
.mv-talk-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
}

#root main .mv-talk-heading > h2,
.mv-talk-heading > h2 {
  font-size: 14.5px !important;
  font-weight: 650 !important;
  letter-spacing: -0.01em !important;
  color: var(--foreground) !important;
}

/* Micro-segmented Switcher (Series discussion vs Reader reviews) */
#root main .mv-talk-segments,
.mv-talk-segments {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 2.5px !important;
  background: color-mix(in srgb, var(--muted) 55%, var(--background)) !important;
  border: 1px solid color-mix(in srgb, var(--border) 50%, transparent) !important;
  border-radius: 9px !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

#root main .mv-talk-segments button,
.mv-talk-segments button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 29px !important;
  height: 29px !important;
  padding: 4px 10px !important;
  border-radius: 7px !important;
  font-size: 11.5px !important;
  font-weight: 550 !important;
  color: var(--muted-foreground) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.15s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#root main .mv-talk-segments button:hover,
.mv-talk-segments button:hover {
  color: var(--foreground) !important;
  background: color-mix(in srgb, var(--card) 45%, transparent) !important;
}

#root main .mv-talk-segments button[aria-pressed='true'],
.mv-talk-segments button[aria-pressed='true'] {
  color: var(--foreground) !important;
  background: var(--card) !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07), 0 0 0 1px color-mix(in srgb, var(--border) 70%, transparent) !important;
}

#root main .mv-talk-segments button > svg,
.mv-talk-segments button > svg {
  width: 13px !important;
  height: 13px !important;
  color: currentColor !important;
  opacity: 0.85 !important;
}

#root main .mv-talk-segments button[aria-pressed='true'] > svg {
  color: var(--primary) !important;
  opacity: 1 !important;
}

#root main .mv-talk-segment-count,
.mv-talk-segment-count {
  font-size: 9.5px !important;
  font-weight: 650 !important;
  font-variant-numeric: tabular-nums !important;
  padding: 1.5px 6px !important;
  border-radius: 9999px !important;
  background: color-mix(in srgb, var(--primary) 10%, transparent) !important;
  color: var(--primary) !important;
  line-height: 1.2 !important;
}

#root main .mv-talk-segments button[aria-pressed='true'] .mv-talk-segment-count {
  background: color-mix(in srgb, var(--primary) 16%, transparent) !important;
  color: var(--primary) !important;
}

/* 2. Compact Dropdowns (Sort & Rating filter) */
#root main .mv-conversation select,
.mv-conversation select,
#root main .mv-talk-heading select,
#root main .mv-talk-review-filter select {
  min-height: 30px !important;
  height: 30px !important;
  padding: 0 26px 0 10px !important;
  font-size: 11px !important;
  font-weight: 550 !important;
  line-height: 30px !important;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  border-radius: 7px !important;
  background-color: color-mix(in srgb, var(--card) 80%, var(--background)) !important;
  color: var(--foreground) !important;
  cursor: pointer !important;
  max-width: 136px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 11px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  transition: all 0.15s ease !important;
}

#root main .mv-conversation select:hover {
  border-color: color-mix(in srgb, var(--primary) 40%, var(--border)) !important;
}

#root main .mv-conversation select:focus,
#root main .mv-conversation select:focus-visible {
  outline: none !important;
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border)) !important;
  box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

/* 3. Modern Compact Glass Composer */
#root main .mv-talk-composer,
.mv-talk-composer {
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, color-mix(in srgb, var(--card) 85%, transparent), color-mix(in srgb, var(--card) 55%, var(--background))) !important;
  padding: 12px 14px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

#root main .mv-talk-composer:focus-within,
.mv-talk-composer:focus-within {
  border-color: color-mix(in srgb, var(--primary) 60%, var(--border)) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05), 0 0 0 2.5px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

/* Strip inner borders from textarea inside composer */
#root main .mv-talk-composer textarea,
#root main .mv-conversation textarea,
.mv-talk-composer textarea {
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  border-radius: 0 !important;
  outline: none !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--foreground) !important;
  font-size: 12.5px !important;
  line-height: 1.65 !important;
  padding: 4px 2px 8px !important;
}

#root main .mv-talk-composer:not(.is-review):not(.is-reply) textarea {
  min-height: 72px !important;
  height: 72px !important;
}

#root main .mv-talk-composer.is-review textarea {
  min-height: 96px !important;
  height: 96px !important;
}

#root main .mv-talk-composer.is-reply textarea {
  min-height: 60px !important;
  height: 60px !important;
}

/* Review Headline Input */
#root main .mv-conversation .mv-talk-review-title,
.mv-conversation .mv-talk-review-title {
  width: 100% !important;
  min-height: 32px !important;
  height: 32px !important;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  background: color-mix(in srgb, var(--background) 50%, var(--card)) !important;
  color: var(--foreground) !important;
  border-radius: 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 10px !important;
  margin: 2px 0 8px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
}

#root main .mv-conversation .mv-talk-review-title:focus {
  border-color: color-mix(in srgb, var(--primary) 70%, var(--border)) !important;
  box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--primary) 12%, transparent) !important;
}

/* 4. Radiant Gold Stars & Rating Picker */
#root main .mv-talk-stars,
.mv-talk-stars {
  display: inline-flex !important;
  align-items: center !important;
  gap: 2.5px !important;
  color: color-mix(in srgb, var(--border) 75%, transparent) !important;
}

#root main .mv-talk-stars svg,
.mv-talk-stars svg {
  width: 13px !important;
  height: 13px !important;
}

#root main .mv-talk-stars .is-filled,
#root main .mv-talk-stars .is-filled svg,
.mv-talk-stars .is-filled,
.mv-talk-stars .is-filled svg {
  color: #f59e0b !important;
  fill: #f59e0b !important;
}

#root main .mv-talk-rating-picker button,
.mv-talk-rating-picker button {
  width: 30px !important;
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px !important;
  border: 1px solid color-mix(in srgb, var(--border) 65%, transparent) !important;
  background: color-mix(in srgb, var(--muted) 45%, var(--card)) !important;
  color: color-mix(in srgb, var(--muted-foreground) 80%, transparent) !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.15s ease !important;
}

#root main .mv-talk-rating-picker button:hover {
  color: #f59e0b !important;
  border-color: color-mix(in srgb, #f59e0b 35%, var(--border)) !important;
  background: color-mix(in srgb, #f59e0b 8%, var(--card)) !important;
  transform: scale(1.04) !important;
}

#root main .mv-talk-rating-picker button.is-selected {
  color: #f59e0b !important;
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border)) !important;
  background: color-mix(in srgb, #f59e0b 12%, var(--card)) !important;
  box-shadow: 0 1px 6px rgba(245, 158, 11, 0.18) !important;
}

#root main .mv-talk-rating-value {
  font-size: 11px !important;
  font-weight: 650 !important;
  color: #f59e0b !important;
  margin-left: 2px !important;
}

/* 5. Review Overview Breakdown Card (Compact, Balanced, Subtle) */
#root main .mv-talk-review-overview,
.mv-talk-review-overview {
  display: grid !important;
  grid-template-columns: 100px minmax(140px, 1fr) auto !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 14px 18px !important;
  border: 1px solid color-mix(in srgb, var(--border) 65%, transparent) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--card) 85%, transparent), color-mix(in srgb, var(--card) 60%, var(--background))) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

#root main .mv-talk-average > strong {
  font-size: 30px !important;
  letter-spacing: -0.04em !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  color: var(--foreground) !important;
}

#root main .mv-talk-distribution button,
.mv-talk-distribution button {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) 22px !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 20px !important;
  height: 20px !important;
  font-size: 10.5px !important;
  font-weight: 550 !important;
  color: var(--muted-foreground) !important;
  padding: 1px 4px !important;
  border-radius: 5px !important;
  background: transparent !important;
  border: 0 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

#root main .mv-talk-distribution button:hover {
  background: color-mix(in srgb, var(--muted) 40%, transparent) !important;
  color: var(--foreground) !important;
}

#root main .mv-talk-distribution button[aria-pressed='true'] {
  color: var(--primary) !important;
  font-weight: 650 !important;
  background: color-mix(in srgb, var(--primary) 8%, transparent) !important;
}

#root main .mv-talk-rating-track,
.mv-talk-rating-track {
  height: 4px !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  background: color-mix(in srgb, var(--muted) 75%, transparent) !important;
}

#root main .mv-talk-rating-track > span,
.mv-talk-rating-track > span {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #f59e0b, #fbbf24) !important;
  border-radius: 9999px !important;
}

/* 6. Comment and Review Hairline Thread Items (Neutralizing Depth.css Boxed Cards) */
#root main .mv-talk-list > .mv-talk-item,
#root main .mv-talk-item,
.mv-talk-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 13px 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 45%, transparent) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#root main .mv-talk-list > .mv-talk-item:hover,
#root main .mv-talk-item:hover {
  border-color: color-mix(in srgb, var(--border) 60%, transparent) !important;
  background: transparent !important;
}

#root main .mv-talk-list > .mv-talk-item:first-child,
#root main .mv-talk-item:first-child {
  padding-top: 6px !important;
}

#root main .mv-talk-list > .mv-talk-item:last-child,
#root main .mv-talk-item:last-child {
  border-bottom: 0 !important;
}

#root main .mv-talk-author > strong {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--foreground) !important;
}

#root main .mv-talk-content > p {
  font-size: 12.5px !important;
  line-height: 1.68 !important;
  color: var(--foreground) !important;
}

#root main .mv-talk-review h3 {
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
  margin: 4px 0 3px !important;
  color: var(--foreground) !important;
}

/* 7. Action Buttons */
#root main .mv-talk-primary,
.mv-talk-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 30px !important;
  height: 30px !important;
  padding: 5px 13px !important;
  border: 1px solid var(--primary) !important;
  border-radius: 7px !important;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  box-shadow: 0 1px 5px color-mix(in srgb, var(--primary) 25%, transparent) !important;
  transition: all 0.15s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#root main .mv-talk-primary:hover {
  background: var(--primary-hover) !important;
  transform: translateY(-0.5px) !important;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--primary) 35%, transparent) !important;
}

#root main .mv-talk-primary:active {
  transform: translateY(0) !important;
}

#root main .mv-talk-primary:disabled {
  opacity: 0.45 !important;
  cursor: default !important;
  transform: none !important;
  box-shadow: none !important;
}

#root main .mv-talk-action,
#root main .mv-talk-reply-toggle,
.mv-talk-action,
.mv-talk-reply-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 26px !important;
  height: 26px !important;
  padding: 2px 7px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 550 !important;
  color: var(--muted-foreground) !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

#root main .mv-talk-action:hover,
#root main .mv-talk-reply-toggle:hover {
  color: var(--foreground) !important;
  background: color-mix(in srgb, var(--muted) 50%, transparent) !important;
}

#root main .mv-talk-action[aria-pressed='true'] {
  color: var(--primary) !important;
  background: color-mix(in srgb, var(--primary) 9%, transparent) !important;
  font-weight: 600 !important;
}

/* 8. Responsive Adjustments */
@media (max-width: 1050px) {
  #root main .mv-talk-review-overview {
    grid-template-columns: 95px minmax(0, 1fr) !important;
    gap: 14px !important;
  }
  #root main .mv-talk-review-overview > .mv-talk-primary {
    grid-column: 1 / -1 !important;
    justify-self: start !important;
    width: 100% !important;
  }
}

@media (max-width: 640px) {
  #root main .mv-talk-review-overview {
    padding: 12px 14px !important;
    grid-template-columns: 88px minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  #root main .mv-talk-average > strong {
    font-size: 26px !important;
  }
}

@media (max-width: 479px) {
  #root main .mv-talk-heading {
    flex-wrap: wrap !important;
    gap: 6px !important;
  }
  #root main .mv-talk-segments {
    width: auto !important;
    flex: 1 !important;
  }
  #root main .mv-talk-segments button {
    padding: 4px 6px !important;
    gap: 4px !important;
    font-size: 10.5px !important;
    min-height: 28px !important;
    height: 28px !important;
  }
  #root main .mv-talk-heading > select {
    width: 106px !important;
    max-width: 106px !important;
    flex: 0 0 106px !important;
    font-size: 10.5px !important;
    padding: 0 22px 0 7px !important;
  }
  #root main .mv-talk-composer {
    padding: 10px 12px !important;
    border-radius: 10px !important;
  }
  #root main .mv-talk-item {
    gap: 8px !important;
    padding: 11px 0 !important;
  }
  #root main .mv-talk-content > p {
    font-size: 11.5px !important;
    line-height: 1.62 !important;
  }
  #root main .mv-talk-review-overview {
    padding: 10px 12px !important;
    grid-template-columns: 80px minmax(0, 1fr) !important;
    gap: 10px !important;
  }
  #root main .mv-talk-average > strong {
    font-size: 24px !important;
  }
}

@media (max-width: 340px) {
  #root main .mv-talk-segments button {
    padding: 3px 4px !important;
    font-size: 9.5px !important;
  }
  #root main .mv-talk-segment-count {
    padding: 1px 4px !important;
    font-size: 9px !important;
  }
  #root main .mv-talk-heading > select {
    width: 92px !important;
    max-width: 92px !important;
    flex: 0 0 92px !important;
    font-size: 9.5px !important;
  }
  #root main .mv-talk-review-overview {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  #root main .mv-talk-average {
    align-items: center !important;
    text-align: center !important;
    width: 100% !important;
  }
}

/* ==========================================================================
   SECTION 17: FLOATING QUICK READING NAVIGATION DOCK (.mv-story-quick-nav)
   Inspired by Cherrymist's ergonomic responsive floating dock architecture:
   - Desktop (>= 768px): Centered pill (max-w-[560px], fixed bottom-4), pointer-events-none outer, pointer-events-auto inner.
   - Mobile (< 768px): Fixed inset-x-3 bottom-3 z-50 with safe-area-inset padding, rounded-full geometry.
   ========================================================================== */

/* 1. Desktop Dock Wrapper */
.mv-story-quick-nav-desktop {
  display: block !important;
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 1rem !important; /* bottom-4 */
  z-index: 40 !important;
  pointer-events: none !important;
  animation: mvFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

@media (max-width: 767px) {
  .mv-story-quick-nav-desktop {
    display: none !important;
  }
}

/* 2. Mobile Dock Wrapper */
.mv-story-quick-nav-mobile {
  display: block !important;
  position: fixed !important;
  left: 0.75rem !important; /* inset-x-3 */
  right: 0.75rem !important;
  bottom: 0.75rem !important; /* bottom-3 */
  z-index: 50 !important;
  animation: mvFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) both !important;
  padding-bottom: max(0px, calc(env(safe-area-inset-bottom) - 0.75rem)) !important;
}

@media (min-width: 768px) {
  .mv-story-quick-nav-mobile {
    display: none !important;
  }
}

/* 3. The Pill Card */
.mv-quick-nav-pill {
  width: 100% !important;
  max-width: 560px !important;
  margin-inline: auto !important;
  pointer-events: auto !important;
  border-radius: 9999px !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.38), 0 0 0 1px color-mix(in srgb, var(--primary) 12%, transparent) !important;
  display: flex !important;
  align-items: center !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-story-quick-nav-desktop .mv-quick-nav-pill {
  height: 64px !important;
  padding-inline: 12px !important;
}

.mv-story-quick-nav-mobile .mv-quick-nav-pill {
  height: 68px !important;
  padding-inline: 10px !important;
}

/* Inner elements container */
.mv-quick-nav-row {
  position: relative !important;
  width: 100% !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

@media (min-width: 768px) {
  .mv-quick-nav-row {
    gap: 10px !important;
  }
}

/* 4. Circular Progress Indicator (44x44) */
.mv-quick-nav-progress {
  position: relative !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  flex-shrink: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-progress:hover {
  transform: scale(1.06) !important;
}

.mv-quick-nav-progress:active {
  transform: scale(0.94) !important;
}

.mv-quick-nav-progress svg {
  transform: rotate(-90deg) !important;
  width: 44px !important;
  height: 44px !important;
}

.mv-quick-nav-progress .stroke-muted {
  stroke: color-mix(in srgb, var(--muted-foreground) 25%, transparent) !important;
}

.mv-quick-nav-progress .stroke-primary {
  stroke: var(--primary) !important;
  transition: stroke-dashoffset 0.5s ease-out !important;
}

.mv-quick-nav-progress span {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--primary) !important;
  letter-spacing: -0.02em !important;
}

/* 5. Primary Start / Continue Reading Button */
.mv-quick-nav-cta {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 9999px !important;
  background: var(--primary) !important;
  color: var(--primary-foreground, #0d0f14) !important;
  font-size: 13.5px !important;
  font-weight: 650 !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px -3px color-mix(in srgb, var(--primary) 50%, transparent) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-cta:hover {
  background: color-mix(in srgb, var(--primary) 92%, #fff) !important;
  transform: scale(1.02) !important;
  box-shadow: 0 6px 20px -3px color-mix(in srgb, var(--primary) 65%, transparent) !important;
}

.mv-quick-nav-cta:active {
  transform: scale(0.98) !important;
}

.mv-quick-nav-cta svg {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}

/* 6. Notification / Track Bell Button */
.mv-quick-nav-track {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  flex-shrink: 0 !important;
  border-radius: 9999px !important;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  color: var(--foreground) !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-track:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  transform: scale(1.02) !important;
}

.mv-quick-nav-track:active {
  transform: scale(0.98) !important;
}

.mv-quick-nav-track[aria-pressed="true"],
.mv-quick-nav-track.is-tracked {
  border-color: color-mix(in srgb, var(--primary) 55%, transparent) !important;
  background: color-mix(in srgb, var(--primary) 15%, transparent) !important;
  color: var(--primary) !important;
  box-shadow: 0 0 12px color-mix(in srgb, var(--primary) 25%, transparent) !important;
}

.mv-quick-nav-track svg {
  width: 16px !important;
  height: 16px !important;
}

/* 7. Library / Shelf Button */
.mv-quick-nav-library {
  height: 44px !important;
  min-height: 44px !important;
  flex-shrink: 0 !important;
  border-radius: 9999px !important;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent) !important;
  background: color-mix(in srgb, var(--card) 60%, transparent) !important;
  color: var(--foreground) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 13px !important;
  cursor: pointer !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.mv-quick-nav-library:hover {
  background: color-mix(in srgb, var(--card) 85%, transparent) !important;
  border-color: color-mix(in srgb, var(--primary) 50%, transparent) !important;
  transform: scale(1.02) !important;
}

.mv-quick-nav-library:active {
  transform: scale(0.98) !important;
}

.mv-quick-nav-library.is-saved {
  border-color: color-mix(in srgb, var(--primary) 40%, transparent) !important;
  background: color-mix(in srgb, var(--primary) 14%, transparent) !important;
  color: var(--primary) !important;
}

.mv-quick-nav-library svg {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}

/* 8. Hide global mobile bottom nav on story detail pages to avoid obstruction */
body:has(.mv-story-quick-nav) nav[aria-label="Mobile"],
.mv-story-page-active nav[aria-label="Mobile"] {
  display: none !important;
}

/* Story page bottom padding clearance */
.mv-story-page,
.mv-series {
  padding-bottom: 96px !important;
}

@media (max-width: 767px) {
  .mv-story-page,
  .mv-series {
    padding-bottom: 110px !important;
  }
  .mv-quick-nav-cta {
    font-size: 12px !important;
    padding: 0 10px !important;
    gap: 5px !important;
  }
  .mv-quick-nav-cta svg {
    width: 14px !important;
    height: 14px !important;
  }
  .mv-quick-nav-track {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
  .mv-quick-nav-library {
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 10px !important;
    gap: 4px !important;
  }
  .mv-quick-nav-progress {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
}

@media (max-width: 360px) {
  .mv-quick-nav-pill {
    padding-inline: 6px !important;
  }
  .mv-quick-nav-row {
    gap: 5px !important;
  }
  .mv-quick-nav-progress {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }
  .mv-quick-nav-progress svg {
    width: 38px !important;
    height: 38px !important;
  }
  .mv-quick-nav-progress circle {
    cx: 19 !important;
    cy: 19 !important;
    r: 17.5 !important;
  }
  .mv-quick-nav-cta {
    font-size: 11.5px !important;
    padding: 0 8px !important;
  }
  .mv-quick-nav-track {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }
  .mv-quick-nav-library {
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 8px !important;
  }
}





/* === Layer: moonverse-refined.css === */
/* ==========================================================================
   Moonverse — Refined finishing layer (v2 · final cascade layer)
   --------------------------------------------------------------------------
   Load order: linked LAST in index.html, after moonverse-modern-subtle.css.
   Do not move it earlier: several rules deliberately win cascade ties.

   Scope (design-improvement pass, 2026-10-25):
     1. Typographic rhythm        — tracking calibrated, balanced wraps
     2. Featured shelf floors     — covers never shrink below readable size
     3. Curated collections       — 3/2+banner/1 bands, zero orphan holes
     4. Browse + bazaar floors    — consistent card minimums, sane mobile bands
     5. Story workspace           — grid no longer stretches equal-height
     6. Reading dock geometry     — pill centred over the CONTENT column only
     7. Community segmented bar   — scrollable, never truncating
     8. Touch ergonomics          — coarse-pointer chip targets ≥ 40px
     9. Continuous polish         — focus rings, whisper scrollbars, mono avatars

   Token-driven: --card / --border / --foreground / --primary … so the layer
   keeps working under every theme. Everything here is orthogonal to the
   existing 21-layer cascade and is intentionally orthogonal-safe.
   ========================================================================== */

/* — 1 · Typographic rhythm ------------------------------------------------
   The display serif shipped -0.045em tracking which crushes serifs at 28px;
   recalibrated to -0.018em. Section labels drop from -0.03em to -0.012em.
   Balanced wrapping removes orphan words from headings. */

main h1 { letter-spacing: -0.018em !important; text-wrap: balance; }
main h2, main h3 { letter-spacing: -0.012em !important; text-wrap: balance; }
main p { text-wrap: pretty; }
main :is(strong, b) { text-wrap: balance; }

/* — 2 · Featured shelf (home) — floors by band -----------------------------
   ≥1024 : grid of ≥150px cells (was a fixed 7-up squeeze at narrow widths)
   760-fill : 170px cells
   <760 : horizontal snap-carousel with clamp() card width */

@media (min-width: 1024px) {
  .mv-index-feature-grid {
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)) !important;
    gap: 14px !important;
  }
}
@media (min-width: 760px) and (max-width: 1023px) {
  .mv-index-feature-grid {
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)) !important;
    gap: 12px !important;
  }
}
@media (max-width: 759px) {
  .mv-index-feature-grid {
    grid-auto-columns: clamp(150px, 42vw, 190px) !important;
    gap: 10px !important;
  }
}

/* — 3 · Curated collections — orphan-proof bands ---------------------------
   ≥880 : three abreast;  700–879 : pairs with the last odd card as a full
   banner;  <700 : single column. No more lone card under two. */

@media (min-width: 880px) {
  .mv-index-collection-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (min-width: 700px) and (max-width: 879px) {
  .mv-index-collection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .mv-index-collection-grid > *:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.mv-index-collection-grid { gap: 14px !important; margin-top: 14px !important; }

/* — 4 · Browse covers + bazaar catalog — readable floors ------------------- */

@media (min-width: 760px) {
  #root main .mve-books-covers,
  .mve-explore .mve-books-covers {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 158px), 1fr)) !important;
  }
}
@media (max-width: 759px) {
  #root main .mve-books-covers,
  .mve-explore .mve-books-covers {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 148px), 1fr)) !important;
  }
}
.mww-catalog {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 152px), 1fr)) !important;
  gap: 12px !important;
}

/* — 5 · Story workspace — natural column heights ---------------------------
   modern-subtle already anchors .mv-series-workspace with align-items:start
   at ID strength; nothing to add here. (Reserved slot kept for numbering.) */

/* — 6 · Reading dock — centred over the CONTENT column ---------------------
   The two-column story layout (.mv-series-workspace: content + 260px aside
   with an 18px gap, modern-subtle ID-level) lives at every width ≥ 768px.
   Because the column pair is container-symmetric, the content column's
   centre is always viewport-centre − 139px — independent of page padding or
   container capping. Shifting the fixed wrapper left by 278px yields exact
   centrement; the pill is capped to the content column so it can never poke
   off-screen at the 768px entry width. */

@media (min-width: 768px) {
  .mv-story-quick-nav-desktop {
    left: -278px !important;
    right: 0 !important;
  }
  .mv-story-quick-nav-desktop .mv-quick-nav-pill {
    max-width: min(560px, calc(100vw - 334px)) !important;
  }
}
.mv-story-quick-nav-desktop .mv-quick-nav-pill,
.mv-story-quick-nav-mobile .mv-quick-nav-pill {
  width: 100% !important;
  max-width: 560px !important;
  border-radius: 18px;
  background: color-mix(in srgb, var(--card) 84%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 14%, var(--border)) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.35);
  backdrop-filter: blur(14px) saturate(1.35);
  box-shadow:
    0 10px 30px color-mix(in srgb, #000 15%, transparent),
    0 2px 8px color-mix(in srgb, #000 10%, transparent);
}

/* — 7 · Community tab bar — never truncating -------------------------------
   modern-subtle ships the Pavilion tab bar as an always-3-up segmented track
   (#root-level, !important): fine on desktop, clipping at phone widths.
   Mirroring its exact selectors at a later cascade position, the tabs stack
   full-width below 640px — complete labels, generous targets. */

@media (max-width: 640px) {
  #root main .mv-page-community [role="tablist"],
  #root main .mv-page-community .grid.grid-cols-3 {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-rows: minmax(38px, auto) !important;
  }
  #root main .mv-page-community [role="tablist"] [role="tab"],
  #root main .mv-page-community .grid.grid-cols-3 > button {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

/* — 8 · Touch ergonomics — generous chip targets --------------------------- */

@media (pointer: coarse) {
  .mv-index-genre { min-height: 40px !important; }
  .mww-catalog a, .mww-catalog button { min-height: 40px; }
}

/* — 9 · Continuous polish ------------------------------------------------- */

/* Consistent focus affordance where nothing else defines one */
:where(main a, main button, main summary, main [tabindex]):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--primary) 60%, transparent);
  outline-offset: 2px;
}

/* Whisper scrollbars on horizontal rails */
:where(.mv-index-feature-grid, .mv-index-genres, .mve-books-covers) {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--primary) 28%, var(--border)) transparent;
}

/* Curator avatar failure → monogram disc (JS swaps the img for this span) */
.mvd-curator-monogram {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  font-family: var(--font-ui, inherit);
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
  color: color-mix(in srgb, var(--primary) 72%, var(--card));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--primary) 16%, var(--card)), color-mix(in srgb, var(--primary) 5%, var(--card)));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border) 80%, transparent);
}