/* ai-to-wordpress v6 - scoped under .uc-atw. Built from the Next.js app at app/ai-to-wordpress (localhost:3777), NOT from public/ucwr/. Every rule is wrapped in :where(.uc-atw) so page-internal specificity is unchanged while nothing can match outside the page. Classes that collide with #uichemy-globals are renamed with the ucx- prefix in HTML, CSS and JS together. See memory new-uichemy-design-system-isolation. */ @layer properties;@layer theme, base, components, utilities; .uc-atw{font-size:16px;font-family:var(--font-zalando-sans);} :where(.uc-atw) :is(h1,h2,h3,h4,h5,h6){margin:0;} :where(.uc-atw) :is(h1,h2,h3,h4,h5,h6).\!mt-3{ margin-top: calc(var(--spacing) * 3) !important; }:where(.uc-atw) :is(h1,h2,h3,h4,h5,h6).mt-2\.5{ margin-top: calc(var(--spacing) * 2.5); }:where(.uc-atw) :is(h1,h2,h3,h4,h5,h6).mt-3{ margin-top: calc(var(--spacing) * 3); }:where(.uc-atw) :is(h1,h2,h3,h4,h5,h6).\!mb-0{ margin-bottom: calc(var(--spacing) * 0) !important; }:where(.uc-atw) :is(h1,h2,h3,h4,h5,h6).leading-\[50px\]{ --tw-leading: 50px; line-height: 50px; } :where(.uc-atw) .lenis:not(.lenis-autoToggle).lenis-stopped{ overflow: clip; }:where(.uc-atw) .lenis [data-lenis-prevent], :where(.uc-atw) .lenis [data-lenis-prevent-wheel], :where(.uc-atw) .lenis [data-lenis-prevent-touch], :where(.uc-atw) .lenis [data-lenis-prevent-vertical], :where(.uc-atw) .lenis [data-lenis-prevent-horizontal]{ overscroll-behavior: contain; }:where(.uc-atw) .lenis.lenis-smooth iframe{ pointer-events: none; }:where(.uc-atw) .lenis.lenis-autoToggle{ transition-property: overflow; transition-duration: 1ms; transition-behavior: allow-discrete; }@layer theme{.uc-atw{ --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-red-50: oklch(97.1% 0.013 17.38); --color-red-100: oklch(93.6% 0.032 17.717); --color-red-200: oklch(88.5% 0.062 18.334); --color-red-500: oklch(63.7% 0.237 25.331); --color-red-600: oklch(57.7% 0.245 27.325); --color-red-800: oklch(44.4% 0.177 26.899); --color-orange-100: oklch(95.4% 0.038 75.164); --color-orange-500: oklch(70.5% 0.213 47.604); --color-orange-600: oklch(64.6% 0.222 41.116); --color-amber-50: oklch(98.7% 0.022 95.277); --color-yellow-100: oklch(97.3% 0.071 103.193); --color-yellow-500: oklch(79.5% 0.184 86.047); --color-yellow-600: oklch(68.1% 0.162 75.834); --color-green-50: oklch(98.2% 0.018 155.826); --color-green-100: oklch(96.2% 0.044 156.743); --color-green-200: oklch(92.5% 0.084 155.995); --color-green-500: oklch(72.3% 0.219 149.579); --color-green-600: oklch(62.7% 0.194 149.214); --color-green-800: oklch(44.8% 0.119 151.328); --color-emerald-400: oklch(76.5% 0.177 163.223); --color-blue-100: oklch(93.2% 0.032 255.585); --color-blue-500: oklch(62.3% 0.214 259.815); --color-blue-600: oklch(54.6% 0.245 262.881); --color-indigo-100: oklch(93% 0.034 272.788); --color-indigo-500: oklch(58.5% 0.233 277.117); --color-violet-100: oklch(94.3% 0.029 294.588); --color-violet-600: oklch(54.1% 0.281 293.009); --color-purple-50: oklch(97.7% 0.014 308.299); --color-purple-500: oklch(62.7% 0.265 303.9); --color-purple-600: oklch(55.8% 0.288 302.321); --color-purple-700: oklch(49.6% 0.265 301.924); --color-gray-50: oklch(98.5% 0.002 247.839); --color-gray-100: oklch(96.7% 0.003 264.542); --color-gray-200: oklch(92.8% 0.006 264.531); --color-gray-300: oklch(87.2% 0.01 258.338); --color-gray-400: oklch(70.7% 0.022 261.325); --color-gray-500: oklch(55.1% 0.027 264.364); --color-gray-600: oklch(44.6% 0.03 256.802); --color-gray-700: oklch(37.3% 0.034 259.733); --color-gray-900: oklch(21% 0.034 264.665); --color-zinc-800: oklch(27.4% 0.006 286.033); --color-zinc-900: oklch(21% 0.006 285.885); --color-zinc-950: oklch(14.1% 0.005 285.823); --color-neutral-50: oklch(98.5% 0 0); --color-neutral-200: oklch(92.2% 0 0); --color-neutral-300: oklch(87% 0 0); --color-neutral-400: oklch(70.8% 0 0); --color-neutral-500: oklch(55.6% 0 0); --color-neutral-700: oklch(37.1% 0 0); --color-neutral-800: oklch(26.9% 0 0); --color-black: #000; --color-white: #fff; --spacing: 0.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-7xl: 80rem; --text-xs: 0.75rem; --text-xs--line-height: calc(1 / 0.75); --text-sm: 0.875rem; --text-sm--line-height: calc(1.25 / 0.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); --text-5xl: 3rem; --text-5xl--line-height: 1; --text-6xl: 3.75rem; --text-6xl--line-height: 1; --text-7xl: 4.5rem; --text-7xl--line-height: 1; --font-weight-light: 300; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --font-weight-extrabold: 800; --tracking-tighter: -0.05em; --tracking-tight: -0.025em; --tracking-normal: 0em; --tracking-wide: 0.025em; --tracking-wider: 0.05em; --tracking-widest: 0.1em; --leading-tight: 1.25; --leading-snug: 1.375; --leading-normal: 1.5; --leading-relaxed: 1.625; --radius-xs: 4px; --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --shadow-sm: 0 1px 2px 0 #1018280f; --shadow-md: 0 4px 2px -2px #1018280f; --shadow-lg: 0 4px 6px -2px #10182808; --ease-in: cubic-bezier(0.4, 0, 1, 1); --ease-out: cubic-bezier(0, 0, 0.2, 1); --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); --animate-spin: spin 1s linear infinite; --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; --blur-sm: 8px; --blur-md: 12px; --blur-xl: 24px; --blur-2xl: 40px; --aspect-video: 16 / 9; --default-transition-duration: 150ms; --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); --font-zalando-sans: "Zalando Sans", sans-serif; --font-nanum-pen: "Nanum Pen Script", cursive; --color-sprout-color-primary-lightest: #fff1eb; --color-sprout-color-primary-lighter: #ffb89a; --color-sprout-color-primary: #fd6a35; --color-sprout-color-primary-darker: #cc4b23; --color-uc-dark: var(--color-sprout-color-background-dark); --color-uc-dark-card: var(--color-sprout-color-background-weaker-2); --color-sprout-color-secondary-lightest: #f2eeff; --color-sprout-color-secondary-lighter: #b8a9ff; --color-sprout-color-secondary: #5202fd; --color-sprout-color-background-weaker: #ffffff; --color-sprout-color-background-weaker-2: rgba(255, 255, 255, 0.1); --color-sprout-color-background-default: #f4f4f4; --color-sprout-color-background-stronger: #ebebeb; --color-sprout-color-background-strongest: #e3e3ed; --color-sprout-color-background-dark: #171717; --color-sprout-color-background-dark-2: #202020; --color-sprout-color-background-blue: #3600af; --color-sprout-color-text-default: #0a0a0a; --color-sprout-color-text-weaker: #737373; --color-sprout-color-text-weakest: #a3a3a3; --color-sprout-color-text-stronger: #171717; --color-sprout-color-text-disabled: #737373; --color-sprout-color-text-white: #ffffff; --color-sprout-color-border-weak: #e5e5e5; --color-sprout-color-border-default: #d4d4d4; --color-sprout-color-border-dark-weak: #737373; --color-sprout-color-border-dark-default: #404040; --color-sprout-color-success: #2ea343; --color-sprout-color-success-darker: #0a842a; --color-sprout-color-secondary-darker: #3600af; --color-sprout-color-error-lightest: #fff2ef; --color-sprout-color-error: #f65258; --color-primary: var(--primary); --color-titlelight: #0d0d0d; --color-neutral: #d6d6d6; --shadow-sprout-2xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05); --shadow-sprout-xs: 0 1px 3px 0 rgba(0, 0, 0, 0.1); --radius-sprout-12: 12px; --radius-sprout-infinite: 9999px; --spacing-sprout-8: 8px; --spacing-sprout-10: 10px; --spacing-sprout-12: 12px; --spacing-sprout-16: 16px; --spacing-sprout-20: 20px; --spacing-sprout-24: 24px; --spacing-sprout-32: 32px; --spacing-sprout-40: 40px; --spacing-sprout-48: 48px; --spacing-sprout-56: 56px; --spacing-sprout-64: 64px; --spacing-sprout-80: 80px; --color-border: var(--border); }}@layer base{:where(.uc-atw), :where(.uc-atw) *, :where(.uc-atw) *::after, :where(.uc-atw) *::before, :where(.uc-atw) *::backdrop, :where(.uc-atw) *::file-selector-button{ box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; }:where(.uc-atw){ line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; }:where(.uc-atw) hr{ height: 0; color: inherit; border-top-width: 1px; }:where(.uc-atw) abbr:where([title]){ -webkit-text-decoration: underline dotted; text-decoration: underline dotted; }:where(.uc-atw) h1, :where(.uc-atw) h2, :where(.uc-atw) h3, :where(.uc-atw) h4, :where(.uc-atw) h5, :where(.uc-atw) h6{ font-size: inherit; font-weight: inherit; }:where(.uc-atw) a{ color: inherit; -webkit-text-decoration: inherit; text-decoration: inherit; }:where(.uc-atw) b, :where(.uc-atw) strong{ font-weight: bolder; }:where(.uc-atw) code, :where(.uc-atw) kbd, :where(.uc-atw) samp, :where(.uc-atw) 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; }:where(.uc-atw) small{ font-size: 80%; }:where(.uc-atw) sub, :where(.uc-atw) sup{ font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }:where(.uc-atw) sub{ bottom: -0.25em; }:where(.uc-atw) sup{ top: -0.5em; }:where(.uc-atw) table{ text-indent: 0; border-color: inherit; border-collapse: collapse; }:where(.uc-atw) :-moz-focusring{ outline: auto; }:where(.uc-atw) progress{ vertical-align: baseline; }:where(.uc-atw) summary{ display: list-item; }:where(.uc-atw) ol, :where(.uc-atw) ul, :where(.uc-atw) menu{ list-style: none; }:where(.uc-atw) img, :where(.uc-atw) svg, :where(.uc-atw) video, :where(.uc-atw) canvas, :where(.uc-atw) audio, :where(.uc-atw) iframe, :where(.uc-atw) embed, :where(.uc-atw) object{ display: block; vertical-align: middle; }:where(.uc-atw) img, :where(.uc-atw) video{ max-width: 100%; height: auto; }:where(.uc-atw) button, :where(.uc-atw) input, :where(.uc-atw) select, :where(.uc-atw) optgroup, :where(.uc-atw) textarea, :where(.uc-atw) ::file-selector-button{ font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; border-radius: 0; background-color: transparent; opacity: 1; }:where(.uc-atw) :where(select:is([multiple], [size])) optgroup{ font-weight: bolder; }:where(.uc-atw) :where(select:is([multiple], [size])) optgroup option{ padding-inline-start: 20px; }:where(.uc-atw) ::file-selector-button{ margin-inline-end: 4px; }:where(.uc-atw) ::placeholder{ opacity: 1; }@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px){:where(.uc-atw) ::placeholder{ color: currentcolor; @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, currentcolor 50%, transparent); } }}:where(.uc-atw) textarea{ resize: vertical; }:where(.uc-atw) ::-webkit-search-decoration{ -webkit-appearance: none; }:where(.uc-atw) ::-webkit-date-and-time-value{ min-height: 1lh; text-align: inherit; }:where(.uc-atw) ::-webkit-datetime-edit{ display: inline-flex; }:where(.uc-atw) ::-webkit-datetime-edit-fields-wrapper{ padding: 0; }:where(.uc-atw) ::-webkit-datetime-edit, :where(.uc-atw) ::-webkit-datetime-edit-year-field, :where(.uc-atw) ::-webkit-datetime-edit-month-field, :where(.uc-atw) ::-webkit-datetime-edit-day-field, :where(.uc-atw) ::-webkit-datetime-edit-hour-field, :where(.uc-atw) ::-webkit-datetime-edit-minute-field, :where(.uc-atw) ::-webkit-datetime-edit-second-field, :where(.uc-atw) ::-webkit-datetime-edit-millisecond-field, :where(.uc-atw) ::-webkit-datetime-edit-meridiem-field{ padding-block: 0; }:where(.uc-atw) ::-webkit-calendar-picker-indicator{ line-height: 1; }:where(.uc-atw) :-moz-ui-invalid{ box-shadow: none; }:where(.uc-atw) button, :where(.uc-atw) input:where([type="button"], [type="reset"], [type="submit"]), :where(.uc-atw) ::file-selector-button{ appearance: button; }:where(.uc-atw) ::-webkit-inner-spin-button, :where(.uc-atw) ::-webkit-outer-spin-button{ height: auto; }:where(.uc-atw) [hidden]:where(:not([hidden="until-found"])){ display: none !important; }}@layer utilities{:where(.uc-atw) .absolute{ position: absolute; }:where(.uc-atw) .relative{ position: relative; }:where(.uc-atw) .inset-0{ inset: calc(var(--spacing) * 0); }:where(.uc-atw) .top-1\/2{ top: calc(1/2 * 100%); }:where(.uc-atw) .top-3{ top: calc(var(--spacing) * 3); }:where(.uc-atw) .top-full{ top: 100%; }:where(.uc-atw) .right-3{ right: calc(var(--spacing) * 3); }:where(.uc-atw) .left-1\/2{ left: calc(1/2 * 100%); }:where(.uc-atw) .isolate{ isolation: isolate; }:where(.uc-atw) .z-10{ z-index: 10; }:where(.uc-atw) .z-20{ z-index: 20; }:where(.uc-atw) .-mx-6{ margin-inline: calc(var(--spacing) * -6); }:where(.uc-atw) .mx-1{ margin-inline: calc(var(--spacing) * 1); }:where(.uc-atw) .mx-6{ margin-inline: calc(var(--spacing) * 6); }:where(.uc-atw) .mx-auto{ margin-inline: auto; }:where(.uc-atw) .-my-1\.5{ margin-block: calc(var(--spacing) * -1.5); }:where(.uc-atw) .\!mt-3{ margin-top: calc(var(--spacing) * 3) !important; }:where(.uc-atw) .mt-2\.5{ margin-top: calc(var(--spacing) * 2.5); }:where(.uc-atw) .mt-3{ margin-top: calc(var(--spacing) * 3); }:where(.uc-atw) .mt-6{ margin-top: calc(var(--spacing) * 6); }:where(.uc-atw) .mt-10{ margin-top: calc(var(--spacing) * 10); }:where(.uc-atw) .mt-\[52px\]{ margin-top: 52px; }:where(.uc-atw) .mt-auto{ margin-top: auto; }:where(.uc-atw) .mt-sprout-8{ margin-top: var(--spacing-sprout-8); }:where(.uc-atw) .mt-sprout-12{ margin-top: var(--spacing-sprout-12); }:where(.uc-atw) .mt-sprout-48{ margin-top: var(--spacing-sprout-48); }:where(.uc-atw) .\!mb-0{ margin-bottom: calc(var(--spacing) * 0) !important; }:where(.uc-atw) .-mb-6{ margin-bottom: calc(var(--spacing) * -6); }:where(.uc-atw) .mb-1{ margin-bottom: calc(var(--spacing) * 1); }:where(.uc-atw) .mb-sprout-16{ margin-bottom: var(--spacing-sprout-16); }:where(.uc-atw) .mb-sprout-24{ margin-bottom: var(--spacing-sprout-24); }:where(.uc-atw) .block{ display: block; }:where(.uc-atw) .flex{ display: flex; }:where(.uc-atw) .grid{ display: grid; }:where(.uc-atw) .hidden{ display: none; }:where(.uc-atw) .aspect-\[16\/10\]{ aspect-ratio: 16/10; }:where(.uc-atw) .aspect-video{ aspect-ratio: var(--aspect-video); }:where(.uc-atw) .h-10{ height: calc(var(--spacing) * 10); }:where(.uc-atw) .h-11{ height: calc(var(--spacing) * 11); }:where(.uc-atw) .h-\[18px\]{ height: 18px; }:where(.uc-atw) .h-\[22px\]{ height: 22px; }:where(.uc-atw) .h-\[214px\]{ height: 214px; }:where(.uc-atw) .h-\[560px\]{ height: 560px; }:where(.uc-atw) .h-\[660px\]{ height: 660px; }:where(.uc-atw) .h-full{ height: 100%; }:where(.uc-atw) .h-px{ height: 1px; }:where(.uc-atw) .w-10{ width: calc(var(--spacing) * 10); }:where(.uc-atw) .w-11{ width: calc(var(--spacing) * 11); }:where(.uc-atw) .w-\[18px\]{ width: 18px; }:where(.uc-atw) .w-\[22px\]{ width: 22px; }:where(.uc-atw) .w-full{ width: 100%; }:where(.uc-atw) .w-px{ width: 1px; }:where(.uc-atw) .max-w-\[300px\]{ max-width: 300px; }:where(.uc-atw) .max-w-\[340px\]{ max-width: 340px; }:where(.uc-atw) .max-w-\[441px\]{ max-width: 441px; }:where(.uc-atw) .max-w-\[701px\]{ max-width: 701px; }:where(.uc-atw) .max-w-\[760px\]{ max-width: 760px; }:where(.uc-atw) .max-w-\[1325px\]{ max-width: 1325px; }:where(.uc-atw) .flex-1{ flex: 1; }:where(.uc-atw) .shrink-0{ flex-shrink: 0; }:where(.uc-atw) .-translate-x-1\/2{ --tw-translate-x: calc(calc(1/2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); }:where(.uc-atw) .-translate-y-1\/2{ --tw-translate-y: calc(calc(1/2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); }:where(.uc-atw) .list-none{ list-style-type: none; }:where(.uc-atw) .grid-cols-1{ grid-template-columns: repeat(1, minmax(0, 1fr)); }:where(.uc-atw) .flex-col{ flex-direction: column; }:where(.uc-atw) .place-items-center{ place-items: center; }:where(.uc-atw) .items-center{ align-items: center; }:where(.uc-atw) .items-start{ align-items: flex-start; }:where(.uc-atw) .justify-between{ justify-content: space-between; }:where(.uc-atw) .gap-2\.5{ gap: calc(var(--spacing) * 2.5); }:where(.uc-atw) .gap-3{ gap: calc(var(--spacing) * 3); }:where(.uc-atw) .gap-3\.5{ gap: calc(var(--spacing) * 3.5); }:where(.uc-atw) .gap-4{ gap: calc(var(--spacing) * 4); }:where(.uc-atw) .gap-8{ gap: calc(var(--spacing) * 8); }:where(.uc-atw) .gap-sprout-16{ gap: var(--spacing-sprout-16); }:where(.uc-atw) .self-stretch{ align-self: stretch; }:where(.uc-atw) .overflow-hidden{ overflow: hidden; }:where(.uc-atw) .rounded-\[10px\]{ border-radius: 10px; }:where(.uc-atw) .rounded-\[16px\]{ border-radius: 16px; }:where(.uc-atw) .rounded-\[20px\]{ border-radius: 20px; }:where(.uc-atw) .rounded-\[24px\]{ border-radius: 24px; }:where(.uc-atw) .rounded-full{ border-radius: calc(infinity * 1px); }:where(.uc-atw) .rounded-sprout-12{ border-radius: var(--radius-sprout-12); }:where(.uc-atw) .border{ border-style: var(--tw-border-style); border-width: 1px; }:where(.uc-atw) .border-\[\#e5e5e5\]{ border-color: #e5e5e5; }:where(.uc-atw) .border-sprout-color-border-weak{ border-color: var(--color-sprout-color-border-weak); }:where(.uc-atw) .bg-\[\#171717\]{ background-color: #171717; }:where(.uc-atw) .bg-\[\#e5e5e5\]{ background-color: #e5e5e5; }:where(.uc-atw) .bg-\[\#f4f4f4\]{ background-color: #f4f4f4; }:where(.uc-atw) .bg-black\/55{ background-color: color-mix(in srgb, #000 55%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-black) 55%, transparent); } }:where(.uc-atw) .bg-sprout-color-background-default{ background-color: var(--color-sprout-color-background-default); }:where(.uc-atw) .bg-sprout-color-background-stronger{ background-color: var(--color-sprout-color-background-stronger); }:where(.uc-atw) .bg-sprout-color-background-weaker{ background-color: var(--color-sprout-color-background-weaker); }:where(.uc-atw) .object-cover{ object-fit: cover; }:where(.uc-atw) .p-0{ padding: calc(var(--spacing) * 0); }:where(.uc-atw) .p-6{ padding: calc(var(--spacing) * 6); }:where(.uc-atw) .p-8{ padding: calc(var(--spacing) * 8); }:where(.uc-atw) .p-\[9px\]{ padding: 9px; }:where(.uc-atw) .p-sprout-20{ padding: var(--spacing-sprout-20); }:where(.uc-atw) .px-3{ padding-inline: calc(var(--spacing) * 3); }:where(.uc-atw) .py-sprout-8{ padding-block: var(--spacing-sprout-8); }:where(.uc-atw) .pt-0\.5{ padding-top: calc(var(--spacing) * 0.5); }:where(.uc-atw) .pt-3\.5{ padding-top: calc(var(--spacing) * 3.5); }:where(.uc-atw) .pt-10{ padding-top: calc(var(--spacing) * 10); }:where(.uc-atw) .pb-2\.5{ padding-bottom: calc(var(--spacing) * 2.5); }:where(.uc-atw) .text-center{ text-align: center; }:where(.uc-atw) .font-zalando-sans{ font-family: var(--font-zalando-sans); }:where(.uc-atw) .text-\[12px\]{ font-size: 12px; }:where(.uc-atw) .text-\[16px\]{ font-size: 16px; }:where(.uc-atw) .text-\[18px\]{ font-size: 18px; }:where(.uc-atw) .text-\[48px\]{ font-size: 48px; }:where(.uc-atw) .leading-6{ --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); }:where(.uc-atw) .leading-7{ --tw-leading: calc(var(--spacing) * 7); line-height: calc(var(--spacing) * 7); }:where(.uc-atw) .leading-\[50px\]{ --tw-leading: 50px; line-height: 50px; }:where(.uc-atw) .leading-tight{ --tw-leading: var(--leading-tight); line-height: var(--leading-tight); }:where(.uc-atw) .\!font-light{ --tw-font-weight: var(--font-weight-light) !important; font-weight: var(--font-weight-light) !important; }:where(.uc-atw) .font-medium{ --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); }:where(.uc-atw) .font-semibold{ --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); }:where(.uc-atw) .\!tracking-\[-\.03em\]{ --tw-tracking: -.03em !important; letter-spacing: -.03em !important; }:where(.uc-atw) .tracking-\[-\.01em\]{ --tw-tracking: -.01em; letter-spacing: -.01em; }:where(.uc-atw) .tracking-\[-\.03em\]{ --tw-tracking: -.03em; letter-spacing: -.03em; }:where(.uc-atw) .tracking-\[2px\]{ --tw-tracking: 2px; letter-spacing: 2px; }:where(.uc-atw) .whitespace-nowrap{ white-space: nowrap; }:where(.uc-atw) .\!text-sprout-color-primary{ color: var(--color-sprout-color-primary) !important; }:where(.uc-atw) .\!text-sprout-color-text-default{ color: var(--color-sprout-color-text-default) !important; }:where(.uc-atw) .text-sprout-color-primary{ color: var(--color-sprout-color-primary); }:where(.uc-atw) .text-sprout-color-text-default{ color: var(--color-sprout-color-text-default); }:where(.uc-atw) .text-sprout-color-text-weaker{ color: var(--color-sprout-color-text-weaker); }:where(.uc-atw) .no-underline{ text-decoration-line: none; }:where(.uc-atw) .shadow-\[0_2px_6px_-3px_rgba\(16\,24\,40\,\.18\)\]{ --tw-shadow: 0 2px 6px -3px var(--tw-shadow-color, rgba(16,24,40,.18)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); }:where(.uc-atw) .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); }:where(.uc-atw) .ring-white\/20{ --tw-ring-color: color-mix(in srgb, #fff 20%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-white) 20%, transparent); } }:where(.uc-atw) .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,); }:where(.uc-atw) .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)); }:where(.uc-atw) .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)); }:where(.uc-atw) .duration-200{ --tw-duration: 200ms; transition-duration: 200ms; }:where(.uc-atw) .group-hover\:scale-110{ &:is(:where(.group):hover *) { @media (hover: hover) { --tw-scale-x: 110%; --tw-scale-y: 110%; --tw-scale-z: 110%; scale: var(--tw-scale-x) var(--tw-scale-y); } } }:where(.uc-atw) .hover\:border-sprout-color-border-default{ &:hover { @media (hover: hover) { border-color: var(--color-sprout-color-border-default); } } }:where(.uc-atw) .md\:block{ @media (width >= 48rem) { display: block; } }:where(.uc-atw) .md\:grid-cols-2{ @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }:where(.uc-atw) .md\:grid-cols-3{ @media (width >= 48rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }:where(.uc-atw) .lg\:block{ @media (width >= 64rem) { display: block; } }:where(.uc-atw) .lg\:grid-cols-3{ @media (width >= 64rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }:where(.uc-atw) .lg\:flex-row{ @media (width >= 64rem) { flex-direction: row; } }:where(.uc-atw) .lg\:items-end{ @media (width >= 64rem) { align-items: flex-end; } }:where(.uc-atw) .lg\:justify-between{ @media (width >= 64rem) { justify-content: space-between; } }:where(.uc-atw) .night\:border-white\/10{ &:is(.uc-night *) { border-color: color-mix(in srgb, #fff 10%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-white) 10%, transparent); } } }:where(.uc-atw) .night\:bg-\[\#1f1f1f\]{ &:is(.uc-night *) { background-color: #1f1f1f; } }:where(.uc-atw) .night\:bg-white\/\[\.08\]{ &:is(.uc-night *) { background-color: color-mix(in srgb, #fff 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 8%, transparent); } } }:where(.uc-atw) .\[\&\>svg\]\:mt-\[2px\]{ &>svg { margin-top: 2px; } }:where(.uc-atw) .\[\&\>svg\]\:h-\[18px\]{ &>svg { height: 18px; } }:where(.uc-atw) .\[\&\>svg\]\:w-\[18px\]{ &>svg { width: 18px; } }:where(.uc-atw) .\[\&\>svg\]\:shrink-0{ &>svg { flex-shrink: 0; } }}@property --tw-animation-delay{ syntax: "*"; inherits: false; initial-value: 0s; }@property --tw-animation-direction{ syntax: "*"; inherits: false; initial-value: normal; }@property --tw-animation-duration{ syntax: "*"; inherits: false; }@property --tw-animation-fill-mode{ syntax: "*"; inherits: false; initial-value: none; }@property --tw-animation-iteration-count{ syntax: "*"; inherits: false; initial-value: 1; }@property --tw-enter-blur{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-enter-opacity{ syntax: "*"; inherits: false; initial-value: 1; }@property --tw-enter-rotate{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-enter-scale{ syntax: "*"; inherits: false; initial-value: 1; }@property --tw-enter-translate-x{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-enter-translate-y{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-exit-blur{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-exit-opacity{ syntax: "*"; inherits: false; initial-value: 1; }@property --tw-exit-rotate{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-exit-scale{ syntax: "*"; inherits: false; initial-value: 1; }@property --tw-exit-translate-x{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-exit-translate-y{ syntax: "*"; inherits: false; initial-value: 0; }:where(.uc-atw).uc-night .uc-logo-figma, :where(.uc-atw).uc-night .uc-logo-figma:hover{ filter: brightness(0) invert(1) !important; }.uc-atw{ --radius: 0.625rem; --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); --color-bg-sprout-color-secondary: #6a35ff; --color-bg-sprout-color-secondary-light: #7a4bff; --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); }:where(.uc-atw) .dark{ --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.205 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.205 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.922 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.704 0.191 22.216); --border: oklch(1 0 0 / 10%); --input: oklch(1 0 0 / 15%); --ring: oklch(0.556 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(1 0 0 / 10%); --sidebar-ring: oklch(0.556 0 0); }:where(.uc-atw) .prose-content img{ border-radius: 12px; margin-top: 2.5rem; margin-bottom: 2.5rem; box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1); display: block; max-width: none; width: calc(100% + 340px); margin-left: -120px; margin-right: -120px; }@media (max-width: 1024px){:where(.uc-atw) .prose-content img{ width: calc(100% + 120px); margin-left: -60px; margin-right: -60px; }}@media (max-width: 768px){:where(.uc-atw) .prose-content img{ width: 100%; margin-left: 0; margin-right: 0; }}:where(.uc-atw) .hero-gradient-fade{ mask-image: linear-gradient(to bottom, black 0%, black 20%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.2) 75%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, black 0%, black 20%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0.2) 75%, transparent 100%); }:where(.uc-atw) .hero-image-mask{ mask-image: linear-gradient(to bottom, black 0%, black 70%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, black 0%, black 70%, transparent 100%); }@media (min-width: 768px){:where(.uc-atw) .hero-image-mask{ mask-image: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, black 5%, black 85%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, black 5%, black 85%, transparent 100%); }}@keyframes gradientCycle1{ 0%, 5% { opacity: 0.85; } 28%, 38% { opacity: 0; } 66%, 76% { opacity: 0; } 90%, 100% { opacity: 0.85; } }@keyframes gradientCycle2{ 0%, 5% { opacity: 0; } 28%, 38% { opacity: 0.85; } 66%, 76% { opacity: 0; } 90%, 100% { opacity: 0; } }@keyframes gradientCycle3{ 0%, 5% { opacity: 0; } 28%, 38% { opacity: 0; } 66%, 76% { opacity: 0.85; } 90%, 100% { opacity: 0; } }:where(.uc-atw) .animate-gradient-cycle-1{ animation: gradientCycle1 9s ease-in-out infinite; }:where(.uc-atw) .animate-gradient-cycle-2{ animation: gradientCycle2 9s ease-in-out infinite; }:where(.uc-atw) .animate-gradient-cycle-3{ animation: gradientCycle3 9s ease-in-out infinite; }@keyframes float-diagonal{ 0%, 100% { transform: translate(0, 0); } 25% { transform: translate(30px, -20px); } 50% { transform: translate(60px, 0); } 75% { transform: translate(30px, 20px); } }@keyframes float-vertical{ 0%, 100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, -40px); } }@keyframes float-circular{ 0%, 100% { transform: translate(0, 0); } 25% { transform: translate(-30px, -30px); } 50% { transform: translate(-60px, 0); } 75% { transform: translate(-30px, 30px); } }@keyframes panelIn{ from { opacity: 0; transform: translateY(-12px) scale(0.98); } to { opacity: 1; transform: translateY(0) scale(1); } }:where(.uc-atw) .animate-panel-in{ animation: panelIn 300ms cubic-bezier(0.4, 0, 0.2, 1); }@keyframes gravityDrop{ 0% { opacity: 0; transform: translate3d(0, -150px, 0) rotate(calc(var(--tilt, 0deg) - 7deg)); animation-timing-function: cubic-bezier(0.45, 0, 0.9, 0.65); } 12% { opacity: 1; } 50% { transform: translate3d(0, 0, 0) rotate(calc(var(--tilt, 0deg) + 1.6deg)); animation-timing-function: cubic-bezier(0.15, 0.6, 0.35, 1); } 64% { transform: translate3d(0, -13px, 0) rotate(var(--tilt, 0deg)); animation-timing-function: cubic-bezier(0.6, 0, 0.9, 0.6); } 78% { transform: translate3d(0, 0, 0) rotate(calc(var(--tilt, 0deg) + 0.5deg)); animation-timing-function: cubic-bezier(0.15, 0.6, 0.35, 1); } 88% { transform: translate3d(0, -4px, 0) rotate(var(--tilt, 0deg)); animation-timing-function: cubic-bezier(0.6, 0, 0.9, 0.6); } 100% { opacity: 1; transform: translate3d(0, 0, 0) rotate(var(--tilt, 0deg)); } }:where(.uc-atw) .animate-gravity-drop{ animation: gravityDrop 1100ms both; will-change: transform, opacity; }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .animate-gravity-drop{ animation: none; opacity: 1; transform: rotate(var(--tilt, 0deg)); }}@layer base{:where(.uc-atw), :where(.uc-atw) *{ border-color: var(--border); outline-color: var(--ring); @supports (color: color-mix(in lab, red, red)) { outline-color: color-mix(in oklab, var(--ring) 50%, transparent); } }.uc-atw{ background-color: var(--background); color: var(--foreground); overflow-x: clip; max-width: 100%; }html:has(.uc-atw)::-webkit-scrollbar, body:has(.uc-atw)::-webkit-scrollbar{ width: 14px; background: transparent; }html:has(.uc-atw)::-webkit-scrollbar-track, body:has(.uc-atw)::-webkit-scrollbar-track{ background: transparent; }html:has(.uc-atw)::-webkit-scrollbar-thumb, body:has(.uc-atw)::-webkit-scrollbar-thumb{ background-color: #b0b0b0; border-radius: 9999px; border: 4px solid transparent; background-clip: content-box; min-height: 48px; }html:has(.uc-atw)::-webkit-scrollbar-thumb:hover, body:has(.uc-atw)::-webkit-scrollbar-thumb:hover{ background-color: #8a8a8a; }html:has(.uc-atw)::-webkit-scrollbar-button:single-button, body:has(.uc-atw)::-webkit-scrollbar-button:single-button{ background-repeat: no-repeat; background-position: center; background-size: 8px; height: 14px; width: 14px; }html:has(.uc-atw)::-webkit-scrollbar-button:single-button:vertical:decrement, body:has(.uc-atw)::-webkit-scrollbar-button:single-button:vertical:decrement{ background-image: url("data:image/svg+xml;utf8,"); }html:has(.uc-atw)::-webkit-scrollbar-button:single-button:vertical:increment, body:has(.uc-atw)::-webkit-scrollbar-button:single-button:vertical:increment{ background-image: url("data:image/svg+xml;utf8,"); }@supports not selector(::-webkit-scrollbar){.uc-atw{ scrollbar-width: thin; scrollbar-color: #b0b0b0 transparent; }}:where(.uc-atw) ::selection{ background-color: rgba(82, 2, 253, 0.18) !important; }:where(.uc-atw) ::-moz-selection{ background-color: rgba(82, 2, 253, 0.18) !important; }}@font-face{ font-family: "Zalando Sans"; src: url("/wp-content/uploads/2026/09/fonts-ZalandoSans-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }@font-face{ font-family: "Zalando Sans"; src: url("/wp-content/uploads/2026/09/fonts-ZalandoSans-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }@font-face{ font-family: "Zalando Sans"; src: url("/wp-content/uploads/2026/09/fonts-ZalandoSans-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }@font-face{ font-family: "Zalando Sans"; src: url("/wp-content/uploads/2026/09/fonts-ZalandoSans-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }@layer utilities{}@media (max-width: 1024px){:where(.uc-atw) .sprout-heading-2xl-semibold{ font-size: 60px; line-height: 70px; }:where(.uc-atw) .sprout-heading-lg-medium{ font-size: 32px; line-height: 44px; }:where(.uc-atw) .sprout-heading-md-medium{ font-size: 28px; line-height: 36px; }:where(.uc-atw) .sprout-heading-xs-medium{ font-size: 20px; line-height: 28px; }:where(.uc-atw) .sprout-body-md-regular, :where(.uc-atw) .sprout-body-md-medium, :where(.uc-atw) .sprout-body-md-semibold, :where(.uc-atw) .sprout-body-md-regular-italic{ font-size: 15px; line-height: 22px; }:where(.uc-atw) .sprout-body-sm-medium, :where(.uc-atw) .sprout-body-sm-regular, :where(.uc-atw) .sprout-body-sm-semibold{ font-size: 13px; line-height: 18px; }:where(.uc-atw) .sprout-container{ padding: 60px 15px; }}@media (max-width: 768px){:where(.uc-atw) .sprout-heading-2xl-semibold{ font-size: 48px; line-height: 56px; }:where(.uc-atw) .sprout-heading-lg-medium{ font-size: 28px; line-height: 30px; }:where(.uc-atw) .sprout-heading-md-medium{ font-size: 24px; line-height: 32px; }:where(.uc-atw) .sprout-heading-xs-medium{ font-size: 18px; line-height: 24px; }:where(.uc-atw) .sprout-body-md-regular, :where(.uc-atw) .sprout-body-md-medium, :where(.uc-atw) .sprout-body-md-semibold, :where(.uc-atw) .sprout-body-md-regular-italic{ font-size: 14px; line-height: 20px; }:where(.uc-atw) .sprout-body-sm-regular, :where(.uc-atw) .sprout-body-sm-medium, :where(.uc-atw) .sprout-body-sm-semibold{ font-size: 12px; line-height: 16px; }:where(.uc-atw) .sprout-container{ padding: 40px 15px; }:where(.uc-atw) .footer-container{ padding: 15px; }}@keyframes scrollUp{ 0% { transform: translateY(0%); } 100% { transform: translateY(-50%); } }@keyframes scrollDown{ 0% { transform: translateY(-50%); } 100% { transform: translateY(0%); } }:where(.uc-atw) .animate-scrollUp{ animation: scrollUp 20s linear infinite; }:where(.uc-atw) .animate-scrollDown{ animation: scrollDown 20s linear infinite; }:where(.uc-atw) input::placeholder, :where(.uc-atw) textarea::placeholder{ color: inherit; opacity: 0.5; }@keyframes marquee{ 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }:where(.uc-atw) .animate-marquee{ animation: marquee 15s linear infinite; }@keyframes marquee-reverse{ 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } }:where(.uc-atw) .animate-marquee-reverse{ animation: marquee-reverse 15s linear infinite; }@keyframes dotsFlicker{ 0%, 100% { opacity: 0.35; } 20% { opacity: 0.8; } 45% { opacity: 0.5; } 70% { opacity: 1; } }.uc-atw{ --uc-container-max: 1320px; --uc-gutter: 40px; --uc-section-y: 120px; --uc-space-1: 4px; --uc-space-2: 6px; --uc-space-3: 8px; --uc-space-4: 10px; --uc-space-5: 12px; --uc-space-6: 16px; --uc-space-8: 24px; --uc-space-12: 32px; --uc-col-narrow: 560px; --uc-col-wide: 880px; }:where(.uc-atw) .ucx-uc-container{ max-width: var(--uc-container-max); margin-inline: auto; padding-inline: var(--uc-gutter); }:where(.uc-atw) .uc-section{ padding-block: var(--uc-section-y); }:where(.uc-atw) .uc-section-lg{ padding-block: 152px 112px; }@media (max-width: 1024px){.uc-atw{ --uc-gutter: 32px; }}@media (max-width: 768px){.uc-atw{ --uc-gutter: 20px; --uc-section-y: 72px; }:where(.uc-atw) .uc-section-lg{ padding-block: 88px 64px; }}:where(.uc-atw) .ds-display{ font-weight: 500; font-size: 40px; line-height: 40px; letter-spacing: -.4px; color: var(--color-sprout-color-text-default); }@media (min-width: 768px){:where(.uc-atw) .ds-display{ font-size: 64px; line-height: 62px; letter-spacing: -1.3px; }}:where(.uc-atw) .ds-h2{ font-weight: 500; font-size: 28px; line-height: 30px; letter-spacing: -.28px; color: var(--color-sprout-color-text-default); }@media (min-width: 768px){:where(.uc-atw) .ds-h2{ font-size: 36px; line-height: 38px; letter-spacing: -.36px; }}:where(.uc-atw) .ds-t28{ font-weight: 500; font-size: 28px; line-height: 30px; letter-spacing: -.28px; color: var(--color-sprout-color-text-default); }:where(.uc-atw) .ds-t24{ font-weight: 500; font-size: 30px; line-height: 34px; letter-spacing: -.3px; color: var(--color-sprout-color-text-default); }:where(.uc-atw) .ds-t18{ font-weight: 600; font-size: 18px; line-height: 24px; letter-spacing: -.18px; color: var(--color-sprout-color-text-default); }:where(.uc-atw) .ds-lead{ font-weight: 500; font-size: 18px; line-height: 24px; letter-spacing: -.18px; color: var(--color-sprout-color-text-weaker); }:where(.uc-atw) .ds-body{ font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: -.16px; color: var(--color-sprout-color-text-weaker); }:where(.uc-atw) .ds-caption{ font-weight: 500; font-size: 12px; line-height: 18px; letter-spacing: -.16px; color: var(--color-sprout-color-text-weaker); }:where(.uc-atw) .ds-caption-regular{ font-weight: 400; }:where(.uc-atw) .ds-overline{ font-weight: 500; font-size: 12px; line-height: 16px; letter-spacing: .2px; color: var(--color-sprout-color-text-weaker); }:where(.uc-atw) .ds-fine{ font-weight: 400; font-size: 12px; line-height: 18px; color: var(--color-sprout-color-text-weakest); }@keyframes uc-text-shine{ 0% { background-position: 100% 0%; } 100% { background-position: -200% 0%; } }:where(.uc-atw) .uc-note{ font-family: var(--font-nanum-pen), cursive; font-size: 18px; line-height: 1; background: linear-gradient(110deg, var(--color-sprout-color-text-weakest) 0%, var(--color-sprout-color-text-weakest) 42%, var(--color-sprout-color-text-default) 50%, var(--color-sprout-color-text-weakest) 58%, var(--color-sprout-color-text-weakest) 100%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: uc-text-shine 7s linear 5s infinite; }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .uc-note{ animation: none; }}@property --uc-angle{ syntax: ""; initial-value: 0deg; inherits: false; }@keyframes uc-eyebrow-rotate{ to { --uc-angle: 360deg; } }:where(.uc-atw) .uc-eyebrow{ position: relative; isolation: isolate; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 9999px; background: var(--color-sprout-color-background-weaker); box-shadow: var(--shadow-sprout-xs); }:where(.uc-atw) .uc-eyebrow::before{ content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: conic-gradient(from var(--uc-angle), var(--color-sprout-color-border-weak) 0deg, var(--color-sprout-color-border-weak) 40deg, var(--color-sprout-color-primary) 95deg, var(--color-sprout-color-secondary) 150deg, var(--color-sprout-color-border-weak) 210deg, var(--color-sprout-color-border-weak) 360deg); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: uc-eyebrow-rotate 4s linear infinite; pointer-events: none; }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .uc-eyebrow::before{ animation: none; }}:where(.uc-atw) .uc-btn{ display: inline-flex; align-items: center; justify-content: center; gap: .5rem; height: 36px; padding-inline: 16px; border-radius: 10px; font-weight: 500; font-size: 14px; letter-spacing: -.07px; cursor: pointer; border: 1px solid transparent; white-space: nowrap; transition: background .2s, box-shadow .2s, color .2s, border-color .2s, transform .18s cubic-bezier(.2,.7,.2,1); }:where(.uc-atw) .uc-btn-primary{ background: var(--color-sprout-color-primary); color: #fff; box-shadow: var(--shadow-sprout-xs); }:where(.uc-atw) .uc-btn-primary:hover{ background: var(--color-sprout-color-primary-darker); transform: translateY(-1px); }:where(.uc-atw) .uc-btn-secondary{ background: var(--color-sprout-color-secondary); color: #fff; box-shadow: var(--shadow-sprout-xs); }:where(.uc-atw) .uc-btn-secondary:hover{ background: var(--color-sprout-color-secondary-darker); transform: translateY(-1px); }:where(.uc-atw) .uc-btn-dark{ background: var(--color-sprout-color-text-default); color: #fff; box-shadow: var(--shadow-sprout-xs); }:where(.uc-atw) .uc-btn-dark:hover{ background: #000; transform: translateY(-1px); }:where(.uc-atw) .uc-btn-wire{ background: var(--color-sprout-color-background-weaker); border-color: var(--color-sprout-color-border-default); color: var(--color-sprout-color-text-default); box-shadow: var(--shadow-sprout-2xs); }:where(.uc-atw) .uc-btn-wire:hover{ background: var(--color-sprout-color-background-stronger); transform: translateY(-1px); }:where(.uc-atw) .uc-btn-soft{ background: var(--color-sprout-color-primary-lightest); color: var(--color-sprout-color-primary-darker); }:where(.uc-atw) .uc-btn-soft:hover{ background: var(--color-sprout-color-primary-lighter); }:where(.uc-atw) .uc-btn-lg{ height: 46px; padding-inline: 22px; font-size: 15px; border-radius: 12px; }:where(.uc-atw) .uc-btn-wire-dark{ background: transparent; border-color: rgba(255,255,255,.3); color: #fff; }:where(.uc-atw) .uc-btn-wire-dark:hover{ border-color: #fff; transform: translateY(-1px); }:where(.uc-atw) .uc-badge{ font-style: normal; font-size: 12px; line-height: 16px; font-weight: 500; padding: 2px 8px; border-radius: 9999px; white-space: nowrap; color: var(--color-sprout-color-primary-darker); background: var(--color-sprout-color-primary-lightest); }:where(.uc-atw) .uc-badge-soon{ color: var(--color-sprout-color-background-blue); background: var(--color-sprout-color-secondary-lightest); }:where(.uc-atw) .uc-badge-soon-dark{ color: #fff; background: rgba(255,255,255,.15); }:where(.uc-atw) .uc-account{ border: 1.5px solid rgba(2,1,8,.2); }:where(.uc-atw) .uc-account:hover{ border-color: var(--color-sprout-color-text-default); }:where(.uc-atw) .uc-card-dark{ background: var(--color-uc-dark-card); border: 1px solid rgba(255,255,255,.1); transition: transform .22s cubic-bezier(.2,.7,.2,1), border-color .22s; }:where(.uc-atw) .uc-card-dark:hover{ border-color: color-mix(in srgb, #fd6a35 60%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in srgb, var(--color-sprout-color-primary) 60%, transparent); } }:where(.uc-atw) .uc-chip-primary{ color: var(--color-sprout-color-primary); background: color-mix(in srgb, #fd6a35 12%, #ffffff); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-primary) 12%, var(--color-sprout-color-background-weaker)); } }:where(.uc-atw) .uc-chip-secondary{ color: var(--color-sprout-color-secondary); background: color-mix(in srgb, #5202fd 12%, #ffffff); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-secondary) 12%, var(--color-sprout-color-background-weaker)); } }:where(.uc-atw) .uc-chip-blue{ color: var(--color-sprout-color-background-blue); background: color-mix(in srgb, #3600af 12%, #ffffff); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-background-blue) 12%, var(--color-sprout-color-background-weaker)); } }:where(.uc-atw) .uc-chip-editor{ color: var(--color-sprout-color-primary-darker); background: color-mix(in srgb, #cc4b23 12%, #ffffff); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-primary-darker) 12%, var(--color-sprout-color-background-weaker)); } }:where(.uc-atw) .uc-chip-d-primary{ color: var(--color-sprout-color-primary-lighter); background: color-mix(in srgb, #fd6a35 22%, transparent); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-primary) 22%, transparent); } }:where(.uc-atw) .uc-chip-d-secondary{ color: var(--color-sprout-color-secondary-lighter); background: color-mix(in srgb, #5202fd 30%, transparent); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-secondary) 30%, transparent); } }:where(.uc-atw) .uc-chip-d-blue{ color: var(--color-sprout-color-secondary-lighter); background: color-mix(in srgb, #3600af 40%, transparent); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-background-blue) 40%, transparent); } }:where(.uc-atw) .uc-chip-d-editor{ color: var(--color-sprout-color-primary-lighter); background: color-mix(in srgb, #cc4b23 26%, transparent); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--color-sprout-color-primary-darker) 26%, transparent); } }:where(.uc-atw) .uc-dot-primary{ background: var(--color-sprout-color-primary); }:where(.uc-atw) .uc-dot-secondary{ background: var(--color-sprout-color-secondary); }:where(.uc-atw) .uc-dot-blue{ background: var(--color-sprout-color-background-blue); }:where(.uc-atw) .uc-dot-editor{ background: var(--color-sprout-color-primary-darker); }:where(.uc-atw) .uc-orb-primary{ background: radial-gradient(circle at 32% 28%, var(--color-sprout-color-primary-lighter), var(--color-sprout-color-primary) 54%, var(--color-sprout-color-primary-darker) 92%); }:where(.uc-atw) .uc-orb-secondary{ background: radial-gradient(circle at 32% 28%, var(--color-sprout-color-secondary-lighter), var(--color-sprout-color-secondary) 56%, #4a25b0 92%); }:where(.uc-atw) .uc-orb-blue{ background: radial-gradient(circle at 32% 28%, #8f7ce6, var(--color-sprout-color-background-blue) 56%, #170748 95%); }:where(.uc-atw) .uc-orb-mix{ background: radial-gradient(circle at 30% 30%, var(--color-sprout-color-primary-lighter) 6%, var(--color-sprout-color-primary) 40%, var(--color-sprout-color-secondary) 96%); }:where(.uc-atw) .uc-orb-slate{ background: radial-gradient(circle at 32% 28%, var(--color-sprout-color-background-weaker), var(--color-sprout-color-background-strongest) 60%, #a3a3a3 95%); }:where(.uc-atw) .uc-orb-noise::after{ content: ""; position: absolute; inset: 0; border-radius: 9999px; opacity: .22; mix-blend-mode: overlay; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }:where(.uc-atw) .uc-glow-creator{ background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, #fd6a35 20%, transparent), transparent 72%); @supports (color: color-mix(in lab, red, red)) { background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, var(--color-sprout-color-primary) 20%, transparent), transparent 72%); } }:where(.uc-atw) .uc-glow-figma{ background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, #5202fd 16%, transparent), transparent 72%); @supports (color: color-mix(in lab, red, red)) { background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, var(--color-sprout-color-secondary) 16%, transparent), transparent 72%); } }:where(.uc-atw) .uc-glow-agent{ background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, #3600af 16%, transparent), transparent 72%); @supports (color: color-mix(in lab, red, red)) { background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, var(--color-sprout-color-background-blue) 16%, transparent), transparent 72%); } }:where(.uc-atw) .uc-glow-editor{ background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, #cc4b23 18%, transparent), transparent 72%); @supports (color: color-mix(in lab, red, red)) { background: radial-gradient(50% 60% at 50% 42%, color-mix(in srgb, var(--color-sprout-color-primary-darker) 18%, transparent), transparent 72%); } }@keyframes uc-flow{ to { stroke-dashoffset: -120; } }:where(.uc-atw) .uc-flow-line{ stroke-dasharray: 20 100; stroke-dashoffset: 0; animation: uc-flow 3s linear infinite; }:where(.uc-atw) .uc-flow-line.d1{ animation-delay: 0s; }:where(.uc-atw) .uc-flow-line.d2{ animation-delay: -1s; }:where(.uc-atw) .uc-flow-line.d3{ animation-delay: -2s; }@keyframes uc-cpu-pulse{ 0%, 100% { opacity: .85; transform: scale(1); } 50% { opacity: 1; transform: scale(1.06); } }:where(.uc-atw) .uc-cpu-glow{ animation: uc-cpu-pulse 4.5s ease-in-out infinite; }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .uc-flow-line{ animation: none; stroke-dasharray: none; }:where(.uc-atw) .uc-cpu-glow{ animation: none; }}@keyframes uc-marquee{ to { transform: translateX(-50%); } }:where(.uc-atw) .uc-marquee{ width: max-content; animation: uc-marquee 40s linear infinite; }:where(.uc-atw) .uc-marquee-wrap:hover .uc-marquee{ animation-play-state: paused; }:where(.uc-atw) .uc-hero-chip{ display: inline-flex; align-items: center; gap: 9px; padding: 9px var(--spacing-sprout-16); border-radius: var(--radius-sprout-infinite); font-size: 14px; line-height: 18px; font-weight: 500; color: var(--color-sprout-color-text-default); background: var(--color-sprout-color-background-weaker); border: 1px solid var(--color-sprout-color-border-weak); box-shadow: 0 2px 6px -3px rgba(16, 24, 40, .16); transition: border-color .24s cubic-bezier(.2,.7,.2,1), transform .24s cubic-bezier(.2,.7,.2,1); }:where(.uc-atw) .uc-hero-chip:hover{ border-color: var(--color-sprout-color-border-default); transform: translateY(-2px); }:where(.uc-atw) .uc-hero-chip svg{ width: 18px; height: 18px; flex: 0 0 auto; }:where(.uc-atw).uc-night .uc-hero-chip{ box-shadow: none; }:where(.uc-atw) .uc-reveal{ opacity: 0; transform: translateY(22px); transition: opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1); }:where(.uc-atw) .uc-reveal.ucx-in{ opacity: 1; transform: none; }:where(.uc-atw) .cm-bcard{ animation: cm-bcard-in .45s cubic-bezier(.2,.7,.2,1) both; }@keyframes cm-bcard-in{ from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .uc-reveal{ opacity: 1 !important; transform: none !important; }:where(.uc-atw) .uc-marquee{ animation: none !important; }:where(.uc-atw) .cm-bcard{ animation: none !important; }}@keyframes uc-tab-in{ 0% { opacity: 0; transform: translateY(26px); filter: blur(9px); } 60% { opacity: 1; } 100% { opacity: 1; transform: none; filter: blur(0); } }:where(.uc-atw) .uc-tab-in{ animation: uc-tab-in 1.2s cubic-bezier(.16, 1, .3, 1) both; will-change: transform, opacity, filter; }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .uc-tab-in{ animation: none; }}:where(.uc-atw) .uc-tabprog{ position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 999px; overflow: hidden; pointer-events: none; background: var(--uc-border-subtle); }:where(.uc-atw) .uc-tabprog-fill{ display: block; height: 100%; border-radius: 999px; background: var(--uc-brand); transition: width .12s linear; }.uc-atw{ --background: #f9f9fb; --foreground: #0f0635; --card: #ffffff; --card-foreground: #0f0635; --popover: #ffffff; --popover-foreground: #0f0635; --primary: #fd6a35; --primary-foreground: #ffffff; --secondary: #f1f1f7; --secondary-foreground: #0f0635; --muted: #f1f1f7; --muted-foreground: #737373; --accent: #fff1eb; --accent-foreground: #cc4b23; --destructive: #f65258; --border: #e5e5e5; --input: #d4d4d4; --ring: #fd6a35; --radius: 0.625rem; --chart-1: #fd6a35; --chart-2: #5202fd; --chart-3: #3600af; --chart-4: #ffb89a; --chart-5: #b8a9ff; --sidebar: #ffffff; --sidebar-foreground: #0f0635; --sidebar-primary: #fd6a35; --sidebar-primary-foreground: #ffffff; --sidebar-accent: #f1f1f7; --sidebar-accent-foreground: #0f0635; --sidebar-border: #e5e5e5; --sidebar-ring: #fd6a35; }:where(.uc-atw).uc-night{ --color-sprout-color-background-weaker: #171717; --color-sprout-color-background-default: #1f1f1f; --color-sprout-color-background-stronger: #262626; --color-sprout-color-background-strongest: #2b2b2b; --color-sprout-color-text-default: #f5f5f5; --color-sprout-color-text-stronger: #ffffff; --color-sprout-color-text-weaker: #a1a1a1; --color-sprout-color-text-weakest: #7d7d7d; --color-sprout-color-text-disabled: #6b6b6b; --color-sprout-color-border-weak: rgba(255, 255, 255, 0.10); --color-sprout-color-border-default: rgba(255, 255, 255, 0.16); --color-uc-navpill: #262626; }:where(.uc-atw).uc-night .uc-force-light{ --color-sprout-color-background-weaker: #ffffff; --color-sprout-color-background-default: #f4f4f4; --color-sprout-color-background-stronger: #ebebeb; --color-sprout-color-background-strongest: #e3e3ed; --color-sprout-color-text-default: #0a0a0a; --color-sprout-color-text-stronger: #171717; --color-sprout-color-text-weaker: #737373; --color-sprout-color-text-weakest: #a3a3a3; --color-sprout-color-text-disabled: #737373; --color-sprout-color-border-weak: #e5e5e5; --color-sprout-color-border-default: #d4d4d4; --color-uc-navpill: #ebebeb; }:where(.uc-atw) #top{ transition: background-color .55s cubic-bezier(.4, 0, .2, 1); }:where(.uc-atw) #top section, :where(.uc-atw) #top .ds-display, :where(.uc-atw) #top .ds-h2, :where(.uc-atw) #top .ds-t28, :where(.uc-atw) #top .ds-t24, :where(.uc-atw) #top .ds-lead, :where(.uc-atw) #top .ds-body, :where(.uc-atw) #top .ds-caption, :where(.uc-atw) #top .ds-overline, :where(.uc-atw) #top .ds-fine, :where(.uc-atw) #top h1, :where(.uc-atw) #top h2, :where(.uc-atw) #top h3, :where(.uc-atw) #top p, :where(.uc-atw) #top li{ transition: background-color .55s cubic-bezier(.4, 0, .2, 1), color .55s cubic-bezier(.4, 0, .2, 1), border-color .55s cubic-bezier(.4, 0, .2, 1); }:where(.uc-atw) .uc-step-visual > div > img:first-child, :where(.uc-atw) .uc-step-visual > div > .lg\:hidden:first-child + img{ display: none; }@property --tw-border-spacing-x{ syntax: ""; inherits: false; initial-value: 0; }@property --tw-border-spacing-y{ syntax: ""; inherits: false; initial-value: 0; }@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-pan-x{ syntax: "*"; inherits: false; }@property --tw-pan-y{ syntax: "*"; inherits: false; }@property --tw-pinch-zoom{ 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-space-x-reverse{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-divide-x-reverse{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-border-style{ syntax: "*"; inherits: false; initial-value: solid; }@property --tw-divide-y-reverse{ syntax: "*"; inherits: false; initial-value: 0; }@property --tw-gradient-position{ syntax: "*"; inherits: false; }@property --tw-gradient-from{ syntax: ""; inherits: false; initial-value: #0000; }@property --tw-gradient-via{ syntax: ""; inherits: false; initial-value: #0000; }@property --tw-gradient-to{ syntax: ""; 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: ""; inherits: false; initial-value: 0%; }@property --tw-gradient-via-position{ syntax: ""; inherits: false; initial-value: 50%; }@property --tw-gradient-to-position{ syntax: ""; 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-ordinal{ syntax: "*"; inherits: false; }@property --tw-slashed-zero{ syntax: "*"; inherits: false; }@property --tw-numeric-figure{ syntax: "*"; inherits: false; }@property --tw-numeric-spacing{ syntax: "*"; inherits: false; }@property --tw-numeric-fraction{ 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: ""; 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: ""; 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: ""; inherits: false; initial-value: 0px; }@property --tw-ring-offset-color{ syntax: "*"; inherits: false; initial-value: #fff; }@property --tw-ring-offset-shadow{ syntax: "*"; inherits: false; initial-value: 0 0 #0000; }@property --tw-outline-style{ syntax: "*"; inherits: false; initial-value: solid; }@property --tw-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: ""; 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; }@property --tw-content{ syntax: "*"; initial-value: ""; inherits: false; }@keyframes spin{ to { transform: rotate(360deg); } }@keyframes pulse{ 50% { opacity: 0.5; } }@keyframes enter{ from { opacity: var(--tw-enter-opacity,1); transform: translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0)); filter: blur(var(--tw-enter-blur,0)); } }@keyframes exit{ to { opacity: var(--tw-exit-opacity,1); transform: translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0)scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0)); filter: blur(var(--tw-exit-blur,0)); } }@keyframes accordion-down{ from { height: 0; } to { height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto))))); } }@keyframes accordion-up{ from { height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto))))); } to { height: 0; } }@keyframes caret-blink{ 0%,70%,100% { opacity: 1; } 20%,50% { opacity: 0; } }@keyframes accordion-down{ from { height: 0; } to { height: var( --radix-accordion-content-height, var(--accordion-panel-height, auto) ); } }@keyframes accordion-up{ from { height: var( --radix-accordion-content-height, var(--accordion-panel-height, auto) ); } to { height: 0; } }@keyframes marquee{ from { transform: translateX(0); } to { transform: translateX(calc(-100% - var(--gap))); } }@keyframes marquee-vertical{ from { transform: translateY(0); } to { transform: translateY(calc(-100% - var(--gap))); } }@keyframes gradient{ to { background-position: var(--bg-size, 300%) 0; } }@keyframes shimmer-slide{ to { transform: translate(calc(100cqw - 100%), 0); } }@keyframes spin-around{ 0% { transform: translateZ(0) rotate(0); } 15%, 35% { transform: translateZ(0) rotate(90deg); } 65%, 85% { transform: translateZ(0) rotate(270deg); } 100% { transform: translateZ(0) rotate(360deg); } }@keyframes orbit{ 0% { transform: rotate(calc(var(--angle) * 1deg)) translateY(calc(var(--radius) * 1px)) rotate(calc(var(--angle) * -1deg)); } 100% { transform: rotate(calc(var(--angle) * 1deg + 360deg)) translateY(calc(var(--radius) * 1px)) rotate(calc((var(--angle) * -1deg) - 360deg)); } }@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){:where(.uc-atw) *, :where(.uc-atw) ::before, :where(.uc-atw) ::after, :where(.uc-atw) ::backdrop{ --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --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-pan-x: initial; --tw-pan-y: initial; --tw-pinch-zoom: initial; --tw-scroll-snap-strictness: proximity; --tw-space-y-reverse: 0; --tw-space-x-reverse: 0; --tw-divide-x-reverse: 0; --tw-border-style: solid; --tw-divide-y-reverse: 0; --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-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-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; --tw-content: ""; --tw-animation-delay: 0s; --tw-animation-direction: normal; --tw-animation-duration: initial; --tw-animation-fill-mode: none; --tw-animation-iteration-count: 1; --tw-enter-blur: 0; --tw-enter-opacity: 1; --tw-enter-rotate: 0; --tw-enter-scale: 1; --tw-enter-translate-x: 0; --tw-enter-translate-y: 0; --tw-exit-blur: 0; --tw-exit-opacity: 1; --tw-exit-rotate: 0; --tw-exit-scale: 1; --tw-exit-translate-x: 0; --tw-exit-translate-y: 0; --uc-angle: 0deg; }}}@font-face{ font-family:"Zalando Sans"; font-style:normal; font-weight:400; font-display:swap; src:url("/wp-content/uploads/2026/09/fonts-ZalandoSans-Regular.ttf") format("truetype"); }@font-face{ font-family:"Zalando Sans"; font-style:normal; font-weight:500; font-display:swap; src:url("/wp-content/uploads/2026/09/fonts-ZalandoSans-Medium.ttf") format("truetype"); }@font-face{ font-family:"Zalando Sans"; font-style:normal; font-weight:600; font-display:swap; src:url("/wp-content/uploads/2026/09/fonts-ZalandoSans-SemiBold.ttf") format("truetype"); }@font-face{ font-family:"Zalando Sans"; font-style:normal; font-weight:700; font-display:swap; src:url("/wp-content/uploads/2026/09/fonts-ZalandoSans-Bold.ttf") format("truetype"); }:where(.uc-atw) .uc-pop-dark{ --uc-surface-sunken: #141414; --uc-surface-base: #1A1A1A; --uc-surface-raised: #242424; --uc-surface-overlay: #1C1C1C; --uc-surface-control: rgba(255, 255, 255, 0.08); --uc-text-strong: #FFFFFF; --uc-text: #E5E5E5; --uc-text-muted: #A3A3A3; --uc-text-subtle: #737373; --uc-inverse-bg: #F5F5F5; --uc-inverse-fg: #171717; --uc-border-subtle: #2E2E2E; --uc-border: #3D3D3D; --uc-border-strong: #525252; --uc-ring: rgba(253, 106, 53, 0.60); --uc-brand-fg: #FFB89A; --uc-brand-soft: rgba(253, 106, 53, 0.18); --uc-success-fg: #A7EAAA; --uc-success-soft: rgba(46, 163, 67, 0.20); --uc-danger-fg: #FDC9C6; --uc-danger-soft: rgba(246, 82, 88, 0.20); --uc-warning-fg: #FFC680; --uc-warning-soft: rgba(255, 169, 64, 0.22); --uc-accent-fg: #B8A9FF; --uc-accent-soft: rgba(82, 2, 253, 0.28); color: var(--uc-text); }:where(.uc-atw) .uc-scope, :where(.uc-atw) .uc-content, :where(.uc-atw) .uc-chrome{ font-family: var(--uc-font-sans); font-size: var(--uc-text-base); line-height: var(--uc-leading-normal); color: var(--uc-text); background: var(--uc-surface-base); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }:where(.uc-atw) .uc-portal{ font-family: var(--uc-font-sans); font-size: var(--uc-text-base); line-height: var(--uc-leading-normal); color: var(--uc-text); -webkit-font-smoothing: antialiased; }:where(.uc-atw) .uc-scope *, :where(.uc-atw) .uc-scope *::before, :where(.uc-atw) .uc-scope *::after, :where(.uc-atw) .uc-content *, :where(.uc-atw) .uc-content *::before, :where(.uc-atw) .uc-content *::after, :where(.uc-atw) .uc-chrome *, :where(.uc-atw) .uc-chrome *::before, :where(.uc-atw) .uc-chrome *::after, :where(.uc-atw) .uc-portal *, :where(.uc-atw) .uc-portal *::before, :where(.uc-atw) .uc-portal *::after{ box-sizing: border-box; }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .uc-scope *, :where(.uc-atw) .uc-content *, :where(.uc-atw) .uc-chrome *, :where(.uc-atw) .uc-portal *{ animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }} :where(.uc-atw) .Button_button__8M0Ui{ --_h: var(--uc-control-h-md); --_px: var(--uc-space-16); --_fs: var(--uc-text-base); display: inline-flex; align-items: center; justify-content: center; gap: var(--uc-space-8); height: var(--_h); padding: 0 var(--_px); font-family: var(--uc-font-sans); font-size: var(--_fs); font-weight: var(--uc-weight-medium); line-height: 1; white-space: nowrap; border: none; border-radius: var(--uc-radius-md); cursor: pointer; user-select: none; position: relative; isolation: isolate; transition: background var(--uc-dur-fast) var(--uc-ease-standard), box-shadow var(--uc-dur-fast) var(--uc-ease-standard), transform var(--uc-dur-fast) var(--uc-ease-standard), color var(--uc-dur-fast) var(--uc-ease-standard); }:where(.uc-atw) .Button_button__8M0Ui:focus-visible{ outline: 2px solid var(--uc-ring); outline-offset: 2px; }:where(.uc-atw) .Button_button__8M0Ui:active:not(:disabled){ transform: translateY(0.5px); }:where(.uc-atw) .Button_button__8M0Ui:disabled{ opacity: 0.5; cursor: not-allowed; box-shadow: none; }:where(.uc-atw) .Button_sm__CjQl1{ --_h: var(--uc-control-h-sm); --_px: var(--uc-space-12); --_fs: var(--uc-text-sm); }:where(.uc-atw) .Button_md__0_bmU{ --_h: var(--uc-control-h-md); --_px: var(--uc-space-16); --_fs: var(--uc-text-base); }:where(.uc-atw) .Button_lg__7yGRs{ --_h: var(--uc-control-h-lg); --_px: var(--uc-space-20); --_fs: var(--uc-text-md); }:where(.uc-atw) .Button_iconOnly__eY4j_{ padding: 0; width: var(--_h); }:where(.uc-atw) .Button_solid__hu289{ color: var(--uc-brand-on); background: var(--_fill, var(--uc-brand)); background-image: var(--uc-sheen); box-shadow: var(--_shadow, var(--uc-shadow-control-brand)); }:where(.uc-atw) .Button_solid__hu289:hover:not(:disabled){ background-image: linear-gradient(rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.12)), var(--uc-sheen); }:where(.uc-atw) .Button_solid__hu289:active:not(:disabled){ background-image: linear-gradient(rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.12)), var(--uc-sheen); box-shadow: var(--uc-shadow-control-pressed); }:where(.uc-atw) .Button_solid__hu289.Button_neutral__jwE0u{ color: var(--uc-inverse-fg); background: var(--uc-inverse-bg); box-shadow: var(--uc-shadow-control); }:where(.uc-atw) .Button_solid__hu289.Button_neutral__jwE0u:hover:not(:disabled){ background-image: linear-gradient(to bottom, rgba(128, 128, 128, 0.16), rgba(128, 128, 128, 0.16)); }:where(.uc-atw) .Button_solid__hu289.Button_neutral__jwE0u:active:not(:disabled){ background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.14), rgba(0, 0, 0, 0.14)); }:where(.uc-atw) .Button_soft__o47wg{ color: var(--_fg, var(--uc-brand-fg)); background: var(--_soft, var(--uc-brand-soft)); background-image: var(--uc-sheen); box-shadow: inset 0 0 0 1px var(--_border, var(--uc-brand-border)), var(--uc-shadow-1); }:where(.uc-atw) .Button_soft__o47wg:hover:not(:disabled){ background-image: var(--uc-sheen), linear-gradient(var(--_glow, var(--uc-brand-glow-hover)), var(--_glow, var(--uc-brand-glow-hover))); }:where(.uc-atw) .Button_outline__Zwmoe{ color: var(--_fg, var(--uc-brand-fg)); background: var(--uc-surface-control); background-image: var(--uc-sheen); box-shadow: inset 0 0 0 1px var(--_border, var(--uc-border-subtle)), var(--uc-shadow-raised); }:where(.uc-atw) .Button_outline__Zwmoe.Button_neutral__jwE0u{ color: var(--uc-text-strong); }:where(.uc-atw) .Button_outline__Zwmoe:hover:not(:disabled){ background-image: var(--uc-sheen), linear-gradient(var(--_glow, var(--uc-brand-glow-hover)), var(--_glow, var(--uc-brand-glow-hover))); }:where(.uc-atw) .Button_ghost__e52lE{ color: var(--_fg, var(--uc-brand-fg)); background: transparent; }:where(.uc-atw) .Button_ghost__e52lE.Button_neutral__jwE0u{ color: var(--uc-text); }:where(.uc-atw) .Button_ghost__e52lE:hover:not(:disabled){ background: var(--_glow, var(--uc-brand-glow-hover)); color: var(--uc-text-strong); }:where(.uc-atw) .Button_brand__mVCH5{ --_fill: var(--uc-brand); --_fg: var(--uc-brand-fg); --_soft: var(--uc-brand-soft); --_border: var(--uc-brand-border); --_glow: var(--uc-brand-glow-hover); --_shadow: var(--uc-shadow-control-brand); }:where(.uc-atw) .Button_success__ox09j{ --_fill: var(--uc-success); --_fg: var(--uc-success-fg); --_soft: var(--uc-success-soft); --_border: var(--uc-success-border); --_glow: var(--uc-success-glow-hover); --_shadow: var(--uc-shadow-control-brand); }:where(.uc-atw) .Button_danger__uQDDH{ --_fill: var(--uc-danger); --_fg: var(--uc-danger-fg); --_soft: var(--uc-danger-soft); --_border: var(--uc-danger-border); --_glow: var(--uc-danger-glow-hover); --_shadow: var(--uc-shadow-control-brand); }:where(.uc-atw) .Button_neutral__jwE0u{ --_fg: var(--uc-text-strong); --_soft: var(--uc-surface-sunken); --_border: var(--uc-border-strong); --_glow: rgba(128, 128, 128, 0.12); }:where(.uc-atw) .Button_loading__ZvEzX{ color: transparent !important; pointer-events: none; }:where(.uc-atw) .Button_spinner__D8hjY{ position: absolute; width: 1em; height: 1em; border-radius: 50%; border: 2px solid currentColor; border-top-color: transparent; color: var(--uc-brand-on); animation: Button_uc-spin__zZG4c 0.6s linear infinite; }:where(.uc-atw) .Button_soft__o47wg .Button_spinner__D8hjY, :where(.uc-atw) .Button_outline__Zwmoe .Button_spinner__D8hjY, :where(.uc-atw) .Button_ghost__e52lE .Button_spinner__D8hjY{ color: var(--uc-text); }:where(.uc-atw) .Button_solid__hu289.Button_neutral__jwE0u .Button_spinner__D8hjY{ color: var(--uc-inverse-fg); }@keyframes Button_uc-spin__zZG4c{ to { transform: rotate(360deg); } }:where(.uc-atw) .Badge_badge__aQT_j{ display: inline-flex; align-items: center; gap: var(--uc-space-4); height: 20px; padding: 0 var(--uc-space-8); border-radius: var(--uc-radius-pill); font-family: var(--uc-font-sans); font-size: var(--uc-text-xs); font-weight: var(--uc-weight-medium); line-height: 1; white-space: nowrap; }:where(.uc-atw) .Badge_md__ROJtx{ height: 24px; padding: 0 var(--uc-space-12); font-size: var(--uc-text-sm); }:where(.uc-atw) .Badge_dot__080bg{ width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }:where(.uc-atw) .Badge_solid__1ih3j{ color: var(--_on, var(--uc-brand-on)); background: var(--_fill, var(--uc-brand)); background-image: var(--uc-sheen); box-shadow: var(--uc-shadow-1); }:where(.uc-atw) .Badge_soft___tHUU{ color: var(--_fg, var(--uc-brand-fg)); background: var(--_soft, var(--uc-brand-soft)); }:where(.uc-atw) .Badge_outline__ZVBpQ{ color: var(--_fg, var(--uc-brand-fg)); background: transparent; box-shadow: inset 0 0 0 1px var(--_border, var(--uc-brand-border)); }:where(.uc-atw) .Badge_brand__u7HV8{ --_fill: var(--uc-brand); --_on: var(--uc-brand-on); --_fg: var(--uc-brand-fg); --_soft: var(--uc-brand-soft); --_border: var(--uc-brand-border); }:where(.uc-atw) .Badge_success__QLhHX{ --_fill: var(--uc-success); --_on: var(--uc-success-on); --_fg: var(--uc-success-fg); --_soft: var(--uc-success-soft); --_border: var(--uc-success-border); }:where(.uc-atw) .Badge_danger__bn6h3{ --_fill: var(--uc-danger); --_on: var(--uc-danger-on); --_fg: var(--uc-danger-fg); --_soft: var(--uc-danger-soft); --_border: var(--uc-danger-border); }:where(.uc-atw) .Badge_warning__Idw9L{ --_fill: var(--uc-warning); --_on: var(--uc-warning-on); --_fg: var(--uc-warning-fg); --_soft: var(--uc-warning-soft); --_border: var(--uc-warning-border); }:where(.uc-atw) .Badge_accent__s8cX7{ --_fill: var(--uc-accent); --_on: var(--uc-accent-on); --_fg: var(--uc-accent-fg); --_soft: var(--uc-accent-soft); --_border: var(--uc-accent-border); }:where(.uc-atw) .Badge_neutral__5MCSy{ --_fill: var(--uc-text); --_on: var(--uc-text-inverse); --_fg: var(--uc-text-muted); --_soft: var(--uc-surface-sunken); --_border: var(--uc-border-strong); }.uc-atw{ --pg: #ffffff; --pg2: #f7f7f9; --tx: #0a0a0a; --txd: #525252; --txf: #a3a3a3; --acc: #fd6a35; --acc-dk: #171717; --acc-soft: #f4f4f4; --acc-line: #e7e7ea; --acc2: #c2410c; --acc2-solid: #c2410c; --cardbg: #ffffff; --cardbd: #e7e7ea; --line: #ebebeb; --mist: #f4f4f4; --ink: #0a0a0a; --coral: #f65258; --ease: cubic-bezier(0.22, 1, 0.36, 1); --r-chip: 10px; --r-btn: 12px; --r-card: 16px; --r-xl: 20px; position: relative; background: var(--pg); color: var(--tx); overflow-x: clip; transition: background-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), color 0.55s cubic-bezier(0.4, 0, 0.2, 1); }html:has(.uc-atw), html:has(.uc-atw), body:has(.uc-atw){ background-color: #fff; }.uc-atw *{ box-sizing: border-box; }.uc-atw.is-night{ --acc2: #ff8a5b; --pg: #171717; --pg2: #1f1f1f; --tx: #f5f5f5; --txd: #a1a1a1; --txf: #7d7d7d; --acc-dk: #f5f5f5; --acc-soft: #262626; --acc-line: rgba(255, 255, 255, 0.14); --cardbg: #1f1f1f; --cardbd: rgba(255, 255, 255, 0.12); --line: rgba(255, 255, 255, 0.10); --mist: #262626; --ink: #f5f5f5; --color-sprout-color-background-weaker: #171717; --color-sprout-color-background-default: #1f1f1f; --color-sprout-color-background-stronger: #262626; --color-sprout-color-background-strongest: #2b2b2b; --color-sprout-color-text-default: #f5f5f5; --color-sprout-color-text-stronger: #ffffff; --color-sprout-color-text-weaker: #a1a1a1; --color-sprout-color-text-weakest: #7d7d7d; --color-sprout-color-text-disabled: #6b6b6b; --color-sprout-color-border-weak: rgba(255, 255, 255, 0.10); --color-sprout-color-border-default: rgba(255, 255, 255, 0.16); --color-sprout-color-primary: #fd6a35; }.uc-atw, .uc-atw .ucx-sec, .uc-atw .ucx-sec-head, .uc-atw .ucx-eyebrow, .uc-atw .ucx-accent-lemon, .uc-atw h1, .uc-atw h2, .uc-atw h3, .uc-atw p, .uc-atw li, .uc-atw .ds-fine, .uc-atw .faq2-eyebrow, .uc-atw .conv-eyebrow, .uc-atw .conv-title, .uc-atw .conv-sub{ transition: background-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), color 0.55s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.55s cubic-bezier(0.4, 0, 0.2, 1); }.uc-atw :is([class*="bg-sprout-color-"], [class*="border-sprout-color-"], [class*="text-sprout-color-"]):not(a, button, input, select, textarea, [role="button"], [role="tab"], [class*="hover:"], [class*="transition"]){ transition: background-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), color 0.55s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.55s cubic-bezier(0.4, 0, 0.2, 1); }@media (prefers-reduced-motion: reduce){.uc-atw, .uc-atw .ucx-sec, .uc-atw .ucx-sec-head, .uc-atw .ucx-eyebrow, .uc-atw .ucx-accent-lemon, .uc-atw h1, .uc-atw h2, .uc-atw h3, .uc-atw p, .uc-atw li, .uc-atw .ds-fine, .uc-atw .faq2-eyebrow, .uc-atw .conv-eyebrow, .uc-atw .conv-title, .uc-atw .conv-sub{ transition: none; }.uc-atw :is([class*="bg-sprout-color-"], [class*="border-sprout-color-"], [class*="text-sprout-color-"]):not(a, button, input, select, textarea, [role="button"], [role="tab"], [class*="hover:"], [class*="transition"]){ transition: none; }.uc-atw{ transition: none; }}.uc-atw.is-night .ax-num{ background: #262626; }.uc-atw.is-night .ax-media{ background: #2e2e2e; }.uc-atw.is-night .hp-card{ background: var(--cardbg); }.uc-atw.is-night .hero-chip{ background: #1f1f1f; border-color: rgba(255, 255, 255, 0.12); box-shadow: none; }.uc-atw.is-night .hero-chip:hover{ border-color: rgba(255, 255, 255, 0.24); }.uc-atw.is-night .widget-chip{ background: #1f1f1f; border-color: rgba(255, 255, 255, 0.12); box-shadow: none; }.uc-atw.is-night .rp-ic{ color: #525252; border-color: rgba(10, 10, 10, 0.12); }.uc-atw.is-night .rp-ic:hover{ color: #0a0a0a; border-color: rgba(10, 10, 10, 0.28); }.uc-atw .conv-card, .uc-atw .conv-tile{ transition: background-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.55s cubic-bezier(0.4, 0, 0.2, 1); }.uc-atw img{ max-width: 100%; }.uc-atw .ucx-uc-container{ max-width: var(--uc-container-max); margin-inline: auto; padding-inline: var(--uc-gutter); }.uc-atw .ucx-sec{ position: relative; padding: 104px 0; scroll-margin-top: 80px; }@media (max-width: 700px){.uc-atw .ucx-sec{ padding: 68px 0; }}.uc-atw .ucx-sec-head{ max-width: 900px; margin: 0 auto; text-align: center; }.uc-atw .ucx-sec h2{ font-size: 36px; line-height: 40px; font-weight: 500; letter-spacing: -0.02em; margin: 16px 0 14px; text-wrap: balance; color: var(--tx); }@media (min-width: 768px){.uc-atw .ucx-sec h2{ font-size: 46px; line-height: 50px; }}.uc-atw .ucx-sec .ucx-sub{ color: var(--txd); font-size: 18px; line-height: 28px; margin: 0; }.uc-atw .ucx-sec-head .ucx-sub{ margin-left: auto; margin-right: auto; max-width: 760px; }.uc-atw .ucx-accent-lemon{ color: var(--tx); }.uc-atw .sec-note{ text-align: center; color: var(--txf); font-size: 14px; line-height: 22px; margin: 20px 0 0; }.uc-atw .ucx-eyebrow{ display: inline-flex; align-items: center; gap: 8px; color: var(--tx); background: none; border: 0; padding: 0; border-radius: 0; font-size: 16px; font-weight: 500; letter-spacing: -0.01em; line-height: 24px; }.uc-atw .badge-new{ display: inline-block; height: var(--spacing-sprout-16); line-height: var(--spacing-sprout-16); padding: 0 var(--spacing-sprout-8); font-size: 10px; font-weight: 700; letter-spacing: 0.04em; border-radius: 999px; text-transform: uppercase; background: var(--acc2-solid); color: #fff; }.uc-atw .mcp-link{ position: relative; display: inline-flex; align-items: center; gap: 7px; color: var(--acc-dk); text-decoration: none; font-size: 16px; font-weight: 500; line-height: 26px; }.uc-atw .mcp-link svg{ width: 17px; height: 17px; transition: transform 0.24s var(--ease); }.uc-atw .mcp-link:hover svg{ transform: translateX(3px); }.uc-atw .mcp-link::after{ content: ""; position: absolute; left: 0; bottom: -4px; width: 100%; height: 2px; border-radius: 2px; background: var(--acc); transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--ease); }.uc-atw .mcp-link:hover::after{ transform: scaleX(1); }.uc-atw .btn-wp-dl{ color: var(--tx); }.uc-atw .btn-wp-dl img{ width: 18px; height: auto; display: block; flex: 0 0 auto; filter: brightness(0); transition: filter 0.55s cubic-bezier(0.4, 0, 0.2, 1); }.uc-atw.is-night .btn-wp-dl img{ filter: brightness(1); }.uc-atw .ucx-reveal{ opacity: 0; transform: translateY(22px); transition: opacity 0.6s var(--ease), transform 0.6s var(--ease); will-change: opacity, transform; }.uc-atw .ucx-reveal.ucx-in{ opacity: 1; transform: none; }.uc-atw .ucx-frame{ position: relative; margin: 52px auto 0; max-width: 960px; aspect-ratio: 16/9; border-radius: 20px; overflow: hidden; display: grid; place-items: center; background: var(--mist); border: 1px solid var(--cardbd); box-shadow: 0 18px 44px -24px rgba(16, 24, 40, 0.28); }.uc-atw .ucx-frame .fi{ position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; color: var(--txd); }.uc-atw .ucx-frame .fi svg{ width: 40px; height: 40px; }.uc-atw .ucx-frame .fi span{ font-size: 14px; line-height: 20px; }.uc-atw .ucx-vplay{ width: 72px; height: 72px; border-radius: 50%; background: var(--acc); display: grid; place-items: center; box-shadow: 0 10px 30px rgba(253, 106, 53, 0.35); }.uc-atw .ucx-vplay svg{ fill: #fff; }.uc-atw .ucx-hero{ position: relative; overflow: hidden; text-align: center; padding: clamp(120px, 15vh, 176px) 0 clamp(56px, 7vw, 88px); background: var(--pg); }.uc-atw .ucx-hero > .ucx-uc-container{ position: relative; z-index: 2; }.uc-atw .ucx-hero .ucx-eyebrow{ margin-bottom: 18px; }.uc-atw .ucx-hero .ucx-sub{ max-width: 900px; margin: 0 auto 34px; color: var(--txd); font-size: 18px; line-height: 28px; }.uc-atw .ucx-hero::before, .uc-atw .ucx-hero::after{ content: none; }.uc-atw .ucx-uic-spell-layer{ position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; --mx: 0; --my: 0; }.uc-atw .ucx-uic-orb{ position: absolute; border-radius: 50%; filter: blur(55px); will-change: transform; opacity: 0.5; }.uc-atw .ucx-uic-orb-1{ width: 480px; height: 480px; left: -4%; top: 12%; background: radial-gradient(circle, rgba(253, 106, 53, 0.28) 0%, transparent 68%); animation: f2w-float-a 14s ease-in-out infinite alternate; transform: translate(calc(var(--mx) * 24px), calc(var(--my) * 24px)); }.uc-atw .ucx-uic-orb-2{ width: 400px; height: 400px; right: -3%; top: 40%; background: radial-gradient(circle, rgba(82, 2, 253, 0.18) 0%, transparent 68%); animation: f2w-float-b 18s ease-in-out infinite alternate; transform: translate(calc(var(--mx) * -32px), calc(var(--my) * -32px)); }.uc-atw .ucx-uic-orb-3{ width: 300px; height: 300px; left: 40%; top: 55%; background: radial-gradient(circle, rgba(253, 106, 53, 0.16) 0%, transparent 68%); animation: f2w-float-a 22s ease-in-out infinite alternate-reverse; transform: translate(calc(var(--mx) * 16px), calc(var(--my) * 16px)); }.uc-atw .ucx-uic-orb-4{ width: 420px; height: 420px; left: -8%; top: 66%; background: radial-gradient(circle, rgba(253, 106, 53, 0.2) 0%, transparent 68%); animation: f2w-float-b 20s ease-in-out infinite alternate; transform: translate(calc(var(--mx) * -22px), calc(var(--my) * -22px)); }.uc-atw .ucx-uic-orb-5{ width: 360px; height: 360px; right: -7%; top: 80%; background: radial-gradient(circle, rgba(82, 2, 253, 0.14) 0%, transparent 66%); animation: f2w-float-a 24s ease-in-out infinite alternate-reverse; transform: translate(calc(var(--mx) * 26px), calc(var(--my) * 26px)); }.uc-atw .ucx-uic-orb-6{ width: 280px; height: 280px; left: 36%; top: 92%; background: radial-gradient(circle, rgba(253, 106, 53, 0.12) 0%, transparent 66%); animation: f2w-float-a 18s ease-in-out infinite alternate; transform: translate(calc(var(--mx) * 14px), calc(var(--my) * 14px)); }.uc-atw .trusted{ display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 30px; }.uc-atw .trusted .avatars{ height: 34px; width: auto; }.uc-atw .trusted .stars-wrap{ display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }.uc-atw .trusted .stars-wrap img{ height: 15px; width: auto; }.uc-atw .trusted .stars-line{ display: flex; align-items: center; gap: 7px; }.uc-atw .trusted .rate-num{ color: var(--tx); font-size: 12px; font-weight: 700; line-height: 14px; }.uc-atw .trusted .tnum{ color: var(--txd); font-size: 12px; font-weight: 500; line-height: 14px; }.uc-atw .ucx-pill-title{ display: block; text-align: center; margin: 18px auto 20px; max-width: 1180px; font-size: 40px; line-height: 44px; font-weight: 500; letter-spacing: -0.02em; color: var(--tx); }@media (min-width: 768px){.uc-atw .ucx-pill-title{ font-size: 54px; line-height: 58px; }}.uc-atw .ucx-pill-title .ucx-bw{ white-space: nowrap; }.uc-atw .ucx-pill-title .ucx-brand-chip{ display: inline-flex; align-items: center; justify-content: center; width: 0.85em; height: 0.85em; padding: 0.08em; box-sizing: border-box; background: var(--cardbg); border: 1px solid var(--cardbd); border-radius: 0.255em; vertical-align: middle; margin: 0 -0.06em; position: relative; top: -0.1em; box-shadow: 0 3px 10px -4px rgba(16, 24, 40, 0.25); }.uc-atw .ucx-pill-title .ucx-brand-chip img{ max-width: 100%; max-height: 100%; width: auto; height: auto; display: block; object-fit: contain; border-radius: 8px; }.uc-atw .ucx-pill-title .ucx-brand-chip img[src*="ucwr-figma-mark"]{ border-radius: 0; }.uc-atw .ucx-pill-title .ucx-brand-chip.is-badge{ padding: 0; border: 0; background: transparent; overflow: hidden; }.uc-atw .ucx-pill-title .ucx-brand-chip.is-inset{ padding: 0.12em; }.uc-atw .ucx-pill-title .ucx-brand-chip.is-badge img{ width: 100%; height: 100%; object-fit: cover; }.uc-atw .ucx-pill-title .hero-br{ display: none; }@media (min-width: 1000px){.uc-atw .ucx-pill-title .hero-br{ display: block; }}.uc-atw .hero-checks{ display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; max-width: 780px; margin: 0 auto 34px; }.uc-atw .hero-chip{ display: inline-flex; align-items: center; gap: 9px; padding: 9px 16px; border-radius: 999px; font-size: 14px; line-height: 18px; font-weight: 500; color: var(--tx); background: var(--cardbg); border: 1px solid var(--cardbd); box-shadow: 0 2px 6px -3px rgba(16, 24, 40, 0.16); transition: border-color 0.24s var(--ease), transform 0.24s var(--ease); }.uc-atw .hero-chip:hover{ border-color: var(--acc-line); transform: translateY(-2px); }.uc-atw .hero-chip svg{ width: 18px; height: 18px; flex: 0 0 auto; }.uc-atw .hero-logo{ display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: #ffffff; border: 1px solid var(--cardbd); box-shadow: 0 2px 6px -3px rgba(16, 24, 40, 0.16); transition: border-color 0.24s var(--ease), transform 0.24s var(--ease); }.uc-atw .hero-logo:hover{ border-color: var(--acc-line); transform: translateY(-2px); }.uc-atw .hero-logo img, .uc-atw .hero-logo svg{ width: 28px; height: 28px; object-fit: contain; }.uc-atw .ucx-cta-row{ display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }.uc-atw .cta-primary{ position: relative; display: inline-flex; }@media (max-width: 640px){.uc-atw .cta-primary{ flex-direction: column; align-items: center; }.uc-atw .cta-primary .uc-note{ position: static; transform: none; translate: none; margin-top: var(--spacing-sprout-8, 8px); text-align: center; }}.uc-atw .hero-reassure{ margin: 18px 0 0; text-align: center; color: var(--txf); font-size: 14px; line-height: 20px; }.uc-atw .hero-video{ cursor: pointer; background: var(--cardbg); box-shadow: none; }.uc-atw .hero-video .hero-screen{ position: absolute; inset: 4px; border-radius: 28px; overflow: hidden; background: var(--mist); }.uc-atw .hero-video .ucx-demo-thumb{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }.uc-atw .hero-video .ucx-demo-play{ position: absolute; inset: 0; display: grid; place-items: center; background: color-mix(in srgb, var(--ink) 6%, transparent); border: 0; cursor: pointer; z-index: 2; }.uc-atw .hero-video iframe{ position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }@media (min-width: 640px){.uc-atw .hero-video .hero-screen{ border-radius: 44px; }}@media (min-width: 768px){.uc-atw .hero-video .hero-screen{ border-radius: 60px; }}.uc-atw .stats{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; max-width: 1020px; margin: clamp(32px, 4vw, 44px) auto 0; background: var(--cardbd); border: 1px solid var(--cardbd); border-radius: 24px; overflow: hidden; }.uc-atw .stat{ display: flex; align-items: center; justify-content: center; gap: 12px; text-align: left; background: var(--cardbg); padding: 24px 20px; }.uc-atw .stat .num{ font-size: clamp(1.75rem, 2.6vw, 2.25rem); font-weight: 700; letter-spacing: -0.03em; color: var(--tx); line-height: 1; flex: 0 0 auto; }.uc-atw .stat .num em{ font-style: normal; color: var(--txd); }.uc-atw .stat .lbl{ color: var(--txd); font-size: 14px; line-height: 20px; margin-top: 0; max-width: 126px; }@media (max-width: 900px){.uc-atw .stats{ grid-template-columns: repeat(2, 1fr); }}@media (max-width: 520px){.uc-atw .stats{ grid-template-columns: 1fr; }}.uc-atw .diff-stage{ position: relative; aspect-ratio: 16/10; background: var(--mist); }.uc-atw .dl-vid{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }.uc-atw .diff-play{ position: absolute; top: 10px; right: 10px; z-index: 3; width: 24px; height: 24px; border-radius: 999px; cursor: pointer; border: 0; background: rgba(0, 0, 0, 0.12); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #171717; display: grid; place-items: center; transition: background 0.2s var(--ease), transform 0.2s var(--ease); }.uc-atw .diff-play:hover{ background: rgba(0, 0, 0, 0.22); transform: scale(1.06); }.uc-atw .diff-play svg{ width: 12px; height: 12px; }.uc-atw .diff-play .i-pause{ display: none; }.uc-atw #diffReal:not(.is-paused) .diff-play .i-play{ display: none; }.uc-atw #diffReal:not(.is-paused) .diff-play .i-pause{ display: block; }.uc-atw .ax{ --ax-gap: 40px; --ax-gutter: max(var(--uc-gutter), calc((100vw - var(--uc-container-max) + 2 * var(--uc-gutter)) / 2)); --ax-col: calc((min(100vw, var(--uc-container-max)) - 2 * var(--uc-gutter) - 2 * var(--ax-gap)) / 3); padding-bottom: 40px; }.uc-atw .ax-track{ position: relative; height: 540vh; margin-top: 10px; }.uc-atw .ax-pin{ position: sticky; top: 0; height: 100vh; display: flex; align-items: center; overflow: hidden; }.uc-atw .ax-stage{ display: flex; flex-direction: column; gap: clamp(24px, 4.4vh, 52px); width: 100%; }.uc-atw .ax-window{ overflow: hidden; padding-block: 8px; width: 100%; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--ax-gutter), #000 calc(100% - var(--ax-gutter)), transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 var(--ax-gutter), #000 calc(100% - var(--ax-gutter)), transparent 100%); }.uc-atw .ax-row{ display: grid; grid-auto-flow: column; grid-auto-columns: var(--ax-col); gap: var(--ax-gap); will-change: transform; }.uc-atw .ax-media-wrap{ width: 100%; }.uc-atw .ax-col{ display: flex; flex-direction: column; gap: 18px; opacity: 1; transition: opacity 0.45s var(--ease); }.uc-atw .ax-col.is-dim{ opacity: 0.42; }.uc-atw .ax-bar{ position: relative; height: 3px; border-radius: 999px; background: var(--line); overflow: hidden; }.uc-atw .ax-fill{ position: absolute; inset: 0 auto 0 0; width: 0; border-radius: 999px; background: linear-gradient(90deg, var(--acc2), var(--acc)); box-shadow: 0 0 10px rgba(253, 106, 53, 0.35); }.uc-atw .ax-copy{ display: flex; flex-direction: column; gap: 8px; }.uc-atw .ax-h{ display: flex; align-items: flex-start; gap: 12px; }.uc-atw .ax-num{ flex: 0 0 auto; margin-top: -2px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 14px; line-height: 14px; font-weight: 700; color: var(--txf); background: #fff; border: 1px solid var(--cardbd); transition: color 0.35s var(--ease), background 0.35s var(--ease), border-color 0.35s var(--ease), box-shadow 0.35s var(--ease); }.uc-atw .ax-col.ucx-is-active .ax-num, .uc-atw .ax-col.is-done .ax-num{ color: #fff; background: var(--acc); border-color: var(--acc); }.uc-atw .ax-col.ucx-is-active .ax-num{ box-shadow: 0 0 0 5px rgba(253, 106, 53, 0.14), 0 0 18px rgba(253, 106, 53, 0.38); }.uc-atw .ax-h h3{ margin: 0; font-size: 20px; font-weight: 500; letter-spacing: -0.01em; color: var(--tx); line-height: 24px; }.uc-atw .ax-copy p{ margin: 0; color: var(--txd); font-size: 16px; line-height: 26px; }.uc-atw .ax-media{ position: relative; width: 100%; max-width: calc(60vh * 1240 / 584); margin-inline: auto; aspect-ratio: 1240 / 584; border-radius: 20px; background: #fff; border: 1px solid var(--cardbd); }.uc-atw .ax-screen{ position: absolute; inset: 4px; border-radius: 16px; overflow: hidden; background: var(--mist); }.uc-atw .ax-slide{ position: absolute; inset: 0; opacity: 0; will-change: transform, opacity; }.uc-atw .ax-vid{ width: 100%; height: 100%; object-fit: cover; display: block; background: var(--mist); }.uc-atw .ax-track.is-off{ display: none; }.uc-atw .ax-stack{ display: none; margin-top: 48px; flex-direction: column; gap: 44px; }.uc-atw .ax-s{ display: flex; flex-direction: column; gap: 14px; }.uc-atw .ax-s .ax-num{ color: #fff; background: var(--acc); border-color: var(--acc); }.uc-atw .ax-s h3{ margin: 0; font-size: 20px; font-weight: 500; letter-spacing: -0.01em; color: var(--tx); line-height: 24px; }.uc-atw .ax-s p{ margin: 0; color: var(--txd); font-size: 16px; line-height: 26px; }.uc-atw .ax-s-frame{ padding: 4px; border-radius: var(--r-card); background: var(--mist); }.uc-atw .ax-s-inner{ position: relative; aspect-ratio: 16 / 10; border-radius: 14px; overflow: hidden; background: var(--mist); border: 1px solid var(--cardbd); }.uc-atw .ax-m-vid{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }@media (max-width: 860px){.uc-atw .ax-track{ display: none; }.uc-atw .ax-stack{ display: flex; }}.uc-atw .ax--six .ax-track{ height: 660vh; }.uc-atw .ax--six .ax-media{ aspect-ratio: 1920 / 1050; }.uc-atw .zz{ display: flex; flex-direction: column; gap: 64px; margin-top: 60px; }.uc-atw .zz-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: center; }.uc-atw .zz-row:nth-child(even) .zz-media{ order: -1; }.uc-atw .zz-text h3{ font-size: 24px; margin: 0 0 12px; line-height: 30px; font-weight: 500; letter-spacing: -0.01em; color: var(--tx); }.uc-atw .zz-text .ucx-eyebrow{ margin-bottom: 14px; }.uc-atw .zz-text p{ color: var(--txd); font-size: 16px; line-height: 26px; margin: 0; }.uc-atw .zz-media .ucx-frame{ margin: 0; max-width: none; }.uc-atw .zz-media .ucx-frame{ transition: transform 0.34s var(--ease), box-shadow 0.34s var(--ease), border-color 0.34s var(--ease); }.uc-atw .zz-media .ucx-frame:hover{ transform: translateY(-6px); border-color: var(--acc-line); box-shadow: 0 28px 60px -30px rgba(16, 24, 40, 0.34); }@media (max-width: 820px){.uc-atw .zz-row{ grid-template-columns: minmax(0, 1fr); gap: 24px; }.uc-atw .zz-row:nth-child(even) .zz-media{ order: 0; }.uc-atw .zz-media, .uc-atw .zz-media .ucx-frame{ max-width: 100%; min-width: 0; overflow: hidden; }}.uc-atw .demo-chip, .uc-atw .scan-chip, .uc-atw .dfx-chip, .uc-atw .hf-chip{ position: absolute; left: 14px; bottom: 14px; z-index: 8; display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: 999px; font-size: 12px; font-weight: 500; color: var(--tx); background: rgba(255, 255, 255, 0.86); border: 1px solid var(--cardbd); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); line-height: 14px; box-shadow: 0 6px 18px -10px rgba(16, 24, 40, 0.4); }.uc-atw .demo-chip i, .uc-atw .scan-chip i{ width: 8px; height: 8px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 8px 1px rgba(253, 106, 53, 0.6); animation: f2w-blink 1.6s ease-in-out infinite; }.uc-atw .ucx-frame.scan{ overflow: hidden; place-items: stretch; background: #eef0f3; }.uc-atw .scan-img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; z-index: 0; }.uc-atw .scan-veil{ position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(16, 24, 40, 0.08)); }.uc-atw .scan-grid{ position: absolute; inset: 0; z-index: 2; pointer-events: none; background-image: linear-gradient(rgba(253, 106, 53, 0.16) 1px, transparent 1px), linear-gradient(90deg, rgba(253, 106, 53, 0.16) 1px, transparent 1px); background-size: 34px 34px; -webkit-mask-image: linear-gradient(180deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(180deg, transparent, #000 12%, #000 88%, transparent); }.uc-atw .scan-line{ position: absolute; left: 0; right: 0; top: 4%; height: 2px; z-index: 4; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(82, 2, 253, 0.6) 14%, var(--acc) 50%, rgba(82, 2, 253, 0.6) 86%, transparent); box-shadow: 0 0 18px 3px rgba(253, 106, 53, 0.5); animation: f2w-scan-sweep 3s var(--ease) infinite alternate; }.uc-atw .scan-line::before{ content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 64px; background: linear-gradient(180deg, transparent, rgba(253, 106, 53, 0.16)); }.uc-atw .scan-line::after{ content: ""; position: absolute; left: 0; right: 0; top: 2px; height: 64px; background: linear-gradient(180deg, rgba(253, 106, 53, 0.18), transparent); }.uc-atw .scan-dot{ position: absolute; z-index: 5; left: var(--x); top: var(--y); width: var(--s, 7px); height: var(--s, 7px); border-radius: 50%; transform: translate(-50%, -50%) scale(0.2); opacity: 0; background: var(--acc); box-shadow: 0 0 6px 1px rgba(253, 106, 53, 0.5); animation: f2w-scan-pop var(--dur, 3.2s) ease-in-out infinite; animation-delay: var(--d, 0s); }.uc-atw .ucx-frame.dfx{ overflow: hidden; place-items: center; background: #ffffff; aspect-ratio: 16/10; }.uc-atw .dfx-bento{ --dfxgap: 24px; position: relative; display: flex; gap: var(--dfxgap); width: 100%; height: 100%; padding: 16px; align-items: stretch; }.uc-atw .dfx-col{ flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: var(--dfxgap); }.uc-atw .dfx-col.c3{ animation: f2w-dfx-slide 4.5s var(--ease) infinite; }.uc-atw .dfx-g{ flex: 1 1 0; min-height: 0; border-radius: 12px; overflow: hidden; }.uc-atw .dfx-g.card{ background: #234540; padding: 10px 12px; display: flex; flex-direction: column; justify-content: space-between; gap: 6px; }.uc-atw .dfx-g.img{ background-size: cover; background-position: center; position: relative; }.uc-atw .dfx-g.img::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.04) 40%, rgba(0, 0, 0, 0.52)); }.uc-atw .dfx-ic{ width: 28px; height: 28px; border-radius: 6px; border: 1px solid rgba(255, 255, 255, 0.32); display: grid; place-items: center; color: #fff; flex: 0 0 auto; }.uc-atw .dfx-ic svg{ width: 16px; height: 16px; }.uc-atw .dfx-tx b{ display: block; color: #fff; font-size: clamp(0.625rem, 1.25vw, 0.75rem); font-weight: 700; letter-spacing: -0.01em; line-height: 1.15; }.uc-atw .dfx-g.card .big{ display: block; color: #fff; font-weight: 700; letter-spacing: -0.01em; font-size: clamp(0.75rem, 1.7vw, 1rem); line-height: 1.3; }.uc-atw .dfx-tx p{ margin: 4px 0 0; color: #dfe4e1; font-size: clamp(0.375rem, 0.85vw, 0.5rem); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }.uc-atw .dfx-pills{ display: flex; gap: 6px; margin-top: 7px; }.uc-atw .dfx-pills span{ background: #f2f2f0; color: #1e2b28; font-size: 8px; font-weight: 500; padding: 3px 8px; border-radius: 20px; white-space: nowrap; line-height: 10px; }.uc-atw .dfx-mark{ position: absolute; top: 50%; left: 66.4%; transform: translate(-50%, -50%); z-index: 7; white-space: nowrap; font-size: 10px; font-weight: 700; letter-spacing: 0.02em; padding: 3px 7px; border-radius: 6px; line-height: 12px; }.uc-atw .dfx-mark.bad{ color: #b42318; background: #fff1ef; border: 1px solid rgba(246, 82, 88, 0.5); animation: f2w-dfx-bad 4.5s var(--ease) infinite; }.uc-atw .dfx-mark.good{ color: #067647; background: #ecfdf3; border: 1px solid rgba(46, 163, 67, 0.5); opacity: 0; animation: f2w-dfx-good 4.5s var(--ease) infinite; }.uc-atw .dfx-chip i.dot{ width: 8px; height: 8px; border-radius: 50%; background: var(--coral); animation: f2w-dfx-dot 4.5s var(--ease) infinite; }.uc-atw .dfx-lbls{ position: relative; display: inline-grid; }.uc-atw .dfx-lbls em{ grid-area: 1/1; font-style: normal; white-space: nowrap; }.uc-atw .dfx-lbls .ucx-a{ animation: f2w-dfx-lbl-a 4.5s var(--ease) infinite; }.uc-atw .dfx-lbls .ucx-b{ opacity: 0; animation: f2w-dfx-lbl-b 4.5s var(--ease) infinite; }.uc-atw .ucx-frame.mtn{ overflow: hidden; place-items: center; background: #fbf8f1; }.uc-atw .mtn-page{ width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px 20px; text-align: center; }.uc-atw .mtn-eye{ font-size: 10px; font-weight: 700; letter-spacing: 0.18em; color: #8a94a0; margin-bottom: 7px; line-height: 12px; }.uc-atw .mtn-h{ font-family: Georgia, "Times New Roman", serif; color: #1b2534; font-weight: 600; font-size: clamp(1rem, 2.3vw, 1.375rem); line-height: 1.18; max-width: 92%; }.uc-atw .mtn-sub{ color: #5c6b7a; font-size: 12px; margin-top: 8px; max-width: 80%; line-height: 16px; }.uc-atw .mtn-cards{ display: flex; align-items: stretch; justify-content: center; gap: 10px; margin-top: 18px; width: 100%; }.uc-atw .mtn-card{ flex: 1 1 0; max-width: 98px; background: #fffdf9; border: 1px solid rgba(20, 30, 45, 0.07); border-radius: 12px; box-shadow: 0 10px 22px -14px rgba(20, 30, 45, 0.28); padding: 12px 8px 11px; display: flex; flex-direction: column; align-items: center; gap: 5px; }.uc-atw .mtn-av{ width: 42px; height: 42px; border-radius: 50%; overflow: hidden; display: grid; place-items: end center; background: radial-gradient(circle at 50% 34%, #e6e5e6, #c2c3c6); }.uc-atw .mtn-av svg{ width: 32px; height: 32px; color: #a3a9b2; }.uc-atw .mtn-card b{ font-size: 10px; font-weight: 700; color: #1b2534; letter-spacing: -0.01em; white-space: nowrap; line-height: 12px; }.uc-atw .mtn-card i{ font-size: 10px; font-style: normal; color: #8a94a0; white-space: nowrap; line-height: 12px; }.uc-atw .mtn-eye, .uc-atw .mtn-h, .uc-atw .mtn-sub, .uc-atw .mtn-card{ opacity: 0; will-change: opacity, transform; }.uc-atw .mtn-eye{ --fy: -10px; animation: f2w-mt-eye 6.5s var(--ease) infinite; }.uc-atw .mtn-h{ --fy: -12px; animation: f2w-mt-h 6.5s var(--ease) infinite; }.uc-atw .mtn-sub{ --fy: -10px; animation: f2w-mt-sub 6.5s var(--ease) infinite; }.uc-atw .mtn-card:nth-child(1){ --fy: 16px; animation: f2w-mt-c1 6.5s var(--ease) infinite; }.uc-atw .mtn-card:nth-child(2){ --fy: 16px; animation: f2w-mt-c2 6.5s var(--ease) infinite; }.uc-atw .mtn-card:nth-child(3){ --fy: 16px; animation: f2w-mt-c3 6.5s var(--ease) infinite; }.uc-atw .mtn-card:nth-child(4){ --fy: 16px; animation: f2w-mt-c4 6.5s var(--ease) infinite; }.uc-atw .mtn-card:nth-child(5){ --fy: 16px; animation: f2w-mt-c5 6.5s var(--ease) infinite; }.uc-atw .ucx-frame.rzc{ aspect-ratio: auto; height: 305px; background: var(--mist); }.uc-atw .rz-vid, .uc-atw .gl-vid{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }.uc-atw .ucx-frame.gl{ overflow: hidden; place-items: center; background: var(--mist); aspect-ratio: 299/216; }.uc-atw .ucx-frame.hf{ overflow: hidden; place-items: center; background: #eef0f3; }.uc-atw .hf-stage{ position: absolute; inset: 0; }.uc-atw .hf-page{ position: absolute; left: 3%; top: 8%; width: 44%; height: 84%; z-index: 0; background: #ffffff; border: 1px solid var(--cardbd); border-radius: 10px; box-shadow: 0 8px 22px -14px rgba(16, 24, 40, 0.3); }.uc-atw .hf-body{ position: absolute; z-index: 1; border-radius: 3px; }.uc-atw .hf-body.b1{ left: 6%; top: 31%; width: 22%; height: 4.5%; background: rgba(20, 20, 40, 0.16); }.uc-atw .hf-body.b2{ left: 6%; top: 39%; width: 17%; height: 3.5%; background: rgba(20, 20, 40, 0.1); }.uc-atw .hf-body.b4{ left: 6%; top: 47%; width: 20%; height: 3.5%; background: rgba(20, 20, 40, 0.1); }.uc-atw .hf-body.b3{ left: 29%; top: 31%; width: 15%; height: 24%; border-radius: 6px; background: linear-gradient(135deg, #ffe3d6, #ffc9b3); }.uc-atw .hf-h, .uc-atw .hf-f{ display: flex; align-items: center; gap: 5%; padding: 0 4%; border-radius: 6px; box-sizing: border-box; will-change: transform; }.uc-atw .hf-h{ position: absolute; left: 6%; top: 13%; width: 38%; height: 11%; z-index: 2; background: #fff; border: 1px solid rgba(20, 20, 40, 0.08); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06); animation: f2w-hf-lift-h 6.5s var(--ease) infinite; }.uc-atw .hf-f{ position: absolute; left: 6%; top: 74%; width: 38%; height: 13%; z-index: 2; background: #1b2230; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2); animation: f2w-hf-lift-f 6.5s var(--ease) infinite; }.uc-atw .hf-logo{ width: 11%; aspect-ratio: 1; border-radius: 3px; background: var(--acc); flex: 0 0 auto; }.uc-atw .hf-nav{ width: 13%; height: 16%; border-radius: 2px; background: rgba(20, 20, 40, 0.2); flex: 0 0 auto; }.uc-atw .hf-btn{ margin-left: auto; width: 20%; height: 36%; border-radius: 20px; background: var(--acc); flex: 0 0 auto; }.uc-atw .hf-fcol{ width: 15%; height: 26%; border-radius: 2px; background: rgba(255, 255, 255, 0.4); flex: 0 0 auto; }.uc-atw .hf-slot{ position: absolute; z-index: 1; border: 1px dashed var(--acc-line); border-radius: 8px; background: rgba(16, 24, 40, 0.03); }.uc-atw .hf-slot.s1{ left: 53%; top: 12%; width: 44%; height: 32%; }.uc-atw .hf-slot.s2{ left: 53%; top: 56%; width: 44%; height: 32%; }.uc-atw .hf-slot-label{ position: absolute; top: 7px; left: 9px; font-size: 8px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--acc-dk); line-height: 10px; }.uc-atw .hf-ck{ position: absolute; top: 6px; right: 8px; width: 15px; height: 15px; border-radius: 50%; background: var(--acc); color: #fff; font-size: 8px; font-weight: 900; display: grid; place-items: center; opacity: 0; line-height: 8px; }.uc-atw .hf-ck.ck1{ animation: f2w-hf-ck1 6.5s var(--ease) infinite; }.uc-atw .hf-ck.ck2{ animation: f2w-hf-ck2 6.5s var(--ease) infinite; }.uc-atw .hf-chip i.dot{ width: 8px; height: 8px; border-radius: 50%; background: var(--acc2); animation: f2w-hf-dot 6.5s var(--ease) infinite; }.uc-atw .hf-lbls{ position: relative; display: inline-grid; }.uc-atw .hf-lbls em{ grid-area: 1/1; font-style: normal; white-space: nowrap; }.uc-atw .hf-lbls .ucx-a{ animation: f2w-hf-la 6.5s var(--ease) infinite; }.uc-atw .hf-lbls .ucx-b{ opacity: 0; animation: f2w-hf-lb 6.5s var(--ease) infinite; }.uc-atw .chatai{ display: grid; grid-template-columns: 0.92fr 1.08fr; gap: 42px; align-items: center; margin-top: 44px; }@media (max-width: 980px){.uc-atw .chatai{ grid-template-columns: minmax(0, 1fr); gap: 28px; }}.uc-atw .chatai-tabs{ display: flex; flex-direction: column; gap: 12px; min-width: 0; }.uc-atw .chatai-tab{ display: block; width: 100%; text-align: left; cursor: pointer; font-family: inherit; padding: 16px 18px; border-radius: 14px; background: #fff; border: 1px solid var(--cardbd); border-left: 3px solid transparent; transition: background 0.24s var(--ease), border-color 0.24s var(--ease); }.uc-atw .chatai-tab:hover{ background: var(--mist); }.uc-atw .chatai-tab.active{ background: var(--acc-soft); border-color: var(--acc-line); border-left-color: var(--acc); }.uc-atw .chatai-tab h3{ color: var(--tx); margin: 0; font-size: 18px; line-height: 28px; font-weight: 500; letter-spacing: -0.01em; }.uc-atw .chatai-tab p{ color: var(--txd); font-size: 16px; line-height: 24px; margin: 7px 0 0; }.uc-atw .chatai-stage{ position: relative; min-width: 0; }.uc-atw .chatai-viewport{ overflow: hidden; border-radius: 16px; }.uc-atw .chatai-track{ display: flex; transition: transform 0.45s var(--ease); will-change: transform; }.uc-atw .chatai-slide{ min-width: 100%; }.uc-atw .chatai-slide .ucx-frame{ margin: 0; max-width: none; }.uc-atw .chatai-dots{ display: flex; gap: 8px; justify-content: center; margin-top: 16px; }.uc-atw .chatai-dot{ width: 9px; height: 9px; border-radius: 50%; background: var(--cardbd); border: none; padding: 0; cursor: pointer; transition: background 0.24s var(--ease), width 0.24s var(--ease); }.uc-atw .chatai-dot.active{ background: var(--acc); width: 22px; border-radius: 5px; }.uc-atw .mcp-grid{ display: grid; grid-template-columns: 0.92fr 1.08fr; gap: 48px; align-items: center; margin-top: 8px; }@media (max-width: 900px){.uc-atw .mcp-grid{ grid-template-columns: 1fr; gap: 30px; }}.uc-atw .mcp-copy .ucx-eyebrow{ margin-bottom: 16px; }.uc-atw .mcp-copy h2{ text-align: left; }.uc-atw .mcp-copy .ucx-sub{ max-width: 56ch; }.uc-atw .term{ position: relative; display: flex; flex-direction: column; height: 375px; border-radius: 16px; overflow: hidden; background: linear-gradient(180deg, #16121f, #0c0910); border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: 0 24px 60px -28px rgba(16, 24, 40, 0.5); transition: transform 0.34s var(--ease), box-shadow 0.34s var(--ease); }@media (max-width: 560px){.uc-atw .term{ height: 430px; }}.uc-atw .term:hover{ transform: translateY(-6px); } /* --- legacy hover-transform conflict (swept 2026-09-02) --------------------- #uichemy-btn-global (retired design system) ships .uc-btn:hover, ..., [class*="-card"]:hover, [class*="-tile"]:hover, [class*="-chip"]:hover { transform: none !important; } Those attribute selectors match a SUBSTRING of the class attribute, so no ucx- rename dodges them (.ucx-hero-chip still contains "-chip"). They were killing every hover lift this page inherited from components/uichemy/*.css. Each rule below restates the source's own value above the legacy (0,2,0), so sheet order does not matter. Deliberate transform:none values from the source are restated too, so this cannot resurrect a lift the design suppressed on purpose. Per CLAUDE.md section 5 this !important asserts the page's value over a block being deleted; it becomes a no-op once that block goes. ------------------------- */ .uc-atw .hero-chip.hero-chip:hover{ transform: translateY(-2px) !important; } .uc-atw .hp-card.hp-card:hover{ transform: translateY(-8px) !important; } .uc-atw .src-tile.src-tile:not(.is-soon):hover{ transform: translateY(-4px) !important; } .uc-atw .sup-card-tray .sup-card.sup-card:hover{ transform: none !important; } .uc-atw .sup-card.sup-card:hover{ transform: translateY(-5px) !important; } .uc-atw .term.term:hover{ transform: translateY(-6px) !important; } .uc-atw .tpl-card.tpl-card:hover{ transform: translateY(-4px) !important; } .uc-atw .ucx-rel-card.ucx-rel-card:hover{ transform: translateY(-3px) !important; } :where(.uc-atw) .uc-hero-chip.uc-hero-chip:hover{ transform: translateY(-2px) !important; } .uc-atw .term-grid{ position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(253, 106, 53, 0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(253, 106, 53, 0.06) 1px, transparent 1px); background-size: 30px 30px; -webkit-mask-image: radial-gradient(120% 90% at 72% 0%, #000, transparent 78%); mask-image: radial-gradient(120% 90% at 72% 0%, #000, transparent 78%); }.uc-atw .term-glow{ position: absolute; top: -28%; right: -12%; width: 62%; height: 82%; background: radial-gradient(circle, rgba(253, 106, 53, 0.24), transparent 70%); filter: blur(42px); pointer-events: none; }.uc-atw .term-scan{ position: absolute; left: 0; right: 0; top: 0; height: 84px; pointer-events: none; background: linear-gradient(180deg, transparent, rgba(253, 106, 53, 0.1), transparent); animation: f2w-term-scan 5s linear infinite; }.uc-atw .term-bar{ position: relative; display: flex; align-items: center; gap: 7px; padding: 12px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.02); }.uc-atw .term-dot{ width: 11px; height: 11px; border-radius: 999px; }.uc-atw .term-file{ margin-left: 8px; font-size: 12px; color: rgba(255, 255, 255, 0.42); font-family: ui-monospace, monospace; line-height: 14px; }.uc-atw .term-live{ margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--acc); line-height: 14px; }.uc-atw .term-live i{ width: 7px; height: 7px; border-radius: 999px; background: var(--acc); box-shadow: 0 0 8px var(--acc); }.uc-atw .term-body{ position: relative; flex: 1; min-height: 0; overflow: hidden; padding: 20px; font-family: ui-monospace, monospace; font-size: 14px; line-height: 24px; color: rgba(255, 255, 255, 0.62); }.uc-atw .term-line{ animation: f2w-term-swap 0.42s ease both; }.uc-atw .term-line .p, .uc-atw .term-line .ok{ color: var(--acc); }.uc-atw .term-caret{ display: inline-block; width: 8px; height: 15px; margin-left: 3px; vertical-align: -2px; border-radius: 1px; background: var(--acc); animation: f2w-term-blink 1s steps(1) infinite; }.uc-atw .term-tabs{ position: relative; display: flex; gap: 8px; padding: 0 20px 18px; flex-wrap: wrap; }.uc-atw .term-tab{ display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px; border-radius: 9px; cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 500; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.09); color: rgba(255, 255, 255, 0.62); transition: background 0.24s var(--ease), border-color 0.24s var(--ease), color 0.24s var(--ease); line-height: 18px; }.uc-atw .term-tab:not(.ucx-on):hover{ background: rgba(255, 255, 255, 0.09); border-color: rgba(255, 255, 255, 0.2); color: #fff; }.uc-atw .term-tab.ucx-on{ background: rgba(253, 106, 53, 0.16); border-color: rgba(253, 106, 53, 0.5); color: var(--acc); }.uc-atw .term-tab-ic{ width: 15px; height: 15px; display: block; }.uc-atw .src-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 52px; }@media (max-width: 900px){.uc-atw .src-grid{ grid-template-columns: repeat(2, 1fr); }}@media (max-width: 480px){.uc-atw .src-grid{ grid-template-columns: 1fr; }}.uc-atw .src-tile{ position: relative; display: block; padding: 20px; border-radius: 16px; background: #fff; border: 1px solid var(--cardbd); text-decoration: none; color: inherit; box-shadow: 0 10px 26px -20px rgba(16, 24, 40, 0.22); transition: transform 0.24s var(--ease), border-color 0.24s var(--ease); }.uc-atw .src-tile.is-soon{ cursor: default; }.uc-atw .src-tile.is-soon::after{ content: "Soon"; position: absolute; top: 14px; right: 14px; font-size: 10px; line-height: 16px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--acc2); background: color-mix(in srgb, var(--acc2) 10%, #fff); border: 1px solid color-mix(in srgb, var(--acc2) 22%, transparent); padding: 2px 8px; border-radius: 999px; }.uc-atw .src-tile:not(.is-soon):hover{ transform: translateY(-4px); border-color: var(--acc-line); }.uc-atw .src-ic{ width: 40px; height: 40px; border-radius: 10px; background: var(--mist); border: 1px solid var(--line); display: grid; place-items: center; margin-bottom: 16px; overflow: hidden; }.uc-atw .src-ic img.logo-img{ width: 24px; height: 24px; object-fit: contain; }.uc-atw .src-ic svg{ width: 22px; height: 22px; color: var(--txd); }.uc-atw .src-tile h3{ margin: 0 0 4px; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--tx); }.uc-atw .src-tile p{ margin: 0; font-size: 14px; line-height: 20px; color: var(--txd); }.uc-atw .mode-seg-wrap{ display: flex; justify-content: center; margin-top: 36px; }.uc-atw .mode-seg{ display: inline-flex; gap: 4px; padding: 4px; border-radius: 12px; background: var(--mist); border: 1px solid var(--cardbd); }.uc-atw .mode-opt{ padding: 9px 18px; border-radius: 9px; border: 0; cursor: pointer; font-family: inherit; font-size: 14px; line-height: 22px; font-weight: 500; background: transparent; color: var(--txd); transition: background 0.2s var(--ease), color 0.2s var(--ease), box-shadow 0.2s var(--ease); }.uc-atw .mode-opt.ucx-on{ background: #fff; color: var(--tx); box-shadow: 0 1px 3px rgba(16, 24, 40, 0.12); }.uc-atw .pbx-pane{ display: none; }.uc-atw .pbx-pane.ucx-is-active{ display: block; animation: f2w-pwfade 0.35s var(--ease); }.uc-atw .pbx-grid{ display: flex; flex-wrap: wrap; justify-content: center; gap: 22px 30px; margin-top: 40px; }.uc-atw .pbx-ic{ display: flex; flex-direction: column; align-items: center; gap: 11px; width: 112px; }.uc-atw .pbx-tile{ display: grid; place-items: center; background: none; border: 0; box-shadow: none; transition: transform 0.28s var(--ease); animation: f2w-pbx-float 3.6s var(--ease) infinite; }.uc-atw .pbx-tile img{ width: 60px; height: 60px; display: block; border-radius: 15px; }.uc-atw .pbx-ic:not(.is-soon) .pbx-tile img{ filter: drop-shadow(0 8px 20px rgba(253, 106, 53, 0.28)); }.uc-atw .pbx-name{ font-size: 14px; font-weight: 500; color: var(--tx); text-align: center; line-height: 18px; }.uc-atw .pbx-live{ font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: #fff; background: var(--acc); padding: 2px 9px; border-radius: 999px; line-height: 12px; }.uc-atw .pbx-soon{ font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--txf); background: var(--mist); border: 1px solid var(--cardbd); padding: 2px 9px; border-radius: 999px; line-height: 12px; }.uc-atw .pbx-ic:hover .pbx-tile{ transform: translateY(-5px); }.uc-atw .pbx-ic.is-soon .pbx-tile{ animation: none; }.uc-atw .pbx-ic.is-soon .pbx-tile img{ filter: grayscale(1); opacity: 0.42; }.uc-atw .pbx-ic.is-soon .pbx-name{ color: var(--txf); }.uc-atw .pbx-grid .pbx-ic:nth-child(2) .pbx-tile{ animation-delay: 0.3s; }.uc-atw .pbx-grid .pbx-ic:nth-child(3) .pbx-tile{ animation-delay: 0.6s; }.uc-atw .pbx-grid .pbx-ic:nth-child(4) .pbx-tile{ animation-delay: 0.9s; }.uc-atw .pbx-grid .pbx-ic:nth-child(5) .pbx-tile{ animation-delay: 1.2s; }.uc-atw .pbx-grid .pbx-ic:nth-child(6) .pbx-tile{ animation-delay: 1.5s; }.uc-atw .pbx-grid .pbx-ic:nth-child(7) .pbx-tile{ animation-delay: 1.8s; }.uc-atw .pbx-grid .pbx-ic:nth-child(8) .pbx-tile{ animation-delay: 2.1s; }.uc-atw .hp-stage{ position: relative; z-index: 2; margin-top: 52px; overflow: hidden; padding: 20px 0; }.uc-atw .hp-stage::before, .uc-atw .hp-stage::after{ content: ""; position: absolute; top: 0; bottom: 0; width: 9%; z-index: 3; pointer-events: none; }.uc-atw .hp-stage::before{ left: 0; background: linear-gradient(90deg, var(--pg) 0%, transparent 100%); }.uc-atw .hp-stage::after{ right: 0; background: linear-gradient(270deg, var(--pg) 0%, transparent 100%); }.uc-atw .hp-grid{ display: flex; flex-direction: column; gap: 22px; }.uc-atw .hp-row{ display: flex; gap: 22px; justify-content: flex-start; will-change: transform; padding: 0 clamp(20px, 5vw, 80px); }.uc-atw .hp-card{ flex: 0 0 300px; width: 300px; box-sizing: border-box; border-radius: 16px; overflow: hidden; background: #fff; border: 1px solid var(--cardbd); box-shadow: 0 14px 34px -22px rgba(16, 24, 40, 0.26); transition: transform 0.34s var(--ease), border-color 0.34s var(--ease), box-shadow 0.34s var(--ease); }.uc-atw .hp-card:hover{ transform: translateY(-8px); border-color: var(--acc-line); box-shadow: 0 26px 54px -28px rgba(16, 24, 40, 0.34); }.uc-atw .hp-thumb{ position: relative; aspect-ratio: 4/5; overflow: hidden; border-radius: 16px 16px 0 0; background: linear-gradient(180deg, #f4f0ff, #fef2ec); border-bottom: 1px solid var(--line); }.uc-atw .hp-vid{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity 0.45s var(--ease); }.uc-atw .hp-vid.ready{ opacity: 1; }.uc-atw .hp-badge{ position: absolute; top: 10px; left: 10px; z-index: 2; padding: 5px 11px; border-radius: 999px; font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--tx); background: rgba(255, 255, 255, 0.86); border: 1px solid var(--cardbd); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); line-height: 12px; }.uc-atw .hp-meta{ padding: 14px 16px 16px; }.uc-atw .hp-meta h3{ margin: 0 0 5px; font-size: 18px; line-height: 28px; font-weight: 500; color: var(--tx); }.uc-atw .hp-meta p{ font-size: 14px; color: var(--txd); line-height: 20px; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }@media (max-width: 640px){.uc-atw .hp-card{ flex-basis: 230px; width: 230px; }}@media (max-width: 768px){.uc-atw .hp-slider .hp-grid{ padding: 0; }.uc-atw .hp-slider .hp-row{ transform: none !important; overflow-x: auto; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; gap: 14px; padding: 4px 16px 16px; scrollbar-width: none; }.uc-atw .hp-slider .hp-row::-webkit-scrollbar{ display: none; }.uc-atw .hp-slider .hp-card{ scroll-snap-align: center; }}.uc-atw .cmp-sec .ucx-sec-head{ max-width: 1040px; }.uc-atw .cmp-sec .ucx-sec-head .ucx-sub{ max-width: 1040px; }.uc-atw .ucx-cmp{ --c1: 1.1; --c2: 1.16; --c3: 1.16; --ct: 3.42; position: relative; max-width: 1020px; margin: 68px auto 0; }.uc-atw .cmp-grid{ position: relative; z-index: 2; display: grid; grid-template-columns: 1.1fr 1.16fr 1.16fr; }.uc-atw .cmp-base{ position: absolute; inset: 0; background: var(--cardbg); border: 1px solid var(--cardbd); border-radius: 20px; z-index: 0; }.uc-atw .cmp-spot{ position: absolute; top: -28px; bottom: -28px; left: calc(100% * var(--c1) / var(--ct)); width: calc(100% * var(--c2) / var(--ct)); border-radius: 20px; background: #0b0b0f; box-shadow: 0 34px 70px -34px rgba(10, 10, 15, 0.6); overflow: hidden; z-index: 1; }.uc-atw .cmp-spot::before{ content: ""; position: absolute; inset: -34px 0 auto 0; height: 122px; background: radial-gradient(120% 150% at 88% -10%, rgba(158, 72, 236, 1) 0%, rgba(158, 72, 236, 0.5) 30%, transparent 62%), radial-gradient(120% 150% at 8% -6%, rgba(255, 194, 128, 1) 0%, rgba(246, 132, 78, 0.66) 32%, transparent 64%), linear-gradient(96deg, #fbad6b 0%, #f0623d 46%, #9741d6 100%); -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 26%, transparent 100%); mask-image: linear-gradient(to bottom, #000 0%, #000 26%, transparent 100%); }.uc-atw .ucx-cmp-cell{ position: relative; z-index: 2; display: flex; align-items: center; gap: 11px; padding: 16px 22px; font-size: 16px; line-height: 22px; min-width: 0; overflow-wrap: break-word; word-break: break-word; }.uc-atw .ucx-cmp-cell.feat{ color: var(--txd); font-weight: 400; }.uc-atw .ucx-cmp-cell.ucx-classic{ color: var(--txd); }.uc-atw .ucx-cmp-cell.ucx-ai{ color: #fff; font-weight: 500; }.uc-atw .ucx-cmp-cell.feat:not(.hd), .uc-atw .ucx-cmp-cell.ucx-classic:not(.hd){ border-top: 1px solid var(--line); }.uc-atw .ucx-cmp-cell.ucx-ai:not(.hd){ border-top: 1px solid rgba(255, 255, 255, 0.1); }.uc-atw .ucx-cmp-cell.ucx-ai.first{ border-top: 0; }.uc-atw .cmp-logos{ display: inline-flex; align-items: center; }.uc-atw .cmp-logo{ position: relative; display: inline-flex; transition: transform 0.2s var(--ease); }.uc-atw .cmp-logo + .cmp-logo{ margin-left: -6px; }.uc-atw .cmp-logo img{ width: 32px; height: 32px; border-radius: 9px; display: block; }.uc-atw .ucx-cmp-cell.ucx-ai .cmp-logo img{ box-shadow: 0 0 0 2.5px #0b0b0f; }.uc-atw .ucx-cmp-cell.ucx-classic .cmp-logo img{ box-shadow: 0 0 0 2.5px var(--cardbg); }.uc-atw .cmp-logo--fill img{ background: #0a0a0a; object-fit: contain; padding: 5px; }.uc-atw .cmp-logo:hover{ transform: translateY(-6px); z-index: 5; }.uc-atw .ucx-cmp-cell.hd{ padding-top: 20px; padding-bottom: 20px; font-size: 12px; line-height: 18px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }.uc-atw .ucx-cmp-cell.feat.hd{ color: var(--txf); }.uc-atw .ucx-cmp-cell.ucx-classic.hd{ color: var(--txf); }.uc-atw .ucx-cmp-cell.ucx-ai.hd{ padding-top: 24px; padding-bottom: 22px; }.uc-atw .cmp-brand{ display: inline-flex; align-items: center; gap: 9px; color: #fff; font-size: 14px; line-height: 22px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }@media (max-width: 700px){.uc-atw .ucx-cmp{ --c1: 0.9; --c2: 1; --c3: 1; --ct: 2.9; margin-top: 44px; }.uc-atw .cmp-grid{ grid-template-columns: 0.9fr 1fr 1fr; }.uc-atw .cmp-spot{ top: 0; bottom: 0; box-shadow: none; }.uc-atw .ucx-cmp-cell{ padding: 12px 12px; font-size: 14px; line-height: 22px; gap: 8px; align-items: flex-start; }.uc-atw .ucx-cmp-cell.ucx-ai.hd{ padding-top: 14px; }.uc-atw .cmp-brand{ font-size: 12px; line-height: 18px; gap: 6px; }}.uc-atw .rev-wall{ margin-top: 52px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; height: 660px; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, transparent, #000 7%, #000 93%, transparent); mask-image: linear-gradient(180deg, transparent, #000 7%, #000 93%, transparent); }.uc-atw .rev-col{ overflow: hidden; }.uc-atw .rev-track{ display: flex; flex-direction: column; gap: 18px; animation: f2w-rev-up linear infinite; will-change: transform; }.uc-atw .rev-col:hover .rev-track{ animation-play-state: paused; }.uc-atw .rev-card{ border-radius: 16px; background: #fff; border: 1px solid var(--cardbd); box-shadow: none; transition: border-color 0.28s var(--ease); }.uc-atw .rev-card:hover{ border-color: var(--acc-line); }.uc-atw a.rev-card{ display: block; text-decoration: none; color: inherit; cursor: pointer; }.uc-atw .rev-txt{ padding: 21px; }.uc-atw .rev-head{ display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 15px; }.uc-atw .rev-who{ display: flex; align-items: center; gap: 11px; }.uc-atw .rev-av{ width: 38px; height: 38px; border-radius: 999px; flex: 0 0 auto; background: linear-gradient(135deg, var(--acc), #cc4b23); display: grid; place-items: center; font-size: 14px; font-weight: 700; color: #fff; line-height: 18px; }.uc-atw .rev-av.has-img, .uc-atw .rev-yt-row .av.has-img{ position: relative; overflow: hidden; }.uc-atw .rev-av img, .uc-atw .rev-yt-row .av img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; background: var(--mist); }.uc-atw .rev-handle{ font-size: 14px; font-weight: 500; color: var(--tx); line-height: 18px; }.uc-atw .rev-meta{ font-size: 12px; color: var(--txf); line-height: 14px; }.uc-atw .rev-body{ margin: 0; font-size: 14px; line-height: 22px; color: var(--txd); }.uc-atw .rev-stars{ margin-top: 13px; color: var(--acc); letter-spacing: 1px; font-size: 12px; line-height: 14px; }.uc-atw .rev-glyph{ flex: 0 0 auto; width: 22px; height: 22px; display: grid; place-items: center; }.uc-atw .rev-glyph svg{ width: 18px; height: 18px; }.uc-atw .rev-yt-thumb{ position: relative; }.uc-atw .rev-yt-thumb img{ display: block; width: 100%; height: 168px; object-fit: cover; }.uc-atw .rev-yt-thumb .play{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; border-radius: 999px; background: #ff3b4e; display: grid; place-items: center; box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.4); }.uc-atw .rev-yt-cap{ padding: 15px 18px 17px; }.uc-atw .rev-yt-cap p{ margin: 0; font-size: 14px; line-height: 20px; color: var(--tx); font-weight: 500; }.uc-atw .rev-yt-row{ margin-top: 13px; display: flex; align-items: center; gap: 10px; }.uc-atw .rev-yt-row .av{ width: 30px; height: 30px; border-radius: 999px; background: linear-gradient(135deg, var(--acc), #cc4b23); display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; line-height: 14px; }.uc-atw .rev-glyph svg[data-x] path{ fill: var(--tx); }@media (max-width: 1024px){.uc-atw .rev-wall{ grid-template-columns: repeat(2, 1fr); height: 560px; }.uc-atw .rev-wall .rev-col:nth-child(3){ display: none; }}@media (max-width: 640px){.uc-atw .rev-wall{ grid-template-columns: 1fr; height: 620px; }.uc-atw .rev-wall .rev-col:nth-child(n+2){ display: none; }}.uc-atw .faq2{ display: flex; flex-direction: column; gap: clamp(28px, 4vw, 44px); max-width: 1020px; margin-inline: auto; }.uc-atw .faq2-title{ text-align: left; }.uc-atw .faq2-title .faq2-eyebrow{ display: inline-block; margin-bottom: 16px; }.uc-atw .faq2-title h2{ text-align: left; margin: 0; }.uc-atw .faq2-grid{ display: grid; grid-template-columns: 1fr; gap: 32px; }@media (min-width: 900px){.uc-atw .faq2-grid{ grid-template-columns: minmax(220px, 260px) 1fr; gap: 28px; align-items: start; }}.uc-atw .faq2-side{ display: flex; flex-direction: column; background: #fff; border: 1px solid var(--cardbd); border-radius: 16px; overflow: hidden; }.uc-atw .faq2-cta{ display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px; background: none; border: 0; color: var(--txd); font-size: 16px; line-height: 26px; }.uc-atw .faq2-cta a{ display: inline-flex; align-items: center; gap: 7px; color: var(--acc-dk); text-decoration: none; font-weight: 600; }.uc-atw .faq2-cta a svg{ width: 16px; height: 16px; color: var(--acc); }.uc-atw .faq2-tabs{ position: relative; display: flex; flex-direction: column; gap: 4px; margin: 4px 4px 0; padding: 4px; box-shadow: inset 0 0 0 1px var(--cardbd); border-radius: 12px; background: var(--mist); }.uc-atw .faq2-tab-ind{ position: absolute; left: 4px; right: 4px; top: 0; height: 0; opacity: 0; border-radius: 9px; background: #fff; box-shadow: 0 1px 3px rgba(16, 24, 40, 0.12); transition: transform 0.24s cubic-bezier(0.3, 0, 0, 1), height 0.24s cubic-bezier(0.3, 0, 0, 1); z-index: 0; pointer-events: none; }.uc-atw .faq2-tab{ position: relative; z-index: 1; text-align: left; padding: 9px 16px; border: 0; border-radius: 9px; background: transparent; cursor: pointer; font-family: inherit; font-size: 14px; line-height: 22px; font-weight: 500; color: var(--txd); transition: color 0.2s var(--ease); }.uc-atw .faq2-tab:hover{ color: var(--tx); }.uc-atw .faq2-tab.ucx-on{ color: var(--tx); }.uc-atw .ucxx-faq-pane{ display: none; flex-direction: column; gap: 12px; }.uc-atw .ucxx-faq-pane.ucx-is-active{ display: flex; }.uc-atw .ucxx-faq-item{ border-radius: 16px; background: #fff; border: 1px solid var(--cardbd); overflow: hidden; transition: border-color 0.24s var(--ease); }.uc-atw .ucxx-faq-item.open, .uc-atw .ucxx-faq-item:hover{ border-color: var(--tx); }.uc-atw .ucxx-faq-q{ width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; background: none; border: 0; cursor: pointer; text-align: left; font-family: inherit; color: var(--tx); font-size: 18px; font-weight: 500; letter-spacing: -0.01em; line-height: 26px; }.uc-atw .ucx-faq-ic{ flex: 0 0 auto; width: 22px; height: 22px; display: grid; place-items: center; color: var(--tx); transition: transform 0.3s var(--ease); }.uc-atw .ucx-faq-ic svg{ width: 20px; height: 20px; }.uc-atw .ucxx-faq-item.open .ucx-faq-ic{ transform: rotate(135deg); }.uc-atw .ucx-faq-a{ display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.32s var(--ease); }.uc-atw .ucxx-faq-item.open .ucx-faq-a{ grid-template-rows: 1fr; }.uc-atw .ucx-faq-a > div{ overflow: hidden; }.uc-atw .ucx-faq-a p{ margin: 0; padding: 0 24px 22px; color: var(--txd); font-size: 16px; line-height: 26px; }.uc-atw .ucx-faq-a a{ color: var(--acc-dk); font-weight: 500; }.uc-atw .sup-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 44px; }@media (max-width: 820px){.uc-atw .sup-grid{ grid-template-columns: 1fr 1fr; }}@media (max-width: 440px){.uc-atw .sup-grid{ grid-template-columns: 1fr; }}.uc-atw .sup-card{ padding: 26px 22px; text-align: center; border-radius: 16px; background: #fff; border: 1px solid var(--cardbd); box-shadow: 0 12px 30px -22px rgba(16, 24, 40, 0.22); transition: transform 0.24s var(--ease), border-color 0.24s var(--ease); }.uc-atw .sup-card:hover{ transform: translateY(-5px); border-color: var(--acc-line); }.uc-atw .sup-ic{ width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; margin: 0 auto 15px; background: var(--acc-soft); border: 1px solid var(--acc-line); color: var(--acc-dk); }.uc-atw .sup-ic svg{ width: 23px; height: 23px; }.uc-atw .sup-card h3{ margin: 0 0 6px; font-size: 18px; line-height: 28px; font-weight: 500; color: var(--tx); }.uc-atw .sup-card p{ margin: 0; font-size: 14px; color: var(--txd); line-height: 20px; }.uc-atw .news{ position: relative; margin-top: 40px; border-radius: 20px; padding: 40px 44px; background: var(--mist); border: 1px solid var(--cardbd); }.uc-atw .news-badge{ position: absolute; top: 0; left: 32px; transform: translateY(-50%); display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: 999px; background: var(--acc); color: #fff; font-size: 12px; font-weight: 500; box-shadow: 0 10px 26px -10px rgba(253, 106, 53, 0.7); line-height: 14px; }.uc-atw .news-badge svg{ width: 15px; height: 15px; }.uc-atw .news-inner{ display: flex; align-items: center; justify-content: space-between; gap: 44px; flex-wrap: wrap; }.uc-atw .news-copy{ flex: 1 1 380px; }.uc-atw .news-title{ font-size: 24px; line-height: 30px; margin: 6px 0 0; font-weight: 500; letter-spacing: -0.01em; text-wrap: balance; color: var(--tx); }.uc-atw .news-sub{ margin: 10px 0 0; color: var(--txd); font-size: 16px; line-height: 26px; max-width: 56ch; }.uc-atw .news-form{ display: flex; gap: 12px; flex: 0 0 auto; }.uc-atw .news-input{ width: 300px; max-width: 100%; padding: 13px 18px; border-radius: 12px; border: 1px solid var(--cardbd); background: #fff; color: var(--tx); font-size: 16px; font-family: inherit; outline: none; transition: border-color 0.2s var(--ease); line-height: 22px; }.uc-atw .news-input::placeholder{ color: var(--txf); }.uc-atw .news-input:focus{ border-color: var(--acc); }@media (max-width: 860px){.uc-atw .news{ padding: 36px 28px 32px; }.uc-atw .news-inner{ flex-direction: column; align-items: flex-start; gap: 24px; }.uc-atw .news-form{ width: 100%; }.uc-atw .news-input{ flex: 1; width: auto; }}@media (max-width: 560px){.uc-atw .news-form{ flex-direction: column; }.uc-atw .news-form .uc-btn{ width: 100%; }}.uc-atw .logo-eyebrow{ text-align: center; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--txf); margin-bottom: 24px; line-height: 14px; }.uc-atw .logo-band{ position: relative; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 44px 0; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }.uc-atw .logo-track{ display: flex; gap: 14px; width: max-content; will-change: transform; }.uc-atw .logo-track.no-anim{ animation: f2w-logo-marq 34s linear infinite; }.uc-atw .logo-band .ucx-brand-chip{ display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 44px; padding: 0 28px; flex: 0 0 auto; will-change: transform; background: none; border: 0; box-shadow: none; }.uc-atw .logo-band .ucx-brand-chip .bc-ic{ height: 22px; width: auto; max-width: none; object-fit: contain; display: block; opacity: 0.5; filter: grayscale(1); transition: opacity 0.4s var(--ease), filter 0.4s var(--ease); }.uc-atw .logo-band .ucx-brand-chip .bc-tx{ display: inline; font-weight: 700; font-size: 20px; line-height: 20px; letter-spacing: -0.01em; color: var(--tx); opacity: 0.4; white-space: nowrap; transition: opacity 0.4s var(--ease); }.uc-atw .logo-band .ucx-brand-chip.lit .bc-ic{ opacity: 1; filter: none; }.uc-atw .logo-band .ucx-brand-chip.lit .bc-tx{ opacity: 0.9; }@media (prefers-reduced-motion: reduce){.uc-atw .ucx-reveal{ opacity: 1 !important; transform: none !important; transition: none; }.uc-atw .ucx-hero, .uc-atw .ucx-hero::before, .uc-atw .ucx-hero::after, .uc-atw .ucx-uic-orb, .uc-atw .scan-line, .uc-atw .scan-dot, .uc-atw .dfx-col.c3, .uc-atw .dfx-mark, .uc-atw .dfx-chip i.dot, .uc-atw .dfx-lbls em, .uc-atw [class*="mtn-"], .uc-atw .hf-h, .uc-atw .hf-f, .uc-atw .hf-ck, .uc-atw .hf-chip i.dot, .uc-atw .hf-lbls em, .uc-atw .term-scan, .uc-atw .pbx-tile, .uc-atw .rev-track, .uc-atw .logo-track, .uc-atw .demo-chip i, .uc-atw .scan-chip i{ animation: none !important; }.uc-atw .scan-line{ top: 50%; }.uc-atw .mtn-eye, .uc-atw .mtn-h, .uc-atw .mtn-sub, .uc-atw .mtn-card{ opacity: 1 !important; }}@keyframes f2w-drift{ 0% { transform: translate(-8%, 4%) scale(1); } 50% { transform: translate(9%, -7%) scale(1.15); } 100% { transform: translate(-6%, 8%) scale(1.05); } }@keyframes f2w-drift-reverse{ 0% { transform: translate(7%, -5%) scale(1.12); } 50% { transform: translate(-9%, 7%) scale(1); } 100% { transform: translate(6%, -8%) scale(1.18); } }@keyframes f2w-float-a{ 0% { translate: 0 0; } 50% { translate: 5% -7%; } 100% { translate: -4% 6%; } }@keyframes f2w-float-b{ 0% { translate: 0 0; } 50% { translate: -6% 7%; } 100% { translate: 5% -5%; } }@keyframes f2w-blink{ 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }@keyframes f2w-scan-sweep{ from { top: 4%; } to { top: 95%; } }@keyframes f2w-scan-pop{ 0%, 100% { transform: translate(-50%, -50%) scale(0.2); opacity: 0; } 18% { transform: translate(-50%, -50%) scale(1.25); opacity: 1; } 40% { transform: translate(-50%, -50%) scale(1); opacity: 0.92; } 68% { transform: translate(-50%, -50%) scale(0.85); opacity: 0; } }@keyframes f2w-dfx-slide{ 0%, 32% { transform: translateX(calc(-1 * var(--dfxgap, 24px))); } 58%, 90% { transform: translateX(0); } 100% { transform: translateX(calc(-1 * var(--dfxgap, 24px))); } }@keyframes f2w-dfx-bad{ 0%, 30% { opacity: 1; } 42%, 100% { opacity: 0; } }@keyframes f2w-dfx-good{ 0%, 50% { opacity: 0; } 60%, 88% { opacity: 1; } 92%, 100% { opacity: 0; } }@keyframes f2w-dfx-dot{ 0%, 45% { background: var(--coral); } 60%, 100% { background: var(--acc); } }@keyframes f2w-dfx-lbl-a{ 0%, 45% { opacity: 1; } 55%, 100% { opacity: 0; } }@keyframes f2w-dfx-lbl-b{ 0%, 50% { opacity: 0; } 60%, 92% { opacity: 1; } 100% { opacity: 0; } }@keyframes f2w-mt-eye{ 0%, 2% { opacity: 0; transform: translateY(var(--fy)); } 9%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-mt-h{ 0%, 6% { opacity: 0; transform: translateY(var(--fy)); } 14%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-mt-sub{ 0%, 11% { opacity: 0; transform: translateY(var(--fy)); } 19%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-mt-c1{ 0%, 22% { opacity: 0; transform: translateY(var(--fy)); } 29%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-mt-c2{ 0%, 25% { opacity: 0; transform: translateY(var(--fy)); } 32%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-mt-c3{ 0%, 28% { opacity: 0; transform: translateY(var(--fy)); } 35%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-mt-c4{ 0%, 31% { opacity: 0; transform: translateY(var(--fy)); } 38%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-mt-c5{ 0%, 34% { opacity: 0; transform: translateY(var(--fy)); } 41%, 85% { opacity: 1; transform: translateY(0); } 92%, 100% { opacity: 0; transform: translateY(var(--fy)); } }@keyframes f2w-hf-lift-h{ 0%, 10% { transform: translateY(0); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06); } 16%, 88% { transform: translateY(-8px); box-shadow: 0 12px 22px -8px rgba(0, 0, 0, 0.28), 0 0 0 2px var(--acc); } 100% { transform: translateY(0); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06); } }@keyframes f2w-hf-lift-f{ 0%, 20% { transform: translateY(0); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2); } 26%, 88% { transform: translateY(-8px); box-shadow: 0 12px 22px -8px rgba(0, 0, 0, 0.32), 0 0 0 2px var(--acc); } 100% { transform: translateY(0); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2); } }@keyframes f2w-hf-ck1{ 0%, 30% { opacity: 0; transform: scale(0.4); } 36% { opacity: 1; transform: scale(1); } 88% { opacity: 1; } 93%, 100% { opacity: 0; } }@keyframes f2w-hf-ck2{ 0%, 40% { opacity: 0; transform: scale(0.4); } 46% { opacity: 1; transform: scale(1); } 88% { opacity: 1; } 93%, 100% { opacity: 0; } }@keyframes f2w-hf-dot{ 0%, 42% { background: var(--acc2); } 48%, 100% { background: var(--acc); } }@keyframes f2w-hf-la{ 0%, 40% { opacity: 1; } 46%, 100% { opacity: 0; } }@keyframes f2w-hf-lb{ 0%, 44% { opacity: 0; } 50%, 88% { opacity: 1; } 94%, 100% { opacity: 0; } }@keyframes f2w-term-scan{ 0% { transform: translateY(-84px); } 100% { transform: translateY(330px); } }@keyframes f2w-term-swap{ from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }@keyframes f2w-term-blink{ 50% { opacity: 0; } }@keyframes f2w-rev-up{ from { transform: translateY(0); } to { transform: translateY(-50%); } }@keyframes f2w-logo-marq{ to { transform: translateX(-50%); } }@keyframes f2w-pbx-float{ 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }@keyframes f2w-pwfade{ from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }.uc-atw .hero-grid{ display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }.uc-atw .hero-copy{ display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }.uc-atw .hero-eyebrow{ display: inline-flex; align-items: center; gap: var(--spacing-sprout-8); color: var(--txd); font-size: 14px; line-height: 18px; font-weight: 500; letter-spacing: 0.01em; }.uc-atw .hero-copy .uc-eyebrow{ margin-bottom: var(--spacing-sprout-24); }.uc-atw .hero-copy .hero-eyebrow{ margin-bottom: var(--spacing-sprout-20); }.uc-atw .hero-copy .ucx-pill-title{ margin: 0 auto var(--spacing-sprout-20); }.uc-atw .hero-copy .ucx-sub{ max-width: 1100px; margin: 0 auto var(--spacing-sprout-32); }.uc-atw .hero-copy .ucx-cta-row{ gap: var(--spacing-sprout-12); }.uc-atw .ucx-hero .uc-marquee-wrap{ margin-top: 80px; }.uc-atw .hero-video-wrap{ position: relative; margin-top: 80px; }.uc-atw .ucx-pill-title .ucx-brand-chip .ai-cluster{ display: block; width: 100%; height: 100%; }.uc-atw .ucx-hero .hero-video{ position: relative; z-index: 1; margin-top: 0; max-width: none; width: 100%; border-radius: 32px; }@media (min-width: 640px){.uc-atw .ucx-hero .hero-video{ border-radius: 48px; }}@media (min-width: 768px){.uc-atw .ucx-hero .hero-video{ border-radius: 64px; }}@media (min-width: 1025px){.uc-atw .ucx-hero .hero-video{ width: calc(100% + 40px); margin-left: -20px; margin-right: -20px; }}.uc-atw .hero-glow{ pointer-events: none; user-select: none; position: absolute; left: 50%; top: 50%; z-index: 0; width: 176%; max-width: none; transform: translate(-50%, -64%); }.uc-atw .ucx-hero .hero-checks{ margin-top: clamp(24px, 3vw, 34px); }.uc-atw .mcpset{ max-width: 640px; margin: 52px auto 0; }.uc-atw .mcpset-panel{ position: relative; background: var(--uc-surface-sunken); border: 1px solid var(--uc-border-subtle); border-radius: var(--uc-radius-16); padding: var(--uc-space-4) var(--uc-space-4) 0; box-shadow: var(--uc-shadow-5); text-align: left; }.uc-atw .mcpset-inner{ background: var(--uc-surface-raised); border: 1px solid var(--uc-border-subtle); border-radius: var(--uc-radius-12); padding: var(--uc-space-24) var(--uc-space-28); }.uc-atw .mcpset-eyebrow{ display: block; font-size: var(--uc-text-xs); font-weight: var(--uc-weight-semibold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--uc-text-subtle); line-height: var(--uc-leading-tight); margin-bottom: var(--uc-space-16); }.uc-atw .mcpset-tabs{ margin-bottom: var(--uc-space-20); }.uc-atw .mcpset-tab-ic{ width: 17px; height: 17px; display: block; object-fit: contain; flex: 0 0 auto; }.uc-atw .mcpset-intro{ margin: 0 0 var(--uc-space-16); color: var(--uc-text-strong); font-size: var(--uc-text-md); line-height: var(--uc-leading-normal); }.uc-atw .mcpset-intro b{ font-weight: var(--uc-weight-semibold); }.uc-atw .mcpset-steps{ margin: 0; padding: 0 0 0 var(--uc-space-20); list-style: decimal; display: flex; flex-direction: column; gap: var(--uc-space-16); }.uc-atw .mcpset-steps > li{ color: var(--uc-text-muted); font-size: var(--uc-text-base); line-height: var(--uc-leading-normal); padding-left: var(--uc-space-6); }.uc-atw .mcpset-steps > li::marker{ color: var(--uc-text-subtle); font-weight: var(--uc-weight-semibold); }.uc-atw .mcpset-steps b{ color: var(--uc-text-strong); font-weight: var(--uc-weight-semibold); }.uc-atw .mcpset-steps code{ font-family: var(--uc-font-mono); font-size: var(--uc-text-sm); padding: var(--uc-space-1) var(--uc-space-6); border-radius: var(--uc-radius-6); background: var(--uc-surface-sunken); border: 1px solid var(--uc-border-subtle); color: var(--uc-text-strong); white-space: nowrap; }.uc-atw .mcpset-code{ position: relative; display: flex; align-items: center; margin-top: var(--uc-space-10); background: var(--uc-surface-sunken); border: 1px solid var(--uc-border-subtle); border-radius: var(--uc-radius-8); padding: var(--uc-space-12) var(--uc-space-48) var(--uc-space-12) var(--uc-space-14); overflow: hidden; }.uc-atw .mcpset-code code{ flex: 1 1 auto; min-width: 0; overflow-x: auto; white-space: nowrap; font-family: var(--uc-font-mono); font-size: var(--uc-text-sm); line-height: var(--uc-leading-normal); color: var(--uc-text-strong); background: none; border: 0; padding: 0; scrollbar-width: none; }.uc-atw .mcpset-code code::-webkit-scrollbar{ display: none; }.uc-atw .mcpset-copy{ position: absolute; right: var(--uc-space-8); top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 30px; height: 30px; border-radius: var(--uc-radius-8); border: 1px solid var(--uc-border-subtle); background: var(--uc-surface-raised); color: var(--uc-text-muted); cursor: pointer; transition: color var(--uc-dur-fast) var(--uc-ease-standard), border-color var(--uc-dur-fast) var(--uc-ease-standard), background var(--uc-dur-fast) var(--uc-ease-standard); }.uc-atw .mcpset-copy:hover{ color: var(--uc-text-strong); border-color: var(--uc-brand-border); }.uc-atw .mcpset-copy.done{ color: var(--uc-success); border-color: var(--uc-success-border); }.uc-atw .mcpset-copy svg{ width: 16px; height: 16px; }.uc-atw .mcpset-docs{ display: flex; align-items: center; gap: var(--uc-space-3); margin: 0; padding: var(--uc-space-12) var(--uc-space-28); color: var(--uc-text-strong); font-size: var(--uc-text-base); line-height: var(--uc-leading-snug); text-decoration: underline; text-underline-offset: 2px; }.uc-atw .mcpset-docs > svg{ width: 14px; height: 14px; }.uc-atw .mcpset-docs:hover{ color: var(--uc-brand-fg); }.uc-atw .mcpset-docs .mcpset-docs-tail{ color: var(--uc-text-subtle); text-decoration: none; }@media (max-width: 560px){.uc-atw .mcpset-inner{ padding: var(--uc-space-20) var(--uc-space-16); }.uc-atw .mcpset-docs{ padding: var(--uc-space-12) var(--uc-space-16); }}.uc-atw .conv-card{ --conv-gutter: clamp(12px, 1.8vw, 36px); position: relative; overflow: hidden; margin-top: var(--uc-space-40); margin-left: calc(50% - 50vw + var(--conv-gutter)); margin-right: calc(50% - 50vw + var(--conv-gutter)); border-radius: var(--uc-radius-32); padding: clamp(80px, 11vw, 140px) var(--uc-space-24); text-align: center; background: #171717; transform: scale(var(--cs, 0.9)); transform-origin: center; will-change: transform; }.uc-atw .conv-card::before{ content: ""; position: absolute; z-index: 0; pointer-events: none; left: -24.11%; top: -71.84%; width: 148.46%; height: 221.72%; opacity: 0.8; background-image: url("data:image/svg+xml;base64,PHN2ZyBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiBvdmVyZmxvdz0idmlzaWJsZSIgc3R5bGU9ImRpc3BsYXk6IGJsb2NrOyIgd2lkdGg9IjI1OTIuNTUiIGhlaWdodD0iMTY4NS4xMSIgdmlld0JveD0iMCAwIDI1OTIuNTUgMTY4NS4xMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9Ikdyb3VwIDIxNDcyMzc2NDAiPgo8ZyBpZD0iVmVjdG9yIDI3MjYxIiBmaWx0ZXI9InVybCgjZmlsdGVyMF9mXzM0MjRfMzYwODkpIj4KPHBhdGggZD0iTTE3My4zMDcgMzY5LjQ1NEM0NzQuMjAxIDExMDMuNyAxMzM2LjM3IDEyMzYgMTgxMC44NiAxMjA3LjU4QzE4MjcuNzMgMTIwNi41NyAxODMyLjkyIDEyMzEuMDggMTgxNy42MSAxMjM4LjI0QzM2Mi42NTUgMTkxOC4yNCA5My45Njc0IDk4Ny41OTcgMTQzLjc4NyAzNzMuMDg5QzE0NS4wNzcgMzU3LjE4MiAxNjcuMjU1IDM1NC42ODYgMTczLjMwNyAzNjkuNDU0WiIgZmlsbD0iI0ZGQzU3NCIvPgo8L2c+CjxnIGlkPSJWZWN0b3IgMjcyNjIiIGZpbHRlcj0idXJsKCNmaWx0ZXIxX2ZfMzQyNF8zNjA4OSkiPgo8cGF0aCBkPSJNMjQyNC40OSAzOTguNTEzQzIwNTguNCAxMTY1LjcyIDExMjYuNTMgMTI1MC4wMiA2MjQuNzg2IDExODguNDhDNjA4LjAxMSAxMTg2LjQyIDYwMS41NzIgMTIxMC41OSA2MTYuNDIyIDEyMTguNjZDMjEyNi4yMyAyMDM5LjIyIDI0NjkuNDIgMTA2MC40OSAyNDUzLjc1IDQwMy44NTZDMjQ1My4zNyAzODcuOTAxIDI0MzEuMzYgMzg0LjEwOSAyNDI0LjQ5IDM5OC41MTNaIiBmaWxsPSIjRkQ2QTM1Ii8+CjwvZz4KPC9nPgo8ZGVmcz4KPGZpbHRlciBpZD0iZmlsdGVyMF9mXzM0MjRfMzYwODkiIHg9Ii03LjYyOTM5ZS0wNiIgeT0iMjIxLjM1MSIgd2lkdGg9IjE5NjUuMDEiIGhlaWdodD0iMTM5My4zMiIgZmlsdGVyVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjb2xvci1pbnRlcnBvbGF0aW9uLWZpbHRlcnM9InNSR0IiPgo8ZmVGbG9vZCBmbG9vZC1vcGFjaXR5PSIwIiByZXN1bHQ9IkJhY2tncm91bmRJbWFnZUZpeCIvPgo8ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJzaGFwZSIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSI2OS4xNTE1IiByZXN1bHQ9ImVmZmVjdDFfZm9yZWdyb3VuZEJsdXJfMzQyNF8zNjA4OSIvPgo8L2ZpbHRlcj4KPGZpbHRlciBpZD0iZmlsdGVyMV9mXzM0MjRfMzYwODkiIHg9IjQ2OS44MDgiIHk9IjI1MS4yNDIiIHdpZHRoPSIyMTIyLjc1IiBoZWlnaHQ9IjE0MTguNjQiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJCYWNrZ3JvdW5kSW1hZ2VGaXgiIHJlc3VsdD0ic2hhcGUiLz4KPGZlR2F1c3NpYW5CbHVyIHN0ZERldmlhdGlvbj0iNjkuMTUxNSIgcmVzdWx0PSJlZmZlY3QxX2ZvcmVncm91bmRCbHVyXzM0MjRfMzYwODkiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg=="); background-size: 100% 100%; background-repeat: no-repeat; }.uc-atw .conv-card > *{ position: relative; z-index: 1; }.uc-atw .conv-card .conv-dots{ position: absolute; inset: 0; z-index: 0; }.uc-atw .conv-eyebrow{ color: var(--uc-text); font-size: 16px; font-weight: 500; letter-spacing: -0.01em; line-height: 24px; text-transform: none; }.uc-atw .reveal-text{ color: transparent; -webkit-background-clip: text; background-clip: text; }.uc-atw .conv-card .conv-title{ margin: 18px auto 0; max-width: 780px; font-size: 48px; line-height: 56px; font-weight: var(--uc-weight-medium); letter-spacing: -0.02em; text-wrap: balance; color: var(--uc-text-strong); }.uc-atw .conv-card .conv-sub{ margin: var(--uc-space-16) auto 0; max-width: 1040px; font-size: 18px; line-height: 30px; text-wrap: balance; color: var(--uc-text); }.uc-atw .conv-cta{ margin-top: clamp(40px, 5vw, 64px); text-align: center; }.uc-atw .conv-marquee-wrap{ position: relative; display: flex; justify-content: flex-start; margin-top: clamp(40px, 5vw, 64px); overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 20%, #000 80%, transparent 100%); mask-image: linear-gradient(to right, transparent 0%, #000 20%, #000 80%, transparent 100%); }.uc-atw .conv-marquee{ display: flex; flex: 0 0 auto; width: max-content; animation: conv-marquee-x 45s linear infinite; will-change: transform; }.uc-atw .conv-marquee-wrap:hover .conv-marquee{ animation-play-state: paused; }.uc-atw .conv-tile{ flex: 0 0 auto; display: grid; place-items: center; width: 90px; height: 90px; margin-right: var(--uc-space-16); border-radius: var(--uc-radius-24); background: var(--uc-inverse-bg); cursor: default; }.uc-atw .conv-tile img{ width: 48px; height: 48px; object-fit: contain; }.uc-atw .conv-tip{ position: fixed; left: 0; top: 0; z-index: 60; pointer-events: none; display: flex; flex-direction: column; gap: 4px; max-width: 300px; padding: 12px 14px; border-radius: 12px; text-align: left; background: #1c1c1c; border: 1px solid rgba(255, 255, 255, 0.10); box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5); opacity: 0; transform-origin: top left; transition: opacity 0.14s cubic-bezier(0.2, 0, 0, 1); will-change: transform; }.uc-atw .conv-tip.ucx-in{ opacity: 1; }.uc-atw .conv-tip-t{ color: #fff; font-size: 14px; font-weight: 600; line-height: 18px; }.uc-atw .conv-tip-d{ color: rgba(255, 255, 255, 0.6); font-size: 14px; line-height: 20px; }@keyframes conv-marquee-x{ from { transform: translateX(0); } to { transform: translateX(-50%); } }@media (prefers-reduced-motion: reduce){.uc-atw .conv-marquee{ animation: none; }}.uc-atw .xway-grid{ display: grid; grid-template-columns: 1fr; gap: 18px; margin: 52px auto 0; max-width: 1120px; }.uc-atw .xway-card{ border-radius: var(--r-xl); overflow: visible; background: var(--pg2); padding: 4px; }.uc-atw .xway-solo .xway-card{ display: grid; grid-template-columns: 1fr 1fr; gap: 4px; align-items: stretch; }.uc-atw .xway-media{ position: relative; overflow: hidden; min-height: 320px; border: 1px solid var(--cardbd); border-radius: 16px; background: radial-gradient(circle at 1px 1px, rgba(16, 24, 40, 0.07) 1px, transparent 0) 0 0 / 22px 22px, #fff; }.uc-atw.is-night .xway-media{ background: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.09) 1px, transparent 0) 0 0 / 22px 22px, #171717; }.uc-atw .xway-stack{ position: absolute; inset: 0; }.uc-atw .xway-shot{ position: absolute; top: 50%; left: 50%; height: 84%; width: auto; max-width: 62%; object-fit: contain; object-position: top; border-radius: 12px; border: 1px solid var(--cardbd); box-shadow: 0 22px 46px -18px rgba(16, 24, 40, 0.45); background: #fff; transition: transform 0.55s var(--ease); will-change: transform; }.uc-atw .xway-shot.s1{ transform: translate(-50%, -50%) rotate(0deg); z-index: 3; }.uc-atw .xway-shot.s2{ transform: translate(-88%, -46%) rotate(-8deg) scale(0.94); z-index: 2; }.uc-atw .xway-shot.s3{ transform: translate(-12%, -46%) rotate(8deg) scale(0.94); z-index: 1; }.uc-atw .xway-card:hover .xway-shot.s1{ transform: translate(-12%, -46%) rotate(8deg) scale(0.94); z-index: 1; }.uc-atw .xway-card:hover .xway-shot.s2{ transform: translate(-50%, -50%) rotate(0deg); z-index: 3; }.uc-atw .xway-card:hover .xway-shot.s3{ transform: translate(-88%, -46%) rotate(-8deg) scale(0.94); z-index: 2; }.uc-atw .xway-body{ display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 12px; padding: 30px 34px; }.uc-atw .xway-body .xic{ width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center; background: #f2f2f2; border: 1px solid #dcdcdc; color: #171717; margin-bottom: 12px; }.uc-atw.is-night .xway-body .xic{ background: var(--cardbg); border-color: var(--cardbd); color: var(--tx); }.uc-atw .xway-body .xic svg{ width: 24px; height: 24px; }.uc-atw .xway-body .xeye{ font-size: 12px; line-height: 18px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }.uc-atw .xway-body .xeye--live{ display: inline-flex; align-items: center; gap: 7px; color: var(--acc); }.uc-atw .xway-body .xeye--live::before{ content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 0 3px color-mix(in srgb, var(--acc) 24%, transparent); }.uc-atw .xway-body h3{ margin: 4px 0 0; font-size: 24px; line-height: 30px; font-weight: 500; letter-spacing: -0.01em; color: var(--tx); }.uc-atw .xway-body p{ margin: 0; color: var(--txd); font-size: 16px; line-height: 26px; }.uc-atw .xway-body .xway-link{ margin-top: 6px; color: var(--acc); }.uc-atw .xway-body .xway-link::after{ background: var(--acc); }@media (prefers-reduced-motion: reduce){.uc-atw .xway-shot{ transition: none; }}@media (max-width: 860px){.uc-atw .xway-solo .xway-card{ grid-template-columns: 1fr; }.uc-atw .xway-media{ border-right: 0; border-bottom: 1px solid var(--line); min-height: 300px; }.uc-atw .xway-body{ padding: 32px 28px 34px; }}.uc-atw .map-ba{ position: relative; width: 100%; max-width: 940px; margin: 0 auto; aspect-ratio: 16 / 9; border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--cardbd); box-shadow: 0 30px 70px -44px rgba(16, 24, 40, 0.5); user-select: none; touch-action: none; background: #0a0a0a; }.uc-atw .map-ba-media{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }.uc-atw .map-ba-top{ z-index: 2; will-change: clip-path; }.uc-atw .map-ba-handle{ position: absolute; top: 0; bottom: 0; z-index: 3; width: 2px; background: #fff; transform: translateX(-1px); box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06); }.uc-atw .map-ba-knob{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 44px; height: 44px; border-radius: 999px; background: #fff; display: grid; place-items: center; box-shadow: 0 8px 22px -6px rgba(0, 0, 0, 0.45); cursor: ew-resize; }.uc-atw .map-ba-knob svg{ width: 22px; height: 22px; color: var(--acc); }.uc-atw .map-ba-tag{ position: absolute; z-index: 4; top: 14px; padding: 5px 12px; border-radius: 999px; font-size: 12px; line-height: 18px; font-weight: 600; letter-spacing: 0.01em; color: #fff; background: rgba(10, 10, 10, 0.62); backdrop-filter: blur(6px); }.uc-atw .map-ba-tag.l{ left: 14px; }.uc-atw .map-ba-tag.r{ right: 14px; }.uc-atw .map-hint{ text-align: center; color: var(--txf); font-size: 14px; line-height: 22px; margin: 16px 0 0; }.uc-atw .map-chips{ margin-top: 30px; display: flex; flex-direction: column; gap: 12px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }.uc-atw .map-chip-row{ display: flex; gap: 12px; width: max-content; will-change: transform; }.uc-atw .map-chip-row.ucx-a{ animation: cm-chips-l 42s linear infinite; }.uc-atw .map-chip-row.ucx-b{ animation: cm-chips-r 48s linear infinite; }.uc-atw .widget-chip{ flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 999px; background: #fff; border: 1px solid var(--cardbd); color: var(--txd); font-size: 14px; line-height: 22px; font-weight: 500; white-space: nowrap; box-shadow: 0 6px 16px -12px rgba(16, 24, 40, 0.4); }.uc-atw .widget-chip svg{ width: var(--spacing-sprout-16); height: var(--spacing-sprout-16); flex: 0 0 auto; }.uc-atw .map-cta{ text-align: center; margin-top: 28px; }@keyframes cm-chips-l{ to { transform: translateX(-50%); } }@keyframes cm-chips-r{ from { transform: translateX(-50%); } to { transform: translateX(0); } }@media (prefers-reduced-motion: reduce){.uc-atw .map-chip-row.ucx-a, .uc-atw .map-chip-row.ucx-b{ animation: none; }}.uc-atw .tm-bars{ max-width: 980px; margin: 0 auto 44px; display: flex; flex-direction: column; gap: 30px; }.uc-atw .tm-row .tm-top{ display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }.uc-atw .tm-name{ font-size: 16px; line-height: 24px; font-weight: 500; color: var(--tx); }.uc-atw .tm-hrs{ font-size: 22px; line-height: 34px; font-weight: 700; letter-spacing: -0.01em; }.uc-atw .tm-hrs.red{ color: var(--coral); }.uc-atw .tm-hrs.brand{ color: var(--acc); }.uc-atw .tm-track{ position: relative; height: 16px; border-radius: 999px; background: var(--mist); overflow: visible; }.uc-atw .tm-fill{ position: absolute; inset: 0 auto 0 0; width: 0; border-radius: 999px; }.uc-atw .tm-fill.red{ background: linear-gradient(90deg, #f97b70, var(--coral)); }.uc-atw .tm-fill.brand{ background: linear-gradient(90deg, var(--acc2), var(--acc)); }.uc-atw .tm-live{ position: absolute; top: 50%; right: 6px; transform: translateY(-50%); z-index: 3; display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; background: #fff; border: 1px solid var(--cardbd); font-size: 12px; line-height: 18px; font-weight: 600; color: var(--tx); box-shadow: 0 4px 12px -4px rgba(16, 24, 40, 0.3); white-space: nowrap; opacity: 0; transition: opacity 0.4s var(--ease); }.uc-atw .tm-live svg{ width: 12px; height: 12px; color: var(--acc); }.uc-atw .tm-runner{ position: absolute; top: 50%; left: 0; width: 22px; height: 22px; border-radius: 50%; transform: translate(-50%, -50%); z-index: 2; }.uc-atw .tm-runner.red{ background: var(--coral); box-shadow: 0 0 0 5px color-mix(in srgb, var(--coral) 18%, transparent), 0 4px 14px -2px rgba(16, 24, 40, 0.3); }.uc-atw .tm-runner.brand{ background: var(--acc); box-shadow: 0 0 0 5px color-mix(in srgb, var(--acc) 20%, transparent), 0 4px 14px -2px rgba(16, 24, 40, 0.3); }.uc-atw .tm-bars.go .lane-without .tm-fill{ animation: tm-fill 7.2s var(--ease) forwards; }.uc-atw .tm-bars.go .lane-without .tm-runner{ animation: tm-run 7.2s var(--ease) forwards; }.uc-atw .tm-bars.go .lane-with .tm-fill{ animation: tm-fill 1.5s var(--ease) forwards; }.uc-atw .tm-bars.go .lane-with .tm-runner{ animation: tm-run 1.5s var(--ease) forwards; }.uc-atw .tm-bars.go .tm-live{ opacity: 1; transition-delay: 1.4s; }@keyframes tm-fill{ from { width: 0; } to { width: 100%; } }@keyframes tm-run{ from { left: 0; } to { left: 100%; } }@media (prefers-reduced-motion: reduce){.uc-atw .tm-bars .tm-fill{ width: 100%; animation: none; }.uc-atw .tm-bars .tm-runner{ left: 100%; animation: none; }.uc-atw .tm-bars .tm-live{ opacity: 1; transition: none; }}.uc-atw .tm-cards{ display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }.uc-atw .tm-card{ padding: 4px; border-radius: var(--r-xl); background: var(--pg2); }.uc-atw .tm-card-in{ background: #fff; border: 1px solid var(--cardbd); border-radius: 16px; padding: 24px 22px; height: 100%; }.uc-atw .tm-card-h{ display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }.uc-atw .tm-pill{ display: inline-flex; align-items: center; padding: 5px 12px; border-radius: 999px; font-size: 14px; line-height: 22px; font-weight: 700; letter-spacing: -0.01em; }.uc-atw .tm-pill.red{ color: var(--coral); background: color-mix(in srgb, var(--coral) 12%, #fff); }.uc-atw .tm-pill.brand{ color: var(--acc); background: color-mix(in srgb, var(--acc) 12%, #fff); }.uc-atw .tm-card-h h3{ margin: 0; font-size: 18px; line-height: 28px; font-weight: 500; color: var(--tx); }.uc-atw .tm-item{ display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 13px 0; border-top: 1px solid var(--line); }.uc-atw .tm-item:first-of-type{ border-top: 0; }.uc-atw .tm-item span{ color: var(--txd); font-size: 16px; line-height: 24px; }.uc-atw .tm-item b{ flex: 0 0 auto; font-size: 16px; line-height: 24px; font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }.uc-atw .tm-item.red b{ color: var(--coral); }.uc-atw .tm-item.brand b{ color: var(--acc); }.uc-atw .tm-item .tm-free{ color: var(--acc); }.uc-atw .tm-saved{ text-align: center; margin: 40px auto 0; max-width: 640px; }.uc-atw .tm-saved-num{ font-size: 44px; font-weight: 700; letter-spacing: -0.03em; color: var(--acc); line-height: 44px; }.uc-atw .tm-saved p{ margin: 12px 0 0; color: var(--txd); font-size: 16px; line-height: 24px; }.uc-atw .tm-note{ text-align: center; color: var(--txf); font-size: 14px; line-height: 22px; margin: 18px 0 0; }.uc-atw.is-night .tm-card-in{ background: #262626; }.uc-atw.is-night .tm-live{ background: #262626; border-color: rgba(255, 255, 255, 0.14); box-shadow: none; }.uc-atw.is-night .tm-pill.red{ background: color-mix(in srgb, var(--coral) 20%, #1f1f1f); }.uc-atw.is-night .tm-pill.brand{ background: color-mix(in srgb, var(--acc) 20%, #1f1f1f); }@media (max-width: 720px){.uc-atw .tm-cards{ grid-template-columns: 1fr; }}.uc-atw .watch-grid{ display: grid; grid-template-columns: 1.5fr 1fr; gap: 22px; align-items: start; }.uc-atw .watch-main-wrap{ padding: 4px; border-radius: var(--r-xl); background: var(--pg2); }.uc-atw .watch-main{ position: relative; border-radius: 16px; overflow: hidden; border: 1px solid var(--cardbd); background: #000; aspect-ratio: 16 / 9; cursor: pointer; }.uc-atw .watch-main img, .uc-atw .watch-main iframe{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; display: block; }.uc-atw .watch-main .watch-play{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; width: 74px; height: 74px; border-radius: 999px; background: var(--acc); display: grid; place-items: center; box-shadow: 0 12px 30px -8px rgba(253, 106, 53, 0.7); transition: transform 0.24s var(--ease); }.uc-atw .watch-main:hover .watch-play{ transform: translate(-50%, -50%) scale(1.06); }.uc-atw .watch-play svg{ width: 30px; height: 30px; color: #fff; margin-left: 3px; }.uc-atw .watch-main .watch-cap{ position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 40px 20px 18px; color: #fff; font-size: 16px; line-height: 24px; font-weight: 500; background: linear-gradient(0deg, rgba(0, 0, 0, 0.72), transparent); }.uc-atw .watch-list{ display: flex; flex-direction: column; gap: 10px; max-height: 500px; overflow-y: auto; padding: 6px 4px; scrollbar-width: none; -webkit-mask-image: linear-gradient(transparent 0, #000 7%, #000 88%, transparent 100%); mask-image: linear-gradient(transparent 0, #000 7%, #000 88%, transparent 100%); }.uc-atw .watch-list::-webkit-scrollbar{ width: 0; height: 0; display: none; }.uc-atw .watch-item{ display: flex; gap: 12px; align-items: center; padding: 8px; border-radius: 14px; border: 1px solid transparent; cursor: pointer; text-align: left; background: none; transition: background 0.2s var(--ease), border-color 0.2s var(--ease); }.uc-atw .watch-item:hover{ background: var(--pg2); }.uc-atw .watch-item.ucx-on{ background: color-mix(in srgb, var(--acc) 7%, #fff); border-color: var(--acc-line); }.uc-atw.is-night .watch-item.ucx-on{ background: color-mix(in srgb, var(--acc) 15%, #1f1f1f); }.uc-atw .watch-thumb{ position: relative; flex: 0 0 108px; width: 108px; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: #000; }.uc-atw .watch-thumb img{ width: 100%; height: 100%; object-fit: cover; display: block; }.uc-atw .watch-thumb::after{ content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 26px; height: 26px; border-radius: 999px; background: rgba(255, 255, 255, 0.92); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fd6a35'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E"); background-size: 15px; background-repeat: no-repeat; background-position: 56% 50%; }.uc-atw .watch-item .watch-t{ font-size: 14px; font-weight: 500; color: var(--tx); line-height: 20px; }.uc-atw .watch-cta{ text-align: center; margin-top: 30px; display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--txd); font-size: 16px; line-height: 24px; }@media (max-width: 820px){.uc-atw .watch-grid{ grid-template-columns: 1fr; }.uc-atw .watch-list{ flex-direction: row; overflow-x: auto; overflow-y: visible; max-height: none; -webkit-mask-image: none; mask-image: none; }.uc-atw .watch-item{ flex: 0 0 240px; }}.uc-atw .sprout-shot{ max-width: 1000px; margin: 8px auto 0; padding: 4px; border-radius: var(--r-xl); background: var(--pg2); }.uc-atw .sprout-shot img{ display: block; width: 100%; height: auto; border: 1px solid var(--cardbd); border-radius: 16px; }.uc-atw .tpl-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }.uc-atw .tpl-card{ display: flex; flex-direction: column; padding: 4px; border-radius: var(--r-xl); background: var(--pg2); transition: transform 0.24s var(--ease); }.uc-atw .tpl-card:hover{ transform: translateY(-4px); }.uc-atw .tpl-thumb{ position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #fff; border: 1px solid var(--cardbd); border-radius: 16px; }.uc-atw .tpl-thumb img{ width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 15px; }.uc-atw .tpl-badge{ position: absolute; top: 12px; left: 12px; z-index: 2; }.uc-atw .tpl-body{ padding: 12px; display: flex; flex-direction: column; gap: 4px; flex: 1; }.uc-atw .tpl-body h3{ margin: 0; font-size: 18px; line-height: 28px; font-weight: 500; color: var(--tx); }.uc-atw .tpl-body p{ margin: 0; color: var(--txd); font-size: 14px; line-height: 20px; }.uc-atw .tpl-cta{ text-align: center; margin-top: 36px; }@media (max-width: 900px){.uc-atw .tpl-grid{ grid-template-columns: 1fr 1fr; }}@media (max-width: 560px){.uc-atw .tpl-grid{ grid-template-columns: 1fr; }}.uc-atw .feat-wrap{ display: grid; grid-template-columns: 250px 1fr; gap: 32px; margin-top: 44px; align-items: start; }.uc-atw .feat-side{ position: sticky; top: 96px; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--cardbd); border-radius: 16px; overflow: hidden; }.uc-atw .feat-tabs{ position: relative; display: flex; flex-direction: column; gap: 4px; margin: 4px; padding: 4px; box-shadow: inset 0 0 0 1px var(--cardbd); border-radius: 12px; background: var(--mist); }.uc-atw .feat-tab-ind{ position: absolute; left: 4px; right: 4px; top: 0; height: 0; opacity: 0; border-radius: 9px; background: #fff; box-shadow: 0 1px 3px rgba(16, 24, 40, 0.12); transition: transform 0.24s cubic-bezier(0.3, 0, 0, 1), height 0.24s cubic-bezier(0.3, 0, 0, 1); z-index: 0; pointer-events: none; }.uc-atw .feat-tab{ position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; cursor: pointer; padding: 11px 14px; border: 0; border-radius: 9px; background: transparent; font-family: inherit; font-size: 14px; font-weight: 600; line-height: 18px; color: var(--txd); transition: color 0.2s var(--ease); }.uc-atw .feat-tab:hover{ color: var(--tx); }.uc-atw .feat-tab.ucx-is-active{ color: var(--tx); }.uc-atw .ft-count{ flex: 0 0 auto; font-size: 12px; line-height: 18px; font-weight: 700; color: var(--txf); background: #fff; box-shadow: inset 0 0 0 1px var(--cardbd); border-radius: 999px; padding: 2px 9px; transition: color 0.2s var(--ease), background 0.2s var(--ease); }.uc-atw .feat-tab.ucx-is-active .ft-count{ color: var(--acc); background: color-mix(in srgb, var(--acc) 12%, #fff); box-shadow: none; }.uc-atw.is-night .feat-side{ background: var(--pg2); }.uc-atw.is-night .feat-tab-ind{ background: #383838; box-shadow: none; }.uc-atw.is-night .ft-count{ background: #262626; color: var(--txd); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); }.uc-atw.is-night .feat-tab.ucx-is-active .ft-count{ color: var(--acc); background: color-mix(in srgb, var(--acc) 22%, #1f1f1f); box-shadow: none; }.uc-atw .fbento{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; align-items: stretch; }.uc-atw .fcard{ padding: 4px; border-radius: var(--r-xl); background: var(--pg2); transition: transform 0.24s var(--ease); }.uc-atw .fcard:hover{ transform: translateY(-4px); }.uc-atw .fcard-in{ display: flex; flex-direction: column; height: 100%; background: transparent; }.uc-atw .fcard .bento-media{ position: relative; aspect-ratio: 16 / 10; background: #fff; overflow: hidden; border: 1px solid var(--cardbd); border-radius: 16px; }.uc-atw .fcard .bento-vid{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; transition: opacity 0.5s var(--ease), transform 0.6s var(--ease); }.uc-atw .fcard .bento-vid.ready{ opacity: 1; }.uc-atw .fcard:hover .bento-vid{ transform: scale(1.03); }.uc-atw .bento-body{ padding: 12px; }.uc-atw .bento-body h3{ margin: 0 0 5px; font-size: 18px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; color: var(--tx); }.uc-atw .bento-body p{ margin: 0; color: var(--txd); font-size: 16px; line-height: 24px; }.uc-atw .bento-note{ color: var(--acc); font-weight: 600; }@media (max-width: 900px){.uc-atw .feat-wrap{ grid-template-columns: 1fr; gap: 20px; }.uc-atw .feat-side{ position: static; }}@media (max-width: 620px){.uc-atw .fbento{ grid-template-columns: 1fr; }}@media (prefers-reduced-motion: reduce){.uc-atw .fcard .bento-vid{ transition: opacity 0.3s; }.uc-atw .fcard:hover{ transform: none; }.uc-atw .fcard:hover .bento-vid{ transform: none; }}.uc-atw .opt-zig{ margin-top: 44px; display: flex; flex-direction: column; gap: 96px; }.uc-atw .opt-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: center; }.uc-atw .opt-media .ucx-frame{ position: relative; margin: 0; max-width: none; aspect-ratio: 16 / 10; border-radius: var(--r-card); overflow: hidden; border: 1px solid var(--cardbd); background: #0b0912; }.uc-atw .opt-media .step-vid{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; z-index: 1; }.uc-atw .step-replay{ position: absolute; inset: 0; margin: auto; width: 58px; height: 58px; padding: 0; border: 0; border-radius: 50%; cursor: pointer; z-index: 3; display: grid; place-items: center; color: #fff; background: rgba(10, 6, 20, 0.6); box-shadow: 0 10px 26px -6px rgba(0, 0, 0, 0.55), inset 0 0 0 1px rgba(255, 255, 255, 0.2); transition: opacity 0.28s var(--ease), transform 0.2s var(--ease), background 0.2s ease; }.uc-atw .step-replay svg{ margin-left: 3px; }.uc-atw .step-replay:hover{ transform: scale(1.07); background: var(--acc); }.uc-atw .ucx-frame.vid-playing .step-replay{ opacity: 0; pointer-events: none; transform: scale(0.9); }.uc-atw .opt-copy .ucx-eyebrow, .uc-atw .opt-rail .ucx-eyebrow{ margin-bottom: 16px; }.uc-atw .opt-copy h3, .uc-atw .opt-rail h3{ font-size: 26px; line-height: 40px; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 12px; color: var(--tx); }.uc-atw .opt-copy p, .uc-atw .opt-rail p{ color: var(--txd); font-size: 16px; line-height: 26px; margin: 0 0 12px; }.uc-atw .opt-copy .opt-note{ color: var(--txf); font-size: 16px; line-height: 24px; }.uc-atw .opt-manual{ display: grid; grid-template-columns: 0.92fr 1.08fr; gap: 56px; align-items: start; min-height: 2860px; }.uc-atw .opt-rail{ position: sticky; top: 110px; align-self: start; }.uc-atw .opt-titles{ list-style: none; margin: 24px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }.uc-atw .opt-title{ display: flex; align-items: center; gap: 14px; padding: 13px 15px; border-radius: 12px; color: var(--txf); font-weight: 500; font-size: 16px; line-height: 24px; border: 1px solid transparent; transition: color 0.3s var(--ease), background 0.3s var(--ease), border-color 0.3s var(--ease); }.uc-atw .opt-title .ot-num{ font-size: 12px; line-height: 18px; font-weight: 500; color: var(--txf); font-variant-numeric: tabular-nums; }.uc-atw .opt-title.is-done{ color: var(--txd); }.uc-atw .opt-title.is-done .ot-num{ color: var(--tx); }.uc-atw .opt-title.ucx-is-active{ color: var(--tx); background: #f1f1f1; border-color: #d6d6d6; }.uc-atw .opt-title.ucx-is-active .ot-num{ color: var(--txd); }.uc-atw .opt-list{ position: sticky; top: calc(50vh - 270px); height: 540px; overflow: hidden; isolation: isolate; }.uc-atw .opt-list::before, .uc-atw .opt-list::after{ content: ""; position: absolute; z-index: 2; right: 0; left: 0; height: 150px; pointer-events: none; }.uc-atw .opt-list::before{ top: 0; background: linear-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0.96) 24%, rgba(255, 255, 255, 0) 100%); }.uc-atw .opt-list::after{ bottom: 0; background: linear-gradient(to top, #fff 0%, rgba(255, 255, 255, 0.96) 24%, rgba(255, 255, 255, 0) 100%); }.uc-atw .opt-list-track{ display: flex; flex-direction: column; gap: 16px; will-change: transform; transition: transform 0.55s cubic-bezier(.2,.7,.2,1); }.uc-atw .opt-item{ display: flex; gap: 14px; padding: 20px 22px; border-radius: 16px; background: #fff; border: 1px solid var(--cardbd); opacity: 0.45; transition: opacity 0.4s var(--ease), border-color 0.4s var(--ease), background 0.4s var(--ease), box-shadow 0.4s var(--ease); }.uc-atw .opt-item .oi-check{ flex-shrink: 0; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: #f2f2f2; border: 1px solid #dcdcdc; color: #cfcfcf; transition: color 0.4s var(--ease), background 0.4s var(--ease), border-color 0.4s var(--ease); }.uc-atw .opt-item .oi-check svg{ width: 15px; height: 15px; }.uc-atw .opt-item h4{ margin: 0 0 5px; font-size: 18px; line-height: 28px; font-weight: 600; color: var(--tx); letter-spacing: -0.01em; }.uc-atw .opt-item p{ margin: 0; font-size: 16px; line-height: 26px; color: var(--txd); }.uc-atw .opt-item.is-seen{ opacity: 0.85; }.uc-atw .opt-item.is-seen .oi-check{ color: #171717; border-color: #dcdcdc; background: #f2f2f2; }.uc-atw .opt-item.ucx-is-active{ opacity: 1; background: #f1f1f1; border-color: #d6d6d6; }.uc-atw .opt-item.ucx-is-active .oi-check{ color: #171717; background: #fff; border-color: #d6d6d6; }.uc-atw .opt-item.ucx-is-active h4{ color: var(--tx); }.uc-atw .opt-item.ucx-is-active p{ color: var(--txd); }.uc-atw.is-night .opt-title.ucx-is-active{ background: #262626; border-color: rgba(255, 255, 255, 0.14); }.uc-atw.is-night .opt-list::before{ background: linear-gradient(to bottom, var(--pg) 0%, rgba(23, 23, 23, 0.96) 24%, rgba(23, 23, 23, 0) 100%); }.uc-atw.is-night .opt-list::after{ background: linear-gradient(to top, var(--pg) 0%, rgba(23, 23, 23, 0.96) 24%, rgba(23, 23, 23, 0) 100%); }.uc-atw.is-night .opt-item{ background: var(--cardbg); }.uc-atw.is-night .opt-item .oi-check{ background: #262626; border-color: rgba(255, 255, 255, 0.12); color: #7d7d7d; }.uc-atw.is-night .opt-item.is-seen .oi-check{ background: #262626; border-color: rgba(255, 255, 255, 0.14); color: #f5f5f5; }.uc-atw.is-night .opt-item.ucx-is-active{ background: #262626; border-color: rgba(255, 255, 255, 0.16); }.uc-atw.is-night .opt-item.ucx-is-active .oi-check{ background: #1f1f1f; border-color: rgba(255, 255, 255, 0.18); color: #f5f5f5; }@media (max-width: 900px){.uc-atw .opt-zig{ gap: 56px; }.uc-atw .opt-row{ grid-template-columns: 1fr; gap: 28px; }.uc-atw .opt-manual{ grid-template-columns: 1fr; gap: 28px; min-height: 0; }.uc-atw .opt-rail{ position: static; }.uc-atw .opt-list{ position: static; height: auto; overflow: visible; }.uc-atw .opt-list::before, .uc-atw .opt-list::after{ display: none; }.uc-atw .opt-list-track{ transform: none !important; }}@media (prefers-reduced-motion: reduce){.uc-atw .opt-item{ opacity: 1; }.uc-atw .opt-list-track{ transition: none; }}.uc-atw .ucx-sec-head + .uc-content, .uc-atw .ucx-sec-head + .xway-grid, .uc-atw .ucx-sec-head + .feat-wrap, .uc-atw .ucx-sec-head + .opt-zig, .uc-atw .ucx-sec-head + .tm-bars, .uc-atw .ucx-sec-head + .watch-grid, .uc-atw .ucx-sec-head + .sprout-shot, .uc-atw .ucx-sec-head + .map-wrap, .uc-atw .ucx-sec-head + .tpl-grid{ margin-top: 52px; }.cm-page .uc-atw .ucx-sec{ padding-top: 66px; padding-bottom: 66px; }.cm-page .uc-atw .ucx-sec.ax{ padding-bottom: 66px; }.cm-page .uc-atw .ucx-hero{ padding-top: clamp(120px, 15vh, 176px); padding-bottom: 66px; }:where(.uc-atw) .cm-page .uc-section{ padding-block: 66px; }.cm-page .uc-atw .ucx-sec.sec-faq{ padding-bottom: 132px; }.uc-atw .cm-btabs{ background: #fff; }.uc-atw.is-night .cm-btabs{ background: transparent; }.uc-atw .prob-grid, .uc-atw .sol-grid, .uc-atw .resp-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 52px; align-items: center; }.uc-atw .sol-grid--swap .sol-media{ order: -1; }.uc-atw .prob-list{ display: flex; flex-direction: column; gap: 16px; margin-top: 22px; }.uc-atw .prob-item{ display: flex; gap: 14px; align-items: flex-start; }.uc-atw .prob-item .pk{ flex-shrink: 0; margin-top: -3px; font-size: 12px; font-weight: 700; color: var(--acc-dk); width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--acc-soft); border: 1px solid var(--acc-line); line-height: 14px; }.uc-atw .prob-item p{ margin: 0; color: var(--txd); font-size: 16px; line-height: 24px; }.uc-atw .prob-item strong{ color: var(--tx); font-weight: 700; }.uc-atw .prob-closing{ margin-top: 24px; color: var(--tx); font-size: 16px; line-height: 26px; border-left: 2px solid var(--acc); padding-left: 16px; }.uc-atw .checklist-tray{ align-self: start; padding: 4px; background: var(--mist); border-radius: var(--r-card); }.uc-atw .checklist{ padding: 24px 26px; border-radius: var(--r-card); background: var(--cardbg); border: 1px solid var(--cardbd); }.uc-atw .cl-ttl{ font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--txf); margin-bottom: 4px; line-height: 14px; }.uc-atw .cl-list{ display: flex; flex-direction: column; }.uc-atw .cl-item{ display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 18px; }.uc-atw .cl-item:last-child{ border-bottom: 0; }.uc-atw .cl-box{ width: 18px; height: 18px; border-radius: 5px; flex-shrink: 0; position: relative; border: 1.5px solid var(--acc); background: var(--cardbg); transition: border-color 0.35s var(--ease), background-color 0.35s var(--ease); }.uc-atw .cl-text{ position: relative; color: var(--tx); }.uc-atw .cl-pending{ margin-left: auto; font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--coral); background: color-mix(in srgb, var(--coral) 9%, var(--cardbg)); border: 1px solid color-mix(in srgb, var(--coral) 30%, transparent); padding: 2px 8px; border-radius: 999px; opacity: 0; transition: opacity 0.4s var(--ease); line-height: 12px; }.uc-atw .cl-item.done .cl-box::after{ content: ""; position: absolute; inset: 0; background: var(--acc); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center / 12px 12px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center / 12px 12px no-repeat; transform: scale(0); transform-origin: center; transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1); }.uc-atw .cl-item.done .cl-text{ color: var(--txf); }.uc-atw .cl-item.done .cl-text::after{ content: ""; position: absolute; left: -3px; right: -4px; top: 52%; height: 1.4px; border-radius: 2px; background: var(--acc); opacity: .9; transform: translateY(-50%) rotate(-1deg) scaleX(0); transform-origin: left; transition: transform 0.45s var(--ease); }.uc-atw .checklist.struck .cl-item.done .cl-box::after{ transform: scale(1); }.uc-atw .checklist.struck .cl-item.done .cl-text::after{ transform: translateY(-50%) rotate(-1deg) scaleX(1); }.uc-atw .checklist.struck .cl-item:not(.done) .cl-box{ border-color: color-mix(in srgb, var(--coral) 60%, transparent); background: color-mix(in srgb, var(--coral) 9%, var(--cardbg)); }.uc-atw .checklist.struck .cl-item:not(.done) .cl-pending{ opacity: 1; animation: f2w-pending-nudge 2.6s var(--ease) infinite; }.uc-atw .checklist.struck .cl-item.done:nth-child(1) .cl-box::after, .uc-atw .checklist.struck .cl-item.done:nth-child(1) .cl-text::after{ transition-delay: 0s; }.uc-atw .checklist.struck .cl-item.done:nth-child(2) .cl-box::after, .uc-atw .checklist.struck .cl-item.done:nth-child(2) .cl-text::after{ transition-delay: .2s; }.uc-atw .checklist.struck .cl-item.done:nth-child(3) .cl-box::after, .uc-atw .checklist.struck .cl-item.done:nth-child(3) .cl-text::after{ transition-delay: .4s; }.uc-atw .checklist.struck .cl-item.done:nth-child(4) .cl-box::after, .uc-atw .checklist.struck .cl-item.done:nth-child(4) .cl-text::after{ transition-delay: .6s; }.uc-atw .checklist.struck .cl-item.done:nth-child(5) .cl-box::after, .uc-atw .checklist.struck .cl-item.done:nth-child(5) .cl-text::after{ transition-delay: .8s; }.uc-atw .checklist.struck .cl-item.done:nth-child(6) .cl-box::after, .uc-atw .checklist.struck .cl-item.done:nth-child(6) .cl-text::after{ transition-delay: 1s; }.uc-atw .checklist.struck .cl-item:nth-child(n+7) .cl-box{ transition-delay: 1.2s; }.uc-atw .checklist.struck .cl-item:nth-child(n+7) .cl-pending{ transition-delay: 1.2s; }@keyframes f2w-pending-nudge{ 0%,80%,100% { transform: translateX(0) rotate(0); } 84% { transform: translateX(-1.5px) rotate(-2.5deg); } 88% { transform: translateX(1.5px) rotate(2.5deg); } 92% { transform: translateX(-1px) rotate(-1.5deg); } 96% { transform: translateX(1px) rotate(1.5deg); } }.uc-atw .sol-points{ list-style: none; margin: 20px 0; padding: 0; display: flex; flex-direction: column; gap: 13px; }.uc-atw .sol-points li{ display: flex; gap: 12px; align-items: flex-start; color: var(--txd); font-size: 16px; line-height: 24px; }.uc-atw .sol-points .ck{ color: var(--txd); font-weight: 700; flex-shrink: 0; }.uc-atw .sol-points strong{ color: var(--tx); font-weight: 700; }.uc-atw .sol-shot-tray{ align-self: center; padding: 4px; background: var(--mist); border-radius: var(--r-card); }.uc-atw .sol-shot{ border-radius: var(--r-card); overflow: hidden; background: var(--cardbg); border: 1px solid var(--cardbd); transition: border-color 0.34s var(--ease); }.uc-atw .sol-shot img{ width: 100%; height: auto; display: block; }.uc-atw .sol-shot:hover{ border-color: var(--acc-line); }.uc-atw .prob-grid > div > .ucx-eyebrow, .uc-atw .sol-grid > div > .ucx-eyebrow, .uc-atw .resp-grid > div > .ucx-eyebrow{ margin-bottom: 14px; }.uc-atw .prob-grid h2, .uc-atw .sol-grid h2, .uc-atw .resp-grid h2{ text-align: left; }@media (max-width: 860px){.uc-atw .prob-grid, .uc-atw .sol-grid, .uc-atw .resp-grid{ grid-template-columns: minmax(0,1fr); gap: 30px; }.uc-atw .sol-grid--swap .sol-media{ order: 0; }}.uc-atw .motion-grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; margin: 44px auto 0; max-width: 1060px; }.uc-atw .motion-card{ padding: 4px 4px 0; display: flex; flex-direction: column; border-radius: var(--r-card); background: var(--mist); }.uc-atw .motion-card .ucx-frame{ margin: 0; max-width: none; width: 100%; border-radius: 14px; }.uc-atw .motion-body{ padding: 12px 12px; }.uc-atw .motion-body h3{ font-size: 22px; line-height: 34px; margin: 0 0 9px; font-weight: 500; letter-spacing: -0.01em; color: var(--tx); }.uc-atw .motion-body p{ margin: 0; color: var(--txd); font-size: 16px; line-height: 26px; }@media (max-width: 760px){.uc-atw .motion-grid{ grid-template-columns: minmax(0,1fr); }}.uc-atw .mmock-frame{ display: block; position: relative; aspect-ratio: 16/10; background: #0e1016; border: 1px solid var(--cardbd); overflow: hidden; place-items: stretch; container-type: inline-size; }.uc-atw .mmock-particles{ position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; display: block; }.uc-atw .mmock{ position: relative; z-index: 2; display: flex; flex-direction: column; box-sizing: border-box; height: 100%; font-size: 1.965cqw; }.uc-atw .mmock-hero{ padding: 2.2em 1.8em 1em; }.uc-atw .mmock-title{ font-size: 2em; font-weight: 600; letter-spacing: -0.02em; color: #fff; line-height: 1.2; }.uc-atw .mmock-sub{ font-size: 1.2em; color: rgba(255,255,255,.6); margin-top: 0.583em; max-width: 62%; line-height: 1.3; }.uc-atw .mmock-btn{ display: inline-flex; align-items: center; justify-content: center; margin-top: 1.222em; padding: 0.556em 1.333em; border-radius: 0.667em; background: var(--acc); color: var(--cardbg); font-size: 0.9em; font-weight: 700; line-height: 1.556em; }.uc-atw .mmock-cards{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.8em; padding: 1.8em; margin-top: auto; }.uc-atw .mmock-c{ background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 1em; padding: 1em; display: flex; flex-direction: column; gap: 0.6em; }.uc-atw .mmock-ci{ width: 2.4em; height: 2.4em; border-radius: 0.7em; border: 1px solid rgba(253,106,53,.5); display: grid; place-items: center; color: var(--acc); flex: 0 0 auto; }.uc-atw .mmock-ci svg{ width: 1.4em; height: 1.4em; }.uc-atw .mmock-c strong{ font-size: 1.2em; font-weight: 700; color: #fff; line-height: 1; }.uc-atw .mmock-c small{ font-size: 1em; line-height: 1.2; color: rgba(255,255,255,.55); }.uc-atw .mmock--subtle .mmock-title, .uc-atw .mmock--subtle .mmock-sub, .uc-atw .mmock--subtle .mmock-btn, .uc-atw .mmock--subtle .mmock-c{ opacity: 0; animation: f2w-mm-rise 6s var(--ease) infinite; }.uc-atw .mmock--subtle .mmock-title{ animation-delay: .3s; }.uc-atw .mmock--subtle .mmock-sub{ animation-delay: .5s; }.uc-atw .mmock--subtle .mmock-btn{ animation-delay: .7s; }.uc-atw .mmock--subtle .mmock-cards .mmock-c:nth-child(1){ animation-delay: .95s; }.uc-atw .mmock--subtle .mmock-cards .mmock-c:nth-child(2){ animation-delay: 1.1s; }.uc-atw .mmock--subtle .mmock-cards .mmock-c:nth-child(3){ animation-delay: 1.25s; }.uc-atw .mmock-frame:has(.mmock--immersive){ background: linear-gradient(rgba(14,16,22,.6), rgba(14,16,22,.6)), radial-gradient(120% 100% at 20% -10%, rgba(253,106,53,.28), transparent 60%); }.uc-atw .mmock--immersive .mmock-btn{ animation: f2w-mm-pulse 2.6s var(--ease) infinite; }.uc-atw .mmock--immersive .mmock-cards .mmock-c{ animation: f2w-mm-float 4.4s var(--ease) infinite; }.uc-atw .mmock--immersive .mmock-cards .mmock-c:nth-child(2){ animation-delay: .5s; }.uc-atw .mmock--immersive .mmock-cards .mmock-c:nth-child(3){ animation-delay: 1s; }@keyframes f2w-mm-rise{ 0% { opacity: 0; transform: translateY(15px); } 12%,82% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(15px); } }@keyframes f2w-mm-pulse{ 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }@keyframes f2w-mm-float{ 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }@media (prefers-reduced-motion: reduce){.uc-atw .mmock--subtle .mmock-title, .uc-atw .mmock--subtle .mmock-sub, .uc-atw .mmock--subtle .mmock-btn, .uc-atw .mmock--subtle .mmock-c{ opacity: 1; animation: none; }.uc-atw .mmock--immersive .mmock-btn, .uc-atw .mmock--immersive .mmock-cards .mmock-c{ animation: none; }}.uc-atw .rp{ display: flex; flex-direction: column; align-items: center; gap: 20px; }.uc-atw .rp-stage{ width: 100%; height: 340px; display: flex; align-items: center; justify-content: center; }.uc-atw .rp-frame{ width: 480px; max-width: 100%; height: 340px; margin: 0 auto; border-radius: 14px; overflow: hidden; border: 1.5px solid transparent; background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, var(--acc), var(--acc2) 60%, var(--acc)) border-box; box-shadow: 0 22px 54px -30px rgba(16,24,40,.35); transition: width 0.5s var(--ease); display: flex; flex-direction: column; }.uc-atw .rp-frame[data-device="tablet"]{ width: 320px; }.uc-atw .rp-frame[data-device="mobile"]{ width: 210px; }.uc-atw .rp-chrome{ display: flex; align-items: center; gap: 6px; padding: 9px 12px; background: var(--mist); border-bottom: 1px solid var(--line); flex-shrink: 0; }.uc-atw .rp-cdot{ width: 8px; height: 8px; border-radius: 50%; background: var(--cardbd); }.uc-atw .rp-url{ margin-left: 8px; font-size: 12px; color: var(--txf); background: #fff; border: 1px solid var(--line); padding: 2px 10px; border-radius: 20px; white-space: nowrap; overflow: hidden; line-height: 14px; }.uc-atw .rp-screen{ position: relative; overflow: hidden; flex: 1; background: #fff; }.uc-atw .rp-vid{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: none; background: #fff; }.uc-atw .rp-vid.ucx-is-active{ display: block; }.uc-atw .rp-icons{ display: flex; gap: 8px; }.uc-atw .rp-ic{ width: 44px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: #fff; border: 1px solid var(--cardbd); color: var(--txd); cursor: pointer; transition: color 0.26s var(--ease), background 0.26s var(--ease), border-color 0.26s var(--ease); }.uc-atw .rp-ic svg{ width: 19px; height: 19px; }.uc-atw .rp-ic:hover{ color: var(--tx); border-color: var(--acc-line); }.uc-atw .rp-ic.ucx-is-active{ color: #fff; background: var(--acc); border-color: var(--acc); }.uc-atw .race{ margin-top: 48px; display: flex; flex-direction: column; gap: 22px; }.uc-atw .race-lane{ display: flex; flex-direction: column; gap: 10px; }.uc-atw .race-meta{ display: flex; align-items: center; justify-content: space-between; }.uc-atw .race-name{ font-size: 14px; font-weight: 700; color: var(--tx); line-height: 18px; }.uc-atw .race-clock{ font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 22px; }.uc-atw .lane-without .race-clock{ color: var(--coral); }.uc-atw .lane-with .race-clock{ color: var(--acc-dk); }.uc-atw .race-track{ position: relative; height: 16px; border-radius: 999px; background: var(--mist); border: 1px solid var(--cardbd); overflow: visible; }.uc-atw .race-fill{ position: absolute; inset: 0 auto 0 0; width: 0; border-radius: 999px; }.uc-atw .lane-without .race-fill{ background: linear-gradient(90deg, rgba(246,82,88,.4), var(--coral)); }.uc-atw .lane-with .race-fill{ background: linear-gradient(90deg, var(--acc2), var(--acc)); }.uc-atw .race-tick{ position: absolute; top: 50%; width: 2px; height: 10px; transform: translate(-50%, -50%); background: var(--cardbd); border-radius: 2px; }.uc-atw .race-runner{ position: absolute; top: 50%; left: 0; width: 22px; height: 22px; border-radius: 50%; transform: translate(-50%, -50%); z-index: 2; }.uc-atw .lane-without .race-runner{ background: var(--coral); box-shadow: 0 0 0 5px rgba(246,82,88,.16); }.uc-atw .lane-with .race-runner{ background: var(--acc); box-shadow: 0 0 0 5px rgba(253,106,53,.18); }.uc-atw .race-flag{ position: absolute; top: 50%; right: 6px; transform: translateY(-50%); z-index: 3; font-size: 12px; font-weight: 700; color: #fff; background: var(--acc); padding: 3px 9px; border-radius: 999px; white-space: nowrap; opacity: 0; transition: opacity 0.3s var(--ease); line-height: 14px; }.uc-atw .race.go .lane-without .race-fill{ animation: f2w-race-fill 7.2s var(--ease) forwards; }.uc-atw .race.go .lane-without .race-runner{ animation: f2w-race-run 7.2s var(--ease) forwards; }.uc-atw .race.go .lane-with .race-fill{ animation: f2w-race-fill 1.5s var(--ease) forwards; }.uc-atw .race.go .lane-with .race-runner{ animation: f2w-race-run 1.5s var(--ease) forwards; }.uc-atw .race.go .lane-with .race-flag{ opacity: 1; transition-delay: 1.4s; }@keyframes f2w-race-fill{ from { width: 0; } to { width: 100%; } }@keyframes f2w-race-run{ from { left: 0; } to { left: 100%; } }.uc-atw .race-cols{ display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 40px; }.uc-atw .race-col{ padding: 22px 24px; border-radius: var(--r-card); background: #fff; border: 1px solid var(--cardbd); box-shadow: 0 12px 30px -22px rgba(16,24,40,.22); }.uc-atw .rc-head{ display: flex; align-items: center; gap: 12px; font-size: 16px; font-weight: 700; color: var(--tx); margin-bottom: 16px; line-height: 22px; }.uc-atw .rc-badge{ font-size: 12px; font-weight: 700; padding: 4px 11px; border-radius: 999px; line-height: 14px; }.uc-atw .rc-bad{ color: var(--coral); background: #fff1ef; border: 1px solid rgba(246,82,88,.4); }.uc-atw .rc-good{ color: #fff; background: var(--acc); }.uc-atw .race-col ul{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }.uc-atw .race-col li{ display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 11px 0; border-top: 1px solid var(--line); font-size: 14px; color: var(--txd); line-height: 18px; }.uc-atw .race-col li:first-child{ border-top: 0; }.uc-atw .race-col li em{ flex: 0 0 auto; font-style: normal; font-weight: 700; font-variant-numeric: tabular-nums; }.uc-atw .rc-without li em{ color: var(--coral); }.uc-atw .rc-with li em{ color: var(--acc-dk); }.uc-atw .rc-with li em.rc-auto{ color: var(--acc2); font-weight: 500; }.uc-atw .race-saved{ margin-top: 24px; text-align: center; padding: 34px 24px; border-radius: var(--r-card); background-color: var(--pg); background-image: linear-gradient(135deg, rgba(128, 128, 128, 0.10), rgba(128, 128, 128, 0)); border: 1px solid var(--acc-line); transition: background-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.55s cubic-bezier(0.4, 0, 0.2, 1); }.uc-atw .rs-eyebrow{ font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--acc-dk); line-height: 14px; }.uc-atw .rs-num{ display: flex; align-items: baseline; justify-content: center; gap: 6px; margin-top: 10px; font-weight: 700; font-size: clamp(2.375rem, 6vw, 3.625rem); line-height: 1; color: var(--tx); font-variant-numeric: tabular-nums; }.uc-atw .rs-num .rs-dash{ color: var(--txf); }.uc-atw .rs-num .rs-unit{ font-size: 14px; font-weight: 700; color: var(--txd); line-height: 20px; }.uc-atw .rs-sub{ margin: 14px 0 0; font-size: 16px; color: var(--txd); line-height: 26px; }.uc-atw .rs-sub b{ color: var(--acc-dk); font-weight: 700; }@media (max-width: 760px){.uc-atw .race-cols{ grid-template-columns: 1fr; }}@media (prefers-reduced-motion: reduce){.uc-atw .race .race-fill{ width: 100% !important; animation: none !important; }.uc-atw .race .race-runner{ left: 100% !important; animation: none !important; }.uc-atw .race .lane-with .race-flag{ opacity: 1; }}.uc-atw .pwr{ padding: 96px 0; overflow: hidden; }.uc-atw .pwr-wrap{ max-width: 1200px; margin: 0 auto; padding: 0 var(--uc-gutter); }.uc-atw .pwr-head{ text-align: center; max-width: 720px; margin: 0 auto 54px; }.uc-atw .pwr-eyebrow{ display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: var(--acc-dk); background: var(--acc-soft); border: 1px solid var(--acc-line); padding: 6px 14px; border-radius: 999px; margin-bottom: 20px; line-height: 18px; }.uc-atw .pwr-head h2{ font-size: clamp(1.875rem, 4vw, 2.75rem); line-height: 1.08; font-weight: 500; letter-spacing: -0.02em; margin: 0 0 16px; color: var(--tx); }.uc-atw .pwr-head h2 .lem{ color: var(--tx); }.uc-atw .pwr-head p{ font-size: 16px; line-height: 26px; color: var(--txd); margin: 0; }.uc-atw .pwr-grid{ display: grid; grid-template-columns: 1fr auto; gap: 56px; align-items: center; }@media (max-width: 980px){.uc-atw .pwr-grid{ grid-template-columns: 1fr; gap: 40px; }.uc-atw .pwr-copy, .uc-atw .pwr-editor{ min-width: 0; }}.uc-atw .pwr-copy{ position: relative; min-height: 340px; }.uc-atw .pwr-slidewrap{ position: relative; display: grid; }.uc-atw .pwr-slide{ grid-column: 1; grid-row: 1; opacity: 0; transform: translateY(10px); pointer-events: none; padding-left: 24px; transition: opacity 0.5s var(--ease), transform 0.5s var(--ease); }.uc-atw .pwr-slide.is-on{ opacity: 1; transform: none; pointer-events: auto; }.uc-atw .pwr-slidewrap::before{ content: ""; position: absolute; left: 0; top: 5px; bottom: 8px; width: 2px; border-radius: 2px; background: var(--cardbd); }.uc-atw .pwr-slidewrap::after{ content: ""; position: absolute; left: 0; top: 5px; bottom: 8px; width: 2px; border-radius: 2px; background: var(--acc); transform: scaleY(0); transform-origin: top; }.uc-atw .pwr-slidewrap.play::after{ animation: f2w-pwrline 10s linear forwards; }@keyframes f2w-pwrline{ from { transform: scaleY(0); } to { transform: scaleY(1); } }.uc-atw .pwr-kick{ display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--txf); margin-bottom: 16px; line-height: 14px; }.uc-atw .pwr-kick .dot{ width: 6px; height: 6px; border-radius: 50%; background: var(--acc); }.uc-atw .pwr-kick b{ color: var(--tx); font-weight: 700; }.uc-atw .pwr-slide h3{ font-size: clamp(1.375rem, 2.6vw, 1.875rem); line-height: 1.18; margin: 0 0 14px; font-weight: 500; letter-spacing: -0.01em; color: var(--tx); }.uc-atw .pwr-slide p{ font-size: 16px; line-height: 26px; color: var(--txd); margin: 0 0 18px; max-width: 440px; }.uc-atw .pwr-tags{ display: flex; flex-wrap: wrap; gap: 8px; }.uc-atw .pwr-tags span{ font-size: 12px; color: var(--txd); background: var(--mist); border: 1px solid var(--cardbd); padding: 6px 12px; border-radius: 8px; line-height: 14px; }.uc-atw .pwr-dots{ display: flex; gap: 8px; margin-top: 40px; margin-left: 24px; }.uc-atw .pwr-dot{ width: 9px; height: 9px; border-radius: 50%; background: var(--cardbd); border: 0; padding: 0; cursor: pointer; transition: width 0.24s var(--ease), background 0.24s var(--ease); }.uc-atw .pwr-dot:hover{ background: var(--txf); }.uc-atw .pwr-dot.is-on{ width: 22px; border-radius: 5px; background: var(--acc); }.uc-atw .pwr-editor{ position: relative; display: flex; justify-content: center; }.uc-atw .pwr-editor::before{ content: ""; position: absolute; z-index: 0; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 112%; height: 88%; border-radius: 50%; pointer-events: none; background: radial-gradient(closest-side, rgba(253,106,53,.28), rgba(253,106,53,.08) 55%, transparent 76%); filter: blur(64px); }.uc-atw .pwr-panel{ width: 480px; max-width: 100%; height: 832px; zoom: 0.85; display: flex; flex-direction: column; position: relative; z-index: 1; background: #15161a; border: 1px solid #3a3c47; border-radius: 16px; overflow: hidden; box-shadow: 0 40px 90px -40px rgba(0,0,0,.55); font-size: 14px; line-height: 20px; }.uc-atw .pwr-modebar{ display: flex; align-items: center; gap: 8px; padding: 10px 12px 12px; border-bottom: 1px solid #2a2c33; }.uc-atw .pwr-modeseg{ display: flex; flex: 1; gap: 2px; background: #26262b; border-radius: 8px; padding: 2px; }.uc-atw .pwr-mode{ flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 6px 10px; border: 0; background: transparent; color: #a1a1a9; border-radius: 6px; cursor: default; font: inherit; font-size: 12px; font-weight: 600; line-height: 14px; }.uc-atw .pwr-mode svg{ width: 12px; height: 12px; flex: 0 0 auto; }.uc-atw .pwr-mode .lbl{ display: none; }.uc-atw .pwr-panel[data-mode="design"] .pwr-mode[data-m="design"], .uc-atw .pwr-panel[data-mode="developer"] .pwr-mode[data-m="developer"]{ background: #09090b; color: #fafafa; box-shadow: 0 1px 2px rgba(0,0,0,.4); }.uc-atw .pwr-panel[data-mode="design"] .pwr-mode[data-m="design"] .lbl, .uc-atw .pwr-panel[data-mode="developer"] .pwr-mode[data-m="developer"] .lbl{ display: inline; }.uc-atw .pwr-layersbtn{ flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; background: transparent; border: 0; color: #9a9ca6; }.uc-atw .pwr-layersbtn svg{ width: 14px; height: 14px; }.uc-atw .pwr-tabs{ display: flex; border-bottom: 1px solid #2a2c33; background: #1a1b20; }.uc-atw .pwr-tab{ flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 13px 6px; border: 0; background: transparent; color: #a1a1a9; cursor: default; font: inherit; font-size: 12px; font-weight: 500; position: relative; line-height: 14px; }.uc-atw .pwr-tab svg{ width: 16px; height: 16px; }.uc-atw .pwr-tab::after{ content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: #f4f5f7; border-radius: 2px; transform: scaleX(0); transition: transform 0.3s var(--ease); }.uc-atw .pwr-panel[data-mode="design"] .pwr-tab[data-t="code"]{ display: none; }.uc-atw .pwr-panel[data-tab="chat"] .pwr-tab[data-t="chat"], .uc-atw .pwr-panel[data-tab="editor"] .pwr-tab[data-t="editor"], .uc-atw .pwr-panel[data-tab="code"] .pwr-tab[data-t="code"]{ color: #f4f5f7; }.uc-atw .pwr-panel[data-tab="chat"] .pwr-tab[data-t="chat"]::after, .uc-atw .pwr-panel[data-tab="editor"] .pwr-tab[data-t="editor"]::after, .uc-atw .pwr-panel[data-tab="code"] .pwr-tab[data-t="code"]::after{ transform: scaleX(1); }.uc-atw .pwr-screen{ flex: 1; position: relative; overflow: hidden; }.uc-atw .pwr-view{ position: absolute; inset: 0; display: none; flex-direction: column; opacity: 0; }.uc-atw .pwr-view.is-on{ display: flex; opacity: 1; animation: f2w-pwrview 0.45s var(--ease); }@keyframes f2w-pwrview{ from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }.uc-atw .pwr-scroll{ flex: 1; overflow: hidden; padding: 0; }.uc-atw .pwr-acc{ border-bottom: 1px solid #2a2c33; }.uc-atw .pwr-acc-h{ display: flex; align-items: center; justify-content: space-between; padding: 17px 18px; font-size: 16px; font-weight: 600; color: #9a9ca6; line-height: 22px; }.uc-atw .pwr-acc-h.open{ color: #f4f5f7; }.uc-atw .pwr-acc-h .hint{ width: 6px; height: 6px; border-radius: 50%; background: var(--acc); margin-left: auto; margin-right: 10px; opacity: 0; }.uc-atw .pwr-acc-h.dot .hint{ opacity: 1; }.uc-atw .pwr-acc-h .chev{ width: 16px; height: 16px; color: #9a9ca6; transition: transform 0.3s var(--ease); }.uc-atw .pwr-acc-h.open .chev{ transform: rotate(180deg); }.uc-atw .pwr-acc-b{ padding: 4px 18px 20px; }.uc-atw .pwr-row{ display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }.uc-atw .pwr-row .rlab{ flex: 0 0 96px; font-size: 14px; color: #9a9ca6; display: flex; align-items: center; gap: 7px; line-height: 20px; }.uc-atw .pwr-row .rlab .d{ width: 6px; height: 6px; border-radius: 50%; background: var(--acc); }.uc-atw .pwr-ctrl{ flex: 1; display: flex; align-items: center; justify-content: space-between; background: #1c1d22; border: 1px solid #34363f; border-radius: 9px; padding: 11px 13px; font-size: 14px; color: #d6d7dc; line-height: 20px; }.uc-atw .pwr-ctrl.mut{ color: #6a6c76; }.uc-atw .pwr-ctrl .unit{ color: #6a6c76; font-size: 14px; line-height: 22px; }.uc-atw .pwr-ctrl svg{ width: 14px; height: 14px; color: #6a6c76; }.uc-atw .pwr-inset-lab{ font-size: 14px; line-height: 22px; color: #9a9ca6; margin: 2px 0 8px; }.uc-atw .pwr-inset-top{ display: flex; align-items: center; justify-content: space-between; font-size: 12px; line-height: 18px; letter-spacing: 0.1em; color: #6a6c76; margin-bottom: 6px; }.uc-atw .pwr-inset-top .u{ display: flex; gap: 12px; align-items: center; }.uc-atw .pwr-inset{ border: 1px solid #34363f; border-radius: 11px; padding: 14px; display: grid; grid-template-columns: 38px 1fr 38px; grid-template-rows: 22px 1fr 22px; gap: 6px; text-align: center; color: #9a9ca6; font-size: 14px; line-height: 22px; align-items: center; }.uc-atw .pwr-inset .ucx-c{ grid-column: 2; grid-row: 2; background: #24262c; border: 1px solid #34363f; border-radius: 7px; padding: 9px; color: #d6d7dc; }.uc-atw .pwr-inset .t{ grid-column: 2; grid-row: 1; }.uc-atw .pwr-inset .ucx-b{ grid-column: 2; grid-row: 3; }.uc-atw .pwr-inset .l{ grid-column: 1; grid-row: 2; }.uc-atw .pwr-inset .r{ grid-column: 3; grid-row: 2; }.uc-atw .pwr-addprop{ display: flex; align-items: center; justify-content: space-between; margin-top: 6px; padding: 13px; border: 1px dashed #3f4149; border-radius: 10px; color: #9a9ca6; font-size: 14px; line-height: 22px; }.uc-atw .pwr-addprop .n{ display: flex; align-items: center; gap: 8px; }.uc-atw .pwr-addprop .av{ display: flex; gap: 6px; align-items: center; }.uc-atw .pwr-addprop .pill, .uc-atw .pwr-addprop .sl{ background: #2a2c33; border-radius: 6px; padding: 4px 9px; font-size: 12px; line-height: 18px; color: #9a9ca6; }.uc-atw .pwr-divider{ display: flex; align-items: center; gap: 12px; font-size: 12px; line-height: 18px; letter-spacing: 0.13em; color: #6a6c76; text-transform: uppercase; margin: 6px 0 16px; }.uc-atw .pwr-divider::before, .uc-atw .pwr-divider::after{ content: ""; flex: 1; height: 1px; background: #2a2c33; }.uc-atw .pwr-foot{ display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-top: 1px solid #2a2c33; font-size: 14px; line-height: 22px; color: #6a6c76; }.uc-atw .pwr-foot b{ color: #9a9ca6; font-weight: 600; }.uc-atw .pwr-elhead{ display: flex; align-items: center; gap: 10px; padding: 15px 18px 13px; }.uc-atw .pwr-elhead .ucx-sel{ font-family: ui-monospace, monospace; font-size: 14px; line-height: 22px; color: #f4f5f7; }.uc-atw .pwr-elhead .tagpill{ font-family: ui-monospace, monospace; font-size: 12px; line-height: 18px; color: #9a9ca6; background: #24262c; border: 1px solid #34363f; border-radius: 6px; padding: 3px 8px; }.uc-atw .pwr-elhead .pen{ color: #6a6c76; }.uc-atw .pwr-elhead .grow{ flex: 1; }.uc-atw .pwr-btn{ background: #24262c; border: 1px solid #34363f; border-radius: 9px; padding: 8px 13px; font-size: 14px; line-height: 22px; color: #d6d7dc; display: flex; align-items: center; gap: 6px; }.uc-atw .pwr-btn svg{ width: 13px; height: 13px; color: #9a9ca6; }.uc-atw .pwr-classrow{ display: flex; align-items: center; gap: 6px; padding: 0 16px 14px; border-bottom: 1px dashed #34363f; margin-bottom: 2px; }.uc-atw .pwr-chip{ display: flex; align-items: center; gap: 6px; font-size: 12px; line-height: 18px; padding: 6px 9px; border-radius: 7px; white-space: nowrap; background: #1c1d22; border: 1px solid #34363f; color: #9a9ca6; font-family: ui-monospace, monospace; }.uc-atw .pwr-chip svg{ width: 12px; height: 12px; }.uc-atw .pwr-chip .d{ width: 6px; height: 6px; border-radius: 50%; background: #9a9ca6; }.uc-atw .pwr-chip .x{ color: #6a6c76; }.uc-atw .pwr-chip.ucx-on{ background: #34363f; border-color: #4b4d51; color: #f4f5f7; }.uc-atw .pwr-chip.add{ background: transparent; border: 0; color: #6a6c76; font-family: inherit; padding: 6px 4px; }.uc-atw .pwr-chip.def{ margin-left: auto; font-family: inherit; }.uc-atw .pwr-chip.def .d{ background: var(--acc); }.uc-atw .pwr-chat{ display: flex; flex-direction: column; height: 100%; }.uc-atw .pwr-chat-top{ display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid #2a2c33; }.uc-atw .pwr-chat-top .hist{ width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: #9a9ca6; }.uc-atw .pwr-chat-top .hist svg{ width: 15px; height: 15px; }.uc-atw .pwr-modelchip{ display: flex; align-items: center; gap: 6px; background: #24262c; border: 1px solid #34363f; border-radius: 999px; padding: 5px 11px; font-size: 12px; line-height: 18px; color: #f4f5f7; font-weight: 600; }.uc-atw .pwr-modelchip .live{ width: 6px; height: 6px; border-radius: 50%; background: var(--acc); }.uc-atw .pwr-modelchip svg{ width: 12px; height: 12px; color: var(--acc); }.uc-atw .pwr-modelchip .ver{ color: #9a9ca6; font-weight: 500; font-family: ui-monospace, monospace; font-size: 10px; line-height: 16px; }.uc-atw .pwr-wpseg{ display: flex; gap: 4px; margin: 12px 16px 0; background: #1c1d22; border: 1px solid #2a2c33; border-radius: 10px; padding: 3px; }.uc-atw .pwr-wpseg button{ flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 9px; border: 0; background: transparent; color: #9a9ca6; border-radius: 7px; font: inherit; font-size: 14px; line-height: 22px; font-weight: 600; }.uc-atw .pwr-wpseg button svg{ width: 14px; height: 14px; }.uc-atw .pwr-wpseg button.ucx-on{ background: #0e0f12; color: #f4f5f7; box-shadow: 0 1px 2px rgba(0,0,0,.4); }.uc-atw .pwr-target{ display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 9px 16px; font-size: 12px; line-height: 14px; color: #d6d7dc; background: #1c1d22; border-top: 1px solid #2a2c33; border-bottom: 1px solid #2a2c33; }.uc-atw .pwr-target svg{ width: 13px; height: 13px; flex: 0 0 auto; color: #9a9ca6; }.uc-atw .pwr-target .msg{ flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.uc-atw .pwr-target code{ font-family: ui-monospace, monospace; color: #f4f5f7; }.uc-atw .pwr-target .x{ flex: 0 0 auto; color: #6a6c76; }.uc-atw .pwr-chat-mid{ flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2px 16px; }.uc-atw .pwr-orb{ width: 52px; height: 52px; border-radius: 999px; display: grid; place-items: center; margin-bottom: 18px; background: rgba(253,106,53,.16); color: var(--acc); }.uc-atw .pwr-orb svg{ width: 22px; height: 22px; }.uc-atw .pwr-chat-mid h4{ font-size: 16px; line-height: 24px; margin: 0 0 20px; text-align: center; color: #f4f5f7; }.uc-atw .pwr-sugg{ width: 100%; display: flex; flex-direction: column; gap: 8px; }.uc-atw .pwr-sugg button{ display: flex; align-items: center; gap: 11px; width: 100%; padding: 9px 13px; border-radius: 9px; background: #1c1d22; border: 1px solid #34363f; color: #d6d7dc; font: inherit; font-size: 12px; line-height: 18px; text-align: left; }.uc-atw .pwr-sugg button svg{ width: 15px; height: 15px; color: #9a9ca6; }.uc-atw .pwr-composer2{ padding: 11px 16px 13px; border-top: 1px solid #2a2c33; }.uc-atw .pwr-ctxrow{ display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }.uc-atw .pwr-ctxrow .cx{ font-size: 12px; line-height: 18px; letter-spacing: 0.1em; color: #6a6c76; }.uc-atw .pwr-ctxrow .cchip{ display: flex; align-items: center; gap: 8px; font-family: ui-monospace, monospace; font-size: 12px; line-height: 18px; color: #d6d7dc; background: #24262c; border: 1px solid #34363f; border-radius: 7px; padding: 5px 9px; }.uc-atw .pwr-ctxrow .cchip .x{ color: #6a6c76; }.uc-atw .pwr-ctxrow .mini{ margin-left: auto; display: flex; gap: 8px; }.uc-atw .pwr-ctxrow .mini button{ display: flex; align-items: center; gap: 6px; font: inherit; font-size: 12px; line-height: 18px; color: #9a9ca6; background: #1c1d22; border: 1px solid #34363f; border-radius: 8px; padding: 7px 11px; }.uc-atw .pwr-ctxrow .mini button svg{ width: 13px; height: 13px; color: #9a9ca6; }.uc-atw .pwr-prompt{ background: #1c1d22; border: 1px solid #34363f; border-radius: 12px; padding: 11px; }.uc-atw .pwr-prompt .txt{ font-size: 14px; line-height: 20px; color: #f4f5f7; }.uc-atw .pwr-prompt .txt .car{ display: inline-block; width: 1.5px; height: 1.05em; background: var(--acc); vertical-align: -2px; margin-left: 1px; animation: f2w-pwrcar 1s steps(1) infinite; }@keyframes f2w-pwrcar{ 50% { opacity: 0; } }.uc-atw .pwr-prompt .prow{ display: flex; align-items: center; gap: 10px; margin-top: 11px; }.uc-atw .pwr-prompt .prow .img{ width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center; background: #1c1d22; border: 1px solid #34363f; color: #9a9ca6; }.uc-atw .pwr-prompt .prow .img svg{ width: 15px; height: 15px; }.uc-atw .pwr-prompt .prow .msel{ display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 22px; color: #d6d7dc; background: #1c1d22; border: 1px solid #34363f; border-radius: 9px; padding: 8px 12px; }.uc-atw .pwr-prompt .prow .msel svg{ width: 13px; height: 13px; color: #9a9ca6; }.uc-atw .pwr-prompt .prow .send{ margin-left: auto; display: flex; align-items: center; gap: 8px; background: #f4f5f7; color: #15161a; font-weight: 700; font-size: 14px; line-height: 22px; border-radius: 10px; padding: 10px 15px; }.uc-atw .pwr-prompt .prow .send svg{ width: 14px; height: 14px; }.uc-atw .pwr-prompt .prow .send kbd{ font-family: ui-monospace, monospace; font-size: 12px; line-height: 18px; color: rgba(10,10,14,.55); }.uc-atw .pwr-code{ display: flex; flex-direction: column; height: 100%; }.uc-atw .pwr-codeseg{ display: flex; align-items: center; gap: 2px; margin: 10px 14px; padding: 2px; background: #26262b; border-radius: 8px; }.uc-atw .pwr-codeseg button{ flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; height: 28px; padding: 0 8px; border: 0; background: transparent; border-radius: 6px; color: #a1a1a9; font: inherit; font-size: 12px; line-height: 18px; font-weight: 600; }.uc-atw .pwr-codeseg button svg{ width: 15px; height: 15px; }.uc-atw .pwr-codeseg button.ucx-on{ background: #09090b; color: #fafafa; box-shadow: 0 1px 2px rgba(0,0,0,.4); }.uc-atw .pwr-codewrap{ flex: 1; overflow: hidden; padding: 4px 14px 0; display: flex; flex-direction: column; gap: 10px; }.uc-atw .pwr-card{ background: #1c1d22; border: 1px solid #2a2c33; border-radius: 12px; overflow: hidden; flex: 0 0 auto; }.uc-atw .pwr-card-h{ display: flex; align-items: center; gap: 9px; padding: 8px 14px; color: #d6d7dc; font-size: 14px; line-height: 22px; font-weight: 600; }.uc-atw .pwr-card-h .ci{ width: 22px; height: 22px; border-radius: 5px; display: grid; place-items: center; font-size: 10px; line-height: 16px; font-weight: 800; color: #15161a; }.uc-atw .pwr-card-h .ci.html{ background: #e34f26; color: #f4f5f7; }.uc-atw .pwr-card-h .ci.css{ background: #264de4; color: #f4f5f7; }.uc-atw .pwr-card-h .ci.js{ background: var(--acc); color: #15161a; }.uc-atw .pwr-card-h .acts{ margin-left: auto; display: flex; gap: 12px; color: #6a6c76; font-size: 12px; line-height: 18px; font-weight: 500; }.uc-atw .pwr-card-h .acts span{ display: inline-flex; align-items: center; gap: 4px; }.uc-atw .pwr-card-h .acts svg{ width: 12px; height: 12px; }.uc-atw .pwr-card-h .badge{ background: #2a2c33; border-radius: 5px; padding: 1px 5px; font-size: 10px; line-height: 16px; }.uc-atw .pwr-code-b{ display: flex; font-family: ui-monospace, monospace; font-size: 12px; line-height: 20px; }.uc-atw .pwr-gutter{ flex: 0 0 auto; padding: 10px 10px 12px 14px; color: #4b4d55; text-align: right; user-select: none; }.uc-atw .pwr-lines{ flex: 1; min-width: 0; padding: 10px 14px 12px 0; color: #d6d7dc; white-space: pre; overflow: hidden; }.uc-atw .sx-pun{ color: #8a8d97; }.uc-atw .sx-tag{ color: #f0776a; }.uc-atw .sx-attr{ color: #d1a45f; }.uc-atw .sx-str{ color: #a7cf8a; }.uc-atw .sx-com{ color: #5f6270; font-style: italic; }.uc-atw .sx-sel{ color: #e0b062; }.uc-atw .sx-prop{ color: #7db2ef; }.uc-atw .sx-kw{ color: #c98af0; }.uc-atw .sx-fn{ color: #7db2ef; }@media (max-width: 980px){.uc-atw .pwr-panel{ height: 720px; }}@media (max-width: 480px){.uc-atw .hero-copy .ucx-cta-row{ row-gap: 36px; }}@media (max-width: 480px){.uc-atw.aem .cl-item .cl-box, .uc-atw.aem .cl-item .cl-pending{ align-self: flex-start; }}.uc-atw .xway-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; margin: 44px auto 0; max-width: 1020px; }.uc-atw .xway-card{ display: flex; flex-direction: column; padding: 4px; background: var(--mist); border-radius: var(--r-card); }.uc-atw .xway-media{ position: relative; overflow: hidden; width: 100%; aspect-ratio: 16 / 10; border-radius: 14px; border: 1px solid var(--cardbd); background: radial-gradient(circle at 1px 1px, rgba(10, 10, 10, 0.05) 1px, transparent 0) 0 0 / 22px 22px, var(--pg2); }.uc-atw .xway-stack{ position: absolute; inset: 0; }.uc-atw .xway-shot{ position: absolute; top: 50%; left: 50%; height: 84%; width: auto; max-width: 62%; object-fit: contain; border-radius: 10px; border: 1px solid var(--cardbd); background: var(--cardbg); transition: transform 0.55s var(--ease); will-change: transform; }.uc-atw .xway-shot.s1{ transform: translate(-50%, -50%) rotate(0deg); z-index: 3; }.uc-atw .xway-shot.s2{ transform: translate(-88%, -46%) rotate(-8deg) scale(0.94); z-index: 2; }.uc-atw .xway-shot.s3{ transform: translate(-12%, -46%) rotate(8deg) scale(0.94); z-index: 1; }.uc-atw .xway-card:hover .xway-shot.s1{ transform: translate(-12%, -46%) rotate(8deg) scale(0.94); z-index: 1; }.uc-atw .xway-card:hover .xway-shot.s2{ transform: translate(-50%, -50%) rotate(0deg); z-index: 3; }.uc-atw .xway-card:hover .xway-shot.s3{ transform: translate(-88%, -46%) rotate(-8deg) scale(0.94); z-index: 2; }.uc-atw .xway-soon{ position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; background: linear-gradient(color-mix(in srgb, var(--pg2) 55%, transparent), color-mix(in srgb, var(--pg2) 80%, transparent)); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }.uc-atw .xway-soon span{ padding: 8px 18px; border-radius: 999px; font-size: 12px; line-height: 18px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--txd); border: 1px solid var(--cardbd); background: var(--cardbg); }.uc-atw .xway-body{ display: flex; flex-direction: column; align-items: flex-start; flex: 1; padding: 12px 12px; }.uc-atw .xic{ display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 14px; border-radius: 12px; color: var(--acc); background: color-mix(in srgb, var(--acc) 10%, var(--cardbg)); border: 1px solid color-mix(in srgb, var(--acc) 22%, transparent); }.uc-atw .xic svg{ width: 22px; height: 22px; }.uc-atw .xeye{ margin-bottom: 8px; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; line-height: 14px; color: var(--txf); }.uc-atw .xeye--live{ color: var(--acc); }.uc-atw .xway-card h3{ margin: 0 0 8px; color: var(--tx); font-size: 20px; font-weight: 600; letter-spacing: -0.01em; line-height: 26px; }.uc-atw .xway-card p{ margin: 0 0 16px; color: var(--txd); font-size: 16px; line-height: 24px; }.uc-atw .xway-link{ margin-top: auto; display: inline-flex; align-items: center; gap: 7px; color: var(--acc); text-decoration: none; font-weight: 600; }.uc-atw .xway-link svg{ width: 18px; height: 18px; }@media (max-width: 760px){.uc-atw .xway-grid{ grid-template-columns: minmax(0, 1fr); }}.uc-atw .sup-card-tray{ display: flex; padding: 4px; background: var(--mist); border-radius: var(--r-card); }.uc-atw .sup-card-tray .sup-card{ flex: 1; box-shadow: none; }.uc-atw .sup-card-tray .sup-card:hover{ transform: none; border-color: var(--cardbd); }.uc-atw .conn-row{ display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; margin: 0 auto 22px; }.uc-atw .conn-chip{ display: inline-flex; align-items: center; gap: 9px; padding: 8px 15px; border: 1px solid var(--cardbd); background: var(--cardbg); border-radius: 999px; font-size: 0.9rem; font-weight: 500; line-height: 1; color: var(--tx); box-shadow: 0 3px 10px -6px rgba(16, 24, 40, 0.28); }.uc-atw .conn-chip img{ width: 20px; height: 20px; object-fit: contain; display: block; }.uc-atw .conn-chip.is-mark{ padding: 8px; }.uc-atw .conn-arrow{ display: inline-flex; color: var(--txd); opacity: 0.45; }.uc-atw .conn-arrow svg{ width: 18px; height: 18px; }@media (max-width: 520px){.uc-atw .conn-chip{ font-size: 0.82rem; padding: 7px 12px; }.uc-atw .conn-chip img{ width: 18px; height: 18px; }}.uc-atw .hero-mark{ display: flex; align-items: center; justify-content: center; width: 90px; height: 90px; margin: 0 auto 32px; padding: 18px; box-sizing: border-box; background: var(--cardbg); border: 1px solid var(--cardbd); border-radius: 22px; box-shadow: 0 10px 26px -14px rgba(16, 24, 40, 0.4); }.uc-atw .hero-mark img{ width: 100%; height: 100%; object-fit: contain; display: block; }@media (max-width: 640px){.uc-atw .hero-mark{ width: 72px; height: 72px; padding: 14px; border-radius: 18px; margin-bottom: 24px; }}.uc-atw .hero-copy .hero-continuity{ margin: -8px 0 30px; max-width: 560px; font-size: 1rem; font-weight: 600; line-height: 1.5; color: var(--tx); text-align: left; }.uc-atw .cmp-right .cmp-spot{ left: calc(100% * (var(--c1) + var(--c2)) / var(--ct)); width: calc(100% * var(--c3) / var(--ct)); }.uc-atw .ul-pair{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; }.uc-atw .ul-feat{ display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }.uc-atw .ul-copy h3, .uc-atw .ul-small h3{ display: flex; align-items: flex-start; gap: 12px; margin: 0 0 12px; font-size: 1.125rem; font-weight: 500; letter-spacing: -0.01em; line-height: 1.35; color: var(--tx); }.uc-atw .ul-ic{ width: 20px; height: 20px; margin-top: 2px; flex: 0 0 auto; color: var(--acc); }.uc-atw .ul-ic svg{ width: 100%; height: 100%; display: block; }.uc-atw .ul-copy p, .uc-atw .ul-small p{ margin: 0; max-width: 46ch; font-size: 1rem; line-height: 1.5; color: var(--txd); }.uc-atw .ul-frame{ padding: 4px; border-radius: 24px; border: 0; background: var(--mist, #f4f4f4); }.uc-atw .ul-shot{ position: relative; width: 100%; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 20px; border: 1px solid var(--line); background: var(--uc-surface-raised, #ffffff); }.uc-atw .ul-shot video{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }.uc-atw .ul-quad{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px; margin-top: 80px; }@media (max-width: 1080px){.uc-atw .ul-quad{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }}@media (max-width: 860px){.uc-atw .ul-pair{ grid-template-columns: minmax(0, 1fr); gap: 40px; }.uc-atw .ul-quad{ margin-top: 48px; }}@media (max-width: 560px){.uc-atw .ul-quad{ grid-template-columns: minmax(0, 1fr); gap: 32px; }}.uc-atw .steps-ax .ax-track{ height: 425vh; }.uc-atw .wq{ display: grid; grid-template-columns: 1.5fr 1fr; gap: 16px; align-items: start; }.uc-atw .wq-frame{ padding: 4px; border-radius: 24px; border: 0; background: var(--mist, #f4f4f4); }.uc-atw .wq-shots{ position: relative; width: 100%; aspect-ratio: 5 / 3; overflow: hidden; border-radius: 20px; border: 1px solid var(--line); background: var(--uc-surface-raised, #ffffff); padding: 18px 32px; }.uc-atw .uc-plate-grad{ position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; pointer-events: none; user-select: none; }.uc-atw .fpg-card{ position: relative; z-index: 2; height: 100%; display: flex; align-items: center; gap: 14px; padding: 4px; background: transparent; color: #0a0a0a; overflow: visible; }.uc-atw .fpg-card *{ box-sizing: border-box; }.uc-atw .fpg-gridwrap{ flex: 0 0 auto; min-width: 0; text-align: center; }.uc-atw .fpg-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; width: 268px; }.uc-atw .fpg-tile{ position: relative; aspect-ratio: 1; display: grid; place-items: center; background: #fff; border: 1px solid #e7e7ea; border-radius: 9px; box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04); }.uc-atw .fpg-tile img{ width: 74%; height: 74%; object-fit: contain; border-radius: 5px; display: block; }.uc-atw .fpg-up{ position: absolute; top: -4px; right: -4px; width: 9px; height: 9px; border-radius: 50%; background: #e58a1a; border: 1.6px solid #fff; box-shadow: 0 0 0 2px rgba(229, 138, 26, 0.16); }.uc-atw .fpg-tile.fpg-more{ font-size: 12px; font-weight: 700; color: #9a9aa0; background: #f4f4f6; }.uc-atw .fpg-glabel{ display: inline-block; margin-top: 12px; font-size: 12px; font-weight: 600; color: rgba(255, 255, 255, 0.95); text-shadow: 0 1px 6px rgba(0, 0, 0, 0.28); }.uc-atw .fpg-arrow{ flex: none; width: 40px; color: #fff; text-align: center; }.uc-atw .fpg-arrow svg{ width: 28px; height: 28px; margin: 0 auto; display: block; }.uc-atw .fpg-one{ flex: 1 1 46%; min-width: 0; align-self: center; display: flex; flex-direction: column; gap: 12px; background: #fff; border: 1px solid rgba(16, 24, 40, 0.06); border-radius: 14px; padding: 20px; box-shadow: 0 16px 36px -16px rgba(0, 0, 0, 0.5), 0 2px 6px -2px rgba(0, 0, 0, 0.25); }.uc-atw .fpg-one-head{ display: flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 700; letter-spacing: -0.01em; }.uc-atw .fpg-logo{ width: 24px; height: 24px; flex: none; display: block; }.uc-atw .fpg-pills{ display: flex; flex-wrap: wrap; gap: 6px; }.uc-atw .fpg-pill{ font-size: 11px; font-weight: 500; padding: 4px 9px; border-radius: 999px; background: #f4f4f6; border: 1px solid #e7e7ea; }.uc-atw .fpg-badge{ display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: #12864a; }.uc-atw .fpg-badge svg{ width: 16px; height: 16px; flex: none; stroke: #159f54; }.uc-atw .psi-panel{ position: absolute; z-index: 2; top: 50%; left: 50%; width: calc(100% - 88px); height: auto; transform: translate(-50%, -50%) scale(var(--psi-scale, 1)); transform-origin: center center; display: flex; flex-direction: column; gap: 10px; padding: 15px 20px; background: #fff; color: #202124; border-radius: 14px; overflow: hidden; box-shadow: 0 18px 44px -18px rgba(0, 0, 0, 0.55); }.uc-atw .psi-panel *{ box-sizing: border-box; }.uc-atw .psi-head{ display: flex; align-items: center; gap: 10px; padding-bottom: 10px; border-bottom: 1px solid #e6e8eb; }.uc-atw .psi-logo{ width: 22px; height: 22px; flex: none; display: block; border-radius: 5px; }.uc-atw .psi-title{ font-size: 14px; font-weight: 700; letter-spacing: -0.01em; }.uc-atw .psi-url{ font-size: 12px; color: #5f6368; background: #f1f3f4; border-radius: 7px; padding: 5px 11px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.uc-atw .psi-tabs{ margin-left: auto; display: flex; gap: 4px; }.uc-atw .psi-tabs b{ font-size: 11.5px; font-weight: 600; color: #5f6368; padding: 5px 12px; border-radius: 999px; }.uc-atw .psi-tabs b.ucx-on{ background: #e8f0fe; color: #1a73e8; }.uc-atw .psi-cwv{ display: flex; align-items: center; gap: 9px; font-size: 13px; color: #202124; background: #e6f8ef; border: 1px solid #b6ecd0; border-radius: 10px; padding: 8px 13px; }.uc-atw .psi-cwv b{ font-weight: 700; color: #0b8a4a; }.uc-atw .psi-cwv-ic{ width: 18px; height: 18px; color: #0cce6b; flex: none; }.uc-atw .psi-cwv-ic svg{ width: 100%; height: 100%; }.uc-atw .psi-gauges{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; justify-items: center; }.uc-atw .psi-g{ display: flex; flex-direction: column; align-items: center; gap: 8px; }.uc-atw .psi-ring{ position: relative; width: 72px; height: 72px; }.uc-atw .psi-ring svg{ width: 100%; height: 100%; display: block; }.uc-atw .psi-disc{ fill: rgba(12, 206, 107, 0.12); stroke: none; }.uc-atw .psi-trk{ fill: none; stroke: #e6e8eb; stroke-width: 6; }.uc-atw .psi-prg{ fill: none; stroke: #0cce6b; stroke-width: 6; stroke-linecap: round; }.uc-atw .psi-num{ position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 22px; letter-spacing: -0.02em; color: #0b8a4a; }.uc-atw .psi-glab{ font-size: 12px; font-weight: 600; color: #5f6368; text-align: center; }.uc-atw .psi-metrics{ display: grid; grid-template-columns: 1fr 1fr; gap: 4px 24px; }.uc-atw .psi-m{ display: flex; align-items: center; gap: 10px; font-size: 12.5px; padding: 4px 0; border-bottom: 1px solid #f1f3f4; }.uc-atw .psi-sq{ width: 12px; height: 12px; border-radius: 2px; background: #0cce6b; flex: none; }.uc-atw .psi-mlab{ color: #5f6368; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.uc-atw .psi-m b{ font-weight: 700; font-variant-numeric: tabular-nums; }.uc-atw .secmeter-card{ position: absolute; z-index: 2; top: 50%; left: 44px; right: 44px; transform: translateY(-50%); display: flex; flex-direction: column; gap: 15px; padding: 24px 28px; background: #fff; color: #202124; border-radius: 14px; overflow: hidden; box-shadow: 0 18px 44px -18px rgba(0, 0, 0, 0.55); }.uc-atw .secmeter-card *{ box-sizing: border-box; }.uc-atw .sm-title{ font-size: 16px; font-weight: 700; letter-spacing: -0.02em; color: #0a0a0a; }.uc-atw .sm-row{ display: grid; grid-template-columns: 104px 1fr auto; align-items: center; gap: 16px; }.uc-atw .sm-lab{ font-size: 12.5px; font-weight: 600; color: #6c6c72; }.uc-atw .sm-track{ display: grid; grid-template-columns: repeat(24, 1fr); gap: 4px; }.uc-atw .sm-cell{ height: 18px; border-radius: 3px; background: #eceef1; }.uc-atw .sm-cell.ucx-on.r{ background: #e0483f; }.uc-atw .sm-cell.ucx-on.ucx-g{ background: #159f54; }.uc-atw .sm-val{ font-size: 16px; font-weight: 800; min-width: 22px; text-align: right; font-variant-numeric: tabular-nums; }.uc-atw .sm-val.r{ color: #c0392f; }.uc-atw .sm-val.ucx-g{ color: #12864a; }.uc-atw .sm-foot{ font-size: 12px; color: #6c6c72; }.uc-atw .mnt-card{ position: absolute; z-index: 2; top: 50%; left: 44px; right: 44px; transform: translateY(-50%); display: flex; align-items: stretch; gap: 12px; padding: 20px; background: #fff; color: #202124; border-radius: 14px; overflow: hidden; box-shadow: 0 18px 44px -18px rgba(0, 0, 0, 0.55); }.uc-atw .mnt-card *{ box-sizing: border-box; }.uc-atw .mnt-up{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; border: 1px solid #e7e7ea; border-radius: 11px; padding: 13px; }.uc-atw .mnt-bar{ display: flex; align-items: center; gap: 8px; font-size: 13.5px; padding-bottom: 8px; border-bottom: 1px solid #e7e7ea; }.uc-atw .mnt-bar b{ font-weight: 700; }.uc-atw .mnt-badge{ background: #e0483f; color: #fff; font-size: 10px; font-weight: 700; border-radius: 999px; padding: 1px 7px; }.uc-atw .mnt-row{ display: flex; align-items: center; gap: 8px; font-size: 12px; padding: 2px 0; }.uc-atw .mnt-dot{ width: 7px; height: 7px; border-radius: 50%; flex: none; }.uc-atw .mnt-dot.r{ background: #e0483f; }.uc-atw .mnt-dot.ucx-a{ background: #d98413; }.uc-atw .mnt-rt{ color: #3a3a3f; }.uc-atw .mnt-act{ margin-left: auto; font-size: 10.5px; font-weight: 600; color: #1a73e8; }.uc-atw .mnt-warn{ margin-left: auto; color: #d98413; font-weight: 700; }.uc-atw .mnt-foot{ margin-top: auto; font-size: 11px; font-weight: 600; padding-top: 8px; }.uc-atw .mnt-foot.r{ color: #c0392f; }.uc-atw .mnt-foot.ucx-g{ color: #12864a; }.uc-atw .mnt-arrow{ width: 28px; color: #fd6a35; flex: none; display: flex; align-items: center; justify-content: center; }.uc-atw .mnt-arrow svg{ width: 26px; height: 26px; display: block; }.uc-atw .mnt-good{ align-items: center; justify-content: center; text-align: center; gap: 5px; border-color: rgba(21, 159, 84, 0.4); background: #f4fbf7; }.uc-atw .mnt-ok{ width: 36px; height: 36px; color: #159f54; }.uc-atw .mnt-ok svg{ width: 100%; height: 100%; display: block; }.uc-atw .mnt-okt{ font-size: 14.5px; font-weight: 700; }.uc-atw .mnt-oks{ font-size: 12.5px; color: #6c6c72; }.uc-atw .mnt-good .mnt-foot{ margin-top: 8px; }.uc-atw .rmg-card{ position: absolute; z-index: 2; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 86%; max-width: 344px; display: flex; flex-direction: column; gap: 9px; padding: 13px 14px; background: #fff; color: #0a0a0a; border-radius: 12px; box-shadow: 0 16px 34px -16px rgba(0, 0, 0, 0.55); }.uc-atw .rmg-card *{ box-sizing: border-box; }.uc-atw .rmg-head{ display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; padding-bottom: 8px; border-bottom: 1px solid #e7e7ea; }.uc-atw .rmg-key{ width: 15px; height: 15px; color: #fd6a35; flex: none; }.uc-atw .rmg-key svg{ width: 100%; height: 100%; display: block; }.uc-atw .rmg-team{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }.uc-atw .rmg-team li{ display: flex; align-items: center; gap: 9px; }.uc-atw .rmg-av{ width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 10px; font-weight: 700; flex: none; }.uc-atw .rmg-av.ucx-a{ background: #7c5cff; }.uc-atw .rmg-av.ucx-c{ background: #e0483f; }.uc-atw .rmg-nm{ flex: 1; font-size: 11.5px; font-weight: 600; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.uc-atw .rmg-nm i{ font-weight: 500; color: #6c6c72; font-style: normal; }.uc-atw .rmg-role{ font-size: 9.5px; font-weight: 700; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }.uc-atw .rmg-role.admin{ background: #efeaff; color: #5b3fd0; }.uc-atw .rmg-role.ct{ background: rgba(253, 106, 53, 0.13); color: #c0531f; }.uc-atw .rmg-role.ucx-sel{ background: #fff; border: 1px solid #1a73e8; color: #1a73e8; }.uc-atw .rmg-active{ background: #f6f6f8; border-radius: 8px; padding: 5px 7px; margin: -3px -4px; }.uc-atw .rmg-menu{ border: 1px solid #e7e7ea; border-radius: 10px; padding: 5px; display: flex; flex-direction: column; gap: 1px; box-shadow: 0 8px 20px -10px rgba(0, 0, 0, 0.22); }.uc-atw .rmg-item{ display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 7px; font-size: 10.5px; }.uc-atw .rmg-mi{ width: 14px; height: 14px; flex: none; color: #c3c6cc; }.uc-atw .rmg-item.ucx-on{ background: rgba(21, 159, 84, 0.09); }.uc-atw .rmg-item.ucx-on .rmg-mi{ color: #159f54; }.uc-atw .rmg-item span{ display: flex; align-items: baseline; min-width: 0; }.uc-atw .rmg-item b{ font-weight: 700; }.uc-atw .rmg-item i{ font-style: normal; color: #6c6c72; margin-left: 5px; font-size: 9.5px; white-space: nowrap; }.uc-atw .shg-card{ position: absolute; z-index: 2; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 87%; max-width: 344px; display: flex; flex-direction: column; gap: 11px; padding: 14px 15px; background: #fff; color: #0a0a0a; border-radius: 12px; box-shadow: 0 16px 34px -16px rgba(0, 0, 0, 0.55); }.uc-atw .shg-card *{ box-sizing: border-box; }.uc-atw .shg-head{ font-size: 14px; font-weight: 700; letter-spacing: -0.01em; }.uc-atw .shg-input{ display: flex; align-items: center; gap: 7px; border: 1.5px solid #e7e7ea; border-radius: 9px; padding: 8px 10px; }.uc-atw .shg-ph{ font-size: 11.5px; color: #a6a6ad; flex: 1; }.uc-atw .shg-role{ margin-left: auto; display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 600; color: #6c6c72; white-space: nowrap; }.uc-atw .shg-role svg{ width: 13px; height: 13px; display: block; }.uc-atw .shg-people{ display: flex; flex-direction: column; gap: 9px; }.uc-atw .shg-prow{ display: flex; align-items: center; gap: 9px; }.uc-atw .shg-av{ width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 9.5px; font-weight: 700; flex: none; }.uc-atw .shg-av.ucx-g{ background: #159f54; }.uc-atw .shg-av.ucx-c{ background: #e0483f; }.uc-atw .shg-nm{ flex: 1; font-size: 11.5px; font-weight: 600; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.uc-atw .shg-pr{ font-size: 10px; font-weight: 700; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }.uc-atw .shg-pr.owner{ background: #eef0f3; color: #5f6368; }.uc-atw .shg-pr.edit{ background: rgba(21, 159, 84, 0.13); color: #12864a; }.uc-atw .shg-link{ display: flex; align-items: center; gap: 8px; font-size: 11px; padding-top: 10px; border-top: 1px solid #e7e7ea; }.uc-atw .shg-link svg{ width: 15px; height: 15px; color: #8a8f98; flex: none; display: block; }.uc-atw .shg-linktxt{ flex: 1; color: #6c6c72; font-weight: 500; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.uc-atw .shg-copy{ color: #1a73e8; font-weight: 700; flex: none; }.uc-atw .exg-card{ position: absolute; z-index: 2; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 87%; max-width: 344px; display: flex; flex-direction: column; gap: 11px; padding: 14px 15px; background: #fff; color: #0a0a0a; border-radius: 12px; box-shadow: 0 16px 34px -16px rgba(0, 0, 0, 0.55); }.uc-atw .exg-card *{ box-sizing: border-box; }.uc-atw .exg-head{ display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700; padding-bottom: 9px; border-bottom: 1px solid #e7e7ea; }.uc-atw .exg-plus{ width: 16px; height: 16px; color: #fd6a35; flex: none; }.uc-atw .exg-plus svg{ width: 100%; height: 100%; display: block; }.uc-atw .exg-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.uc-atw .exg-mod{ display: flex; align-items: center; gap: 8px; border: 1px solid #e7e7ea; border-radius: 9px; padding: 8px; }.uc-atw .exg-mod.ucx-on{ border-color: rgba(21, 159, 84, 0.35); background: rgba(21, 159, 84, 0.05); }.uc-atw .exg-ic{ width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center; flex: none; }.uc-atw .exg-ic svg{ width: 15px; height: 15px; display: block; }.uc-atw .exg-ic.ucx-b{ background: #e7f0ff; color: #1a5fc4; }.uc-atw .exg-ic.s{ background: #e9f8ef; color: #159f54; }.uc-atw .exg-ic.m{ background: #efeaff; color: #5b3fd0; }.uc-atw .exg-ic.k{ background: rgba(253, 106, 53, 0.13); color: #c0531f; }.uc-atw .exg-nm{ flex: 1; font-size: 11px; font-weight: 600; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.uc-atw .exg-add{ font-size: 10px; font-weight: 700; color: #fd6a35; flex: none; }.uc-atw .exg-add.done{ color: #159f54; width: 14px; height: 14px; }.uc-atw .exg-add.done svg{ width: 14px; height: 14px; display: block; }.uc-atw .exg-foot{ font-size: 11px; color: #6c6c72; }.uc-atw .sdg{ position: absolute; inset: 0; z-index: 2; }.uc-atw .sdg *{ box-sizing: border-box; }.uc-atw .sdg-twin{ position: absolute; width: 50%; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 18px 38px -16px rgba(0, 0, 0, 0.6); }.uc-atw .sdg-left{ left: 6%; top: 11%; z-index: 1; }.uc-atw .sdg-right{ right: 5%; top: 34%; z-index: 2; }.uc-atw .sdg-ttop{ display: flex; align-items: center; gap: 5px; padding: 9px 11px; border-bottom: 1px solid #eef0f2; }.uc-atw .sdg-ttop i{ width: 7px; height: 7px; border-radius: 50%; background: #d7dade; flex: none; }.uc-atw .sdg-tbody{ padding: 12px; display: flex; flex-direction: column; gap: 8px; }.uc-atw .sdg-bh{ height: 12px; width: 78%; border-radius: 3px; background: #111; }.uc-atw .sdg-bl{ height: 6px; width: 55%; border-radius: 3px; background: #d7dade; }.uc-atw .sdg-bbtn{ height: 12px; width: 46%; border-radius: 5px; background: #fd6a35; }.uc-atw .sdg-bgrid{ display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }.uc-atw .sdg-bgrid i{ height: 20px; border-radius: 4px; background: #eceef1; }.uc-atw .sdg-cap{ display: block; text-align: center; font-size: 11px; font-weight: 800; color: #8a8f98; padding: 5px 0 11px; }.uc-atw .abg{ position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; }.uc-atw .abg *{ box-sizing: border-box; }.uc-atw .abg-menu{ width: 74%; background: #fff; border: 1px solid #eef0f2; border-radius: 12px; padding: 6px; display: flex; flex-direction: column; gap: 1px; box-shadow: 0 18px 38px -14px rgba(0, 0, 0, 0.55); }.uc-atw .abg-mi{ display: flex; align-items: center; gap: 8px; padding: 6px 7px; border-radius: 7px; font-size: 10.5px; font-weight: 700; color: #2a2a2e; }.uc-atw .abg-mi span{ color: #8a8f98; font-weight: 600; margin-left: -3px; }.uc-atw .abg-mi.abg-ghost{ color: #9a9aa0; font-weight: 600; font-size: 10px; justify-content: center; }.uc-atw .abg-ic{ width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; flex: none; }.uc-atw .abg-ic svg{ width: 12px; height: 12px; display: block; }.uc-atw .abg-ic1{ background: #e7f0ff; color: #1a5fc4; }.uc-atw .abg-ic3{ background: #efeaff; color: #5b3fd0; }.uc-atw .abg-ic4{ background: rgba(253, 106, 53, 0.14); color: #c0531f; }.uc-atw .abg-ic6{ background: #e0f7fa; color: #0b7c8c; }.uc-atw .dsg{ position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; }.uc-atw .dsg *{ box-sizing: border-box; }.uc-atw .dsg-panel{ width: 78%; background: #fff; border-radius: 12px; padding: 12px 13px; display: flex; flex-direction: column; gap: 9px; box-shadow: 0 18px 38px -14px rgba(0, 0, 0, 0.55); }.uc-atw .dsg-head{ display: flex; align-items: center; gap: 7px; }.uc-atw .dsg-head b{ font-size: 12.5px; font-weight: 800; }.uc-atw .dsg-hic{ width: 16px; height: 16px; color: #fd6a35; flex: none; }.uc-atw .dsg-hic svg{ width: 100%; height: 100%; display: block; }.uc-atw .dsg-one{ margin-left: auto; font-size: 8.5px; font-weight: 800; background: rgba(253, 106, 53, 0.14); color: #c0531f; border-radius: 999px; padding: 2px 8px; }.uc-atw .dsg-row{ display: flex; align-items: center; gap: 10px; padding-top: 8px; border-top: 1px solid #f1f3f4; }.uc-atw .dsg-row:first-of-type{ border-top: none; padding-top: 2px; }.uc-atw .dsg-lab{ width: 74px; font-size: 10px; font-weight: 700; color: #6c6c72; }.uc-atw .dsg-val{ display: flex; align-items: center; gap: 6px; }.uc-atw .dsg-val i{ width: 18px; height: 18px; border-radius: 5px; display: block; }.uc-atw .dsg-type b{ font-size: 15px; font-weight: 800; }.uc-atw .dsg-type u{ font-size: 12px; font-weight: 600; text-decoration: none; color: #5f6368; }.uc-atw .dsg-type s{ font-size: 9px; text-decoration: none; color: #9a9aa0; }.uc-atw .dsg-cbtn{ width: 34px; height: 15px; border-radius: 5px; background: #fd6a35; display: block; }.uc-atw .dsg-cpill{ width: 26px; height: 15px; border-radius: 999px; background: #eef0f3; display: block; }@media (max-width: 640px){.uc-atw .wq-shots{ padding: 12px; aspect-ratio: auto; }.uc-atw .fpg-card{ flex-direction: column; gap: 14px; height: auto; }.uc-atw .fpg-gridwrap, .uc-atw .fpg-one{ width: 100%; flex: none; }.uc-atw .fpg-grid{ width: 100%; max-width: 320px; margin-inline: auto; }.uc-atw .fpg-arrow{ transform: rotate(90deg); }.uc-atw .psi-panel{ position: relative; left: auto; right: auto; top: auto; width: 100%; transform: none; }.uc-atw .psi-gauges{ grid-template-columns: repeat(2, 1fr); gap: 14px; }.uc-atw .psi-metrics{ grid-template-columns: 1fr; }.uc-atw .secmeter-card{ position: relative; left: auto; right: auto; top: auto; transform: none; }.uc-atw .mnt-card{ position: relative; left: auto; right: auto; top: auto; transform: none; flex-direction: column; }}.uc-atw .wq-shot{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity 0.45s var(--ease); }.uc-atw .wq-shot.is-on{ opacity: 1; }.uc-atw .wq-list{ display: flex; flex-direction: column; border-left: 1px solid var(--line); }.uc-atw .wq-item{ position: relative; display: block; width: 100%; text-align: left; background: none; border: 0; padding: 20px 12px 20px 24px; cursor: pointer; font: inherit; color: inherit; }.uc-atw .wq-item::before{ content: ""; position: absolute; left: -1px; top: 0; bottom: 0; width: 2px; background: var(--acc); transform: scaleY(0); transform-origin: 50% 50%; transition: transform 0.35s var(--ease); }.uc-atw .wq-item.ucx-is-open::before{ transform: scaleY(1); }.uc-atw .wq-title{ display: flex; align-items: flex-start; gap: 12px; font-size: 1.125rem; font-weight: 500; letter-spacing: -0.01em; line-height: 1.35; color: var(--txf); transition: color 0.3s var(--ease); }.uc-atw .wq-item.ucx-is-open .wq-title{ color: var(--tx); }.uc-atw .wq-item:hover .wq-title{ color: var(--tx); }.uc-atw .wq-ic{ width: 20px; height: 20px; margin-top: 2px; flex: 0 0 auto; color: var(--txf); transition: color 0.3s var(--ease); }.uc-atw .wq-item.ucx-is-open .wq-ic{ color: var(--acc); }.uc-atw .wq-ic svg{ width: 100%; height: 100%; display: block; }.uc-atw .wq-body{ display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.4s var(--ease), opacity 0.3s var(--ease); opacity: 0; font-size: 1rem; line-height: 1.5; color: var(--txd); }.uc-atw .wq-body > span{ overflow: hidden; display: block; }.uc-atw .wq-item.ucx-is-open .wq-body{ grid-template-rows: 1fr; opacity: 1; margin-top: 12px; padding-left: 32px; }@media (max-width: 980px){.uc-atw .wq{ grid-template-columns: 1fr; gap: 32px; }}@media (max-width: 560px){.uc-atw .wq-item{ padding: 16px 0 16px 20px; }.uc-atw .wq-item.ucx-is-open .wq-body{ padding-left: 0; }}.uc-atw .steps-ax .ax-track{ height: 425vh; }.uc-atw .wm-head{ display: flex; flex-direction: column; gap: 32px; margin-bottom: 0; }@media (min-width: 1024px){.uc-atw .wm-head{ flex-direction: row; align-items: flex-end; justify-content: space-between; }}.uc-atw .wm-head-l{ max-width: 701px; }.uc-atw .wm-head-l .ucx-eyebrow{ display: inline-flex; margin-bottom: 20px; }.uc-atw .wm-head h2{ margin: 0; font-size: clamp(2rem, 3.6vw, 3rem); font-weight: 500; letter-spacing: -0.02em; line-height: 1.1; color: var(--tx); text-wrap: balance; }.uc-atw .wm-head-r{ flex: 0 0 auto; max-width: 441px; margin: 0; font-size: 1rem; line-height: 1.5; letter-spacing: -0.01em; color: var(--uc-text-muted, #737373); }.uc-atw .wm-ctawrap{ text-align: center; margin-top: 48px; }@media (max-width: 900px){.uc-atw .why-grid{ grid-template-columns: repeat(2, 1fr); gap: 36px 40px; }}@media (max-width: 560px){.uc-atw .why-grid{ grid-template-columns: 1fr; }}.uc-atw .steps-head{ max-width: 860px; margin: 0 0 40px; text-align: left; }.uc-atw .steps-head h2{ font-size: clamp(1.75rem, 3.4vw, 2.5rem); font-weight: 500; letter-spacing: -0.02em; line-height: 1.14; color: var(--tx); margin: 0 0 18px; }.uc-atw .steps-walk{ display: inline-flex; align-items: center; gap: 8px; color: var(--acc); font-size: 1rem; font-weight: 500; text-decoration: none; }.uc-atw .steps-walk svg{ width: 20px; height: 20px; }.uc-atw .steps-tabs{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--cardbd); margin-bottom: 30px; }.uc-atw .steps-tab{ position: relative; text-align: left; background: none; border: 0; border-top: 2px solid transparent; margin-top: -1px; padding: 22px 22px 24px 0; cursor: pointer; color: inherit; font: inherit; transition: border-color 0.2s ease; }.uc-atw .steps-tab.ucx-is-active{ border-top-color: var(--acc); }.uc-atw .steps-num{ display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 999px; background: var(--mist); border: 1px solid var(--cardbd); color: var(--txd); font-size: 0.8rem; font-weight: 600; line-height: 1; margin-bottom: 14px; transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease; }.uc-atw .steps-tab.ucx-is-active .steps-num{ background: var(--acc); border-color: var(--acc); color: #fff; }.uc-atw .steps-tab-title{ display: block; font-size: 1rem; font-weight: 500; letter-spacing: -0.01em; line-height: 1.3; color: var(--txd); margin-bottom: 7px; transition: color 0.2s ease; }.uc-atw .steps-tab.ucx-is-active .steps-tab-title{ color: var(--tx); }.uc-atw .steps-tab-desc{ display: block; font-size: 0.9rem; line-height: 1.5; color: var(--txd); opacity: 0.75; }.uc-atw .steps-tab.ucx-is-active .steps-tab-desc{ opacity: 1; }.uc-atw .steps-doc{ display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; color: var(--acc); font-size: 0.875rem; font-weight: 500; text-decoration: none; }.uc-atw .steps-doc svg{ width: 15px; height: 15px; transition: transform 0.2s ease; }.uc-atw .steps-doc:hover svg{ transform: translateX(3px); }.uc-atw .steps-media{ border: 1px solid var(--cardbd); border-radius: 22px; overflow: hidden; background: var(--mist); aspect-ratio: 16 / 9; box-shadow: 0 30px 70px -40px rgba(16, 24, 40, 0.4); }.uc-atw .steps-media video{ width: 100%; height: 100%; object-fit: cover; display: block; }@media (max-width: 860px){.uc-atw .steps-tabs{ grid-template-columns: repeat(2, 1fr); gap: 0 20px; }.uc-atw .steps-tab{ padding-right: 16px; }}@media (max-width: 500px){.uc-atw .steps-tabs{ grid-template-columns: 1fr; }.uc-atw .steps-tab{ border-top: 1px solid var(--cardbd); border-left: 2px solid transparent; margin-top: 0; padding: 20px 0 20px 18px; }.uc-atw .steps-tab.ucx-is-active{ border-top-color: var(--cardbd); border-left-color: var(--acc); }}.uc-atw .cmp-kicker{ text-align: center; max-width: 720px; margin: 64px auto 0; font-size: 1.0625rem; line-height: 1.6; color: var(--txd); }.uc-atw .cmp-kicker strong{ color: var(--tx); font-weight: 600; }.uc-atw .wpwhy-stats{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 36px 32px; margin-top: 54px; }.uc-atw .wpwhy-item{ text-align: center; }.uc-atw .wpwhy-lead{ display: block; font-size: clamp(1.5rem, 2.7vw, 2.125rem); font-weight: 500; letter-spacing: -0.02em; line-height: 1.08; color: var(--tx); margin-bottom: 12px; }.uc-atw .wpwhy-item p{ font-size: 0.95rem; line-height: 1.55; color: var(--txd); margin: 0 auto; max-width: 30ch; }@media (max-width: 820px){.uc-atw .wpwhy-stats{ grid-template-columns: repeat(2, 1fr); gap: 40px 28px; }}@media (max-width: 460px){.uc-atw .wpwhy-stats{ grid-template-columns: 1fr; }}.uc-atw .seo-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; margin-top: 52px; }.uc-atw .seo-item{ background: var(--cardbg); padding: 30px 28px 34px; }.uc-atw .seo-ic{ display: inline-block; width: 24px; height: 24px; color: var(--acc); margin-bottom: 16px; }.uc-atw .seo-ic svg{ width: 100%; height: 100%; display: block; }.uc-atw .seo-item h3{ font-size: 1.0625rem; font-weight: 500; letter-spacing: -0.01em; line-height: 1.3; color: var(--tx); margin: 0 0 8px; }.uc-atw .seo-item p{ font-size: 0.925rem; line-height: 1.55; color: var(--txd); margin: 0; }@media (max-width: 820px){.uc-atw .seo-grid{ grid-template-columns: repeat(2, 1fr); }}@media (max-width: 520px){.uc-atw .seo-grid{ grid-template-columns: 1fr; }}.uc-atw .rel-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }.uc-atw .ucx-rel-card{ position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; min-height: 152px; padding: 28px 18px; background: var(--cardbg); border: 1px solid var(--cardbd); border-radius: 16px; text-decoration: none; box-shadow: 0 2px 10px -7px rgba(16, 24, 40, 0.2); transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; }.uc-atw .ucx-rel-card:hover{ transform: translateY(-3px); border-color: color-mix(in srgb, var(--acc) 45%, var(--cardbd)); box-shadow: 0 16px 32px -20px rgba(16, 24, 40, 0.32); }.uc-atw .rel-logo{ height: 56px; display: grid; place-items: center; }.uc-atw .rel-logo img{ height: 48px; width: 48px; object-fit: contain; display: block; }.uc-atw .rel-name{ font-size: 1rem; font-weight: 500; color: var(--tx); letter-spacing: -0.01em; }.uc-atw .rel-hubwrap{ text-align: center; margin-top: 40px; }@media (max-width: 900px){.uc-atw .rel-grid{ grid-template-columns: repeat(3, 1fr); }}@media (max-width: 620px){.uc-atw .rel-grid{ grid-template-columns: repeat(2, 1fr); }}.uc-atw.uc-atw .rel-grid, .c2wp.uc-atw .rel-grid{ display: flex; flex-wrap: wrap; justify-content: center; }.uc-atw.uc-atw .ucx-rel-card{ flex: 0 0 calc((100% - 4 * 16px) / 5); }.c2wp.uc-atw .ucx-rel-card{ flex: 0 0 calc((100% - 3 * 16px) / 4); }@media (max-width: 1180px){.uc-atw.uc-atw .ucx-rel-card{ flex-basis: calc((100% - 3 * 16px) / 4); }}@media (max-width: 900px){.uc-atw.uc-atw .ucx-rel-card, .c2wp.uc-atw .ucx-rel-card{ flex-basis: calc((100% - 2 * 16px) / 3); }}@media (max-width: 620px){.uc-atw.uc-atw .ucx-rel-card, .c2wp.uc-atw .ucx-rel-card{ flex-basis: calc((100% - 16px) / 2); }}.uc-atw.is-night .wq-shots, .uc-atw.is-night .ul-shot{ background: #1f1f1f; border-color: rgba(255, 255, 255, 0.12); }.uc-atw.is-night .wq-frame, .uc-atw.is-night .ul-frame{ background: #262626; } .uc-atw .rel-logo{ height: auto; display: grid; place-items: center; }.uc-atw .rel-tile{ position: relative; width: 72px; height: 72px; border-radius: 18px; background: #ffffff; border: 1px solid rgba(16, 24, 40, 0.10); box-shadow: 0 4px 14px -8px rgba(16, 24, 40, 0.30); overflow: hidden; transition: background-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.55s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.55s cubic-bezier(0.4, 0, 0.2, 1); }.uc-atw.is-night .rel-tile{ background: #262626; border-color: rgba(255, 255, 255, 0.14); box-shadow: 0 6px 18px -10px rgba(0, 0, 0, 0.6); }.uc-atw.is-night .rel-tile .rel-conv-src.is-mono{ filter: brightness(0) invert(1); }.uc-atw.is-night .rel-tile .rel-conv-wp{ filter: brightness(0) invert(1); }.uc-atw .rel-tile .rel-conv-src{ position: absolute; left: 8px; top: 8px; width: 22px; height: 22px; object-fit: contain; transform: translate(17px, 17px) scale(1.8182); transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }.uc-atw .rel-tile .rel-conv-trail{ position: absolute; left: 5px; bottom: 10px; width: 26px; height: 26px; color: #9aa0a6; opacity: 0; transition: opacity 0.12s ease; }.uc-atw.is-night .rel-tile .rel-conv-trail{ color: rgba(255, 255, 255, 0.55); }.uc-atw .rel-tile .rel-conv-wp{ position: absolute; right: 8px; bottom: 8px; width: 34px; height: 34px; object-fit: contain; opacity: 0; transform: scale(0.55); transition: opacity 0.14s ease, transform 0.2s cubic-bezier(0.4, 0, 0.2, 1); }.uc-atw .ucx-rel-card:hover .rel-conv-src, .uc-atw .ucx-rel-card:focus-visible .rel-conv-src{ transform: none; transition: transform 0.32s cubic-bezier(0.23, 1, 0.32, 1); }.uc-atw .ucx-rel-card:hover .rel-conv-wp, .uc-atw .ucx-rel-card:focus-visible .rel-conv-wp{ opacity: 1; transform: none; transition: opacity 0.22s ease 0.06s, transform 0.34s cubic-bezier(0.34, 1.56, 0.64, 1) 0.06s; }.uc-atw .ucx-rel-card:hover .rel-conv-trail, .uc-atw .ucx-rel-card:focus-visible .rel-conv-trail{ opacity: 1; transition: opacity 0.18s ease 0.26s; }@media (prefers-reduced-motion: reduce){.uc-atw .rel-tile .rel-conv-src, .uc-atw .rel-tile .rel-conv-trail, .uc-atw .rel-tile .rel-conv-wp{ transition: none; }}@keyframes uc-rev-up{ from { transform: translateY(0); } to { transform: translateY(-50%); } }:where(.uc-atw) .uc-rev-track{ animation: uc-rev-up var(--dur,48s) linear infinite; will-change: transform; }:where(.uc-atw) .uc-rev-track.rev{ animation-direction: reverse; }:where(.uc-atw) .uc-rev-col:hover .uc-rev-track{ animation-play-state: paused; }@media (prefers-reduced-motion: reduce){:where(.uc-atw) .uc-rev-track{ animation: none; }} /* --------------------------------------------------------------------------- Independence from #uichemy-globals. The ucx- renames dodge every class-scoped rule in the old block. What is left are its BARE-ELEMENT rules, which no rename can reach: body h1..h6 { font-weight:600 !important; letter-spacing:-.02em !important } h1, h2, h3, h4 { line-height: var(--uc-lh-tight); margin: 0 0 var(--uc-s4) } .elementor a { box-shadow: none } The margin half is answered by the generated block at the top of this file, and this page needs NO line-height block: every one of its 14 headings sets its own, so globals' `line-height: var(--uc-lh-tight)` never wins here (unlike the awf and ucc pages, where three signatures inherited theirs). Measured, not guessed: globals' six bare-element rules were injected into the local render and computed styles diffed twice across all 1222 elements in scope. 58 stable differences came back - 34 font-weight, 13 letter-spacing, 2 box-shadow, and 9 width/height that follow from those - and the blocks below are exactly those. Only an !important beats an !important, so weight and tracking are re-asserted from the verified local render, UNLAYERED so they beat globals while still losing to this page's own `!`-prefixed utilities in @layer utilities. Every selector carries a class, to outrank globals' (0,0,2). The two `.ds-t24` rules are order-independent: `h3.ds-t24.\!font-light` is (0,2,1) and beats the plain `h3.ds-t24` at (0,1,1). */ :where(.uc-atw) h1.ucx-pill-title{font-weight:500!important;letter-spacing:-0.02em!important} :where(.uc-atw) .ucx-sec-head h2{font-weight:500!important;letter-spacing:-0.02em!important} :where(.uc-atw) .wm-head-l h2{font-weight:500!important;letter-spacing:-0.02em!important} :where(.uc-atw) .faq2-title h2{font-weight:500!important;letter-spacing:-0.02em!important} :where(.uc-atw) h2.\!mt-3.\!mb-0{font-weight:500!important;letter-spacing:-0.03em!important} :where(.uc-atw) h2.mt-3.text-\[48px\]{font-weight:500!important;letter-spacing:-0.03em!important} :where(.uc-atw) h3.ds-t24{font-weight:500!important;letter-spacing:-0.01em!important} :where(.uc-atw) h3.ds-t24.\!font-light{font-weight:300!important;letter-spacing:-0.01em!important} /* --------------------------------------------------------------------------- globals' `.elementor a { box-shadow:none }` at (0,1,1) outranks this page's own button rules at (0,1,0) and flattens the two hero CTAs. Re-asserted at (0,2,0)+ with the SAME tokens the page already uses, so there is one source of truth for the values and the state rules keep their relative order. `.ucx-rel-card` is NOT here: its own rule is already `.uc-atw .ucx-rel-card` at (0,2,0), so it survives globals untouched - which the measurement confirms (2 box-shadow diffs, not 3). */ .uc-atw .Button_solid__hu289{box-shadow:var(--_shadow, var(--uc-shadow-control-brand))} .uc-atw .Button_outline__Zwmoe{box-shadow:inset 0 0 0 1px var(--_border, var(--uc-border-subtle)), var(--uc-shadow-raised)} .uc-atw .Button_solid__hu289.Button_neutral__jwE0u{box-shadow:var(--uc-shadow-control)} .uc-atw .Button_solid__hu289:active:not(:disabled){box-shadow:var(--uc-shadow-control-pressed)} /* --------------------------------------------------------------------------- NO img height rule here, deliberately. See tools/wp-migration/ucc/tail.css: copying awf's `img.h-full{height:100%}` broke that page's `absolute inset-0` images, because Elementor's `height:auto` is what produces the correct value. Nothing on this page needed one either. */ /* "Soon" badge on the AI-to-WordPress cards that are not live yet. Geometry copied from uichemy.com's `.src-tile.is-soon::after` (10px/700/.05em uppercase, top-right, pill), recoloured onto OUR tokens — that grid is on a dark surface there and the values were rgba(255,255,255,...). A real instead of ::after so the tooltip's data-t/data-d still drive the hover panel, and var() only so the section-CSS pipeline has no colour literal to rewrite into a Global Manager token. .is-soon cards carry no href, so they also lose the pointer affordance. */ .ucx-rel-card.is-soon { position: relative; cursor: default; } .uc-soon-card { position: absolute; top: 12px; right: 12px; z-index: 3; display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: 10px; font-weight: 700; line-height: 14px; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; color: var(--color-sprout-color-text-weaker); background: var(--color-sprout-color-background-weaker); border: 1px solid var(--color-sprout-color-border-weak); } /* Radius utilities fail two ways after conversion, both fixed here. 1. Elementor ships `.elementor img{ ... border-radius:0 }` at (0,1,1); these utilities are wrapped in :where() - zero specificity by design - so on an Elementor's reset wins and the corner renders square. 2. Some values used in the markup were purged and had no rule on ANY element. Restating each used value at (0,2,0) covers both, page-scoped, no !important. */ .uc-atw .rounded-\[9px\]{ border-radius: 9px; }.uc-atw .rounded-\[10px\]{ border-radius: 10px; }.uc-atw .rounded-\[16px\]{ border-radius: 16px; }.uc-atw .rounded-\[20px\]{ border-radius: 20px; }.uc-atw .rounded-\[24px\]{ border-radius: 24px; }.uc-atw .rounded-\[28px\]{ border-radius: 28px; }.uc-atw .rounded-\[30px\]{ border-radius: 30px; }.uc-atw .rounded-\[34px\]{ border-radius: 34px; }