PageSourceSearch

https://comicme.ai/

html comicme.ai collected 2026-10-04 15:11:11 UTC 1,119,567 bytes, 7,810 lines download raw bytes

1<!DOCTYPE html><html data-prerendered="true" style="background-color:#121212" lang="en" class="ds-properties ds-themes tab-disabled dark" dir="ltr"><head>
2  <link rel="preconnect" href="https://pastatic.picsart.com" crossorigin>
3  <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
4  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
5<style data-prerender-fixes>[class*="mobileLogo"]{display:none}</style>
6    <meta charset="UTF-8">
7    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=auto" id="meta-viewport">
8    <title>ComicMe - AI Comic Book Generator | Picsart</title>
9    
10    <link rel="manifest" href="https://cdn140.picsart.com/69624423237702047608.json">
11    
12    <link rel="preconnect" href="https://api.picsart.com">
13    <link rel="preconnect" href="https://pastatic.picsart.com">
14    <link rel="preconnect" href="https://optifyr.com">
15    <link rel="preconnect" href="https://t.picsart.com">
16    <style data-prerender-keep="">
17      @layer foundation.reset, foundation.primitives, foundation.themes,
18        cascade.subAtoms, cascade.atoms, cascade.molecules,
19        cascade.organisms, cascade.templates;
20      /* Hidden until BootstrapWatcher fades it in after EmbeddedRuntimeProvider bootstraps.
21         Flex column: the runtime renders its template header and
22         #miniapp-container as plain siblings — the header keeps its
23         intrinsic height, the container takes the remaining space. */
24      #embedded-host {
25        position: fixed;
26        inset: 0;
27        opacity: 0;
28        pointer-events: none;
29        transition: opacity 0.3s ease;
30        display: flex;
31        flex-direction: column;
32      }
33      html[data-prerendered] #root {
34        position: fixed;
35        inset: 0;
36        display: flex;
37        flex-direction: column;
38      }
39      #miniapp-container {
40        flex: 1 1 0%;
41        min-height: 0;
42        position: relative;
43      }
44      #miniapp-container > div {
45        position: absolute;
46        inset: 0;
47      }
48      #miniapp-container > div > div {
49        width: 100%;
50        height: 100%;
51      }
52      /* Shadow-DOM isolation only: the light-DOM node that holds
53         #miniapp-container. It is slot-projected into the shell's in-shadow
54         .ds-scope flex column, so it must fill the remaining space the same way
55         #miniapp-container did as a direct child of #embedded-host. Inert when
56         isolation is off (the node is never created). */
57      #miniapp-light-root {
58        flex: 1 1 0%;
59        min-height: 0;
60        display: flex;
61        flex-direction: column;
62      }
63    </style>
64    
65    
66    
67    
68    
69    
70    
71    
72    
73    <style data-prerender-css data-original-href="/assets/ds-components-CEHdc4xn.css">
74@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
75@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 400; src: local("Gilroy-Regular"), url("https://pastatic.picsart.com/cms-pastatic/d018cb40-40a8-4efa-a202-947285ae8329.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
76@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 500; src: local("Gilroy-Medium"), url("https://pastatic.picsart.com/cms-pastatic/3de40576-a960-483a-a3ab-a1743e3c4ba6.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
77@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 600; src: local("Gilroy-SemiBold"), url("https://pastatic.picsart.com/cms-pastatic/eae6e1ea-9319-406c-a3de-00431f8f03f4.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
78@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 700; src: local("Gilroy-Bold"), url("https://pastatic.picsart.com/cms-pastatic/0ea441d6-d0d4-4236-b649-67a987887865.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
79html { --fonts-gilroy: Gilroy-Fonts, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, Helvetica, Arial, sans-serif; }
80@layer ds-reset {
81  * { margin: 0px; padding: 0px; box-sizing: border-box; }
82  ::selection { background-color: var(--primary-colors-base-default); color: var(--primary-colors-text-default); }
83  html { min-height: 100dvh;
83 overscroll-behavior: none; text-rendering: optimizelegibility; -webkit-font-smoothing: antialiased; text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; font-feature-settings: normal; }
84  @supports (-webkit-touch-callout: none) and (padding-top: env(safe-area-inset-top)) {
85  html { padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
86}
87  a { text-decoration: none; }
88  iframe { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; outline: none; }
89  button { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; cursor: pointer; }
90  input, textarea, select { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; outline: none; background: none; font-family: inherit; }
91  input, select { appearance: none; }
92  a, button, input, textarea, select, div { -webkit-tap-highlight-color: transparent; }
93  input, button, textarea, select { font-family: var(--fonts-gilroy); }
94  ul, ol { list-style: none; }
95}
96@layer ds-foundation {
97  html { --easings-ease: cubic-bezier(.25, .1, .25, 1); --easings-ease-in: cubic-bezier(.42, 0, 1, 1); --easings-ease-in-out: cubic-bezier(.42, 0, .58, 1); --easings-ease-out: cubic-bezier(0, 0, .58, 1); --easings-linear: cubic-bezier(0, 0, 1, 1); --easings-practical: cubic-bezier(.4, 0, .2, 1); --easings-expressive: cubic-bezier(.4, 0, 0, 1); --easings-bounce: cubic-bezier(.34, 1.56, .64, 1); --states-disabled: .4; --corner-radius-circle: 50%; --corner-radius-r0: 0px; --corner-radius-r2: 2px; --corner-radius-r4: 4px; --corner-radius-r8: 8px; --corner-radius-r12: 12px; --corner-radius-r16: 16px; --corner-radius-r20: 20px; --corner-radius-r22: 22px; --corner-radius-r24: 24px; --corner-radius-r32: 32px; --spacings-s0: 0px; --spacings-s2: 2px; --spacings-s4: 4px; --spacings-s6: 6px; --spacings-s8: 8px; --spacings-s10: 10px; --spacings-s12: 12px; --spacings-s16: 16px; --spacings-s24: 24px; --spacings-s32: 32px; --spacings-s40: 40px; --spacings-s44: 44px; --spacings-s48: 48px; --spacings-s56: 56px; --spacings-s64: 64px; --spacings-s72: 72px; --stacking-context-lowest: -9999; --stacking-context-initial: 0; --stacking-context-layout: 1000; --stacking-context-popover: 2000; --stacking-context-popup: 3000; --stacking-context-tooltip: 4000; --stacking-context-toast: 5000; --stacking-context-highest: 9999; --timings-fast: .1s; --timings-default: .3s; --timings-medium: .5s; --timings-long: 1s; --timings-heavy: 2s; --typography-t1-font-size: 8px; --typography-t1-line-height: 10px; --typography-t2-font-size: 10px; --typography-t2-line-height: 14px; --typography-t3-font-size: 12px; --typography-t3-line-height: 16px; --typography-t4-font-size: 14px; --typography-t4-line-height: 20px; --typography-t5-font-size: 16px; --typography-t5-line-height: 24px; --typography-t6-font-size: 20px; --typography-t6-line-height: 28px; --typography-t7-font-size: 24px; --typography-t7-line-height: 32px; --typography-t8-font-size: 30px; --typography-t8-line-height: 36px; --typography-t9-font-size: 36px; --typography-t9-line-height: 48px; --typography-t10-font-size: 42px; --typography-t10-line-height: 50px; --typography-t11-font-size: 60px; --typography-t11-line-height: 72px; }
98  html.light { --brand-colors-default: #F40BF4; --brand-colors-light: #FFFCF8; --brand-colors-dark: #000000; --absolute-black-colors-base-default: #000000; --absolute-black-colors-base-action: #313131; --absolute-black-colors-base-active: #000000; --absolute-black-colors-base-active-action: #313131; --absolute-black-colors-text-default: #ffffff; --absolute-black-colors-text-action: #ffffff; --absolute-black-colors-text-active: #ffffff; --absolute-black-colors-text-active-action: #ffffff; --absolute-white-colors-base-default: #ffffff; --absolute-white-colors-base-action: #ececec; --absolute-white-colors-base-active: #ffffff; --absolute-white-colors-base-active-action: #ececec; --absolute-white-colors-text-default: #000000; --absolute-white-colors-text-action: #000000; --absolute-white-colors-text-active: #000000; --absolute-white-colors-text-active-action: #000000; --background-colors-base: #fcfcfc; --background-colors-tint-1: #f7f7f7; --background-colors-tint-2: #f2f2f2; --background-colors-tint-3: #d9d9d9; --background-colors-border: #e8e8e8; --background-colors-transparent: rgba(0, 0, 0, .5215686275); --background-colors-tooltip: #ffffff; --background-colors-popover: #ffffff; --background-colors-canvas-back-layer: #ededed; --control-colors-border-default: #e0e0e0; --control-colors-border-action: #e0e0e0; --control-colors-border-active: #e0e0e0; --control-colors-border-active-action: #e0e0e0; --control-colors-button-background-default: #ffffff; --control-colors-button-background-action: #f7f7f7; --control-colors-button-background-active: #eeeeee; --control-colors-button-background-active-action: #f7f7f7; --control-colors-caret-default: #5a00ee; --control-colors-caret-action: #5a00ee; --control-colors-caret-active: #5a00ee; --control-colors-caret-active-action: #5a00ee; --control-colors-end-icon-default: #525252; --control-colors-end-icon-action: #3d3d3d; --control-colors-end-icon-active: #000000; --control-colors-end-icon-active-action: #3d3d3d; --control-colors-field-background-default: #ffffff; --control-colors-field-background-action: #f7f7f7; --control-colors-field-background-active: #eeeeee; --control-colors-field-background-active-action: #f7f7f7; --control-colors-placeholder-default: #707070; --control-colors-placeholder-action: #707070; --control-colors-placeholder-active: #707070; --control-colors-placeholder-active-action: #707070; --control-colors-slider-thumb-default: #fefefe; --control-colors-slider-thumb-action: #f1f1f1; --control-colors-slider-thumb-active: #fefefe; --control-colors-slider-thumb-active-action: #f1f1f1; --control-colors-slider-track-default: #C209C1; --control-colors-slider-track-action: #C209C1; --control-colors-slider-track-active: #C209C1; --control-colors-slider-track-active-action: #C209C1; --control-colors-start-icon-default: #525252; --control-colors-start-icon-action: #3d3d3d; --control-colors-start-icon-active: #000000; --control-colors-start-icon-active-action: #3d3d3d; --control-colors-text-default: #525252; --control-colors-text-action: #3d3d3d; --control-colors-text-active: #000000; --control-colors-text-active-action: #3d3d3d; --control-colors-value-default: #525252; --control-colors-value-action: #3d3d3d; --control-colors-value-active: #000000; --control-colors-value-active-action: #3d3d3d; --text-colors-base: #000000; --text-colors-tint-1: #4c4c4c; --text-colors-tint-2: #666666; --text-colors-tint-3: #737373; --error-colors-base-default: #D10037; --error-colors-base-action: #A9002D; --error-colors-base-active: #D10037; --error-colors-base-active-action: #A9002D; --error-colors-text-default: #ffffff; --error-colors-text-action: #ffffff; --error-colors-text-active: #ffffff; --error-colors-text-active-action: #ffffff; --information-colors-base-default: #0066eb; --information-colors-base-action: #0055c3; --information-colors-base-active: #0066eb; --information-colors-base-active-action: #0055c3; --information-colors-text-default: #ffffff; --information-colors-text-action: #ffffff; --information-colors-text-active: #ffffff; --information-colors-text-active-action: #ffffff; --success-colors-base-default: #00804A; --success-colors-base-action: #005A34; --success-colors-base-active: #00804A; --success-colors-base-active-action: #005A34; --success-colors-text-default: #ffffff; --success-colors-text-action: #ffffff; --success-colors-text-active: #ffffff; --success-colors-text-active-action: #ffffff; --warning-colors-base-default: #FFAA00; --warning-colors-base-action: #D99100; --warning-colors-base-active: #FFAA00; --warning-colors-base-active-action: #D99100; --warning-colors-text-default: #000000; --warning-colors-text-action: #000000; --warning-colors-text-active: #000000; --warning-colors-text-active-action: #000000; --negative-colors-base-default: #000000; --negative-colors-base-action: #787878; --negative-colors-base-active: #000000; --negative-colors-base-active-action: #787878; --negative-colors-text-default: #ffffff; --negative-colors-text-action: #ffffff; --negative-colors-text-active: #ffffff; --negative-colors-text-active-action: #ffffff; --neutral-colors-base-default: #f2f2f2; --neutral-colors-base-action: #b4b4b4; --neutral-colors-base-active: #f2f2f2; --neutral-colors-base-active-action: #b4b4b4; --neutral-colors-text-default: #000000; --neutral-colors-text-action: #000000; --neutral-colors-text-active: #000000; --neutral-colors-text-active-action: #000000; --positive-colors-base-default: #ffffff; --positive-colors-base-action: #b4b4b4; --positive-colors-base-active: #ffffff; --positive-colors-base-active-action: #b4b4b4; --positive-colors-text-default: #000000; --positive-colors-text-action: #000000; --positive-colors-text-active: #000000; --positive-colors-text-active-action: #000000; --primary-colors-base-default: #c209c1; --primary-colors-base-action: #920792; --primary-colors-base-active: #c209c1; --primary-colors-base-active-action: #920792; --primary-colors-text-default: #ffffff; --primary-colors-text-action: #ffffff; --primary-colors-text-active: #ffffff; --primary-colors-text-active-action: #ffffff; --primary-colors-alpha-10: rgba(194, 9, 193, .1019607843); --primary-colors-alpha-20: rgba(194, 9, 193, .2); --primary-colors-alpha-50: rgba(194, 9, 193, .5019607843); --primary-colors-alpha-80: rgba(194, 9, 193, .8); --transformer-colors-base-default: #3b8ce2; --transformer-colors-base-action: #3b8ce2; --transformer-colors-base-active: #3b8ce2; --transformer-colors-base-active-action: #3b8ce2; --transformer-colors-text-default: #ffffff; --transformer-colors-text-action: #ffffff; --transformer-colors-text-active: #ffffff; --transformer-colors-text-active-action: #ffffff; --monetization-plus-colors-base-default: #ac06ca; --monetization-plus-colors-base-action: #87059e; --monetization-plus-colors-base-active: #ac06ca; --monetization-plus-colors-base-active-action: #87059e; --monetization-plus-colors-text-default: #ffffff; --monetization-plus-colors-text-action: #ffffff; --monetization-plus-colors-text-active: #ffffff; --monetization-plus-colors-text-active-action: #ffffff; --monetization-plus-colors-alpha-10: rgba(172, 6, 202, .1019607843); --monetization-plus-colors-alpha-20: rgba(172, 6, 202, .2); --monetization-plus-colors-alpha-50: rgba(172, 6, 202, .5019607843); --monetization-plus-colors-alpha-80: rgba(172, 6, 202, .8); --monetization-pro-colors-base-default: #5a00ee; --monetization-pro-colors-base-action: #3d00a2; --monetization-pro-colors-base-active: #5a00ee; --monetization-pro-colors-base-active-action: #3d00a2; --monetization-pro-colors-text-default: #ffffff; --monetization-pro-colors-text-action: #ffffff; --monetization-pro-colors-text-active: #ffffff; --monetization-pro-colors-text-active-action: #ffffff; --monetization-pro-colors-alpha-10: rgba(90, 0, 238, .1019607843); --monetization-pro-colors-alpha-20: rgba(90, 0, 238, .2); --monetization-pro-colors-alpha-50: rgba(90, 0, 238, .5019607843); --monetization-pro-colors-alpha-80: rgba(90, 0, 238, .8); --monetization-ultra-colors-base-default: #158380; --monetization-ultra-colors-base-action: #0e5957; --monetization-ultra-colors-base-active: #158380; --monetization-ultra-colors-base-active-action: #0e5957; --monetization-ultra-colors-text-default: #ffffff; --monetization-ultra-colors-text-action: #ffffff; --monetization-ultra-colors-text-active: #ffffff; --monetization-ultra-colors-text-active-action: #ffffff; --monetization-ultra-colors-alpha-10: rgba(21, 131, 128, .1019607843); --monetization-ultra-colors-alpha-20: rgba(21, 131, 128, .2); --monetization-ultra-colors-alpha-50: rgba(21, 131, 128, .5019607843); --monetization-ultra-colors-alpha-80: rgba(21, 131, 128, .8); --gradients-general-brand: linear-gradient(225deg, #00ffed 0%, #19d7e7 22.96%, #7f4ad9 45.31%, #af1fc6 66.73%, #df02c0 100%); --gradients-general-primary: linear-gradient(270deg, #f749f6 0%, #c209c1 100%); --gradients-status-info: linear-gradient(270deg, #17bbf2 0%, #0066eb 100%); --gradients-status-success: linear-gradient(269.27deg, #1ac490 3.29%, #008c62 99.37%); --gradients-status-warning: linear-gradient(270deg, #ffcc63 0%, #ff921e 100%); --gradients-status-error: linear-gradient(270deg, #ff6170 0%, #d10037 100%); --gradients-monetization-plus: linear-gradient(270deg, #f749f6 0%, #c209c1 100%); --gradients-monetization-pro: linear-gradient(270deg, #8a43ff 0%, #5600e3 100%); --gradients-monetization-ultra: linear-gradient(270deg, #0fbeb9 0%, #00827e 100%); --gradients-background-up: linear-gradient(360deg, #fcfcfc 0%, transparent 100%); --gradients-background-down: linear-gradient(180deg, #fcfcfc 0%, transparent 100%); --gradients-background-left: linear-gradient(90deg, #fcfcfc 0%, transparent 100%); --gradients-background-right: linear-gradient(270deg, #fcfcfc 0%, transparent 100%); --apple-colors-base-default: #ffffff; --apple-colors-base-action: #e6e6e6; --apple-colors-base-active: #ffffff; --apple-colors-base-active-action: #e6e6e6; --apple-colors-text-default: #ffffff; --apple-colors-text-action: #ffffff; --apple-colors-text-active: #ffffff; --apple-colors-text-active-action: #ffffff; --facebook-colors-base-default: #0766ff; --facebook-colors-base-action: #0050d1; --facebook-colors-base-active: #0766ff; --facebook-colors-base-active-action: #0050d1; --facebook-colors-text-default: #ffffff; --facebook-colors-text-action: #ffffff; --facebook-colors-text-active: #ffffff; --facebook-colors-text-active-action: #ffffff; --google-colors-base-default: #f2f2f2; --google-colors-base-action: #c2c2c2; --google-colors-base-active: #f2f2f2; --google-colors-base-active-action: #c2c2c2; --google-colors-text-default: #1f1f1f;
98 --google-colors-text-action: #1f1f1f; --google-colors-text-active: #1f1f1f; --google-colors-text-active-action: #1f1f1f; --kakao-colors-base-default: #fee500; --kakao-colors-base-action: #ebd402; --kakao-colors-base-active: #fee500; --kakao-colors-base-active-action: #ebd402; --kakao-colors-text-default: #262200; --kakao-colors-text-action: #262200; --kakao-colors-text-active: #262200; --kakao-colors-text-active-action: #262200; --line-colors-base-default: #06c755; --line-colors-base-action: #1fcd66; --line-colors-base-active: #048b3c; --line-colors-base-active-action: #06c755; --line-colors-text-default: #ffffff; --line-colors-text-action: #ffffff; --line-colors-text-active: #ffffff; --line-colors-text-active-action: #ffffff; --snapchat-colors-base-default: #fffc00; --snapchat-colors-base-action: #ece801; --snapchat-colors-base-active: #fffc00; --snapchat-colors-base-active-action: #ece801; --snapchat-colors-text-default: #000000; --snapchat-colors-text-action: #000000; --snapchat-colors-text-active: #000000; --snapchat-colors-text-active-action: #000000; --christmas-green-colors-base-default: #007c02; --christmas-green-colors-base-action: #0e5a18; --christmas-green-colors-base-active: #007c02; --christmas-green-colors-base-active-action: #0e5a18; --christmas-green-colors-text-default: #ffffff; --christmas-green-colors-text-action: #ffffff; --christmas-green-colors-text-active: #ffffff; --christmas-green-colors-text-active-action: #ffffff; --christmas-red-colors-base-default: #c70e17; --christmas-red-colors-base-action: #9e0b12; --christmas-red-colors-base-active: #c70e17; --christmas-red-colors-base-active-action: #9e0b12; --christmas-red-colors-text-default: #ffffff; --christmas-red-colors-text-action: #ffffff; --christmas-red-colors-text-active: #ffffff; --christmas-red-colors-text-active-action: #ffffff; --effects-alpha-20: color-mix(in srgb, #ffffff 20%, transparent); --effects-alpha-50: color-mix(in srgb, #ffffff 50%, transparent); --effects-alpha-80: color-mix(in srgb, #ffffff 80%, transparent); --effects-vignette: radial-gradient(44.71% 44.71% at 50.14% 50.12%, rgba(243, 10, 242, .484) 0%, rgba(243, 10, 242, .33) 32%, rgba(243, 10, 242, .187) 56%, rgba(243, 10, 242, .088) 76%, rgba(243, 10, 242, .022) 91%, rgba(243, 10, 242, 0) 100%); --effects-glassy-tint: rgba(255, 255, 255, .64); --effects-glassy-highlight: rgb(255, 255, 255); --effects-glassy-highlight-top: rgb(255, 255, 255); --effects-glassy-highlight-border: rgb(255, 255, 255); --effects-glassy-inner-shadow: inset 0px 1px 0 rgb(255 255 255 / 18%), inset 0 1px 0 rgb(255 255 255 / 10%), inset 0px 0px 19px 12px rgb(255 255 255 / 29%); --effects-glassy-blur-radius: 8px; --effects-glassy-border-width: 1px; --effects-glassy-backdrop: blur(var(--effects-glassy-blur-radius)); --effects-glassy-edge-top: linear-gradient(90deg, transparent, var(--effects-glassy-highlight-top), transparent); --effects-glassy-edge-side: linear-gradient(180deg, var(--effects-glassy-highlight), transparent, var(--effects-glassy-highlight)); --effects-glassy-shadow: 0px 8px 32px 0px rgba(0, 0, 0, .12); --effects-blurred-radius: 32px; --effects-blurred: blur(var(--effects-blurred-radius)); --shadows-tint-1: 0px 0px 16px 0px rgba(0, 0, 0, .12); --shadows-tint-2: 0px 0px 24px 0px rgba(0, 0, 0, .16); --shadows-tint-3: 0px 0px 32px 0px rgba(0, 0, 0, .16); }
99  @media (prefers-reduced-transparency: reduce) {
100  html.light { --effects-glassy-tint: var(--background-colors-base); --effects-glassy-backdrop: none; --effects-glassy-edge-top: none; --effects-glassy-edge-side: none; --effects-blurred: none; }
101}
102  html.dark { --brand-colors-default: #FF47FF; --brand-colors-light: #FFFCF8; --brand-colors-dark: #000000; --absolute-black-colors-base-default: #000000; --absolute-black-colors-base-action: #313131; --absolute-black-colors-base-active: #000000; --absolute-black-colors-base-active-action: #313131; --absolute-black-colors-text-default: #ffffff; --absolute-black-colors-text-action: #ffffff; --absolute-black-colors-text-active: #ffffff; --absolute-black-colors-text-active-action: #ffffff; --absolute-white-colors-base-default: #ffffff; --absolute-white-colors-base-action: #ececec; --absolute-white-colors-base-active: #ffffff; --absolute-white-colors-base-active-action: #ececec; --absolute-white-colors-text-default: #000000; --absolute-white-colors-text-action: #000000; --absolute-white-colors-text-active: #000000; --absolute-white-colors-text-active-action: #000000; --background-colors-base: #121212; --background-colors-tint-1: #1c1c1c; --background-colors-tint-2: #262626; --background-colors-tint-3: #454545; --background-colors-border: #303030; --background-colors-transparent: rgba(0, 0, 0, .6); --background-colors-tooltip: #000000; --background-colors-popover: #0f0f0f;
102 --background-colors-canvas-back-layer: #262626; --control-colors-border-default: #3b3b3b; --control-colors-border-action: #3b3b3b; --control-colors-border-active: #3b3b3b; --control-colors-border-active-action: #3b3b3b; --control-colors-button-background-default: #000000; --control-colors-button-background-action: #212121; --control-colors-button-background-active: #2a2a2a; --control-colors-button-background-active-action: #212121; --control-colors-caret-default: #ff47ff; --control-colors-caret-action: #ff47ff; --control-colors-caret-active: #ff47ff; --control-colors-caret-active-action: #ff47ff; --control-colors-end-icon-default: #b3b3b3; --control-colors-end-icon-action: #cccccc; --control-colors-end-icon-active: #ffffff; --control-colors-end-icon-active-action: #cccccc; --control-colors-field-background-default: #000000; --control-colors-field-background-action: #212121; --control-colors-field-background-active: #2a2a2a; --control-colors-field-background-active-action: #212121; --control-colors-placeholder-default: #7a7a7a; --control-colors-placeholder-action: #7a7a7a; --control-colors-placeholder-active: #7a7a7a; --control-colors-placeholder-active-action: #7a7a7a; --control-colors-slider-thumb-default: #ffffff; --control-colors-slider-thumb-action: #f1f1f1; --control-colors-slider-thumb-active: #ffffff; --control-colors-slider-thumb-active-action: #f1f1f1; --control-colors-slider-track-default: #FF47FF; --control-colors-slider-track-action: #FF47FF; --control-colors-slider-track-active: #FF47FF; --control-colors-slider-track-active-action: #FF47FF; --control-colors-start-icon-default: #b3b3b3; --control-colors-start-icon-action: #cccccc; --control-colors-start-icon-active: #ffffff; --control-colors-start-icon-active-action: #cccccc; --control-colors-text-default: #b3b3b3; --control-colors-text-action: #cccccc; --control-colors-text-active: #ffffff; --control-colors-text-active-action: #cccccc; --control-colors-value-default: #b3b3b3; --control-colors-value-action: #cccccc; --control-colors-value-active: #ffffff; --control-colors-value-active-action: #cccccc; --text-colors-base: #ffffff; --text-colors-tint-1: #b3b3b3; --text-colors-tint-2: #808080; --text-colors-tint-3: #7d7d7d; --error-colors-base-default: #F8495A; --error-colors-base-action: #FC6574; --error-colors-base-active: #F8495A; --error-colors-base-active-action: #FC6574; --error-colors-text-default: #000000; --error-colors-text-action: #000000; --error-colors-text-active: #000000; --error-colors-text-active-action: #000000; --information-colors-base-default: #42c6ff; --information-colors-base-action: #7fd6fc; --information-colors-base-active: #42c6ff; --information-colors-base-active-action: #7fd6fc; --information-colors-text-default: #000000; --information-colors-text-action: #000000; --information-colors-text-active: #000000; --information-colors-text-active-action: #000000; --success-colors-base-default: #00E099; --success-colors-base-action: #4CE1B2; --success-colors-base-active: #00E099; --success-colors-base-active-action: #4CE1B2; --success-colors-text-default: #000000; --success-colors-text-action: #000000; --success-colors-text-active: #000000; --success-colors-text-active-action: #000000; --warning-colors-base-default: #FF9D00; --warning-colors-base-action: #FFBE55; --warning-colors-base-active: #FF9D00; --warning-colors-base-active-action: #FFBE55; --warning-colors-text-default: #000000; --warning-colors-text-action: #000000; --warning-colors-text-active: #000000; --warning-colors-text-active-action: #000000; --negative-colors-base-default: #ffffff; --negative-colors-base-action: #b4b4b4; --negative-colors-base-active: #ffffff; --negative-colors-base-active-action: #b4b4b4; --negative-colors-text-default: #000000; --negative-colors-text-action: #000000; --negative-colors-text-active: #000000; --negative-colors-text-active-action: #000000; --neutral-colors-base-default: #2f2f2f; --neutral-colors-base-action: #080808; --neutral-colors-base-active: #2f2f2f; --neutral-colors-base-active-action: #080808; --neutral-colors-text-default: #ffffff; --neutral-colors-text-action: #ffffff; --neutral-colors-text-active: #ffffff; --neutral-colors-text-active-action: #ffffff; --positive-colors-base-default: #000000; --positive-colors-base-action: #787878; --positive-colors-base-active: #000000; --positive-colors-base-active-action: #787878; --positive-colors-text-default: #ffffff; --positive-colors-text-action: #ffffff; --positive-colors-text-active: #ffffff; --positive-colors-text-active-action: #ffffff; --primary-colors-base-default: #ff47ff; --primary-colors-base-action: #e636e6; --primary-colors-base-active: #ff47ff; --primary-colors-base-active-action: #e636e6; --primary-colors-text-default: #000000; --primary-colors-text-action: #000000; --primary-colors-text-active: #000000; --primary-colors-text-active-action: #000000; --primary-colors-alpha-10: rgba(255, 71, 255, .1019607843); --primary-colors-alpha-20: rgba(255, 71, 255, .2); --primary-colors-alpha-50: rgba(255, 71, 255, .5019607843); --primary-colors-alpha-80: rgba(255, 71, 255, .8); --transformer-colors-base-default: #3b8ce2; --transformer-colors-base-action: #3b8ce2; --transformer-colors-base-active: #3b8ce2; --transformer-colors-base-active-action: #3b8ce2; --transformer-colors-text-default: #ffffff; --transformer-colors-text-action: #ffffff; --transformer-colors-text-active: #ffffff; --transformer-colors-text-active-action: #ffffff; --monetization-plus-colors-base-default: #e982f4; --monetization-plus-colors-base-action: #e156f0; --monetization-plus-colors-base-active: #e982f4; --monetization-plus-colors-base-active-action: #e156f0; --monetization-plus-colors-text-default: #000000; --monetization-plus-colors-text-action: #000000; --monetization-plus-colors-text-active: #000000; --monetization-plus-colors-text-active-action: #000000; --monetization-plus-colors-alpha-10: rgba(233, 130, 244, .1019607843); --monetization-plus-colors-alpha-20: rgba(233, 130, 244, .2); --monetization-plus-colors-alpha-50: rgba(233, 130, 244, .5019607843); --monetization-plus-colors-alpha-80: rgba(233, 130, 244, .8); --monetization-pro-colors-base-default: #bd99f8; --monetization-pro-colors-base-action: #8168a9; --monetization-pro-colors-base-active: #bd99f8; --monetization-pro-colors-base-active-action: #8168a9; --monetization-pro-colors-text-default: #000000; --monetization-pro-colors-text-action: #000000; --monetization-pro-colors-text-active: #000000; --monetization-pro-colors-text-active-action: #000000; --monetization-pro-colors-alpha-10: rgba(189, 153, 248, .1019607843); --monetization-pro-colors-alpha-20: rgba(189, 153, 248, .2); --monetization-pro-colors-alpha-50: rgba(189, 153, 248, .5019607843); --monetization-pro-colors-alpha-80: rgba(189, 153, 248, .8); --monetization-ultra-colors-base-default: #158380; --monetization-ultra-colors-base-action: #0e5957; --monetization-ultra-colors-base-active: #158380; --monetization-ultra-colors-base-active-action: #0e5957; --monetization-ultra-colors-text-default: #ffffff; --monetization-ultra-colors-text-action: #ffffff; --monetization-ultra-colors-text-active: #ffffff; --monetization-ultra-colors-text-active-action: #ffffff; --monetization-ultra-colors-alpha-10: rgba(21, 131, 128, .1019607843); --monetization-ultra-colors-alpha-20: rgba(21, 131, 128, .2); --monetization-ultra-colors-alpha-50: rgba(21, 131, 128, .5019607843); --monetization-ultra-colors-alpha-80: rgba(21, 131, 128, .8); --gradients-general-brand: linear-gradient(225deg, #00ffed 0%, #19d7e7 22.96%, #7f4ad9 45.31%, #af1fc6 66.73%, #df02c0 100%); --gradients-general-primary: linear-gradient(270deg, #f749f6 0%, #c209c1 100%); --gradients-status-info: linear-gradient(270deg, #6fd4ff 0%, #22afec 100%); --gradients-status-success: linear-gradient(270.09deg, #33f3b6 -1.08%, #05d08f 99.92%); --gradients-status-warning: linear-gradient(270deg, #ffcc63 0%, #ff921e 100%); --gradients-status-error: linear-gradient(270deg, #ff6170 0%, #ee3446 100%); --gradients-monetization-plus: linear-gradient(270deg, #ef5eff 0%, #d41ee8 100%); --gradients-monetization-pro: linear-gradient(270deg, #b78aff 0%, #904cff 100%); --gradients-monetization-ultra: linear-gradient(270deg, #24c7c2 0%, #009994 100%); --gradients-background-up: linear-gradient(360deg, #121212 0%, transparent 100%); --gradients-background-down: linear-gradient(180deg, #121212 0%, transparent 100%); --gradients-background-left: linear-gradient(90deg, #121212 0%, transparent 100%); --gradients-background-right: linear-gradient(270deg, #121212 0%, transparent 100%); --apple-colors-base-default: #000000; --apple-colors-base-action: #1a1a1a; --apple-colors-base-active: #000000; --apple-colors-base-active-action: #1a1a1a; --apple-colors-text-default: #ffffff; --apple-colors-text-action: #ffffff; --apple-colors-text-active: #ffffff; --apple-colors-text-active-action: #ffffff; --facebook-colors-base-default: #0766ff; --facebook-colors-base-action: #0050d1; --facebook-colors-base-active: #0766ff; --facebook-colors-base-active-action: #0050d1; --facebook-colors-text-default: #ffffff; --facebook-colors-text-action: #ffffff; --facebook-colors-text-active: #ffffff; --facebook-colors-text-active-action: #ffffff; --google-colors-base-default: #f2f2f2; --google-colors-base-action: #c2c2c2; --google-colors-base-active: #f2f2f2; --google-colors-base-active-action: #c2c2c2; --google-colors-text-default: #1f1f1f;
102 --google-colors-text-action: #1f1f1f; --google-colors-text-active: #1f1f1f; --google-colors-text-active-action: #1f1f1f; --kakao-colors-base-default: #fee500; --kakao-colors-base-action: #ebd402; --kakao-colors-base-active: #fee500; --kakao-colors-base-active-action: #ebd402; --kakao-colors-text-default: #262200; --kakao-colors-text-action: #262200; --kakao-colors-text-active: #262200; --kakao-colors-text-active-action: #262200; --line-colors-base-default: #06c755; --line-colors-base-action: #1fcd66; --line-colors-base-active: #048b3c; --line-colors-base-active-action: #06c755; --line-colors-text-default: #ffffff; --line-colors-text-action: #ffffff; --line-colors-text-active: #ffffff; --line-colors-text-active-action: #ffffff; --snapchat-colors-base-default: #fffc00; --snapchat-colors-base-action: #ece801; --snapchat-colors-base-active: #fffc00; --snapchat-colors-base-active-action: #ece801; --snapchat-colors-text-default: #000000; --snapchat-colors-text-action: #000000; --snapchat-colors-text-active: #000000; --snapchat-colors-text-active-action: #000000; --christmas-green-colors-base-default: #13a745; --christmas-green-colors-base-action: #12942a; --christmas-green-colors-base-active: #13a745; --christmas-green-colors-base-active-action: #12942a; --christmas-green-colors-text-default: #000000; --christmas-green-colors-text-action: #000000; --christmas-green-colors-text-active: #000000; --christmas-green-colors-text-active-action: #000000; --christmas-red-colors-base-default: #ff3f53; --christmas-red-colors-base-action: #e02639; --christmas-red-colors-base-active: #ff3f53; --christmas-red-colors-base-active-action: #e02639; --christmas-red-colors-text-default: #000000; --christmas-red-colors-text-action: #000000; --christmas-red-colors-text-active: #000000; --christmas-red-colors-text-active-action: #000000; --effects-alpha-20: color-mix(in srgb, #000000 20%, transparent); --effects-alpha-50: color-mix(in srgb, #000000 50%, transparent); --effects-alpha-80: color-mix(in srgb, #000000 80%, transparent); --effects-vignette: radial-gradient(44.71% 44.71% at 50.14% 50.12%, rgba(243, 10, 242, .484) 0%, rgba(243, 10, 242, .33) 32%, rgba(243, 10, 242, .187) 56%, rgba(243, 10, 242, .088) 76%, rgba(243, 10, 242, .022) 91%, rgba(243, 10, 242, 0) 100%); --effects-glassy-tint: rgba(0, 0, 0, .64); --effects-glassy-highlight: rgb(43, 43, 43); --effects-glassy-highlight-top: rgb(102, 96, 96); --effects-glassy-highlight-border: var(--background-colors-tint-3); --effects-glassy-inner-shadow: inset 0px 1px 0 rgb(116 107 107 / 18%), inset 0 -1px 0 rgb(110 63 63 / 10%), inset 0px 0px 19px 12px rgb(0 0 0 / 29%); --effects-glassy-blur-radius: 8px; --effects-glassy-border-width: 1px; --effects-glassy-backdrop: blur(var(--effects-glassy-blur-radius)); --effects-glassy-edge-top: linear-gradient(90deg, transparent, var(--effects-glassy-highlight-top), transparent); --effects-glassy-edge-side: linear-gradient(180deg, var(--effects-glassy-highlight), transparent, var(--effects-glassy-highlight)); --effects-glassy-shadow: 0px 8px 32px 0px rgba(0, 0, 0, .12); --effects-blurred-radius: 32px; --effects-blurred: blur(var(--effects-blurred-radius)); --shadows-tint-1: 0px 2px 12px 0px rgba(0, 0, 0, .5), 0px 1px 4px 0px rgba(0, 0, 0, .35); --shadows-tint-2: 0px 6px 24px 0px rgba(0, 0, 0, .6), 0px 3px 10px 0px rgba(0, 0, 0, .4); --shadows-tint-3: 0px 20px 60px 0px rgba(0, 0, 0, .75), 0px 8px 28px 0px rgba(0, 0, 0, .55); }
103  @media (prefers-reduced-transparency: reduce) {
104  html.dark { --effects-glassy-tint: var(--background-colors-base); --effects-glassy-backdrop: none; --effects-glassy-edge-top: none; --effects-glassy-edge-side: none; --effects-blurred: none; }
105}
106}
107@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
108@layer ds-atoms {
109  .button { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; max-width: 100%; transition-property: background-color, border, color; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); }
110  .button--large { height: 40px; padding-block: var(--spacings-s10); padding-inline: var(--spacings-s10); border-radius: var(--corner-radius-r20); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
111  .button--small { height: 32px; padding-block: var(--spacings-s6); padding-inline: var(--spacings-s6); border-radius: var(--corner-radius-r16); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
112  .button--outline { border-style: solid; border-width: 1px; }
113  .button--outline.button--small { border-width: 1px; }
114  .button--no-border { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
115  .button--center-icon { padding: 0px; font-size: 0px; border-radius: var(--corner-radius-circle); }
116  .button--center-icon.button--large:not(.button--center-icon-full-width) { width: 40px; min-width: 40px; }
117  .button--center-icon.button--small:not(.button--center-icon-full-width) { width: 32px; min-width: 32px; }
118  .button--center-icon-full-width.button--large { border-radius: var(--corner-radius-r20); }
119  .button--center-icon-full-width.button--small { border-radius: var(--corner-radius-r16); }
120  .button--full-width { width: 100%; }
121  .button--skin-primary.button--default-state { background-color: var(--primary-colors-base-default); color: var(--primary-colors-text-default); }
122  .button--skin-primary.button--interactive:hover, .button--skin-primary.button--interactive:active { background-color: var(--primary-colors-base-action); color: var(--primary-colors-text-action); }
123  .button--skin-primary.button--active-state { background-color: var(--primary-colors-base-active); color: var(--primary-colors-text-active); }
124  .button--skin-primary.button--active-interactive:hover, .button--skin-primary.button--active-interactive:active { background-color: var(--primary-colors-base-active-action); color: var(--primary-colors-text-action); }
125  .button--skin-primary.button--loading .button__loading-icon { color: var(--primary-colors-text-default); }
126  .button--skin-primary.button--outline.button--default-state { background-color: transparent; border-color: var(--primary-colors-base-default); color: var(--primary-colors-base-default); }
127  .button--skin-primary.button--outline.button--interactive:hover, .button--skin-primary.button--outline.button--interactive:active { background-color: transparent; border-color: var(--primary-colors-base-action); color: var(--primary-colors-base-action); }
128  .button--skin-primary.button--outline.button--active-state { background-color: transparent; border-color: var(--primary-colors-base-active); color: var(--primary-colors-base-active); }
129  .button--skin-primary.button--outline.button--active-interactive:hover, .button--skin-primary.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--primary-colors-base-active-action); color: var(--primary-colors-base-active-action); }
130  .button--skin-primary.button--outline.button--loading .button__loading-icon { color: var(--primary-colors-base-default); }
131  .button--skin-primary.button--text.button--default-state { background-color: transparent; color: var(--primary-colors-base-default); }
132  .button--skin-primary.button--text.button--interactive:hover, .button--skin-primary.button--text.button--interactive:active { background-color: transparent; color: var(--primary-colors-base-action); }
133  .button--skin-primary.button--text.button--active-state { background-color: transparent; color: var(--primary-colors-base-active); }
134  .button--skin-primary.button--text.button--active-interactive:hover, .button--skin-primary.button--text.button--active-interactive:active { background-color: transparent; color: var(--primary-colors-base-active-action); }
135  .button--skin-primary.button--text.button--loading .button__loading-icon { color: var(--primary-colors-base-default); }
136  .button--skin-neutral.button--default-state { background-color: var(--neutral-colors-base-default); color: var(--neutral-colors-text-default); }
137  .button--skin-neutral.button--interactive:hover, .button--skin-neutral.button--interactive:active { background-color: var(--neutral-colors-base-action); color: var(--neutral-colors-text-action); }
138  .button--skin-neutral.button--active-state { background-color: var(--neutral-colors-base-active); color: var(--neutral-colors-text-active); }
139  .button--skin-neutral.button--active-interactive:hover, .button--skin-neutral.button--active-interactive:active { background-color: var(--neutral-colors-base-active-action); color: var(--neutral-colors-text-action); }
140  .button--skin-neutral.button--loading .button__loading-icon { color: var(--neutral-colors-text-default); }
141  .button--skin-neutral.button--outline.button--default-state { background-color: transparent; border-color: var(--neutral-colors-base-default); color: var(--neutral-colors-base-default); }
142  .button--skin-neutral.button--outline.button--interactive:hover, .button--skin-neutral.button--outline.button--interactive:active { background-color: transparent; border-color: var(--neutral-colors-base-action); color: var(--neutral-colors-base-action); }
143  .button--skin-neutral.button--outline.button--active-state { background-color: transparent; border-color: var(--neutral-colors-base-active); color: var(--neutral-colors-base-active); }
144  .button--skin-neutral.button--outline.button--active-interactive:hover, .button--skin-neutral.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--neutral-colors-base-active-action); color: var(--neutral-colors-base-active-action); }
145  .button--skin-neutral.button--outline.button--loading .button__loading-icon { color: var(--neutral-colors-base-default); }
146  .button--skin-neutral.button--text.button--default-state { background-color: transparent; color: var(--neutral-colors-base-default); }
147  .button--skin-neutral.button--text.button--interactive:hover, .button--skin-neutral.button--text.button--interactive:active { background-color: transparent; color: var(--neutral-colors-base-action); }
148  .button--skin-neutral.button--text.button--active-state { background-color: transparent; color: var(--neutral-colors-base-active); }
149  .button--skin-neutral.button--text.button--active-interactive:hover, .button--skin-neutral.button--text.button--active-interactive:active { background-color: transparent; color: var(--neutral-colors-base-active-action); }
150  .button--skin-neutral.button--text.button--loading .button__loading-icon { color: var(--neutral-colors-base-default); }
151  .button--skin-plus.button--default-state { background-color: var(--monetization-plus-colors-base-default); color: var(--monetization-plus-colors-text-default); }
152  .button--skin-plus.button--interactive:hover, .button--skin-plus.button--interactive:active { background-color: var(--monetization-plus-colors-base-action); color: var(--monetization-plus-colors-text-action); }
153  .button--skin-plus.button--active-state { background-color: var(--monetization-plus-colors-base-active); color: var(--monetization-plus-colors-text-active); }
154  .button--skin-plus.button--active-interactive:hover, .button--skin-plus.button--active-interactive:active { background-color: var(--monetization-plus-colors-base-active-action); color: var(--monetization-plus-colors-text-action); }
155  .button--skin-plus.button--loading .button__loading-icon { color: var(--monetization-plus-colors-text-default); }
156  .button--skin-plus.button--outline.button--default-state { background-color: transparent; border-color: var(--monetization-plus-colors-base-default); color: var(--monetization-plus-colors-base-default); }
157  .button--skin-plus.button--outline.button--interactive:hover, .button--skin-plus.button--outline.button--interactive:active { background-color: transparent; border-color: var(--monetization-plus-colors-base-action); color: var(--monetization-plus-colors-base-action); }
158  .button--skin-plus.button--outline.button--active-state { background-color: transparent; border-color: var(--monetization-plus-colors-base-active); color: var(--monetization-plus-colors-base-active); }
159  .button--skin-plus.button--outline.button--active-interactive:hover, .button--skin-plus.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--monetization-plus-colors-base-active-action); color: var(--monetization-plus-colors-base-active-action); }
160  .button--skin-plus.button--outline.button--loading .button__loading-icon { color: var(--monetization-plus-colors-base-default); }
161  .button--skin-plus.button--text.button--default-state { background-color: transparent; color: var(--monetization-plus-colors-base-default); }
162  .button--skin-plus.button--text.button--interactive:hover, .button--skin-plus.button--text.button--interactive:active { background-color: transparent; color: var(--monetization-plus-colors-base-action); }
163  .button--skin-plus.button--text.button--active-state { background-color: transparent; color: var(--monetization-plus-colors-base-active); }
164  .button--skin-plus.button--text.button--active-interactive:hover, .button--skin-plus.button--text.button--active-interactive:active { background-color: transparent; color: var(--monetization-plus-colors-base-active-action); }
165  .button--skin-plus.button--text.button--loading .button__loading-icon { color: var(--monetization-plus-colors-base-default); }
166  .button--skin-pro.button--default-state { background-color: var(--monetization-pro-colors-base-default); color: var(--monetization-pro-colors-text-default); }
167  .button--skin-pro.button--interactive:hover, .button--skin-pro.button--interactive:active { background-color: var(--monetization-pro-colors-base-action); color: var(--monetization-pro-colors-text-action); }
168  .button--skin-pro.button--active-state { background-color: var(--monetization-pro-colors-base-active); color: var(--monetization-pro-colors-text-active); }
169  .button--skin-pro.button--active-interactive:hover, .button--skin-pro.button--active-interactive:active { background-color: var(--monetization-pro-colors-base-active-action); color: var(--monetization-pro-colors-text-action); }
170  .button--skin-pro.button--loading .button__loading-icon { color: var(--monetization-pro-colors-text-default); }
171  .button--skin-pro.button--outline.button--default-state { background-color: transparent; border-color: var(--monetization-pro-colors-base-default); color: var(--monetization-pro-colors-base-default); }
172  .button--skin-pro.button--outline.button--interactive:hover, .button--skin-pro.button--outline.button--interactive:active { background-color: transparent; border-color: var(--monetization-pro-colors-base-action); color: var(--monetization-pro-colors-base-action); }
173  .button--skin-pro.button--outline.button--active-state { background-color: transparent; border-color: var(--monetization-pro-colors-base-active); color: var(--monetization-pro-colors-base-active); }
174  .button--skin-pro.button--outline.button--active-interactive:hover, .button--skin-pro.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--monetization-pro-colors-base-active-action); color: var(--monetization-pro-colors-base-active-action); }
175  .button--skin-pro.button--outline.button--loading .button__loading-icon { color: var(--monetization-pro-colors-base-default); }
176  .button--skin-pro.button--text.button--default-state { background-color: transparent; color: var(--monetization-pro-colors-base-default); }
177  .button--skin-pro.button--text.button--interactive:hover, .button--skin-pro.button--text.button--interactive:active { background-color: transparent; color: var(--monetization-pro-colors-base-action); }
178  .button--skin-pro.button--text.button--active-state { background-color: transparent; color: var(--monetization-pro-colors-base-active); }
179  .button--skin-pro.button--text.button--active-interactive:hover, .button--skin-pro.button--text.button--active-interactive:active { background-color: transparent; color: var(--monetization-pro-colors-base-active-action); }
180  .button--skin-pro.button-
180-text.button--loading .button__loading-icon { color: var(--monetization-pro-colors-base-default); }
181  .button--skin-ultra.button--default-state { background-color: var(--monetization-ultra-colors-base-default); color: var(--monetization-ultra-colors-text-default); }
182  .button--skin-ultra.button--interactive:hover, .button--skin-ultra.button--interactive:active { background-color: var(--monetization-ultra-colors-base-action); color: var(--monetization-ultra-colors-text-action); }
183  .button--skin-ultra.button--active-state { background-color: var(--monetization-ultra-colors-base-active); color: var(--monetization-ultra-colors-text-active); }
184  .button--skin-ultra.button--active-interactive:hover, .button--skin-ultra.button--active-interactive:active { background-color: var(--monetization-ultra-colors-base-active-action); color: var(--monetization-ultra-colors-text-action); }
185  .button--skin-ultra.button--loading .button__loading-icon { color: var(--monetization-ultra-colors-text-default); }
186  .button--skin-ultra.button--outline.button--default-state { background-color: transparent; border-color: var(--monetization-ultra-colors-base-default); color: var(--monetization-ultra-colors-base-default); }
187  .button--skin-ultra.button--outline.button--interactive:hover, .button--skin-ultra.button--outline.button--interactive:active { background-color: transparent; border-color: var(--monetization-ultra-colors-base-action); color: var(--monetization-ultra-colors-base-action); }
188  .button--skin-ultra.button--outline.button--active-state { background-color: transparent; border-color: var(--monetization-ultra-colors-base-active); color: var(--monetization-ultra-colors-base-active); }
189  .button--skin-ultra.button--outline.button--active-interactive:hover, .button--skin-ultra.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--monetization-ultra-colors-base-active-action); color: var(--monetization-ultra-colors-base-active-action); }
190  .button--skin-ultra.button--outline.button--loading .button__loading-icon { color: var(--monetization-ultra-colors-base-default); }
191  .button--skin-ultra.button--text.button--default-state { background-color: transparent; color: var(--monetization-ultra-colors-base-default); }
192  .button--skin-ultra.button--text.button--interactive:hover, .button--skin-ultra.button--text.button--interactive:active { background-color: transparent; color: var(--monetization-ultra-colors-base-action); }
193  .button--skin-ultra.button--text.button--active-state { background-color: transparent; color: var(--monetization-ultra-colors-base-active); }
194  .button--skin-ultra.button--text.button--active-interactive:hover, .button--skin-ultra.button--text.button--active-interactive:active { background-color: transparent; color: var(--monetization-ultra-colors-base-active-action); }
195  .button--skin-ultra.button--text.button--loading .button__loading-icon { color: var(--monetization-ultra-colors-base-default); }
196  .button--skin-success.button--default-state { background-color: var(--success-colors-base-default); color: var(--success-colors-text-default); }
197  .button--skin-success.button--interactive:hover, .button--skin-success.button--interactive:active { background-color: var(--success-colors-base-action); color: var(--success-colors-text-action); }
198  .button--skin-success.button--active-state { background-color: var(--success-colors-base-active); color: var(--success-colors-text-active); }
199  .button--skin-success.button--active-interactive:hover, .button--skin-success.button--active-interactive:active { background-color: var(--success-colors-base-active-action); color: var(--success-colors-text-action); }
200  .button--skin-success.button--loading .button__loading-icon { color: var(--success-colors-text-default); }
201  .button--skin-success.button--outline.button--default-state { background-color: transparent; border-color: var(--success-colors-base-default); color: var(--success-colors-base-default); }
202  .button--skin-success.button--outline.button--interactive:hover, .button--skin-success.button--outline.button--interactive:active { background-color: transparent; border-color: var(--success-colors-base-action); color: var(--success-colors-base-action); }
203  .button--skin-success.button--outline.button--active-state { background-color: transparent; border-color: var(--success-colors-base-active); color: var(--success-colors-base-active); }
204  .button--skin-success.button--outline.button--active-interactive:hover, .button--skin-success.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--success-colors-base-active-action); color: var(--success-colors-base-active-action); }
205  .button--skin-success.button--outline.button--loading .button__loading-icon { color: var(--success-colors-base-default); }
206  .button--skin-success.button--text.button--default-state { background-color: transparent; color: var(--success-colors-base-default); }
207  .button--skin-success.button--text.button--interactive:hover, .button--skin-success.button--text.button--interactive:active { background-color: transparent; color: var(--success-colors-base-action); }
208  .button--skin-success.button--text.button--active-state { background-color: transparent; color: var(--success-colors-base-active); }
209  .button--skin-success.button--text.button--active-interactive:hover, .button--skin-success.button--text.button--active-interactive:active { background-color: transparent; color: var(--success-colors-base-active-action); }
210  .button--skin-success.button--text.button--loading .button__loading-icon { color: var(--success-colors-base-default); }
211  .button--skin-warning.button--default-state { background-color: var(--warning-colors-base-default); color: var(--warning-colors-text-default); }
212  .button--skin-warning.button--interactive:hover, .button--skin-warning.button--interactive:active { background-color: var(--warning-colors-base-action); color: var(--warning-colors-text-action); }
213  .button--skin-warning.button--active-state { background-color: var(--warning-colors-base-active); color: var(--warning-colors-text-active); }
214  .button--skin-warning.button--active-interactive:hover, .button--skin-warning.button--active-interactive:active { background-color: var(--warning-colors-base-active-action); color: var(--warning-colors-text-action); }
215  .button--skin-warning.button--loading .button__loading-icon { color: var(--warning-colors-text-default); }
216  .button--skin-warning.button--outline.button--default-state { background-color: transparent; border-color: var(--warning-colors-base-default); color: var(--warning-colors-base-default); }
217  .button--skin-warning.button--outline.button--interactive:hover, .button--skin-warning.button--outline.button--interactive:active { background-color: transparent; border-color: var(--warning-colors-base-action); color: var(--warning-colors-base-action); }
218  .button--skin-warning.button--outline.button--active-state { background-color: transparent; border-color: var(--warning-colors-base-active); color: var(--warning-colors-base-active); }
219  .button--skin-warning.button--outline.button--active-interactive:hover, .button--skin-warning.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--warning-colors-base-active-action); color: var(--warning-colors-base-active-action); }
220  .button--skin-warning.button--outline.button--loading .button__loading-icon { color: var(--warning-colors-base-default); }
221  .button--skin-warning.button--text.button--default-state { background-color: transparent; color: var(--warning-colors-base-default); }
222  .button--skin-warning.button--text.button--interactive:hover, .button--skin-warning.button--text.button--interactive:active { background-color: transparent; color: var(--warning-colors-base-action); }
223  .button--skin-warning.button--text.button--active-state { background-color: transparent; color: var(--warning-colors-base-active); }
224  .button--skin-warning.button--text.button--active-interactive:hover, .button--skin-warning.button--text.button--active-interactive:active { background-color: transparent; color: var(--warning-colors-base-active-action); }
225  .button--skin-warning.button--text.button--loading .button__loading-icon { color: var(--warning-colors-base-default); }
226  .button--skin-error.button--default-state { background-color: var(--error-colors-base-default); color: var(--error-colors-text-default); }
227  .button--skin-error.button--interactive:hover, .button--skin-error.button--interactive:active { background-color: var(--error-colors-base-action); color: var(--error-colors-text-action); }
228  .button--skin-error.button--active-state { background-color: var(--error-colors-base-active); color: var(--error-colors-text-active); }
229  .button--skin-error.button--active-interactive:hover, .button--skin-error.button--active-interactive:active { background-color: var(--error-colors-base-active-action); color: var(--error-colors-text-action); }
230  .button--skin-error.button--loading .button__loading-icon { color: var(--error-colors-text-default); }
231  .button--skin-error.button--outline.button--default-state { background-color: transparent; border-color: var(--error-colors-base-default); color: var(--error-colors-base-default); }
232  .button--skin-error.button--outline.button--interactive:hover, .button--skin-error.button--outline.button--interactive:active { background-color: transparent; border-color: var(--error-colors-base-action); color: var(--error-colors-base-action); }
233  .button--skin-error.button--outline.button--active-state { background-color: transparent; border-color: var(--error-colors-base-active); color: var(--error-colors-base-active); }
234  .button--skin-error.button--outline.button--active-interactive:hover, .button--skin-error.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--error-colors-base-active-action); color: var(--error-colors-base-active-action); }
235  .button--skin-error.button--outline.button--loading .button__loading-icon { color: var(--error-colors-base-default); }
236  .button--skin-error.button--text.button--default-state { background-color: transparent; color: var(--error-colors-base-default); }
237  .button--skin-error.button--text.button--interactive:hover, .button--skin-error.button--text.button--interactive:active { background-color: transparent; color: var(--error-colors-base-action); }
238  .button--skin-error.button--text.button--active-state { background-color: transparent; color: var(--error-colors-base-active); }
239  .button--skin-error.button--text.button--active-interactive:hover, .button--skin-error.button--text.button--active-interactive:active { background-color: transparent; color: var(--error-colors-base-active-action); }
240  .button--skin-error.button--text.button--loading .button__loading-icon { color: var(--error-colors-base-default); }
241  .button--skin-information.button--default-state { background-color: var(--information-colors-base-default); color: var(--information-colors-text-default); }
242  .button--skin-information.button--interactive:hover, .button--skin-information.button--interactive:active { background-color: var(--information-colors-base-action); color: var(--information-colors-text-action); }
243  .button--skin-information.button--active-state { background-color: var(--information-colors-base-active); color: var(--information-colors-text-active); }
244  .button--skin-information.button--active-interactive:hover, .button--skin-information.button--active-interactive:active { background-color: var(--information-colors-base-active-action); color: var(--information-colors-text-action); }
245  .button--skin-information.button--loading .button__loading-icon { color: var(--information-colors-text-default); }
246  .button--skin-information.button--outline.button--default-state { background-color: transparent; border-color: var(--information-colors-base-default); color: var(--information-colors-base-default); }
247  .button--skin-information.button--outline.button--interactive:hover, .button--skin-information.button--outline.button--interactive:active { background-color: transparent; border-color: var(--information-colors-base-action); color: var(--information-colors-base-action); }
248  .button--skin-information.button--outline.button--active-state { background-color: transparent; border-color: var(--information-colors-base-active); color: var(--information-colors-base-active); }
249  .button--skin-information.button--outline.button--active-interactive:hover, .button--skin-information.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--information-colors-base-active-action); color: var(--information-colors-base-active-action); }
250  .button--skin-information.button--outline.button--loading .button__loading-icon { color: var(--information-colors-base-default); }
251  .button--skin-information.button--text.button--default-state { background-color: transparent; color: var(--information-colors-base-default); }
252  .button--skin-information.button--text.button--interactive:hover, .button--skin-information.button--text.button--interactive:active { background-color: transparent; color: var(--information-colors-base-action); }
253  .button--skin-information.button--text.button--active-state { background-color: transparent; color: var(--information-colors-base-active); }
254  .button--skin-information.button--text.button--active-interactive:hover, .button--skin-information.button--text.button--active-interactive:active { background-color: transparent; color: var(--information-colors-base-active-action); }
255  .button--skin-information.button--text.button--loading .button__loading-icon { color: var(--information-colors-base-default); }
256  .button--skin-positive.button--default-state { background-color: var(--positive-colors-base-default); color: var(--positive-colors-text-default); }
257  .button--skin-positive.button--interactive:hover, .button--skin-positive.button--interactive:active { background-color: var(--positive-colors-base-action); color: var(--positive-colors-text-action); }
258  .button--skin-positive.button--active-state { background-color: var(--positive-colors-base-active); color: var(--positive-colors-text-active); }
259  .button--skin-positive.button--active-interactive:hover, .button--skin-positive.button--active-interactive:active { background-color: var(--positive-colors-base-active-action); color: var(--positive-colors-text-action); }
260  .button--skin-positive.button--loading .button__loading-icon { color: var(--positive-colors-text-default); }
261  .button--skin-positive.button--outline.button--default-state { background-color: transparent; border-color: var(--positive-colors-base-default); color: var(--positive-colors-base-default); }
262  .button--skin-positive.button--outline.button--interactive:hover, .button--skin-positive.button--outline.button--interactive:active { background-color: transparent; border-color: var(--positive-colors-base-action); color: var(--positive-colors-base-action); }
263  .button--skin-positive.button--outline.button--active-state { background-color: transparent; border-color: var(--positive-colors-base-active); color: var(--positive-colors-base-active); }
264  .button--skin-positive.button--outline.button--active-interactive:hover, .button--skin-positive.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--positive-colors-base-active-action); color: var(--positive-colors-base-active-action); }
265  .button--skin-positive.button--outline.button--loading .button__loading-icon { color: var(--positive-colors-base-default); }
266  .button--skin-positive.button--text.button--default-state { background-color: transparent; color: var(--positive-colors-base-default); }
267  .button--skin-positive.button--text.button--interactive:hover, .button--skin-positive.button--text.button--interactive:active { background-color: transparent; color: var(--positive-colors-base-action); }
268  .button--skin-positive.button--text.button--active-state { background-color: transparent; color: var(--positive-colors-base-active); }
269  .button--skin-positive.button--text.button--active-interactive:hover, .button--skin-positive.button--text.button--active-interactive:active { background-color: transparent; c
269olor: var(--positive-colors-base-active-action); }
270  .button--skin-positive.button--text.button--loading .button__loading-icon { color: var(--positive-colors-base-default); }
271  .button--skin-negative.button--default-state { background-color: var(--negative-colors-base-default); color: var(--negative-colors-text-default); }
272  .button--skin-negative.button--interactive:hover, .button--skin-negative.button--interactive:active { background-color: var(--negative-colors-base-action); color: var(--negative-colors-text-action); }
273  .button--skin-negative.button--active-state { background-color: var(--negative-colors-base-active); color: var(--negative-colors-text-active); }
274  .button--skin-negative.button--active-interactive:hover, .button--skin-negative.button--active-interactive:active { background-color: var(--negative-colors-base-active-action); color: var(--negative-colors-text-action); }
275  .button--skin-negative.button--loading .button__loading-icon { color: var(--negative-colors-text-default); }
276  .button--skin-negative.button--outline.button--default-state { background-color: transparent; border-color: var(--negative-colors-base-default); color: var(--negative-colors-base-default); }
277  .button--skin-negative.button--outline.button--interactive:hover, .button--skin-negative.button--outline.button--interactive:active { background-color: transparent; border-color: var(--negative-colors-base-action); color: var(--negative-colors-base-action); }
278  .button--skin-negative.button--outline.button--active-state { background-color: transparent; border-color: var(--negative-colors-base-active); color: var(--negative-colors-base-active); }
279  .button--skin-negative.button--outline.button--active-interactive:hover, .button--skin-negative.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--negative-colors-base-active-action); color: var(--negative-colors-base-active-action); }
280  .button--skin-negative.button--outline.button--loading .button__loading-icon { color: var(--negative-colors-base-default); }
281  .button--skin-negative.button--text.button--default-state { background-color: transparent; color: var(--negative-colors-base-default); }
282  .button--skin-negative.button--text.button--interactive:hover, .button--skin-negative.button--text.button--interactive:active { background-color: transparent; color: var(--negative-colors-base-action); }
283  .button--skin-negative.button--text.button--active-state { background-color: transparent; color: var(--negative-colors-base-active); }
284  .button--skin-negative.button--text.button--active-interactive:hover, .button--skin-negative.button--text.button--active-interactive:active { background-color: transparent; color: var(--negative-colors-base-active-action); }
285  .button--skin-negative.button--text.button--loading .button__loading-icon { color: var(--negative-colors-base-default); }
286  .button--skin-black.button--default-state { background-color: var(--absolute-black-colors-base-default); color: var(--absolute-black-colors-text-default); }
287  .button--skin-black.button--interactive:hover, .button--skin-black.button--interactive:active { background-color: var(--absolute-black-colors-base-action); color: var(--absolute-black-colors-text-action); }
288  .button--skin-black.button--active-state { background-color: var(--absolute-black-colors-base-active); color: var(--absolute-black-colors-text-active); }
289  .button--skin-black.button--active-interactive:hover, .button--skin-black.button--active-interactive:active { background-color: var(--absolute-black-colors-base-active-action); color: var(--absolute-black-colors-text-action); }
290  .button--skin-black.button--loading .button__loading-icon { color: var(--absolute-black-colors-text-default); }
291  .button--skin-black.button--outline.button--default-state { background-color: transparent; border-color: var(--absolute-black-colors-base-default); color: var(--absolute-black-colors-base-default); }
292  .button--skin-black.button--outline.button--interactive:hover, .button--skin-black.button--outline.button--interactive:active { background-color: transparent; border-color: var(--absolute-black-colors-base-action); color: var(--absolute-black-colors-base-action); }
293  .button--skin-black.button--outline.button--active-state { background-color: transparent; border-color: var(--absolute-black-colors-base-active); color: var(--absolute-black-colors-base-active); }
294  .button--skin-black.button--outline.button--active-interactive:hover, .button--skin-black.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--absolute-black-colors-base-active-action); color: var(--absolute-black-colors-base-active-action); }
295  .button--skin-black.button--outline.button--loading .button__loading-icon { color: var(--absolute-black-colors-base-default); }
296  .button--skin-black.button--text.button--default-state { background-color: transparent; color: var(--absolute-black-colors-base-default); }
297  .button--skin-black.button--text.button--interactive:hover, .button--skin-black.button--text.button--interactive:active { background-color: transparent; color: var(--absolute-black-colors-base-action); }
298  .button--skin-black.button--text.button--active-state { background-color: transparent; color: var(--absolute-black-colors-base-active); }
299  .button--skin-black.button--text.button--active-interactive:hover, .button--skin-black.button--text.button--active-interactive:active { background-color: transparent; color: var(--absolute-black-colors-base-active-action); }
300  .button--skin-black.button--text.button--loading .button__loading-icon { color: var(--absolute-black-colors-base-default); }
301  .button--skin-white.button--default-state { background-color: var(--absolute-white-colors-base-default); color: var(--absolute-white-colors-text-default); }
302  .button--skin-white.button--interactive:hover, .button--skin-white.button--interactive:active { background-color: var(--absolute-white-colors-base-action); color: var(--absolute-white-colors-text-action); }
303  .button--skin-white.button--active-state { background-color: var(--absolute-white-colors-base-active); color: var(--absolute-white-colors-text-active); }
304  .button--skin-white.button--active-interactive:hover, .button--skin-white.button--active-interactive:active { background-color: var(--absolute-white-colors-base-active-action); color: var(--absolute-white-colors-text-action); }
305  .button--skin-white.button--loading .button__loading-icon { color: var(--absolute-white-colors-text-default); }
306  .button--skin-white.button--outline.button--default-state { background-color: transparent; border-color: var(--absolute-white-colors-base-default); color: var(--absolute-white-colors-base-default); }
307  .button--skin-white.button--outline.button--interactive:hover, .button--skin-white.button--outline.button--interactive:active { background-color: transparent; border-color: var(--absolute-white-colors-base-action); color: var(--absolute-white-colors-base-action); }
308  .button--skin-white.button--outline.button--active-state { background-color: transparent; border-color: var(--absolute-white-colors-base-active); color: var(--absolute-white-colors-base-active); }
309  .button--skin-white.button--outline.button--active-interactive:hover, .button--skin-white.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--absolute-white-colors-base-active-action); color: var(--absolute-white-colors-base-active-action); }
310  .button--skin-white.button--outline.button--loading .button__loading-icon { color: var(--absolute-white-colors-base-default); }
311  .button--skin-white.button--text.button--default-state { background-color: transparent; color: var(--absolute-white-colors-base-default); }
312  .button--skin-white.button--text.button--interactive:hover, .button--skin-white.button--text.button--interactive:active { background-color: transparent; color: var(--absolute-white-colors-base-action); }
313  .button--skin-white.button--text.button--active-state { background-color: transparent; color: var(--absolute-white-colors-base-active); }
314  .button--skin-white.button--text.button--active-interactive:hover, .button--skin-white.button--text.button--active-interactive:active { background-color: transparent; color: var(--absolute-white-colors-base-active-action); }
315  .button--skin-white.button--text.button--loading .button__loading-icon { color: var(--absolute-white-colors-base-default); }
316  .button--skin-facebook.button--default-state { background-color: var(--facebook-colors-base-default); color: var(--facebook-colors-text-default); }
317  .button--skin-facebook.button--interactive:hover, .button--skin-facebook.button--interactive:active { background-color: var(--facebook-colors-base-action); color: var(--facebook-colors-text-action); }
318  .button--skin-facebook.button--active-state { background-color: var(--facebook-colors-base-active); color: var(--facebook-colors-text-active); }
319  .button--skin-facebook.button--active-interactive:hover, .button--skin-facebook.button--active-interactive:active { background-color: var(--facebook-colors-base-active-action); color: var(--facebook-colors-text-action); }
320  .button--skin-facebook.button--loading .button__loading-icon { color: var(--facebook-colors-text-default); }
321  .button--skin-facebook.button--outline.button--default-state { background-color: transparent; border-color: var(--facebook-colors-base-default); color: var(--facebook-colors-base-default); }
322  .button--skin-facebook.button--outline.button--interactive:hover, .button--skin-facebook.button--outline.button--interactive:active { background-color: transparent; border-color: var(--facebook-colors-base-action); color: var(--facebook-colors-base-action); }
323  .button--skin-facebook.button--outline.button--active-state { background-color: transparent; border-color: var(--facebook-colors-base-active); color: var(--facebook-colors-base-active); }
324  .button--skin-facebook.button--outline.button--active-interactive:hover, .button--skin-facebook.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--facebook-colors-base-active-action); color: var(--facebook-colors-base-active-action); }
325  .button--skin-facebook.button--outline.button--loading .button__loading-icon { color: var(--facebook-colors-base-default); }
326  .button--skin-facebook.button--text.button--default-state { background-color: transparent; color: var(--facebook-colors-base-default); }
327  .button--skin-facebook.button--text.button--interactive:hover, .button--skin-facebook.button--text.button--interactive:active { background-color: transparent; color: var(--facebook-colors-base-action); }
328  .button--skin-facebook.button--text.button--active-state { background-color: transparent; color: var(--facebook-colors-base-active); }
329  .button--skin-facebook.button--text.button--active-interactive:hover, .button--skin-facebook.button--text.button--active-interactive:active { background-color: transparent; color: var(--facebook-colors-base-active-action); }
330  .button--skin-facebook.button--text.button--loading .button__loading-icon { color: var(--facebook-colors-base-default); }
331  .button--skin-google.button--default-state { background-color: var(--google-colors-base-default); color: var(--google-colors-text-default); }
332  .button--skin-google.button--interactive:hover, .button--skin-google.button--interactive:active { background-color: var(--google-colors-base-action); color: var(--google-colors-text-action); }
333  .button--skin-google.button--active-state { background-color: var(--google-colors-base-active); color: var(--google-colors-text-active); }
334  .button--skin-google.button--active-interactive:hover, .button--skin-google.button--active-interactive:active { background-color: var(--google-colors-base-active-action); color: var(--google-colors-text-action); }
335  .button--skin-google.button--loading .button__loading-icon { color: var(--google-colors-text-default); }
336  .button--skin-google.button--outline.button--default-state { background-color: transparent; border-color: var(--google-colors-base-default); color: var(--google-colors-base-default); }
337  .button--skin-google.button--outline.button--interactive:hover, .button--skin-google.button--outline.button--interactive:active { background-color: transparent; border-color: var(--google-colors-base-action); color: var(--google-colors-base-action); }
338  .button--skin-google.button--outline.button--active-state { background-color: transparent; border-color: var(--google-colors-base-active); color: var(--google-colors-base-active); }
339  .button--skin-google.button--outline.button--active-interactive:hover, .button--skin-google.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--google-colors-base-active-action); color: var(--google-colors-base-active-action); }
340  .button--skin-google.button--outline.button--loading .button__loading-icon { color: var(--google-colors-base-default); }
341  .button--skin-google.button--text.button--default-state { background-color: transparent; color: var(--google-colors-base-default); }
342  .button--skin-google.button--text.button--interactive:hover, .button--skin-google.button--text.button--interactive:active { background-color: transparent; color: var(--google-colors-base-action); }
343  .button--skin-google.button--text.button--active-state { background-color: transparent; color: var(--google-colors-base-active); }
344  .button--skin-google.button--text.button--active-interactive:hover, .button--skin-google.button--text.button--active-interactive:active { background-color: transparent; color: var(--google-colors-base-active-action); }
345  .button--skin-google.button--text.button--loading .button__loading-icon { color: var(--google-colors-base-default); }
346  .button--skin-apple.button--default-state { background-color: var(--apple-colors-base-default); color: var(--apple-colors-text-default); }
347  .button--skin-apple.button--interactive:hover, .button--skin-apple.button--interactive:active { background-color: var(--apple-colors-base-action); color: var(--apple-colors-text-action); }
348  .button--skin-apple.button--active-state { background-color: var(--apple-colors-base-active); color: var(--apple-colors-text-active); }
349  .button--skin-apple.button--active-interactive:hover, .button--skin-apple.button--active-interactive:active { background-color: var(--apple-colors-base-active-action); color: var(--apple-colors-text-action); }
350  .button--skin-apple.button--loading .button__loading-icon { color: var(--apple-colors-text-default); }
351  .button--skin-apple.button--outline.button--default-state { background-color: transparent; border-color: var(--apple-colors-base-default); color: var(--apple-colors-base-default); }
352  .button--skin-apple.button--outline.button--interactive:hover, .button--skin-apple.button--outline.button--interactive:active { background-color: transparent; border-color: var(--apple-colors-base-action); color: var(--apple-colors-base-action); }
353  .button--skin-apple.button--outline.button--active-state { background-color: transparent; border-color: var(--apple-colors-base-active); color: var(--apple-colors-base-active); }
354  .button--skin-apple.button--outline.button--active-interactive:hover, .button--skin-apple.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--apple-colors-base-active-action); color: var(--apple-colors-base-active-action); }
355  .button--skin-apple.button--outline.button--loading .button__loading-icon { color: var(--apple-colors-base-default); }
356  .button--skin-apple.button--text.button--default-state { background-color: transparent; color: var(--apple-colors-base-default); }
357  .button--skin-apple.button--text.button--interactive:hover, .button--skin-apple.button--text.button--interactive:active { background-color: transparent; color: var(--apple-colors-base-action); }
358  .button--skin-apple.button--text.button--active-state { background-color: transparent; color: var(--apple-colors-base-active); }
359  .button--skin-apple.button--text.button--active-interactive:hover, .button--skin-apple.button--text.button--active-interactive:active { background-color: transparent; color: var(--apple-colors-base-active-action); }
360  .button--skin-a
360pple.button--text.button--loading .button__loading-icon { color: var(--apple-colors-base-default); }
361  .button--skin-snapchat.button--default-state { background-color: var(--snapchat-colors-base-default); color: var(--snapchat-colors-text-default); }
362  .button--skin-snapchat.button--interactive:hover, .button--skin-snapchat.button--interactive:active { background-color: var(--snapchat-colors-base-action); color: var(--snapchat-colors-text-action); }
363  .button--skin-snapchat.button--active-state { background-color: var(--snapchat-colors-base-active); color: var(--snapchat-colors-text-active); }
364  .button--skin-snapchat.button--active-interactive:hover, .button--skin-snapchat.button--active-interactive:active { background-color: var(--snapchat-colors-base-active-action); color: var(--snapchat-colors-text-action); }
365  .button--skin-snapchat.button--loading .button__loading-icon { color: var(--snapchat-colors-text-default); }
366  .button--skin-snapchat.button--outline.button--default-state { background-color: transparent; border-color: var(--snapchat-colors-base-default); color: var(--snapchat-colors-base-default); }
367  .button--skin-snapchat.button--outline.button--interactive:hover, .button--skin-snapchat.button--outline.button--interactive:active { background-color: transparent; border-color: var(--snapchat-colors-base-action); color: var(--snapchat-colors-base-action); }
368  .button--skin-snapchat.button--outline.button--active-state { background-color: transparent; border-color: var(--snapchat-colors-base-active); color: var(--snapchat-colors-base-active); }
369  .button--skin-snapchat.button--outline.button--active-interactive:hover, .button--skin-snapchat.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--snapchat-colors-base-active-action); color: var(--snapchat-colors-base-active-action); }
370  .button--skin-snapchat.button--outline.button--loading .button__loading-icon { color: var(--snapchat-colors-base-default); }
371  .button--skin-snapchat.button--text.button--default-state { background-color: transparent; color: var(--snapchat-colors-base-default); }
372  .button--skin-snapchat.button--text.button--interactive:hover, .button--skin-snapchat.button--text.button--interactive:active { background-color: transparent; color: var(--snapchat-colors-base-action); }
373  .button--skin-snapchat.button--text.button--active-state { background-color: transparent; color: var(--snapchat-colors-base-active); }
374  .button--skin-snapchat.button--text.button--active-interactive:hover, .button--skin-snapchat.button--text.button--active-interactive:active { background-color: transparent; color: var(--snapchat-colors-base-active-action); }
375  .button--skin-snapchat.button--text.button--loading .button__loading-icon { color: var(--snapchat-colors-base-default); }
376  .button--skin-kakao.button--default-state { background-color: var(--kakao-colors-base-default); color: var(--kakao-colors-text-default); }
377  .button--skin-kakao.button--interactive:hover, .button--skin-kakao.button--interactive:active { background-color: var(--kakao-colors-base-action); color: var(--kakao-colors-text-action); }
378  .button--skin-kakao.button--active-state { background-color: var(--kakao-colors-base-active); color: var(--kakao-colors-text-active); }
379  .button--skin-kakao.button--active-interactive:hover, .button--skin-kakao.button--active-interactive:active { background-color: var(--kakao-colors-base-active-action); color: var(--kakao-colors-text-action); }
380  .button--skin-kakao.button--loading .button__loading-icon { color: var(--kakao-colors-text-default); }
381  .button--skin-kakao.button--outline.button--default-state { background-color: transparent; border-color: var(--kakao-colors-base-default); color: var(--kakao-colors-base-default); }
382  .button--skin-kakao.button--outline.button--interactive:hover, .button--skin-kakao.button--outline.button--interactive:active { background-color: transparent; border-color: var(--kakao-colors-base-action); color: var(--kakao-colors-base-action); }
383  .button--skin-kakao.button--outline.button--active-state { background-color: transparent; border-color: var(--kakao-colors-base-active); color: var(--kakao-colors-base-active); }
384  .button--skin-kakao.button--outline.button--active-interactive:hover, .button--skin-kakao.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--kakao-colors-base-active-action); color: var(--kakao-colors-base-active-action); }
385  .button--skin-kakao.button--outline.button--loading .button__loading-icon { color: var(--kakao-colors-base-default); }
386  .button--skin-kakao.button--text.button--default-state { background-color: transparent; color: var(--kakao-colors-base-default); }
387  .button--skin-kakao.button--text.button--interactive:hover, .button--skin-kakao.button--text.button--interactive:active { background-color: transparent; color: var(--kakao-colors-base-action); }
388  .button--skin-kakao.button--text.button--active-state { background-color: transparent; color: var(--kakao-colors-base-active); }
389  .button--skin-kakao.button--text.button--active-interactive:hover, .button--skin-kakao.button--text.button--active-interactive:active { background-color: transparent; color: var(--kakao-colors-base-active-action); }
390  .button--skin-kakao.button--text.button--loading .button__loading-icon { color: var(--kakao-colors-base-default); }
391  .button--skin-line.button--default-state { background-color: var(--line-colors-base-default); color: var(--line-colors-text-default); }
392  .button--skin-line.button--interactive:hover, .button--skin-line.button--interactive:active { background-color: var(--line-colors-base-action); color: var(--line-colors-text-action); }
393  .button--skin-line.button--active-state { background-color: var(--line-colors-base-active); color: var(--line-colors-text-active); }
394  .button--skin-line.button--active-interactive:hover, .button--skin-line.button--active-interactive:active { background-color: var(--line-colors-base-active-action); color: var(--line-colors-text-action); }
395  .button--skin-line.button--loading .button__loading-icon { color: var(--line-colors-text-default); }
396  .button--skin-line.button--outline.button--default-state { background-color: transparent; border-color: var(--line-colors-base-default); color: var(--line-colors-base-default); }
397  .button--skin-line.button--outline.button--interactive:hover, .button--skin-line.button--outline.button--interactive:active { background-color: transparent; border-color: var(--line-colors-base-action); color: var(--line-colors-base-action); }
398  .button--skin-line.button--outline.button--active-state { background-color: transparent; border-color: var(--line-colors-base-active); color: var(--line-colors-base-active); }
399  .button--skin-line.button--outline.button--active-interactive:hover, .button--skin-line.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--line-colors-base-active-action); color: var(--line-colors-base-active-action); }
400  .button--skin-line.button--outline.button--loading .button__loading-icon { color: var(--line-colors-base-default); }
401  .button--skin-line.button--text.button--default-state { background-color: transparent; color: var(--line-colors-base-default); }
402  .button--skin-line.button--text.button--interactive:hover, .button--skin-line.button--text.button--interactive:active { background-color: transparent; color: var(--line-colors-base-action); }
403  .button--skin-line.button--text.button--active-state { background-color: transparent; color: var(--line-colors-base-active); }
404  .button--skin-line.button--text.button--active-interactive:hover, .button--skin-line.button--text.button--active-interactive:active { background-color: transparent; color: var(--line-colors-base-active-action); }
405  .button--skin-line.button--text.button--loading .button__loading-icon { color: var(--line-colors-base-default); }
406  .button--disabled { opacity: var(--states-disabled); pointer-events: none; }
407  .button--loading { position: relative; color: transparent; pointer-events: none; }
408  .button--cursor-pointer { cursor: pointer; }
409  .button--cursor-default { cursor: default; }
410  .button--cursor-not-allowed { cursor: not-allowed; }
411  .button__icon { display: inline-block; flex: 0 0 20px; width: 20px; height: 20px; }
412  .button--small .button__icon { flex-basis: 20px; width: 20px; height: 20px; }
413  .button__icon > path:not([fill]) { fill: currentcolor; }
414  .button__content { display: flex; align-items: center; min-width: 0px; max-width: 100%; height: 20px; column-gap: var(--spacings-s4); font-family: var(--fonts-gilroy); }
415  .button--small .button__content { height: 20px; column-gap: var(--spacings-s4); }
416  .button__content--hidden { visibility: hidden; }
417  .button__text { min-width: 0px; padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
418  .button--small .button__text { padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
419  .button__credit { display: flex; flex-shrink: 0; align-items: center; column-gap: var(--spacings-s4); padding-inline-end: var(--spacings-s2); }
420  .button--small .button__credit { column-gap: var(--spacings-s4); }
421  .button__credit-icon { flex: 0 0 20px; width: 20px; height: 20px; }
422  .button--small .button__credit-icon { flex-basis: 20px; width: 20px; height: 20px; }
423  .button__credit-icon > path:not([fill]) { fill: currentcolor; }
424  .button__control { display: none; }
425  .button__loading-icon { position: absolute; inset: 0px; margin: auto; pointer-events: none; }
426  @keyframes button-rotate { 
427  100% { transform: rotate(360deg); }
428}
429  .button__loading-icon { animation: button-rotate var(--timings-long) var(--easings-linear) infinite; }
430}
431@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
432@layer ds-atoms {
433  @keyframes toaster-animate-center { 
434  0% { opacity: 0; transform: translate(0px) scale(1); }
435  100% { opacity: var(--final-opacity, 1); }
436}
437  @keyframes toaster-animate-left { 
438  0% { opacity: 0; transform: translate(-20px) scale(1); }
439  100% { opacity: var(--final-opacity, 1); }
440}
441  @keyframes toaster-animate-right { 
442  0% { opacity: 0; transform: translate(20px) scale(1); }
443  100% { opacity: var(--final-opacity, 1); }
444}
445  .toaster { display: flex; flex-direction: column; justify-content: center; gap: var(--spacings-s12); width: 100%; max-width: var(--toaster-width); position: fixed; z-index: var(--toaster-z-index); list-style-type: none; color: var(--text-colors-base); height: max(0px,var(--item-height) + max(0,var(--total) - 1) * 10px); top: var(--toaster-top); bottom: var(--toaster-bottom); left: var(--toaster-left); right: var(--toaster-right); transform: var(--toaster-transform); }
446  .toaster__item { opacity: 0; position: absolute; left: 0px; right: 0px; width: 100%;
446 top: var(--toaster-item-top); bottom: var(--toaster-item-bottom); transform-origin: var(--toaster-item-transform-origin); z-index: var(--index); animation-duration: var(--timings-default); animation-timing-function: var(--easings-ease); animation-fill-mode: forwards; transition: transform var(--timings-default) var(--easings-ease),opacity var(--timings-default) var(--easings-ease); --scale-factor: calc(1 - var(--reverse-index) * var(--scale-step, .03)); --older-offset: calc(var(--reverse-index) * .2px * var(--direction, 1) * -1); --translate-y: calc(var(--index) * 6px * var(--direction, 1) + var(--older-offset)); --translate-x: calc(var(--index) * 6px * var(--direction-x, 0)); --final-opacity: .6; transform: translate(var(--translate-x),var(--translate-y)) scale(var(--scale-factor)); }
447  .toaster__item:last-child { --final-opacity: 1; }
448  .toaster__item--animate-center { animation-name: toaster-animate-center; }
449  .toaster__item--animate-left { animation-name: toaster-animate-left; }
450  .toaster__item--animate-right { animation-name: toaster-animate-right; }
451}
452@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
453@layer ds-atoms {
454  .snackbar { display: inline-flex; align-items: center; width: 100%; border-radius: var(--spacings-s12); min-height: 48px; gap: var(--spacings-s4); padding: var(--spacings-s8); box-shadow: var(--shadows-tint-1); }
455  .snackbar--information { background-color: var(--information-colors-base-default); }
456  .snackbar--error { background-color: var(--error-colors-base-default); }
457  .snackbar--success { background-color: var(--success-colors-base-default); }
458  .snackbar--warning { background-color: var(--warning-colors-base-default); }
459  .snackbar--premium { background-color: var(--monetization-ultra-colors-base-default); }
460  .snackbar__button-no-handler { pointer-events: none; }
461  .snackbar__close-button { margin-inline-start: auto; }
462  .snackbar__text { word-break: break-word; min-width: 0px; }
463  .snackbar--information .snackbar__text { color: var(--information-colors-text-default); }
464  .snackbar--error .snackbar__text { color: var(--error-colors-text-default); }
465  .snackbar--success .snackbar__text { color: var(--success-colors-text-default); }
466  .snackbar--warning .snackbar__text { color: var(--warning-colors-text-default); }
467  .snackbar--premium .snackbar__text { color: var(--monetization-ultra-colors-text-default); }
468}
469@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
470@layer ds-atoms {
471  .text--t1 { font-size: var(--typography-t1-font-size); line-height: var(--typography-t1-line-height); }
472  .text--t2 { font-size: var(--typography-t2-font-size); line-height: var(--typography-t2-line-height); }
473  .text--t3 { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
474  .text--t4 { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
475  .text--t5 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
476  .text--t6 { font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); }
477  .text--t7 { font-size: var(--typography-t7-font-size); line-height: var(--typography-t7-line-height); }
478  .text--t8 { font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
479  .text--t9 { font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
480  .text--t10 { font-size: var(--typography-t10-font-size); line-height: var(--typography-t10-line-height); }
481  .text--color-primary { color: var(--primary-colors-base-default); }
482  .text--color-neutral { color: var(--neutral-colors-base-default); }
483  .text--color-plus { color: var(--monetization-plus-colors-base-default); }
484  .text--color-pro { color: var(--monetization-pro-colors-base-default); }
485  .text--color-ultra { color: var(--monetization-ultra-colors-base-default); }
486  .text--color-success { color: var(--success-colors-base-default); }
487  .text--color-warning { color: var(--warning-colors-base-default); }
488  .text--color-error { color: var(--error-colors-base-default); }
489  .text--color-information { color: var(--information-colors-base-default); }
490  .text--color-positive { color: var(--positive-colors-base-default); }
491  .text--color-negative { color: var(--negative-colors-base-default); }
492  .text--color-black { color: var(--absolute-black-colors-base-default); }
493  .text--color-white { color: var(--absolute-white-colors-base-default); }
494  .text--color-base { color: var(--text-colors-base); }
495  .text--color-tint-1 { color: var(--text-colors-tint-1); }
496  .text--color-tint-2 { color: var(--text-colors-tint-2); }
497  .text--color-tint-3 { color: var(--text-colors-tint-3); }
498  .text--full-width { display: block; width: 100%; }
499  .text--align-left { text-align: left; }
500  .text--align-center { text-align: center; }
501  .text--align-right { text-align: right; }
502  .text--truncated { display: inline-block; max-width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
503  .text--multi-line-truncated { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--text-max-visible-row-count); overflow: hidden; }
504}
505@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
506@layer ds-subatoms {
507  .base-text--font-gilroy { font-family: var(--fonts-gilroy); }
508  .base-text--font-acorn { font-family: var(--fonts-acorn); }
509  .base-text--weight-medium { font-weight: 500; }
510  .base-text--weight-semibold { font-weight: 600; }
511  .base-text--weight-bold { font-weight: 700; }
512  .base-text--weight-normal { font-weight: 400; }
513}
514@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
515@layer ds-molecules {
516  .notification { width: 100%; padding: var(--spacings-s12) var(--spacings-s12); border-width: 2px; border-style: solid; border-radius: var(--corner-radius-r16); box-shadow: var(--shadows-tint-1); background-color: var(--background-colors-tint-1); border-color: var(--ntf-border-color); }
517  .notification--large { max-width: 434px; }
518  .notification--small { max-width: 382px; }
519  .notification__information { display: flex; flex-wrap: wrap; column-gap: var(--spacings-s8); min-height: var(--typography-t7-line-height); }
520  .notification__information--centered { align-items: center; }
521  .notification__progress { padding: var(--spacings-s8) var(--spacings-s0) var(--spacings-s8) var(--spacings-s32); }
522  .notification__type-icon { display: inline-block; vertical-align: top; width: 24px; height: 24px; order: 0; }
523  .notification__close-icon { order: 2; }
524  .notification__title { display: block; word-break: break-word; margin-bottom: var(--spacings-s4); order: 1; flex: 1 1 0%; }
525  .notification__description { word-break: break-word; }
526  .notification__description--with-title { order: 3; flex: 0 0 100%; padding-left: 32px; margin-bottom: 6px; }
527  .notification__description--without-title { order: 1; flex: 1 1 0%; }
528  .notification__external-actions { display: flex; justify-content: flex-end; margin-top: var(--spacings-s8); gap: var(--spacings-s8); }
529  .notification--skin-success { --ntf-border-color: var(--success-colors-base-default); }
530  .notification--skin-success .ntf-typeIcon > path:not([fill]) { fill: var(--success-colors-base-default); }
531  .notification--skin-warning { --ntf-border-color: var(--warning-colors-base-default); }
532  .notification--skin-warning .ntf-typeIcon > path:not([fill]) { fill: var(--warning-colors-base-default); }
533  .notification--skin-error { --ntf-border-color: var(--error-colors-base-default); }
534  .notification--skin-error .ntf-typeIcon > path:not([fill]) { fill: var(--error-colors-base-default); }
535  .notification--skin-information { --ntf-border-color: var(--information-colors-base-default); }
536  .notification--skin-information .ntf-typeIcon > path:not([fill]) { fill: var(--information-colors-base-default); }
537  .notification--skin-premium { --ntf-border-color: var(--monetization-ultra-colors-base-default); }
538  .notification--skin-premium .ntf-typeIcon > path:not([fill]) { fill: var(--monetization-ultra-colors-base-default); }
539}
540@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
541@layer ds-atoms {
542  .inline-button { display: inline-flex; vertical-align: top; flex-shrink: 0; align-items: center; transition-property: background-color, border-color, color; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); }
543  .inline-button--large { height: 40px; padding-block: var(--spacings-s10); padding-inline: var(--spacings-s10); column-gap: var(--spacings-s2); border-radius: var(--corner-radius-r8); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
544  .inline-button--small { height: 32px; padding-block: var(--spacings-s6); padding-inline: var(--spacings-s6); column-gap: var(--spacings-s2); border-radius: var(--corner-radius-r8); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
545  .inline-button--full-width { width: 100%; }
546  .inline-button--with-border { border-style: solid; border-width: 1px; }
547  .inline-button--with-border.inline-button--small { border-width: 1px; }
548  .inline-button--no-border { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
549  .inline-button--transparent-bg { background-color: transparent; }
550  .inline-button--center-content { justify-content: center; }
551  .inline-button--cursor-pointer { cursor: pointer; }
552  .inline-button--cursor-default { cursor: default; }
553  .inline-button--cursor-not-allowed { cursor: not-allowed; }
554  .inline-button--default { background-color: var(--control-colors-button-background-default); border-color: var(--control-colors-border-default); color: var(--control-colors-text-default); }
555  @media (hover: hover) and (pointer: fine) {
556  .inline-button--interactive:hover { background-color: var(--control-colors-button-background-action); border-color: var(--control-colors-border-action); color: var(--control-colors-text-action); }
557}
558  @media (hover: none) and (pointer: coarse) {
559  .inline-button--interactive:active { background-color: var(--control-colors-button-background-action); border-color: var(--control-colors-border-action); color: var(--control-colors-text-action); }
560}
561  .inline-button--active { background-color: var(--control-colors-button-background-active); border-color: var(--control-colors-border-active); color: var(--control-colors-text-active); }
562  @media (hover: hover) and (pointer: fine) {
563  .inline-button--active-interactive:hover { background-color: var(--control-colors-button-background-active-action); border-color: var(--control-colors-border-active-action); color: var(--control-colors-text-active-action); }
564}
565  @media (hover: none) and (pointer: coarse) {
566  .inline-button--active-interactive:active { background-color: var(--control-colors-button-background-active-action); border-color: var(--control-colors-border-active-action); color: var(--control-colors-text-active-action); }
567}
568  .inline-button--without-border-override { border-color: transparent; }
569  @media (hover: hover) and (pointer: fine) {
570  .inline-button--without-border-override:hover { border-color: transparent; }
571}
572  @media (hover: none) and (pointer: coarse) {
573  .inline-button--without-border-override:active { border-color: transparent; }
574}
575  .inline-button--without-bg-override { background-color: transparent; }
576  .inline-button--disabled { opacity: var(--states-disabled); cursor: not-allowed; }
577  .inline-button--loading-skin { position: relative; color: transparent; }
578  .inline-button__icon-holder { display: block; width: 20px; height: 20px; }
579  .inline-button--small .inline-button__icon-holder { width: 20px; height: 20px; }
580  .inline-button__icon { display: inline-block; flex-shrink: 0; flex-basis: 20px; width: 20px; height: 20px; min-width: 0px; min-height: 0px; transition-property: transform; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); }
581  .inline-button--small .inline-button__icon { flex-basis: 20px; width: 20px; height: 20px; }
582  .inline-button__icon > path:not([fill]) { fill: currentcolor; }
583  .inline-button__arrow-active { transform: rotate(180deg); }
584  .inline-button__content-wrap { display: grid; flex-grow: 1; height: 20px; padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
585  .inline-button--small .inline-button__content-wrap { height: 20px; padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
586  .inline-button__content-align-start { text-align: start; }
587  .inline-button__content-align-center { text-align: center; }
588  .inline-button__content-align-end { text-align: end; }
589  .inline-button__content { width: 100%; min-width: 0px; min-height: 0px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-family: var(--fonts-gilroy); }
590  .inline-button__control { display: none; }
591  .inline-button__loading-icon { position: absolute; inset: 0px; margin: auto; pointer-events: none; }
592  @keyframes inline-btn-rotate { 
593  100% { transform: rotate(360deg); }
594}
595  .inline-button__loading-icon-skin { color: var(--control-colors-text-default); animation: inline-btn-rotate var(--timings-long) var(--easings-linear) infinite; }
596}
597@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
598@layer ds-atoms {
599  .monetization-badge { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; background: var(--gradients-status-info); color: var(--information-colors-text-default); }
600  .monetization-badge--shadow { box-shadow: var(--shadows-tint-2); }
601  .monetization-badge--rectangle.monetization-badge--large { width: 44px; height: 20px; border-radius: var(--corner-radius-r16); }
602  .monetization-badge--rectangle.monetization-badge--small { width: 32px; height: 14px; border-radius: var(--corner-radius-r12); }
603  .monetization-badge--skin-plus { background: var(--gradients-monetization-plus); color: var(--monetization-plus-colors-text-default); }
604  .monetization-badge--skin-pro { background: var(--gradients-monetization-pro); color: var(--monetization-pro-colors-text-default); }
605  .monetization-badge--skin-ultra { background: var(--gradients-monetization-ultra); color: var(--negative-colors-text-default); }
606  .monetization-badge__icon { display: block; }
607  .monetization-badge__icon > path:not([fill]) { fill: currentcolor; }
608  .monetization-badge__icon--rectangle-large { width: 32px; height: 16px; }
609  .monetization-badge__icon--rectangle-small { width: 28px; height: 14px; }
610}
611@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
612@layer ds-atoms {
613  .tool-badge { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; background-color: var(--information-colors-base-default); color: var(--information-colors-text-default); }
614  .tool-badge--shadow { box-shadow: var(--shadows-tint-2); }
615  .tool-badge--circle { border-radius: var(--corner-radius-circle); }
616  .tool-badge--circle.tool-badge--large { width: 20px; height: 20px; }
617  .tool-badge--circle.tool-badge--small { width: 14px; height: 14px; }
618  .tool-badge--rectangle.tool-badge--large { width: 44px; height: 20px; border-radius: var(--corner-radius-r16); }
619  .tool-badge--rectangle.tool-badge--small { width: 32px; height: 14px; border-radius: var(--corner-radius-r12); }
620  .tool-badge--skin-new { background: var(--gradients-status-success); color: var(--information-colors-text-default); }
621  .tool-badge--skin-live { background: var(--gradients-status-success); color: var(--success-colors-text-default); }
622  .tool-badge--skin-hot-text { background: var(--gradients-status-warning); color: var(--warning-colors-text-default); }
623  .tool-badge__icon { display: block; }
624  .tool-badge__icon > path:not([fill]) { fill: currentcolor; }
625  .tool-badge__icon--circle-large { width: 12px; height: 12px; }
626  .tool-badge__icon--circle-small { width: 10px; height: 10px; }
627  .tool-badge__icon--rectangle-large { width: 32px; height: 16px; }
628  .tool-badge__icon--rectangle-small { width: 28px; height: 14px; }
629}
630@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
631@layer ds-atoms {
632  .user-badge { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; background-color: var(--information-colors-base-default); color: var(--information-colors-text-default); }
633  .user-badge--shadow { box-shadow: var(--shadows-tint-2); }
634  .user-badge--circle { border-radius: var(--corner-radius-circle); }
635  .user-badge--circle.user-badge--large { width: 20px; height: 20px; }
636  .user-badge--circle.user-badge--small { width: 14px; height: 14px; }
637  .user-badge--skin-crown { background-color: var(--warning-colors-base-default); color: var(--warning-colors-text-default); }
638  .user-badge__icon { display: block; }
639  .user-badge__icon > path:not([fill]) { fill: currentcolor; }
640  .user-badge__icon--circle-large { width: 12px; height: 12px; }
641  .user-badge__icon--circle-small { width: 10px; height: 10px; }
642}
643@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
644@layer ds-atoms {
645  @keyframes progress-loading-bar { 
646  0% { transform: translate(-100%); }
647  100% { transform: translate(400%); }
648}
649  .progress { display: inline-block; vertical-align: top; }
650  .progress__circle-bg { stroke: var(--background-colors-tint-3); }
651  .progress__circle-load { stroke: var(--progress-status); transition: all var(--timings-fast) var(--easings-linear); }
652  .progress--circular { width: 60px; height: 60px; }
653  .progress--rectangular { background-color: var(--background-colors-tint-2); height: 4px; overflow: hidden; }
654  .progress--full-width { width: 100%; }
655  .progress--with-border-radius { border-radius: var(--corner-radius-r4); }
656  .progress--status-default { --progress-status: var(--primary-colors-base-default); }
657  .progress--status-error { --progress-status: var(--error-colors-base-default); }
658  .progress--status-success { --progress-status: var(--success-colors-base-default); }
659  .progress--status-warning { --progress-status: var(--warning-colors-base-default); }
660  .progress--status-information { --progress-status: var(--information-colors-base-default); }
661  .progress--linear::after { content: ""; display: block; width: 100%; height: 100%; background-color: var(--progress-status); will-change: transform; transition: all var(--timings-fast) var(--easings-linear); border-radius: inherit; }
662  [dir="ltr"] .progress--linear::after { transform: translate(calc(-1 * (100 - var(--progress-percent)) * 1%)); }
663  [dir="rtl"] .progress--linear::after { transform: translate(calc((100 - var(--progress-percent)) * 1%)); }
664  .progress--continues::before { content: ""; display: block; width: 30%; height: 100%; background-color: var(--progress-status); border-radius: inherit; transform: translate(-100%); animation: progress-loading-bar var(--timings-heavy) cubic-bezier(.65,.815,.735,.395) infinite; }
665}
666@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
667@layer ds-molecules {
668  .dialog { position: relative; max-width: 504px; }
669  .dialog--confirmation { max-width: 404px; }
670  .dialog__content-header { display: flex; justify-content: center; flex-direction: column; align-items: flex-start; gap: var(--spacings-s16); }
671  .dialog__content-header--centered { align-items: center; }
672  .dialog__type-icon { --icon-dimension: 56px; width: var(--icon-dimension); height: var(--icon-dimension); border-radius: var(--corner-radius-circle); display: flex; justify-content: center; align-items: center; background-color: var(--primary-colors-alpha-20); }
673  .dialog__icon > path { fill: var(--primary-colors-base-default); }
674  .dialog__message { display: flex; justify-content: center; flex-direction: column; align-items: flex-start; text-align: left; gap: var(--spacings-s8); }
675  .dialog__message--centered { align-items: center; text-align: center; }
676  .dialog__actions { display: flex; justify-content: flex-end; align-items: center; gap: var(--spacings-s10); margin-top: var(--spacings-s24); }
677  @media screen and (max-width: 479px) {
678  .dialog__actions { flex-flow: column-reverse wrap; }
679}
680  .dialog__actions--centered { justify-content: center; }
681  .dialog__actions--mobile { flex-direction: column-reverse; }
682  .dialog__action-item { min-width: 75px; }
683  @media screen and (max-width: 479px) {
684  .dialog__action-item { min-width: 100%; }
685}
686  .dialog__action-item--with-icon { min-width: 140px; }
687  .dialog__action-item--mobile { min-width: 100%; }
688  .dialog__content { margin-top: var(--spacings-s12); }
689}
690@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
691@layer ds-molecules {
692  .popup { padding: var(--spacings-s24); position: relative; }
693  @media screen and (max-width: 479px) {
694  .popup { padding: var(--spacings-s16); }
695}
696  @media screen and (min-width: 480px) and (max-width: 767px) {
697  .popup { padding: var(--spacings-s16); }
698}
699  .popup__holder { padding: var(--spacings-s24); position: relative; background-color: var(--background-colors-base); box-shadow: var(--shadows-tint-1); border-radius: var(--corner-radius-r16); border: 1px solid var(--background-colors-tint-3); }
700  .popup__content--with-background-effect { background: var(--effects-vignette); }
701  .popup__close-button { --dir-position: calc(-1 * var(--spacings-s16)); position: absolute; inset-block-start: var(--dir-position); inset-inline: auto var(--dir-position); }
702  .popup__overlay-visible { opacity: 1; transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1); }
703  .popup__overlay-hidden { opacity: 0; transition: opacity 0.2s cubic-bezier(0.4, 0, 1, 1); }
704  .popup__holder--with-glassy-effect { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
705  .popup__glass { position: relative; overflow: hidden; background-color: var(--effects-glassy-tint); border: 1px solid var(--effects-glassy-highlight-border); box-shadow: var(--effects-glassy-shadow),var(--effects-glassy-inner-shadow); backdrop-filter: var(--effects-glassy-backdrop); border-block-start: 0px; border-inline-start: 0px; }
706  .popup__glass::before, .popup__glass::after { content: ""; position: absolute; pointer-events: none; }
707  .popup__glass::before { inset-block-start: 0px; inset-inline: 10%; height: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-top); }
708  .popup__glass::after { inset-block: 0px; inset-inline-start: 0px; width: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-side); }
709  .popup__glass { position: absolute; inset: 0px; z-index: -1; border-radius: inherit; pointer-events: none; }
710}
711@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
712@layer ds-atoms {
713  html.scroll-frozen { height: 100%; overflow: hidden; }
714  .overlay { position: relative; inset: 0px; width: 100%; height: 100%; overflow: auto; z-index: var(--overlay-z-index); background-color: var(--background-colors-transparent); }
715  @media (pointer: fine) {
716  .overlay::-webkit-scrollbar { width: 4px; }
717  .overlay::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
718  .overlay::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
719  .overlay::-webkit-scrollbar-corner { background: transparent; }
720}
721  @supports (-moz-appearance: none) {
722  .overlay { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
723}
724  @media (pointer: coarse) {
725  .overlay::-webkit-scrollbar { display: none; }
726}
727  .overlay--hide-scrollbars { scrollbar-width: none; }
728  .overlay--hide-scrollbars::-webkit-scrollbar { display: none; }
729  .overlay--global { position: fixed; }
730  .overlay--local { position: absolute; }
731  .overlay--blurred { backdrop-filter: var(--effects-blurred); }
732  .overlay__table { display: table; table-layout: fixed; width: 100%; min-height: 100%; }
733  .overlay__row { display: table-row; }
734  .overlay__cell { display: table-cell; }
735  .overlay__cell--v-top { vertical-align: top; }
736  .overlay__cell--v-middle { vertical-align: middle; }
737  .overlay__cell--v-bottom { vertical-align: bottom; }
738  .overlay__cell--h-left { text-align: left; }
739  .overlay__cell--h-center { text-align: center; }
740  .overlay__cell--h-right { text-align: right; }
741  .overlay__content { display: inline-block; max-width: 100%; text-align: initial; }
742  .overlay__content--v-top { vertical-align: top; }
743  .overlay__content--v-middle { vertical-align: middle; }
744  .overlay__content--v-bottom { vertical-align: bottom; }
745  .overlay__content--full-width { width: 100%; }
746  .overlay__content--fit-width { width: fit-content; margin: auto; }
747}
748@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
749@layer ds-atoms {
750  @keyframes skeleton-ltr { 
751  0% { transform: translate(-200%, -50%); }
752  100% { transform: translate(100%, -50%); }
753}
754  @keyframes skeleton-rtl { 
755  0% { transform: translate(100%, -50%); }
756  100% { transform: translate(-200%, -50%); }
757}
758  .skeleton { display: block; position: relative; overflow: hidden; clip-path: view-box; background-color: var(--background-colors-tint-2); width: var(--skeleton-width); height: var(--skeleton-height); border-radius: var(--skeleton-border-radius, 0); }
759  .skeleton::before { content: ""; display: block; width: 50%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-image: linear-gradient(90deg,transparent,var(--background-colors-tint-3),transparent); will-change: transform; }
760  [dir="ltr"] .skeleton::before { animation: skeleton-ltr var(--timings-long) var(--easings-linear) infinite; }
761  [dir="rtl"] .skeleton::before { animation: skeleton-rtl var(--timings-long) var(--easings-linear) infinite; }
762}
763@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
764@layer ds-templates {
765  .footer-basic-link__navigation-link { display: inline-flex; padding: var(--spacings-s12) 0; }
766  @media (hover: hover) and (pointer: fine) {
767  .footer-basic-link__navigation-link:hover { color: var(--primary-colors-base-default); }
768  .footer-basic-link__navigation-link:active { color: var(--primary-colors-base-action); }
769}
770  @media (hover: none) and (pointer: coarse) {
771  .footer-basic-link__navigation-link:active { color: var(--primary-colors-base-action); }
772}
773}
774@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
775@layer ds-atoms {
776  .link { max-width: 100%; }
777  .link--t1 { font-size: var(--typography-t1-font-size);
777 line-height: var(--typography-t1-line-height); }
778  .link--t2 { font-size: var(--typography-t2-font-size); line-height: var(--typography-t2-line-height); }
779  .link--t3 { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
780  .link--t4 { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
781  .link--t5 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
782  .link--t6 { font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); }
783  .link--t7 { font-size: var(--typography-t7-font-size); line-height: var(--typography-t7-line-height); }
784  .link--t8 { font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
785  .link--t9 { font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
786  .link--t10 { font-size: var(--typography-t10-font-size); line-height: var(--typography-t10-line-height); }
787  .link--color-primary { color: var(--primary-colors-base-default); }
788  .link--color-neutral { color: var(--neutral-colors-base-default); }
789  .link--color-plus { color: var(--monetization-plus-colors-base-default); }
790  .link--color-pro { color: var(--monetization-pro-colors-base-default); }
791  .link--color-ultra { color: var(--monetization-ultra-colors-base-default); }
792  .link--color-success { color: var(--success-colors-base-default); }
793  .link--color-warning { color: var(--warning-colors-base-default); }
794  .link--color-error { color: var(--error-colors-base-default); }
795  .link--color-information { color: var(--information-colors-base-default); }
796  .link--color-positive { color: var(--positive-colors-base-default); }
797  .link--color-negative { color: var(--negative-colors-base-default); }
798  .link--color-black { color: var(--absolute-black-colors-base-default); }
799  .link--color-white { color: var(--absolute-white-colors-base-default); }
800  .link--color-tint-1 { color: var(--text-colors-tint-1); }
801  .link--underline { text-decoration: underline; }
802  .link--prevent-next-line { display: inline-block; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; vertical-align: bottom; }
803  .link--multi-line-clamp { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: var(--link-max-row-count); }
804}
805@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
806@layer ds-subatoms {
807  .base-link--font-gilroy { font-family: var(--fonts-gilroy); }
808  .base-link--font-acorn { font-family: var(--fonts-acorn); }
809  .base-link--weight-normal { font-weight: 400; }
810  .base-link--weight-medium { font-weight: 500; }
811  .base-link--weight-semibold { font-weight: 600; }
812  .base-link--weight-bold { font-weight: 700; }
813}
814@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
815@layer ds-templates {
816  html { background-color: var(--background-colors-base); }
817  .standard-host { --header-height: 80px; position: relative; display: grid; background-color: var(--positive-colors-base-default); overscroll-behavior: contain; height: 100%; min-height: 100dvh; grid-template-rows: auto 1fr auto; }
818  .standard-host--mobile { padding-bottom: var(--standard-aside-mobile-height); }
819  .standard-host__wrapper { display: flex; flex-direction: column; }
820  .standard-host__shape { grid-area: 1 / 1; }
821  .standard-host__shape path { transition: fill var(--timings-default) var(--easings-ease); }
822  .standard-host__floating-action-container { width: 48px; height: 48px; margin-inline-start: auto; position: fixed; bottom: var(--spacings-s16); right: var(--spacings-s16); z-index: 99; }
823}
824@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
825@layer ds-templates {
826  html { --fixed-header-inset-start: 0; }
827  .standard-host-header { display: grid; align-items: center; height: var(--header-height); border-bottom: 1px solid var(--background-colors-tint-3); padding: var(--spacings-s0) var(--spacings-s16); }
828  .standard-host-header--fixed { --fixed-header-index: 2; position: sticky; top: 0px; left: 0px; right: 0px; background-color: inherit; z-index: var(--fixed-header-index); }
829  .standard-host-header__common { display: grid; grid-auto-flow: column; column-gap: var(--header-items-gap); align-items: center; min-width: 0px; min-height: 0px; }
830  .standard-host-header__left { grid-column: 1 / 2; justify-self: start; gap: var(--spacings-s8); }
831  .standard-host-header__center { justify-self: center; gap: var(--spacings-s8); }
832  .standard-host-header__center--with-siblings { grid-column: 2 / 3; }
833  .standard-host-header__right { grid-column: 3 / 4; justify-self: end; gap: var(--spacings-s8); }
834}
835@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
836@layer ds-templates {
837  .standard-host-footer { --footer-space: 240px; display: flex; flex-flow: column; background-color: var(--positive-colors-base-default); transition: transform var(--timings-default) var(--easings-ease); border-top: 1px solid var(--background-colors-tint-3); }
838  .standard-host-footer--fixed { position: fixed; bottom: env(safe-area-inset-bottom,0px); left: 0px; right: 0px; z-index: 999; max-height: calc(100% - var(--footer-space)); border-top: 1px solid var(--background-colors-tint-3); transform: translateY(100%); }
839  .standard-host-footer--open { transform: translateY(0px); }
840  .standard-host-footer__footer-content { overscroll-behavior: contain; overflow: auto; width: 100%; height: 100%; }
841  .standard-host-footer__arrow-icon { grid-area: 1 / 1; position: absolute; top: 50%; left: 50%; width: 16px; height: 16px; transform: translate(-50%, -50%) scaleY(-1); transition: transform var(--timings-default) var(--easings-ease); }
842  .standard-host-footer__arrow-icon--open { transform: translate(-50%, -50%) scaleY(1); }
843  .standard-host-footer__arrow-icon path { fill: var(--text-colors-tint-1); transition: fill var(--timings-default) var(--easings-ease); }
844  .standard-host-footer__toggle-button { --toggle-height: 24px; position: absolute; height: var(--toggle-height); left: 50%; transform: translate(-50%); inset-block-start: calc(var(--toggle-height) * -1); display: grid; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: transparent; cursor: pointer; z-index: 1; }
845}
846@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
847@layer ds-templates {
848  .standard-footer-basic { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; gap: var(--spacings-s24); padding: var(--spacings-s24); background-color: var(--positive-colors-base-default); }
849  .standard-footer-basic__select-wrapper { width: 196px; }
850  .standard-footer-basic__top-content { width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; column-gap: var(--spacings-s24); row-gap: var(--spacings-s2); list-style: none; }
851  .standard-footer-basic__navigation-link { display: inline-flex; padding: var(--spacings-s12) 0; }
852}
853@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
854@layer ds-templates {
855  .standard-footer { display: grid; width: 100%; padding-block: var(--spacings-s12); background-color: var(--background-colors-base); }
856  .standard-footer--desktop { padding-block: var(--spacings-s48) var(--spacings-s0); }
857  .standard-footer__content { display: grid; gap: var(--spacings-s16); text-align: center; }
858  .standard-footer__content--desktop { padding-top: var(--spacings-s32); text-align: left; }
859  .standard-footer__bottom-content { display: flex; justify-content: space-between; align-items: center; gap: var(--spacings-s16); border-top: 1px solid var(--control-colors-border-default); }
860  .standard-footer__bottom-content--mobile { flex-direction: column; gap: var(--spacings-s8); }
861  .standard-footer__theme-toggle-segments { flex-shrink: 0; }
862}
863@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
864@layer ds-atoms {
865  .horizontal-container { width: 100%; margin: 0px auto; }
866  @media screen and (min-width: 1600px) {
867  .horizontal-container { max-width: 1600px; padding: 0 var(--spacings-s24); }
868}
869  @media screen and (min-width: 1366px) and (max-width: 1599px) {
870  .horizontal-container { max-width: 1366px; padding: 0 var(--spacings-s24); }
871}
872  @media screen and (min-width: 1280px) and (max-width: 1365px) {
873  .horizontal-container { max-width: 1280px; padding: 0 var(--spacings-s24); }
874}
875  @media screen and (min-width: 1024px) and (max-width: 1279px) {
876  .horizontal-container { max-width: 1024px; padding: 0 var(--spacings-s24); }
877}
878  @media screen and (min-width: 768px) and (max-width: 1023px) {
879  .horizontal-container { max-width: 768px; padding: 0 var(--spacings-s12); }
880}
881  @media screen and (min-width: 480px) and (max-width: 767px) {
882  .horizontal-container { max-width: 480px; padding: 0 var(--spacings-s12); }
883}
884  @media screen and (max-width: 479px) {
885  .horizontal-container { max-width: 100%; padding: 0 var(--spacings-s12); }
886}
887}
888@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
889@layer ds-molecules {
890  .segments { display: grid; grid-template-rows: 1fr; grid-template-columns: var(--seg-cols, repeat(1, 1fr)); list-style-type: none; border-radius: var(--corner-radius-r12); background-color: var(--background-colors-base); }
891  .segments--large { column-gap: var(--spacings-s4); padding: var(--spacings-s4); }
892  .segments--large.segments--bordered { padding: calc(var(--spacings-s4) - 1px); }
893  .segments--small { column-gap: var(--spacings-s4); padding: var(--spacings-s2); }
894  .segments--small.segments--bordered { padding: calc(var(--spacings-s4) - 1px); }
895  .segments--bordered { border: 1px solid var(--background-colors-border); }
896  .segments__item { min-width: 0px; }
897}
898@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
899@layer ds-templates {
900  .navigation-links { display: flex; justify-content: space-between; gap: var(--spacings-s40); }
901  @media screen and (min-width: 768px) and (max-width: 1023px) {
902  .navigation-links { flex-direction: column; gap: var(--spacings-s64); }
903}
904  @media screen and (min-width: 480px) and (max-width: 767px) {
905  .navigation-links { flex-direction: column; gap: var(--spacings-s64); }
906}
907  .navigation-links--mobile { flex-direction: column; }
908}
909@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
910@layer ds-templates {
911  .common-links { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: var(--spacings-s8); }
912  .common-links--desktop { min-height: 64px; flex-direction: row; padding-block: var(--spacings-s8); }
913  .common-links--mobile { flex-direction: column; }
914  .common-links__links { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: var(--spacings-s16); align-items: center; }
915  .common-links__links--mobile { padding-block: var(--spacings-s24); gap: var(--spacings-s8); justify-content: center; }
916  .common-links__link { white-space: nowrap; }
917  .common-links__link--mobile { padding-block: var(--spacings-s8); }
918  .common-links__link--mobile:not(:nth-last-child(-n+2))::after { content: ""; display: inline-block; vertical-align: middle; margin-inline-start: var(--spacings-s16); width: 1px; height: 16px; background-color: var(--control-colors-border-default); }
919  .common-links__copyright--desktop::before { content: ""; display: inline-block; vertical-align: middle; margin-inline-end: var(--spacings-s16); width: 1px; height: 16px; background-color: var(--control-colors-border-default); }
920  .common-links__copyright--mobile { margin-top: var(--spacings-s8); flex-basis: 100%; }
921}
922@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
923@layer ds-templates {
924  .external-links { display: grid; gap: var(--spacings-s32); }
925  @media screen and (min-width: 768px) and (max-width: 1023px) {
926  .external-links { justify-content: start; gap: var(--spacings-s24); }
927}
928  @media screen and (min-width: 480px) and (max-width: 767px) {
929  .external-links { justify-content: start; gap: var(--spacings-s24); }
930}
931  .external-links__logo-link { width: 100%; }
932  .external-links__logo-link--desktop { max-width: 140px; height: 32px; }
933  .external-links__logo-link--mobile { margin: auto; max-width: 105px; height: 24px; }
934  .external-links__logo-link > svg { width: 100%; height: 100%; }
935  .external-links__get-the-app-wrapper { display: grid; gap: var(--spacings-s16); }
936  @media screen and (min-width: 768px) and (max-width: 1023px) {
937  .external-links__get-the-app-wrapper { grid-area: 2 / 1 / 3; }
938}
939  @media screen and (min-width: 480px) and (max-width: 767px) {
940  .external-links__get-the-app-wrapper { grid-area: 2 / 1 / 3; }
941}
942  .external-links__get-the-apps { display: flex; gap: var(--spacings-s12); height: 40px; }
943  .external-links__get-the-app-item { max-width: 117px; width: 100%; height: 100%; }
944  .external-links__get-the-app-item > svg { width: 100%; height: 100%; }
945  .external-links__social-links-wrapper { display: flex; flex-direction: column; gap: var(--spacings-s12); }
946  @media screen and (min-width: 768px) and (max-width: 1023px) {
947  .external-links__social-links-wrapper { grid-area: 2 / 3 / 3; gap: var(--spacings-s0); justify-content: space-between; }
948}
949  @media screen and (min-width: 480px) and (max-width: 767px) {
950  .external-links__social-links-wrapper { grid-area: 2 / 3 / 3; gap: var(--spacings-s0); justify-content: space-between; }
951}
952  .external-links__social-links--desktop { display: flex; gap: var(--spacings-s12); justify-content: flex-start; }
953  .external-links__social-links--mobile { display: flex; gap: var(--spacings-s12); justify-content: center; }
954  .external-links__soc-link { display: inline-flex; width: 40px; justify-content: flex-start; }
955  @media screen and (min-width: 768px) and (max-width: 1023px) {
956  .external-links__soc-link { grid-area: 2 / 2 / 3; align-self: end; }
957}
958  @media screen and (min-width: 480px) and (max-width: 767px) {
959  .external-links__soc-link { grid-area: 2 / 2 / 3; align-self: end; }
960}
961  .external-links__soc-link--mobile { margin: auto; }
962}
963@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
964@layer ds-templates {
965  .internal-links { display: grid; }
966  .internal-links--desktop { grid-auto-flow: column; gap: var(--spacings-s40); }
967  .internal-links--mobile { grid-auto-flow: row; }
968  .internal-links__list-item { text-align: left; }
969  .internal-links__list-item--mobile { height: 48px; }
970}
971@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
972@layer ds-molecules {
973  .accordion { max-width: 100%; width: 100%; min-width: 0px; overflow: hidden; transition: border-color var(--timings-default) var(--easings-ease),opacity var(--timings-default) var(--easings-ease); --border-color: var(--control-colors-border-default); --border-color-hover: var(--control-colors-border-action); --border-color-active: var(--control-colors-border-active); --border-color-active-hover: var(--control-colors-border-active-action);
973 --toggle-bg-color: var(--control-colors-button-background-default); --toggle-bg-color-hover: var(--control-colors-button-background-action); --toggle-bg-color-active: var(--control-colors-button-background-active); --toggle-bg-color-active-hover: var(--control-colors-button-background-active-action); --accordion-content-bg: var(--background-colors-base); --toggle-text-color: var(--control-colors-text-default); --toggle-start-icon-color: var(--control-colors-start-icon-default); --toggle-end-icon-color: var(--control-colors-end-icon-default); }
974  .accordion--large { --acc-border-w: 1px; --acc-border-r: var(--corner-radius-r8); --acc-toggle-h: 40px; --acc-pad-v: var(--spacings-s10); --acc-pad-h: var(--spacings-s10); --acc-gap: var(--spacings-s2); --acc-icon-size: 20px; --acc-title-pad-h: var(--spacings-s2); --acc-title-pad-v: var(--spacings-s0); --acc-badge-pad: var(--spacings-s2); --acc-content-pad: var(--spacings-s12); }
975  .accordion--small { --acc-border-w: 1px; --acc-border-r: var(--corner-radius-r8); --acc-toggle-h: 32px; --acc-pad-v: var(--spacings-s6); --acc-pad-h: var(--spacings-s6); --acc-gap: var(--spacings-s2); --acc-icon-size: 20px; --acc-title-pad-h: var(--spacings-s2); --acc-title-pad-v: var(--spacings-s0); --acc-badge-pad: var(--spacings-s2); --acc-content-pad: var(--acc-pad-h); }
976  @media (hover: hover) and (pointer: fine) {
977  .accordion:hover { --toggle-text-color: var(--control-colors-text-action); --toggle-start-icon-color: var(--control-colors-start-icon-action); --toggle-end-icon-color: var(--control-colors-end-icon-action); --border-color: var(--border-color-hover); --toggle-bg-color: var(--toggle-bg-color-hover); }
978}
979  .accordion[data-is-disabled] { pointer-events: none; }
980  .accordion--with-border { border: var(--acc-border-w) solid var(--border-color); border-radius: var(--acc-border-r); }
981  .accordion--without-border { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 0px; --border-color: none; --toggle-bg-color: transparent; --border-color-hover: none; --toggle-bg-color-hover: transparent; --border-color-active: none; --toggle-bg-color-active: transparent; --border-color-active-hover: transparent; --toggle-bg-color-active-hover: transparent; --accordion-content-bg: transparent; }
982  .accordion--disabled { opacity: var(--states-disabled); }
983  .accordion--toggle-br-expanded { --toggle-br: calc(var(--acc-border-r) - var(--acc-border-w)) calc(var(--acc-border-r) - var(--acc-border-w)) 0 0; }
984  .accordion--toggle-br-collapsed { --toggle-br: calc(var(--acc-border-r) - var(--acc-border-w)); }
985  .accordion--active { --toggle-bg-color: var(--toggle-bg-color-active); --toggle-text-color: var(--control-colors-text-active); --toggle-start-icon-color: var(--control-colors-start-icon-active); --toggle-end-icon-color: var(--control-colors-end-icon-active); --border-color: var(--border-color-active); }
986  @media (hover: hover) and (pointer: fine) {
987  .accordion--active:hover { --toggle-text-color: var(--control-colors-text-active-action); --toggle-start-icon-color: var(--control-colors-start-icon-active-action); --toggle-end-icon-color: var(--control-colors-end-icon-active-action); --border-color: var(--border-color-active-hover); --toggle-bg-color: var(--toggle-bg-color-active-hover); }
988}
989  .accordion__toggle { width: 100%; background-color: var(--toggle-bg-color); color: var(--text-colors-base); cursor: pointer; display: flex; align-items: center; outline: none; transition: background-color var(--timings-default) var(--easings-ease); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; min-height: var(--acc-toggle-h); padding: calc(var(--acc-pad-v) - var(--acc-border-w)) calc(var(--acc-pad-h) - var(--acc-border-w)); gap: var(--acc-gap); border-radius: var(--toggle-br); }
990  .accordion__toggle--no-gap { gap: 0px; }
991  .accordion__toggle[disabled] { pointer-events: none; }
992  .accordion__content-holder { display: flex; align-items: center; flex: 1 1 auto; gap: var(--acc-gap); min-width: 0px; height: var(--acc-icon-size, 100%); }
993  .accordion__title-container { padding: var(--acc-title-pad-v) var(--acc-title-pad-h); min-width: 0px; height: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
994  .accordion__start-icon { flex-shrink: 0; width: var(--acc-icon-size); height: var(--acc-icon-size); color: var(--toggle-start-icon-color, var(--control-colors-start-icon-default)); transition: color var(--timings-default) var(--easings-ease); }
995  .accordion__start-icon path:not([fill]) { fill: currentcolor; }
996  .accordion__badge { margin: var(--acc-badge-pad); flex-shrink: 0; }
997  .accordion__checkbox-button { margin: 0px; margin-inline-start: auto; flex-shrink: 0; height: var(--acc-icon-size); }
998  .accordion__badge-wrapper { display: flex; align-items: center; height: calc(var(--acc-toggle-h) - var(--acc-pad-v) * 2); }
999  .accordion__toggle-icon { display: inline-block; width: var(--acc-icon-size); height: var(--acc-icon-size); flex-shrink: 0; margin-inline-start: auto; color: var(--toggle-end-icon-color, var(--control-colors-end-icon-default)); transition: color var(--timings-default) var(--easings-ease),transform var(--timings-default) var(--easings-ease); }
1000  .accordion__toggle-icon path { fill: currentcolor; }
1001  .accordion__toggle-icon--with-switch { margin-inline-start: 4px; }
1002  .accordion__toggle-icon--expanded { transform: rotate(180deg); }
1003  .accordion__title { text-align: left; word-break: break-word; color: var(--toggle-text-color); transition: color var(--timings-default) var(--easings-ease); }
1004  .accordion__content { display: grid; border-radius: 0 0 calc(var(--acc-border-r) - var(--acc-border-w)) calc(var(--acc-border-r) - var(--acc-border-w)); overflow: hidden; background-color: var(--accordion-content-bg); }
1005  .accordion__active-indicator { display: grid; grid-area: 1 / 1; }
1006  .accordion__active-indicator::before { content: ""; height: var(--acc-border-w); background: var(--border-color); }
1007  .accordion__content-wrap { padding: var(--acc-content-pad); grid-area: 1 / 1; min-width: 0px; }
1008  .accordion--without-border .accordion__content-wrap { padding: 2px 0 var(--acc-content-pad) 0; }
1009}
1010@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1011@layer ds-atoms {
1012  .switch { display: inline-block; vertical-align: top; align-items: center; position: relative; width: 34px; height: 32px; overflow: hidden; }
1013  .switch::before { content: ""; display: inline-block; width: 100%; height: 20px; border-radius: var(--corner-radius-r24); transition: background-color var(--timings-default) var(--easings-ease); position: absolute; top: 50%; left: var(--spacings-s0); right: var(--spacings-s0); transform: translateY(-50%); pointer-events: none; }
1014  .switch::after { content: ""; display: inline-block; width: 16px; height: 16px; border-radius: var(--corner-radius-circle); background-color: var(--positive-colors-base-default); box-shadow: var(--shadows-tint-1); position: absolute; top: 50%; transform: translateY(-50%); transition: transform var(--timings-default) var(--easings-ease); pointer-events: none; }
1015  .switch__control { display: inline-block; vertical-align: top; width: 100%; height: 100%; position: absolute; inset: var(--spacings-s0); cursor: pointer; }
1016  .switch__control--disabled { cursor: not-allowed; }
1017  .switch--unchecked::before { background-color: var(--background-colors-tint-3); }
1018  .switch--skin-primary.switch--checked::before { background-color: var(--primary-colors-base-default); }
1019  .switch--skin-premium.switch--checked::before { background-color: var(--monetization-ultra-colors-base-default); }
1020  @media (hover: hover) and (pointer: fine) {
1021  .switch--unchecked-interaction:hover::before { background-color: var(--control-colors-text-action); }
1022}
1023  @media (hover: none) and (pointer: coarse) {
1024  .switch--unchecked-interaction:active::before { background-color: var(--control-colors-text-action); }
1025}
1026  @media (hover: hover) and (pointer: fine) {
1027  .switch--skin-primary.switch--checked-interaction:hover::before { background-color: var(--primary-colors-base-action); }
1028}
1029  @media (hover: none) and (pointer: coarse) {
1030  .switch--skin-primary.switch--checked-interaction:active::before { background-color: var(--primary-colors-base-action); }
1031}
1032  @media (hover: hover) and (pointer: fine) {
1033  .switch--skin-premium.switch--checked-interaction:hover::before { background-color: var(--monetization-ultra-colors-base-action); }
1034}
1035  @media (hover: none) and (pointer: coarse) {
1036  .switch--skin-premium.switch--checked-interaction:active::before { background-color: var(--monetization-ultra-colors-base-action); }
1037}
1038  .switch--disabled { opacity: var(--states-disabled); }
1039  [dir="ltr"] .switch::after { left: var(--spacings-s2); }
1040  [dir="rtl"] .switch::after { right: calc(-1 * var(--spacings-s2)); }
1041  [dir="ltr"] .switch--checked::after { transform: translate(calc(100% - var(--spacings-s2))) translateY(-50%); left: var(--spacings-s2); }
1042  [dir="rtl"] .switch--checked::after { transform: translate(calc(-100% + var(--spacings-s2))) translateY(-50%); right: var(--spacings-s2); }
1043}
1044@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1045@layer ds-atoms {
1046  .tooltip { position: relative; background-color: var(--tooltip-bg-color); color: var(--negative-colors-text-default); box-shadow: var(--shadows-tint-1); border-radius: var(--corner-radius-r8); font-weight: 600; z-index: var(--tooltip-z-index); font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
1047  .tooltip[data-placement$="-start"] { transform: translate(10px); }
1048  .tooltip[data-placement$="-end"] { transform: translate(-10px); }
1049  .tooltip--not-clickable { pointer-events: none; }
1050  .tooltip__wrapper[data-placement^="top"], .tooltip__wrapper[data-placement^="bottom"], .tooltip__wrapper[data-placement^="auto"] { padding: 10px 0px; }
1051  .tooltip__wrapper[data-placement^="left"], .tooltip__wrapper[data-placement^="right"] { padding: 0px 10px; }
1052  .tooltip__content { padding: var(--spacings-s8) var(--spacings-s12); color: var(--negative-colors-text-default); }
1053  .tooltip__content .text { color: var(--negative-colors-text-default); }
1054  .tooltip__indicator-wrapper { position: absolute; width: 20px; height: 13px; }
1055  .tooltip__indicator-wrapper[data-arrow-wrapper-dir^="top"] { bottom: -12px; }
1056  .tooltip__indicator-wrapper[data-arrow-wrapper-dir^="right"] { left: -12px; }
1057  .tooltip__indicator-wrapper[data-arrow-wrapper-dir^="bottom"] { top: -12px; }
1058  .tooltip__indicator-wrapper[data-arrow-wrapper-dir^="left"] { right: -12px; }
1059  .tooltip__indicator-wrapper svg { transform: translateY(-0.0125em); }
1060  .tooltip__indicator-wrapper[data-arrow-wrapper-dir^="right"] svg { transform: rotate(90deg); }
1061  .tooltip__indicator-wrapper[data-arrow-wrapper-dir^="bottom"] svg { transform: scaleY(-1); }
1062  .tooltip__indicator-wrapper[data-arrow-wrapper-dir^="left"] svg { transform: rotate(-90deg); }
1063  .tooltip__indicator { width: 20px; height: 13px; pointer-events: none; }
1064  .tooltip__indicator path:first-of-type, .tooltip__indicator path:last-of-type { fill: var(--tooltip-bg-color); }
1065}
1066@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1067@layer ds-atoms {
1068  .list { display: grid; list-style-type: none; }
1069  .list-item { min-width: 0px; min-height: 0px; }
1070}
1071@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1072@layer ds-templates {
1073  @keyframes burger-menu-open { 
1074  0% { opacity: 0; transform-origin: left center; transform: translate(-100%); }
1075  100% { opacity: 1; transform: translate(0px); }
1076}
1077  .burger-menu__overlay { position: fixed; inset: 0px; background-color: var(--background-colors-transparent); z-index: 99; }
1078  .burger-menu__root { position: fixed; z-index: 999; inset: 0px; display: grid; grid-template-columns: 1fr; grid-template-rows: max-content 1fr; gap: var(--spacings-s24); height: 100%; background-color: var(--positive-colors-base-default); opacity: 0; transform: translate(-100%); transition: transform var(--timings-default) var(--easings-ease-in-out); }
1079  .burger-menu__root--wide { width: 400px; }
1080  .burger-menu__root--full { width: 100%; }
1081  .burger-menu__header { display: flex; gap: var(--spacings-s4); justify-content: flex-start; align-items: center; height: var(--header-height); border-bottom: 1px solid var(--control-colors-border-default); padding-inline: var(--spacings-s12); }
1082  .burger-menu__content { display: grid; padding-inline: var(--spacings-s12); height: max-content; }
1083  .burger-menu__close-button { margin-inline-start: auto; }
1084  .burger-menu__footer { display: grid; gap: var(--spacings-s16); padding-inline: var(--spacings-s12); padding-bottom: var(--spacings-s16); }
1085  .burger-menu--open { animation: burger-menu-open var(--timings-default) var(--easings-ease) forwards; visibility: visible; opacity: 1; }
1086}
1087@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1088@layer ds-templates {
1089  .standard-header { --menu-size: 40px; display: grid; align-items: center; width: 100%; background-color: var(--positive-colors-base-default); height: var(--standard-header-header-height); border-bottom: 1px solid var(--background-colors-border); }
1090  .standard-header--sticky { position: sticky; top: 0px; z-index: 1000; }
1091  .standard-header--relative { position: relative; }
1092  .standard-header__header-container { display: grid; grid-auto-flow: column; align-items: center; width: 100%; height: 100%; }
1093  .standard-header__header-container--desktop { grid-template-columns: max-content 1fr max-content max-content; }
1094  .standard-header__header-container--mobile { grid-template-columns: 1fr max-content max-content; }
1095  .standard-header__menu-icon-container { display: flex; align-items: center; }
1096  .standard-header__menu-icon-container--desktop { margin: var(--spacings-s0) 0; }
1097  .standard-header__menu-icon-container--mobile { margin: var(--spacings-s6) 0; }
1098  .standard-header__navigation-container { display: grid; grid-auto-flow: column; align-items: center; grid-template-columns: 1fr auto; height: 100%; }
1099  .standard-header__navigation-container--desktop { position: relative; }
1100  .standard-header__logo--desktop { margin-inline-end: var(--spacings-s40); }
1101  .standard-header__logo--mobile { margin-inline-end: 0px; width: var(--spacings-s40); height: var(--spacings-s40); }
1102  .standard-header__navigation { display: flex; flex-grow: 1; overflow: hidden; height: 100%; }
1103  .standard-header__hidden-navigation { visibility: hidden; opacity: 0; pointer-events: none; user-select: none; }
1104  .standard-header__navigation-list { display: inline-flex; gap: var(--spacings-s32); }
1105  .standard-header__navigation-item { display: flex; align-items: center; gap: var(--spacings-s8); }
1106  .standard-header__menu-icon--desktop { margin-inline-end: var(--spacings-s16); }
1107  .standard-header__menu-icon--mobile { margin-inline-end: var(--spacings-s12); }
1108  .standard-header__search-container--desktop { margin-inline-start: var(--spacings-s40); }
1109  .standard-header__actions-container { display: flex; align-items: center; gap: var(--spacings-s16); }
1110  .standard-header__actions-container--desktop { margin-inline-start: var(--spacings-s16); }
1111  .standard-header__actions-container--touch { margin-inline-end: var(--spacings-s12); }
1112}
1113@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1114@layer ds-atoms {
1115  .image { display: block; max-width: 100%; }
1116}
1117@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1118@layer ds-templates {
1119  @keyframes standard-header-search-slide-in { 
1120  0% { width: 0px; opacity: 0; }
1121  100% { width: 100%; opacity: 1; }
1122}
1123  @keyframes standard-header-search-slide-out { 
1124  0% { width: 100%; opacity: 1; }
1125  100% { width: 0px; opacity: 0; }
1126}
1127  @keyframes standard-header-search-overlay-in { 
1128  0% { width: 0px; opacity: 0; }
1129  100% { width: 100%; opacity: 1; }
1130}
1131  @keyframes standard-header-search-overlay-out { 
1132  0% { width: 100%; opacity: 1; }
1133  100% { width: 0px; opacity: 0; }
1134}
1135  .standard-header-search { display: grid; grid-auto-flow: column; }
1136  .standard-header-search--desktop::after { content: ""; display: block; width: 2px; height: 100%; background-color: var(--control-colors-border-default); margin-inline-start: var(--spacings-s16); }
1137  .standard-header-search__search-field { position: absolute; top: 0px; right: 0px; width: 0px; display: flex; gap: var(--spacings-s16); align-items: center; overflow: hidden; margin-inline-end: var(--spacings-s16); background-color: var(--positive-colors-base-default); height: 100%; }
1138  .standard-header-search__search-field--closed { animation: standard-header-search-slide-out var(--timings-default) var(--easings-ease-in-out) forwards; }
1139  .standard-header-search__search-field--open { animation-duration: ; animation-timing-function: ; animation-iteration-count: ; animation-direction: ; animation-fill-mode: ; animation-play-state: ; animation-name: ; animation-timeline: ; animation-range-start: ; animation-range-end: ; animation-delay: 0.1s; }
1140  .standard-header-search__search-button { width: auto; }
1141  .standard-header-search__search-action { display: flex; align-items: center; }
1142  .standard-header-search__search-field-overlay { position: absolute; inset: 0px; width: 0px; overflow: hidden; opacity: 0; background-color: var(--positive-colors-base-default); }
1143  .standard-header-search__search-field-overlay--open { animation: standard-header-search-overlay-in var(--timings-default) var(--easings-ease) forwards; height: 100%; z-index: 10; }
1144  .standard-header-search__search-field-overlay--closed { animation: standard-header-search-overlay-out var(--timings-default) var(--easings-ease) forwards; }
1145  .standard-header-search__search-field-overlay-header { display: flex; align-items: center; gap: var(--spacings-s8); height: 100%; padding: var(--spacings-s0) var(--spacings-s6); margin-inline: var(--spacings-s6); border-bottom: 1px solid var(--control-colors-border-default); }
1146  .standard-header-search__search-field-overlay-content { padding: var(--spacings-s12) var(--spacings-s6); }
1147  .standard-header-search__text-field-container { display: flex; align-items: center; width: 100%; height: 100%; }
1148}
1149@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1150@layer ds-atoms {
1151  .text-field { width: 100%; }
1152  .text-field--large { height: 40px; }
1153  .text-field--small { height: 32px; }
1154  .text-field--relative { position: relative; }
1155  .text-field__control { display: block; width: 100%; height: 100%; border-width: 1px; border-style: solid; border-radius: var(--corner-radius-r8); font-family: var(--fonts-gilroy); font-weight: 500; transition-property: background-color, border-color, color; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease); }
1156  .text-field__control::placeholder { font-size: var(--typography-t4-font-size); line-height: 1; font-family: inherit; }
1157  .text-field__control::-webkit-outer-spin-button, .text-field__control::-webkit-inner-spin-button { appearance: none; margin: 0px; }
1158  .text-field__control[type="number"] { }
1159  .text-field__control--centered { text-align: center; }
1160  .text-field__control--large, .text-field__control--small { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); font-weight: 500; }
1161  .text-field__control--default-padding.text-field__control--large { padding: 0 calc(var(--spacings-s10) - 1px); }
1162  .text-field__control--default-padding.text-field__control--small { padding: 0 calc(var(--spacings-s6) - 1px); }
1163  .text-field__control--placeholder-padding.text-field__control--large { padding-inline-start: calc(var(--spacings-s10) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
1164  .text-field__control--placeholder-padding.text-field__control--small { padding-inline-start: calc(var(--spacings-s6) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
1165  .text-field__control--button-padding.text-field__control--large { padding-inline-end: calc(var(--spacings-s10) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
1166  .text-field__control--button-padding.text-field__control--small { padding-inline-end: calc(var(--spacings-s6) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
1167  .text-field__placeholder-icon { display: inline-block; vertical-align: top; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; pointer-events: none; }
1168  .text-field__placeholder-icon--large { width: 20px; height: 20px; inset-inline-start: var(--spacings-s10); }
1169  .text-field__placeholder-icon--small { width: 20px; height: 20px; inset-inline-start: var(--spacings-s6); }
1170  .text-field__button { display: inline-block; vertical-align: top; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; cursor: pointer; }
1171  .text-field__button--large { width: 20px; height: 20px; inset-inline-end: var(--spacings-s10); }
1172  .text-field__button--small { width: 20px; height: 20px; inset-inline-end: var(--spacings-s6); }
1173  .text-field--default-skin { border-color: var(--control-colors-border-default); color: var(--control-colors-value-default); background-color: var(--text-field-bg-override, var(--control-colors-field-background-default)); }
1174  @media (hover: hover) and (pointer: fine) {
1175  .text-field--interactive:hover { border-color: var(--control-colors-border-action); color: var(--control-colors-value-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-action)); }
1176}
1177  @media (hover: none) and (pointer: coarse) {
1178  .text-field--interactive:active { border-color: var(--control-colors-border-action); color: var(--control-colors-value-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-action)); }
1179}
1180  .text-field--interactive:focus { border-color: var(--control-colors-border-active); color: var(--control-colors-value-active); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active)); }
1181  .text-field--filled { color: var(--control-colors-value-active); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active)); border-color: var(--control-colors-border-active); }
1182  @media (hover: hover) and (pointer: fine) {
1183  .text-field--filled:hover { border-color: var(--control-colors-border-active-action); color: var(--control-colors-value-active-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active-action)); }
1184}
1185  @media (hover: none) and (pointer: coarse) {
1186  .text-field--filled:active { border-color: var(--control-colors-border-active-action); color: var(--control-colors-value-active-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active-action)); }
1187}
1188  .text-field--error { border-color: var(--error-colors-base-default); }
1189  @media (hover: hover) and (pointer: fine) {
1190  .text-field--error:hover { border-color: var(--error-colors-base-action); }
1191}
1192  @media (hover: none) and (pointer: coarse) {
1193  .text-field--error:active { border-color: var(--error-colors-base-active); }
1194}
1195  .text-field--error-active { border-color: var(--error-colors-base-active); }
1196  @media (hover: hover) and (pointer: fine) {
1197  .text-field--error-active:hover { border-color: var(--error-colors-base-active-action); }
1198}
1199  @media (hover: none) and (pointer: coarse) {
1200  .text-field--error-active:active { border-color: var(--error-colors-base-active-action); }
1201}
1202  .text-field--warning { border-color: var(--warning-colors-base-default); }
1203  @media (hover: hover) and (pointer: fine) {
1204  .text-field--warning:hover { border-color: var(--warning-colors-base-action); }
1205}
1206  @media (hover: none) and (pointer: coarse) {
1207  .text-field--warning:active { border-color: var(--warning-colors-base-action); }
1208}
1209  .text-field--warning-active { border-color: var(--warning-colors-base-active); }
1210  @media (hover: hover) and (pointer: fine) {
1211  .text-field--warning-active:hover { border-color: var(--warning-colors-base-active-action); }
1212}
1213  @media (hover: none) and (pointer: coarse) {
1214  .text-field--warning-active:active { border-color: var(--warning-colors-base-active-action); }
1215}
1216  .text-field--success { border-color: var(--success-colors-base-default); }
1217  @media (hover: hover) and (pointer: fine) {
1218  .text-field--success:hover { border-color: var(--success-colors-base-action); }
1219}
1220  @media (hover: none) and (pointer: coarse) {
1221  .text-field--success:active { border-color: var(--success-colors-base-action); }
1222}
1223  .text-field--success-active { border-color: var(--success-colors-base-active); }
1224  @media (hover: hover) and (pointer: fine) {
1225  .text-field--success-active:hover { border-color: var(--success-colors-base-active-action); }
1226}
1227  @media (hover: none) and (pointer: coarse) {
1228  .text-field--success-active:active { border-color: var(--success-colors-base-active-action); }
1229}
1230  .text-field--disabled { opacity: var(--states-disabled); }
1231  .text-field--disabled-icon { opacity: var(--states-disabled); cursor: auto; }
1232  .text-field--without-background { --text-field-bg-override: transparent; }
1233  .text-field--without-borders { border-style: none; }
1234  .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-default); }
1235  .text-field__skin-placeholder-icon > path { fill: currentcolor; }
1236  .text-field__skin-button { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; color: var(--control-colors-end-icon-default); transition: color var(--timings-default) var(--easings-ease); }
1237  @media (hover: hover) and (pointer: fine) {
1238  .text-field__skin-button:hover { color: var(--control-colors-end-icon-action); }
1239}
1240  @media (hover: none) and (pointer: coarse) {
1241  .text-field__skin-button:active { color: var(--control-colors-end-icon-action); }
1242}
1243  .text-field__skin-button-icon { display: block; width: 100%; height: 100%; }
1244  .text-field__skin-button-icon > path { fill: currentcolor; }
1245  @media (hover: hover) and (pointer: fine) {
1246  .text-field--interactive:hover + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-action); }
1247}
1248  @media (hover: none) and (pointer: coarse) {
1249  .text-field--interactive:active + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-action); }
1250}
1251  .text-field--filled + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-active); }
1252  @media (hover: hover) and (pointer: fine) {
1253  .text-field--filled:hover + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-active-action); }
1254}
1255  @media (hover: none) and (pointer: coarse) {
1256  .text-field--filled:active + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-active-action); }
1257}
1258  .text-field--with-glassy-effect { position: relative; z-index: 0; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; --text-field-bg-override: transparent; }
1259  .text-field--with-glassy-effect .text-field__control:not(:where(.text-field--error, .text-field--warning, .text-field--success)) { border-color: transparent; }
1260  .text-field__glass { position: relative; overflow: hidden; background-color: var(--effects-glassy-tint); border: 1px solid var(--effects-glassy-highlight-border); box-shadow: var(--effects-glassy-shadow),var(--effects-glassy-inner-shadow); backdrop-filter: var(--effects-glassy-backdrop); border-block-start: 0px; border-inline-start: 0px; }
1261  .text-field__glass::before, .text-field__glass::after { content: ""; position: absolute; pointer-events: none; }
1262  .text-field__glass::before { inset-block-start: 0px; inset-inline: 10%; height: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-top); }
1263  .text-field__glass::after { inset-block: 0px; inset-inline-start: 0px; width: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-side); }
1264  .text-field__glass { position: absolute; inset: 0px; z-index: -1; border-radius: var(--corner-radius-r8); pointer-events: none; }
1265}
1266@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1267@layer ds-templates {
1268  .standard-header-user-actions--desktop { margin-inline-start: var(--spacings-s16); }
1269  .standard-header-user-actions--mobile { margin-inline-start: var(--spacings-s0); }
1270}
1271@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1272@layer ds-molecules {
1273  .avatar { display: flex; align-items: center; justify-content: center; position: relative; border-radius: 50%; flex-shrink: 0; width: var(--avatar-size); height: var(--avatar-size); background-color: var(--avatar-bg, var(--control-colors-button-background-default)); box-shadow: var(--avatar-shadow, none); border: var(--avatar-border, var(--avatar-border-width, 0px) solid var(--avatar-border-color, transparent)); cursor: var(--avatar-cursor, default); }
1274  .avatar__placeholder-icon { width: 50%; height: 50%; }
1275  .avatar__image { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
1276  .avatar__icon { display: inline-block; }
1277  .avatar__icon > path { fill: var(--control-colors-value-default); }
1278  .avatar__skeleton { position: absolute; inset: calc(-1 * var(--avatar-border-width, 0px)); border-radius: inherit; }
1279  .avatar__control { display: none; }
1280  .avatar__badge { display: flex; position: absolute; bottom: 0px; }
1281  [dir="ltr"] .avatar__badge { right: 0px; }
1282  [dir="rtl"] .avatar__badge { left: 0px; }
1283  .avatar--with-shadow { box-shadow: var(--shadows-tint-1); }
1284  .avatar--no-border { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
1285  .avatar--cursor-pointer { cursor: pointer; }
1286  [dir="ltr"] .avatar__badge--rectangle, [dir="rtl"] .avatar__badge--rectangle { left: 50%; right: auto; transform: translate(-50%); }
1287}
1288@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1289@layer ds-templates {
1290  @keyframes standard-header-nav-slide-in { 
1291  0% { max-height: 0px; opacity: 0; transform: translate(-10px); }
1292  100% { max-height: 1000px; opacity: 1; transform: translate(0px); }
1293}
1294  @keyframes standard-header-nav-slide-out { 
1295  0% { max-height: 1000px; opacity: 1; transform: translate(0px); }
1296  100% { max-height: 0px; opacity: 0; transform: translate(-10px); }
1297}
1298  .standard-header-navigation { position: relative; display: grid; align-items: center; width: 100%; background-color: var(--positive-colors-base-default); transform: translate(0px); }
1299  .standard-header-navigation--desktop-nav { height: 100%; }
1300  .standard-header-navigation--desktop-nav::after { display: block; position: absolute; bottom: 0px; left: 0px; height: 2px; transition: width var(--timings-default) var(--easings-ease-in-out); content: ""; width: 0px; background-color: var(--primary-colors-base-active-action); }
1301  .standard-header-navigation--desktop-nav::before { display: block; position: absolute; bottom: 0px; left: 0px; height: 2px; transition: width var(--timings-default) var(--easings-ease-in-out); content: ""; width: 0px; background-color: var(--primary-colors-base-active); }
1302  .standard-header-navigation--desktop-nav:hover::before { width: 100%; }
1303  .standard-header-navigation--burger { height: 48px; }
1304  .standard-header-navigation--active::after { width: 100%; }
1305  .standard-header-navigation__navigation-item { display: flex; align-items: center; gap: var(--spacings-s8); height: 100%; cursor: pointer; white-space: nowrap; user-select: none; color: var(--text-colors-base); transition: color var(--timings-default) var(--easings-ease-in-out); }
1306  .standard-header-navigation__navigation-item--desktop-nav { justify-content: center; }
1307  .standard-header-navigation__navigation-item--burger { justify-content: flex-start; }
1308  .standard-header-navigation__navigation-item--burger:hover { color: var(--primary-colors-base-active); }
1309  .standard-header-navigation__arrow--burger { margin-inline-start: auto; transform: rotate(90deg); }
1310  .standard-header-navigation__arrow-active { transform: rotate(0deg); transition: transform var(--timings-default) var(--easings-ease-in-out); }
1311  .standard-header-navigation__arrow-default { transform: rotate(180deg); }
1312  .standard-header-navigation__list-heading-article, .standard-header-navigation__navigation-item-link { height: 100%; }
1313  .standard-header-navigation__mobile-navigation-content { overflow: hidden; max-height: 0px; opacity: 0; transform: translateY(-10px); transition: max-height var(--timings-default) var(--easings-ease-in-out),opacity var(--timings-default) var(--easings-ease-in-out),transform var(--timings-default) var(--easings-ease-in-out); background-color: var(--positive-colors-base-default); border-top: 1px solid rgba(var(--text-colors-base),.125); padding: var(--spacings-s16); }
1314  .standard-header-navigation__mobile-navigation-content--open { max-height: 1000px; opacity: 1; transform: translateY(0px); }
1315  .standard-header-navigation__burger-menu-content { position: absolute; top: var(--standard-header-header-height); left: 0px; right: 0px; bottom: 0px; width: 100%; overflow: hidden; max-height: 1000px; opacity: 1; z-index: 99; transform: translate(0px); transition: max-height var(--timings-default) var(--easings-ease-in-out),opacity var(--timings-default) var(--easings-ease-in-out),transform var(--timings-default) var(--easings-ease-in-out); background-color: var(--positive-colors-base-default); border-top: 1px solid rgba(var(--text-colors-base),.125); padding: var(--spacings-s16); animation: standard-header-nav-slide-in var(--timings-default) var(--easings-ease-in-out); }
1316  .standard-header-navigation__burger-menu-content--closing { max-height: 0px; opacity: 0; transform: translate(-10px); }
1317  .standard-header-navigation__portal-content-closing { animation: standard-header-nav-slide-out var(--timings-default) var(--easings-ease-in-out) forwards; }
1318}
1319@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1320@layer ds-templates {
1321  .standard-header-navigation-content { position: fixed; top: var(--standard-header-navigation-content-top); left: var(--spacings-s0); display: grid; align-items: start; width: var(--standard-header-navigation-content-width); height: 100%; overscroll-behavior: none; z-index: 1000; }
1322  .standard-header-navigation-content--with-overflow { overflow: auto; }
1323  .standard-header-navigation-content--with-pseudo::after { content: ""; width: 100%; height: 100vh; background-color: var(--background-colors-transparent); }
1324  .standard-header-navigation-content__content { position: absolute; max-height: var(--standard-header-navigation-content-max-height); display: grid; width: 100%; background-color: var(--positive-colors-base-default); overflow: auto;
1324 overscroll-behavior: none; }
1325  .standard-header-navigation-content__content-wrapper { display: flex; height: 100%; }
1326  .standard-header-navigation-content__content-wrapper--desktop { gap: var(--spacings-s40); flex-direction: row; }
1327  .standard-header-navigation-content__content-wrapper--mobile { gap: var(--spacings-s16); flex-direction: column; }
1328}
1329@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1330@layer ds-templates {
1331  .standard-header-nav-content-item { --icon-size: 36px; display: flex; flex-direction: column; gap: var(--spacings-s4); }
1332  .standard-header-nav-content-item:last-child { padding-inline-end: 0px; }
1333  .standard-header-nav-content-item--desktop { margin-block: var(--spacings-s48); padding-inline-end: var(--spacings-s40); }
1334  .standard-header-nav-content-item--desktop:not(:last-child) { border-right: 1px solid var(--background-colors-tint-3); }
1335  .standard-header-nav-content-item--burger { padding-block-start: var(--spacings-s24); }
1336  .standard-header-nav-content-item--burger:not(:last-child) { border-bottom: 1px solid var(--background-colors-tint-3); }
1337  .standard-header-nav-content-item__list-container { display: flex; }
1338  .standard-header-nav-content-item__list-container--desktop { gap: var(--spacings-s48); flex-direction: row; }
1339  .standard-header-nav-content-item__list-container--burger { gap: var(--spacings-s16); flex-direction: column; margin-block: var(--spacings-s24); }
1340  .standard-header-nav-content-item__list-item-containers-wrapper { display: flex; }
1341  @media screen and (min-width: 1366px) and (max-width: 1599px) {
1342  .standard-header-nav-content-item__list-item-containers-wrapper { flex-direction: column; }
1343}
1344  .standard-header-nav-content-item__list-item-containers-wrapper--desktop { gap: var(--spacings-s48); flex-direction: row; }
1345  .standard-header-nav-content-item__list-item-containers-wrapper--burger { gap: var(--spacings-s24); flex-direction: column; }
1346  .standard-header-nav-content-item__column-group { display: flex; flex-direction: column; gap: var(--spacings-s24); }
1347  .standard-header-nav-content-item__content { display: flex; flex-direction: column; }
1348  .standard-header-nav-content-item__content--burger { margin-inline: 0px; }
1349  .standard-header-nav-content-item__subtitle--desktop { margin-top: var(--spacings-s4); }
1350  .standard-header-nav-content-item__subtitle--burger { margin-top: var(--spacings-s8); }
1351  .standard-header-nav-content-item__list-item-container { display: flex; flex-direction: column; }
1352  .standard-header-nav-content-item__list-heading-item { display: grid; grid-auto-flow: column; justify-content: start; align-items: center; color: var(--text-colors-base); }
1353  .standard-header-nav-content-item__list-heading-item--desktop { grid-template-columns: auto 1fr; margin-top: var(--spacings-s40); margin-bottom: var(--spacings-s10); }
1354  .standard-header-nav-content-item__list-heading-item--burger { grid-template-columns: 1fr; margin-top: var(--spacings-s0); }
1355  .standard-header-nav-content-item__list-heading-title { display: flex; align-items: center; grid-row: 1; }
1356  .standard-header-nav-content-item__list-heading-title--desktop { margin-inline-start: var(--spacings-s12); max-width: 250px; }
1357  .standard-header-nav-content-item__list-heading-title--burger { max-width: 100%; height: 40px; }
1358  .standard-header-nav-content-item__list-heading-description { grid-row: 2; margin-top: var(--spacings-s12); margin-bottom: var(--spacings-s12); }
1359  .standard-header-nav-content-item__list-heading-description--desktop { max-width: 200px; margin-inline-start: var(--spacings-s12); }
1360  .standard-header-nav-content-item__list-heading-description--burger { max-width: 100%; }
1361  .standard-header-nav-content-item__list-heading-article { grid-row: 4; object-fit: cover; border-radius: var(--corner-radius-r16); padding: var(--spacings-s16); background-color: var(--background-colors-tint-1); border: 1px solid var(--background-colors-tint-2); display: flex; flex-direction: column; justify-content: space-between; transition: border var(--timings-fast) var(--easings-ease-in-out); }
1362  .standard-header-nav-content-item__list-heading-article:hover { border: 1px solid var(--primary-colors-base-action); cursor: pointer; }
1363  .standard-header-nav-content-item__list-heading-article--desktop { width: 274px; }
1364  .standard-header-nav-content-item__list-heading-article--burger { width: 100%; }
1365  .standard-header-nav-content-item__list-heading-article-image { aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--corner-radius-r8); }
1366  .standard-header-nav-content-item__list-heading-article-image--desktop { width: 240px; }
1367  .standard-header-nav-content-item__list-heading-article-image--burger { width: 100%; }
1368  .standard-header-nav-content-item__multiple-lists-container { display: flex; }
1369  @media screen and (min-width: 1280px) and (max-width: 1365px) {
1370  .standard-header-nav-content-item__multiple-lists-container { flex-direction: column; }
1371}
1372  @media screen and (min-width: 1024px) and (max-width: 1279px) {
1373  .standard-header-nav-content-item__multiple-lists-container { flex-direction: column; }
1374}
1375  @media screen and (min-width: 768px) and (max-width: 1023px) {
1376  .standard-header-nav-content-item__multiple-lists-container { flex-direction: column; }
1377}
1378  @media screen and (min-width: 480px) and (max-width: 767px) {
1379  .standard-header-nav-content-item__multiple-lists-container { flex-direction: column; }
1380}
1381  @media screen and (max-width: 479px) {
1382  .standard-header-nav-content-item__multiple-lists-container { flex-direction: column; }
1383}
1384  .standard-header-nav-content-item__list-heading-icon { display: flex; align-items: center; justify-content: center; width: var(--icon-size); height: var(--icon-size); background-color: rgba(194, 9, 193, 0.2); border-radius: var(--corner-radius-circle); padding: var(--spacings-s4); color: var(--primary-colors-base-default); }
1385  .standard-header-nav-content-item__list-heading-icon svg path { fill: currentcolor; }
1386  .standard-header-nav-content-item__list { align-items: start; height: max-content; }
1387  .standard-header-nav-content-item__list--desktop { margin-inline-start: calc(var(--icon-size) + 12px); }
1388  .standard-header-nav-content-item__see-all-link { display: flex; align-items: center; width: max-content; color: var(--primary-colors-base-default); margin-top: var(--spacings-s16); font-weight: 600; height: 32px; }
1389  .standard-header-nav-content-item__see-all-link:hover { color: var(--primary-colors-base-action); }
1390  .standard-header-nav-content-item__see-all-link--desktop { margin-inline-start: calc(var(--icon-size) + 12px); }
1391  .standard-header-nav-content-item__list-item { display: flex; align-items: center; height: max-content; gap: var(--spacings-s8); margin-block: var(--spacings-s8); }
1392  .standard-header-nav-content-item__link { color: var(--text-colors-base); transition: color var(--timings-fast) var(--easings-ease-in-out); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; flex-shrink: 1; }
1393  .standard-header-nav-content-item__link:hover { color: var(--primary-colors-base-default); }
1394  .standard-header-nav-content-item__list-heading-image-text { margin-top: var(--spacings-s16); }
1395  .standard-header-nav-content-item__divider { background: var(--background-colors-tint-3); align-self: stretch; }
1396  .standard-header-nav-content-item__divider--desktop { width: 1px; height: auto; margin: 0 var(--spacings-s16); }
1397  .standard-header-nav-content-item__divider--burger { width: 100%; height: 1px; margin: var(--spacings-s16) 0; }
1398  .standard-header-nav-content-item__list-heading-image-content { display: flex; flex-direction: column; }
1399  .standard-header-nav-content-item__banners-container { display: flex; align-items: center; min-height: 56px; gap: var(--spacings-s12); }
1400  .standard-header-nav-content-item__banners-container--desktop { max-width: 440px; margin-top: var(--spacings-s32); flex-direction: row; }
1401  .standard-header-nav-content-item__banners-container--burger { max-width: 100%; margin-top: var(--spacings-s16); flex-direction: column; }
1402  .standard-header-nav-content-item__banner-card { display: flex; flex-basis: 50%; align-items: center; padding-inline: var(--spacings-s16); padding-block: var(--spacings-s8); width: 100%; height: 100%; background-color: var(--background-colors-base); border: 1px solid var(--background-colors-tint-2); border-radius: var(--corner-radius-r8); text-decoration: none; transition: border var(--timings-fast) var(--easings-ease-in-out); }
1403  .standard-header-nav-content-item__banner-card:hover { border: 1px solid var(--primary-colors-base-action); cursor: pointer; }
1404  .standard-header-nav-content-item__banner-card--desktop { flex: 1 1 0%; }
1405  .standard-header-nav-content-item__banner-card--burger { flex: 0 0 auto; }
1406  .standard-header-nav-content-item__banner-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; color: var(--primary-colors-base-default); }
1407  .standard-header-nav-content-item__banner-icon svg path { fill: currentcolor; }
1408  .standard-header-nav-content-item__banner-content { display: flex; flex-direction: column; margin-inline-start: var(--spacings-s12); }
1409  .standard-header-nav-content-item__banner-title { color: var(--text-colors-base); font-weight: 600; }
1410  .standard-header-nav-content-item__banner-index { color: var(--text-colors-tint-1); font-weight: 500; margin-bottom: var(--spacings-s4); }
1411  .standard-header-nav-content-item__banner-description { color: var(--text-colors-tint-1); font-weight: 500; }
1412}
1413@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1414@layer ds-atoms {
1415  .bottom-sheet__content { display: grid; grid-template-rows: auto 1fr auto; height: 100%; min-height: 0px; }
1416  .bottom-sheet__header { position: sticky; top: 0px; padding: var(--spacings-s0) var(--spacings-s16) var(--spacings-s8) var(--spacings-s16); background-color: var(--background-colors-base); }
1417  .bottom-sheet__body { padding: var(--spacings-s0) var(--spacings-s16); overflow-y: auto; min-height: 0px; scrollbar-gutter: stable both-edges; }
1418  .bottom-sheet__footer { position: sticky; bottom: 0px; padding: var(--spacings-s0) var(--spacings-s16); background-color: var(--background-colors-base); }
1419}
1420@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1421@layer ds-subatoms {
1422  .base-bottom-sheet { position: fixed; bottom: 0px; left: 0px; z-index: var(--bbs-z-index, 9); width: 100%; border-radius: var(--corner-radius-r16); background-color: var(--background-colors-base); isolation: isolate; transform-origin: center bottom; will-change: transform, height; transition-property: transform, opacity, max-height; transition-duration: 0.25s; transition-timing-function: cubic-bezier(0.4, 0, 1, 1); }
1423  .base-bottom-sheet--static { padding-top: var(--spacings-s12); border-radius: var(--corner-radius-r0); }
1424  .base-bottom-sheet--full-height { border-radius: var(--corner-radius-r0); }
1425  .base-bottom-sheet--open { transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
1426  .base-bottom-sheet--dragging { transition-duration: 0s; }
1427  .base-bottom-sheet__touch-area { display: grid; place-content: center; position: relative; height: 12px; border-radius: var(--corner-radius-r16) var(--corner-radius-r16) var(--corner-radius-r0) var(--corner-radius-r0); background-color: var(--background-colors-base); }
1428  .base-bottom-sheet--full-height .base-bottom-sheet__touch-area { border-radius: var(--corner-radius-r0); }
1429  .base-bottom-sheet__touch-area::before { content: ""; position: absolute; left: 50%; z-index: calc(var(--bbs-z-index, 9) + 1); width: 100%; max-width: 80%; height: 44px; background-color: transparent; translate: -50%; transform: translateY(0px); }
1430  .base-bottom-sheet--open .base-bottom-sheet__touch-area::before { transform: translateY(-45%); }
1431  .base-bottom-sheet__touch-area::after { content: ""; width: 32px; height: 4px; border-radius: var(--corner-radius-r4); background-color: var(--background-colors-tint-3); }
1432  .base-bottom-sheet__overlay { position: absolute; top: 12px; z-index: -1; width: 100%; height: 105%; background-color: var(--background-colors-transparent); opacity: var(--bbs-overlay-opacity, 0); transform: translateY(-100%); transition: opacity var(--timings-default) var(--easings-ease); user-select: none; }
1433  .base-bottom-sheet--static .base-bottom-sheet__overlay { top: 0px; }
1434  .base-bottom-sheet__content { height: 100%; contain: layout; touch-action: pan-y; }
1435  .base-bottom-sheet__content--with-bg-effect::before { content: ""; position: absolute; top: 50%; left: 50%; z-index: 0; width: 100%; max-height: 100%; height: auto; aspect-ratio: 1 / 1; background: var(--effects-vignette); transform: translate(-50%, -50%); pointer-events: none; }
1436  .base-bottom-sheet--enter { opacity: 0; }
1437  .base-bottom-sheet--enter-active { opacity: 1; transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1), max-height 0.25s cubic-bezier(0, 0, 0.2, 1); }
1438  .base-bottom-sheet--exit { opacity: 1; }
1439  .base-bottom-sheet--exit-active { opacity: 0; transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1), max-height 0.25s cubic-bezier(0.4, 0, 1, 1); }
1440}
1441@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1442@layer ds-molecules {
1443  .credit-button { position: relative; display: inline-flex; vertical-align: top; align-items: center; justify-content: center; max-width: 100%; border-style: solid; border-width: 0px; background-color: transparent; transition: background-color var(--timings-default) var(--easings-ease),border-color var(--timings-default) var(--easings-ease),color var(--timings-default) var(--easings-ease),opacity var(--timings-default) var(--easings-ease); height: 32px; padding-block: 4px; padding-inline: 4px; border-radius: 30px; font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); --credit-button-blink-glow: var(--text-colors-base); --credit-button-blink-ring: #6C6C6C; }
1444  .credit-button--status-default { background-color: var(--neutral-colors-base-default); }
1445  @media (hover: hover) and (pointer: fine) {
1446  .credit-button--status-default:hover { background-color: var(--neutral-colors-base-action); }
1447}
1448  .credit-button--status-default:active { background-color: var(--neutral-colors-base-active); }
1449  @media (hover: hover) and (pointer: fine) {
1450  .credit-button--status-default:active:hover { background-color: var(--neutral-colors-base-active-action); }
1451}
1452  .credit-button--status-default { color: var(--neutral-colors-text-default); }
1453  @media (hover: hover) and (pointer: fine) {
1454  .credit-button--status-default:hover { color: var(--neutral-colors-text-action); }
1455}
1456  .credit-button--status-default:active { color: var(--neutral-colors-text-active); }
1457  @media (hover: hover) and (pointer: fine) {
1458  .credit-button--status-default:active:hover { color: var(--neutral-colors-text-active-action); }
1459}
1460  .credit-button--status-low { --credit-button-blink-glow: var(--warning-colors-base-default); --credit-button-blink-ring: var(--warning-colors-base-default); border-width: 1px; border-color: var(--warning-colors-base-default); }
1461  @media (hover: hover) and (pointer: fine) {
1462  .credit-button--status-low:hover { border-color: var(--warning-colors-base-action); }
1463}
1464  .credit-button--status-low:active { border-color: var(--warning-colors-base-active); }
1465  @media (hover: hover) and (pointer: fine) {
1466  .credit-button--status-low:active:hover { border-color: var(--warning-colors-base-active-action); }
1467}
1468  .credit-button--status-low { color: var(--warning-colors-base-default); }
1469  @media (hover: hover) and (pointer: fine) {
1470  .credit-button--status-low:hover { color: var(--warning-colors-base-action); }
1471}
1472  .credit-button--status-low:active { color: var(--warning-colors-base-active); }
1473  @media (hover: hover) and (pointer: fine) {
1474  .credit-button--status-low:active:hover { color: var(--warning-colors-base-active-action); }
1475}
1476  .credit-button--status-critical { --credit-button-blink-glow: var(--error-colors-base-default); --credit-button-blink-ring: var(--error-colors-base-default); border-width: 1px; border-color: var(--error-colors-base-default); }
1477  @media (hover: hover) and (pointer: fine) {
1478  .credit-button--status-critical:hover { border-color: var(--error-colors-base-action); }
1479}
1480  .credit-button--status-critical:active { border-color: var(--error-colors-base-active); }
1481  @media (hover: hover) and (pointer: fine) {
1482  .credit-button--status-critical:active:hover { border-color: var(--error-colors-base-active-action); }
1483}
1484  .credit-button--status-critical { color: var(--error-colors-base-default); }
1485  @media (hover: hover) and (pointer: fine) {
1486  .credit-button--status-critical:hover { color: var(--error-colors-base-action); }
1487}
1488  .credit-button--status-critical:active { color: var(--error-colors-base-active); }
1489  @media (hover: hover) and (pointer: fine) {
1490  .credit-button--status-critical:active:hover { color: var(--error-colors-base-active-action); }
1491}
1492  .credit-button__content { display: inline-flex; align-items: center; min-width: 0px; column-gap: var(--spacings-s2); }
1493  .credit-button__icon { display: inline-block; flex: 0 0 20px; width: 20px; height: 20px; }
1494  .credit-button__icon > path:not([fill]) { fill: currentcolor; }
1495  .credit-button__credits { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-inline: 2px; }
1496  .credit-button--blink { animation: credit-button-shadow var(--timings-medium) var(--easings-ease) forwards; }
1497  .credit-button--blink::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1.1); transition: scale var(--timings-medium) var(--easings-ease),box-shadow var(--timings-medium) var(--easings-ease); width: calc(100% + 1px); height: calc(100% + 1px); border: 1px solid var(--credit-button-blink-ring); border-radius: 30px; animation: credit-button-blink var(--timings-medium) var(--easings-ease) forwards; pointer-events: none; }
1498  @keyframes credit-button-shadow { 
1499  0%, 100% { box-shadow: none; }
1500  25%, 50% { box-shadow: 0 0 6px 6px color-mix(in srgb,var(--credit-button-blink-glow) 24%,transparent); }
1501}
1502  @keyframes credit-button-blink { 
1503  0% { transform: translate(-50%, -50%) scale(1.1); opacity: 0; }
1504  25% { transform: translate(-50%, -50%) scale(1.1, 1.2); opacity: 0.8; }
1505  50% { transform: translate(-50%, -50%) scale(1.2, 1.3); opacity: 0.6; }
1506  100% { transform: translate(-50%, -50%) scale(1.1); opacity: 0; }
1507}
1508}
1509@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1510@layer ds-subatoms {
1511  .base-button { appearance: none; margin: 0px; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; font: inherit; color: inherit; text-align: inherit; }
1512  .base-button:disabled { color: inherit; }
1513  .base-button--not-interactive { cursor: not-allowed; pointer-events: none; }
1514  .base-button--enabled { cursor: pointer; }
1515  .base-button--disabled { opacity: var(--states-disabled); pointer-events: none; }
1516  .base-button--loading { cursor: default; pointer-events: none; }
1517}
1518@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1519@layer ds-molecules {
1520  .panel-heading__top { display: grid; align-items: center; grid-template: "action title optional" 1fr / auto 1fr auto; }
1521  .panel-heading__brand-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-inline-end: var(--spacings-s4); }
1522  .panel-heading__brand-icon svg { width: 20px; height: 20px; fill: var(--text-colors-tint-1); }
1523  .panel-heading__common { min-width: 0px; }
1524  .panel-heading__back-button { grid-area: action; margin-inline-end: var(--spacings-s4); }
1525  [dir="rtl"] .panel-heading__back-button { transform: rotate(180deg); }
1526  .panel-heading__center-container { grid-area: title; display: flex; align-items: center; }
1527  .panel-heading__title-start { justify-content: start; }
1528  .panel-heading__title-container { display: grid; align-items: center; grid-template: "mainTitle count badge" 1fr / auto min-content 1fr; }
1529  .panel-heading__title { display: block; grid-area: mainTitle; transition: color var(--timings-default) var(--easings-ease); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
1530  .panel-heading__count { margin-inline-start: var(--spacings-s4); grid-area: count; }
1531  .panel-heading [data-testid="badge"] { grid-area: badge; vertical-align: baseline; margin-inline-start: var(--spacings-s8); }
1532  .panel-heading__optional { display: flex; gap: var(--spacings-s2); }
1533  .panel-heading__actions { grid-area: optional; display: flex; align-items: center; gap: var(--spacings-s2); margin-inline-start: var(--spacings-s8); }
1534  .panel-heading__bottom { margin-top: var(--spacings-s8); }
1535}
1536@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1537@layer ds-atoms {
1538  .text-tooltip { max-width: 390px; z-index: var(--text-tooltip-z-index); --container-background-color: var(--negative-colors-base-default); --container-border-color: var(--background-colors-border); background-color: var(--container-background-color); border-radius: var(--corner-radius-r8); }
1539  .text-tooltip__text { display: block; padding: var(--spacings-s8); color: var(--negative-colors-text-default); text-align: center; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
1540}
1541@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1542@layer ds-subatoms {
1543  .base-floating-container { position: relative; border: 1px solid var(--container-border-color); background-color: var(--container-background-color); }
1544  .base-floating-container--transform-start { transform: translate(10px); }
1545  .base-floating-container--transform-end { transform: translate(-10px); }
1546  .base-floating-container--transform-default { transform: translate(0px); }
1547  .base-floating-container__indicator { display: inline-block; position: absolute; width: 20px; height: 14px; }
1548  .base-floating-container__indicator > path:nth-child(1) { fill: var(--container-background-color); }
1549  .base-floating-container__indicator > path:nth-child(2) { fill: var(--container-border-color); }
1550}
1551@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1552@layer ds-atoms {
1553  .loader { display: flex; width: 100%; height: 100%; inset: 0px; z-index: var(--loader-z-index, 1); background-color: var(--loader-bg-color, transparent); }
1554  .loader--local { position: absolute; }
1555  .loader--global { position: fixed; }
1556  .loader--no-bg { background-color: transparent; }
1557  @keyframes loader-rotate { 
1558  100% { transform: rotate(360deg); }
1559}
1560  .loader__icon { display: inline-block; margin: auto; animation: loader-rotate var(--timings-long) var(--easings-linear) infinite; }
1561  .loader__icon path { fill: var(--primary-colors-base-default); }
1562  .loader--large .loader__icon { width: 48px; height: 48px; }
1563  .loader--small .loader__icon { width: 24px; height: 24px; }
1564}
1565@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1566@layer ds-atoms {
1567  .divider::before { content: ""; display: block; background-color: var(--background-colors-border); }
1568  .divider--rounded::before { border-radius: var(--corner-radius-r2); }
1569  .divider--horizontal { display: block; width: var(--divider-size, 100%); padding-top: var(--divider-start); padding-bottom: var(--divider-end); }
1570  .divider--horizontal::before { height: 2px; }
1571  .divider--vertical { display: inline-block; vertical-align: top; height: var(--divider-size, 100%); padding-inline-start: var(--divider-start); padding-inline-end: var(--divider-end); }
1572  .divider--vertical::before { width: 2px; height: 100%; }
1573}
1574@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1575@layer ds-atoms {
1576  .suggestion-menu-v2 { max-height: var(--smv2-max-height, 200px); min-width: var(--smv2-min-width, auto); margin-inline-start: var(--smv2-inline-offset, 0px); }
1577  .suggestion-menu-v2.suggestion-menu-v2 { transform: translateY(var(--smv2-block-offset, 0px)); }
1578  .suggestion-menu-v2 { background-color: var(--background-colors-popover); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r8); box-shadow: var(--shadows-tint-1); overflow: auto; padding: var(--spacings-s12); }
1579  @media (pointer: fine) {
1580  .suggestion-menu-v2::-webkit-scrollbar { width: 4px; }
1581  .suggestion-menu-v2::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
1582  .suggestion-menu-v2::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
1583  .suggestion-menu-v2::-webkit-scrollbar-corner { background: transparent; }
1584}
1585  @supports (-moz-appearance: none) {
1586  .suggestion-menu-v2 { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
1587}
1588  @media (pointer: coarse) {
1589  .suggestion-menu-v2::-webkit-scrollbar { display: none; }
1590}
1591  .suggestion-menu-v2--small { border-width: 1px; border-radius: var(--corner-radius-r8); }
1592  .suggestion-menu-v2--disabled { opacity: var(--states-disabled); pointer-events: none; }
1593  .suggestion-menu-v2 [data-suggestion-highlighted] { background-color: var(--control-colors-button-background-action); }
1594}
1595@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1596@layer ds-molecules {
1597  .chip--skin-default { --border-color: var(--control-colors-border-default); --start-icon-color: var(--control-colors-start-icon-default); --text-color: var(--control-colors-text-default); --end-icon-color: var(--control-colors-end-icon-default); --bg-color: var(--control-colors-button-background-default); }
1598  @media (hover: hover) and (pointer: fine) {
1599  .chip--skin-default:hover { --border-color: var(--control-colors-border-action); --start-icon-color: var(--control-colors-start-icon-action); --text-color: var(--control-colors-text-action); --end-icon-color: var(--control-colors-end-icon-action); --bg-color: var(--control-colors-button-background-action); }
1600}
1601  @media (hover: none) and (pointer: coarse) {
1602  .chip--skin-default:active { --border-color: var(--control-colors-border-action); --start-icon-color: var(--control-colors-start-icon-action); --text-color: var(--control-colors-text-action); --end-icon-color: var(--control-colors-end-icon-action); --bg-color: var(--control-colors-button-background-action); }
1603}
1604  .chip--skin-default-active { --border-color: var(--control-colors-button-background-active); --start-icon-color: var(--control-colors-start-icon-active); --text-color: var(--control-colors-text-active); --end-icon-color: var(--control-colors-end-icon-active); --bg-color: var(--control-colors-button-background-active); }
1605  @media (hover: hover) and (pointer: fine) {
1606  .chip--skin-default-active:hover { --border-color: var(--control-colors-button-background-active-action); --start-icon-color: var(--control-colors-start-icon-active-action); --text-color: var(--control-colors-text-active-action); --end-icon-color: var(--control-colors-end-icon-active-action); --bg-color: var(--control-colors-button-background-active-action); }
1607}
1608  @media (hover: none) and (pointer: coarse) {
1609  .chip--skin-default-active:active { --border-color: var(--control-colors-button-background-active-action); --start-icon-color: var(--control-colors-start-icon-active-action); --text-color: var(--control-colors-text-active-action); --end-icon-color: var(--control-colors-end-icon-active-action); --bg-color: var(--control-colors-button-background-active-action); }
1610}
1611  .chip--skin-primary { --border-color: var(--primary-colors-base-default); --start-icon-color: var(--primary-colors-text-default); --text-color: var(--primary-colors-text-default); --end-icon-color: var(--primary-colors-text-default); --bg-color: var(--primary-colors-base-default); }
1612  @media (hover: hover) and (pointer: fine) {
1613  .chip--skin-primary:hover { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
1614}
1615  @media (hover: none) and (pointer: coarse) {
1616  .chip--skin-primary:active { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
1617}
1618  .chip--skin-primary-active { --border-color: var(--primary-colors-base-active); --start-icon-color: var(--primary-colors-text-active); --text-color: var(--primary-colors-text-active); --end-icon-color: var(--primary-colors-text-active); --bg-color: var(--primary-colors-base-active); }
1619  @media (hover: hover) and (pointer: fine) {
1620  .chip--skin-primary-active:hover { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-action); --bg-color: var(--primary-colors-base-active-action); }
1621}
1622  @media (hover: none) and (pointer: coarse) {
1623  .chip--skin-primary-active:active { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-action); --bg-color: var(--primary-colors-base-active-action); }
1624}
1625  .chip--skin-secondary { --border-color: var(--primary-colors-base-default); --start-icon-color: var(--primary-colors-text-default); --text-color: var(--primary-colors-text-default); --end-icon-color: var(--primary-colors-text-default); --bg-color: var(--primary-colors-base-default); }
1626  @media (hover: hover) and (pointer: fine) {
1627  .chip--skin-secondary:hover { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
1628}
1629  @media (hover: none) and (pointer: coarse) {
1630  .chip--skin-secondary:active { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
1631}
1632  .chip--skin-secondary-active { --border-color: var(--primary-colors-base-active); --start-icon-color: var(--primary-colors-text-active); --text-color: var(--primary-colors-text-active); --end-icon-color: var(--primary-colors-text-active); --bg-color: var(--primary-colors-base-active); }
1633  @media (hover: hover) and (pointer: fine) {
1634  .chip--skin-secondary-active:hover { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-action); --bg-color: var(--primary-colors-base-active-action); }
1635}
1636  @media (hover: none) and (pointer: coarse) {
1637  .chip--skin-secondary-active:active { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-action); --bg-color: var(--primary-colors-base-active-action); }
1638}
1639  .chip--skin-tertiary { --border-color: var(--neutral-colors-base-default); --start-icon-color: var(--neutral-colors-text-default); --text-color: var(--neutral-colors-text-default); --end-icon-color: var(--neutral-colors-text-default); --bg-color: var(--neutral-colors-base-default); }
1640  @media (hover: hover) and (pointer: fine) {
1641  .chip--skin-tertiary:hover { --border-color: var(--neutral-colors-base-action); --start-icon-color: var(--neutral-colors-text-action); --text-color: var(--neutral-colors-text-action); --end-icon-color: var(--neutral-colors-text-action); --bg-color: var(--neutral-colors-base-action); }
1642}
1643  @media (hover: none) and (pointer: coarse) {
1644  .chip--skin-tertiary:active { --border-color: var(--neutral-colors-base-action); --start-icon-color: var(--neutral-colors-text-action); --text-color: var(--neutral-colors-text-action); --end-icon-color: var(--neutral-colors-text-action); --bg-color: var(--neutral-colors-base-action); }
1645}
1646  .chip--skin-tertiary-active { --border-color: var(--neutral-colors-base-active); --start-icon-color: var(--neutral-colors-text-active); --text-color: var(--neutral-colors-text-active); --end-icon-color: var(--neutral-colors-text-active); --bg-color: var(--neutral-colors-base-active); }
1647  @media (hover: hover) and (pointer: fine) {
1648  .chip--skin-tertiary-active:hover { --border-color: var(--neutral-colors-base-active-action); --start-icon-color: var(--neutral-colors-text-active-action); --text-color: var(--neutral-colors-text-active-action); --end-icon-color: var(--neutral-colors-text-active-action); --bg-color: var(--neutral-colors-base-active-action); }
1649}
1650  @media (hover: none) and (pointer: coarse) {
1651  .chip--skin-tertiary-active:active { --border-color: var(--neutral-colors-base-active-action); --start-icon-color: var(--neutral-colors-text-active-action); --text-color: var(--neutral-colors-text-active-action); --end-icon-color: var(--neutral-colors-text-active-action); --bg-color: var(--neutral-colors-base-active-action); }
1652}
1653  .chip--skin-positive { --border-color: var(--positive-colors-base-default); --start-icon-color: var(--positive-colors-text-default); --text-color: var(--positive-colors-text-default); --end-icon-color: var(--positive-colors-text-default); --bg-color: var(--positive-colors-base-default); }
1654  @media (hover: hover) and (pointer: fine) {
1655  .chip--skin-positive:hover { --border-color: var(--positive-colors-base-action); --start-icon-color: var(--positive-colors-text-action); --text-color: var(--positive-colors-text-action); --end-icon-color: var(--positive-colors-text-action); --bg-color: var(--positive-colors-base-action); }
1656}
1657  @media (hover: none) and (pointer: coarse) {
1658  .chip--skin-positive:active { --border-color: var(--positive-colors-base-action); --start-icon-color: var(--positive-colors-text-action); --text-color: var(--positive-colors-text-action); --end-icon-color: var(--positive-colors-text-action); --bg-color: var(--positive-colors-base-action); }
1659}
1660  .chip--skin-positive-active { --border-color: var(--positive-colors-base-active); --start-icon-color: var(--positive-colors-text-active); --text-color: var(--positive-colors-text-active); --end-icon-color: var(--positive-colors-text-active); --bg-color: var(--positive-colors-base-active); }
1661  @media (hover: hover) and (pointer: fine) {
1662  .chip--skin-positive-active:hover { --border-color: var(--positive-colors-base-active-action); --start-icon-color: var(--positive-colors-text-active-action); --text-color: var(--positive-colors-text-active-action); --end-icon-color: var(--positive-colors-text-active-action); --bg-color: var(--positive-colors-base-active-action); }
1663}
1664  @media (hover: none) and (pointer: coarse) {
1665  .chip--skin-positive-active:active { --border-color: var(--positive-colors-base-active-action); --start-icon-color: var(--positive-colors-text-active-action); --text-color: var(--positive-colors-text-active-action); --end-icon-color: var(--positive-colors-text-active-action); --bg-color: var(--positive-colors-base-active-action); }
1666}
1667  .chip--skin-negative { --border-color: var(--negative-colors-base-default); --start-icon-color: var(--negative-colors-text-default); --text-color: var(--negative-colors-text-default); --end-icon-color: var(--negative-colors-text-default); --bg-color: var(--negative-colors-base-default); }
1668  @media (hover: hover) and (pointer: fine) {
1669  .chip--skin-negative:hover { --border-color: var(--negative-colors-base-action); --start-icon-color: var(--negative-colors-text-action); --text-color: var(--negative-colors-text-action); --end-icon-color: var(--negative-colors-text-action); --bg-color: var(--negative-colors-base-action); }
1670}
1671  @media (hover: none) and (pointer: coarse) {
1672  .chip--skin-negative:active { --border-color: var(--negative-colors-base-action); --start-icon-color: var(--negative-colors-text-action); --text-color: var(--negative-colors-text-action); --end-icon-color: var(--negative-colors-text-action); --bg-color: var(--negative-colors-base-action); }
1673}
1674  .chip--skin-negative-active { --border-color: var(--negative-colors-base-active); --start-icon-color: var(--negative-colors-text-active); --text-color: var(--negative-colors-text-active); --end-icon-color: var(--negative-colors-text-active); --bg-color: var(--negative-colors-base-active); }
1675  @media (hover: hover) and (pointer: fine) {
1676  .chip--skin-negative-active:hover { --border-color: var(--negative-colors-base-active-action); --start-icon-color: var(--negative-colors-text-active-action); --text-color: var(--negative-colors-text-active-action); --end-icon-color: var(--negative-colors-text-active-action); --bg-color: var(--negative-colors-base-active-action); }
1677}
1678  @media (hover: none) and (pointer: coarse) {
1679  .chip--skin-negative-active:active { --border-color: var(--negative-colors-base-active-action); --start-icon-color: var(--negative-colors-text-active-action); --text-color: var(--negative-colors-text-active-action); --end-icon-color: var(--negative-colors-text-active-action); --bg-color: var(--negative-colors-base-active-action); }
1680}
1681  .chip--skin-success { --border-color: var(--success-colors-base-default); --start-icon-color: var(--success-colors-text-default); --text-color: var(--success-colors-text-default); --end-icon-color: var(--success-colors-text-default); --bg-color: var(--success-colors-base-default); }
1682  @media (hover: hover) and (pointer: fine) {
1683  .chip--skin-success:hover { --border-color: var(--success-colors-base-action); --start-icon-color: var(--success-colors-text-action); --text-color: var(--success-colors-text-action); --end-icon-color: var(--success-colors-text-action); --bg-color: var(--success-colors-base-action); }
1684}
1685  @media (hover: none) and (pointer: coarse) {
1686  .chip--skin-success:active { --border-color: var(--success-colors-base-action); --start-icon-color: var(--success-colors-text-action); --text-color: var(--success-colors-text-action); --end-icon-color: var(--success-colors-text-action); --bg-color: var(--success-colors-base-action); }
1687}
1688  .chip--skin-success-active { --border-color: var(--success-colors-base-active); --start-icon-color: var(--success-colors-text-active); --text-color: var(--success-colors-text-active); --end-icon-color: var(--success-colors-text-active); --bg-color: var(--success-colors-base-active); }
1689  @media (hover: hover) and (pointer: fine) {
1690  .chip--skin-success-active:hover { --border-color: var(--success-colors-base-active-action); --start-icon-color: var(--success-colors-text-active-action); --text-color: var(--success-colors-text-active-action); --end-icon-color: var(--success-colors-text-active-action); --bg-color: var(--success-colors-base-active-action); }
1691}
1692  @media (hover: none) and (pointer: coarse) {
1693  .chip--skin-success-active:active { --border-color: var(--success-colors-base-active-action); --start-icon-color: var(--success-colors-text-active-action); --text-color: var(--success-colors-text-active-action); --end-icon-color: var(--s
1693uccess-colors-text-active-action); --bg-color: var(--success-colors-base-active-action); }
1694}
1695  .chip--skin-warning { --border-color: var(--warning-colors-base-default); --start-icon-color: var(--warning-colors-text-default); --text-color: var(--warning-colors-text-default); --end-icon-color: var(--warning-colors-text-default); --bg-color: var(--warning-colors-base-default); }
1696  @media (hover: hover) and (pointer: fine) {
1697  .chip--skin-warning:hover { --border-color: var(--warning-colors-base-action); --start-icon-color: var(--warning-colors-text-action); --text-color: var(--warning-colors-text-action); --end-icon-color: var(--warning-colors-text-action); --bg-color: var(--warning-colors-base-action); }
1698}
1699  @media (hover: none) and (pointer: coarse) {
1700  .chip--skin-warning:active { --border-color: var(--warning-colors-base-action); --start-icon-color: var(--warning-colors-text-action); --text-color: var(--warning-colors-text-action); --end-icon-color: var(--warning-colors-text-action); --bg-color: var(--warning-colors-base-action); }
1701}
1702  .chip--skin-warning-active { --border-color: var(--warning-colors-base-active); --start-icon-color: var(--warning-colors-text-active); --text-color: var(--warning-colors-text-active); --end-icon-color: var(--warning-colors-text-active); --bg-color: var(--warning-colors-base-active); }
1703  @media (hover: hover) and (pointer: fine) {
1704  .chip--skin-warning-active:hover { --border-color: var(--warning-colors-base-active-action); --start-icon-color: var(--warning-colors-text-active-action); --text-color: var(--warning-colors-text-active-action); --end-icon-color: var(--warning-colors-text-active-action); --bg-color: var(--warning-colors-base-active-action); }
1705}
1706  @media (hover: none) and (pointer: coarse) {
1707  .chip--skin-warning-active:active { --border-color: var(--warning-colors-base-active-action); --start-icon-color: var(--warning-colors-text-active-action); --text-color: var(--warning-colors-text-active-action); --end-icon-color: var(--warning-colors-text-active-action); --bg-color: var(--warning-colors-base-active-action); }
1708}
1709  .chip--skin-error { --border-color: var(--error-colors-base-default); --start-icon-color: var(--error-colors-text-default); --text-color: var(--error-colors-text-default); --end-icon-color: var(--error-colors-text-default); --bg-color: var(--error-colors-base-default); }
1710  @media (hover: hover) and (pointer: fine) {
1711  .chip--skin-error:hover { --border-color: var(--error-colors-base-action); --start-icon-color: var(--error-colors-text-action); --text-color: var(--error-colors-text-action); --end-icon-color: var(--error-colors-text-action); --bg-color: var(--error-colors-base-action); }
1712}
1713  @media (hover: none) and (pointer: coarse) {
1714  .chip--skin-error:active { --border-color: var(--error-colors-base-action); --start-icon-color: var(--error-colors-text-action); --text-color: var(--error-colors-text-action); --end-icon-color: var(--error-colors-text-action); --bg-color: var(--error-colors-base-action); }
1715}
1716  .chip--skin-error-active { --border-color: var(--error-colors-base-active); --start-icon-color: var(--error-colors-text-active); --text-color: var(--error-colors-text-active); --end-icon-color: var(--error-colors-text-active); --bg-color: var(--error-colors-base-active); }
1717  @media (hover: hover) and (pointer: fine) {
1718  .chip--skin-error-active:hover { --border-color: var(--error-colors-base-active-action); --start-icon-color: var(--error-colors-text-active-action); --text-color: var(--error-colors-text-active-action); --end-icon-color: var(--error-colors-text-active-action); --bg-color: var(--error-colors-base-active-action); }
1719}
1720  @media (hover: none) and (pointer: coarse) {
1721  .chip--skin-error-active:active { --border-color: var(--error-colors-base-active-action); --start-icon-color: var(--error-colors-text-active-action); --text-color: var(--error-colors-text-active-action); --end-icon-color: var(--error-colors-text-active-action); --bg-color: var(--error-colors-base-active-action); }
1722}
1723  @keyframes chip-rotate { 
1724  100% { transform: rotate(360deg); }
1725}
1726  .chip { display: inline-grid; align-items: center; justify-content: center; vertical-align: top; max-width: 100%; background-color: var(--bg-color); border-style: solid; border-color: var(--border-color); transition-property: background-color, border; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); cursor: pointer; overflow: hidden; position: relative; grid-template-columns: var(--chip-grid-cols, auto); width: var(--chip-width, auto); pointer-events: var(--chip-pointer-events, auto); }
1727  .chip--large { height: 40px; border-width: 1px; border-radius: var(--corner-radius-r8); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
1728  .chip--large .chip__interactive-area { gap: var(--spacings-s2); padding: calc(var(--spacings-s10) - 1px) calc(var(--spacings-s10) - 1px);
1728 padding-inline-end: var(--chip-ia-pie, calc(var(--spacings-s10) - 1px)); }
1729  .chip--large .chip__icon-holder { flex: 0 0 20px; width: 20px; height: 20px; }
1730  .chip--large .chip__text { padding: var(--spacings-s0) var(--spacings-s2); }
1731  .chip--large .chip__badge { margin: 0 var(--spacings-s2); }
1732  .chip--large .chip__dismiss-button, .chip--large .chip__dismiss-icon { width: 40px; height: 40px; }
1733  .chip--large .chip__dismiss-icon { width: 20px; height: 20px; }
1734  .chip--small { height: 32px; border-width: 1px; border-radius: var(--corner-radius-r8); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
1735  .chip--small .chip__interactive-area { gap: var(--spacings-s2); padding: calc(var(--spacings-s6) - 1px) calc(var(--spacings-s6) - 1px); padding-inline-end: var(--chip-ia-pie, calc(var(--spacings-s6) - 1px)); }
1736  .chip--small .chip__icon-holder { flex: 0 0 20px; width: 20px; height: 20px; }
1737  .chip--small .chip__text { padding: var(--spacings-s0) var(--spacings-s2); }
1738  .chip--small .chip__badge { margin: 0 var(--spacings-s2); }
1739  .chip--small .chip__dismiss-button { width: 32px; height: 32px; }
1740  .chip--small .chip__dismiss-icon { width: 20px; height: 20px; }
1741  .chip__interactive-area { min-width: 0px; display: flex; align-items: center; visibility: var(--chip-ia-visibility, visible); }
1742  .chip__icon { display: block; width: 100%; height: 100%; }
1743  .chip__icon-holder { min-width: 0px; }
1744  .chip__icon-holder path { fill: var(--start-icon-color); transition: fill var(--timings-default) var(--easings-ease); }
1745  .chip__loading-icon { animation: chip-rotate var(--timings-long) var(--easings-linear) infinite; }
1746  .chip__loading-icon-layout { position: absolute; inset: 0px; margin: auto; fill: var(--end-icon-color); width: 24px; height: 24px; }
1747  .chip__text-wrap { min-width: 0px; flex-grow: 1; color: var(--text-color); text-align: center; word-break: break-all; }
1748  .chip__text { width: 100%; color: var(--text-color); text-align: center; word-break: break-all; max-width: 100%; display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition: color var(--timings-default) var(--easings-ease); }
1749  .chip__badge { min-width: 0px; }
1750  .chip__dismiss-button { display: grid; place-items: center; min-width: 0px; cursor: pointer; }
1751  .chip__dismiss-icon path { fill: var(--end-icon-color); transition: fill var(--timings-default) var(--easings-ease); }
1752}
1753@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1754@layer ds-atoms {
1755  .checkbox { display: inline-flex; column-gap: var(--spacings-s2); padding: var(--spacings-s6) 0; color: var(--text-colors-base); }
1756  .checkbox__box { display: inline-block; vertical-align: top; position: relative; flex: 0 0 auto; width: 20px; height: 20px; }
1757  .checkbox__control { display: inline-block; vertical-align: top; position: absolute; inset: 0px; width: 100%; height: 100%; }
1758  .checkbox__control--pointer { cursor: pointer; }
1759  .checkbox__control--not-allowed { cursor: not-allowed; }
1760  .checkbox__icon { display: block; width: 100%; height: 100%; transition: color var(--timings-default) var(--easings-ease); }
1761  .checkbox__icon > path:not([fill]) { fill: currentcolor; }
1762  .checkbox__label { display: flex; align-items: center; padding: var(--spacings-s0) var(--spacings-s2); font-weight: 600; user-select: none; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
1763  .checkbox__label--pointer { cursor: pointer; }
1764  .checkbox--default .checkbox__icon { color: var(--control-colors-start-icon-default); }
1765  @media (hover: hover) and (pointer: fine) {
1766  .checkbox--default-interactive:hover .checkbox__icon { color: var(--control-colors-start-icon-action); }
1767}
1768  @media (hover: none) and (pointer: coarse) {
1769  .checkbox--default-interactive:active .checkbox__icon { color: var(--control-colors-start-icon-action); }
1770}
1771  .checkbox--skin-primary.checkbox--active .checkbox__icon { color: var(--primary-colors-base-active); }
1772  .checkbox--skin-primary.checkbox--active .checkbox__icon > path[fill] { fill: var(--primary-colors-base-active); }
1773  @media (hover: hover) and (pointer: fine) {
1774  .checkbox--skin-primary.checkbox--active-interactive:hover .checkbox__icon { color: var(--primary-colors-base-active-action); }
1775  .checkbox--skin-primary.checkbox--active-interactive:hover .checkbox__icon > path[fill] { fill: var(--primary-colors-base-active-action); }
1776}
1777  @media (hover: none) and (pointer: coarse) {
1778  .checkbox--skin-primary.checkbox--active-interactive:active .checkbox__icon { color: var(--primary-colors-base-active-action); }
1779  .checkbox--skin-primary.checkbox--active-interactive:active .checkbox__icon > path[fill] { fill: var(--primary-colors-base-active-action); }
1780}
1781  .checkbox--skin-premium.checkbox--active .checkbox__icon { color: var(--monetization-ultra-colors-base-active); }
1782  .checkbox--skin-premium.checkbox--active .checkbox__icon > path[fill] { fill: var(--monetization-ultra-colors-base-active); }
1783  @media (hover: hover) and (pointer: fine) {
1784  .checkbox--skin-premium.checkbox--active-interactive:hover .checkbox__icon { color: var(--monetization-ultra-colors-base-active-action); }
1785  .checkbox--skin-premium.checkbox--active-interactive:hover .checkbox__icon > path[fill] { fill: var(--monetization-ultra-colors-base-active-action); }
1786}
1787  @media (hover: none) and (pointer: coarse) {
1788  .checkbox--skin-premium.checkbox--active-interactive:active .checkbox__icon { color: var(--monetization-ultra-colors-base-active-action); }
1789  .checkbox--skin-premium.checkbox--active-interactive:active .checkbox__icon > path[fill] { fill: var(--monetization-ultra-colors-base-active-action); }
1790}
1791  .checkbox--disabled { opacity: var(--states-disabled); }
1792}
1793@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1794@layer ds-atoms {
1795  .picsart-lockup { --picsart-lockup-brand-color: var(--brand-colors-default); --picsart-lockup-name-color: var(--brand-colors-dark); }
1796  html.dark .picsart-lockup { --picsart-lockup-name-color: var(--brand-colors-light); }
1797  .picsart-lockup__brand { fill: var(--picsart-lockup-brand-color); }
1798  .picsart-lockup__name { fill: var(--picsart-lockup-name-color); }
1799}
1800@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1801@layer ds-atoms {
1802  .tag { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; gap: var(--spacings-s4); border-radius: var(--corner-radius-r16); padding: var(--spacings-s0) var(--spacings-s6); }
1803  .tag--size-large { height: 20px; }
1804  .tag--size-small { height: 14px; }
1805  .tag--size-small .tag__icon { width: 10px; height: 10px; }
1806  .tag--low-prio { gap: 0px; padding: 0px; border-radius: var(--corner-radius-circle); }
1807  .tag--low-prio.tag--size-large { width: 20px; min-width: 20px; }
1808  .tag--low-prio.tag--size-small { width: 14px; min-width: 14px; }
1809  .tag--skin-black { background-color: var(--absolute-black-colors-base-default); color: var(--absolute-black-colors-text-default); }
1810  .tag--skin-negative { background-color: var(--negative-colors-base-default); color: var(--negative-colors-text-default); }
1811  .tag--skin-primary { background: linear-gradient(90deg, rgb(194, 9, 193), rgb(247, 73, 246)); color: var(--primary-colors-text-default); }
1812  .tag--skin-error { background: linear-gradient(90deg, rgb(238, 52, 70), rgb(255, 97, 112)); color: var(--error-colors-text-default); }
1813  .tag--skin-info { background: linear-gradient(90deg, rgb(34, 175, 236), rgb(111, 212, 255)); color: var(--information-colors-text-default); }
1814  .tag--skin-warning { background: linear-gradient(90deg, rgb(255, 146, 30), rgb(255, 146, 30)); color: var(--warning-colors-text-default); }
1815  .tag--skin-success { background: linear-gradient(90deg, rgb(5, 208, 143), rgb(5, 208, 143)); color: var(--success-colors-text-default); }
1816  .tag--skin-plus { background: var(--gradients-monetization-plus); color: var(--monetization-plus-colors-text-default); }
1817  .tag--skin-pro { background: var(--gradients-monetization-pro); color: var(--monetization-pro-colors-text-default); }
1818  .tag--skin-ultra { background: var(--gradients-monetization-ultra); color: var(--monetization-ultra-colors-text-default); }
1819  .tag--mode-muted.tag--skin-black { background-color: var(--absolute-white-colors-base-default); color: var(--absolute-white-colors-text-default); }
1820  .tag--mode-muted.tag--skin-negative { background-color: var(--background-colors-tint-3); color: var(--text-colors-base); }
1821  .tag--mode-muted.tag--skin-primary { background: rgb(60, 27, 60); color: rgb(255, 71, 255); }
1822  .tag--mode-muted.tag--skin-error { background: rgb(64, 29, 32); color: rgb(255, 93, 109); }
1823  .tag--mode-muted.tag--skin-info { background: rgb(17, 38, 70); color: rgb(122, 215, 255); }
1824  .tag--mode-muted.tag--skin-warning { background: rgb(70, 43, 0); color: rgb(255, 185, 73); }
1825  .tag--mode-muted.tag--skin-success { background: rgb(20, 51, 41); color: rgb(65, 255, 195); }
1826  .tag--mode-muted.tag--skin-plus { background: rgb(72, 8, 79); color: rgb(239, 94, 255); }
1827  .tag--mode-muted.tag--skin-pro { background: rgb(49, 10, 113); color: rgb(183, 138, 255); }
1828  .tag--mode-muted.tag--skin-ultra { background: rgb(0, 71, 69); color: rgb(36, 199, 194); }
1829  .tag__text { color: inherit; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
1830  .tag__icon { width: 12px; height: 12px; }
1831  .tag__icon > path:not([fill]) { fill: currentcolor; }
1832}
1833@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1834@layer ds-molecules {
1835  .select { display: grid; grid-auto-flow: column; width: 100%; }
1836  .select__menu { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: var(--spacings-s8); background-color: var(--background-colors-popover); border-radius: var(--spacings-s8); border: 1px solid var(--control-colors-border-default); overscroll-behavior: contain; }
1837  .select__menu--large, .select__menu--small { padding: calc(var(--spacings-s12) - 1px); }
1838  @media (pointer: fine) {
1839  .select__menu::-webkit-scrollbar { width: 4px; }
1840  .select__menu::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; margin-block: var(--spacings-s4); }
1841  .select__menu::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
1842  .select__menu::-webkit-scrollbar-corner { background: transparent; }
1843}
1844  @supports (-moz-appearance: none) {
1845  .select__menu { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
1846}
1847  @media (hover: none) and (pointer: coarse) {
1848  .select__menu::-webkit-scrollbar { display: none; }
1849}
1850  .select__mobile-menu { display: flex; flex-direction: column; align-items: flex-start; padding: var(--spacings-s4) var(--spacings-s8); gap: var(--spacings-s8); }
1851  .select__invisible-content { visibility: hidden; opacity: 0; pointer-events: none; }
1852  .select__badges { display: inline-flex; align-items: center; margin-inline-start: auto; gap: var(--spacings-s8); padding-inline-start: var(--spacings-s4); }
1853  .select__badge { box-shadow: none; }
1854}
1855@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1856@layer ds-atoms {
1857  .slider { --track-height: 4px; --track-filled-height: calc(var(--track-height) / 2); --thumb-size: 16px; --thumb-border-width: var(--slider-thumb-border-width, 0); --mark-thumb-size: 8px; position: relative; display: grid; align-items: center; width: 100%; height: calc(var(--thumb-size) + 2 * var(--spacings-s8)); }
1858  .slider--centered::before { content: ""; position: absolute; width: var(--mark-thumb-size); height: var(--mark-thumb-size); border: 1px solid var(--control-colors-border-default); background: var(--control-colors-slider-thumb-default); border-radius: var(--corner-radius-circle); box-sizing: border-box; pointer-events: none; top: 50%; z-index: 1; }
1859  [dir="ltr"] .slider--centered::before { left: 50%; transform: translate(-50%, -50%); }
1860  [dir="rtl"] .slider--centered::before { right: 50%; transform: translate(50%, -50%); }
1861  .slider--disabled { pointer-events: none; opacity: var(--states-disabled); }
1862  .slider__content-wrap { position: relative; height: 100%; }
1863  .slider__progress { display: grid; grid-area: 1 / 1; height: var(--track-filled-height); margin: var(--spacings-s0); margin-inline-end: var(--slider-track-inner-x-gap, var(--thumb-size)); border-radius: var(--corner-radius-r4); pointer-events: none; overflow: hidden; }
1864  .slider__progress--continuous::before { content: ""; grid-area: 1 / 1; background: var(--control-colors-slider-track-default); will-change: transform; }
1865  [dir="ltr"] .slider__progress--continuous::before { transform: var(--slider-progress-transform-ltr, translateX(-100%)); }
1866  [dir="rtl"] .slider__progress--continuous::before { transform: var(--slider-progress-transform-rtl, translateX(100%)); }
1867  .slider__progress--centered-grid { grid-template-columns: repeat(2, 1fr); }
1868  .slider__progress-side { display: grid; overflow: hidden; }
1869  .slider__progress-side::before { background: var(--control-colors-slider-track-default); will-change: transform; }
1870  .slider__progress-side--start::before { content: var(--slider-progress-start-content, none); }
1871  [dir="ltr"] .slider__progress-side--start::before { transform: var(--slider-progress-start-transform-ltr); }
1872  [dir="rtl"] .slider__progress-side--start::before { transform: var(--slider-progress-start-transform-rtl); }
1873  .slider__progress-side--end::before { content: var(--slider-progress-end-content, none); }
1874  [dir="ltr"] .slider__progress-side--end::before { transform: var(--slider-progress-end-transform-ltr); }
1875  [dir="rtl"] .slider__progress-side--end::before { transform: var(--slider-progress-end-transform-rtl); }
1876  .slider__marks-wrap { display: grid; grid-area: 1 / 1; height: var(--mark-thumb-size); pointer-events: none; }
1877  .slider__marks-wrap--centered { grid-template-columns: repeat(2, 1fr); }
1878  .slider__mark-side { position: relative; }
1879  .slider__mark { position: absolute; width: var(--mark-thumb-size); height: var(--mark-thumb-size); border: 1px solid var(--control-colors-border-default); background: var(--control-colors-slider-thumb-default); border-radius: var(--corner-radius-circle); box-sizing: border-box; pointer-events: none; }
1880  .slider__mark--continuous { top: 50%; }
1881  [dir="ltr"] .slider__mark--continuous { left: var(--x); transform: translate(calc(-1 * var(--x))) translateY(-50%); }
1882  [dir="rtl"] .slider__mark--continuous { right: var(--x); transform: translate(calc(var(--x))) translateY(-50%); }
1883  .slider__mark--centered { top: var(--spacings-s0); }
1884  [dir="ltr"] .slider__mark--centered { left: var(--x); transform: translate(calc(-1 * var(--x))); }
1885  [dir="rtl"] .slider__mark--centered { right: var(--x); transform: translate(calc(var(--x))); }
1886  .slider__mark--disabled { background: var(--control-colors-border-default); }
1887  .slider__wrap { display: grid; align-items: center; width: 100%; height: 100%; }
1888  .slider__wrap::before { content: ""; display: block; position: absolute; top: 50%; left: var(--spacings-s0); right: var(--spacings-s0); transform: translateY(-50%); background: var(--slider-track-bg, var(--control-colors-border-default)); height: var(--track-height); border-radius: var(--corner-radius-r4); }
1889  .slider__input { position: relative; grid-area: 1 / 1; width: 100%; height: 100%; background: transparent; appearance: none; z-index: 1; }
1890  .slider__input::-webkit-slider-thumb { width: var(--thumb-size); height: var(--thumb-size); box-shadow: 0 0 0 var(--thumb-border-width) var(--control-colors-slider-thumb-default) inset; border-radius: var(--corner-radius-circle); filter: drop-shadow(rgba(0, 0, 0, 0.24) 0px 0px 4px); appearance: none; transition: box-shadow var(--timings-default); cursor: pointer; background-image: ; background-position-x: ; background-position-y: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; background-color: ; background-size: var(--slider-thumb-bg-size, auto); }
1891  [dir="ltr"] .slider__input::-webkit-slider-thumb { background-position: var(--slider-thumb-bg-position-ltr, 0%); }
1892  [dir="rtl"] .slider__input::-webkit-slider-thumb { background-position: var(--slider-thumb-bg-position-rtl, 0%); }
1893  .slider__input::-webkit-slider-thumb:hover { box-shadow: 0 0 0 1px var(--control-colors-border-action) inset; }
1894  .slider__input:active::-webkit-slider-thumb { box-shadow: 0 0 0 2px var(--control-colors-border-active) inset; }
1895}
1896@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
1897@layer ds-atoms {
1898  .image-frame { position: relative; display: inline-grid; overflow: hidden; width: var(--imageframe-width); height: var(--imageframe-height); border-radius: var(--imageframe-border-radius, 0); }
1899  .image-frame::before { content: ""; position: absolute; inset: 0px; z-index: 1; border: 1px solid var(--background-colors-tint-2); border-radius: var(--imageframe-border-radius, 0); opacity: 0; transition: opacity var(--timings-default) var(--easings-ease); pointer-events: none; }
1900  .image-frame--bg { background-color: var(--background-colors-tint-1); }
1901  .image-frame--interactive { cursor: pointer; }
1902  .image-frame--interactive::before { opacity: 1; }
1903  @media (hover: hover) and (pointer: fine) {
1904  .image-frame--interactive:hover::before { opacity: 0; }
1905}
1906  .image-frame--active-border::before { border-color: var(--primary-colors-base-default); }
1907  @media (hover: hover) and (pointer: fine) {
1908  .image-frame--active-border:hover::before { opacity: 0.7; }
1909}
1910  .image-frame--transparent { background-image: conic-gradient(var(--background-colors-tint-1) 90deg,var(--background-colors-tint-3) 0 180deg,var(--background-colors-tint-1) 0 270deg,var(--background-colors-tint-3) 0); background-size: 8px 8px; background-clip: content-box; padding: var(--spacings-s2); }
1911  .image-frame--disabled { opacity: var(--states-disabled); pointer-events: none; }
1912  .image-frame__content { grid-area: 1 / 1; min-height: 0px; min-width: 0px; pointer-events: none; }
1913  .image-frame__content * { pointer-events: initial; }
1914}
1915</style>
1916    <style data-prerender-css data-original-href="/assets/picsart-rc-vendor-CsIoZm_u.css">
1917.AuthCard-root-c4e85 { position: relative; max-width: 416px; height: 540px; border-radius: var(--corner-radius-r16); background-color: var(--positive-colors-base-default); box-shadow: 0 4px 16px var(--background-colors-tint-3); overflow: hidden; }
1918@media screen and (max-width: 768px) {
1919  .AuthCard-root-c4e85 { height: 100%; }
1920}
1921.AuthMedia-root-464de { --auth-media-progress-height: 2px; position: relative; display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; border-radius: var(--corner-radius-r16); overflow: hidden; }
1922.AuthMedia-media-b55ce.AuthMedia-media-b55ce { position: absolute; inset: 0px; height: 100%; width: 100%; object-fit: cover; object-position: center center; display: block; opacity: 0; transition: opacity 0.32s ease-out; }
1923.AuthMedia-poster-24241.AuthMedia-poster-24241 { z-index: 0; opacity: 1; transition: none; }
1924video.AuthMedia-mediavideo-5c079.AuthMedia-media-b55ce { z-index: 1; }
1925.AuthMedia-mediaLoaded-a9f4d.AuthMedia-mediaLoaded-a9f4d { opacity: 1; }
1926@media (prefers-reduced-motion: reduce) {
1927  .AuthMedia-media-b55ce.AuthMedia-media-b55ce { opacity: 1; transition: none; }
1928}
1929.AuthMedia-skeleton-fbfad { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
1930.AuthMedia-card-d119c { position: absolute; left: var(--spacings-s12); bottom: calc(var(--spacings-s12) + var(--auth-media-progress-height) + var(--spacings-s12)); display: flex; align-items: center; gap: var(--spacings-s8); min-width: 0px; max-width: calc(100% - var(--spacings-s24)); padding: var(--spacings-s8); padding-inline-end: var(--spacings-s16); border-radius: var(--corner-radius-r12); background: var(--background-colors-popover); }
1931.AuthMedia-cardIcon-9f58a.AuthMedia-cardIcon-9f58a { flex-shrink: 0; width: 40px; height: 40px; border-radius: var(--corner-radius-r12); object-fit: cover; }
1932.AuthMedia-cardText-bf90f { display: flex; flex-direction: column; gap: var(--spacings-s2); min-width: 0px; }
1933.AuthMedia-cardTitle-6d136.AuthMedia-cardTitle-6d136 { color: var(--text-colors-base); }
1934.AuthMedia-cardDescription-4ea8b.AuthMedia-cardDescription-4ea8b { color: var(--text-colors-tint-1); }
1935.AuthMedia-progress-a290d { position: absolute; bottom: var(--spacings-s12); left: var(--spacings-s12); right: var(--spacings-s12); display: flex; gap: var(--spacings-s4); }
1936.AuthMedia-segment-13c7c { flex: 1 1 0%; height: var(--auth-media-progress-height); padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r4); background: rgba(255, 255, 255, 0.35); cursor: pointer; overflow: hidden; }
1937.AuthMedia-segmentFill-8baf3 { display: block; height: 100%; width: 100%; border-radius: inherit; background: rgba(255, 255, 255, 0.95); transform: scaleX(0); transform-origin: left center; will-change: transform; }
1938.AuthMedia-segmentFill-8baf3[data-active="true"] { transition: transform 0.26s linear; }
1939@media (prefers-reduced-motion: reduce) {
1940  .AuthMedia-segmentFill-8baf3.AuthMedia-segmentFill-8baf3 { transition: none; }
1941}
1942.withAuthModal-root-6de60 { position: relative; display: flex; flex-direction: row-reverse; justify-content: space-between; }
1943.withAuthModal-root-6de60[data-media-position="left"] { flex-direction: row; }
1944.withAuthModal-root-6de60 { align-items: center; max-height: 100dvh; height: 540px; width: 830px; max-width: 100%; border-radius: var(--corner-radius-r20); padding: var(--spacings-s8); background: var(--background-colors-base); border: 1px solid var(--control-colors-border-default); box-sizing: border-box; box-shadow: var(--shadows-tint-1); overflow-x: hidden; }
1945.withAuthModal-root-6de60 > div { width: 50%; }
1946.withAuthModal-root-6de60 img { height: 536px; width: 408px; }
1947@media screen and (max-width: 768px) {
1948  .withAuthModal-root-6de60 { position: absolute; top: var(--spacings-s0); left: var(--spacings-s0); justify-content: center; width: 100%; max-width: none; height: 100dvh; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; border-radius: var(--corner-radius-r0); }
1949  .withAuthModal-root-6de60 > div { width: 100%; }
1950}
1951.withAuthModal-modalCloseWrapper-55da0.withAuthModal-modalCloseWrapper-55da0 { display: inline-block; width: initial; z-index: 1; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; }
1952.withAuthModal-image-f6d62 { display: flex; align-items: center; justify-content: center; height: 100%; border-radius: var(--corner-radius-r20); overflow: hidden; position: relative; }
1953@media (max-width: 768px) {
1954  .withAuthModal-image-f6d62 { display: none; }
1955}
1956.withAuthModal-skeleton-ff27a { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
1957.withAuthModal-closeButton-fcc8b { position: absolute; top: var(--spacings-s12); right: var(--spacings-s12); cursor: pointer; fill: var(--negative-colors-text-default); }
1958@media (max-width: 768px) {
1959  .withAuthModal-closeButton-fcc8b.withAuthModal-closeButton-fcc8b { z-index: 9; fill: var(--positive-colors-text-default); }
1960}
1961.withAuthModal-root-6de60[data-media-position="left"] .withAuthModal-closeButton-fcc8b { fill: var(--positive-colors-text-default); }
1962@media (max-width: 768px) {
1963  .withAuthModal-root-6de60[data-media-position="left"] .withAuthModal-closeButton-fcc8b { fill: var(--negative-colors-text-default); }
1964}
1965.withAuthModal-pulseContainer-84333 { position: absolute; }
1966.withAuthModal-overlay-5dd2b.withAuthModal-overlay-5dd2b { background: var(--background-colors-transparent); backdrop-filter: blur(24px); }
1967@keyframes withAuthModal-overlay-fade-in-01bf1 { 
1968  0% { opacity: 0; }
1969  100% { opacity: 1; }
1970}
1971@media (prefers-reduced-motion: reduce) {
1972  .withAuthModal-root-3367f.withAuthModal-root-3367f { animation: auto ease 0s 1 normal none running none; }
1973}
1974.withAuthModal-root-3367f { --auth-modal-padding: var(--spacings-s12); --auth-panel-padding: var(--spacings-s12); --auth-corner-inset: calc(var(--auth-modal-padding) + var(--auth-panel-padding)); position: relative; display: flex; flex-direction: row-reverse; justify-content: space-between; }
1975.withAuthModal-root-3367f[data-media-position="left"] { flex-direction: row; }
1976.withAuthModal-root-3367f { align-items: stretch; height: min(656px,54.6666666667vw,100dvh - var(--spacings-s24)); width: calc(min(656px,54.6666666667vw,100dvh - var(--spacings-s24)) * 1030 / 656); min-height: 500px; max-width: 1030px; border-radius: var(--corner-radius-r16); padding: var(--auth-modal-padding); background: var(--background-colors-base); border: 1px solid var(--control-colors-border-default); box-sizing: border-box; box-shadow: var(--shadows-tint-1); overflow: hidden; animation: 0.2s cubic-bezier(0, 0, 0.2, 1) 0s 1 normal none running withAuthModal-overlay-fade-in-01bf1; }
1977.withAuthModal-root-3367f > div { width: 50%; }
1978@media screen and (max-width: 834px) {
1979  .withAuthModal-root-3367f > div { width: 100%; }
1980}
1981@media screen and (max-width: 768px) {
1982  .withAuthModal-root-3367f { position: absolute; top: var(--spacings-s0); left: var(--spacings-s0); justify-content: center; width: 100%; max-width: none; height: 100dvh; min-height: 0px; max-height: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; border-radius: var(--corner-radius-r0); }
1983  .withAuthModal-root-3367f > div { width: 100%; }
1984}
1985.withAuthModal-modalCloseWrapper-bf4c4.withAuthModal-modalCloseWrapper-bf4c4 { position: absolute; top: var(--auth-corner-inset); right: var(--auth-corner-inset); z-index: 1; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0px; border-radius: 50%; background: var(--neutral-colors-base-default); border: 1px solid var(--control-colors-border-default); cursor: pointer; }
1986.withAuthModal-image-ee310 { display: flex; align-items: center; justify-content: center; align-self: stretch; border-radius: var(--corner-radius-r16); overflow: hidden; position: relative; }
1987@media (max-width: 834px) {
1988  .withAuthModal-image-ee310 { display: none; }
1989}
1990.withAuthModal-skeleton-e2535 { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
1991.withAuthModal-closeButton-458b5 { cursor: pointer; fill: var(--text-colors-base); stroke: var(--text-colors-base); stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; }
1992.withAuthModal-pulseContainer-401b9 { position: absolute; }
1993.AuthForm-root-d6c75 { height: 100%; }
1994.AuthForm-scrollable-cbf9f { overflow-y: scroll; }
1995@media (hover: hover) and (pointer: fine) {
1996  .AuthForm-scrollable-cbf9f::-webkit-scrollbar { width: 4px; }
1997  .AuthForm-scrollable-cbf9f::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
1998  .AuthForm-scrollable-cbf9f::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
1999  .AuthForm-scrollable-cbf9f::-webkit-scrollbar-corner { background: transparent; }
2000}
2001@supports (-moz-appearance: none) {
2002  .AuthForm-scrollable-cbf9f { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2003}
2004@media (hover: none) and (pointer: coarse) {
2005  .AuthForm-scrollable-cbf9f::-webkit-scrollbar { display: none; }
2006}
2007.Footer-root-6b75a { display: flex; gap: var(--spacings-s16); align-content: end; padding-top: var(--spacings-s6); width: 100%; }
2008.TopBackButton-root-beec4 { display: flex; justify-content: flex-start; flex-shrink: 0; }
2009.TopBackButton-button-16752.TopBackButton-button-16752.TopBackButton-button-16752.TopBackButton-button-16752 { display: flex; align-items: center; justify-content: center; width: 34px; min-width: initial; height: 34px; padding: 0px; border-radius: 50%; background: var(--neutral-colors-base-default); border: 1px solid var(--control-colors-border-default); color: var(--text-colors-base); }
2010.TopBackButton-button-16752.TopBackButton-button-16752.TopBackButton-button-16752.TopBackButton-button-16752 svg { width: 15px; height: 15px; stroke: currentcolor; stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; }
2011.TopBackButton-button-16752.TopBackButton-button-16752.TopBackButton-button-16752.TopBackButton-button-16752:hover { background: var(--neutral-colors-base-action); }
2012.NoInternet-root-00830 { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2013.NoInternet-formContent-2fe85 { display: grid; gap: var(--spacings-s16); }
2014.NoInternet-passwordField-5a2b9 { width: 100%; }
2015.NoInternet-rootNewDesign-4c82b { justify-content: flex-start; }
2016.NoInternet-content-a4cad { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; gap: var(--spacings-s24); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2017.NoInternet-content-a4cad::-webkit-scrollbar { display: none; }
2018@media screen and (max-width: 768px) {
2019  .NoInternet-content-a4cad { padding: var(--spacings-s0); }
2020}
2021.PicsartLegal-root-bba81 { max-width: 320px; margin: var(--spacings-s0) auto; }
2022.PicsartLegal-root-bba81 a { font-weight: 600; color: var(--primary-colors-base-default); }
2023.PicsartLegal-root-bba81 a:hover { color: var(--primary-colors-base-active-action); }
2024.PicsartLegal-link-fe0cb { font-weight: 600; color: var(--primary-colors-base-default); }
2025.PicsartLegal-link-fe0cb:hover { color: var(--primary-colors-base-active-action); }
2026.AppleButton-button-dff86 { overflow: hidden; }
2027.GoogleButton-googleSignInWrapper-6f97a { overflow: hidden; position: relative; width: 100%; }
2028.GoogleButton-googleSignInVisual-9365a { pointer-events: none; height: 100%; z-index: 2; }
2029.GoogleButton-googleNativeButton-4bca9 { top: 0px; left: 0px; position: absolute; height: 100%; width: 100%; overflow: hidden; opacity: 0.001; }
2030.GoogleButton-googleNativeButton-4bca9 > div { margin-top: var(--spacings-s4); height: 100%; }
2031.GoogleButton-googleNativeButton-4bca9 > div div:last-child { margin-top: var(--spacings-s4); height: 100%; }
2032.GoogleButton-googleNativeButton-4bca9:hover + .GoogleButton-googleSignInVisual-9365a > .google-new-button { background-color: var(--neutral-colors-base-action); color: var(--neutral-colors-text-action); }
2033.AuthButtons-root-baf3b { display: grid; gap: var(--spacings-s8); }
2034.AuthButtons-socialButton-a4c6d { position: relative; padding-left: var(--spacings-s44); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
2035.AuthButtons-socialButton-a4c6d > svg { position: absolute; left: var(--spacings-s12); }
2036.AuthButtons-facebookButton-bb2c1 > svg { color: var(--absolute-white-colors-base-default); }
2037.AuthButtons-divider-0e8a9 { display: flex; justify-content: center; align-items: center; color: var(--text-colors-tint-2); text-transform: uppercase; }
2038.AuthButtons-divider-0e8a9::after, .AuthButtons-divider-0e8a9::before { content: ""; display: block; background-color: var(--background-colors-tint-3); width: 32px; height: 1px; margin: var(--spacings-s0) var(--spacings-s8); }
2039.OptionsForm-root-d2fb6 { display: grid; gap: var(--spacings-s16); text-align: center; }
2040.OptionsForm-divider-ab6db { display: flex; justify-content: center; align-items: center; color: var(--text-colors-tint-2); text-transform: uppercase; }
2041.OptionsForm-divider-ab6db::after, .OptionsForm-divider-ab6db::before { content: ""; display: block; background-color: var(--background-colors-tint-3); width: 32px; height: 1px; margin: var(--spacings-s0) var(--spacings-s8); }
2042.OptionsForm-rootNewDesign-acab8.OptionsForm-rootNewDesign-acab8 { display: flex; flex-direction: column; height: 100%; padding: var(--spacings-s0); text-align: left; }
2043.OptionsForm-contentNewDesign-e4dbf { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; gap: var(--spacings-s16); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2044.OptionsForm-contentNewDesign-e4dbf::-webkit-scrollbar { display: none; }
2045@media screen and (max-width: 768px) {
2046  .OptionsForm-contentNewDesign-e4dbf { padding: var(--spacings-s0); }
2047}
2048.OptionsForm-legalNewDesign-16214 { flex-shrink: 0; padding: var(--spacings-s0) var(--spacings-s32); }
2049.OptionsForm-legalNewDesign-16214 > span { max-width: none; margin-inline: var(--spacings-s0); font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
2050@media screen and (min-width: 833px) and (max-width: 1030px) {
2051  .OptionsForm-legalNewDesign-16214 > span { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
2052}
2053@media screen and (max-width: 768px) {
2054  .OptionsForm-legalNewDesign-16214 { padding: var(--spacings-s0); }
2055}
2056.RecentLoginMethods-root-c38fc { display: grid; gap: var(--spacings-s24); text-align: center; align-content: center; height: 100%; }
2057.RecentLoginMethods-options-a698f { display: grid; gap: var(--spacings-s8); }
2058.RecentLoginMethods-rootNewDesign-05033.RecentLoginMethods-rootNewDesign-05033 { display: flex; flex-direction: column; padding: var(--spacings-s0); text-align: left; }
2059.RecentLoginMethods-contentNewDesign-c28c9 { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; gap: var(--spacings-s24); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2060.RecentLoginMethods-contentNewDesign-c28c9::-webkit-scrollbar { display: none; }
2061@media screen and (max-width: 768px) {
2062  .RecentLoginMethods-contentNewDesign-c28c9 { padding: var(--spacings-s0); }
2063}
2064.RecentLoginMethods-legalNewDesign-65c94 { flex-shrink: 0; padding: var(--spacings-s0) var(--spacings-s32); }
2065.RecentLoginMethods-legalNewDesign-65c94 > span { max-width: none; margin-inline: var(--spacings-s0); font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
2066@media screen and (min-width: 833px) and (max-width: 1030px) {
2067  .RecentLoginMethods-legalNewDesign-65c94 > span { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
2068}
2069@media screen and (max-width: 768px) {
2070  .RecentLoginMethods-legalNewDesign-65c94 { padding: var(--spacings-s0); }
2071}
2072.FormContainer-root-70531 { display: block; width: 100%; height: 100%; background-color: var(--background-colors-base); padding: var(--spacings-s48) var(--spacings-s32) var(--spacings-s16); overflow-y: hidden; }
2073@media (hover: none) and (pointer: coarse) {
2074  .FormContainer-root-70531 input { font-size: var(--typography-t5-font-size); }
2075  .FormContainer-root-70531 input::placeholder { font-size: var(--typography-t5-font-size); }
2076}
2077.FormContainer-rootNewDesign-699d4.FormContainer-rootNewDesign-699d4 { box-sizing: border-box; padding: var(--auth-panel-padding, var(--spacings-s12)); display: flex; flex-direction: column; align-self: stretch; height: auto; min-height: 0px; }
2078.FormContainer-rootNewDesign-699d4 > form { flex: 1 1 auto; min-height: 0px; height: auto; }
2079.FormContainer-rootNewDesign-699d4 .input-field-auth > input { border-radius: var(--corner-radius-r8); color: var(--control-colors-value-active); --text-field-bg-override: var(--control-colors-field-background-default); }
2080.FormContainer-rootNewDesign-699d4 .input-field-auth > input::placeholder { color: var(--control-colors-placeholder-default); }
2081.FormContainer-rootNewDesign-699d4 .input-field-auth > input:hover { --text-field-bg-override: var(--control-colors-field-background-action); }
2082.FormContainer-rootNewDesign-699d4 .input-field-auth > input:-webkit-autofill, .FormContainer-rootNewDesign-699d4 .input-field-auth > input:-webkit-autofill:hover { box-shadow: 0 0 0 1000px var(--control-colors-field-background-default) inset; -webkit-text-fill-color: var(--control-colors-value-active); }
2083.FormContainer-rootNewDesign-699d4 .input-field-auth >
2083 input:-webkit-autofill:focus, .FormContainer-rootNewDesign-699d4 .input-field-auth > input:-webkit-autofill:active { box-shadow: 0 0 0 1000px var(--control-colors-field-background-active) inset; -webkit-text-fill-color: var(--control-colors-value-active); caret-color: var(--control-colors-caret-default); }
2084.FormContainer-rootNewDesign-699d4 .input-field-auth > input:focus, .FormContainer-rootNewDesign-699d4 .input-field-auth > input:active { --text-field-bg-override: var(--control-colors-field-background-active); caret-color: var(--control-colors-caret-default); }
2085.FormContainer-rootNewDesign-699d4 .input-field-auth > button { color: var(--control-colors-end-icon-default); }
2086.FormContainer-rootNewDesign-699d4 .input-field-auth > button:hover { color: var(--control-colors-end-icon-active); }
2087.FormContainer-rootNewDesign-699d4 .auth-form-footer { flex-shrink: 0; padding-top: var(--spacings-s0); }
2088.FormContainer-rootNewDesign-699d4 .auth-intro { display: grid; gap: var(--spacings-s12); }
2089.FormContainer-rootNewDesign-699d4 .auth-description { color: var(--text-colors-tint-1); }
2090.FormContainer-rootNewDesign-699d4 .auth-field-label { text-align: start; }
2091.FormContainer-rootNewDesign-699d4 .auth-field-message { display: flex; align-items: center; gap: var(--spacings-s4); min-height: 16px; text-align: start; }
2092.FormContainer-rootNewDesign-699d4 .auth-field-message-icon { flex-shrink: 0; }
2093.FormContainer-rootNewDesign-699d4 .auth-field-message-icon > path:not([fill]) { fill: var(--error-colors-base-default); }
2094.TopProfileContent-teamImg-8d1fd { width: 24px; height: 24px; min-width: 24px; border-radius: 100%; overflow: hidden; background-color: var(--background-colors-tint-3); margin-right: var(--spacings-s16); background-image: url("https://cdn140.picsart.com/96964700141004781209.png"); background-repeat: round; }
2095.UserActions-suggestionBox-a5c7f { overflow: auto; max-height: calc(-120px + 100vh); min-width: 330px; }
2096.UserActions-applyButtonContainer-b267d { padding: var(--spacings-s16); }
2097.UserActions-profileAnchor-649f3 { position: relative; }
2098.UserActions-profileMenuPortal-968c7 { position: absolute; top: 100%; right: 0px; width: 0px; height: 0px; }
2099.UserActions-profileMenuPortal-968c7 > * { top: 0px !important; left: auto !important; right: 0px !important; }
2100.AppSmartBanner-root-cff35 { width: 100%; background: var(--negative-colors-base-default); padding: var(--spacings-s8) 0; border-top: 1px solid var(--control-colors-border-default); border-bottom: 1px solid var(--control-colors-border-default); }
2101.AppSmartBanner-homepage-545d0 { background: var(--gradients-monetization-pro); }
2102.AppSmartBanner-homepage-545d0 .AppSmartBanner-logo-e7074 { background: var(--primary-colors-base-default); }
2103.AppSmartBanner-homepage-545d0 .AppSmartBanner-titlesecondary-65c65 { color: var(--negative-colors-text-default); }
2104.AppSmartBanner-container-1e9e3 { display: flex; justify-content: space-between; align-items: center; }
2105.AppSmartBanner-sticky-eb4d0 { position: fixed; top: var(--spacings-s0); z-index: 99; }
2106.AppSmartBanner-centerContainer-7c00a { display: flex; align-items: center; flex: 1 1 0%; }
2107.AppSmartBanner-logo-e7074 { margin-right: var(--spacings-s8); min-width: 50px; height: 50px; background: unset; display: grid; place-items: center; border-radius: var(--corner-radius-r8); }
2108.AppSmartBanner-logo-e7074 svg path { fill: var(--positive-colors-base-default); }
2109.AppSmartBanner-closeButton-2e387 { background: transparent; width: initial; fill: var(--positive-colors-base-action); margin-right: var(--spacings-s6); display: block; }
2110.AppSmartBanner-closeButton-2e387:hover { background: transparent; }
2111.AppSmartBanner-closeButton-2e387 > svg > path { fill: var(--positive-colors-base-action); }
2112.AppSmartBanner-titleContainer-25cb0 { display: flex; flex-direction: column; align-items: start; justify-content: start; }
2113.AppSmartBanner-titleContainer-25cb0 > span { text-align: left; }
2114.AppSmartBanner-title-26eda { display: block; font-weight: 600; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); color: var(--negative-colors-text-default); }
2115.AppSmartBanner-titlesecondary-65c65 { font-weight: 500; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); color: var(--text-colors-tint-2); }
2116.AppSmartBanner-root-63409 { width: 100%; background: var(--primary-colors-base-default); padding: var(--spacings-s8) 0; }
2117.AppSmartBanner-container-06537 { display: flex; justify-content: space-between; align-items: center; }
2118.AppSmartBanner-centerContainer-2e0d6 { display: flex; align-items: center; gap: var(--spacings-s16); justify-content: center; flex: 1 1 0%; min-width: 0px; cursor: pointer; }
2119@media (max-width: 768px) {
2120  .AppSmartBanner-centerContainer-2e0d6 { gap: var(--spacings-s16); }
2121}
2122.AppSmartBanner-bannerText-dbd1f a { color: var(--absolute-black-colors-base-default); text-decoration: underline; }
2123.AppSmartBanner-ctaButton-e5167 { flex-shrink: 0; }
2124.AppSmartBanner-countdown-6d7b1 { align-items: center; display: flex; flex-shrink: 0; gap: var(--spacings-s4); }
2125.AppSmartBanner-countdownPlaceholder-3fad5 { visibility: hidden; }
2126.AppSmartBanner-countdownValue-18957 { background: var(--absolute-black-colors-base-default); border-radius: var(--spacings-s8); color: var(--absolute-white-colors-base-default); font-variant-numeric: tabular-nums; padding: var(--spacings-s4); white-space: nowrap; }
2127.AppSmartBanner-countdownSeparator-a3620 { color: var(--absolute-black-colors-base-default); }
2128.AppSmartBanner-countdownText-4a739 { color: var(--absolute-black-colors-base-default); white-space: nowrap; }
2129@media (max-width: 768px) {
2130  .AppSmartBanner-countdownText-4a739 { display: none; }
2131}
2132@media (max-width: 360px) {
2133  .AppSmartBanner-countdown-6d7b1 { gap: var(--spacings-s2); }
2134  .AppSmartBanner-countdownValue-18957 { padding: var(--spacings-s2); }
2135}
2136.HeaderSectionRight-createExperimentButtonStyle-95f81 { margin-right: var(--spacings-s8); background: var(--primary-colors-base-default); color: var(--negative-colors-text-default); }
2137@media screen and (max-width: 500px) {
2138  .HeaderSectionRight-createExperimentButtonStyle-95f81 { margin-left: var(--spacings-s8); }
2139}
2140.HeaderSectionRight-monetizationButton-8418c { display: flex; align-items: center; background-color: var(--primary-colors-base-default); padding: var(--spacings-s10) var(--spacings-s16) var(--spacings-s10) var(--spacings-s48); color: var(--negative-colors-text-default); }
2141@media screen and (max-width: 1024px) {
2142  .HeaderSectionRight-monetizationButton-8418c { display: none; }
2143}
2144.HeaderSectionRight-monetizationButtonIcon-be707 { position: absolute; top: 50%; transform: translateY(-50%); height: 26px; left: 16px; }
2145.HeaderSectionRight-monetizationButtonIcon-be707 svg { fill: var(--negative-colors-text-default); }
2146.HeaderSectionRight-monetizationButtonWrapper-56197 { position: relative; margin-right: var(--spacings-s12); }
2147.HeaderSectionRight-searchIcon-9039e { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; margin-right: var(--spacings-s12); background-color: var(--background-colors-tint-2); border-radius: var(--corner-radius-circle); }
2148@media screen and (max-width: 500px) {
2149  .HeaderSectionRight-searchIcon-9039e { margin-right: var(--spacings-s12); }
2150}
2151@media screen and (max-width: 500px) {
2152  .HeaderSectionRight-searchIconBraze-ffd31 { margin-right: 0px; }
2153}
2154.HeaderSectionRight-searchInput-a16ec { margin-right: var(--spacings-s12); }
2155@media screen and (max-width: 500px) {
2156  .HeaderSectionRight-searchInput-a16ec { margin-right: var(--spacings-s12); }
2157}
2158@media screen and (max-width: 500px) {
2159  .HeaderSectionRight-searchInputBraze-99641 { margin-right: 0px; }
2160}
2161.HeaderSectionRight-section-27baf { height: 100%; display: flex; align-items: center; justify-content: right; }
2162[dir="ltr"] .HeaderSectionRight-section-27baf { margin-left: auto; }
2163[dir="rtl"] .HeaderSectionRight-section-27baf { margin-right: auto; }
2164.HeaderSectionRight-user-469a9 { display: inline-block; }
2165.Logo-root-31f45 { display: block; padding: 0px; }
2166.Logo-root-31f45 .button__content { height: 24px; }
2167.Logo-mobileSmall-a63ab { padding: 0px 10px; }
2168.Logo-logo-4b7ca { display: block; width: 104px; height: 24px; user-select: none; }
2169.Logo-mobileLogo-ee347 { display: none; height: 28px; width: 28px; }
2170@media screen and (max-width: 580px) {
2171  .Logo-mobileSmall-a63ab .Logo-logo-4b7ca { display: none; }
2172  .Logo-mobileSmall-a63ab .Logo-mobileLogo-ee347 { display: block; }
2173}
2174.HeaderSkeleton-root-65376 { height: 80px; display: flex; flex-direction: column; box-shadow: rgb(242, 242, 242) 0px 1px; }
2175.HeaderSkeleton-content-e6c51 { display: flex; justify-content: flex-start; flex-direction: row; height: 80px; align-items: center; position: relative; }
2176.HeaderSkeleton-logoHolder-d0e73 { padding-top: 5px; padding-bottom: 5px; }
2177.HeaderSkeleton-mobileLogo-93f1c { display: none; height: 28px; width: 28px; }
2178.HeaderSkeleton-logo-b828f { width: 104px; height: 34px; margin-top: 5px; margin-left: 0px; }
2179.HeaderSkeleton-burgerHolder-c23e6 { display: none; align-items: center; justify-content: center; width: 32px; height: 32px; position: absolute; top: 3px; bottom: 0px; margin: auto 0px; }
2180.HeaderSkeleton-burger-749ea { display: block; width: 24px; height: 24px; }
2181.HeaderSkeleton-burger-749ea > path { fill: var(--background-colors-tint-2); }
2182.HeaderSkeleton-mobileAppBanner-a249e { display: none; background: var(--background-colors-tint-2); width: 100%; height: 66px; }
2183.HeaderSkeleton-itemsPlaceholder-88ada { display: flex; margin-left: 48px; }
2184.HeaderSkeleton-itemPlaceholder-49657 { display: flex; height: 36px; margin-right: 16px; border-radius: 8px; width: 80px; }
2185.HeaderSkeleton-loginPlaceholder-953ba { position: absolute; right: 24px; width: 130px; height: 36px; border-radius: 8px; }
2186.HeaderSkeleton-mobile-16ebb .HeaderSkeleton-content-e6c51 { justify-content: center; flex-direction: column; align-items: flex-start; }
2187.HeaderSkeleton-mobile-16ebb .HeaderSkeleton-logo-b828f { margin-left: 40px; }
2188.HeaderSkeleton-mobile-16ebb .HeaderSkeleton-burgerHolder-c23e6 { display: flex; }
2189.HeaderSkeleton-mobile-16ebb .HeaderSkeleton-mobileAppBanner-a249e { display: block; }
2190.HeaderSkeleton-mobile-16ebb .HeaderSkeleton-itemsPlaceholder-88ada { display: none; }
2191@media screen and (max-width: 580px) {
2192  .HeaderSkeleton-mobileLogo-93f1c { display: block; }
2193  .HeaderSkeleton-logo-b828f { display: none; }
2194}
2195.BrazeContentCardsPopup-popupContainer-f225c { position: relative; height: 526px; }
2196@media screen and (max-width: 600px) {
2197  .BrazeContentCardsPopup-popupContainer-f225c { height: 450px; }
2198}
2199.BrazeContentCardsPopup-popupContainerEmpty-94134 { position: relative; }
2200.BrazeContentCardsPopup-brazePopup-9c4b8 { position: fixed; width: 340px; height: 484px; right: var(--spacings-s48); bottom: var(--spacings-s12); left: auto; top: auto; border: 2px solid var(--background-colors-tint-3); background-color: var(--background-colors-base); border-radius: var(--corner-radius-r8); overflow-x: hidden; z-index: 10; }
2201@media (hover: hover) and (pointer: fine) {
2202  .BrazeContentCardsPopup-brazePopup-9c4b8::-webkit-scrollbar { width: 14px; height: 14px; }
2203  .BrazeContentCardsPopup-brazePopup-9c4b8::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; margin-block: var(--spacings-s16); }
2204  .BrazeContentCardsPopup-brazePopup-9c4b8::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--control-colors-border-default); background-clip: content-box; border: 5px solid transparent; }
2205  .BrazeContentCardsPopup-brazePopup-9c4b8::-webkit-scrollbar-corner { background: transparent; }
2206}
2207@supports (-moz-appearance: none) {
2208  .BrazeContentCardsPopup-brazePopup-9c4b8 { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2209}
2210@media (hover: none) and (pointer: coarse) {
2211  .BrazeContentCardsPopup-brazePopup-9c4b8::-webkit-scrollbar { display: none; }
2212}
2213@media screen and (max-width: 600px) {
2214  .BrazeContentCardsPopup-brazePopup-9c4b8 { width: 314px; height: 410px; right: var(--spacings-s2); }
2215}
2216.BrazeContentCardsPopup-popupHeader-30b3d { width: 340px; z-index: 3; position: fixed; transform: translateY(-2px); border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; display: block; margin-left: -2px; background: var(--positive-colors-base-default); box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 2px; border-radius: var(--corner-radius-r8) var(--corner-radius-r8) var(--corner-radius-r0) var(--corner-radius-r0); padding: var(--spacings-s8) var(--spacings-s16); }
2217.BrazeContentCardsPopup-popupHeader-30b3d > button { height: 24px; width: 24px; }
2218.BrazeContentCardsPopup-popupHeader-30b3d > button:hover { background-color: var(--positive-colors-base-default); }
2219@media screen and (max-width: 600px) {
2220  .BrazeContentCardsPopup-popupHeader-30b3d { width: 314px; }
2221}
2222.BrazeContentCardsPopup-closePopup-0689c { position: absolute; top: 10px; right: var(--spacings-s12); }
2223.BrazeContentCardsPopup-brazeStart-89a56 { display: flex; align-items: center; font-weight: 700; font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); }
2224.BrazeContentCardsPopup-brazeStart-89a56 span { padding-top: var(--spacings-s2); font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); border-radius: var(--corner-radius-circle); background-color: var(--primary-colors-base-default); color: var(--primary-colors-text-default); margin-left: var(--spacings-s12); margin-bottom: var(--spacings-s2); text-align: center; min-width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; font-weight: 500; }
2225.BrazeContentCardsPopup-brazeContentWrapper-dd475 { position: relative; top: var(--spacings-s64); padding: var(--spacings-s0) var(--spacings-s6) var(--spacings-s2) var(--spacings-s16); }
2226@media screen and (max-width: 600px) {
2227  .BrazeContentCardsPopup-brazeContentWrapper-dd475 { padding: var(--spacings-s0) var(--spacings-s16) var(--spacings-s2) var(--spacings-s16); }
2228}
2229.BrazeContentCardsPopup-brazeContentBlock-3fa95 { border-radius: var(--corner-radius-r8); border: 2px solid var(--background-colors-tint-3); overflow: hidden; margin-bottom: var(--spacings-s16); }
2230.BrazeContentCardsPopup-brazeContentImage-1bda1 img { max-width: 100%; height: auto; display: block; }
2231.BrazeContentCardsPopup-cardClassicTemplate-10957 { display: flex; background-color: var(--background-colors-tint-2); }
2232.BrazeContentCardsPopup-cardClassicTemplate-10957 img { margin: var(--spacings-s12); min-width: 60px; max-width: 60px; }
2233.BrazeContentCardsPopup-cardClassicTemplate-10957 h4 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
2234.BrazeContentCardsPopup-cardBannerTemplate-b403f img { max-width: 300px; display: block; }
2235.BrazeContentCardsPopup-cardBannerTemplate-b403f a { display: block; }
2236.BrazeContentCardsPopup-cardDefaultTemplate-56ad3 { display: block; min-height: 302px; }
2237.BrazeContentCardsPopup-brazeContent-b625e { background-color: var(--background-colors-tint-2); padding: var(--spacings-s12); }
2238.BrazeContentCardsPopup-brazeContent-b625e h4 { color: var(--text-colors-base); font-weight: 600; margin-bottom: var(--spacings-s4); }
2239.BrazeContentCardsPopup-brazeContent-b625e p { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); font-weight: 500; color: var(--text-colors-tint-1); }
2240.BrazeContentCardsPopup-brazeContent-b625e a { display: inline-block; margin-top: 16px; color: var(--primary-colors-base-default); font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); font-weight: 600; }
2241.BrazeContentCardsPopup-line-0ada2 { width: 100%; height: 4px; border: 1px solid var(--primary-colors-base-default); background-color: var(--primary-colors-base-default); }
2242.BrazeContentCardsPopup-cardEmpty-877a2 { height: 480px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: var(--spacings-s0) var(--spacings-s32); }
2243@media screen and (max-width: 600px) {
2244  .BrazeContentCardsPopup-cardEmpty-877a2 { width: 310px; height: 400px; }
2245}
2246.BrazeContentCardsPopup-cardEmpty-877a2 div { width: 48px; height: 48px; display: flex; justify-content: center; align-items: center; margin-bottom: var(--spacings-s24); margin-top: var(--spacings-s24); background-color: var(--background-colors-tint-2); border-radius: var(--corner-radius-circle); }
2247.BrazeContentCardsPopup-cardEmpty-877a2 p { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); }
2248.BrazeContentCards-root-8ebaf { position: relative; margin-right: var(--spacings-s32); display: inline-block; }
2249@media screen and (max-width: 500px) {
2250  .BrazeContentCards-root-8ebaf { margin-right: var(--spacings-s12); margin-left: var(--spacings-s0); }
2251}
2252.BrazeContentCards-brazeImageWrapper-3efcf { position: relative; cursor: pointer; }
2253.BrazeContentCards-brazeImageWrapper-3efcf img { width: 24px; height: 24px; }
2254.BrazeContentCards-brazeImageWrapper-3efcf span { position: absolute; background-color: var(--primary-colors-alpha-20); border: 1px solid var(--primary-colors-text-default); width: 9px; height: 9px; right: 14px; top: var(--spacings-s12); border-radius: var(--corner-radius-circle); }
2255@media screen and (max-width: 500px) {
2256  .BrazeContentCards-brazeImageWrapper-3efcf span { width: 7px; height: 7px; }
2257}
2258.DropDown-root-4b44b { display: none; position: absolute; top: 100%; background-color: var(--positive-colors-base-default); border: 1px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r12); box-shadow: var(--shadows-tint-2); overflow: hidden; z-index: 13; }
2259@media screen and (max-height: 1640px) {
2260  .DropDown-root-4b44b { max-height: calc(-120px + 100vh); overflow: auto; }
2261}
2262.DropDown-root-4b44b.navigation:not(.toRight) { padding: var(--spacings-s0) var(--spacings-s12); }
2263[dir="ltr"] .DropDown-root-4b44b.navigation:not(.toRight) { left: var(--spacings-s0); }
2264[dir="rtl"] .DropDown-root-4b44b.navigation:not(.toRight) { right: var(--spacings-s0); }
2265[dir="ltr"] .DropDown-root-4b44b.navigation:not(.toRight).isFullWidth { left: -180p
2265x; }
2266.DropDown-root-4b44b.optimized { padding: var(--spacings-s0) var(--spacings-s16) var(--spacings-s0) var(--spacings-s24); }
2267[dir="ltr"] .DropDown-root-4b44b.toRight { right: var(--spacings-s0); }
2268[dir="rtl"] .DropDown-root-4b44b.toRight { left: var(--spacings-s0); }
2269.DropDown-root-4b44b.toRight .has-see-more { padding-bottom: var(--spacings-s0); }
2270.DropDown-root-4b44b.profile { padding: var(--spacings-s8); border: 1px solid var(--control-colors-border-default); }
2271[dir="ltr"] .DropDown-root-4b44b.profile { right: var(--spacings-s0); }
2272[dir="rtl"] .DropDown-root-4b44b.profile { left: var(--spacings-s0); }
2273.ProfileMenuItem-root-96cd3 { padding: var(--spacings-s12) var(--spacings-s0) var(--spacings-s0); margin: var(--spacings-s12) var(--spacings-s0) var(--spacings-s0); border-top: 1px solid var(--control-colors-border-default); }
2274.ProfileMenuItem-button-07ba7 { font-weight: 500; font-size: var(--typography-t4-font-size); align-items: center; background: none; cursor: pointer; color: var(--text-colors-base); line-height: 1.42; gap: var(--spacings-s8); display: flex; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; width: 100%; }
2275.ProfileMenuItem-skeleton-8276c { border-radius: var(--corner-radius-r8); width: 100%; height: 32px; }
2276.ProfileMenuItem-label-32266 { text-align: start; flex-grow: 1; }
2277.ProfileMenuItem-arrowIcon-b02e5 { fill: var(--primary-colors-base-default); height: 24px; width: 24px; }
2278.ProfileMenuItem-startIcon-3dfeb { fill: var(--text-colors-tint-1); height: 24px; width: 24px; }
2279html.desktop { min-width: 1024px; }
2280body.no-scroll { height: 100vh; overflow: hidden; }
2281body header { z-index: 3; }
2282body footer { z-index: 3; }
2283a { text-decoration: none; }
2284a.korea-link { color: var(--primary-colors-base-default) !important; }
2285a.inline-link { display: contents; color: var(--primary-colors-base-default); transition: color var(--timings-default) var(--easings-ease-in-out); }
2286@media (hover: hover) and (pointer: fine) {
2287  a.inline-link:hover { color: var(--primary-colors-base-action); }
2288}
2289@media (hover: none) and (pointer: coarse) {
2290  a.inline-link:active { color: var(--primary-colors-base-action); }
2291}
2292span.colored { color: var(--primary-colors-base-default); }
2293.ProfileThemeSwitcher-root-60158 { display: flex; align-items: center; height: 44px; margin-bottom: var(--spacings-s2); }
2294.ProfileThemeSwitcher-icon-acb90 { width: 24px; height: 24px; fill: var(--text-colors-tint-1); flex-shrink: 0; }
2295[dir="ltr"] .ProfileThemeSwitcher-icon-acb90 { margin-right: var(--spacings-s24); }
2296[dir="rtl"] .ProfileThemeSwitcher-icon-acb90 { margin-left: var(--spacings-s24); }
2297.ProfileThemeSwitcher-label-43a42 { font-weight: 600; font-size: var(--typography-t5-font-size); color: var(--text-colors-tint-1); flex-grow: 1; }
2298.ProfileThemeSwitcher-segments-89e14 { flex-shrink: 0; }
2299.TopProfileContent-root-9ffa4 { width: 330px; white-space: nowrap; }
2300.TopProfileContent-root-9ffa4.mobile { width: 100%; }
2301.TopProfileContent-header-e04f8 { border: 1px solid var(--background-colors-tint-3); border-radius: var(--corner-radius-r8); padding: var(--spacings-s12); }
2302.TopProfileContent-userProfile-20208 { white-space: nowrap; }
2303.TopProfileContent-user-15ae9 { padding: var(--spacings-s16) var(--spacings-s12) var(--spacings-s24) var(--spacings-s12); }
2304@media (hover: hover) and (pointer: fine) {
2305  .TopProfileContent-user-15ae9:hover .TopProfileContent-userTitle-bed4a { color: var(--primary-colors-base-default); }
2306  .TopProfileContent-user-15ae9:hover svg > path { fill: var(--primary-colors-base-default); }
2307}
2308.TopProfileContent-userTitle-bed4a { display: block; height: 24px; font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); }
2309.TopProfileContent-userArrowIcon-712e3 { display: inline-block; vertical-align: baseline; width: 12px; height: 12px; fill: var(--background-colors-tint-3); }
2310[dir="rtl"] .TopProfileContent-userArrowIcon-712e3 { transform: rotate(180deg); }
2311.TopProfileContent-text-527b1 { font-weight: 500; font-size: var(--typography-t5-font-size); white-space: initial; text-align: center; min-width: 270px; line-height: 1.42; }
2312.TopProfileContent-upgradeBtn-38fa5 { width: 100%; margin: var(--spacings-s8) var(--spacings-s0); }
2313.TopProfileContent-username-83e8a { margin-bottom: var(--spacings-s12); margin-top: var(--spacings-s8); text-align: center; }
2314.TopProfileContent-skeleton-7b49d { margin: var(--spacings-s8) var(--spacings-s0); border-radius: var(--corner-radius-r20); width: 100%; height: 40px; }
2315.TopProfileContent-userLink-9af87 { display: flex; flex-direction: row; align-items: center; height: 44px; margin-bottom: var(--spacings-s2); position: relative; font-weight: 600; font-size: var(--typography-t5-font-size); line-height: var(--typography-t6-line-height); transition: color var(--timings-default) var(--easings-ease-in-out); cursor: pointer; }
2316.TopProfileContent-userLink-9af87.default { color: var(--text-colors-tint-1); }
2317.TopProfileContent-userLink-9af87.log-out { color: var(--error-colors-base-default); width: 100%; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
2318.TopProfileContent-userLink-9af87.log-out:hover { color: var(--error-colors-base-action); }
2319@media (hover: hover) and (pointer: fine) {
2320  .TopProfileContent-userLink-9af87:hover { color: var(--primary-colors-base-default); }
2321}
2322@media (hover: none) and (pointer: coarse) {
2323  .TopProfileContent-userLink-9af87:focus { color: var(--primary-colors-base-default); }
2324}
2325.TopProfileContent-userLink-9af87:not(:hover):focus { color: var(--primary-colors-base-default); }
2326.TopProfileContent-userLink-9af87:last-child { margin-bottom: var(--spacings-s0); }
2327.TopProfileContent-userLinkIcon-19404 { display: inline-block; width: 24px; height: 24px; min-width: 24px; fill: var(--text-colors-tint-1); }
2328[dir="ltr"] .TopProfileContent-userLinkIcon-19404 { margin-right: var(--spacings-s24); }
2329[dir="rtl"] .TopProfileContent-userLinkIcon-19404 { margin-left: var(--spacings-s24); }
2330.TopProfileContent-userLogoutIcon-c2d34 { fill: var(--error-colors-base-default); }
2331[dir="ltr"] .TopProfileContent-userLogoutIcon-c2d34 { margin-right: var(--spacings-s24); }
2332[dir="rtl"] .TopProfileContent-userLogoutIcon-c2d34 { margin-left: var(--spacings-s24); }
2333.TopProfileContent-avatar-4f3fb { display: flex; justify-content: center; }
2334.TopProfileContent-contributorWrapper-9e42f { position: relative; padding: var(--spacings-s16) var(--spacings-s12); border-top: 1px solid var(--primary-colors-base-default); }
2335.TopProfileContent-contributorCollectiveLink-5b00f { text-decoration: none; }
2336.TopProfileContent-contributorCollectiveLink-5b00f:hover > div { color: var(--primary-colors-base-default); }
2337.TopProfileContent-contributorText-d5de9 { display: flex; flex-direction: row; align-items: center; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); font-weight: 600; color: var(--negative-colors-text-default); transition: color var(--timings-default) var(--easings-ease-in-out); }
2338.TopProfileContent-contributorText-d5de9 > span { padding: var(--spacings-s8) var(--spacings-s12) var(--spacings-s6); margin-left: var(--spacings-s6); font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); background-color: var(--negative-colors-base-default); text-transform: uppercase; color: var(--negative-colors-text-default); border-radius: var(--corner-radius-r16); transition: color var(--timings-default) var(--easings-ease-in-out); }
2339.TopProfileContent-team-8e414 { margin: var(--spacings-s16) var(--spacings-s0) var(--spacings-s24); padding: var(--spacings-s8) var(--spacings-s12); position: relative; cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: transparent; text-align: left; }
2340.TopProfileContent-teamBottom-544ad { display: flex; align-items: center; }
2341.TopProfileContent-teamTop-e695f { margin-bottom: var(--spacings-s6); }
2342.TopProfileContent-teamImg-8d1fd { width: 24px; height: 24px; min-width: 24px; border-radius: 100%; overflow: hidden; background-color: var(--background-colors-tint-3); margin-right: var(--spacings-s16); background-image: url("https://cdn140.picsart.com/96964700141004781209.png"); background-repeat: round; }
2343.TopProfileContent-teamName-a4a11 { width: 160px; word-break: break-word; white-space: pre-line; overflow-wrap: break-word; }
2344.TopProfileContent-userLinkLabel-f5f89 { flex-grow: 1; }
2345.TopProfileContent-featureSection-8dc11 { padding: var(--spacings-s12) 0; }
2346.TopProfileContent-languageButton-ad509 { width: 100%; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; text-align: left; }
2347.TopProfileContent-languageArrow-20629 { fill: var(--primary-colors-base-default); height: 24px; width: 24px; flex-shrink: 0; }
2348.TopProfileContent-privacyChoicesButton-f6f7e { width: 100%; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; text-align: left; }
2349.TopProfileContent-privacyChoicesIcon-1361a { display: inline-block; width: 24px; height: 11.2px; min-width: 24px; }
2350[dir="ltr"] .TopProfileContent-privacyChoicesIcon-1361a { margin-right: var(--spacings-s24); }
2351[dir="rtl"] .TopProfileContent-privacyChoicesIcon-1361a { margin-left: var(--spacings-s24); }
2352.LanguageSwitcherPopup-content-4af62 { display: flex; flex-direction: column; width: 550px; max-width: 100%; padding: var(--spacings-s24) var(--spacings-s24) var(--spacings-s16); box-sizing: border-box; }
2353.LanguageSwitcherPopup-title-75834 { margin-bottom: var(--spacings-s16); }
2354.LanguageSwitcherPopup-columnsContainer-36355 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--spacings-s4); max-height: 400px; overflow: hidden auto; }
2355@media (hover: hover) and (pointer: fine) {
2356  .LanguageSwitcherPopup-columnsContainer-36355::-webkit-scrollbar { width: 2px; }
2357  .LanguageSwitcherPopup-columnsContainer-36355::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
2358  .LanguageSwitcherPopup-columnsContainer-36355::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
2359  .LanguageSwitcherPopup-columnsContainer-36355::-webkit-scrollbar-corner { background: transparent; }
2360}
2361@supports (-moz-appearance: none) {
2362  .LanguageSwitcherPopup-columnsContainer-36355 { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2363}
2364@media (hover: none) and (pointer: coarse) {
2365  .LanguageSwitcherPopup-columnsContainer-36355::-webkit-scrollbar { display: none; }
2366}
2367@media (max-width: 550px) {
2368  .LanguageSwitcherPopup-columnsContainer-36355 { grid-template-columns: 1fr; }
2369}
2370.LanguageSwitcherPopup-singleColumn-836f0 { grid-template-columns: 1fr; max-height: none; }
2371.LanguageSwitcherPopup-column-bc49c { display: flex; flex-direction: column; }
2372.LanguageSwitcherPopup-langButtonActive-3d23b { color: var(--primary-colors-base-active); }
2373.LanguageSwitcherPopup-langSpan-cd393 { text-align: left; width: 100%; display: block; font-weight: 600; }
2374.LanguageSwitcherPopup-footer-28ff8 { margin-top: auto; padding-top: var(--spacings-s16); flex-shrink: 0; }
2375.Profile-root-5a988 { display: flex; align-items: center; height: 100%; position: relative; }
2376.Profile-root-5a988 .profile { display: block; }
2377.Profile-button-4d1ef { position: relative; display: block; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: transparent; transition-property: background-color, color; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease-in-out); cursor: pointer; }
2378[dir="ltr"] .Profile-button-4d1ef { padding-right: var(--spacings-s24); }
2379[dir="rtl"] .Profile-button-4d1ef { padding-left: var(--spacings-s24); }
2380@media (hover: hover) and (pointer: fine) {
2381  .Profile-button-4d1ef:hover avataricon > svg > path, .Profile-button-4d1ef:focus avataricon > svg > path { fill: var(--primary-colors-base-default); }
2382  .Profile-button-4d1ef:hover .Profile-icon-89d56, .Profile-button-4d1ef:focus .Profile-icon-89d56 { fill: var(--primary-colors-base-default); }
2383}
2384@media (hover: none) and (pointer: coarse) {
2385  .Profile-button-4d1ef:focus avataricon > svg > path { fill: var(--primary-colors-base-default); }
2386  .Profile-button-4d1ef:focus .Profile-icon-89d56 > svg > path { fill: var(--primary-colors-base-default); }
2387}
2388.Profile-button-4d1ef:active .Profile-imageOuterHolder-4c77f::before { transform: scale(1); opacity: 1; }
2389.Profile-icon-89d56 { display: inline-block; width: 12px; height: 12px; position: absolute; top: var(--spacings-s0); bottom: var(--spacings-s0); margin: auto var(--spacings-s0); transition-property: background-color, color; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease-in-out); }
2390[dir="ltr"] .Profile-icon-89d56 { right: var(--spacings-s8); }
2391[dir="rtl"] .Profile-icon-89d56 { left: var(--spacings-s8); }
2392.Profile-imageOuterHolder-4c77f { display: block; width: 40px; height: 40px; border-radius: var(--corner-radius-r8); position: relative; }
2393.Profile-imageOuterHolder-4c77f::before { content: ""; display: block; position: absolute; inset: -4px; margin: auto; border: 2px solid var(--background-colors-base); border-radius: var(--corner-radius-circle); opacity: 0; transform: scale(0.8); transition-property: opacity, transform; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease-in-out); }
2394.Profile-notificationCircle-5897a { width: 8px; height: 8px; background-color: var(--error-colors-base-active); border-radius: var(--corner-radius-circle); display: flex; position: absolute; right: var(--spacings-s0); bottom: var(--spacings-s4); }
2395.Profile-mobileButton-a30a5 { padding: var(--spacings-s0); }
2396.Profile-tooltip-2a1b3 { text-align: center; margin-left: -11px; max-width: 236px; }
2397.Profile-applyButtonContainer-a5670 { padding: var(--spacings-s16); }
2398.Button-root-bc2d0 { display: block; height: 40px; padding: var(--spacings-s0) var(--spacings-s12); border-radius: var(--corner-radius-r8); font-weight: 600; font-size: var(--typography-t4-font-size); white-space: nowrap; position: relative; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; transition-property: background-color, color; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease-in-out); cursor: pointer; }
2399.Button-root-bc2d0::before { content: ""; display: block; position: absolute; inset: -1px; z-index: -1; margin: auto; border-width: 2px; border-style: solid; border-color: transparent; border-radius: var(--corner-radius-r8); opacity: 0; transition-property: opacity, top, right, bottom, left; transition-duration: var(--timings-fast); transition-timing-function: var(--easings-ease-in-out); transform: translateZ(0px); }
2400.Button-root-bc2d0::first-letter { text-transform: capitalize; }
2401.Button-root-bc2d0.sign { background-color: rgb(38, 38, 38); color: var(--absolute-black-colors-text-default); }
2402.Button-root-bc2d0.sign::before { border-color: rgb(38, 38, 38); }
2403@media (hover: hover) and (pointer: fine) {
2404  .Button-root-bc2d0.sign:hover { background-color: rgb(38, 38, 38); }
2405}
2406@media (hover: none) and (pointer: coarse) {
2407  .Button-root-bc2d0.sign:active { background-color: rgb(38, 38, 38); }
2408}
2409.Button-root-bc2d0:active::before { inset: -4px; z-index: initial; opacity: 1; }
2410.AgeConfirmationPopup-wrapper-38a35 { display: grid; align-content: baseline; box-sizing: border-box; width: var(--rc-age-wrapper-width); max-height: 440px; padding: var(--spacings-s56) var(--spacings-s24); position: relative; background-color: var(--positive-colors-base-default); border-radius: var(--corner-radius-r16); box-shadow: 0 8px 20px var(--text-colors-tint-3); }
2411@media screen and (max-width: 768px) {
2412  .AgeConfirmationPopup-wrapper-38a35 { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 326px; right: var(--spacings-s0); bottom: var(--spacings-s0); box-shadow: 0 8 0 var(--positive-colors-base-default); width: 100%; height: 100%; }
2413}
2414.AgeConfirmationPopup-wrapper-38a35 p { text-align: center; }
2415.AgeConfirmationPopup-image-5b409 { margin: var(--spacings-s0) auto var(--spacings-s24); width: 48px; height: 48px; }
2416.AgeConfirmationPopup-description-1c5d7 { margin-top: var(--spacings-s8); }
2417.AgeConfirmationPopup-description-1c5d7 a { color: var(--primary-colors-base-default); font-weight: 700; }
2418.AgeConfirmationPopup-note-b9780 { margin-top: var(--spacings-s8); }
2419.AgeConfirmationPopup-closeIcon-eb2ab { width: 20px; height: 20px; border-radius: 50%; background-color: var(--negative-colors-base-default); position: absolute; top: var(--spacings-s10); right: var(--spacings-s10); cursor: pointer; display: initial; }
2420.AgeConfirmationPopup-closeIconHidden-0366b { display: none; }
2421.AgeConfirmationPopup-buttonsHolder-abea5 { display: grid; margin-top: var(--spacings-s24); gap: var(--spacings-s8); }
2422.AgeConfirmationPopup-buttonsHolder-abea5 > :last-child { display: initial; }
2423@media screen and (max-width: 768px) {
2424  .AgeConfirmationPopup-buttonsHolder-abea5 { position: absolute; bottom: var(--spacings-s32); right: var(--spacings-s24); left: var(--spacings-s24); }
2425}
2426.AgeConfirmationPopup-hideSkipBtn-ee12f > :last-child { display: none; }
2427@supports (padding-block-start: 16px) {
2428  .SearchAutoComplete-root-6d8e4 { padding-block-start: var(--spacings-s16); }
2429}
2430@supports not (padding-block-start: 16px) {
2431  .SearchAutoComplete-root-6d8e4 { padding-top: var(--spacings-s16); }
2432}
2433.SearchAutoComplete-root-6d8e4 { position: absolute; top: calc(100% + var(--spacings-s4)); width: 100%; z-index: 100; border: 2px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r12); left: var(--spacings-s0); background-color: var(--positive-colors-base-default); overflow-y: auto; max-height: 290px; }
2434.SearchAutoComplete-skeleton-8b450 { position: absolute; top: calc(100% + var(--spacings-s4)); left: var(--spacings-s0); width: 100%; border-radius: var(--corner-radius-r12); z-index: 100; }
2435.SearchAutoComplete-skeletonDefault-2cf5f { border: 2px solid var(--control-colors-border-default); max-height: 290px; }
2436.SearchAutoComplete-skeletonOpenMode-6c513 { max-height: 100vh; }
2437.SearchAutoComplete-rootMobile-a37c9 { padding-block-start: var(--spacings-s16); position: absolute; top: calc(100% + var(--spacings-s8)); width: 100%; height: calc(-115px + 100vh); z-index: 100; left: var(--spacings-s0); background-color: var(--positive-colors-base-default); overflow-y: auto; }
2438.RecentlySearch-root-1afe0 { opacity: 0; animation: 0.4s ease-in-out 0s 1 normal forwards running RecentlySearch-rc-recently-search-fade-in-47fd2; margin-bottom: var(--spacings-s16); }
2439.RecentlySearch-mobile-d92b8 { margin-bottom: var(--spacings-s24); }
2440.RecentlySearch-titleWrapper-ced32 { display: flex; align-items: center; justify-content: space-between; gap: var(--spacings-s16); }
2441@supports (margin-inline-end: -12px) {
2442  .RecentlySearch-titleWrapper-ced32 { margin-block-end: var(--spacings-s8); }
2443}
2444@supports not (margin-inline-end: -12px) {
2445  .RecentlySearch-titleWrapper-ced32 { margin-bottom: var(--spacings-s8); }
2446}
2447.RecentlySearch-layoutSkeletonList-86ad7 { display: flex; flex-wrap: wrap; gap: var(--spacings-s8); width: 100%; }
2448.RecentlySearch-layoutSkeletonListItem-c3497 { width: 100%; }
2449.RecentlySearch-layoutSkeletonChip-fa264 { padding-inline-end: var(--spacings-s8); display: flex; flex-flow: row; gap: var(--spacings-s8); overflow-x: auto; scrollbar-width: none; }
2450.RecentlySearch-layoutSkeletonChip-fa264::-webkit-scrollbar { display: none; }
2451.RecentlySearch-layoutSkeletonChipItem-20061 { flex-shrink: 0; max-width: 280px; }
2452@keyframes RecentlySearch-rc-recently-search-fade-in-47fd2 { 
2453  0% { opacity: 0; }
2454  100% { opacity: 1; }
2455}
2456.PopularSearchList-root-8c943 { display: flex; flex-direction: column; }
2457@supports (margin-block-start: var(--spacings-s8)) {
2458  .PopularSearchList-root-8c943 { margin-block-start: var(--spacings-s8); }
2459}
2460@supports not (margin-block-start: var(--spacings-s8)) {
2461  .PopularSearchList-root-8c943 { margin-top: var(--spacings-s8); }
2462}
2463.PopularSearchNewGrid-rootGrid-ad1c0 { display: grid; gap: var(--spacings-s12); grid-template-columns: repeat(var(--rc-popular-search-new-grid-columns),minmax(0,1fr)); width: 100%; }
2464@supports (margin-block-start: var(--spacings-s8)) {
2465  .PopularSearchNewGrid-rootGrid-ad1c0 { margin-block-start: var(--spacings-s8); }
2466}
2467@supports not (margin-block-start: var(--spacings-s8)) {
2468  .PopularSearchNewGrid-rootGrid-ad1c0 { margin-top: var(--spacings-s8); }
2469}
2470.PopularSearchNewGrid-rootCarousel-73425 { scrollbar-width: none; }
2471.PopularSearchNewGrid-rootCarousel-73425::-webkit-scrollbar { display: none; }
2472.PopularSearchNewGrid-rootCarousel-73425 { display: flex; gap: var(--spacings-s8); flex-direction: row; width: 100%; height: 128px; min-height: 128px; overflow: auto hidden; flex-shrink: 0; align-items: stretch; justify-content: flex-start; overscroll-behavior: contain; }
2473.PopularSearchNewGrid-cell-0c5f6 { aspect-ratio: 1 / 1; min-width: 0px; display: flex; flex-direction: column; }
2474.PopularSearchNewGrid-cellCarousel-7de7d { flex: 0 0 auto; width: 108px; height: 100%; min-width: 108px; display: flex; flex-direction: column; }
2475.PopularSearchOldGrid-rootCarousel-4be3c { gap: 8px; display: flex; overflow-x: auto; justify-content: start; padding-bottom: 2px; overscroll-behavior: contain; }
2476@media (hover: hover) and (pointer: fine) {
2477  .PopularSearchOldGrid-rootCarousel-4be3c::-webkit-scrollbar { width: 4px; height: 4px; }
2478  .PopularSearchOldGrid-rootCarousel-4be3c::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
2479  .PopularSearchOldGrid-rootCarousel-4be3c::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
2480  .PopularSearchOldGrid-rootCarousel-4be3c::-webkit-scrollbar-corner { background: transparent; }
2481}
2482@supports (-moz-appearance: none) {
2483  .PopularSearchOldGrid-rootCarousel-4be3c { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2484}
2485@media (hover: none) and (pointer: coarse) {
2486  .PopularSearchOldGrid-rootCarousel-4be3c::-webkit-scrollbar { display: none; }
2487}
2488.PopularSearchOldGrid-rootGrid-01bf0 { display: grid; gap: var(--spacings-s12); grid-template-columns: repeat(2, 1fr); }
2489@supports (margin-block-start: var(--spacings-s8)) {
2490  .PopularSearchOldGrid-rootGrid-01bf0 { margin-block-start: var(--spacings-s8); }
2491}
2492@supports not (margin-block-start: var(--spacings-s8)) {
2493  .PopularSearchOldGrid-rootGrid-01bf0 { margin-top: var(--spacings-s8); }
2494}
2495.PopularSearch-root-57cc0 { opacity: 0; animation: 0.4s ease-in-out 0s 1 normal forwards running PopularSearch-rc-popular-search-fade-in-aa90c; overflow: hidden auto; }
2496.PopularSearch-titleWrapper-a3d5d { display: flex; align-items: center; justify-content: space-between; gap: var(--spacings-s8); margin-bottom: var(--spacings-s8); }
2497@supports (margin-inline-end: -12px) {
2498  .PopularSearch-titleWrapper-a3d5d { margin-inline-end: calc(-1 * var(--spacings-s12)); }
2499}
2500@supports not (margin-inline-end: -12px) {
2501  .PopularSearch-titleWrapper-a3d5d { margin-right: calc(-1 * var(--spacings-s12)); }
2502}
2503@keyframes PopularSearch-rc-popular-search-fade-in-aa90c { 
2504  0% { opacity: 0; }
2505  100% { opacity: 1; }
2506}
2507.ErrorState-root-d643c { display: flex; flex-direction: column; align-items: center; height: 308px; padding: var(--spacings-s16); text-align: center; }
2508.ErrorState-icon-0fd4f { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: var(--primary-colors-alpha-20); margin-bottom: var(--spacings-s16); font-size: 32px; }
2509.ErrorState-title-ffa77 { margin-bottom: var(--spacings-s12); }
2510.ErrorState-text-14765 { margin-bottom: var(--spacings-s12); max-width: 400px; }
2511.ErrorState-retryButton-b95fb { margin-top: var(--spacings-s12); background: var(--primary-colors-base-default); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r24); width: 288px; cursor: pointer; outline: none; }
2512.ErrorState-retryButton-b95fb:hover { background: var(--primary-colors-base-action); }
2513.ImageCropper-container-c28e9 { position: relative; display: inline-block; width: 100%; height: 100%; }
2514.ImageCropper-cropOverlay-6841f { position: absolute; border: 2px solid rgb(247, 212, 247); border-radius: var(--corner-radius-r8); pointer-events: none; }
2515.ImageCropper-cornerBracket-945a1 { position: absolute; width: 25px; height: 25px; pointer-events: none; }
2516.ImageCropper-bracketTopLeft-10bfe { top: -2px; left: -2px; border-top: 2px solid var(--primary-colors-base-default); border-left: 2px solid var(--primary-colors-base-default); border-top-left-radius: var(--corner-radius-r8); }
2517.ImageCropper-bracketTopRight-42976 { top: -2px; right: -2px; border-top: 2px solid var(--primary-colors-base-default); border-right: 2px solid var(--primary-colors-base-default); border-top-right-radius: var(--corner-radius-r8); }
2518.ImageCropper-bracketBottomLeft-747f3 { bottom: -2px; left: -2px; border-bottom: 2px solid var(--primary-colors-base-default); border-left: 2px solid var(--primary-colors-base-default); border-bottom-left-radius: var(--corner-radius-r8); }
2519.ImageCropper-bracketBottomRight-b4d2f { bottom: -2px; right: -2px; border-bottom: 2px solid var(--primary-colors-base-default); border-right: 2px solid var(--primary-colors-base-default); border-bottom-right-radius: var(--corner-radius-r8); }
2520.ImageCropper-handle-06e79 { opacity: 0; position: absolute; width: 25px; height: 25px; background-color: var(--primary-colors-base-default); border-radius: var(--corner-radius-r4); pointer-events: auto; transform: translate(-50%, -50%); z-index: 10; }
2521.ImageCropper-topLeft-16e2f { top: 0px; left: 0px; }
2522.ImageCropper-topRight-69656 { top: 0px; right: 0px; transform: translate(50%, -50%); }
2523.ImageCropper-topRight-69656:hover { transform: translate(50%, -50%) scale(1.1); }
2524.ImageCropper-topRight-69656:active { transform: translate(50%, -50%) scale(0.9); }
2525.ImageCropper-bottomLeft-2a6e3 { bottom: 0px; left: 0px; transform: translate(-50%, 50%); }
2526.ImageCropper-bottomLeft-2a6e3:hover { transform: translate(-50%, 50%) scale(1.1); }
2527.ImageCropper-bottomLeft-2a6e3:active { transform: translate(-50%, 50%) scale(0.9); }
2528.ImageCropper-bottomRight-9cd72 { bottom: 0px; right: 0px; transform: translate(50%, 50%); }
2529.ImageCropper-bottomRight-9cd72:hover { transform: translate(50%, 50%) scale(1.1); }
2530.ImageCropper-bottomRight-9cd72:active { transform: translate(50%, 50%) scale(0.9); }
2531.VisualSearch-root-5f1c4 { display: flex; flex-direction: column; position: absolute; top: calc(100% + var(--spacings-s4)); background-color: var(--background-colors-base); padding: var(--spacings-s12); width: 100%; height: 308px; z-index: 100; border: 2px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r12); max-width: 629px; }
2532.VisualSearch-mobileRoot-66fe2 { position: absolute; top: calc(100% + var(--spacings-s4)); width: 100%; z-index: 100; }
2533.VisualSearch-imageCropperContainerMobile-078c9 { display: flex; justify-content: center; height: auto; }
2534.VisualSearch-dropArea-a6922 { cursor: pointer; border: 2px dashed var(--primary-colors-alpha-20); border-radius: var(--corner-radius-r8); background-color: var(--primary-colors-alpha-20); flex-direction: column; padding: var(--spacings-s16); height: 220px; text-align: center; align-items: center; justify-content: center; position: relative; display: flex; transition: background-color 0.2s, border-color 0.2s; }
2535.VisualSearch-dropAreaPending-304ef { cursor: progress; pointer-events: none; opacity: 0.5; }
2536.VisualSearch-dropAreaDragOver-1f5c7 { background-color: var(--primary-colors-alpha-50); border-color: var(--primary-colors-base-default); }
2537.VisualSearch-iconCircle-e1905 { background-color: var(--primary-colors-alpha-20); border-radius: var(--corner-radius-circle); width: 64px; height: 64px; margin: 0 auto var(--spacings-s16); display: flex; align-items: center; justify-content: center; color: var(--primary-colors-base-default); }
2538.VisualSearch-imageContainer-c0eb0 { display: flex; flex-direction: row; flex-grow: 1; position: relative; width: 100%; height: 100%; min-height: 0px; }
2539.VisualSearch-imageContainerMobile-fb020 { gap: var(--spacings-s16); max-height: calc(100dvh - 250px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)); height: auto; }
2540.VisualSearch-image-53ddd { flex-grow: 1; border-radius: var(--corner-radius-r12); position: absolute; top: 50%; left: 50%; max-width: 100%; max-height: 100%; transform: translate(-50%, -50%); object-fit: contain; width: auto; height: auto; }
2541.VisualSearch-mobileImage-c478e { border-radius: var(--corner-radius-r12); max-height: 100%; max-width: 100%; object-fit: contain; }
2542.VisualSearch-text-8bb00 { font-size: var(--typography-t5-font-size); }
2543.VisualSearch-uploadLink-e2d61 { margin-left: var(--spacings-s4); text-decoration: none; cursor: pointer; }
2544.VisualSearch-inputArea-e186a { display: flex; margin-top: var(--spacings-s12); gap: var(--spacings-s12); }
2545.VisualSearch-mobileInputArea-56850 { display: inline-grid; margin-top: var(--spacings-s12); gap: var(--spacings-s12); width: 100%; }
2546.VisualSearch-input-61142 { height: 40px; }
2547.VisualSearch-hiddenInput-54f7b { display: none; }
2548.VisualSearch-removeIcon-d6b45 { right: var(--spacings-s8); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 1; }
2549.VisualSearch-button-41edc { padding: var(--spacings-s12) var(--spacings-s24); color: var(--primary-colors-base-default); border: 1px solid var(--primary-colors-base-default); background-color: transparent; border-radius: var(--corner-radius-r24); cursor: pointer; transition: background-color 0.3s; }
2550.VisualSearch-button-41edc:hover { background-color: var(--primary-colors-alpha-20); }
2551.VisualSearch-searchButtonMobile-f1cbf { margin-block-start: var(--spacings-s16); }
2552.VisualSearch-searchButtonMobile-f1cbf > svg { fill: var(--primary-colors-base-default); color: var(--primary-colors-base-default); }
2553.VisualSearch-searchTypes-6c511 { display: flex; gap: var(--spacings-s12); margin-bottom: var(--spacings-s8); overflow-x: auto; flex-shrink: 0; scrollbar-width: none; }
2554.VisualSearch-searchTypes-6c511::-webkit-scrollbar { display: none; }
2555.VisualSearch-chip-b3f59 { flex: 1 0 auto; min-width: fit-content; text-align: center; }
2556.EmailForm-root-90783 { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2557.EmailForm-container-31b01 { display: grid; gap: var(--spacings-s16);
2557 overflow-y: scroll; }
2558@media (hover: hover) and (pointer: fine) {
2559  .EmailForm-container-31b01::-webkit-scrollbar { width: 4px; }
2560  .EmailForm-container-31b01::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
2561  .EmailForm-container-31b01::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
2562  .EmailForm-container-31b01::-webkit-scrollbar-corner { background: transparent; }
2563}
2564@supports (-moz-appearance: none) {
2565  .EmailForm-container-31b01 { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2566}
2567@media (hover: none) and (pointer: coarse) {
2568  .EmailForm-container-31b01::-webkit-scrollbar { display: none; }
2569}
2570.EmailForm-inputContainer-b95b3 { display: grid; gap: var(--spacings-s4); }
2571.EmailForm-inputContainer-b95b3 .input-field-auth > input { color: var(--control-colors-value-default); }
2572.EmailForm-inputContainer-b95b3 .input-field-auth > button { cursor: default; }
2573.EmailForm-input-ec168 svg > path:not([fill]) { fill: var(--error-colors-base-default); }
2574.EmailForm-input-ec168:focus-within svg > path:not([fill]) { fill: var(--error-colors-base-action); }
2575.EmailForm-errText-b4244 { color: var(--error-colors-base-default); }
2576.EmailForm-recaptchaFallback-29dba:has(> div) { height: 84px; max-width: 100%; overflow: hidden; }
2577@media screen and (max-width: 380px) {
2578  .EmailForm-recaptchaFallback-29dba:has(> div) { height: 71px; transform: scale(0.85); transform-origin: left top; }
2579}
2580.EmailForm-rootNewDesign-438f9 { justify-content: flex-start; }
2581.EmailForm-containerNewDesign-6c46b.EmailForm-containerNewDesign-6c46b { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2582.EmailForm-containerNewDesign-6c46b.EmailForm-containerNewDesign-6c46b::-webkit-scrollbar { display: none; }
2583@media screen and (max-width: 768px) {
2584  .EmailForm-containerNewDesign-6c46b.EmailForm-containerNewDesign-6c46b { padding: var(--spacings-s0); }
2585}
2586.PasswordCheck-field-f6f3f { display: flex; align-items: center; padding: var(--spacings-s4) var(--spacings-s6); margin-right: var(--spacings-s4); margin-bottom: var(--spacings-s4); height: 24px; border-radius: var(--corner-radius-r8); }
2587.PasswordCheck-field-f6f3f.error { background-color: var(--background-colors-tint-1); }
2588.PasswordCheck-field-f6f3f.success { background-color: var(--primary-colors-alpha-20); }
2589.PasswordCheck-text-34e66 { color: var(--text-colors-tint-2); }
2590.PasswordCheck-text-34e66.error { color: var(--error-colors-base-default); }
2591.PasswordCheck-text-34e66.success { color: var(--primary-colors-base-active); }
2592.CreatePasswordForm-root-45827 { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2593.CreatePasswordForm-headSection-254db { display: grid; gap: var(--spacings-s16); overflow-y: scroll; }
2594@media (hover: hover) and (pointer: fine) {
2595  .CreatePasswordForm-headSection-254db::-webkit-scrollbar { width: 4px; }
2596  .CreatePasswordForm-headSection-254db::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
2597  .CreatePasswordForm-headSection-254db::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
2598  .CreatePasswordForm-headSection-254db::-webkit-scrollbar-corner { background: transparent; }
2599}
2600@supports (-moz-appearance: none) {
2601  .CreatePasswordForm-headSection-254db { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2602}
2603@media (hover: none) and (pointer: coarse) {
2604  .CreatePasswordForm-headSection-254db::-webkit-scrollbar { display: none; }
2605}
2606.CreatePasswordForm-passwordField-5a1c5 .input-field-auth > input { color: var(--control-colors-value-default); }
2607.CreatePasswordForm-passwordField-5a1c5 .input-field-auth > button { color: var(--control-colors-value-default); }
2608.CreatePasswordForm-passwordField-5a1c5 .input-field-auth > button:hover { color: var(--control-colors-value-default); }
2609.CreatePasswordForm-createPasswordInput-889c8 { width: 100%; }
2610.CreatePasswordForm-passwordLabel-740b4 { display: block; margin-bottom: var(--spacings-s6); }
2611.CreatePasswordForm-checkboxSection-55415 { display: grid; grid-template-columns: var(--spacings-s32) 1fr; margin-top: var(--spacings-s6); cursor: pointer; }
2612.CreatePasswordForm-passwordCheck-27c5d { display: flex; flex-wrap: wrap; margin-top: var(--spacings-s6); }
2613.CreatePasswordForm-errorMessage-1e8cc { display: block; color: var(--error-colors-base-default); font-size: var(--typography-t3-font-size); font-weight: 600; margin-top: var(--spacings-s4); min-height: 16px; }
2614.CreatePasswordForm-recaptchaFallback-da264:has(> div) { height: 84px; max-width: 100%; overflow: hidden; }
2615@media screen and (max-width: 380px) {
2616  .CreatePasswordForm-recaptchaFallback-da264:has(> div) { height: 71px; transform: scale(0.85); transform-origin: left top; }
2617}
2618.CreatePasswordForm-description-1260a { word-break: break-word; }
2619.CreatePasswordForm-rootNewDesign-c6951 { justify-content: flex-start; }
2620.CreatePasswordForm-headSectionNewDesign-bf6a8.CreatePasswordForm-headSectionNewDesign-bf6a8 { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; padding: var(--spacings-s0) var(--spacings-s32); text-align: left; overflow-y: auto; scrollbar-width: none; }
2621.CreatePasswordForm-headSectionNewDesign-bf6a8.CreatePasswordForm-headSectionNewDesign-bf6a8::-webkit-scrollbar { display: none; }
2622@media screen and (max-width: 768px) {
2623  .CreatePasswordForm-headSectionNewDesign-bf6a8.CreatePasswordForm-headSectionNewDesign-bf6a8 { padding: var(--spacings-s0); }
2624}
2625.auth-field-message .CreatePasswordForm-errorMessage-1e8cc { margin-top: var(--spacings-s0); }
2626.BiometricCheckbox-checkboxSection-78320 { display: flex; align-items: center; gap: var(--spacings-s6); margin-top: var(--spacings-s6); cursor: pointer; }
2627.MarketingCheckbox-checkboxSection-19399 { display: flex; align-items: center; gap: var(--spacings-s6); margin-top: var(--spacings-s6); cursor: pointer; }
2628.grecaptcha-badge { visibility: hidden; }
2629.RecaptchaLegal-root-31719 { color: var(--text-colors-tint-1); font-size: var(--typography-t4-font-size); font-weight: 500; line-height: var(--typography-t4-line-height); }
2630@media screen and (min-width: 833px) and (max-width: 1030px) {
2631  .RecaptchaLegal-root-31719 { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
2632}
2633.RecaptchaLegal-link-7d5da { font-weight: 600; color: var(--primary-colors-base-default); }
2634.RecaptchaLegal-link-7d5da:hover { color: var(--primary-colors-base-active-action); }
2635.InlineSupportLink-link-07428 { text-decoration: underline; }
2636.InsertPasswordForm-root-573bf { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2637.InsertPasswordForm-formContent-f5daa { display: grid; gap: var(--spacings-s16);
2637 overflow-y: scroll; }
2638@media (hover: hover) and (pointer: fine) {
2639  .InsertPasswordForm-formContent-f5daa::-webkit-scrollbar { width: 4px; }
2640  .InsertPasswordForm-formContent-f5daa::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
2641  .InsertPasswordForm-formContent-f5daa::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
2642  .InsertPasswordForm-formContent-f5daa::-webkit-scrollbar-corner { background: transparent; }
2643}
2644@supports (-moz-appearance: none) {
2645  .InsertPasswordForm-formContent-f5daa { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2646}
2647@media (hover: none) and (pointer: coarse) {
2648  .InsertPasswordForm-formContent-f5daa::-webkit-scrollbar { display: none; }
2649}
2650.InsertPasswordForm-passwordContainer-1757b { display: grid; gap: var(--spacings-s6); }
2651.InsertPasswordForm-passwordContainer-1757b .input-field-auth > input { color: var(--control-colors-value-default); }
2652.InsertPasswordForm-passwordContainer-1757b .input-field-auth > button { color: var(--control-colors-value-default); }
2653.InsertPasswordForm-passwordContainer-1757b .input-field-auth > button:hover { color: var(--control-colors-value-default); }
2654.InsertPasswordForm-passwordField-f009f { width: 100%; }
2655.InsertPasswordForm-recaptchaFallback-6ee6d:has(> div) { height: 84px; max-width: 100%; overflow: hidden; }
2656@media screen and (max-width: 380px) {
2657  .InsertPasswordForm-recaptchaFallback-6ee6d:has(> div) { height: 71px; transform: scale(0.85); transform-origin: left top; }
2658}
2659.InsertPasswordForm-rootNewDesign-6de4c { justify-content: flex-start; }
2660.InsertPasswordForm-formContentNewDesign-ce58e.InsertPasswordForm-formContentNewDesign-ce58e { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2661.InsertPasswordForm-formContentNewDesign-ce58e.InsertPasswordForm-formContentNewDesign-ce58e::-webkit-scrollbar { display: none; }
2662@media screen and (max-width: 768px) {
2663  .InsertPasswordForm-formContentNewDesign-ce58e.InsertPasswordForm-formContentNewDesign-ce58e { padding: var(--spacings-s0); }
2664}
2665.InsertPasswordForm-linksRowNewDesign-10fdf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--spacings-s8); }
2666.InsertPasswordForm-signUpNewDesign-503f6 { display: flex; align-items: center; gap: var(--spacings-s8); }
2667.InsertPasswordForm-forgotPasswordNewDesign-b28b5.InsertPasswordForm-forgotPasswordNewDesign-b28b5 { color: var(--text-colors-base); }
2668.InsertPasswordForm-forgotPasswordNewDesign-b28b5.InsertPasswordForm-forgotPasswordNewDesign-b28b5:hover { color: var(--text-colors-tint-1); }
2669.InsertPasswordForm-signUpButton-cc4d9.InsertPasswordForm-signUpButton-cc4d9 { height: auto; padding: var(--spacings-s0); font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); font-weight: 700; }
2670.InsertPasswordForm-legalNewDesign-c832b { margin-top: auto; flex-shrink: 0; display: grid; gap: var(--spacings-s8); padding: var(--spacings-s0) var(--spacings-s32); }
2671@media screen and (max-width: 768px) {
2672  .InsertPasswordForm-legalNewDesign-c832b { padding: var(--spacings-s0); }
2673}
2674.ResetPassword-root-55492 { display: flex; flex-direction: column; height: 100%; }
2675.ResetPassword-content-c1f85 { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; gap: var(--spacings-s24); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2676.ResetPassword-content-c1f85::-webkit-scrollbar { display: none; }
2677@media screen and (max-width: 768px) {
2678  .ResetPassword-content-c1f85 { padding: var(--spacings-s0); }
2679}
2680.ResetPassword-field-dadff { display: grid; gap: var(--spacings-s6); }
2681.ResetPassword-input-6a002 { width: 100%; }
2682.ResetPassword-intro-8d491 { display: grid; gap: var(--spacings-s12); }
2683.ResetLinkSent-root-9dc96 { display: flex; flex-direction: column; height: 100%; }
2684.ResetLinkSent-content-55b44 { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; gap: var(--spacings-s24); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2685.ResetLinkSent-content-55b44::-webkit-scrollbar { display: none; }
2686@media screen and (max-width: 768px) {
2687  .ResetLinkSent-content-55b44 { padding: var(--spacings-s0); }
2688}
2689.ResetLinkSent-intro-97963, .ResetLinkSent-actions-10300 { display: grid; gap: var(--spacings-s12); }
2690.ResetLinkSent-successIcon-753b9 { flex-shrink: 0; }
2691.ResetLinkSent-successIcon-753b9 > path:not([fill]) { fill: var(--success-colors-base-default); }
2692.AccountTermination-root-7c011 { display: grid; align-items: center; justify-content: center; flex-direction: column; max-width: 100%; height: 100%; margin: var(--spacings-s0) auto; text-align: center; }
2693.AccountTermination-image-7fc03 { width: 116px; height: 116px; margin: var(--spacings-s0) auto; }
2694.AccountTermination-subtitle-3f6b6 { line-height: var(--typography-t5-line-height); }
2695.AccountTermination-strong-f4330 { font-weight: 700; font-size: var(--typography-t5-font-size); }
2696.AccountTermination-link-4efad { font-weight: 600; color: var(--primary-colors-base-default); }
2697.AccountTermination-link-4efad:hover { color: var(--primary-colors-base-active-action); }
2698.AccountTermination-icon-50ad0 { width: 116px; height: 116px; }
2699.CheckboxWithText-root-9e8c1 { width: 100%; height: fit-content; display: grid; grid-template-columns: 30px 1fr; gap: var(--spacings-s12); }
2700.CheckboxWithText-description-bfc36 { display: flex; margin-top: var(--spacings-s4); justify-content: center; flex-flow: column; }
2701.ToGetStarted-root-900f5 { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2702.ToGetStarted-contentContainer-cdb7e { display: grid; gap: var(--spacings-s16); padding-bottom: var(--spacings-s12); overflow-y: scroll; }
2703.ToGetStarted-container-79971 { display: grid; gap: var(--spacings-s16); }
2704.ToGetStarted-mandatorySection-429e6 { display: flex; flex-direction: column; justify-content: center; gap: var(--spacings-s16); }
2705.ToGetStarted-optionalTitle-a3ea4::before { content: ""; width: 100%; height: 2px; display: block; background: var(--control-colors-border-default); margin-bottom: var(--spacings-s16); }
2706.ToGetStarted-optionalSection-bae47 { display: flex; flex-direction: column; justify-content: center; gap: var(--spacings-s16); }
2707.ToGetStarted-footerContainer-4c6a0 { position: relative; }
2708.ToGetStarted-footerContainer-4c6a0::before { position: absolute; left: 50%; display: block; content: ""; background-color: var(--control-colors-border-default); height: 1px; width: calc(100% + 84px); transform: translate(-50%); }
2709.ToGetStarted-legalText-087dd { display: block; margin: var(--spacings-s16) auto var(--spacings-s12); text-align: center; }
2710.ToGetStarted-legalText-087dd a { text-decoration: underline; color: var(--text-colors-tint-1); }
2711.ToGetStarted-legalText-087dd a:not(:first-child) { color: var(--primary-colors-base-default); }
2712.ExpandableText-root-8e7de { width: 100%; height: fit-content; position: relative; margin: var(--spacings-s0) auto; }
2713.ExpandableText-root-8e7de strong { font-weight: 400; }
2714.ExpandableText-expandBtn-750bc { position: relative; margin-left: var(--spacings-s4); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: transparent; color: var(--primary-colors-base-default); cursor: pointer; font-size: inherit; }
2715.SendEmailCode-headerTextContainer-ad6ec { display: flex; flex-direction: column; gap: var(--spacings-s16); }
2716.SendEmailCode-resendButton-c4308 { height: auto; padding: 2.5px 0px 0px; }
2717.WelcomeBackEmailCodeAndSSO-divider-79919 { display: flex; justify-content: center; align-items: center; color: var(--text-colors-tint-2); text-transform: uppercase; }
2718.WelcomeBackEmailCodeAndSSO-divider-79919::after, .WelcomeBackEmailCodeAndSSO-divider-79919::before { content: ""; display: block; background-color: var(--background-colors-tint-3); width: 100%; height: 1px; margin: var(--spacings-s0) var(--spacings-s8); }
2719.WelcomeBackEmailCodeAndSSO-mainContainer-63866 { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2720.WelcomeBackEmailCodeAndSSO-footerButtonsContainer-1fb09 { display: flex; flex-direction: column; gap: var(--spacings-s16); }
2721.WelcomeBackEmailCodeAndSSO-digitCodeContainer-2ce91 { display: flex; flex-direction: column; gap: var(--spacings-s4); }
2722.WelcomeBackEmailCodeAndSSO-bottomButtonsContainer-ab35d { display: flex; gap: var(--spacings-s16); }
2723.WelcomeBackEmailCodeAndSSO-rootNewDesign-3c1f1.WelcomeBackEmailCodeAndSSO-rootNewDesign-3c1f1 { justify-content: flex-start; }
2724.WelcomeBackEmailCodeAndSSO-contentNewDesign-88058 { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; gap: var(--spacings-s16); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2725.WelcomeBackEmailCodeAndSSO-contentNewDesign-88058::-webkit-scrollbar { display: none; }
2726@media screen and (max-width: 768px) {
2727  .WelcomeBackEmailCodeAndSSO-contentNewDesign-88058 { padding: var(--spacings-s0); }
2728}
2729.WelcomeBackMultipleSSO-headerTextContainer-a7494 { display: flex; flex-direction: column; gap: var(--spacings-s16); }
2730.WelcomeBackMultipleSSO-mainContainer-e46bd { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2731.WelcomeBackMultipleSSO-footerButtonsContainer-dc283 { display: flex; flex-direction: column; gap: var(--spacings-s16); }
2732.WelcomeBackMultipleSSO-bottomButtonsContainer-b7b88 { display: flex; gap: var(--spacings-s16); }
2733.WelcomeBackMultipleSSO-mainContainerNewDesign-9c92e { justify-content: flex-start; }
2734.WelcomeBackMultipleSSO-contentNewDesign-ae885 { flex: 1 1 auto; min-height: 0px; display: flex; flex-direction: column; justify-content: center; gap: var(--spacings-s16); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2735.WelcomeBackMultipleSSO-contentNewDesign-ae885::-webkit-scrollbar { display: none; }
2736@media screen and (max-width: 768px) {
2737  .WelcomeBackMultipleSSO-contentNewDesign-ae885 { padding: var(--spacings-s0); }
2738}
2739.MarketingCheckbox-checkboxSection-19399, .BiometricCheckbox-checkboxSection-78320 { display: flex; align-items: center; gap: var(--spacings-s6); margin-top: var(--spacings-s6); cursor: pointer; }
2740.BiometricCheckbox-link-9f8ca { font-weight: 600; color: var(--primary-colors-base-default); }
2741.BiometricCheckbox-link-9f8ca:hover { color: var(--primary-colors-base-active-action); }
2742.UsernameForm-root-d901c { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2743.UsernameForm-inputContainer-db088 { display: grid; gap: var(--spacings-s4); }
2744.UsernameForm-inputContainer-db088 .input-field-auth > input { color: var(--control-colors-value-default); }
2745.UsernameForm-inputContainer-db088 .input-field-auth > button { cursor: pointer; }
2746.UsernameForm-errText-e79bd { color: var(--error-colors-base-default); }
2747.UsernameForm-headSection-500ef { display: grid; gap: var(--spacings-s16);
2747 overflow-y: scroll; }
2748@media (hover: hover) and (pointer: fine) {
2749  .UsernameForm-headSection-500ef::-webkit-scrollbar { width: 4px; }
2750  .UsernameForm-headSection-500ef::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
2751  .UsernameForm-headSection-500ef::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
2752  .UsernameForm-headSection-500ef::-webkit-scrollbar-corner { background: transparent; }
2753}
2754@supports (-moz-appearance: none) {
2755  .UsernameForm-headSection-500ef { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
2756}
2757@media (hover: none) and (pointer: coarse) {
2758  .UsernameForm-headSection-500ef::-webkit-scrollbar { display: none; }
2759}
2760.UsernameForm-checkboxSection-5be22 { display: grid; grid-template-columns: var(--spacings-s32) 1fr; margin-top: var(--spacings-s6); cursor: pointer; }
2761.UsernameForm-errorMessage-1d434 { display: block; color: var(--error-colors-base-default); font-size: var(--typography-t3-font-size); font-weight: 600; margin-top: var(--spacings-s4); min-height: 16px; }
2762.UsernameForm-buttonWrapper-1daee { display: grid; gap: var(--spacings-s8); grid-template-columns: var(--spacings-s40) 1fr; align-content: end; padding-top: var(--spacings-s6); width: 100%; }
2763.EmailVerification-mainContainer-063a2 { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
2764.EmailVerification-headerContainer-7abd3 { display: flex; flex-direction: column; gap: var(--spacings-s16); }
2765.EmailVerification-mainContainerNewDesign-22b68 { justify-content: flex-start; }
2766.EmailVerification-footerButtonsContainer-0151f { display: flex; flex-direction: column; gap: var(--spacings-s16); }
2767.EmailVerification-codeSection-a8aa4 { display: flex; flex-direction: column; gap: var(--spacings-s8); }
2768.EmailVerification-digitCodeContainer-fb2bb { display: flex; flex-direction: column; gap: var(--spacings-s4); }
2769.EmailVerification-resendRow-4a072 { display: flex; align-items: baseline; gap: var(--spacings-s4); }
2770.EmailVerification-resendButton-197ff { height: auto; padding: 0px; }
2771.EmailVerification-bottomButtonsContainer-db29b { display: flex; gap: var(--spacings-s16); }
2772.EmailVerification-content-dcd06 { display: flex; flex-direction: column; justify-content: safe center; flex: 1 1 auto; min-height: 0px; gap: var(--spacings-s16); padding: var(--spacings-s0) var(--spacings-s32); overflow-y: auto; scrollbar-width: none; }
2773.EmailVerification-content-dcd06::-webkit-scrollbar { display: none; }
2774@media screen and (max-width: 768px) {
2775  .EmailVerification-content-dcd06 { padding: var(--spacings-s0); }
2776}
2777.EmailVerification-skipButton-40bac { background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; cursor: pointer; color: var(--text-colors-base); font: inherit; text-align: center; width: 100%; }
2778.EmailVerification-skipButton-40bac:focus-visible { outline: auto; }
2779.TitleWithDescription-title-30479 { display: block; margin-bottom: var(--spacings-s4); }
2780.Links-title-ef4c4 { display: inline-block; padding-block: var(--spacings-s4); padding-inline: var(--spacings-s4); }
2781.Links-container-d8489 { list-style-type: none; }
2782.Links-linkWrapper-130c2 { padding-inline: var(--spacings-s4); padding-block: var(--spacings-s6); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
2783.Links-link-68266:hover { color: var(--primary-colors-base-default); }
2784.rc-subsection-item__links-container { display: grid; list-style-type: none; }
2785.rc-subsection-item__title { display: block; margin-bottom: var(--spacings-s8); padding-inline: var(--spacings-s4); }
2786.rc-subsection-item__description { padding-inline: var(--spacings-s4); }
2787.rc-subsection-item__title-href > a { font-size: var(--typography-t5-font-size); }
2788.rc-subsection-item__title-href > a:hover { color: var(--negative-colors-base-action); }
2789.rc-subsection-item__more { display: inline-block; margin-top: var(--spacings-s8); }
2790.rc-menu-item-section { overflow: hidden; padding: var(--spacings-s24); }
2791.rc-menu-item-section__container { display: grid; grid-template-columns: repeat(var(--rc-menu-item-section-cols),auto); list-style-type: none; }
2792.rc-menu-item-section__image-wrapper { max-width: 306px; }
2793.rc-menu-item-section__heading { display: flex; }
2794.rc-menu-item-section__title-with-description { margin-bottom: var(--spacings-s24); }
2795.rc-menu-item-section__title-with-description--has-href { margin-bottom: 0px; }
2796.rc-menu-item-section__hr { border: 0px; background-color: var(--background-colors-tint-3); color: var(--background-colors-tint-3); font-size: 0px; height: 1px; margin-block: var(--spacings-s16); padding: 0px; }
2797.rc-menu-item-section__btn { flex-grow: 1; text-align: right; }
2798.rc-menu-dropdown { cursor: default;
2798 left: 136px; padding-top: 20px; position: absolute; top: 60px; }
2799.rc-menu-dropdown .MenuDropdown { display: grid; }
2800.rc-menu-dropdown__container { box-shadow: rgba(0, 0, 0, 0.24) 0px 4px 12px; height: 100%; list-style-type: none; }
2801.rc-menu-dropdown__container::before { content: ""; position: absolute; top: 9px; left: 0px; right: 0px; height: var(--spacings-s10); background-color: var(--positive-colors-base-default); }
2802.rc-menu-item { border-radius: var(--corner-radius-r8); cursor: default; display: inline-block; margin-right: var(--spacings-s4); padding: var(--spacings-s12) var(--spacings-s16); vertical-align: middle; }
2803.rc-menu-item:hover { background-color: var(--control-colors-button-background-action); }
2804.rc-menu-item:hover .rc-menu-item__text { color: var(--control-colors-text-active); }
2805@media (min-width: 1024px) {
2806  .rc-menu-item.Create .MenuDropdown { left: 0px; width: 100%; max-width: 100%; }
2807  .rc-menu-item.Create .MenuDropdown .MenuDropdownContainer { display: grid; grid-template-columns: 384px 1fr; }
2808  .rc-menu-item.Create .Section0 { gap: var(--spacings-s16); grid-template-columns: 1fr 1fr; }
2809  .rc-menu-item.Create .SubsectionItem { gap: var(--spacings-s16); }
2810  .rc-menu-item.Create .Templates .SubsectionItem { display: block; }
2811  .rc-menu-item.Create .Section1 { gap: var(--spacings-s16); grid-template-areas: "a a" "b c"; grid-template-columns: 182px 182px; }
2812  .rc-menu-item.Create .Section1 .Subsection0 { grid-area: a; }
2813  .rc-menu-item.Create .Section1 .Subsection1 { grid-area: b; }
2814  .rc-menu-item.Create .Section1 .Subsection2 { grid-area: c; margin-left: var(--spacings-s56); }
2815  .rc-menu-item.Create .Section1 .SubsectionItem { grid-template-columns: 182px 182px; gap: var(--spacings-s72); }
2816  .rc-menu-item.ForBusiness .MenuDropdownContainer { display: flex; }
2817  .rc-menu-item.ForBusiness .MenuDropdownContainer .Section0 { display: flex; flex-wrap: wrap; gap: var(--spacings-s72); justify-content: stretch; }
2818  .rc-menu-item.ForBusiness .MenuDropdownContainer .WithImg { display: flex; flex-direction: column-reverse; justify-content: flex-end; text-align: center; }
2819  .rc-menu-item.ForBusiness .MenuDropdownContainer .WithImg .MenuItemSectionImg { height: 180px; margin-bottom: var(--spacings-s32); width: 258px; }
2820  .rc-menu-item.ForBusiness .MenuDropdownContainer .WithImg .MenuItemSectionMore { margin-bottom: 0px; }
2821  .rc-menu-item.LearnConnect .MenuDropdownContainer { display: grid; grid-template-columns: 412px 434px; }
2822  .rc-menu-item.LearnConnect .MenuDropdownContainer .Section0 { display: grid; grid-template-columns: 166px 166px; grid-template-areas: "a b" "a c" "a d"; }
2823  .rc-menu-item.LearnConnect .MenuDropdownContainer .Subsection0 { grid-area: a; }
2824  .rc-menu-item.LearnConnect .MenuDropdownContainer .Subsection0 .SubsectionItemTitle { margin-bottom: var(--spacings-s16); }
2825  .rc-menu-item.LearnConnect .MenuDropdownContainer .Subsection1 { grid-area: b; }
2826  .rc-menu-item.LearnConnect .MenuDropdownContainer .Subsection1 .SubsectionItemTitle { margin-bottom: var(--spacings-s2); }
2827  .rc-menu-item.LearnConnect .MenuDropdownContainer .Hr { }
2828  .rc-menu-item.LearnConnect .MenuDropdownContainer .Subsection3 { grid-area: d; }
2829  .rc-menu-item.LearnConnect .MenuDropdownContainer .Subsection3 .SubsectionItemTitle { margin-bottom: var(--spacings-s2); }
2830  .rc-menu-item.LearnConnect .MenuDropdownContainer .WithImg { display: grid; grid-template-columns: 172px auto; grid-template-areas: "a a" "b c"; }
2831  .rc-menu-item.LearnConnect .MenuDropdownContainer .WithImg .MenuItemSectionImg { height: 248px; width: 172px; grid-area: b; }
2832  .rc-menu-item.LearnConnect .MenuDropdownContainer .WithImg .MenuItemSectionImg > img { width: 100%; }
2833  .rc-menu-item.LearnConnect .MenuDropdownContainer .WithImg > div { grid-area: a; }
2834  .rc-menu-item.LearnConnect .MenuDropdownContainer .WithImg .Section1 { display: block; margin-left: var(--spacings-s32); }
2835}
2836@media (max-width: 1279px) {
2837  .rc-menu-item.ForBusiness .MenuDropdown { left: 0px; width: 100%; }
2838  .rc-menu-item.ForBusiness .MenuDropdown .MenuDropdownContainer { justify-content: space-between; background: var(--positive-colors-base-default); }
2839  .rc-menu-item.ForBusiness .MenuDropdown .MenuDropdownContainer .Section0 { justify-content: stretch; }
2840}
2841@media (min-width: 1280px) {
2842  .rc-menu-item.Create .MenuDropdown .MenuDropdownContainer { grid-template-columns: 478px 1fr; }
2843  .rc-menu-item.Create .SubsectionItem { gap: var(--spacings-s12); grid-template-columns: 134px 134px; }
2844  .rc-menu-item.Create .Section1 { gap: var(--spacings-s16); grid-template-columns: 356px 172px 172px; grid-template-areas: "a b c"; }
2845  .rc-menu-item.Create .Section1 .Subsection2 { margin-left: 0px; }
2846  .rc-menu-item.Create .Section1 .SubsectionItem { grid-template-columns: 172px 172px; gap: var(--spacings-s16); }
2847}
2848@media (min-width: 1366px) {
2849  .rc-menu-item.Create .MenuDropdown .MenuDropdownContainer { grid-template-columns: 510px 1fr; }
2850  .rc-menu-item.Create .MenuDropdown .MenuDropdownContainer .MenuItemSection1 { padding-left: var(--spacings-s44); }
2851  .rc-menu-item.Create .Section0, .rc-menu-item.Create .Section1 { gap: var(--spacings-s40); }
2852}
2853@media (min-width: 1600px) {
2854  .rc-menu-item.Create .MenuDropdown .MenuDropdownContainer { grid-template-columns: 590px 1fr; }
2855  .rc-menu-item.Create .Section0, .rc-menu-item.Create .Section1 { gap: var(--spacings-s48); }
2856}
2857@media (min-width: 1800px) {
2858  .rc-menu-item.Create .MenuDropdown { left: 160px; max-width: 1600px; }
2859}
2860.rc-menu-item__link { color: var(--control-colors-text-default); }
2861.rc-menu-item__link:hover { background-color: unset; }
2862.rc-menu-item__link:hover > a { color: var(--control-colors-text-active); }
2863.rc-menu-item__text { color: var(--control-colors-text-default); display: inline-block; margin-right: var(--spacings-s4); vertical-align: middle; }
2864.rc-menu-item__icon { display: inline-block; vertical-align: middle; }
2865.rc-menu-item__hidden { display: none; }
2866.DesktopHeader-root-2571c { align-items: center; background-color: var(--positive-colors-base-default); border-bottom: 1px solid var(--background-colors-tint-3); display: flex; height: 80px; padding: var(--spacings-s12) var(--spacings-s24); position: sticky; top: 0px; }
2867.DesktopHeader-root-2571c .sign { border-radius: var(--corner-radius-r24); min-width: 80px; }
2868.DesktopHeader-logoContainer-7b0d9 > button { margin-right: var(--spacings-s32); padding: 0px; }
2869.DesktopHeader-logo-38242 { height: 56px; }
2870.DesktopHeader-btns-e18dc { display: flex; justify-content: flex-end; flex-grow: 1; align-items: center; margin-right: var(--spacings-s10); }
2871.DesktopHeader-btns-e18dc > a { margin-left: var(--spacings-s12); }
2872.DesktopHeader-btns-e18dc > button { margin-left: var(--spacings-s12); }
2873#credential_picker_container { top: 100px !important; }
2874.SearchField-root-75fa4 { max-width: var(--rc-search-field-width); width: 40px; min-width: 0px; overflow: hidden; }
2875@media screen and (max-width: 1366px) {
2876  .SearchField-root-75fa4 { max-width: 212px; width: 40px; }
2877}
2878@media screen and (max-width: 1280px) {
2879  .SearchField-root-75fa4 { max-width: 126px; width: 40px; }
2880}
2881@supports not (margin-block-start: 24px) {
2882  .SearchField-root-75fa4 { margin-top: var(--spacings-s12); margin-bottom: var(--spacings-s12); }
2883}
2884.SearchField-root-75fa4 { position: relative; }
2885@supports (margin-block-start: 24px) {
2886  .SearchField-noAnimation-65a7c { margin-block-start: var(--spacings-s12); margin-block-end: var(--spacings-s12); }
2887}
2888.SearchField-inputVisible-42b11 { width: var(--rc-search-field-width); overflow: visible; }
2889@media screen and (max-width: 1366px) {
2890  .SearchField-inputVisible-42b11 { width: 212px; }
2891}
2892@media screen and (max-width: 1280px) {
2893  .SearchField-inputVisible-42b11 { width: 126px; }
2894}
2895.SearchField-searchWrapper-50efe { position: relative; display: flex; align-items: center; justify-content: flex-end; min-width: 0px; }
2896.SearchField-searchInput-9703c { opacity: 0; visibility: hidden; }
2897.SearchField-searchInputInputVisible-07df8 { opacity: 1; transition: width 0.5s, opacity 0.5s; visibility: visible; }
2898.SearchField-searchIcon-7c537 { cursor: pointer; position: absolute; z-index: 10; right: var(--rc-search-field-icon-right); opacity: 0; animation: auto ease 0s 1 normal none running none; }
2899.SearchField-searchIconAnimateIn-e107d { right: 0px; opacity: 1; }
2900.SearchField-searchIconAnimateOut-06b77 { animation: 0.3s ease-out 0s 1 normal none running SearchField-slideLeft-96371; }
2901.SearchField-searchIconRtl-f3d45 { cursor: pointer; position: absolute; z-index: 10; left: 0px; opacity: 0; animation: auto ease 0s 1 normal none running none; }
2902.SearchField-searchIconRtlAnimateIn-240e2 { opacity: 1; }
2903.SearchField-searchIconRtlAnimateOut-99e95 { animation: 0.3s ease-out 0s 1 normal none running SearchField-slideLeft-96371; }
2904.SearchField-divider-a419a { height: 24px; width: 1px; background-color: var(--control-colors-border-default); margin-right: var(--spacings-s12); }
2905.SearchField-visualSearchWrapper-1515c { transition-property: background-color; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease); display: flex; align-items: center; border: 2px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r12); background-color: var(--control-colors-field-background-default); opacity: 0; visibility: hidden; max-width: var(--rc-search-field-width); width: 40px; }
2906.SearchField-visualSearchWrapper-1515c:has(input:focus) { background-color: var(--control-colors-field-background-active); }
2907@media (hover: hover) and (pointer: fine) {
2908  .SearchField-visualSearchWrapper-1515c:hover { background-color: var(--control-colors-field-background-active-action); }
2909}
2910.SearchField-visualSearchWrapperInputVisible-76a48 { opacity: 1; visibility: visible; width: var(--rc-search-field-width); }
2911.SearchField-imageWrapper-4d589 { position: relative; flex-shrink: 0; cursor: pointer; }
2912.SearchField-image-9d9ce { object-fit: cover; width: 40px; height: 40px; border-radius: var(--corner-radius-r8); }
2913.SearchField-imageRemoveIcon-75450 { position: absolute; inset-block-start: -6px; inset-inline-end: -6px; width: 16px; height: 16px; cursor: pointer; z-index: 1; }
2914.SearchField-imageIcon-0a83f { margin-right: var(--spacings-s12); }
2915.SearchField-searchByUrl-6d168 { left: 0px; display: flex; }
2916.SearchField-inputWrapper-0c310 { width: 0px; display: flex; align-items: center; position: relative; }
2917.SearchField-inputWrapperInputVisible-a6c3c { width: 100%; }
2918.SearchField-content-56c67 { position: absolute; top: calc(100% + var(--spacings-s4)); left: var(--spacings-s0); width: 100%; max-height: 432px; padding: var(--spacings-s0); background-color: var(--positive-colors-base-default); border: 2px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r12); overflow-y: auto; z-index: 100; }
2919.SearchField-contentInputVisible-8ed5f { padding: var(--spacings-s12); }
2920.SearchField-openStateContent-36ac9 { position: absolute; top: calc(100% + var(--spacings-s4)); left: var(--spacings-s0); width: 100%; height: calc(-120px + 100vh); padding-bottom: var(--spacings-s12); padding-top: var(--spacings-s12); overflow: hidden auto; z-index: 100; background-color: var(--positive-colors-base-default); }
2921@keyframes SearchField-slideLeft-96371 { 
2922  0% { opacity: 1; left: calc(100% - 48px); }
2923  90% { opacity: 1; left: 2px; }
2924  100% { opacity: 0; left: 2px; }
2925}
2926.SearchInput-searchField-83890 { z-index: 10000; }
2927.Heading-root-4d9e9 { padding-inline: var(--spacings-s4); }
2928.Heading-root-4d9e9.NoPaddings { padding: 0px; margin: 0px; }
2929.Heading-btn-551a8 { padding-left: 0px; }
2930.Heading-root-8ca7a { align-items: center; border-bottom: 1px solid var(--background-colors-tint-3); display: flex; padding: 26px var(--spacings-s12); margin-bottom: var(--spacings-s24); }
2931.Heading-iconContainer-57a67 > svg { display: block; }
2932.Heading-txt-a4435 { margin-left: var(--spacings-s16); }
2933.Link-root-3160a { justify-content: space-between; }
2934.Link-root-3160a > svg path:not([fill]) { fill: var(--text-colors-tint-1); }
2935.Link-bold-89d41 > span { font-weight: 600; }
2936.Link-boldbutton-7eb96 { font-weight: 600; }
2937.PageSection-root-aacf8 { list-style-type: none; margin-bottom: var(--spacings-s24); }
2938.PageSection-title-a497f { margin-bottom: var(--spacings-s2); padding-inline: var(--spacings-s24); }
2939.PageSection-description-014cf { margin-bottom: var(--spacings-s24); padding-inline: var(--spacings-s24); }
2940.PageSection-link-29f6d { padding-inline: var(--spacings-s12); margin-bottom: var(--spacings-s8); }
2941.PageSection-more-83ff9 { margin-top: var(--spacings-s6); padding-inline: var(--spacings-s24); padding-block: var(--spacings-s10); }
2942.Footer-btn-da208 { padding-inline: var(--spacings-s12); margin-bottom: var(--spacings-s48); }
2943.Footer-imgContainer-78280 { align-items: center; background-color: var(--background-colors-tint-1); display: grid; gap: 20px; grid-template-columns: auto auto; padding: 20px 12px; }
2944.Footer-img-8e358 { width: 120px; }
2945.Page-root-1f75d { background-color: var(--positive-colors-base-default); display: flex; flex-direction: column; left: calc(-100% - var(--spacings-s32)); min-height: 100vh; max-width: 100%; position: fixed; top: 0px; transition: left 0.5s ease-in; width: 327px; }
2946.Page-rootHeight-e1d9b { min-height: 100dvh; }
2947.Page-container-713ff { display: flex; flex-direction: column; flex-grow: 1; }
2948.Page-body-4836a { flex-grow: 1; }
2949.Page-visible-1e02a { left: 0px; }
2950.Menu-root-9183e { background-color: var(--positive-colors-base-default); z-index: 1001; }
2951.Menu-container-b8c70 { padding: var(--spacings-s10); }
2952.Menu-overlay-05f17 { background-color: var(--background-colors-transparent); height: 100vh; position: fixed; top: 0px; left: 0px; z-index: 1000; width: 100vw; }
2953.MobileHeader-root-38287 { align-items: center; display: flex; background-color: var(--positive-colors-base-default); border-bottom: 1px solid var(--background-colors-tint-3); height: 81px; justify-content: space-between; position: sticky; top: 0px; padding-right: var(--spacings-s10); }
2954.MobileHeader-root-38287 .sign { border-radius: var(--corner-radius-r24); }
2955.MobileHeader-noProfile-74774 { padding-block: var(--spacings-s12); padding-inline: var(--spacings-s10); }
2956.MobileHeader-left-3632c { align-items: center; display: flex; }
2957.MobileHeader-menuButtons-eb179 { display: flex; gap: var(--spacings-s8); align-items: center; }
2958.MobileHeader-right-e10ee { width: 100%; display: flex; align-items: center; justify-content: flex-end; gap: var(--spacings-s8); }
2959.AuthActions-root-73e91 { display: flex; align-items: center; height: 100%; }
2960.AuthActions-actionHolder-7edb2 { display: inline-block; }
2961[dir="rtl"] .AuthActions-actionHolder-7edb2 { margin-left: var(--spacings-s24); }
2962.EmbeddedLogin-host-a6da3 { position: fixed; inset: 0px; z-index: 1002; display: flex; align-items: center; justify-content: center; pointer-events: none; }
2963.EmbeddedLogin-host-a6da3 > * { pointer-events: auto; }
2964.EmbeddedLogin-hidden-c1298 { clip-path: inset(100%); opacity: 0; }
2965.EmbeddedLogin-hidden-c1298 > * { pointer-events: none; }
2966.EmbeddedLogin-root-03e93 { position: relative; background: var(--background-colors-popover); height: 540px; max-height: 100vh; width: 830px; max-width: 100%; border-radius: var(--corner-radius-r20); box-sizing: border-box; overflow: hidden; }
2967@media screen and (max-width: 768px) {
2968  .EmbeddedLogin-root-03e93 { position: absolute; top: var(--spacings-s0); left: var(--spacings-s0); width: 100%; max-width: none; height: 100%; border-radius: var(--corner-radius-r0); }
2969}
2970.EmbeddedLogin-frame-c2413 { position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; overflow: hidden; }
2971.EmbeddedLogin-frame-c2413 > iframe { flex: 1 1 auto; }
2972.EmbeddedLogin-loading-45c81 { position: absolute; inset: 0px; width: 100%; height: 100%; }
2973.EmbeddedLogin-error-6354c { position: absolute; inset: 0px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--spacings-s16); padding: var(--spacings-s24); text-align: center; color: var(--text-colors-base); background: var(--background-colors-popover); }
2974.EmbeddedLogin-errorTitle-ffe8a { font-weight: 600; }
2975.EmbeddedLogin-errorDescription-cb4bf { color: var(--text-colors-tint-2); word-break: break-word; }
2976.EmbeddedLogin-closeButton-03f4d { position: absolute; top: var(--spacings-s12); right: var(--spacings-s12); z-index: 1; cursor: pointer; fill: var(--positive-colors-text-default); }
2977.ToolCard-root-33a80 { flex-direction: column; justify-content: center; align-items: center; cursor: pointer; display: flex; gap: var(--spacings-s4); width: 68px; }
2978.ToolCard-toolImageWrapper-5fd47 { overflow: hidden; border-radius: var(--corner-radius-r12); min-height: 68px; height: 68px; width: 100%; display: flex; align-items: center; justify-content: center; }
2979.ToolCard-toolsImage-40836 { height: 100%; width: 100%; object-fit: cover; }
2980.ToolCard-text-778db { overflow: hidden; text-overflow: ellipsis; }
2981.ToolsAutocomplete-root-2e4e9 { padding-inline: var(--spacings-s16); }
2982.ToolsAutocomplete-toolCard-c4edd { flex-shrink: 0; }
2983.ToolsAutocomplete-toolsScrollableWrapper-4616f { align-items: baseline; padding-block-end: var(--spacings-s16); margin-block-start: var(--spacings-s12); overflow-x: auto; display: flex; gap: var(--spacings-s8); }
2984.KeywordAutocomplete-root-058a2 { display: flex; flex-direction: column; gap: var(--spacings-s8); }
2985.KeywordAutocomplete-open-558ca { gap: var(--spacings-s12); }
2986.KeywordAutocomplete-title-eef50 { padding-inline-start: var(--spacings-s16); padding-block-end: var(--spacings-s8); }
2987.KeywordAutocomplete-autocompleteListTextItem-89e85 { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: flex; align-items: center; width: 100%; gap: var(--spacings-s6); padding: var(--spacings-s4) var(--spacings-s16); cursor: pointer; }
2988@media (hover: hover) and (pointer: fine) {
2989  .KeywordAutocomplete-autocompleteListTextItem-89e85:hover { background: var(--control-colors-button-background-action); }
2990}
2991.KeywordAutocomplete-autocompleteText-8d19d { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
2992.RecentlySearchItem-root-5d759 { overflow: hidden; cursor: pointer; display: flex; align-items: center; justify-content: space-between; width: 100%; }
2993.RecentlySearchItem-textAndStartIconWrapper-2d3db { display: flex; gap: var(--spacings-s6); min-width: 0px; }
2994.RecentlySearchItem-removeIcon-08f91, .RecentlySearchItem-iconClock-9644a { flex-shrink: 0; }
2995.RecentlySearchGrid-root-aeb02 { display: flex; flex-wrap: wrap; gap: var(--spacings-s8); }
2996.RecentlySearchChips-root-e684b { padding-inline-end: var(--spacings-s8); display: flex; flex-flow: row; gap: var(--spacings-s8); overflow-x: auto; scrollbar-width: none; }
2997.RecentlySearchChips-root-e684b::-webkit-scrollbar { display: none; }
2998.RecentlySearchChips-chip-65a5f { flex-shrink: 0; max-width: 280px; }
2999.PopularSearchImageCardOld-root-dc1ce { width: 125px; height: 136px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid var(--background-colors-tint-3); border-radius: var(--corner-radius-r16); padding: var(--spacings-s10); cursor: pointer; box-sizing: border-box; }
3000.PopularSearchImageCardOld-image-66f31 { height: 100%; width: 100%; object-fit: contain; }
3001.PopularSearchImageCardOld-imagePlaceholder-4815b.PopularSearchImageCardOld-imagePlaceholder-4815b { width: 105px; height: 90px; aspect-ratio: 1.136 / 1; }
3002.PopularSearchImageCardOld-imagePlaceholderOpen-82db0.PopularSearchImageCardOld-imagePlaceholderOpen-82db0 { width: 100%; height: auto; aspect-ratio: 1.136 / 1; }
3003.PopularSearchImageCardOld-label-bc984 { margin-top: var(--spacings-s10); font-weight: 500; color: var(--positive-colors-text-default); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; }
3004.PopularSearchImageCardOld-mobileRoot-4e882 { display: grid; flex-direction: column; align-items: center; justify-content: center; border: 1px solid var(--background-colors-tint-3); border-radius: var(--corner-radius-r16); padding: var(--spacings-s12) var(--spacings-s12) var(--spacings-s10) var(--spacings-s12); cursor: pointer; box-sizing: border-box; }
3005.PopularSearchImageCardNew-root-3d810 { display: flex; flex-direction: column; height: 100%; min-height: 0px; flex: 1 1 0%; cursor: pointer; }
3006.PopularSearchImageCardNew-imageContainer-3fd37 { flex: 1 1 0%; min-height: 0px; width: 100%; display: flex; flex-direction: column; padding: var(--spacings-s8); border-radius: var(--corner-radius-r8); border: 1px solid var(--background-colors-tint-2); background-color: var(--background-colors-tint-1); overflow: hidden; }
3007.PopularSearchImageCardNew-image-07506 { flex: 1 1 0%; min-height: 0px; width: 100%; border-radius: var(--corner-radius-r8); display: block; }
3008.PopularSearchImageCardNew-titleDescriptionContainer-75fc9 { flex-shrink: 0; }
3009.PopularSearchListItem-root-0a16b { padding: var(--spacings-s4) 0; cursor: pointer; }
3010.PopularSearchListItem-root-0a16b:hover { background-color: var(--background-colors-tint-1); }
3011.DefaultTool-root-fda60 { cursor: pointer; display: flex; align-items: center; gap: var(--spacings-s6); padding: var(--spacings-s4) var(--spacings-s16); }
3012@media (hover: hover) and (pointer: fine) {
3013  .DefaultTool-root-fda60:hover { background: var(--control-colors-field-background-action); }
3014}
3015</style>
3016    <style data-prerender-css data-original-href="/assets/runtime-core-QIBLcLI3.css">
3017[data-checkout-tier] { --checkout-accent: var(--primary-colors-base-default); --checkout-accent-action: var(--primary-colors-base-action); --checkout-accent-active: var(--primary-colors-base-active); --checkout-accent-active-action: var(--primary-colors-base-active-action);
3017 --checkout-trial-rundown-active: #c209c1; --checkout-features-gradient: linear-gradient(224deg, rgba(253, 151, 80, .15) 0%, rgba(255, 99, 225, .15) 100%); --checkout-gradient: var(--gradients-monetization-plus); }
3018[data-checkout-tier="pro"], [data-checkout-tier="max_performance"], [data-checkout-tier="max_starter"] { --checkout-accent: var(--monetization-pro-colors-base-default); --checkout-accent-action: var(--monetization-pro-colors-base-action); --checkout-accent-active: var(--monetization-pro-colors-base-active); --checkout-accent-active-action: var(--monetization-pro-colors-base-active-action); --checkout-trial-rundown-active: #9c66f5; --checkout-features-gradient: linear-gradient(224deg, rgba(222, 45, 239, .15) 0%, rgba(142, 63, 220, .15) 100%); --checkout-gradient: var(--gradients-monetization-pro); }
3019[data-checkout-tier="power"] { --checkout-accent: var(--monetization-ultra-colors-base-default); --checkout-accent-action: var(--monetization-ultra-colors-base-action); --checkout-accent-active: var(--monetization-ultra-colors-base-active); --checkout-accent-active-action: var(--monetization-ultra-colors-base-active-action); --checkout-trial-rundown-active: var(--monetization-ultra-colors-base-default); }
3020.Modal-icon-f4f56 { fill: var(--text-colors-tint-1); }
3021.Modal-focusTrap-42dee { height: 1px; width: 1px; opacity: 0; position: absolute; pointer-events: none; }
3022.Modal-bottomSheetWrapper-d4416 { height: calc(100% + var(--spacings-s32)); transform: translateY(-32px); }
3023.Modal-bottomSheet-44629 { position: relative; overflow: hidden; z-index: -1; }
3024.Modal-popup-7facf > div { padding: 0px; }
3025.Modal-popup-7facf > div > button { z-index: 5; }
3026.Modal-popupInner-e2282 { position: relative; width: 100%; height: 100%; transform: translateZ(0px); overflow: hidden; }
3027.TextLogo-logo-de08f { font-weight: 700; font-size: var(--typography-t9-font-size); display: inline-block; line-height: 1; -webkit-text-fill-color: transparent; background-clip: text; }
3028.TextLogo-maxPerformance-91a0b { background-image: linear-gradient(315deg, rgb(90, 0, 238) 14.64%, rgb(105, 154, 210) 85.36%); }
3029.TextLogo-maxStarter-d9476, .TextLogo-plus-3f1aa, .TextLogo-power-e2700 { background-image: var(--gradients-monetization-plus); }
3030.TextLogo-pro-c2ac4 { background-image: var(--gradients-monetization-pro); }
3031.TextLogo-free-df984 { background-image: none; }
3032.TierLogo-logo-626a3 { display: block; max-width: 80%; height: 25px; }
3033.TierLogo-hidden-6ea78 { display: none; }
3034.TierLogo-picsartLogo-5ad6a { display: block; height: 20px; width: auto; fill: var(--absolute-white-colors-base-default); }
3035html.light .TierLogo-picsartLogo-5ad6a { fill: var(--absolute-black-colors-base-default); }
3036.TierLogo-textLogo-c4b85 { display: inline-block; font-weight: 700; font-size: var(--typography-t9-font-size); line-height: 1; white-space: nowrap; }
3037.TierLogo-textLogo-c4b85 em { -webkit-text-fill-color: transparent; background-clip: text; margin-left: 0.2em; font-style: inherit; }
3038.TierLogo-textLogo-c4b85.TierLogo-pro-3d832 em { background-image: var(--gradients-monetization-pro); }
3039.TierLogo-textLogo-c4b85.TierLogo-plus-9ea37 em, .TierLogo-textLogo-c4b85.TierLogo-maxStarter-dec82 em { background-image: var(--gradients-monetization-plus); }
3040.TierLogo-textLogo-c4b85.TierLogo-power-2fc41 em { background-image: var(--gradients-monetization-ultra); }
3041.TierLogo-textLogo-c4b85.TierLogo-maxPerformance-6c1a8 em { background-image: linear-gradient(315deg, rgb(90, 0, 238) 14.64%, rgb(105, 154, 210) 85.36%); }
3042.TierLogo-lockupLogo-418e2 { height: 0.75em; width: auto; vertical-align: baseline; fill: var(--absolute-white-colors-base-default); }
3043html.light .TierLogo-lockupLogo-418e2 { fill: var(--absolute-black-colors-base-default); }
3044.StepHeader-root-61a7f { justify-content: space-between; margin-bottom: var(--spacings-s12); align-items: center; display: flex; }
3045.ViewHeader-root-78255 { display: grid; grid-template-columns: minmax(0px, 1fr) auto; align-items: center; row-gap: var(--spacings-s12); width: 100%; padding: var(--spacings-s0) var(--spacings-s24); margin-bottom: var(--spacings-s24); color: var(--text-colors-base); }
3046@media screen and (max-width: 1365px), screen and (max-height: 767px) {
3047  .ViewHeader-root-78255 { row-gap: var(--spacings-s12); }
3048}
3049@media screen and (max-width: 766px) {
3050  .ViewHeader-root-78255 { grid-template-columns: minmax(0px, 1fr); row-gap: var(--spacings-s12); padding: var(--spacings-s16) var(--spacings-s16) var(--spacings-s0); }
3051}
3052.ViewHeader-rootCompact-0d420 { row-gap: var(--spacings-s8); }
3053@media screen and (max-width: 766px) {
3054  .ViewHeader-rootCompact-0d420 { row-gap: var(--spacings-s12); }
3055}
3056.ViewHeader-rootCompact-0d420.ViewHeader-hasTitleSlot-beac0 { row-gap: var(--spacings-s12); }
3057.ViewHeader-title-2ddfe { grid-column: 1; order: 1; margin: var(--spacings-s0); font-weight: 700; text-align: center; font-size: var(--typography-t10-font-size); line-height: var(--typography-t10-line-height); }
3058@media screen and (max-width: 767px) {
3059  .ViewHeader-title-2ddfe { font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
3060}
3061@media screen and (max-width: 766px) {
3062  .ViewHeader-title-2ddfe { order: 2; font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
3063}
3064.ViewHeader-titleCompact-71805 { text-align: unset; font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
3065@media screen and (max-width: 767px) {
3066  .ViewHeader-titleCompact-71805 { font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
3067}
3068@media screen and (max-width: 766px) {
3069  .ViewHeader-titleCompact-71805 { text-align: center; }
3070}
3071.ViewHeader-titleSlot-b91c3 { grid-column: 2; justify-self: end; margin-left: var(--spacings-s8); order: 2; }
3072@media screen and (max-width: 766px) {
3073  .ViewHeader-titleSlot-b91c3 { grid-column: 1; justify-self: stretch; margin-left: var(--spacings-s0); order: 1; width: 100%; }
3074}
3075.ViewHeader-description-c64c5 { grid-column: 1; order: 3; min-height: 50px; margin: var(--spacings-s0); font-weight: 600; color: var(--text-colors-tint-1); text-align: center; align-content: center; font-size: var(--typography-t7-font-size); line-height: var(--typography-t7-line-height); }
3076@media screen and (max-width: 767px) {
3077  .ViewHeader-description-c64c5 { font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); }
3078}
3079@media screen and (max-width: 766px) {
3080  .ViewHeader-description-c64c5 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
3081}
3082.ViewHeader-descriptionCompact-c39bd { text-align: unset; font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
3083@media screen and (max-width: 766px) {
3084  .ViewHeader-descriptionCompact-c39bd { text-align: center; }
3085}
3086.ViewHeader-descriptionSlot-f804b { grid-column: 2; justify-self: end; margin-left: var(--spacings-s8); order: 4; }
3087@media screen and (max-width: 766px) {
3088  .ViewHeader-descriptionSlot-f804b { grid-column: 1; justify-self: center; margin-left: var(--spacings-s0); }
3089}
3090.CheckoutFlowLayout-root-bffcd { display: flex; flex-direction: column; align-items: center; width: 100%; height: 100%; overflow: auto; position: relative; padding-top: var(--spacings-s40); padding-bottom: var(--spacings-s40); scrollbar-width: none; }
3091.CheckoutFlowLayout-root-bffcd::-webkit-scrollbar { display: none; }
3092@media screen and (max-width: 767px) {
3093  .CheckoutFlowLayout-root-bffcd { padding-bottom: var(--spacings-s0); }
3094}
3095.CheckoutFlowLayout-rootCompact-597bb { padding: var(--spacings-s48) var(--spacings-s48) var(--spacings-s24); }
3096@media screen and (max-width: 767px) {
3097  .CheckoutFlowLayout-rootCompact-597bb { padding: var(--spacings-s24) var(--spacings-s0) var(--spacings-s0); }
3098}
3099.CheckoutFlowLayout-imageFooter-342fb { position: absolute; left: 0px; right: 0px; bottom: 0px; z-index: 0; pointer-events: none; }
3100.CheckoutFlowLayout-imageFooter-342fb::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(180deg,transparent 50%,var(--background-colors-base) 100%); }
3101@media screen and (max-width: 766px) {
3102  .CheckoutFlowLayout-imageFooter-342fb { display: none; }
3103}
3104.CheckoutFlowLayout-decorativeImage-05f61 { width: 100%; height: 100%; object-fit: contain; }
3105.CheckoutFlowLayout-flowSwitcherContainer-aab2d { width: 100%; padding-inline: var(--spacings-s16); }
3106.CheckoutFlowLayout-content-fe9ae { border-radius: var(--corner-radius-r16); flex-direction: column; align-items: center; display: flex; width: 100%; z-index: 1; }
3107@media screen and (max-width: 767px) {
3108  .CheckoutFlowLayout-content-fe9ae { padding: 80px 24px 32px; max-width: 100%; }
3109}
3110@media screen and (max-width: 766px) {
3111  .CheckoutFlowLayout-content-fe9ae { margin: 0px; padding: var(--spacings-s0) var(--spacings-s16) var(--spacings-s8); flex: 1 1 0%; overflow: auto; scrollbar-width: none; }
3112  .CheckoutFlowLayout-content-fe9ae::-webkit-scrollbar { display: none; }
3113}
3114.SegmentToggle-segments-7be4f { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: auto; border: 1px solid var(--background-colors-border); font-weight: 600; font-size: var(--typography-t5-font-size); }
3115.SegmentToggle-segment-6f429 { border: 1px solid transparent; background: none; min-width: 138px; display: flex; align-items: center; justify-content: center; }
3116.SegmentToggle-segment-6f429 > div { display: flex; align-items: center; justify-content: center; flex-grow: 0; }
3117.SegmentToggle-active-fb3f8 { background-color: var(--control-colors-button-background-active); border: 1px solid var(--control-colors-button-background-active); }
3118.SegmentToggle-icon-66d6e { width: 20px; height: 20px; fill: var(--text-colors-base); }
3119.FlowSwitcher-segmentToggle-9e8ca { width: min(100%, 572px); margin: var(--spacings-s0) auto var(--spacings-s24); }
3120@media screen and (max-width: 767px) {
3121  .FlowSwitcher-segmentToggle-9e8ca { margin: var(--spacings-s0) auto; }
3122}
3123.FlowSwitcher-segmentToggleCompact-ff763 { max-width: 383px; margin: var(--spacings-s0); }
3124@media screen and (max-width: 766px) {
3125  .FlowSwitcher-segmentToggleCompact-ff763 { width: 100%; max-width: none; }
3126}
3127.Taxes-taxContainerWrapper-234b7 { margin-top: var(--spacings-s16); }
3128.Taxes-priceContainer-33d78 { display: flex; flex-direction: row; justify-content: space-between; color: var(--text-colors-tint-1); font-weight: 500; font-size: var(--typography-t3-font-size); line-height: 1.33; }
3129.Taxes-priceContainer-33d78 .Taxes-highlighted-b0a54 { font-weight: 700; }
3130.Taxes-totalPriceContainer-cd7bf { display: flex; flex-direction: row; justify-content: space-between; font-weight: 600; font-size: var(--typography-t5-font-size); line-height: 1.5; color: var(--text-colors-base); }
3131.Taxes-totalPriceContainer-cd7bf .Taxes-highlighted-b0a54 { font-weight: 700; }
3132.Taxes-newVariant-02802 .Taxes-priceContainer-33d78 { font-weight: 600; }
3133.Taxes-newVariant-02802 .Taxes-totalPriceContainer-cd7bf { font-size: var(--typography-t3-font-size); }
3134.Taxes-lineThrough-5d446 { text-decoration: line-through; margin-right: var(--spacings-s4); font-size: var(--typography-t2-font-size); color: var(--text-colors-tint-3); }
3135.Taxes-highlighted-b0a54 { color: var(--checkout-accent); }
3136.Taxes-dueToday-be835 { justify-content: space-between; font-weight: 700; font-size: var(--typography-t5-font-size); margin-top: var(--spacings-s16); flex-direction: row; color: var(--text-colors-base); line-height: 1.5; display: flex; }
3137.Taxes-divider-cf731 { margin: var(--spacings-s4) var(--spacings-s0); }
3138.Taxes-discountLabel-51a9a { display: inline-flex; align-items: center; gap: var(--spacings-s8); }
3139.Taxes-promoTag-7479c.Taxes-promoTag-7479c { background: color-mix(in srgb,var(--success-colors-base-default) 16%,transparent); color: var(--success-colors-base-default); text-transform: uppercase; }
3140.Taxes-discountAmount-8c42b { color: var(--success-colors-base-default); }
3141.Taxes-orderSummary-b99cc { border-top: 1px solid var(--background-colors-border); margin-top: var(--spacings-s24); padding-top: var(--spacings-s16); display: flex; flex-direction: column; gap: var(--spacings-s10); }
3142.Taxes-orderSummary-b99cc .Taxes-priceContainer-33d78 { font-size: var(--typography-t5-font-size); font-weight: 500; line-height: 1.5; }
3143.Taxes-orderSummary-b99cc .Taxes-totalPriceContainer-cd7bf { font-size: var(--typography-t7-font-size); font-weight: 700; margin-top: var(--spacings-s6); }
3144.Taxes-orderSummary-b99cc .Taxes-dueToday-be835 { margin-top: var(--spacings-s0); font-size: var(--typography-t5-font-size); font-weight: 500; color: var(--text-colors-tint-1); }
3145.Taxes-orderSummary-b99cc .Taxes-divider-cf731 { margin: var(--spacings-s0) var(--spacings-s0); }
3146@media screen and (min-width: 768px) {
3147  .Taxes-orderSummary-b99cc .Taxes-lineThrough-5d446 { font-size: var(--typography-t4-font-size); }
3148  .Taxes-orderSummary-b99cc .Taxes-totalPriceContainer-cd7bf .Taxes-lineThrough-5d446 { font-size: var(--typography-t6-font-size); }
3149}
3150.CheckoutScrollbars-scrollbars-43b2b { border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; }
3151.CheckoutScrollbars-scrollbars-43b2b.CheckoutScrollbars-scrollable-084c6 { border-bottom: 1px solid var(--background-colors-tint-3); }
3152.CheckoutScrollbars-thumb-8c3d6 { background-color: var(--background-colors-tint-3); cursor: pointer; border-radius: var(--corner-radius-r4); }
3153.CheckoutScrollbars-track-f7472 { padding: var(--spacings-s32) var(--spacings-s0); height: 100%; right: 8px; }
3154.CheckoutScrollbars-hidden-72617 { display: none; }
3155.SavedPaymentMethodViewer-checkoutLabel-b81ca { font-weight: 600; font-size: var(--typography-t4-font-size); line-height: 1.4; margin-bottom: var(--spacings-s8); color: var(--text-colors-tint-1); }
3156.SavedPaymentMethodViewer-container-e4b61 { border: 1px solid var(--background-colors-tint-3); border-radius: var(--corner-radius-r8); padding: var(--spacings-s16); display: flex; align-items: stretch; justify-content: flex-end; position: relative; }
3157.SavedPaymentMethodViewer-labelCont-6c8a9 { position: absolute; top: 20px; left: 16px; }
3158.SavedPaymentMethodViewer-dataCont-07d01 { margin-right: var(--spacings-s16); flex: 1 1 0%; display: flex; flex-direction: column; }
3159.SavedPaymentMethodViewer-placeHolder-b1deb { min-height: 24px; }
3160.SavedPaymentMethodViewer-creditCardData-bec07 { display: flex; align-items: flex-end; font-size: var(--typography-t4-font-size); font-weight: 500; line-height: 20px; color: var(--text-colors-base); }
3161.SavedPaymentMethodViewer-hideIcon-299c7 { display: none; }
3162.SavedPaymentMethodViewer-creditCardBig-0d43c { margin-right: var(--spacings-s8); width: 24px; height: 24px; display: inline-block; fill: var(--text-colors-base); }
3163.SavedPaymentMethodViewer-creditCardBig-0d43c path { fill: var(--text-colors-base); }
3164.SavedPaymentMethodViewer-paypalLogoCont-620d8 { max-height: 24px; }
3165.SavedPaymentMethodViewer-paypalLogoCont-620d8 picture { max-height: 24px; }
3166.SavedPaymentMethodViewer-paypalLogo-d2fdc { height: 24px; }
3167.SavedPaymentMethodViewer-billingAddress-40338 { display: inline-block; margin-top: var(--spacings-s8); font-size: var(--typography-t4-font-size); font-weight: 500; line-height: 20px; word-break: break-word; color: var(--text-colors-tint-1); }
3168.SavedPaymentMethodViewer-billingAddressBold-eeeaf { font-weight: 600; color: var(--text-colors-base); }
3169.SavedPaymentMethodViewer-buttonWrapper-76456 { display: flex; align-items: center; flex-basis: 80px; }
3170.SavedPaymentMethodViewer-button-97edd { max-height: 32px; padding: 0px; flex-shrink: 0; }
3171.js-iframe { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; color-scheme: auto; height: 100%; overflow: hidden; width: 100%; }
3172.adyen-checkout-card-input__wrapper { position: relative; }
3173.adyen-checkout-card-input__icon { border-radius: var(--adyen-sdk-border-radius-s,4px); height: 18px; margin-right: var(--adyen-sdk-spacer-060,12px); width: 27px; }
3174.adyen-checkout-card-input__form { opacity: 1; }
3175.adyen-checkout-card-input__spinner { display: none; height: 100%; left: 0px; position: absolute; top: 0px; width: 100%; z-index: 1; }
3176.adyen-checkout-card-input__spinner--active { display: block; }
3177.adyen-checkout-card-input__form--loading { opacity: 0; }
3178.adyen-checkout__input { display: block; max-height: 100px; }
3179.adyen-checkout__field.adyen-checkout__card__cvc__input--hidden { display: none; }
3180.revolving-plan-installments__disabled { opacity: 0.4; pointer-events: none; }
3181.adyen-checkout__card__cardNumber { max-width: 400px; }
3182.adyen-checkout__card__cardNumber__input { padding-left: var(--adyen-sdk-spacer-060,12px); }
3183.adyen-checkout__card__holderName { margin-bottom: 0px; }
3184.adyen-checkout__card-input .adyen-checkout__fieldset--billingAddress, .adyen-checkout__card__holderName, .adyen-checkout__card__kcp-authentication, .adyen-checkout__card__socialSecurityNumber, .adyen-checkout__installments { margin-top: var(--adyen-sdk-spacer-070,16px); }
3185.adyen-checkout__card-input.adyen-checkout__card-input--loading { pointer-events: none; }
3186.adyen-checkout__card__holderName:first-child { margin: 0 0 var(--adyen-sdk-spacer-060,12px); }
3187.adyen-checkout__field--cardNumber .adyen-checkout__input--error + .adyen-checkout-brand-wrapper, .adyen-checkout__field--cardNumber .adyen-checkout__input--valid:not(.adyen-checkout__card__cardNumber__input--noBrand) + .adyen-checkout-input__inline-validation--valid { display: none; }
3188.adyen-checkout__field--securityCode.adyen-checkout__field--error .adyen-checkout__card__cvc__hint, .adyen-checkout__field--securityCode.adyen-checkout__field--valid .adyen-checkout__card__cvc__hint { opacity: 0; }
3189@keyframes cvc-indicate-location { 
3190  0% { opacity: 1; }
3191  100% { opacity: 0.3; }
3192}
3193.adyen-checkout__label--focused .adyen-checkout__field__cvc--back-hint .adyen-checkout__card__cvc__hint--back .adyen-checkout__card__cvc__hint__location, .adyen-checkout__label--focused .adyen-checkout__field__cvc--front-hint .adyen-checkout__card__cvc__hint--front .adyen-checkout__card__cvc__hint__location { animation-direction: alternate; animation-duration: 1s; animation-iteration-count: infinite; animation-name: cvc-indicate-location; }
3194.adyen-checkout__card__cvc__hint__wrapper { align-items: center; backface-visibility: visible; display: flex; height: 100%; margin-right: var(--adyen-sdk-spacer-060,12px); position: absolute; right: 0px; transform: translateZ(0px); transform-origin: center center; transform-style: preserve-3d; transition: transform 0.3s cubic-bezier(0.455, 0.03, 0.515, 0.955); width: 27px; will-change: transform; }
3195.adyen-checkout__field__cvc--front-hint.adyen-checkout__card__cvc__hint__wrapper { transform: rotateY(180deg); }
3196.adyen-checkout__card__cvc__hint { backface-visibility: hidden; border-radius: var(--adyen-sdk-border-radius-s,4px); box-shadow: var(--adyen-sdk-shadow-low,0 2px 4px rgba(0,17,44,.04),0 1px 2px rgba(0,17,44,.02)); position: absolute; transition: opacity 0.1s linear; }
3197.adyen-checkout__card__cvc__hint--front { transform: rotateY(180deg); }
3198@media (prefers-reduced-motion: reduce) {
3199  .adyen-checkout__card__cvc__hint__wrapper { transition: none; }
3200}
3201.adyen-checkout__fieldset--revolving-plan .adyen-checkout__fieldset__fields { justify-content: left; }
3202.adyen-checkout__fieldset--revolving-plan .adyen-checkout__radio_group { display: flex; flex-direction: column; }
3203.adyen-checkout__fieldset--revolving-plan .adyen-checkout__radio_group__input-wrapper { margin-top: var(--adyen-sdk-spacer-080,20px); }
3204.adyen-checkout__fieldset--revolving-plan .adyen-checkout__field--revolving-plan-installments { height: 100%; margin-left: var(--adyen-sdk-spacer-070,16px); position: relative; top: 52px; width: 30%; }
3205.adyen-checkout__card-input .adyen-checkout__fieldset--dual-brand-switcher { margin-top: var(--adyen-sdk-spacer-070,16px); }
3206.adyen-checkout__card-input .adyen-checkout__fieldset--dual-brand-switcher .adyen-checkout__fieldset__title { padding-bottom: 0px; }
3207.adyen-checkout__card-input .adyen-checkout__fieldset--dual-brand-switcher .adyen-checkout-form-instruction { margin: 0px; }
3208.adyen-checkout__spinner__wrapper { align-items: center; display: flex; height: 100%; justify-content: center; }
3209.adyen-checkout__spinner__wrapper--inline { display: inline-block; height: auto; margin-right: var(--adyen-sdk-spacer-040,8px); }
3210[dir="rtl"] .adyen-checkout__spinner__wrapper--inline { margin-left: var(--adyen-sdk-spacer-040,8px); margin-right: 0px; }
3211.adyen-checkout__spinner { height: var(--adyen-sdk-spacer-090,24px); position: relative; width: var(--adyen-sdk-spacer-090,24px); }
3212.adyen-checkout__spinner::after, .adyen-checkout__spinner::before { animation: 1s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s infinite normal none running rotate; border: var(--adyen-sdk-border-width-l,3px) solid transparent; border-radius: 50%; box-sizing: border-box; content: ""; display: block; height: 100%; left: 0px; position: absolute; top: 0px; width: 100%; }
3213.adyen-checkout__spinner::before { border-right-color: ; border-bottom-color: ; border-left-color: ; border-top-color: transparent; opacity: 0.1; }
3214.adyen-checkout__spinner::after { border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-color: var(--adyen-sdk-color-outline-primary-active,#00112c); }
3215.adyen-checkout__spinner--small { height: var(--adyen-sdk-spacer-070,16px); width: var(--adyen-sdk-spacer-070,16px); }
3216.adyen-checkout__spinner--small::after, .adyen-checkout__spinner--small::before { border-width: var(--adyen-sdk-spacer-010,2px); }
3217.adyen-checkout__spinner--medium { height: 28px; width: 28px; }
3218.adyen-checkout__spinner--large { height: var(--adyen-sdk-spacer-120,48px); width: var(--adyen-sdk-spacer-120,48px); }
3219.adyen-checkout__spinner--large::after, .adyen-checkout__spinner--large::before { border-width: var(--adyen-sdk-spacer-020,4px); }
3220@keyframes rotate { 
3221  0% { transform: rotate(0deg); }
3222  100% { transform: rotate(1turn); }
3223}
3224.loading-input__form { opacity: 1; }
3225.loading-input__form--loading { opacity: 0; }
3226.loading-input__spinner { display: none; height: 100%; left: 0px; position: absolute; top: 0px; width: 100%; z-index: 1; }
3227.loading-input__spinner--active { display: block; }
3228.adyen-checkout__image { display: block; opacity: 0; transition: opacity 0.6s ease-out; }
3229.adyen-checkout__image--loaded { opacity: 1; }
3230.adyen-checkout__field { display: block; margin-bottom: var(--adyen-sdk-spacer-070,16px); width: 100%; }
3231.adyen-checkout__field-static-value { background-color: var(--adyen-sdk-color-background-primary-hover,#f7f7f8); border-radius: var(--adyen-sdk-border-radius-s,4px); color: var(--adyen-sdk-color-background-inverse-primary,#00112c
3231); display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); height: 28px; line-height: var(--adyen-sdk-text-body-line-height,20px); margin-left: var(--adyen-sdk-spacer-020,4px); padding: var(--adyen-sdk-spacer-020,4px) var(--adyen-sdk-spacer-030,6px); }
3232.adyen-checkout__field--no-borders .adyen-checkout__input-wrapper { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }
3233.adyen-checkout__field--no-borders .adyen-checkout__input-wrapper:active, .adyen-checkout__field--no-borders .adyen-checkout__input-wrapper:active:hover, .adyen-checkout__field--no-borders .adyen-checkout__input-wrapper:focus-within, .adyen-checkout__field--no-borders .adyen-checkout__input-wrapper:focus-within:hover { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }
3234.adyen-checkout__field--no-borders .adyen-checkout__input-wrapper:hover { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }
3235@media (min-width: 480px) {
3236  .adyen-checkout__field--20 { width: 20%; }
3237  .adyen-checkout__field--30 { width: 30%; }
3238  .adyen-checkout__field--40 { width: 40%; }
3239  .adyen-checkout__field--50 { width: 50%; }
3240  .adyen-checkout__field--60 { width: 60%; }
3241  .adyen-checkout__field--70 { width: 70%; }
3242  .adyen-checkout__field--80 { width: 80%; }
3243  .adyen-checkout__field--col-20 { width: calc(20% - var(--adyen-sdk-spacer-040, 8px)); }
3244  .adyen-checkout__field--col-30 { width: calc(30% - var(--adyen-sdk-spacer-040, 8px)); }
3245  .adyen-checkout__field--col-40 { width: calc(40% - var(--adyen-sdk-spacer-040, 8px)); }
3246  .adyen-checkout__field--col-50 { width: calc(50% - var(--adyen-sdk-spacer-040, 8px)); }
3247  .adyen-checkout__field--col-60 { width: calc(60% - var(--adyen-sdk-spacer-040, 8px)); }
3248  .adyen-checkout__field--col-70 { width: calc(70% - var(--adyen-sdk-spacer-040, 8px)); }
3249  .adyen-checkout__field--col-80 { width: calc(80% - var(--adyen-sdk-spacer-040, 8px)); }
3250}
3251.adyen-checkout__input-wrapper { align-items: center; background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-m,8px); display: flex; position: relative; }
3252.adyen-checkout__input-wrapper div, .adyen-checkout__input-wrapper input, .adyen-checkout__input-wrapper span { border-radius: inherit; }
3253.adyen-checkout__input-wrapper button, .adyen-checkout__input-wrapper div, .adyen-checkout__input-wrapper input { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
3254.adyen-checkout__input-wrapper:active, .adyen-checkout__input-wrapper:active:hover, .adyen-checkout__input-wrapper:focus-within, .adyen-checkout__input-wrapper:focus-within:hover { border-color: var(--adyen-sdk-color-outline-primary-active,#00112c); box-shadow: 0 0 0 .5px var(--adyen-sdk-color-outline-primary-active,#00112c); }
3255.adyen-checkout__input-wrapper:hover { border-color: var(--adyen-sdk-color-outline-tertiary,#8d95a3); }
3256.adyen-checkout__field--inactive > .adyen-checkout__input-wrapper { background: var(--adyen-sdk-color-background-disabled,#eeeff1); border-color: transparent; }
3257.adyen-checkout__field--error > :not(.adyen-checkout__label--focused) + .adyen-checkout__input-wrapper:not(:focus-within, :active) { border-color: var(--adyen-sdk-color-outline-critical,#e22d2d); }
3258.adyen-checkout__label { display: block; position: relative; }
3259.adyen-checkout__label--focused + .adyen-checkout__input-wrapper { border-color: var(--adyen-sdk-color-outline-primary-active,#00112c); box-shadow: 0 0 0 .5px var(--adyen-sdk-color-outline-primary-active,#00112c); }
3260.adyen-checkout__label--disabled + .adyen-checkout__input-wrapper { background: var(--adyen-sdk-color-background-disabled,#eeeff1); border-color: transparent; }
3261.adyen-checkout__helper-text { color: var(--adyen-sdk-color-label-primary,#00112c
3261); display: block; font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-bottom: var(--adyen-sdk-spacer-020,4px); }
3262.adyen-checkout__label-adornment--end { position: absolute; right: 0px; top: 0px; }
3263.adyen-checkout__label__text { color: var(--adyen-sdk-color-label-primary,#00112c); display: block; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); line-height: var(--adyen-sdk-text-body-line-height,20px); margin-bottom: var(--adyen-sdk-spacer-020,4px); overflow: hidden; text-overflow: ellipsis; transition: color 0.1s ease-out; white-space: nowrap; }
3264.adyen-checkout__label__text--error { color: var(--adyen-sdk-color-label-critical,#c72727); }
3265.adyen-checkout__label--focused .adyen-checkout__label__text { color: var(--adyen-sdk-color-label-primary,#00112c); }
3266.adyen-checkout-contextual-text, .adyen-checkout-contextual-text--error { align-items: center;
3266 color: var(--adyen-sdk-color-label-primary,#00112c); display: flex; font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-top: var(--adyen-sdk-spacer-020,4px); opacity: 1; transition: margin 0.2s ease-out, opacity 0.2s ease-out; }
3267.adyen-checkout-contextual-text--error { color: var(--adyen-sdk-color-label-critical,#c72727); }
3268.adyen-checkout-contextual-text--hidden { height: 0px; margin: 0px; opacity: 0; }
3269.adyen-checkout__field__cvc .adyen-checkout__input-wrapper { cursor: text; }
3270.adyen-checkout__filter-input:-webkit-autofill, .adyen-checkout__input:-webkit-autofill { color: var(--adyen-sdk-color-label-primary,#00112c) !important; -webkit-text-fill-color: var(--adyen-sdk-color-label-primary,#00112c) !important; background-clip: text !important; background-color: var(--adyen-sdk-color-label-primary,#00112c) !important; box-shadow: 0 0 0 1000px var(--adyen-sdk-color-background-primary,#ffffff) inset !important; transition: none !important; }
3271.adyen-checkout__filter-input:-webkit-autofill, .adyen-checkout__filter-input:-webkit-autofill:active, .adyen-checkout__filter-input:-webkit-autofill:focus, .adyen-checkout__filter-input:-webkit-autofill:hover, .adyen-checkout__filter-input:autofill, .adyen-checkout__input:-webkit-autofill, .adyen-checkout__input:-webkit-autofill:active, .adyen-checkout__input:-webkit-autofill:focus, .adyen-checkout__input:-webkit-autofill:hover, .adyen-checkout__input:autofill { color: var(--adyen-sdk-color-label-primary,#00112c
3271) !important; -webkit-text-fill-color: var(--adyen-sdk-color-label-primary,#00112c) !important; background-clip: text !important; background-color: var(--adyen-sdk-color-label-primary,#00112c) !important; box-shadow: 0 0 0 1000px var(--adyen-sdk-color-background-primary,#ffffff) inset !important; transition: none !important; }
3272.adyen-checkout__filter-input, .adyen-checkout__input { background-clip: text !important; color: var(--adyen-sdk-color-label-primary,#00112c) !important; }
3273.adyen-checkout__field-wrapper { display: flex; width: 100%; }
3274.adyen-checkout__field-wrapper > .adyen-checkout__field:first-child { margin-right: var(--adyen-sdk-spacer-040,8px); }
3275[dir="rtl"] .adyen-checkout__field-wrapper > .adyen-checkout__field:first-child { margin-left: var(--adyen-sdk-spacer-040,8px); margin-right: 0px; }
3276.adyen-checkout__field-wrapper > .adyen-checkout__field:nth-child(2) { margin-left: var(--adyen-sdk-spacer-040,8px); }
3277[dir="rtl"] .adyen-checkout__field-wrapper > .adyen-checkout__field:nth-child(2) { margin-left: 0px; margin-right: var(--adyen-sdk-spacer-040,8px); }
3278.adyen-checkout__field-wrapper:last-of-type > .adyen-checkout__field { margin-bottom: 0px; }
3279.adyen-checkout__input { background: inherit;
3279 color: var(--adyen-sdk-color-label-primary,#00112c); display: block; font-family: inherit; font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); height: var(--adyen-sdk-spacer-110,40px); outline: none; padding-left: var(--adyen-sdk-spacer-060,12px); transition: border 0.2s ease-out, box-shadow 0.2s ease-out; width: 100%; }
3280.adyen-checkout__input:required { box-shadow: none; }
3281.adyen-checkout__input:disabled, .adyen-checkout__input:read-only { color: var(--adyen-sdk-color-label-secondary,#5c687c) !important; cursor: default; }
3282span.adyen-checkout__input { overflow: hidden; }
3283.adyen-checkout-input__inline-validation { height: var(--adyen-sdk-spacer-070,16px); margin-right: var(--adyen-sdk-spacer-060,12px); width: var(--adyen-sdk-spacer-070,16px); }
3284[dir="rtl"] .adyen-checkout-input__inline-validation { margin-left: var(--adyen-sdk-spacer-060,12px); }
3285.adyen-checkout-input__inline-validation > .adyen-checkout__icon { display: block; }
3286.adyen-checkout-input__inline-validation--invalid { color: var(--adyen-sdk-color-label-critical,#c72727); }
3287.adyen-checkout__input--date { padding: 0.5em; }
3288.adyen-checkout__fieldset { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; display: block; margin-inline: 0px; margin: 0px; padding-block: 0px; padding-bottom: var(--adyen-sdk-spacer-040,8px); padding-inline: 0px; width: 100%; }
3289.adyen-checkout__fieldset__description { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: 1.5; list-style-type: disc; margin: 0px; }
3290.adyen-checkout__fieldset:last-of-type { padding-bottom: 0px; }
3291.adyen-checkout__fieldset + .adyen-checkout__fieldset { margin-top: var(--adyen-sdk-spacer-070,16px); }
3292.adyen-checkout__fieldset__title { color: var(--adyen-sdk-color-label-primary,#00112c
3292); display: block; font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); font-weight: var(--adyen-sdk-text-subtitle-font-weight,500); line-height: var(--adyen-sdk-text-subtitle-line-height,26px); margin: 0px; padding: 0 0 var(--adyen-sdk-spacer-060,12px); }
3293.adyen-checkout__fieldset__title:has(+ .adyen-checkout__fieldset__description) { padding: 0px; }
3294.adyen-checkout__fieldset__fields { display: flex; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-070,16px); width: 100%; }
3295.adyen-checkout__fieldset__fields > .adyen-checkout__field { margin-bottom: 0px; }
3296.adyen-checkout__fieldset--readonly .adyen-checkout__fieldset__fields { color: var(--adyen-sdk-color-label-primary,#00112c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin: 0px; }
3297.adyen-checkout__card__exp-date__input--oneclick { font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-title-line-height,26px); overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
3298.adyen-checkout__radio_group + .adyen-checkout-input__inline-validation { display: none; }
3299.adyen-checkout__radio_group__input { opacity: 0; position: absolute; }
3300.adyen-checkout__radio_group__label { color: inherit; display: block; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: 400; line-height: var(--adyen-sdk-text-body-line-height,20px); margin: 0px; overflow: visible; padding-bottom: 0px; padding-left: var(--adyen-sdk-spacer-090,24px); position: relative; }
3301.adyen-checkout__label--focused .adyen-checkout__radio_group__label { color: inherit; }
3302.adyen-checkout__radio_group__label::before { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-tertiary,#8d95a3); border-radius: 50%; content: ""; height: var(--adyen-sdk-spacer-070,16px); left: 0px; position: absolute; top: var(--adyen-sdk-spacer-010,2px); transition: border-color 0.2s ease-out, box-shadow 0.2s ease-out; width: var(--adyen-sdk-spacer-070,16px); }
3303.adyen-checkout__radio_group__label:hover::before { box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-primary-hover,#c9cdd3); cursor: pointer; }
3304.adyen-checkout__radio_group__label::after { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border-radius: 50%; box-shadow: rgba(0, 15, 45, 0.25) 0px 1px 1px; content: ""; display: block; height: var(--adyen-sdk-spacer-030,6px); left: 5px; margin: 0px auto; position: absolute; top: 7px; transform: scale(0); transition: transform 0.2s ease-out; width: var(--adyen-sdk-spacer-030,6px); }
3305.adyen-checkout__radio_group__label:hover { border-color: var(--adyen-sdk-color-label-primary,#00112c
3305); cursor: pointer; }
3306.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label::before { background-color: var(--adyen-sdk-color-label-primary,#00112c); border: 0px; transition: 0.2s ease-out; }
3307.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label::after { transform: scale(1); }
3308.adyen-checkout__radio_group__input:focus + .adyen-checkout__radio_group__label::before { border-color: var(--adyen-sdk-color-label-primary,#00112c); }
3309.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label:hover::before, .adyen-checkout__radio_group__input:checked:active + .adyen-checkout__radio_group__label::before, .adyen-checkout__radio_group__input:checked:focus + .adyen-checkout__radio_group__label::before, .adyen-checkout__radio_group__input:focus + .adyen-checkout__radio_group__label::before { box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-tertiary,#8d95a3); }
3310.adyen-checkout__radio_group__label.adyen-checkout__radio_group__label--invalid::before { border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-critical,#e22d2d); }
3311.adyen-checkout__radio_group--button { align-items: flex-start; align-self: stretch; display: flex; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-070,16px); width: 100%; }
3312.adyen-checkout__radio_group--button .adyen-checkout__radio_group__input-wrapper { display: flex; flex: 1 0 0px; }
3313.adyen-checkout__radio_group--button .adyen-checkout__radio_group__label::after { left: calc(var(--adyen-sdk-spacer-060, 12px) + 5px); position: absolute; top: calc(50% - var(--adyen-sdk-spacer-030, 6px)/2); }
3314.adyen-checkout__radio_group--button .adyen-checkout__radio_group__label::before { left: calc(var(--adyen-sdk-spacer-060, 12px)); position: absolute; top: calc(50% - var(--adyen-sdk-spacer-070, 16px)/2); }
3315.adyen-checkout__radio_group--button .adyen-checkout__radio_group__label { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-m,8px); padding-top: ; padding-right: ; padding-bottom: ; padding-left: calc(var(--adyen-sdk-spacer-060, 12px) + var(--adyen-sdk-spacer-090, 24px)); width: 100%; }
3316.adyen-checkout__radio_group--button .adyen-checkout__radio_group__input + .adyen-checkout__radio_group__label:hover, .adyen-checkout__radio_group--button .adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label { border-color: var(--adyen-sdk-color-outline-primary-active,#00112c); }
3317.adyen-checkout__radio_group--button .adyen-checkout__radio_group__input:checked:active + .adyen-checkout__radio_group__label, .adyen-checkout__radio_group--button .adyen-checkout__radio_group__input:checked:focus + .adyen-checkout__radio_group__label { border-color: var(--adyen-sdk-color-outline-primary-active,#00112c); box-shadow: 0 0 0 .5px var(--adyen-sdk-color-outline-primary-active,#00112c); }
3318.adyen-checkout__dropdown { max-width: 100%; position: relative; }
3319.adyen-checkout__dropdown, .adyen-checkout__dropdown__button { font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); width: 100%; }
3320.adyen-checkout__dropdown__button { align-items: center; background: inherit; border-radius: inherit;
3320 color: var(--adyen-sdk-color-label-primary,#00112c); cursor: pointer; display: flex; height: var(--adyen-sdk-spacer-110,40px); line-height: var(--adyen-sdk-text-body-line-height,20px); outline: 0px; padding: 0 var(--adyen-sdk-spacer-060,12px); text-decoration: none; transition: border 0.2s ease-out, box-shadow 0.2s ease-out; user-select: none; }
3321[dir="rtl"] .adyen-checkout__dropdown__button { padding: 7px var(--adyen-sdk-spacer-060,12px) 7px var(--adyen-sdk-spacer-090,24px); }
3322.adyen-checkout__dropdown__button::after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' fill='none' viewBox='0 0 16 17'%3E%3Cpath fill='%2300112c' fill-rule='evenodd' d='M4.47 6.47a.75.75 0 0 1 1.06 0L8 8.94l2.47-2.47a.75.75 0 0 1 1.06 1.06l-3 3a.75.75 0 0 1-1.06 0l-3-3a.75.75 0 0 1 0-1.06' clip-rule='evenodd'/%3E%3C/svg%3E"); background-position: 50% center; background-repeat: no-repeat; content: ""; height: var(--adyen-sdk-spacer-030,6px); position: absolute; right: var(--adyen-sdk-spacer-070,16px); width: var(--adyen-sdk-spacer-040,8px); }
3323[dir="rtl"] .adyen-checkout__dropdown__button::after { left: var(--adyen-sdk-spacer-070,16px); right: auto; }
3324.adyen-checkout__dropdown__button--active::after { transform: rotate(180deg); }
3325.adyen-checkout__dropdown__button--disabled { opacity: 0.4; }
3326.adyen-checkout__dropdown__button--readonly, .adyen-checkout__dropdown__button--readonly--active, .adyen-checkout__dropdown__button--readonly:focus, .adyen-checkout__dropdown__button--readonly:hover { background: var(--adyen-sdk-color-background-disabled,#eeeff1); border-color: transparent;
3326 color: var(--adyen-sdk-color-label-primary,#00112c); cursor: not-allowed; }
3327.adyen-checkout__dropdown__button--readonly::after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='7' fill='none' viewBox='0 0 8 7'%3E%3Cpath fill='%23b9c4c9' d='M3.195 6.565a1 1 0 0 0 1.6 0l2.992-3.98a1 1 0 0 0-.8-1.602H1.013a1 1 0 0 0-.8 1.6z'/%3E%3C/svg%3E"); }
3328.adyen-checkout__dropdown__button--invalid { border-color: var(--adyen-sdk-color-outline-critical,#e22d2d); }
3329.adyen-checkout__dropdown__button__icon { border-radius: 3px; height: 26px; margin-right: var(--adyen-sdk-spacer-060,12px); max-width: var(--adyen-sdk-spacer-110,40px); }
3330.adyen-checkout__dropdown__button__text { flex-grow: 1; overflow: hidden; pointer-events: none; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
3331.adyen-checkout__dropdown__button__text-placeholder { color: var(--adyen-sdk-color-label-secondary,#5c687c); }
3332.adyen-checkout__dropdown__button__secondary-text { margin-right: var(--adyen-sdk-spacer-070,16px); }
3333.adyen-checkout__filter-input { background: inherit; border: 0px;
3333 color: var(--adyen-sdk-color-label-primary,#00112c); font-family: inherit; font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); height: 100%; padding: 0px; width: 100%; }
3334.adyen-checkout__filter-input:active, .adyen-checkout__filter-input:focus { outline: 0px; }
3335.adyen-checkout__filter-input[readonly] { border-color: transparent; cursor: not-allowed; color: var(--adyen-sdk-color-label-secondary,#5c687c) !important; }
3336.adyen-checkout__dropdown__list { background: var(--adyen-sdk-color-background-primary,#ffffff); border-radius: var(--adyen-sdk-border-radius-m,8px); box-shadow: 0 var(--adyen-sdk-spacer-010,2px) 7px #000f2d4d; display: none; list-style: none; margin: 0 0 var(--adyen-sdk-spacer-120,48px); max-height: 375px; overflow-y: auto; padding: 0px; position: absolute; width: 100%; z-index: 2; }
3337.adyen-checkout__dropdown__list.adyen-checkout__dropdown__list--active { display: block; margin-top: var(--adyen-sdk-spacer-010,2px); }
3338.adyen-checkout__dropdown__element { align-items: center; border: var(--adyen-sdk-border-width-s,1px) solid transparent; cursor: pointer; display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); hyphens: auto; line-height: var(--adyen-sdk-text-body-line-height,20px); outline: 0px; padding: var(--adyen-sdk-spacer-040,8px); transition: background 0.2s ease-out, border-color 0.2s ease-out; user-select: none; word-break: break-word; }
3339.adyen-checkout__dropdown__element .adyen-checkout__icon { position: absolute; right: var(--adyen-sdk-spacer-040,8px); }
3340.adyen-checkout__dropdown__element:last-child { border-bottom: 0px; }
3341.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active { background: rgba(230, 233, 235, 0.6); border-radius: var(--adyen-sdk-border-radius-m,8px); box-shadow: inset 0 0 0 var(--adyen-sdk-border-width-s,1px) var(--adyen-sdk-color-outline-primary-active,#00112c); }
3342.adyen-checkout__dropdown__element:hover { background: rgba(230, 233, 235, 0.6); }
3343.adyen-checkout__dropdown__element--disabled { cursor: not-allowed; opacity: 0.4; }
3344.adyen-checkout__dropdown__element__icon { border-radius: var(--adyen-sdk-border-radius-s,4px); margin-right: var(--adyen-sdk-spacer-060,12px); max-height: 26px; max-width: var(--adyen-sdk-spacer-110,40px); }
3345.adyen-checkout__dropdown__element__text { flex-grow: 1; }
3346.adyen-checkout__dropdown__element__secondary-text:not(:last-child) { margin-right: var(--adyen-sdk-spacer-040,8px); }
3347.adyen-checkout__dropdown + .adyen-checkout-input__inline-validation { right: var(--adyen-sdk-spacer-100,32px); }
3348.adyen-checkout__installments--revolving-plan .adyen-checkout__input-wrapper { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }
3349.adyen-checkout__installments--revolving-plan .adyen-checkout__input-wrapper:active, .adyen-checkout__installments--revolving-plan .adyen-checkout__input-wrapper:active:hover, .adyen-checkout__installments--revolving-plan .adyen-checkout__input-wrapper:focus-within, .adyen-checkout__installments--revolving-plan .adyen-checkout__input-wrapper:focus-within:hover { box-shadow: none; }
3350.adyen-checkout__installments--revolving-plan .adyen-checkout__fieldset--revolving-plan { margin-top: -5px; }
3351.adyen-checkout-disclaimer__label { color: var(--adyen-sdk-color-label-secondary,#5c687c); display: inline-block; font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: 400; line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-top: var(--adyen-sdk-spacer-070,16px); padding-left: 0px; }
3352[dir="rtl"] .adyen-checkout-disclaimer__label { padding-right: 0px; }
3353.adyen-checkout-link { --text-decoration: none; color: var(--adyen-sdk-color-label-highlight,#0070f5); text-decoration: var(--text-decoration); }
3354.adyen-checkout-link:focus-visible { outline: none; }
3355.adyen-checkout-link:active, .adyen-checkout-link:hover { --text-decoration: underline; }
3356.adyen-checkout-link:focus-visible { border-radius: var(--adyen-sdk-border-radius-xs,2px); box-shadow: 0 0 0 1px #fff,0 0 0 3px var(--adyen-sdk-focus-ring-color,rgba(0,112,245,.8)); transition: 0.1s cubic-bezier(0.785, 0.135, 0.15, 0.86); }
3357.adyen-checkout-brand-wrapper { align-items: center; border-radius: var(--adyen-sdk-border-radius-s,4px); box-shadow: var(--adyen-sdk-shadow-low,0 2px 4px rgba(0,17,44,.04),0 1px 2px rgba(0,17,44,.02)); display: flex; justify-content: center; overflow: hidden; position: relative; }
3358.adyen-checkout-brand-wrapper--error { display: none; }
3359.adyen-checkout__field--cardNumber .adyen-checkout__input-wrapper { cursor: text; }
3360.adyen-checkout__field--cardNumber .adyen-checkout-brand-wrapper { border-radius: var(--adyen-sdk-border-radius-s,4px); margin-right: var(--adyen-sdk-spacer-060,12px); }
3361.adyen-checkout__field--cardNumber .adyen-checkout-card-input__icon { margin-right: 0px; }
3362.adyen-checkout__card__dual-branding__icons { display: flex; }
3363.adyen-checkout__card__dual-branding__icons .adyen-checkout__card__cardNumber__brandIcon { opacity: 1; }
3364.adyen-checkout__card__dual-branding__sr-only { border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; }
3365.DualBrandSelector-module_dualBrandSelector__Fz7UW { background-color: var(--adyen-sdk-color-background-tertiary,#eeeff1); border-radius: var(--adyen-sdk-border-radius-m,8px); display: flex; gap: var(--adyen-sdk-spacer-020,4px); margin-right: var(--adyen-sdk-spacer-060,12px); padding: var(--adyen-sdk-spacer-020,4px); }
3366.DualBrandSelector-module_dualBrandSelectorButton__3Dxem { align-items: center; background-color: transparent; border: 1px solid transparent; border-radius: var(--adyen-sdk-border-radius-s,4px); cursor: pointer; display: flex; height: 24px; justify-content: center; padding: 0px; transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s; width: 34px; }
3367.DualBrandSelector-module_dualBrandSelectorButton__3Dxem:hover { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border-color: var(--adyen-sdk-color-outline-primary,#dbdee2); box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px; }
3368.DualBrandSelector-module_dualBrandSelectorButtonSelected__EswTK { background-color: var(--adyen-sdk-color-background-primary,#ffffff); box-shadow: inset 0 0 0 .5px var(--adyen-sdk-color-outline-primary,#dbdee2),0 2px 4px #00000080; }
3369.DualBrandSelector-module_dualBrandSelectorIcon__qeN0L { border-radius: var(--adyen-sdk-border-radius-s,4px); height: 16px; width: 24px; }
3370.adyen-checkout__field.adyen-checkout__card__exp-date__input--hidden { display: none; }
3371.adyen-checkout__card__exp-cvc__exp-date__input--hidden { justify-content: flex-end; }
3372.adyen-checkout__field__exp-date .adyen-checkout__input-wrapper { cursor: text; }
3373.adyen-checkout__input-wrapper .adyen-checkout__field__exp-date_hint_wrapper { border-radius: var(--adyen-sdk-border-radius-s,4px); height: 18px; margin-right: var(--adyen-sdk-spacer-060,12px); position: absolute; right: 0px; transition: opacity 0.1s linear; width: 27px; }
3374.adyen-checkout__input-wrapper .adyen-checkout__field__exp-date_hint_wrapper.adyen-checkout__field__exp-date_hint_wrapper--hidden { opacity: 0; }
3375.adyen-checkout__field__exp-date_hint { height: 18px; width: 27px; }
3376.BrandIcons-module_container__FeCxK { align-items: center; display: flex; flex-basis: auto; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-040,8px); margin: var(--adyen-sdk-spacer-020,4px) var(--adyen-sdk-spacer-000,0); }
3377.BrandIcons-module_grid__wb0DE { display: grid; grid-template-columns: repeat(auto-fill,minmax(var(--adyen-sdk-spacer-110,40px),1fr)); }
3378.BrandIcons-module_smallImgGrid__iCMqT { grid-template-columns: repeat(auto-fill,minmax(var(--adyen-sdk-spacer-090,24px),1fr)); }
3379.BrandIcons-module_remainingBrandsLabel__v0FKS { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); }
3380.BrandIcons-module_img__Oe3i- { display: block; height: var(--adyen-sdk-spacer-090,24px); padding: 0px; width: var(--adyen-sdk-spacer-110,40px); }
3381.BrandIcons-module_smallImg__GwOZ0 { height: var(--adyen-sdk-spacer-070,16px); width: var(--adyen-sdk-spacer-090,24px); }
3382.adyen-checkout__card__brands { margin-bottom: var(--adyen-sdk-spacer-060,12px); margin-top: calc(var(--adyen-sdk-spacer-040, 8px)*-1); }
3383.adyen-checkout__card__brands--hidden { margin: -8px 0px 8px; max-height: 0px; min-height: 0px; opacity: 0; }
3384.adyen-checkout__card__exp-cvc { display: flex; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-070,16px); width: 100%; }
3385.adyen-checkout__card__exp-cvc > .adyen-checkout__field { margin-bottom: 0px; }
3386@media (min-width: 480px) {
3387  .adyen-checkout__card__exp-cvc .adyen-checkout__field { margin-bottom: 0px; }
3388}
3389.adyen-checkout__checkbox { display: flex; width: 100%; }
3390.adyen-checkout__checkbox__label { color: var(--adyen-sdk-color-label-primary,#00112c
3390); cursor: pointer; display: inline-block; flex: 1 1 0%; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: 400; line-height: var(--adyen-sdk-text-caption-line-height,18px); padding-left: var(--adyen-sdk-spacer-090,24px); position: relative; user-select: none; }
3391[dir="rtl"] .adyen-checkout__checkbox__label { padding-left: 0px; padding-right: var(--adyen-sdk-spacer-090,24px); }
3392.adyen-checkout__checkbox__input { opacity: 0; pointer-events: none; position: absolute; }
3393.adyen-checkout__checkbox__input:checked + .adyen-checkout__checkbox__label::before { opacity: 1; }
3394.adyen-checkout__checkbox__input:checked + .adyen-checkout__checkbox__label::after { background-color: var(--adyen-sdk-color-label-primary,#00112c); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-label-primary,#00112c); }
3395.adyen-checkout__checkbox__input:checked:hover + .adyen-checkout__checkbox__label::after { border-color: var(--adyen-sdk-color-label-primary,#00112c); box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-tertiary,#8d95a3); }
3396.adyen-checkout__checkbox__input:focus + .adyen-checkout__checkbox__label::after { border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-label-primary,#00112c
3396); box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-tertiary,#8d95a3); }
3397.adyen-checkout__checkbox__input:hover:not(:focus) + .adyen-checkout__checkbox__label::after { border-color: var(--adyen-sdk-color-outline-tertiary,#8d95a3); box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-primary-hover,#c9cdd3); }
3398.adyen-checkout__checkbox__input + .adyen-checkout__checkbox__label::before { border-bottom: var(--adyen-sdk-spacer-010,2px) solid var(--adyen-sdk-color-label-on-color,#ffffff); border-left: 1px solid transparent; border-radius: 0 var(--adyen-sdk-spacer-010,2px) 1px; border-right: var(--adyen-sdk-spacer-010,2px) solid var(--adyen-sdk-color-label-on-color,#ffffff); border-top: 1px solid transparent; content: ""; height: 11px; left: 1px; opacity: 0; position: absolute; top: var(--adyen-sdk-spacer-010,2px); transform: rotate(37deg); transform-origin: 100% 100%; transition: opacity 0.2s ease-out; width: var(--adyen-sdk-spacer-030,6px); z-index: 1; }
3399[dir="rtl"] .adyen-checkout__checkbox__input + .adyen-checkout__checkbox__label::before { left: auto; right: var(--adyen-sdk-spacer-040,8px); }
3400.adyen-checkout__checkbox__input + .adyen-checkout__checkbox__label::after { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-s,4px); content: ""; height: var(--adyen-sdk-spacer-070,16px); left: 0px; position: absolute; top: 0px; transition: background 0.15s ease-out, border 0.05s ease-out, box-shadow 0.1s ease-out; width: var(--adyen-sdk-spacer-070,16px); z-index: 0; }
3401[dir="rtl"] .adyen-checkout__checkbox__input + .adyen-checkout__checkbox__label::after { left: auto; right: 0px; }
3402.adyen-checkout__field--consentCheckbox { align-items: center; background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-m,8px); display: flex; }
3403.adyen-checkout__field--consentCheckbox, [dir="rtl"] .adyen-checkout__field--consentCheckbox { padding: var(--adyen-sdk-spacer-060,12px) var(--adyen-sdk-spacer-070,16px); }
3404.adyen-checkout__field--consentCheckbox .adyen-checkout__input-wrapper { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; flex: 1 1 0%; justify-content: space-between; }
3405.adyen-checkout__field--consentCheckbox .adyen-checkout__input-wrapper:active, .adyen-checkout__field--consentCheckbox .adyen-checkout__input-wrapper:active:hover, .adyen-checkout__field--consentCheckbox .adyen-checkout__input-wrapper:focus-within, .adyen-checkout__field--consentCheckbox .adyen-checkout__input-wrapper:focus-within:hover { box-shadow: none; }
3406.adyen-checkout__field--consentCheckbox.adyen-checkout__field--error { border-color: var(--adyen-sdk-color-outline-critical,#e22d2d); }
3407.adyen-checkout__field--consentCheckbox .adyen-checkout-input__inline-validation { margin-right: 0px; }
3408[dir="rtl"] .adyen-checkout__field--consentCheckbox .adyen-checkout-input__inline-validation { margin-left: 0px; }
3409.adyen-checkout__store-details { align-items: center; background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-m,8px); display: flex; gap: var(--adyen-sdk-spacer-060,12px); margin-top: var(--adyen-sdk-spacer-070,16px); padding: var(--adyen-sdk-spacer-060,12px) var(--adyen-sdk-spacer-070,16px); }
3410.adyen-checkout__address-search { position: relative; }
3411.adyen-checkout__address-search .adyen-checkout__dropdown__button::after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23687282' d='M6.5 11.9a4.5 4.5 0 0 0 2.6-.83l2.77 2.74c.13.13.3.19.48.19.38 0 .65-.29.65-.66a.63.63 0 0 0-.19-.46l-2.75-2.73a4.4 4.4 0 0 0 .92-2.7 4.48 4.48 0 0 0-8.98 0 4.48 4.48 0 0 0 4.5 4.45m0-.96a3.53 3.53 0 0 1-3.53-3.49 3.52 3.52 0 0 1 7.04 0c0 1.9-1.59 3.49-3.52 3.49Z'/%3E%3C/svg%3E"); background-position: 50% center; background-repeat: no-repeat; content: ""; height: var(--adyen-sdk-spacer-070,16px); left: var(--adyen-sdk-spacer-060,12px); position: absolute; width: var(--adyen-sdk-spacer-070,16px); }
3412.adyen-checkout__address-search .adyen-checkout__dropdown__button--active::after { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%2300112c' d='M6.5 11.9a4.5 4.5 0 0 0 2.6-.83l2.77 2.74c.13.13.3.19.48.19.38 0 .65-.29.65-.66a.63.63 0 0 0-.19-.46l-2.75-2.73a4.4 4.4 0 0 0 .92-2.7 4.48 4.48 0 0 0-8.98 0 4.48 4.48 0 0 0 4.5 4.45m0-.96a3.53 3.53 0 0 1-3.53-3.49 3.52 3.52 0 0 1 7.04 0c0 1.9-1.59 3.49-3.52 3.49Z'/%3E%3C/svg%3E"); transform: none; }
3413.adyen-checkout__address-search .adyen-checkout__filter-input { padding-left: calc(var(--adyen-sdk-spacer-040, 8px) + var(--adyen-sdk-spacer-070, 16px)); position: relative; }
3414.adyen-checkout__address-search__manual-add { position: absolute; right: 0px; top: 0px; }
3415.adyen-checkout__address-search__manual-add .adyen-checkout__address-search__manual-add__button { border: 0px; padding: 0px; }
3416.adyen-checkout__fieldset--address .adyen-checkout__field-group { display: flex; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-070,16px); width: 100%; }
3417.adyen-checkout__fieldset--address .adyen-checkout__field-group > .adyen-checkout__field { margin-bottom: 0px; }
3418.adyen-checkout-form-instruction { color: var(--adyen-sdk-color-label-primary,#00112c
3418); font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-bottom: var(--adyen-sdk-spacer-070,16px); margin-top: 0px; }
3419[dir="rtl"] .adyen-checkout-form-instruction { padding-right: 0px; }
3420.adyen-checkout-toggle { color: inherit; cursor: pointer; display: flex; width: auto; }
3421.adyen-checkout-toggle, .adyen-checkout-toggle *, .adyen-checkout-toggle ::after, .adyen-checkout-toggle ::before, .adyen-checkout-toggle::after, .adyen-checkout-toggle::before { box-sizing: border-box; }
3422.adyen-checkout-toggle--disabled { cursor: not-allowed; display: flex; }
3423.adyen-checkout-toggle--readonly { pointer-events: none; }
3424.adyen-checkout-toggle--label-first { align-items: flex-start; flex-direction: row-reverse; justify-content: flex-end; }
3425.adyen-checkout-toggle__input { cursor: inherit; opacity: 0; position: absolute; }
3426.adyen-checkout-toggle__track { align-items: center; background-color: var(--adyen-sdk-toggle-track-background-color,#ffffff); border: var(--adyen-sdk-toggle-track-border,1px solid #8d95a3); border-radius: var(--adyen-sdk-toggle-track-border-radius,12px); display: flex; height: var(--adyen-sdk-toggle-track-height,20px); min-width: var(--adyen-sdk-toggle-track-width,36px); padding: var(--adyen-sdk-toggle-track-padding,2px 4px); position: relative; }
3427.adyen-checkout-toggle__input:focus-visible + .adyen-checkout-toggle__track { box-shadow: 0 0 0 1px #fff,0 0 0 3px var(--adyen-sdk-focus-ring-color,rgba(0,112,245,.8)); transition: 0.1s cubic-bezier(0.785, 0.135, 0.15, 0.86); }
3428.adyen-checkout-toggle__input:hover:enabled + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-hover-background-color,#f7f7f8); border-color: var(--adyen-sdk-toggle-track-hover-border-color,#6d7789); }
3429.adyen-checkout-toggle__input:active:enabled + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-active-background-color,#eeeff1); border-color: var(--adyen-sdk-toggle-track-active-border-color,#00112c); }
3430.adyen-checkout-toggle__input:disabled + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-disabled-background-color,#f7f7f8); border-color: var(--adyen-sdk-toggle-track-disabled-border-color,#dbdee2); cursor: not-allowed; }
3431.adyen-checkout-toggle__input:disabled + .adyen-checkout-toggle__track path { fill: rgb(141, 149, 163); }
3432.adyen-checkout-toggle--readonly .adyen-checkout-toggle__input + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-readonly-background-color,#f7f7f8); border-color: var(--adyen-sdk-toggle-track-readonly-border-color,#dbdee2); }
3433.adyen-checkout-toggle__input:checked + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-toggled-background-color,#00112c); border: var(--adyen-sdk-toggle-track-toggled-border,0); padding: var(--adyen-sdk-toggle-track-toggled-padding,2px); }
3434.adyen-checkout-toggle__input:checked:hover:enabled + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-toggled-hover-background-color,#5c687c); }
3435.adyen-checkout-toggle__input:checked:active:enabled + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-toggled-active-background-color,#8d95a3); }
3436.adyen-checkout-toggle__input:checked:disabled + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-toggled-disabled-background-color,#c0c5cc); }
3437.adyen-checkout-toggle--readonly .adyen-checkout-toggle__input:checked + .adyen-checkout-toggle__track { background-color: var(--adyen-sdk-toggle-track-toggled-readonly-background-color,#c0c5cc); }
3438.adyen-checkout-toggle__handle { place-content: center; background-color: var(--adyen-sdk-toggle-handle-background-color,#00112c); border-radius: var(--adyen-sdk-toggle-handle-border-radius,12px); color: var(--adyen-sdk-toggle-handle-toggled-color,#00112c); display: inline-flex; height: var(--adyen-sdk-toggle-handle-height,12px); transition: var(--adyen-sdk-toggle-handle-transition,transform .15s cubic-bezier(.2,0,.4,.9)); width: var(--adyen-sdk-toggle-handle-width,12px); }
3439.adyen-checkout-toggle__input:disabled + * .adyen-checkout-toggle__handle { background-color: var(--adyen-sdk-toggle-handle-disabled-background-color,#8d95a3);
3439 cursor: not-allowed; }
3440.adyen-checkout-toggle__input:checked + * .adyen-checkout-toggle__handle { background-color: var(--adyen-sdk-toggle-handle-toggled-background-color,#ffffff); height: var(--adyen-sdk-toggle-handle-toggled-height,16px); transform: translate(100%); width: var(--adyen-sdk-toggle-handle-toggled-width,16px); }
3441.adyen-checkout-toggle__input:checked:disabled + * .adyen-checkout-toggle__handle { background-color: var(--adyen-sdk-toggle-handle-toggled-disabled-background-color,#eeeff1); color: var(--adyen-sdk-toggle-handle-toggled-disabled-color,#8d95a3); cursor: not-allowed; }
3442.adyen-checkout-toggle--readonly .adyen-checkout-toggle__input:checked + * .adyen-checkout-toggle__handle { background-color: var(--adyen-sdk-toggle-handle-toggled-readonly-background-color,#eeeff1); }
3443.adyen-checkout-toggle__label-container { display: flex; flex-direction: column; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-body-line-height,20px); padding-left: var(--adyen-sdk-toggle-label-padding,16px); }
3444.adyen-checkout-toggle--label-first > .adyen-checkout-toggle__label-container { padding-left: 0px; padding-right: var(--adyen-sdk-toggle-label-padding,16px); }
3445.adyen-checkout-toggle__label { vertical-align: baseline; }
3446.adyen-checkout-toggle__description, .adyen-checkout-toggle__label { font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-body-line-height,20px); }
3447.adyen-checkout-toggle__description { color: var(--adyen-sdk-toggle-description-color,#5c687c); padding-top: var(--adyen-sdk-toggle-description-padding,4px); }
3448.adyen-checkout__modal-wrapper { align-items: center; display: flex; height: 100%; left: 0px; overflow-y: auto; overscroll-behavior-y: contain; padding: var(--adyen-sdk-spacer-090,24px); position: fixed; top: 0px; visibility: hidden; width: 100%; z-index: 10; }
3449.adyen-checkout__modal-wrapper::before { background: rgba(0, 17, 44, 0.5); content: ""; height: 100%; left: 0px; opacity: 0; position: fixed; top: 0px; transition: opacity 0.3s linear; width: 100%; z-index: 10; }
3450.adyen-checkout__modal-wrapper--open { visibility: visible; }
3451.adyen-checkout__modal-wrapper--open .adyen-checkout__modal, .adyen-checkout__modal-wrapper--open::before { opacity: 1; }
3452.adyen-checkout__modal { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border-radius: var(--adyen-sdk-border-radius-m,8px); box-shadow: 0 var(--adyen-sdk-spacer-040,8px) var(--adyen-sdk-spacer-090,24px) #00112c26; margin: auto; opacity: 0; padding: var(--adyen-sdk-spacer-070,16px); position: relative; transition: opacity 0.2s, visibility 0.2s; z-index: 11; }
3453.adyen-checkout__button { background: var(--adyen-sdk-color-background-always-dark,#00112c); border: 0px; border-radius: var(--adyen-sdk-border-radius-m,8px); color: var(--adyen-sdk-color-label-on-color,#ffffff); cursor: pointer; font-size: var(--adyen-sdk-text-title-font-size,1rem); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); height: var(--adyen-sdk-spacer-120,48px); margin: 0px; padding: var(--adyen-sdk-spacer-060,12px) var(--adyen-sdk-spacer-000,0); text-decoration: none; transition: background 0.3s ease-out, box-shadow 0.3s ease-out; width: 100%; }
3454.adyen-checkout__button:focus-visible { box-shadow: 0 0 0 var(--adyen-sdk-focus-ring-spacer,1px) var(--adyen-sdk-color-background-primary,#ffffff),0 0 0 var(--adyen-sdk-focus-ring-outline,3px) var(--adyen-sdk-focus-ring-color,rgba(0,112,245,.8)); outline: 0px; }
3455.adyen-checkout__button:hover { background: var(--adyen-sdk-color-background-inverse-primary-hover,#5c687c); }
3456.adyen-checkout__button:active { background: var(--adyen-sdk-color-background-always-dark-active,#8d95a3); }
3457.adyen-checkout__button:disabled, .adyen-checkout__button:disabled:hover, .adyen-checkout__button[aria-disabled="true"], .adyen-checkout__button[aria-disabled="true"]:hover { box-shadow: none; cursor: not-allowed; opacity: 0.4; user-select: all; }
3458.adyen-checkout__button.adyen-checkout__button--loading { background: var(--adyen-sdk-color-label-disabled,#8d95a3); box-shadow: none; pointer-events: none; user-select: none; }
3459.adyen-checkout__button.adyen-checkout__button--pay { align-items: center; display: flex; gap: var(--adyen-sdk-spacer-020,4px); justify-content: center; margin-top: var(--adyen-sdk-spacer-070,16px); }
3460.adyen-checkout__button.adyen-checkout__button--pay:disabled { opacity: 0.4; }
3461.adyen-checkout__button.adyen-checkout__button--standalone { margin-top: 0px; }
3462.adyen-checkout__button.adyen-checkout__button--inline { display: block; font-size: 0.81em; height: auto; padding: var(--adyen-sdk-spacer-050,10px) var(--adyen-sdk-spacer-040,8px); width: auto; }
3463.adyen-checkout__button.adyen-checkout__button--ghost { background: none; border: 0px;
3463 color: var(--adyen-sdk-color-label-primary,#00112c); }
3464.adyen-checkout__button.adyen-checkout__button--ghost .adyen-checkout__spinner::before { border-right-color: ; border-bottom-color: ; border-left-color: ; border-top-color: transparent; opacity: 0.1; }
3465.adyen-checkout__button.adyen-checkout__button--ghost .adyen-checkout__spinner::after { border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-color: var(--adyen-sdk-color-outline-primary-active,#00112c); }
3466.adyen-checkout__button.adyen-checkout__button--ghost:hover { background: var(--adyen-sdk-color-background-secondary-hover,#eeeff1); }
3467.adyen-checkout__button.adyen-checkout__button--ghost:active { background: var(--adyen-sdk-color-background-secondary-active,#e3e5e9); box-shadow: none; }
3468.adyen-checkout__button.adyen-checkout__button--secondary { background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-label-primary,#00112c);
3468 color: var(--adyen-sdk-color-label-primary,#00112c); padding: var(--adyen-sdk-spacer-050,10px) var(--adyen-sdk-spacer-060,12px); }
3469.adyen-checkout__button.adyen-checkout__button--secondary .adyen-checkout__spinner::before { border-right-color: ; border-bottom-color: ; border-left-color: ; border-top-color: transparent; opacity: 0.1; }
3470.adyen-checkout__button.adyen-checkout__button--secondary .adyen-checkout__spinner::after { border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-color: var(--adyen-sdk-color-outline-primary-active,#00112c); }
3471.adyen-checkout__button.adyen-checkout__button--secondary:hover { background: var(--adyen-sdk-color-background-secondary,#f7f7f8); }
3472.adyen-checkout__button.adyen-checkout__button--secondary:hover:not(:focus-visible) { box-shadow: 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-spacer-020,4px) #1b2a3c33,0 var(--adyen-sdk-spacer-020,4px) 5px #1b2a3c24; }
3473.adyen-checkout__button.adyen-checkout__button--secondary:active, .adyen-checkout__button.adyen-checkout__button--secondary:active:hover { background: var(--adyen-sdk-color-background-secondary,#f7f7f8); box-shadow: none; }
3474.adyen-checkout__button.adyen-checkout__button--secondary:disabled, .adyen-checkout__button.adyen-checkout__button--secondary:disabled:hover { background-color: var(--adyen-sdk-color-background-secondary,#f7f7f8); border-color: var(--adyen-sdk-color-outline-disabled,#dbdee2); box-shadow: none; cursor: not-allowed; opacity: 0.5; user-select: all; }
3475.adyen-checkout__button.adyen-checkout__button--action { background: var(--adyen-sdk-color-background-always-dark,#00112c); border: var(--adyen-sdk-border-width-s,1px) solid transparent; color: var(--adyen-sdk-color-label-on-color,#ffffff); padding: var(--adyen-sdk-spacer-050,10px) var(--adyen-sdk-spacer-060,12px); }
3476.adyen-checkout__button.adyen-checkout__button--action:hover { background: var(--adyen-sdk-color-background-inverse-primary-hover,#5c687c); }
3477.adyen-checkout__button.adyen-checkout__button--action:active, .adyen-checkout__button.adyen-checkout__button--action:active:hover { background: var(--adyen-sdk-color-background-always-dark-active,#8d95a3); box-shadow: none; }
3478.adyen-checkout__button.adyen-checkout__button--link { background: transparent; border: var(--adyen-sdk-border-width-s,1px) solid transparent; border-radius: var(--adyen-sdk-border-radius-s,4px); color: var(--adyen-sdk-color-label-highlight,#0070f5); font-weight: var(--adyen-sdk-text-body-font-weight,400); padding: var(--adyen-sdk-spacer-010,2px); text-decoration: none; }
3479.adyen-checkout__button.adyen-checkout__button--link:hover { background: transparent; text-decoration: underline; }
3480.adyen-checkout__button.adyen-checkout__button--completed, .adyen-checkout__button.adyen-checkout__button--completed:active, .adyen-checkout__button.adyen-checkout__button--completed:active:hover, .adyen-checkout__button.adyen-checkout__button--completed:hover { background: var(--adyen-sdk-color-label-success,#07893c); color: var(--adyen-sdk-color-label-on-color,#ffffff); }
3481.adyen-checkout__button.adyen-checkout__button--completed .adyen-checkout__button__icon { filter: brightness(0) invert(1); }
3482.adyen-checkout__button__content { align-items: center; display: flex; height: 100%; justify-content: center; }
3483.adyen-checkout__button__icon { margin-right: var(--adyen-sdk-spacer-040,8px); }
3484[dir="rtl"] .adyen-checkout__button__icon { margin-left: var(--adyen-sdk-spacer-040,8px); margin-right: 0px; }
3485.adyen-checkout__button__text { display: block; justify-content: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
3486.adyen-checkout__button__text--sr-only { border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; }
3487.adyen-checkout__button .adyen-checkout__spinner::before { border-right-color: ; border-bottom-color: ; border-left-color: ; border-top-color: transparent; opacity: 0.1; }
3488.adyen-checkout__button .adyen-checkout__spinner::after { border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-top-color: var(--adyen-sdk-color-label-on-color,#ffffff); }
3489.adyen-checkout__button.adyen-checkout__button--iconOnly { align-items: center; background: transparent; border-radius: var(--adyen-sdk-border-radius-m,8px);
3489 box-shadow: var(--adyen-sdk-button-tertiary-box-shadow,inset 0 0 0 1px rgba(0,0,0,0)); color: var(--adyen-sdk-button-tertiary-color,#00112c); display: flex; height: auto; padding: var(--adyen-sdk-button-icon-only-padding,10px); width: auto; }
3490.adyen-checkout__button.adyen-checkout__button--iconOnly:hover { background-color: var(--adyen-sdk-color-background-secondary-hover,#eeeff1); }
3491.adyen-checkout__button.adyen-checkout__button--iconOnly:active { background-color: var(--adyen-sdk-button-tertiary-active-background-color,rgba(0,0,0,0)); color: var(--adyen-sdk-button-tertiary-active-color,#8d95a3); }
3492.adyen-checkout__button.adyen-checkout__button--iconOnly:focus { box-shadow: none; }
3493.adyen-checkout__button.adyen-checkout__button--iconOnly:focus-visible { box-shadow: 0 0 0 var(--adyen-sdk-focus-ring-spacer,1px) var(--adyen-sdk-color-background-primary,#ffffff),0 0 0 var(--adyen-sdk-focus-ring-outline,3px) var(--adyen-sdk-focus-ring-color,rgba(0,112,245,.8)); outline: 0px; }
3494.adyen-checkout__button.adyen-checkout__button--iconOnly:disabled, .adyen-checkout__button.adyen-checkout__button--iconOnly:disabled:hover { box-shadow: none; cursor: not-allowed; opacity: 0.4; user-select: all; }
3495.adyen-checkout__button.adyen-checkout__button--iconOnly .adyen-checkout__button__icon { margin: 0px; }
3496.adyen-checkout-card-fastlane__modal { margin-bottom: var(--adyen-sdk-spacer-070,16px); max-width: 372px; }
3497.adyen-checkout-card-fastlane__modal-section { column-gap: var(--adyen-sdk-spacer-070,16px); display: grid; grid-template-areas: "image header" ". text"; grid-template-columns: auto 1fr; grid-template-rows: auto; margin-bottom: var(--adyen-sdk-spacer-060,12px); place-items: start; }
3498.adyen-checkout-card-fastlane__modal-section-image { grid-area: image; place-self: center; }
3499.adyen-checkout-card-fastlane__modal-section-header { color: var(--adyen-sdk-color-background-inverse-primary,#00112c
3499); font-size: var(--adyen-sdk-text-title-m-font-size,1.25rem); font-weight: var(--adyen-sdk-text-title-m-font-weight,600); grid-area: header; line-height: var(--adyen-sdk-text-title-m-line-height,30px); margin: 0px; }
3500.adyen-checkout-card-fastlane__modal-section-text { color: var(--adyen-sdk-color-background-inverse-primary,#00112c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); grid-area: text; line-height: var(--adyen-sdk-text-body-line-height,20px); }
3501.adyen-checkout-card-fastlane__modal-brand { height: 23px; margin-top: var(--adyen-sdk-spacer-040,8px); width: 168px; }
3502.adyen-checkout-card-fastlane__modal-button-container { display: flex; flex-direction: row-reverse; margin-bottom: var(--adyen-sdk-spacer-060,12px); }
3503.adyen-checkout-card-fastlane__modal-button-container > button { line-height: 0; }
3504.adyen-checkout-card__fastlane { align-items: center; background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-m,8px); margin-top: var(--adyen-sdk-spacer-070,16px); }
3505.adyen-checkout-card__fastlane, [dir="rtl"] .adyen-checkout-card__fastlane { padding: var(--adyen-sdk-spacer-060,12px) var(--adyen-sdk-spacer-070,16px); }
3506.adyen-checkout-card__fastlane-consent-toggle { display: flex; }
3507.adyen-checkout-card__fastlane-consent-text, .adyen-checkout-card__fastlane-consent-toggle--active { margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3508.adyen-checkout-card__fastlane-consent-text { font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-caption-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); }
3509.adyen-checkout-card__fastlane-brand { height: 23px; width: 168px; }
3510.adyen-checkout__button.adyen-checkout__button--fastlane-info-modal { height: 20px; line-height: 0; margin-left: var(--adyen-sdk-spacer-020,4px); padding: 0px; vertical-align: bottom; width: 20px; }
3511.adyen-checkout-ctp__otp-resend-code-wrapper { line-height: var(--adyen-sdk-text-body-line-height,20px); margin-left: auto; position: absolute; right: 0px; top: 0px; }
3512.adyen-checkout-ctp__otp-resend-code--confirmation, .adyen-checkout-ctp__otp-resend-code--disabled { color: var(--adyen-sdk-color-label-tertiary,#5c687c); cursor: default; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); margin-left: auto; pointer-events: none; }
3513.adyen-checkout-ctp__otp-resend-code--confirmation { align-items: center; display: flex; }
3514.adyen-checkout-ctp__otp-resend-code--confirmation > img { margin-left: var(--adyen-sdk-spacer-020,4px); }
3515.adyen-checkout-ctp__otp-resend-code-counter { color: var(--adyen-sdk-color-label-primary,#00112c
3515); cursor: default; display: inline-block; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); margin-left: auto; text-align: right; }
3516.adyen-checkout-ctp__section > .adyen-checkout__field.adyen-checkout__field--otp { margin-bottom: var(--adyen-sdk-spacer-060,12px); }
3517.adyen-checkout-ctp__otp-field-wrapper { position: relative; }
3518.adyen_checkout-ctp__brand-wrapper { align-items: center; display: flex; height: 18px; }
3519.adyen_checkout-ctp__brand-logo { margin-right: var(--adyen-sdk-spacer-030,6px); width: var(--adyen-sdk-spacer-090,24px); }
3520.adyen_checkout-ctp__brand-pipe { height: 15px; margin-right: var(--adyen-sdk-spacer-030,6px); }
3521.adyen_checkout-ctp__brand-scheme { margin-right: var(--adyen-sdk-spacer-030,6px); object-fit: none; }
3522.adyen_checkout-ctp__brand-scheme-mc { width: 27px; }
3523.adyen_checkout-ctp__brand-scheme-visa { width: 35px; }
3524.adyen-checkout__ctp-modal-header-image { display: block; margin: auto; }
3525.adyen-checkout__ctp-modal-title { font-size: var(--adyen-sdk-text-title-m-font-size,1.25rem); font-weight: 700; line-height: var(--adyen-sdk-spacer-090,24px); margin: 0 0 var(--adyen-sdk-spacer-060,12px); padding: 0px; }
3526.adyen-checkout__ctp-modal-text { font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3527.adyen-checkout__ctp-modal-benefits { margin-left: 0px; padding-left: var(--adyen-sdk-spacer-080,20px); }
3528.adyen-checkout__ctp-modal-benefits li { list-style: disc; margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3529.adyen-checkout__modal-wrapper--ctp .adyen-checkout__modal { max-width: 464px; }
3530.adyen_checkout-ctp__brand-wrapper--popup { justify-content: center; margin-bottom: var(--adyen-sdk-spacer-090,24px); }
3531.adyen-web__ctp-info-button { background-color: transparent; border: 0px; cursor: pointer; padding: 0px; }
3532.adyen-checkout__button--section-logout-button { margin-left: auto; }
3533.adyen-checkout__button--section-logout-button--disabled { color: var(--adyen-sdk-color-label-disabled,#8d95a3); pointer-events: none; }
3534.adyen-checkout-ctp__section { background-color: rgb(255, 255, 255); border-radius: var(--adyen-sdk-spacer-060,12px); box-shadow: rgba(0, 17, 44, 0.08) 0px 6px 12px, rgba(0, 17, 44, 0.04) 0px 2px 4px; padding: var(--adyen-sdk-spacer-070,16px); position: relative; }
3535.adyen-checkout-ctp__section-brand { align-items: center; display: flex; height: 18px; margin-bottom: 16px; }
3536.adyen-checkout-ctp__section--standalone { all: unset; }
3537.adyen-checkout-ctp__section .adyen-checkout__fieldset { margin-bottom: var(--adyen-sdk-spacer-090,24px); }
3538.adyen-checkout-ctp__section-header { align-items: center; display: flex; }
3539.adyen-checkout-ctp__section-header-title { font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-title-font-weight,600); line-height: 22px; margin: 0px; padding: 0px; width: auto; }
3540@media (min-width: 480px) {
3541  .adyen-checkout-ctp__section-header-title { font-size: var(--adyen-sdk-text-title-font-size,1rem); }
3542}
3543.adyen-checkout-ctp__section-header-adornment { margin-left: 5px; }
3544.adyen-checkout-ctp__section-text { color: var(--adyen-sdk-color-label-tertiary,#5c687c); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin: 0 0 var(--adyen-sdk-spacer-070,16px); }
3545.adyen-checkout-ctp__section-text, .adyen-checkout-ctp__separator { font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); }
3546.adyen-checkout-ctp__separator { color: var(--adyen-sdk-color-label-primary,#00112c
3546); }
3547.adyen-checkout-ctp__otp-subtitle--highlighted { color: var(--adyen-sdk-color-label-primary,#00112c); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); }
3548.adyen-checkout-ctp__otp-checkbox-container { background-color: rgb(247, 248, 249); border-radius: var(--adyen-sdk-border-radius-s,4px); margin-bottom: var(--adyen-sdk-spacer-070,16px); padding: var(--adyen-sdk-spacer-060,12px); }
3549.adyen-checkout-ctp__otp-checkbox-container--checked { background-color: rgb(242, 248, 255); }
3550.adyen-checkout-ctp__otp-checkbox-container label { cursor: pointer; }
3551.adyen-checkout-ctp__section .adyen-checkout__field.adyen-checkout-ctp__otp-checkbox-container { margin-bottom: var(--adyen-sdk-spacer-020,4px); }
3552.adyen-checkout-ctp__otp-checkbox-info { color: rgb(112, 112, 112); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-body-line-height,20px); margin: var(--adyen-sdk-spacer-020,4px) 0 0; }
3553.adyen-checkout-ctp__otp-readmore-button { color-scheme: unset; forced-color-adjust: unset; math-depth: unset; position: unset; position-anchor: unset; text-size-adjust: unset; appearance: unset; font: unset; font-palette: unset; font-synthesis: unset; position-area: unset; text-orientation: unset; text-rendering: unset; text-spacing-trim: unset; -webkit-font-smoothing: unset; -webkit-locale: unset; -webkit-text-orientation: unset; -webkit-writing-mode: unset; writing-mode: unset; zoom: unset; accent-color: unset; place-content: unset; place-items: unset; place-self: unset; alignment-baseline: unset; anchor-name: unset; anchor-scope: unset; animation-composition: unset; animation: unset; animation-trigger: unset; app-region: unset; aspect-ratio: unset; backdrop-filter: unset; backface-visibility: unset; background: unset; background-blend-mode: unset; baseline-shift: unset; baseline-source: unset; block-size: unset; border-block: unset; border: unset; border-radius: unset; border-collapse: unset; border-end-end-radius: unset; border-end-start-radius: unset; border-inline: unset; border-shape: unset; border-start-end-radius: unset; border-start-start-radius: unset; inset: unset; box-decoration-break: unset; box-shadow: unset; box-sizing: unset; break-after: unset; break-before: unset; break-inside: unset; buffered-rendering: unset; caption-side: unset; caret-animation: unset; caret-color: unset; caret-shape: unset; clear: unset; clip: unset; clip-path: unset; clip-rule: unset; color-interpolation: unset; color-interpolation-filters: unset; color-rendering: unset; columns: unset; column-fill: unset; gap: unset; column-rule: unset; column-span: unset; contain: unset; contain-intrinsic-block-size: unset; contain-intrinsic-size: unset; contain-intrinsic-inline-size: unset; container: unset; content: unset; content-visibility: unset; corner-shape: unset; corner-block-end-shape: unset; corner-block-start-shape: unset; counter-increment: unset; counter-reset: unset; counter-set: unset; cx: unset; cy: unset; d: unset; display: unset; dominant-baseline: unset; dynamic-range-limit: unset; empty-cells: unset; field-sizing: unset; fill: unset; fill-opacity: unset; fill-rule: unset; filter: unset; flex: unset; flex-flow: unset; float: unset; flood-color: unset; flood-opacity: unset; grid: unset; grid-area: unset; height: unset; hyphenate-character: unset; hyphenate-limit-chars: unset; hyphens: unset; image-orientation: unset; image-rendering: unset; initial-letter: unset; inline-size: unset; inset-block: unset; inset-inline: unset; interactivity: unset; interest-delay: unset; interpolate-size: unset; isolation: unset; letter-spacing: unset; lighting-color: unset; line-break: unset; list-style: unset; margin-block: unset; margin: unset; margin-inline: unset; marker: unset; mask: unset; mask-type: unset; math-shift: unset; math-style: unset; max-block-size: unset; max-height: unset; max-inline-size: unset; max-width: unset; min-block-size: unset; min-height: unset; min-inline-size: unset; min-width: unset; mix-blend-mode: unset; object-fit: unset; object-position: unset; object-view-box: unset; offset: unset; opacity: unset; order: unset; orphans: unset; outline: unset; outline-offset: unset; overflow-anchor: unset; overflow-block: unset; overflow-clip-margin: unset; overflow-inline: unset; overflow-wrap: unset; overflow: unset; overlay: unset; overscroll-behavior-block: unset; overscroll-behavior-inline: unset; overscroll-behavior: unset; padding-block: unset; padding: unset; padding-inline: unset; page: unset; page-orientation: unset; paint-order: unset; perspective: unset; perspective-origin: unset; pointer-events: unset; position-try: unset; position-visibility: unset; print-color-adjust: unset; quotes: unset;
3553 r: unset; reading-flow: unset; reading-order: unset; resize: unset; rotate: unset; ruby-align: unset; ruby-position: unset; rx: unset; ry: unset; scale: unset; scroll-behavior: unset; scroll-initial-target: unset; scroll-margin-block: unset; scroll-margin: unset; scroll-margin-inline: unset; scroll-marker-group: unset; scroll-padding-block: unset; scroll-padding: unset; scroll-padding-inline: unset; scroll-snap-align: unset; scroll-snap-stop: unset; scroll-snap-type: unset; scroll-target-group: unset; scroll-timeline: unset; scrollbar-color: unset; scrollbar-gutter: unset; scrollbar-width: unset; shape-image-threshold: unset; shape-margin: unset; shape-outside: unset; shape-rendering: unset; size: unset; speak: unset; stop-color: unset; stop-opacity: unset; stroke: unset; stroke-dasharray: unset; stroke-dashoffset: unset; stroke-linecap: unset; stroke-linejoin: unset; stroke-miterlimit: unset; stroke-opacity: unset; stroke-width: unset; tab-size: unset; table-layout: unset; text-align: unset; text-align-last: unset; text-anchor: unset; text-autospace: unset; text-box: unset; text-combine-upright: unset; text-decoration: unset; text-decoration-skip-ink: unset; text-emphasis: unset; text-emphasis-position: unset; text-indent: unset; text-justify: unset; text-overflow: unset; text-shadow: unset; text-underline-offset: unset; text-underline-position: unset; text-wrap: unset; timeline-scope: unset; timeline-trigger: unset; touch-action: unset; transform: unset; transform-box: unset; transform-origin: unset; transform-style: unset; transition: unset; translate: unset; trigger-scope: unset; user-select: unset; vector-effect: unset; vertical-align: unset; view-timeline: unset; view-transition-class: unset; view-transition-group: unset; view-transition-name: unset; view-transition-scope: unset; visibility: unset; border-spacing: unset; -webkit-box-align: unset; -webkit-box-decoration-break: unset; -webkit-box-direction: unset; -webkit-box-flex: unset; -webkit-box-ordinal-group: unset; -webkit-box-orient: unset; -webkit-box-pack: unset; -webkit-box-reflect: unset; -webkit-line-break: unset; -webkit-line-clamp: unset; -webkit-mask-box-image: unset; -webkit-rtl-ordering: unset; -webkit-ruby-position: unset; -webkit-tap-highlight-color: unset; -webkit-text-combine: unset; -webkit-text-decorations-in-effect: unset; -webkit-text-fill-color: unset; -webkit-text-security: unset; -webkit-text-stroke: unset; -webkit-user-drag: unset; white-space-collapse: unset; widows: unset; width: unset; will-change: unset; word-break: unset; word-spacing: unset; x: unset; y: unset; z-index: unset; color: rgb(0, 117, 255); cursor: pointer; text-transform: lowercase; }
3554.adyen-checkout-ctp__card-list-single-card { align-items: center; background-color: var(--adyen-sdk-color-background-secondary,#f7f7f8); border-radius: var(--adyen-sdk-spacer-030,6px); display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); height: var(--adyen-sdk-spacer-110,40px); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-top: var(--adyen-sdk-spacer-070,16px); padding: var(--adyen-sdk-spacer-060,12px); }
3555.adyen-checkout-ctp__card-list-single-card-expired { color: var(--adyen-sdk-color-label-tertiary,#5c687c); text-decoration: line-through; }
3556.adyen-checkout-ctp__expired-label { color: var(--adyen-sdk-color-label-tertiary,#5c687c); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); line-height: 17px; margin-left: auto; }
3557.adyen-checkout-ctp__card-image { border-radius: 3px; height: 24px; margin-right: var(--adyen-sdk-spacer-040,8px); }
3558.adyen-checkout-ctp__cards-list-field .adyen-checkout__label { margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3559.adyen-checkout-ctp__cards-list-field .adyen-checkout__label__text { color: var(--adyen-sdk-color-label-tertiary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); }
3560.adyen-checkout-ctp__cards-list-dropdown .adyen-checkout__dropdown__element--disabled { opacity: 1; }
3561.adyen-checkout-ctp__cards-list-dropdown .adyen-checkout__dropdown__element--disabled .adyen-checkout__dropdown__element__text { margin: 0px; opacity: 0.4; text-decoration: line-through; }
3562.adyen-checkout-ctp__cards-list-dropdown .adyen-checkout__dropdown__element--disabled .adyen-checkout__dropdown__element__secondary-text { color: var(--adyen-sdk-color-label-tertiary,#5c687c);
3562 font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); line-height: 17px; }
3563.adyen-checkout-ctp__cards-list-dropdown .adyen-checkout__dropdown__button--disabled { opacity: 1; }
3564.adyen-checkout-ctp__cards-list-dropdown .adyen-checkout__dropdown__button--disabled .adyen-checkout__dropdown__button__text { opacity: 0.4; text-decoration: line-through; }
3565.adyen-checkout-ctp__cards-list-dropdown .adyen-checkout__dropdown__button--disabled .adyen-checkout__dropdown__button__secondary-text { color: var(--adyen-sdk-color-label-tertiary,#5c687c); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); opacity: 1; }
3566.adyen-checkout__iframe { border: 0px; }
3567.adyen-checkout-ctp__card { background-color: rgb(255, 255, 255); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--adyen-sdk-spacer-020,4px); box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) #999595; cursor: pointer; height: var(--adyen-sdk-spacer-110,40px); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--adyen-sdk-spacer-080,20px); width: 100%; }
3568.adyen-checkout-ctp__empty-cards { align-items: center; background-color: var(--adyen-sdk-color-background-secondary,#f7f7f8); border-radius: var(--adyen-sdk-spacer-030,6px); color: var(--adyen-sdk-color-label-tertiary,#5c687c); display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); height: var(--adyen-sdk-spacer-110,40px); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-bottom: var(--adyen-sdk-spacer-090,24px); margin-top: var(--adyen-sdk-spacer-070,16px); padding: var(--adyen-sdk-spacer-060,12px) var(--adyen-sdk-spacer-070,16px); }
3569.adyen-checkout__iframe--ctpIframe { pointer-events: auto; }
3570.adyen-checkout__iframe--ctpIframe-hidden { display: none; }
3571@keyframes card-bounce { 
3572  0% { animation-timing-function: cubic-bezier(0.17, 0.17, 0.32, 1); translate: 0px -60%; }
3573  9.70874% { animation-timing-function: cubic-bezier(0.41, 0, 0.49, 1); translate: 0px 8.5%; }
3574  23.4466% { animation-timing-function: cubic-bezier(0.29, 0, 0.26, 1); translate: 0px -22.5%; }
3575  47.7184% { translate: 0px; }
3576  63.8835% { animation-timing-function: cubic-bezier(1, 0, 0.78, 1); translate: 0px; }
3577  86.5534% { translate: 0px 40.7%; }
3578  100% { translate: 0px 40.7%; }
3579}
3580@keyframes card-fade-100 { 
3581  0% { animation-timing-function: linear; opacity: 0; }
3582  8.1068% { opacity: 1; }
3583  78.4466% { opacity: 1; }
3584  86.5534% { opacity: 0; }
3585  100% { opacity: 0; }
3586}
3587@keyframes card-fade-60 { 
3588  0% { animation-timing-function: linear; opacity: 0; }
3589  8.1068% { opacity: 0.6; }
3590  78.4466% { opacity: 0.6; }
3591  86.5534% { opacity: 0; }
3592  100% { opacity: 0; }
3593}
3594@keyframes card-fade-20 { 
3595  0% { animation-timing-function: linear; opacity: 0; }
3596  8.1068% { opacity: 0.2; }
3597  78.4466% { opacity: 0.2; }
3598  86.5534% { opacity: 0; }
3599  100% { opacity: 0; }
3600}
3601.adyen-checkout-ctp__card-animation { aspect-ratio: 1 / 0.438; filter: grayscale(1); margin: 40px auto 50px; max-width: 100%; position: relative; width: 140px; }
3602.adyen-checkout-ctp__card-animation > .adyen-checkout-ctp__card-animation-layer { height: 100%; opacity: 0; position: absolute; width: 100%; background-size: contain !important; }
3603.adyen-checkout-ctp__card-animation > .adyen-checkout-ctp__card-animation-layer:first-of-type { animation: 2.06s linear 0.1s infinite normal both running card-bounce, 2.06s linear infinite normal both running card-fade-100; background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1064' height='466' fill='none'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='m895.31 228.862-46.416-10.988c-1.172-.381-2.528-.481-3.565-.203-1.582.424-1.825 1.567-.543 2.554.676.52 1.641.893 2.634 1.067l42.816 10.545-.537 21.742-2.328.624-6.897 1.848 1.146-20.056q.002-.019.003-.037h.005c.061-.536-.274-1.054-.864-1.494-.563-.447-1.399-.831-2.462-1.065l-.003.001-.072-.016-46.587-10.849-.032-.008c-1.18-.39-2.554-.496-3.601-.215l-16.926 4.535c-1.582.424-1.825 1.568-.542 2.555.389.299.859.593 1.407.742l44.453 10.938-.526 19.429c-.021.101.234 2.007-2.662 2.783l-22.831 6.118c-3.105.832-7.644.01-10.253-1.998l-32.227-24.8c-2.271-1.748-2.029-4.233 1.146-5.083l14.204-3.806c1.674-.449 1.938-1.481.58-2.526s-3.556-1.501-5.23-1.053l-14.297 3.879c-6.795 1.82-6.817 6.539-2.199 10.093l32.275 24.837c4.972 3.826 14.615 5.636 20.567 4.042l22.824-6.116c1.151-.309 2.067-.696 2.797-1.118q.156-.091.301-.183c2.32-1.48 2.521-3.296 2.528-3.671l1.19-21.406c.081-.992-1.14-2.073-3.289-2.548l-.003.002-.072-.017-39.385-9.196 7.065-1.893 2.329-.624 41.998 10.256-.496 22.836q0 .01.093.032c.113.304.361.618.75.918 1.283.987 3.605 1.443 5.187 1.02l16.925-4.535c1.048-.281 1.507-.878 1.326-1.536l1.612-23.779.002-.037.005-.001c.123-1.083-1.369-2.092-3.323-2.539'/%3E%3Cpath stroke='%23fff' d='m895.31 228.862-46.416-10.988c-1.172-.381-2.528-.481-3.565-.203-1.582.424-1.825 1.567-.543 2.554.676.52 1.641.893 2.634 1.067l42.816 10.545-.537 21.742-2.328.624-6.897 1.848 1.146-20.056q.002-.019.003-.037h.005c.061-.536-.274-1.054-.864-1.494-.563-.447-1.399-.831-2.462-1.065l-.003.001-.072-.016-46.587-10.849-.032-.008c-1.18-.39-2.554-.496-3.601-.215l-16.926 4.535c-1.582.424-1.825 1.568-.542 2.555.389.299.859.593 1.407.742l44.453 10.938-.526 19.429c-.021.101.234 2.007-2.662 2.783l-22.831 6.118c-3.105.832-7.644.01-10.253-1.998l-32.227-24.8c-2.271-1.748-2.029-4.233 1.146-5.083l14.204-3.806c1.674-.449 1.938-1.481.58-2.526s-3.556-1.501-5.23-1.053l-14.297 3.879c-6.795 1.82-6.817 6.539-2.199 10.093l32.275 24.837c4.972 3.826 14.615 5.636 20.567 4.042l22.824-6.116c1.151-.309 2.067-.696 2.797-1.118q.156-.091.301-.183c2.32-1.48 2.521-3.296 2.528-3.671l1.19-21.406c.081-.992-1.14-2.073-3.289-2.548l-.003.002-.072-.017-39.385-9.196 7.065-1.893 2.329-.624 41.998 10.256-.496 22.836q0 .01.093.032c.113.304.361.618.75.918 1.283.987 3.605 1.443 5.187 1.02l16.925-4.535c1.048-.281 1.507-.878 1.326-1.536l1.612-23.779.002-.037.005-.001c.123-1.083-1.369-2.092-3.323-2.539'/%3E%3Cpath fill='%23fff' fill-opacity='.9' fill-rule='evenodd' d='M418.95 242.813c-1.166.08-3.042-.372-4.121-.994-.702-.405-.941-.755-1.527-2.243-2.373-6.017-6.517-11.028-13.679-16.54-6.921-5.325-13.863-9.053-24.178-12.987-2.215-.844-4.182-1.652-4.368-1.795-.687-.528-.979-1.482-.612-1.986.505-.691 2.349-1.081 3.824-.809.567.103 2.521.743 4.345 1.421 7.215 2.687 13.99 5.937 20.009 9.598 3.723 2.267 9.803 6.823 12.219 9.164 4.462 4.317 7.493 8.422 9.4 12.73 1.153 2.604 1.269 3.77.4 4.003a2.4 2.4 0 0 0-.548.23c-.132.08-.653.173-1.164.208m-16.069-.701c-1.791.122-4.29-.719-4.965-1.671-.163-.23-.697-1.349-1.
360319-2.485-2.083-4.815-6.346-9.43-12.427-13.455-4.994-3.305-8.797-5.218-15.392-7.737-4.424-1.69-4.929-2-5.087-3.117-.146-1.06 1.961-1.804 4.061-1.431 1.457.258 8.467 2.972 11.969 4.634 11.594 5.498 19.993 12.484 23.913 19.889 2.008 3.792 1.779 5.192-.882 5.373m-16.492-.659c-1.224-.015-2.768-.406-3.758-.951-.603-.332-.912-.797-1.614-2.437-2.575-6.024-8.768-10.833-18.898-14.676-4.447-1.688-5.038-2.104-4.718-3.324.158-.605.358-.757 1.34-1.02 1.642-.44 3.175-.146 7.121 1.365 6.068 2.325 10.298 4.621 14.525 7.881 4.345 3.352 6.465 5.882 8.069 9.62.915 2.141.839 2.79-.389 3.282-.375.149-1.131.266-1.678.26m-15.379-.611c-.949.006-2.546-.385-3.476-.851-1.035-.519-1.424-1.045-1.796-2.434-.477-1.786-1.147-2.632-3.558-4.488s-3.719-2.531-6.931-3.584c-1.089-.356-2.302-.809-2.698-1.003-1.658-.818-1.914-2.296-.508-2.936 1.187-.544 2.67-.406 5.617.522 8.533 2.685 14.934 7.611 15.941 12.27.357 1.645-.521 2.495-2.591 2.504'/%3E%3Crect width='110' height='74' fill='url(%23a)' rx='10' transform='matrix(.96593 -.25882 .7925 .60987 199.717 245.906)'/%3E%3Cg stroke='%23000' stroke-opacity='.8' stroke-width='2'%3E%3Cpath d='m233.447 236.868 46.846 36.05c.876.673.72 1.451-.347 1.737l-31.799 8.521M266.657 262.424l-33.731 9.038m17.126-21.816-33.73 9.038m115.215 13.423-46.846-36.05c-.875-.673-.72-1.451.347-1.737l31.799-8.52M298.327 246.551l33.731-9.038m-17.126 21.816 33.731-9.038'/%3E%3Crect width='112' height='76' x='-1.758' y='-.351' rx='11' style='mix-blend-mode:soft-light' transform='matrix(.96593 -.25882 .7925 .60987 199.935 245.314)'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='a' x1='-12.604' x2='99.193' y1='0' y2='88.114' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff'/%3E%3Cstop offset='.484' stop-color='%23b3b3b3'/%3E%3Cstop offset='1' stop-color='%23fff'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E") 0px 0px no-repeat, url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1064' height='466' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Crect width='728' height='455' fill='url(%23b)' rx='24' transform='matrix(.96593 -.25882 .7925 .60987 0 188.42)'/%3E%3Cg fill='%23033783'%3E%3Cpath fill-opacity='.2' d='M638.209-50.009C376.564 99.506 477.408 320.518 560.535 412.335L1063.78 277.49z'/%3E%3Cpath fill-opacity='.4' d='M711.119 6.099C494.132 130.043 577.63 313.21 646.503 389.3l417.277-111.81z'/%3E%3C/g%3E%3Cpath fill='%23003780' d='M791.162 67.695C624.04 163.343 688.839 304.87 742.129 363.677l321.651-86.187z'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='b' x1='72.545' x2='249.224' y1='26.435' y2='498.002' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%233382ea'/%3E%3Cstop offset='1' stop-color='%23003ea9'/%3E%3C/linearGradient%3E%3CclipPath id='a'%3E%3Crect width='728' height='455' fill='%23fff' rx='24' transform='matrix(.96593 -.25882 .7925 .60987 0 188.42)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") 0px 0px no-repeat; opacity: 1; z-index: 3; }
3604.adyen-checkout-ctp__card-animation > .adyen-checkout-ctp__card-animation-layer:nth-of-type(2) { animation: 2.06s linear 50ms infinite normal both running card-bounce, 2.06s linear infinite normal both running card-fade-60; opacity: 0.6; transform: translateY(25%); z-index: 2; }
3605.adyen-checkout-ctp__card-animation > .adyen-checkout-ctp__card-animation-layer:nth-of-type(2), .adyen-checkout-ctp__card-animation > .adyen-checkout-ctp__card-animation-layer:nth-of-type(3) { background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1064' height='466' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Crect width='728' height='455' fill='url(%23b)' rx='24' transform='matrix(.96593 -.25882 .7925 .60987 0 188.42)'/%3E%3Cg fill='%23033783'%3E%3Cpath fill-opacity='.2' d='M638.209-50.009C376.564 99.506 477.408 320.518 560.535 412.335L1063.78 277.49z'/%3E%3Cpath fill-opacity='.4' d='M711.119 6.099C494.132 130.043 577.63 313.21 646.503 389.3l417.277-111.81z'/%3E%3C/g%3E%3Cpath fill='%23003780' d='M791.162 67.695C624.04 163.343 688.839 304.87 742.129 363.677l321.651-86.187z'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='b' x1='72.545' x2='249.224' y1='26.435' y2='498.002' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%233382ea'/%3E%3Cstop offset='1' stop-color='%23003ea9'/%3
3605E%3C/linearGradient%3E%3CclipPath id='a'%3E%3Crect width='728' height='455' fill='%23fff' rx='24' transform='matrix(.96593 -.25882 .7925 .60987 0 188.42)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") 0px 0px no-repeat; }
3606.adyen-checkout-ctp__card-animation > .adyen-checkout-ctp__card-animation-layer:nth-of-type(3) { animation: 2.06s linear 0s infinite normal both running card-bounce, 2.06s linear 0s infinite normal both running card-fade-20; opacity: 0.2; transform: translateY(50%); z-index: 1; }
3607.adyen-checkout-ctp__loading-subtitle { font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin: 0px auto 58px; max-width: 280px; text-align: center; }
3608.adyen-checkout-ctp__section > .adyen-checkout__field.adyen-checkout__field--shopperLogin { margin-bottom: var(--adyen-sdk-spacer-080,20px); }
3609.adyen-checkout__content-separator { align-items: center; color: var(--adyen-sdk-color-label-primary,#00112c); display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); justify-content: center; line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-bottom: var(--adyen-sdk-spacer-070,16px); margin-top: var(--adyen-sdk-spacer-070,16px); text-transform: capitalize; white-space: nowrap; }
3610.adyen-checkout__content-separator::after, .adyen-checkout__content-separator::before { border-bottom: 1px solid var(--adyen-sdk-color-separator-primary,#dbdee2); content: ""; flex: 1 1 0%; }
3611.adyen-checkout__content-separator::after { margin-left: var(--adyen-sdk-spacer-080,20px); }
3612.adyen-checkout__content-separator::before { margin-right: var(--adyen-sdk-spacer-080,20px); }
3613[class^="adyen-checkout"], [class^="adyen-checkout"] *, [class^="adyen-checkout"] ::after, [class^="adyen-checkout"] ::before, [class^="adyen-checkout"]::after, [class^="adyen-checkout"]::before { box-sizing: border-box; }
3614.adyen-checkout__threeds2__challenge { background-color: transparent; display: block; height: inherit; min-height: 400px; overflow: hidden; position: relative; width: 100%; }
3615.adyen-checkout__threeds2__challenge--01, .adyen-checkout__threeds2__challenge--01 .adyen-checkout__iframe--threeDSIframe { height: 400px; width: 250px; }
3616.adyen-checkout__threeds2__challenge--02, .adyen-checkout__threeds2__challenge--02 .adyen-checkout__iframe--threeDSIframe { height: 400px; width: 390px; }
3617.adyen-checkout__threeds2__challenge--03, .adyen-checkout__threeds2__challenge--03 .adyen-checkout__iframe--threeDSIframe { height: 600px; width: 500px; }
3618.adyen-checkout__threeds2__challenge--04, .adyen-checkout__threeds2__challenge--04 .adyen-checkout__iframe--threeDSIframe { height: 400px; width: 600px; }
3619.adyen-checkout__threeds2__challenge--05, .adyen-checkout__threeds2__challenge--05 .adyen-checkout__iframe--threeDSIframe { height: 100%; width: 100%; }
3620.adyen-checkout__iframe--threeDSIframe { border: 0px; left: 0px; position: absolute; top: 0px; }
3621.adyen-checkout__threeds2-challenge-error .adyen-checkout__status__icon { display: block; margin: var(--adyen-sdk-spacer-130,56px) auto var(--adyen-sdk-spacer-100,32px); }
3622.adyen-checkout__threeds2-challenge-error .adyen-checkout__status__text { color: var(--adyen-sdk-color-label-critical,#c72727); font-size: var(--adyen-sdk-text-title-font-size,1rem); margin-bottom: var(--adyen-sdk-spacer-130,56px); text-align: center; }
3623.adyen-checkout__bacs--confirm { position: relative; }
3624.adyen-checkout__bacs--confirm .adyen-checkout-input__inline-validation--valid { display: none; }
3625.adyen-checkout__bacs .adyen-checkout__field--inactive { pointer-events: none; }
3626.adyen-checkout__bacs .adyen-checkout__bacs--edit { cursor: pointer; position: absolute; right: 0px; top: 0px; }
3627.adyen-checkout__bacs .adyen-checkout__bacs--edit-dropin { top: -50px; }
3628.adyen-checkout__bacs .adyen-checkout__bacs--edit .adyen-checkout__bacs--edit-button { background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial;
3628 color: var(--adyen-sdk-color-label-primary,#00112c); cursor: pointer; padding: 0px; text-align: end; text-decoration: underline; }
3629.adyen-checkout__details-table { list-style: none; margin: -1px auto 0px; padding: 0px; }
3630.adyen-checkout__details-table__item { align-items: center; border-top: 1px solid var(--adyen-sdk-color-separator-primary,#dbdee2); color: var(--adyen-sdk-color-label-primary,#00112c); display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); justify-content: space-between; padding: var(--adyen-sdk-spacer-070,16px) var(--adyen-sdk-spacer-090,24px); word-break: break-word; }
3631.adyen-checkout__details-table__item:last-child { margin-bottom: 0px; }
3632.adyen-checkout__details-table__label { font-weight: var(--adyen-sdk-text-body-font-weight,400); text-align: left; }
3633.adyen-checkout__details-table__label, .adyen-checkout__details-table__value { font-size: var(--adyen-sdk-text-body-font-size,.875rem); line-height: var(--adyen-sdk-text-body-line-height,20px); max-width: 50%; }
3634.adyen-checkout__details-table__value { align-items: center; display: flex; font-weight: var(--adyen-sdk-text-body-strongest-font-weight,600); gap: var(--adyen-sdk-spacer-070,16px); text-align: right; }
3635.adyen-checkout-tooltip { background: var(--adyen-sdk-tooltip-background-color,#00112c); border-radius: var(--adyen-sdk-tooltip-border-radius,4px); color: var(--adyen-sdk-tooltip-color,#ffffff); display: inline-block; font-size: var(--adyen-sdk-text-body-font-size,.875rem); padding: var(--adyen-sdk-tooltip-padding,4px 8px); pointer-events: none; position: absolute; user-select: none; white-space: nowrap; z-index: var(--adyen-sdk-tooltip-z-index,5); }
3636.adyen-checkout-tooltip--hidden { height: 1px; margin: -1px; overflow: hidden; padding: 0px; width: 1px; clip: rect(0px, 0px, 0px, 0px); border: 0px; clip-path: inset(50%); white-space: nowrap; }
3637.adyen-checkout-tooltip-arrow { border-style: solid; height: 0px; position: absolute; width: 0px; }
3638.adyen-checkout-tooltip-arrow.adyen-checkout-tooltip-arrow--top { border-color: var(--adyen-sdk-tooltip-background-color,#00112c) transparent transparent; border-width: 6px 6px 0px; bottom: -4px; left: 50%; transform: translate(-50%); }
3639.adyen-checkout-tooltip-arrow.adyen-checkout-tooltip-arrow--bottom { border-color: transparent transparent var(--adyen-sdk-tooltip-background-color,#00112c); border-width: 0px 6px 6px; left: 50%; top: -4px; transform: translate(-50%); }
3640.adyen-checkout__button--iconOnly__icon { fill: currentcolor; transition: fill 0.3s; }
3641.adyen-checkout__voucher-result__bottom, .adyen-checkout__voucher-result__top { background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-separator-primary,#dbdee2); }
3642.adyen-checkout__voucher-result__bottom .adyen-checkout__details-table, .adyen-checkout__voucher-result__top .adyen-checkout__details-table { background: var(--adyen-sdk-color-background-secondary,#f7f7f8); border-radius: var(--adyen-sdk-border-radius-m,8px); margin: 0 var(--adyen-sdk-spacer-090,24px) var(--adyen-sdk-spacer-100,32px); }
3643.adyen-checkout__voucher-result__bottom .adyen-checkout__details-table__item:first-child, .adyen-checkout__voucher-result__top .adyen-checkout__details-table__item:first-child { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; }
3644.adyen-checkout__voucher-result__top { border-bottom: 0px; border-radius: var(--adyen-sdk-border-radius-m,8px) var(--adyen-sdk-border-radius-m,8px) 0 0; padding: var(--adyen-sdk-spacer-110,40px) 0 var(--adyen-sdk-spacer-090,24px); }
3645.adyen-checkout__voucher-result__bottom { border-radius: 0 0 var(--adyen-sdk-border-radius-m,8px) var(--adyen-sdk-border-radius-m,8px); border-top: 0px; }
3646.adyen-checkout__voucher-result__separator { align-items: center; background: var(--adyen-sdk-color-background-primary,#ffffff); display: flex; margin: 0px auto; position: relative; }
3647.adyen-checkout__voucher-result__separator__inner { border-top: 1px solid var(--adyen-sdk-color-separator-primary,#dbdee2); width: 100%; }
3648.adyen-checkout__voucher-result__image { align-items: center; display: flex; justify-content: center; margin-bottom: var(--adyen-sdk-spacer-110,40px); width: 100%; }
3649.adyen-checkout-link--voucher-result-instructions { display: inline-block; }
3650.adyen-checkout__voucher-result__image__wrapper { display: block; height: var(--adyen-sdk-spacer-120,48px); margin: 0 var(--adyen-sdk-spacer-090,24px); position: relative; }
3651.adyen-checkout__voucher-result__image__wrapper::after { border-radius: var(--adyen-sdk-border-radius-m,8px); box-shadow: var(--adyen-sdk-shadow-low,0 2px 4px rgba(0,17,44,.04),0 1px 2px rgba(0,17,44,.02)); content: ""; height: 100%; left: 0px; position: absolute; top: 0px; width: 100%; }
3652.adyen-checkout__voucher-result__image__wrapper:nth-child(2) { margin-left: 0px; }
3653.adyen-checkout__voucher-result__image__brand, .adyen-checkout__voucher-result__image__issuer { border-radius: var(--adyen-sdk-border-radius-m,8px); height: var(--adyen-sdk-spacer-120,48px); }
3654.adyen-checkout__voucher-result__introduction { color: var(--adyen-sdk-color-label-primary,#00112c
3654); font-size: var(--adyen-sdk-text-body-font-size,.875rem); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin: 0px auto; max-width: 400px; text-align: center; }
3655.adyen-checkout__voucher-result__amount { color: var(--adyen-sdk-color-label-primary,#00112c); font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); font-weight: 700; margin: var(--adyen-sdk-spacer-090,24px) auto 0; text-align: center; }
3656.adyen-checkout__voucher-result__surcharge { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); text-align: center; }
3657.adyen-checkout__voucher-result__code__label, .adyen-checkout__voucher-result__surcharge { display: block; font-weight: 400; line-height: var(--adyen-sdk-text-caption-line-height,18px); }
3658.adyen-checkout__voucher-result__code__label { left: 0px; margin: 0px auto; position: absolute; right: 0px; user-select: none; width: auto; }
3659.adyen-checkout__voucher-result__code__label::before { content: ""; position: absolute; }
3660.adyen-checkout__voucher-result__code__label__text { background: var(--adyen-sdk-color-background-primary,#ffffff);
3660 color: var(--adyen-sdk-color-label-primary,#00112c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); letter-spacing: normal; line-height: 1; padding: 0 var(--adyen-sdk-spacer-040,8px); }
3661.adyen-checkout__voucher-result__code__barcode { display: block; height: var(--adyen-sdk-spacer-130,56px); margin: 0 auto var(--adyen-sdk-spacer-040,8px); max-width: 100%; user-select: none; }
3662.adyen-checkout__voucher-result__code { border-width: 1px 0px; color: var(--adyen-sdk-color-label-primary,#00112c); display: inline-block; font-size: var(--adyen-sdk-text-title-l-font-size,1.5rem); font-weight: 700; letter-spacing: 1px; line-height: 1.2; margin: 0px auto; padding: var(--adyen-sdk-spacer-070,16px) var(--adyen-sdk-spacer-120,48px); position: relative; text-align: center; user-select: all; width: 100%; word-break: break-word; }
3663.adyen-checkout__voucher-result__actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-040,8px); justify-content: center; list-style: none; margin: 0 auto var(--adyen-sdk-spacer-100,32px); max-width: 300px; min-width: 200px; padding: 0 var(--adyen-sdk-spacer-090,24px); width: 100%; }
3664.adyen-checkout__voucher-result__actions__item { flex: 1 1 0px; min-width: 100px; }
3665.adyen-checkout__voucher-result__actions__item .adyen-checkout__button--inline { width: 100%; }
3666.adyen-checkout__voucher-result__introduction { font-size: var(--adyen-sdk-text-title-font-size,1rem); max-width: 420px; }
3667.adyen-checkout__alert-message { align-items: center; border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-secondary,#c9cdd3); border-radius: var(--adyen-sdk-border-radius-m,8px); display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-body-line-height,20px); margin: 0 0 var(--adyen-sdk-spacer-070,16px); padding: var(--adyen-sdk-spacer-070,16px); text-align: left; }
3668.adyen-checkout__alert-message--error { background: var(--adyen-sdk-alert-critical-background-color,#fef4f4); }
3669.adyen-checkout__alert-message--warning { background: var(--adyen-sdk-alert-warning-background-color,#fff5e9); }
3670.adyen-checkout__alert-message--info { background: var(--adyen-sdk-alert-highlight-background-color,#f2f8ff); }
3671.adyen-checkout__alert-message--success { background: var(--adyen-sdk-alert-success-background-color,#edfaf3); }
3672.adyen-checkout__alert-message__icon { height: 14px; margin-right: var(--adyen-sdk-spacer-040,8px); width: 14px; }
3673.adyen-checkout__fieldset + .adyen-checkout__eftpad-canada-info { margin-top: var(--adyen-sdk-spacer-070,16px); }
3674.adyen-checkout_eftpad-canada-store-details { margin: var(--adyen-sdk-spacer-070,16px) 0; }
3675.adyen-checkout__field--separateDeliveryAddress .adyen-checkout__input-wrapper { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }
3676.adyen-checkout__field--separateDeliveryAddress .adyen-checkout__input-wrapper:active, .adyen-checkout__field--separateDeliveryAddress .adyen-checkout__input-wrapper:active:hover, .adyen-checkout__field--separateDeliveryAddress .adyen-checkout__input-wrapper:focus-within, .adyen-checkout__field--separateDeliveryAddress .adyen-checkout__input-wrapper:focus-within:hover { box-shadow: none; }
3677.adyen-checkout__open-invoice .adyen-checkout__fieldset--billingAddress, .adyen-checkout__open-invoice .adyen-checkout__fieldset--personalDetails { padding-bottom: var(--adyen-sdk-spacer-040,8px); }
3678.adyen-checkout__open-invoice .adyen-checkout__fieldset--deliveryAddress { margin-top: var(--adyen-sdk-spacer-090,24px); padding-bottom: var(--adyen-sdk-spacer-040,8px); }
3679.adyen-checkout__open-invoice .adyen-checkout__input--separateDeliveryAddress { margin-bottom: 0px; }
3680.adyen-checkout__open-invoice .adyen-checkout__field--consentCheckbox { margin-top: var(--adyen-sdk-spacer-070,16px); }
3681.adyen-checkout__open-invoice--loading { pointer-events: none; }
3682.adyen-checkout__amazonpay__button { margin: auto; }
3683.adyen-checkout__amazonpay .adyen-checkout__button--ghost { display: block; margin: var(--adyen-sdk-spacer-040,8px) auto 0; width: auto; }
3684apple-pay-button { --apple-pay-button-width: 100%; --apple-pay-button-height: 48px; --apple-pay-button-border-radius: 4px; }
3685.adyen-checkout__cashapp > .adyen-checkout__store-details { margin-bottom: var(--adyen-sdk-spacer-070,16px); margin-top: 0px; }
3686.adyen-checkout__paywithgoogle { height: var(--adyen-sdk-spacer-120,48px); }
3687.adyen-checkout__paypal__buttons { position: relative; z-index: 0; }
3688.adyen-checkout__paypal__button { display: flex; margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3689.adyen-checkout__paypal__button:empty { display: none; }
3690.adyen-checkout__paypal__status--pending { margin: var(--adyen-sdk-spacer-070,16px) 0; }
3691.adyen-checkout__paypal__status--processing { align-items: center; display: flex; font-size: var(--adyen-sdk-text-body-font-size,.875rem); justify-content: center; padding: var(--adyen-sdk-spacer-090,24px) 0; }
3692.adyen-checkout__paypal-processing .adyen-checkout__paypal__button { display: none; }
3693.adyen-checkout__payment-method .adyen-checkout__paypal__status--pending { margin: var(--adyen-sdk-spacer-070,16px) 0 38px; }
3694.adyen-checkout__payment-method .adyen-checkout__paypal__status--processing { padding: var(--adyen-sdk-spacer-080,20px) 0 65px; }
3695.adyen-checkout-fastlane__card-brand--wrapper { align-items: center; border-radius: var(--adyen-sdk-border-radius-s,4px); box-shadow: var(--adyen-sdk-shadow-low,0 2px 4px rgba(0,17,44,.04),0 1px 2px rgba(0,17,44,.02)); display: flex;
3695 height: 26px; justify-content: center; margin-right: var(--adyen-sdk-spacer-060,12px); overflow: hidden; position: relative; width: var(--adyen-sdk-spacer-110,40px); }
3696.adyen-checkout-fastlane__card-section { align-items: center; display: flex; }
3697.adyen-checkout-fastlane__card-number { font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); line-height: var(--adyen-sdk-text-body-line-height,20px); }
3698.adyen-checkout-fastlane__brand { display: flex; justify-content: center; margin-top: var(--adyen-sdk-spacer-070,16px); }
3699.adyen-checkout-fastlane__brand img { width: 95px; }
3700.adyen-checkout__field--sendCopyToEmail .adyen-checkout__input-wrapper { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }
3701.adyen-checkout__field--sendCopyToEmail .adyen-checkout__input-wrapper:active, .adyen-checkout__field--sendCopyToEmail .adyen-checkout__input-wrapper:active:hover, .adyen-checkout__field--sendCopyToEmail .adyen-checkout__input-wrapper:focus-within, .adyen-checkout__field--sendCopyToEmail .adyen-checkout__input-wrapper:focus-within:hover { box-shadow: none; }
3702.adyen-checkout__voucher-result--boletobancario .adyen-checkout__voucher-result__code, .adyen-checkout__voucher-result--oxxo .adyen-checkout__voucher-result__code { font-size: var(--adyen-sdk-text-body-font-size,.875rem); line-height: var(--adyen-sdk-text-caption-line-height,18px); padding: var(--adyen-sdk-spacer-090,24px); word-break: break-all; }
3703.adyen-checkout__issuer-button { align-items: center; background-color: var(--adyen-sdk-color-background-primary,#ffffff); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--adyen-sdk-border-radius-m,8px); box-shadow: inset 0 0 0 1px var(--adyen-sdk-color-outline-primary,#dbdee2); cursor: pointer; display: flex; flex-basis: 47%; flex-grow: 2; font-size: var(--adyen-sdk-text-body-font-size,.875rem); height: var(--adyen-sdk-spacer-110,40px); justify-content: space-between; padding: var(--adyen-sdk-spacer-000,0) var(--adyen-sdk-spacer-060,12px); transition: background 0.3s ease-out, box-shadow 0.3s ease-out; }
3704.adyen-checkout__issuer-button:active { color: var(--adyen-sdk-color-label-primary,#00112c
3704); }
3705.adyen-checkout__issuer-button:not(.adyen-checkout__issuer-button--selected):focus { box-shadow: inset 0 0 0 1px var(--adyen-sdk-color-outline-tertiary,#8d95a3); outline: none; }
3706.adyen-checkout__issuer-button:not(.adyen-checkout__issuer-button--selected):focus-visible { box-shadow: inset 0 0 0 1px var(--adyen-sdk-color-outline-tertiary,#8d95a3); outline: none; }
3707.adyen-checkout__issuer-button:not(.adyen-checkout__issuer-button--selected):hover { box-shadow: inset 0 0 0 1px var(--adyen-sdk-color-outline-tertiary,#8d95a3); outline: none; }
3708.adyen-checkout__issuer-button--selected { background: var(--adyen-sdk-color-background-primary,#ffffff); box-shadow: inset 0 0 0 1.5px var(--adyen-sdk-color-outline-primary-active,#00112c); color: var(--adyen-sdk-color-label-primary,#00112c); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); height: var(--adyen-sdk-spacer-110,40px); transition: none; }
3709.adyen-checkout__issuer-button-img { margin-right: var(--adyen-sdk-spacer-040,8px); max-height: 26px; }
3710.adyen-checkout__issuer-button-group { display: flex; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-070,16px); }
3711.adyen-checkout__field--issuer-list { margin-bottom: 0px; }
3712.adyen-checkout__field--issuer-list .adyen-checkout__dropdown { position: static; }
3713.adyen-checkout__field--issuer-list .adyen-checkout__dropdown__button { position: relative; }
3714.adyen-checkout__qr-loader { align-items: center; background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-secondary,#c9cdd3); border-radius: var(--adyen-sdk-border-radius-m,8px); display: flex; flex-direction: column; padding: 16px; }
3715.adyen-checkout__qr-loader--result { gap: var(--adyen-sdk-spacer-090,24px); padding: 100px; }
3716.adyen-checkout__qr-loader__brand-logo-wrapper { border-radius: var(--adyen-sdk-border-radius-s,4px); box-shadow: var(--adyen-sdk-shadow-low,0 2px 4px rgba(0,17,44,.04),0 1px 2px rgba(0,17,44,.02)); margin-bottom: var(--adyen-sdk-spacer-090,24px); overflow: hidden; }
3717.adyen-checkout__qr-loader__brand-logo { display: block; width: 80px; }
3718.adyen-checkout__qr-loader__subtitle { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-body-line-height,20px); max-width: 400px; text-align: center; }
3719.adyen-checkout__qr-loader__icon { height: 88px; width: 88px; }
3720.adyen-checkout__qr-loader__payment_amount { color: var(--adyen-sdk-color-label-primary,#00112c
3720); font-size: var(--adyen-sdk-text-title-l-font-size,1.5rem); font-weight: var(--adyen-sdk-text-title-l-font-weight,600); line-height: var(--adyen-sdk-text-body-wide-line-height,24px); margin-bottom: var(--adyen-sdk-spacer-090,24px); }
3721.adyen-checkout__qr-loader__progress { background: var(--adyen-sdk-color-outline-secondary,#c9cdd3); border-radius: var(--adyen-sdk-border-radius-l,12px); height: var(--adyen-sdk-spacer-020,4px); margin-bottom: var(--adyen-sdk-spacer-060,12px); padding-right: 3%; width: 152px; }
3722[dir="rtl"] .adyen-checkout__qr-loader__progress { padding-left: 3%; padding-right: 0px; }
3723.adyen-checkout__qr-loader__percentage { background: var(--adyen-sdk-color-label-primary,#00112c); border-radius: var(--adyen-sdk-border-radius-l,12px); display: block; height: 100%; }
3724.adyen-checkout__qr-loader__countdown { font-size: var(--adyen-sdk-text-caption-font-size,.75rem); text-align: center; }
3725.adyen-checkout__qr-loader > .adyen-checkout__spinner__wrapper { margin: 60px 0px; }
3726.adyen-checkout__qr-loader__app-link { display: none; }
3727.adyen-checkout__button.adyen-checkout__button--qr-loader { margin-top: var(--adyen-sdk-spacer-090,24px); text-decoration: none; }
3728.adyen-checkout__qr-loader__instructions { color: var(--adyen-sdk-color-label-tertiary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: 1.5; margin-top: var(--adyen-sdk-spacer-090,24px); max-width: 300px; text-align: center; }
3729.adyen-checkout__qr-loader__actions { align-items: center; display: flex; justify-content: center; margin-top: var(--adyen-sdk-spacer-100,32px); max-width: 400px; width: 100%; }
3730@media (max-width: 1024px) {
3731  .adyen-checkout__qr-loader__app-link { display: block; min-width: 220px; }
3732}
3733.adyen-checkout__segmented-control { background: var(--adyen-sdk-color-background-tertiary,#eeeff1); border-radius: var(--adyen-sdk-border-radius-l,12px); display: grid; gap: var(--adyen-sdk-spacer-020,4px); grid-template-columns: repeat(auto-fit,minmax(var(--adyen-sdk-spacer-140,64px),1fr)); padding: var(--adyen-sdk-spacer-030,6px); }
3734.adyen-checkout__segmented-control--disabled { pointer-events: none; }
3735.adyen-checkout__segmented-control--disabled > .adyen-checkout__segmented-control-segment { color: var(--adyen-sdk-color-label-disabled,#8d95a3); }
3736.adyen-checkout__segmented-control-segment { background: transparent; border: 0px; border-radius: var(--adyen-sdk-border-radius-m,8px);
3736 color: var(--adyen-sdk-color-label-primary,#00112c); cursor: pointer; font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); padding: var(--adyen-sdk-spacer-040,8px) var(--adyen-sdk-spacer-060,12px); text-align: center; transition: background 0.3s ease-out; }
3737.adyen-checkout__segmented-control-segment:active, .adyen-checkout__segmented-control-segment:not(.adyen-checkout__segmented-control-segment--selected):hover { background-color: var(--adyen-sdk-color-background-secondary,#f7f7f8); }
3738.adyen-checkout__segmented-control-segment--selected { background: var(--adyen-sdk-color-background-primary,#ffffff); box-shadow: var(--adyen-sdk-shadow-low,0 2px 4px rgba(0,17,44,.04),0 1px 2px rgba(0,17,44,.02)); color: var(--adyen-sdk-color-label-primary,#00112c); }
3739.IrisGenerateQRCode-module_instruction__uDTb- { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-caption-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); }
3740.IrisComponent-module_bankList__fehP- { padding-top: var(--adyen-sdk-spacer-070,16px); }
3741.adyen-checkout-timeline-wrapper { background-color: var(--adyen-sdk-color-background-secondary,#f7f7f8); border-radius: var(--adyen-sdk-border-radius-m,8px); max-width: 300px; padding: var(--adyen-sdk-spacer-070,16px); }
3742.adyen-checkout-timeline { scrollbar-color: var(--adyen-sdk-color-background-quaternary,#c0c5cc) transparent; }
3743.adyen-checkout-timeline__items { all: unset; }
3744.adyen-checkout-timeline-item { scrollbar-color: var(--adyen-sdk-color-background-quaternary,#c0c5cc) transparent; -webkit-font-smoothing: antialiased; list-style-type: none; max-width: 500px; }
3745.adyen-checkout-timeline-item:last-child .adyen-checkout-timeline-item__separator { display: none; }
3746.adyen-checkout-timeline-item:last-child .adyen-checkout-timeline-item__content { padding-bottom: 0px; }
3747.adyen-checkout-timeline-item__row { display: flex; gap: var(--adyen-sdk-spacer-070,16px); }
3748.adyen-checkout-timeline-item__marker { display: flex; flex-flow: column; margin-top: var(--adyen-sdk-spacer-010,2px); max-width: var(--adyen-sdk-spacer-070,16px); width: 100%; }
3749.adyen-checkout-timeline-item__separator { flex-grow: 1; position: relative; }
3750.adyen-checkout-timeline-item__separator::before { background-color: var(--adyen-sdk-color-separator-secondary,#c9cdd3); content: ""; height: 100%; left: 50%; position: absolute; transform: translate(-50%); width: 1px; }
3751.adyen-checkout-timeline-item__content { align-items: flex-start; display: flex; flex-direction: column; flex-grow: 1; padding-bottom: var(--adyen-sdk-spacer-060,12px); }
3752.adyen-checkout-timeline-item__title { color: var(--adyen-sdk-color-label-primary,#00112c
3752); font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); letter-spacing: 0px; line-height: var(--adyen-sdk-text-body-line-height,20px); margin-bottom: var(--adyen-sdk-spacer-010,2px); text-align: left; }
3753.adyen-checkout__econtext-input__field > .adyen-checkout__button--pay:only-child { margin-top: 0px; }
3754.adyen-checkout-trustly { margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3755.adyen-checkout-trustly__descriptor { font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); margin: var(--adyen-sdk-spacer-000,0) var(--adyen-sdk-spacer-000,0) var(--adyen-sdk-spacer-020,4px); }
3756.adyen-checkout-trustly__description-list { font-size: var(--adyen-sdk-text-body-font-size,.875rem); line-height: 1.5; list-style-type: disc; margin: 0px; padding-left: var(--adyen-sdk-spacer-080,20px); }
3757.adyen-checkout-paybybank_AIS_DD { margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3758.adyen-checkout-paybybank_AIS_DD__description-header { color: var(--adyen-sdk-color-label-primary,#00112c
3758); font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); margin: var(--adyen-sdk-spacer-000,0) var(--adyen-sdk-spacer-000,0) var(--adyen-sdk-spacer-020,4px); }
3759.adyen-checkout-paybybank_AIS_DD__description-body { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: 1.5; list-style-type: disc; margin: 0px; }
3760@media (max-width: 330px) {
3761  .adyen-checkout__payment-method--paybybank_AIS_DD .adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper:nth-child(2) { display: none; }
3762}
3763@media (max-width: 360px) {
3764  .adyen-checkout__payment-method--paybybank_AIS_DD .adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper:nth-child(3) { display: none; }
3765}
3766@media (max-width: 390px) {
3767  .adyen-checkout__payment-method--paybybank_AIS_DD .adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper:nth-child(4) { display: none; }
3768}
3769.adyen-checkout__payment-method--paybybank_AIS_DD .adyen-checkout__payment-method__brand-number { text-overflow: clip; white-space: nowrap; }
3770.adyen-checkout__voucher-result--paybybank_pix { background-color: var(--adyen-sdk-color-background-primary,#ffffff); margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3771.adyen-checkout__voucher-result--paybybank_pix .adyen-checkout__voucher-result__top { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; margin: var(--adyen-sdk-spacer-070,16px) var(--adyen-sdk-spacer-000,0); padding: var(--adyen-sdk-spacer-000,0); }
3772.adyen-checkout__voucher-result--paybybank_pix .adyen-checkout__voucher-result__bottom { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
3773.adyen-checkout__voucher-result--paybybank_pix .adyen-checkout__voucher-result__image { margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3774.adyen-checkout__voucher-result--paybybank_pix .adyen-checkout__voucher-result__image__wrapper { width: 8em; }
3775.adyen-checkout__voucher-result--paybybank_pix .adyen-checkout__voucher-result__image__wrapper > img { width: 100%; }
3776.adyen-checkout__voucher-result--paybybank_pix .adyen-checkout__voucher-result__amount { font-size: var(--adyen-sdk-text-title-l-font-size,1.5rem); font-weight: var(--adyen-sdk-text-title-l-font-weight,600); line-height: var(--adyen-sdk-text-title-l-line-height,34px); margin-top: var(--adyen-sdk-spacer-000,0); }
3777.adyen-checkout-await-logo-container { align-items: center; background: var(--adyen-sdk-color-background-secondary,#f7f7f8); border-radius: var(--adyen-sdk-border-radius-m,8px); display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); padding: var(--adyen-sdk-spacer-070,16px) var(--adyen-sdk-spacer-090,24px); width: fit-content; }
3778.adyen-checkout-await-logo-container:has(> :only-child) { background: none; }
3779.adyen-checkout__await { background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-secondary,#c9cdd3); border-radius: var(--adyen-sdk-border-radius-m,8px); padding: var(--adyen-sdk-spacer-110,40px); text-align: center; }
3780.adyen-checkout__await--result { padding: 100px; }
3781.adyen-checkout__await__brand-logo { border-radius: 3px; width: 74px; }
3782.adyen-checkout__await__instructions { display: flex; justify-content: center; }
3783.adyen-checkout__await__indicator-text, .adyen-checkout__await__subtitle { color: var(--adyen-sdk-color-label-primary,#00112c
3783); font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-top: var(--adyen-sdk-spacer-100,32px); }
3784.adyen-checkout__await__indicator-holder .adyen-checkout__await__indicator-text { margin-left: var(--adyen-sdk-spacer-050,10px); margin-top: var(--adyen-sdk-spacer-030,6px); }
3785.adyen-checkout__await__indicator-holder { display: flex; justify-content: center; margin-bottom: var(--adyen-sdk-spacer-080,20px); margin-top: var(--adyen-sdk-spacer-100,32px); }
3786.adyen-checkout__await__subtitle--result { margin-bottom: var(--adyen-sdk-spacer-100,32px); }
3787.adyen-checkout__await__icon { height: 88px; width: 88px; }
3788.adyen-checkout__await__progress { background: var(--adyen-sdk-color-outline-secondary,#c9cdd3); border-radius: var(--adyen-sdk-border-radius-l,12px); height: var(--adyen-sdk-spacer-020,4px); margin: var(--adyen-sdk-spacer-100,32px) auto var(--adyen-sdk-spacer-060,12px); width: 152px; }
3789.adyen-checkout__await__percentage { background: var(--adyen-sdk-color-label-primary,#00112c
3789); border-radius: var(--adyen-sdk-border-radius-l,12px); display: block; height: 100%; }
3790.adyen-checkout__await__countdown { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); }
3791.adyen-checkout__await > .adyen-checkout__spinner__wrapper { margin: 60px 0px; }
3792.adyen-checkout__await__app-link { display: block; margin-top: var(--adyen-sdk-spacer-070,16px); }
3793.adyen-checkout__await__amount { font-size: var(--adyen-sdk-text-title-l-font-size,1.5rem); font-weight: var(--adyen-sdk-text-title-font-weight,600); margin-top: var(--adyen-sdk-spacer-070,16px); text-align: center; }
3794@media (min-width: 1280px) {
3795  .adyen-checkout__await__app-link { display: none; }
3796}
3797.adyen-checkout-pay-by-bank-pix-await { align-items: center; display: flex; flex-direction: column; }
3798.adyen-checkout-pay-by-bank-pix-await .adyen-checkout__await__countdown-holder, .adyen-checkout-pay-by-bank-pix-await .adyen-checkout__await__subtitle { display: none; }
3799.adyen-checkout-pay-by-bank-pix-await .adyen-checkout__await, .adyen-checkout-pay-by-bank-pix-await .adyen-checkout__await--paybybank_pix { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; }
3800.adyen-checkout-pay-by-bank-pix-await .adyen-checkout__await__indicator-holder { margin-top: var(--adyen-sdk-spacer-090,24px); }
3801.adyen-checkout-pay-by-bank-pix-await .adyen-checkout__await__countdown { color: var(--adyen-sdk-color-label-primary,#00112c
3801); }
3802.adyen-checkout-pay-by-bank-pix-await .adyen-checkout__await__end-slot { color: var(--adyen-sdk-color-label-tertiary,#5c687c); font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-caption-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin-top: var(--adyen-sdk-spacer-090,24px); }
3803.adyen-checkout-issuer-list-introduction-logo-container { border-radius: var(--adyen-sdk-border-radius-m,8px); padding: var(--adyen-sdk-spacer-070,16px) var(--adyen-sdk-spacer-070,16px) 0; text-align: center; }
3804.adyen-checkout-issuer-list-introduction-logo-container__title { font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-caption-stronger-font-weight,500); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin: 0px; }
3805.adyen-checkout-issuer-list-introduction-logo-container__logo { height: auto; width: 8em; }
3806.adyen-checkout-pix-enrollment-issuer-list { display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); }
3807.adyen-checkout-pix-enrollment-issuer-list .adyen-checkout-disclaimer__label { color: var(--adyen-sdk-color-label-secondary,#5c687c); display: inline-block; font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-caption-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin: 0px; }
3808.adyen-checkout-await-logo-open-finance { height: auto; width: 8em; }
3809.adyen-checkout-await-logo-arrow-down { height: auto; width: 1em; }
3810.adyen-checkout-await-logo-bank { height: auto; width: 3em; }
3811.adyen-checkout__klarna-widget { pointer-events: all; }
3812.adyen-checkout__qr-loader--pix { padding-bottom: var(--adyen-sdk-spacer-110,40px); }
3813.adyen-checkout__qr-loader--pix__qr_details { align-items: center; display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); max-width: 318px; width: 100%; }
3814.adyen-checkout__qr-loader--pix__qr_details__timer { align-items: center; display: flex; flex-direction: column; margin-bottom: var(--adyen-sdk-spacer-040,8px); }
3815.adyen-checkout__qr-loader--pix__qr_details__code { font-size: var(--adyen-sdk-text-body-font-size,.875rem); text-align: center; }
3816.adyen-checkout__qr-loader--swish > .adyen-checkout__qr-loader__instructions { text-align: center; }
3817.adyen-checkout-paynow__introduction, .adyen-checkout-paynow__instructions { color: var(--adyen-sdk-color-label-primary,#00112c
3817); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); line-height: var(--adyen-sdk-text-body-line-height,20px); text-align: center; }
3818.adyen-checkout-paynow__instructions > p { margin-bottom: 0px; }
3819.adyen-checkout__blik__helper { color: var(--adyen-sdk-color-label-primary,#00112c); font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); font-weight: 400; margin: 0 0 var(--adyen-sdk-spacer-070,16px); padding: 0px; }
3820.adyen-checkout__loading-input__form { transition: opacity 0.25s ease-out; }
3821.adyen-checkout__fieldset--phone-input { direction: ltr; }
3822.adyen-checkout__fieldset--phone-input .adyen-checkout__fieldset__fields { gap: var(--adyen-sdk-spacer-070,16px); }
3823.adyen-checkout__fieldset--phone-input .adyen-checkout__fieldset__fields > .adyen-checkout__field { margin-bottom: 0px; }
3824.adyen-checkout-field--phone-prefix { width: 144px; }
3825.adyen-checkout-field--phone-number { flex: 1 1 0%; }
3826.adyen-checkout__payment-method__header__title { align-items: center; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial;
3826 color: var(--adyen-sdk-color-label-primary,#00112c); cursor: pointer; display: flex; flex: 1 1 0%; font-size: 1em; font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); gap: var(--adyen-sdk-spacer-060,12px); max-height: 38px; max-width: 100%; padding: 0px; }
3827[dir="rtl"] .adyen-checkout__payment-method__header__title { margin-left: var(--adyen-sdk-spacer-070,16px); margin-right: var(--adyen-sdk-spacer-000,0); }
3828.adyen-checkout__payment-method__header__title--standalone { cursor: default; }
3829.adyen-checkout__payment-method__radio { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-secondary,#c9cdd3); border-radius: 50%; height: var(--adyen-sdk-spacer-070,16px); left: var(--adyen-sdk-spacer-070,16px); transition: border-color 0.2s ease-out, box-shadow 0.2s ease-out; width: var(--adyen-sdk-spacer-070,16px); }
3830[dir="rtl"] .adyen-checkout__payment-method__radio { left: auto; right: var(--adyen-sdk-spacer-070,16px); }
3831.adyen-checkout__payment-method__radio::after { background-color: var(--adyen-sdk-color-background-primary,#ffffff); border-radius: 50%; content: ""; display: block; height: var(--adyen-sdk-spacer-040,8px); left: 0px; margin: 0px auto; position: relative; right: 0px; top: 50%; transform: translateY(-50%) scale(0); transition: transform 0.3s ease-out; width: var(--adyen-sdk-spacer-040,8px); }
3832.adyen-checkout__payment-method__radio--selected { background-color: var(--adyen-sdk-color-label-primary,#00112c
3832); border: 0px; transition: 0.3s ease-out; }
3833.adyen-checkout__payment-method__radio--selected:hover { box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-primary-hover,#c9cdd3); }
3834.adyen-checkout__payment-method__radio--selected::after { transform: translateY(-50%) scale(1); }
3835.adyen-checkout-upi-app-item { align-items: center; background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-m,8px); cursor: pointer; display: flex; gap: var(--adyen-sdk-spacer-070,16px); justify-content: space-between; padding: var(--adyen-sdk-spacer-050,10px) var(--adyen-sdk-spacer-070,16px); transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s, border-radius 0.15s; width: 100%; }
3836.adyen-checkout-upi-app-item__label { cursor: pointer; font-size: var(--adyen-sdk-text-body-font-size,.875rem); }
3837.adyen-checkout-upi-app-item:hover:not(.adyen-checkout-upi-app-item--selected) { border-color: var(--adyen-sdk-color-outline-primary-hover,#c9cdd3); }
3838.adyen-checkout-upi-app-item--selected { border-color: var(--adyen-sdk-color-outline-primary-active,#00112c); box-shadow: 0 0 0 .5px var(--adyen-sdk-color-outline-primary-active,#00112c); cursor: default; }
3839.adyen-checkout-upi-app-item--selected .adyen-checkout-expand-button--upi-app-item, .adyen-checkout-upi-app-item--selected .adyen-checkout-expand-button--upi-app-item > label { cursor: default; }
3840.adyen-checkout-upi-app-item .adyen-checkout-expand-button--upi-app-item { margin-right: 0px; }
3841.adyen-checkout-upi-app-item__checkmark { border-bottom: 1.5px solid var(--adyen-sdk-color-label-primary,#00112c
3841); border-right: 1.5px solid var(--adyen-sdk-color-label-primary,#00112c); height: var(--adyen-sdk-spacer-060,12px); transform: rotate(45deg); width: var(--adyen-sdk-spacer-030,6px); }
3842.adyen-checkout-upi-app-list { display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); list-style: none; margin: 0px; padding: 0px; }
3843.adyen-checkout-upi-app-list--loading { pointer-events: none; user-select: none; }
3844.adyen-checkout-upi-area-intent .adyen-checkout__alert-message--info, .adyen-checkout-upi-area-intent .adyen-checkout__button--pay { margin-top: var(--adyen-sdk-spacer-070,16px); }
3845.adyen-checkout-upi-area-qr-code .adyen-checkout__button--pay, .adyen-checkout-upi-instruction-label { margin-top: var(--adyen-sdk-spacer-000,0); }
3846.adyen-checkout-upi-instruction-label { color: var(--adyen-sdk-color-label-secondary,#5c687c); display: flex; font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-caption-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); }
3847.adyen-checkout-upi-brands, .adyen-checkout-upi-instruction-label { margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3848.adyen-checkout__payto-component .adyen-checkout__fieldset, .adyen-checkout__payto-component .adyen-checkout__fieldset .adyen-checkout__fieldset__fields { margin-top: var(--adyen-sdk-spacer-070,16px); }
3849.adyen-checkout__payto-component .adyen-checkout-field--phone-prefix { width: 98px; }
3850.adyen-checkout__payto-component--loading { pointer-events: none; }
3851.adyen-checkout__await--payto .adyen-checkout__details-table { margin-top: var(--adyen-sdk-spacer-070,16px); padding-top: var(--adyen-sdk-spacer-060,12px); }
3852.adyen-checkout__await--payto .adyen-checkout__details-table__item:first-child { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; }
3853.adyen-checkout__giftcard-result__balance { list-style: none; margin: var(--adyen-sdk-spacer-070,16px) 0 0; padding: 0px; }
3854.adyen-checkout__giftcard-result__balance__item { display: flex; justify-content: space-between; margin-bottom: var(--adyen-sdk-spacer-040,8px); }
3855.adyen-checkout__giftcard-result__balance__item .adyen-checkout__giftcard-result__balance__title--transactionLimit { color: var(--adyen-sdk-color-label-secondary,#5c687c); }
3856.adyen-checkout__giftcard-result__balance__item:last-child { margin-bottom: 0px; }
3857.adyen-checkout__giftcard-result__balance__value--amount { font-weight: 700; }
3858.adyen-checkout__giftcard-result__remaining-balance { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); line-height: var(--adyen-sdk-text-caption-line-height,18px); margin: var(--adyen-sdk-spacer-040,8px) auto 0; text-align: center; }
3859.adyen-checkout__voucher-result { border-radius: var(--adyen-sdk-border-radius-m,8px); position: relative; text-align: center; }
3860.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result-title { font-size: var(--adyen-sdk-text-title-font-size,1rem); font-weight: var(--adyen-sdk-text-title-font-weight,600); line-height: var(--adyen-sdk-text-title-line-height,26px); margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3861.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__bottom, .adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__top { background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-separator-primary,#dbdee2); display: flex; flex-direction: column; }
3862.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__bottom .adyen-checkout__details-table, .adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__top .adyen-checkout__details-table { background: var(--adyen-sdk-color-background-secondary,#f7f7f8); border-radius: var(--adyen-sdk-border-radius-m,8px); margin: 0px; }
3863.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__bottom .adyen-checkout__details-table__item:first-child, .adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__top .adyen-checkout__details-table__item:first-child { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; }
3864.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__top { align-items: center; border-bottom: 0px; border-radius: var(--adyen-sdk-border-radius-m,8px) var(--adyen-sdk-border-radius-m,8px) 0 0; padding: var(--adyen-sdk-spacer-100,32px) var(--adyen-sdk-spacer-090,24px) var(--adyen-sdk-spacer-090,24px); }
3865.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__bottom { border-radius: 0 0 var(--adyen-sdk-border-radius-m,8px) var(--adyen-sdk-border-radius-m,8px); border-top: 0px; padding: 0 var(--adyen-sdk-spacer-090,24px) var(--adyen-sdk-spacer-100,32px); }
3866.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__image { align-items: center; display: flex; justify-content: center; margin-bottom: var(--adyen-sdk-spacer-090,24px); width: 100%; }
3867.adyen-checkout__voucher-result--bankTransfer .adyen-checkout-link--voucher-result-instructions { display: inline-block; }
3868.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__image__wrapper { display: block; height: var(--adyen-sdk-spacer-120,48px); position: relative; }
3869.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__image__wrapper::after { border-radius: var(--adyen-sdk-border-radius-m,8px); box-shadow: var(--adyen-sdk-shadow-low,0 2px 4px rgba(0,17,44,.04),0 1px 2px rgba(0,17,44,.02)); content: ""; height: 100%; left: 0px; position: absolute; top: 0px; width: 100%; }
3870.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__image__wrapper:nth-child(2) { margin-left: 0px; }
3871.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__image__brand, .adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__image__issuer { border-radius: var(--adyen-sdk-border-radius-m,8px); height: var(--adyen-sdk-spacer-120,48px); }
3872.adyen-checkout__voucher-result--bankTransfer .adyen-checkout__voucher-result__amount { font-size: var(--adyen-sdk-text-title-l-font-size,1.5rem);
3872 font-weight: var(--adyen-sdk-text-title-l-font-weight,600); line-height: var(--adyen-sdk-text-title-l-line-height,34px); margin: 0 auto var(--adyen-sdk-spacer-090,24px); }
3873.adyen-checkout__bankTransfer__introduction { color: var(--adyen-sdk-color-label-primary,#00112c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); margin: 0 0 var(--adyen-sdk-spacer-070,16px); padding: 0px; }
3874.adyen-checkout__bankTransfer__emailField { margin: 0 0 var(--adyen-sdk-spacer-070,16px); }
3875.adyen-checkout__adyen-giving .adyen-checkout__status__icon { display: block; margin: var(--adyen-sdk-spacer-130,56px) auto var(--adyen-sdk-spacer-100,32px); }
3876.adyen-checkout__adyen-giving .adyen-checkout__status__text { color: var(--adyen-sdk-color-label-primary,#00112c); margin-bottom: var(--adyen-sdk-spacer-130,56px); text-align: center; }
3877.adyen-checkout__adyen-giving .adyen-checkout-disclaimer__label { color: var(--adyen-sdk-color-label-primary,#00112c); margin-top: 0px; }
3878.adyen-checkout__campaign { position: relative; }
3879.adyen-checkout__campaign-link:hover .adyen-checkout__campaign-description { text-decoration: underline; }
3880.adyen-checkout__campaign-logo { border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-s,4px); display: block; flex-shrink: 0; height: var(--adyen-sdk-spacer-120,48px); object-fit: cover; object-position: center center; overflow: hidden; width: var(--adyen-sdk-spacer-120,48px); }
3881.adyen-checkout__campaign-background-image { aspect-ratio: 5 / 2;
3881 background-color: var(--adyen-sdk-color-label-primary,#00112c); background-position: 50% center; background-size: 100%; border-radius: var(--adyen-sdk-border-radius-m,8px); margin-bottom: var(--adyen-sdk-spacer-060,12px); overflow: hidden; transition: background-size 0.6s ease-out; }
3882.adyen-checkout__campaign-background-image:hover { background-size: 110%; }
3883.adyen-checkout__campaign-link { text-decoration: none; }
3884.adyen-checkout__campaign-link:hover { text-decoration: underline; }
3885.adyen-checkout__campaign-content { align-items: flex-start; display: flex; gap: var(--adyen-sdk-spacer-060,12px); }
3886.adyen-checkout__campaign-description, .adyen-checkout__campaign-title { color: var(--adyen-sdk-color-label-primary,#00112c); margin: 0px; }
3887.adyen-checkout__campaign-title { font-size: var(--adyen-sdk-text-title-font-size,1rem); font-weight: var(--adyen-sdk-text-title-font-weight,600); line-height: var(--adyen-sdk-text-title-line-height,26px); }
3888.adyen-checkout__campaign-cause { font-weight: var(--adyen-sdk-text-caption-stronger-font-weight,500); }
3889.adyen-checkout__campaign-cause, .adyen-checkout__campaign-description { font-size: var(--adyen-sdk-text-caption-font-size,.75rem); line-height: var(--adyen-sdk-text-caption-line-height,18px); }
3890.adyen-checkout__campaign-description { font-weight: var(--adyen-sdk-text-caption-font-weight,400); margin-top: var(--adyen-sdk-spacer-060,12px); }
3891.adyen-checkout-roundup-description { color: var(--adyen-sdk-color-label-secondary,#5c687c); display: inline-block; font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-caption-font-weight,400); line-height: var(--adyen-sdk-text-caption-line-height,18px); padding-left: 0px; }
3892.adyen-checkout__adyen-giving-actions { display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); margin-top: var(--adyen-sdk-spacer-070,16px); text-align: center; }
3893.adyen-checkout__button.adyen-checkout__button--donate { margin: var(--adyen-sdk-spacer-000,0); }
3894.adyen-checkout__button.adyen-checkout__button--decline { display: block; margin: auto; }
3895.adyen-checkout__button-group { background: transparent; display: flex; justify-content: space-between; }
3896.adyen-checkout__button-group .adyen-checkout__button { background: transparent; border: 0px; box-shadow: inset 0 0 0 1px var(--adyen-sdk-color-outline-primary,#dbdee2);
3896 color: var(--adyen-sdk-color-label-primary,#00112c); font-size: var(--adyen-sdk-text-body-font-size,.875rem); font-weight: 400; height: var(--adyen-sdk-spacer-110,40px); line-height: var(--adyen-sdk-spacer-110,40px); margin-right: var(--adyen-sdk-spacer-040,8px); padding: 0px; text-align: center; }
3897.adyen-checkout__button-group .adyen-checkout__button:last-child { margin-right: 0px; }
3898.adyen-checkout__button-group .adyen-checkout__button:hover { background: transparent; box-shadow: inset 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-primary-hover,#c9cdd3); }
3899.adyen-checkout__button-group .adyen-checkout__button:active { background: var(--adyen-sdk-color-background-secondary,#f7f7f8); box-shadow: inset 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-tertiary,#8d95a3); }
3900.adyen-checkout__button-group .adyen-checkout__button--disabled, .adyen-checkout__button-group .adyen-checkout__button--disabled:hover { cursor: not-allowed; opacity: 0.4; user-select: none; }
3901.adyen-checkout__button-group .adyen-checkout__button--selected, .adyen-checkout__button-group .adyen-checkout__button--selected:active, .adyen-checkout__button-group .adyen-checkout__button--selected:active:hover, .adyen-checkout__button-group .adyen-checkout__button--selected:hover { background: var(--adyen-sdk-color-background-secondary,#f7f7f8); box-shadow: inset 0 0 0 1px var(--adyen-sdk-color-label-primary,#00112c
3901); color: var(--adyen-sdk-color-label-primary,#00112c); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); height: var(--adyen-sdk-spacer-110,40px); transition: none; }
3902.adyen-checkout__button-group .adyen-checkout__button .adyen-checkout__button-group__input { opacity: 0; pointer-events: none; position: absolute; }
3903.adyen-checkout__order-payment-methods-list { list-style: none; margin: 0 auto var(--adyen-sdk-spacer-070,16px); padding: 0px; }
3904.adyen-checkout__order-payment-method { background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-tertiary,#8d95a3); margin-top: -1px; position: relative; width: 100%; }
3905.adyen-checkout__order-payment-method:first-child { border-top-left-radius: var(--adyen-sdk-border-radius-m,8px); border-top-right-radius: var(--adyen-sdk-border-radius-m,8px); }
3906.adyen-checkout__order-payment-method:last-child { border-bottom-left-radius: var(--adyen-sdk-border-radius-m,8px); border-bottom-right-radius: var(--adyen-sdk-border-radius-m,8px); }
3907.adyen-checkout__order-payment-method__header { align-items: center;
3907 color: var(--adyen-sdk-color-label-primary,#00112c); display: flex; flex-wrap: nowrap; font-size: var(--adyen-sdk-text-title-font-size,1rem); font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); justify-content: space-between; padding: var(--adyen-sdk-spacer-070,16px); position: relative; transition: background 0.1s ease-out; width: 100%; }
3908.adyen-checkout__order-payment-method__header .adyen-checkout__payment-method__header__title { padding: var(--adyen-sdk-spacer-000,0); }
3909.adyen-checkout__order-payment-method__details { padding: 0 var(--adyen-sdk-spacer-070,16px) var(--adyen-sdk-spacer-070,16px); }
3910.adyen-checkout__order-payment-method__deducted-amount { display: flex; font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); justify-content: space-between; line-height: var(--adyen-sdk-text-subtitle-font-size,1rem); }
3911.adyen-checkout__order-payment-method__deducted-amount__label { font-size: var(--adyen-sdk-text-body-font-size,.875rem); }
3912.adyen-checkout__order-payment-method__deducted-amount__value { font-weight: var(--adyen-sdk-text-body-stronger-font-weight,500); }
3913.adyen-checkout__order-remaining-amount { border-radius: var(--adyen-sdk-border-radius-m,8px); color: var(--adyen-sdk-color-label-secondary,#5c687c); display: block; font-size: var(--adyen-sdk-text-body-font-size,.875rem); padding: var(--adyen-sdk-spacer-040,8px) var(--adyen-sdk-spacer-070,16px); width: 100%; }
3914.adyen-checkout__order-remaining-amount strong { font-weight: 700; }
3915.adyen-checkout__dropin--loading .adyen-checkout__instant-payment-methods-list { opacity: 0.2; pointer-events: none; user-select: none; }
3916.adyen-checkout__payment-method__disable-confirmation { background: var(--adyen-sdk-color-background-critical-strong,#e22d2d); border-left: 1px solid rgb(225, 36, 36); border-right: 1px solid rgb(225, 36, 36); color: var(--adyen-sdk-color-label-on-color,#ffffff); display: grid; font-size: var(--adyen-sdk-text-body-font-size,.875rem); grid-template-rows: 0fr; margin: 0px -17px; opacity: 0; overflow: hidden; transition: grid-template-rows var(--adyen-sdk-animation-duration-moderate,.15s) var(--adyen-sdk-animation-easing-linear,linear),opacity var(--adyen-sdk-animation-duration-moderate,.15s) var(--adyen-sdk-animation-easing-standard,cubic-bezier(.2,0,.4,.9)),margin-bottom var(--adyen-sdk-animation-duration-fast,.1s) var(--adyen-sdk-animation-easing-linear,linear); }
3917.adyen-checkout__payment-method__disable-confirmation__content { align-items: center; display: flex; justify-content: space-between; min-height: 0px; transition: visibility var(--adyen-sdk-animation-duration-moderate,.15s) var(--adyen-sdk-animation-easing-linear,linear),padding var(--adyen-sdk-animation-duration-fast,.1s) var(--adyen-sdk-animation-easing-linear,linear); visibility: hidden; }
3918.adyen-checkout__payment-method__disable-confirmation--open { grid-template-rows: 1fr; margin-bottom: var(--adyen-sdk-spacer-070,16px); opacity: 1; }
3919.adyen-checkout__payment-method__disable-confirmation--open .adyen-checkout__payment-method__disable-confirmation__content { padding: var(--adyen-sdk-spacer-040,8px) var(--adyen-sdk-spacer-070,16px); visibility: visible; }
3920.adyen-checkout__payment-method__disable-confirmation__buttons { display: flex; }
3921.adyen-checkout__payment-method__disable-confirmation__button { background: var(--adyen-sdk-color-background-critical-strong,#e22d2d); border: var(--adyen-sdk-border-width-s,1px) solid transparent; border-radius: var(--adyen-sdk-border-radius-m,8px); color: var(--adyen-sdk-color-label-on-color,#ffffff); cursor: pointer; display: block; font-size: var(--adyen-sdk-text-body-font-size,.875rem); height: auto; margin: 0 0 0 var(--adyen-sdk-spacer-040,8px); padding: var(--adyen-sdk-spacer-040,8px); width: auto; }
3922.adyen-checkout__payment-method__disable-confirmation__button:hover, .adyen-checkout__payment-method__disable-confirmation__button:hover:focus { background: rgb(216, 30, 30); box-shadow: none; }
3923.adyen-checkout__payment-method__disable-confirmation__button:active, .adyen-checkout__payment-method__disable-confirmation__button:hover:active { background: rgb(193, 27, 27); box-shadow: none; }
3924.adyen-checkout__payment-method__disable-confirmation__button--remove, .adyen-checkout__payment-method__disable-confirmation__button--remove:disabled { border-color: var(--adyen-sdk-color-label-on-color,#ffffff); }
3925.adyen-checkout__payment-method__disable-confirmation__button--cancel, .adyen-checkout__payment-method__disable-confirmation__button--cancel:disabled { border-color: transparent; }
3926.adyen-checkout__payment-method__name { display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; }
3927.adyen-checkout__payment-method__additional-info { color: var(--adyen-sdk-color-label-secondary,#5c687c); font-size: var(--adyen-sdk-text-caption-font-size,.75rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); }
3928.adyen-checkout__payment-method__name_wrapper { align-items: flex-start; display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-020,4px); min-width: var(--adyen-sdk-spacer-120,48px); text-align: start; }
3929.adyen-checkout__payment-method { background: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-primary,#dbdee2); border-radius: var(--adyen-sdk-border-radius-m,8px); cursor: pointer; position: relative; transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s, border-radius 0.15s; width: 100%; }
3930.adyen-checkout__payment-method:focus { outline: 0px; }
3931.adyen-checkout__payment-method:hover:not(.adyen-checkout__payment-method--selected) { border-color: var(--adyen-sdk-color-outline-primary-hover,#c9cdd3); }
3932.adyen-checkout__payment-method--loading { opacity: 0.2; }
3933.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading { opacity: 0.9; }
3934.adyen-checkout__payment-method--confirming .adyen-checkout__payment-method__details__content, .adyen-checkout__payment-method--disabling { pointer-events: none; user-select: none; }
3935.adyen-checkout__payment-method--disabling { opacity: 0.3; }
3936.adyen-checkout__payment-method--standalone .adyen-checkout__payment-method__radio { display: none; }
3937.adyen-checkout__payment-method__header { color: var(--adyen-sdk-color-label-primary,#00112c); display: flex; flex-wrap: nowrap; font-size: var(--adyen-sdk-text-title-font-size,1rem); font-weight: var(--adyen-sdk-text-body-font-weight,400); justify-content: space-between; padding: var(--adyen-sdk-spacer-070,16px); position: relative; transition: background 0.1s ease-out; width: 100%; }
3938[dir="rtl"] .adyen-checkout__payment-method__header { padding-top: ; padding-bottom: ; padding-left: ; padding-right: calc(var(--adyen-sdk-spacer-120, 48px) - var(--adyen-sdk-spacer-020, 4px)); }
3939.adyen-checkout__payment-method__header .adyen-checkout__payment-method__header__content { max-height: fit-content; }
3940@media (min-width: 427.5px) {
3941  .adyen-checkout__payment-method__header .adyen-checkout__payment-method__header__content { align-items: center; }
3942}
3943.adyen-checkout__payment-method__header .adyen-checkout__payment-method__header__details { display: flex; flex: 1 1 0%; flex-direction: column; gap: var(--adyen-sdk-spacer-040,8px); justify-content: space-between; overflow: hidden; }
3944@media (min-width: 427.5px) {
3945  .adyen-checkout__payment-method__header .adyen-checkout__payment-method__header__details { align-items: center; flex-direction: row; }
3946}
3947.adyen-checkout__payment-method--standalone .adyen-checkout__payment-method__header { padding: var(--adyen-sdk-spacer-070,16px); }
3948.adyen-checkout__payment-method__surcharge { color: var(--adyen-sdk-color-label-secondary,#5c687c); margin-left: var(--adyen-sdk-spacer-020,4px); }
3949.adyen-checkout__payment-method--selected { background: var(--adyen-sdk-color-background-secondary,#f7f7f8); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-secondary,#c9cdd3); cursor: default; transition: opacity 0.3s ease-out; }
3950.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__header { flex-wrap: wrap; }
3951.adyen-checkout__payment-method__details { padding: var(--adyen-sdk-spacer-000,0) var(--adyen-sdk-spacer-070,16px); position: relative; }
3952.adyen-checkout__payment-method__details__content > :last-child { margin-bottom: var(--adyen-sdk-spacer-070,16px); }
3953.adyen-checkout__payment-method__image__wrapper { align-items: center; border-radius: var(--adyen-sdk-border-radius-s,4px); display: flex; height: 26px; justify-content: center; overflow: hidden; position: relative; width: var(--adyen-sdk-spacer-110,40px); }
3954.adyen-checkout__payment-method__image { border-radius: var(--adyen-checkout-border-radius-s); display: block; flex-shrink: 0; height: 100%; overflow: hidden; width: 100%; }
3955.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__brands { height: auto; overflow: visible; text-align: left; }
3956.adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper { display: inline-block; height: var(--adyen-sdk-spacer-070,16px); transition: opacity 0.2s ease-out; width: var(--adyen-sdk-spacer-090,24px); }
3957.adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper:last-child { margin: var(--adyen-sdk-spacer-000,0); }
3958.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__brands .adyen-checkout__payment-method__image__wrapper { margin-bottom: var(--adyen-sdk-spacer-020,4px); }
3959.adyen-checkout__payment-method__brands img { height: 100%; width: 100%; }
3960.adyen-checkout__payment-method:hover:not(.adyen-checkout__payment-method--selected) .adyen-checkout__payment-method__radio { box-shadow: 0 0 0 var(--adyen-sdk-spacer-010,2px) var(--adyen-sdk-color-outline-primary-hover,#c9cdd3); cursor: pointer; }
3961.adyen-checkout__status { align-items: center; background-color: var(--adyen-sdk-color-background-primary,#ffffff); border: var(--adyen-sdk-border-width-s,1px) solid var(--adyen-sdk-color-outline-secondary,#c9cdd3); border-radius: var(--adyen-sdk-border-radius-m,8px);
3961 color: var(--adyen-sdk-color-label-primary,#00112c); display: flex; flex-direction: column; font-size: var(--adyen-sdk-text-title-font-size,1rem); height: 350px; justify-content: center; margin: 0px; padding: var(--adyen-sdk-spacer-100,32px); text-align: center; }
3962.adyen-checkout__status__icon { margin-bottom: var(--adyen-sdk-spacer-090,24px); }
3963.adyen-checkout__status .adyen-checkout__spinner__wrapper { max-height: 88px; }
3964.adyen-checkout__dropin { display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); }
3965.adyen-checkout__button--dropin-show-paymentmethods { align-self: start; }
3966.adyen-checkout-payment-methods-container { display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); }
3967.adyen-checkout-payment-methods-list-label { color: var(--adyen-sdk-color-label-primary,#00112c); font-size: var(--adyen-sdk-text-subtitle-font-size,1rem); font-weight: var(--adyen-sdk-text-subtitle-stronger-font-weight,600); line-height: var(--adyen-sdk-text-subtitle-line-height,26px); }
3968.adyen-checkout__payment-methods-list { display: flex; flex-direction: column; gap: var(--adyen-sdk-spacer-070,16px); list-style: none; margin: 0px; padding: 0px; }
3969.adyen-checkout__payment-methods-list--loading { pointer-events: none; user-select: none; }
3970.adyen-checkout__instant-payment-methods-list { display: flex; flex-wrap: wrap; gap: var(--adyen-sdk-spacer-070,16px); list-style: none; margin: 0px; padding: 0px; }
3971.adyen-checkout__instant-payment-methods-list li { flex: 1 0 calc(50% - var(--adyen-sdk-spacer-070, 16px)/2); }
3972.adyen-checkout__payment-method { display: block; }
3973.adyen-checkout__payment-method__details { overflow: hidden; }
3974.adyen-checkout__payment-method__image { height: 26px; width: var(--adyen-sdk-spacer-110,40px); }
3975[dir="rtl"] .adyen-checkout__payment-method__image__wrapper { margin-left: var(--adyen-sdk-spacer-040,8px); margin-right: 0px; }
3976.adyen-checkout-pm-details-wrapper { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.25s; visibility: hidden; }
3977.adyen-checkout-pm-details-wrapper[aria-hidden="false"] { grid-template-rows: 1fr; visibility: visible; }
3978.adyen-checkout-pm-details-wrapper[aria-hidden="false"] .adyen-checkout__payment-method__details { overflow: visible; }
3979.adyen-checkout-sr-panel { font-size: 0.75em; margin-bottom: var(--adyen-sdk-spacer-080,20px); }
3980.adyen-checkout-sr-panel--sr-only { border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; }
3981apple-pay-button { --apple-pay-button-box-sizing: border-box !important; --apple-pay-button-border-radius: 24px !important; --apple-pay-button-height: 40px !important; --apple-pay-button-padding: 4px !important; --apple-pay-button-width: 100% !important; }
3982:root { --google-pay-button-color: black; --apple-pay-button-color: black; --checkout-modal-background-color: var(--background-colors-base); --adyen-sdk-color-label-critical: var(--error-colors-base-default); --adyen-sdk-color-outline-primary: var(--background-colors-tint-3); --adyen-sdk-color-background-primary: transparent; --adyen-input-placeholder-color: var(--text-colors-tint-2); --adyen-input-text-color: var(--text-colors-base); }
3983:root.dark { --google-pay-button-color: white; --apple-pay-button-color: white; --checkout-modal-background-color: var(--background-colors-base); }
3984[data-checkout-tier] { --adyen-sdk-color-outline-primary-active: var(--checkout-accent); --adyen-sdk-color-outline-tertiary: var(--checkout-accent-action); }
3985.adyen-checkout-form-instruction { display: none; }
3986.adyen-checkout__paypal__button.adyen-checkout__paypal__button { margin-bottom: var(--spacings-s0); }
3987.adyen-checkout__paywithgoogle.adyen-checkout__paywithgoogle { height: 40px; }
3988.adyen-checkout__applepay__button.adyen-checkout__applepay__button { border-radius: 50%; display: block; width: 100%; }
3989.adyen-checkout__card__brands.adyen-checkout__card__brands { display: none; }
3990.adyen-checkout__card-input .adyen-checkout__payment-method { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; }
3991.adyen-checkout__card-input .adyen-checkout__payment-method__header { display: none; }
3992.adyen-checkout__card-input .adyen-checkout__payment-method__details { padding: var(--spacings-s0); }
3993.adyen-checkout__card-input .adyen-checkout__error-text { font-weight: 600; font-size: var(--typography-t3-font-size); line-height: 1.2; color: var(--error-colors-base-default); margin: var(--spacings-s2) var(--spacings-s8); }
3994.adyen-checkout__card-input .adyen-checkout__label__text, .adyen-checkout__card-input .adyen-checkout__label--focused .adyen-checkout__label__text { display: none; font-weight: 600; font-size: var(--typography-t4-font-size); line-height: 1.4; padding: var(--spacings-s0); margin-bottom: var(--spacings-s8); color: var(--text-colors-tint-1); }
3995.adyen-checkout__card-input .adyen-checkout-contextual-text { display: none; }
3996.adyen-checkout__card-input .adyen-checkout__input_wrapper { display: flex; align-items: center; }
3997.adyen-checkout__card-input .adyen-checkout__input_wrapper .adyen-checkout__input
3997:-webkit-autofill, .adyen-checkout__card-input .adyen-checkout__input_wrapper .adyen-checkout__input:autofill { caret-color: var(--text-colors-base); box-shadow: 0 0 0 1000px var(--checkout-modal-background-color) inset !important; -webkit-text-fill-color: var(--text-colors-base) !important; }
3998@keyframes Input-rotation-df697 { 
3999  0% { transform: rotate(0deg); }
4000  100% { transform: rotate(360deg); }
4001}
4002.Input-container-24a6a { position: relative; border: 1px solid var(--background-colors-tint-3); border-radius: var(--corner-radius-r8); padding: var(--spacings-s0) var(--spacings-s16); display: flex; align-items: center; box-sizing: border-box; width: 100%; height: 40px; font-weight: 500; font-size: var(--typography-t4-font-size); color: var(--text-colors-base); line-height: 20px; }
4003.Input-container-24a6a > input { flex-grow: 1; max-width: 100%; background: none; appearance: none; font-weight: inherit; line-height: inherit; font-size: inherit; color: inherit; display: block; outline: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: var(--spacings-s0); margin: var(--spacings-s0); }
4004.Input-container-24a6a > input::placeholder, .Input-container-24a6a > input:placeholder-shown { color: var(--text-colors-tint-2); font-weight: 500; }
4005.Input-container-24a6a > input:-webkit-autofill, .Input-container-24a6a > input:-webkit-autofill:hover, .Input-container-24a6a > input:-webkit-autofill:focus, .Input-container-24a6a > input:autofill { transition: background-color 9999s ease-in-out, color 9999s ease-in-out; -webkit-text-fill-color: var(--text-colors-base); caret-color: var(--text-colors-base); filter: none; }
4006.Input-container-24a6a.Input-withIcon-e74b8 { padding-right: var(--spacings-s32); }
4007.Input-container-24a6a.Input-error-ebffe { border: 2px solid var(--error-colors-base-default); }
4008.Input-container-24a6a.Input-disabled-fa4aa { opacity: var(--states-disabled); }
4009.Input-container-24a6a:not(.Input-disabled-fa4aa):not(.Input-error-ebffe):hover { border: 1px solid var(--checkout-accent-action); }
4010.Input-container-24a6a:not(.Input-disabled-fa4aa):not(.Input-error-ebffe):focus-within, .Input-container-24a6a:not(.Input-disabled-fa4aa):not(.Input-error-ebffe):active { border: 1px solid var(--checkout-accent); }
4011.Input-iconWrapper-4764d { display: block; position: absolute; width: 24px; height: 24px; right: 8px; top: 0px; bottom: 0px; margin: auto; }
4012.Input-tooltip-e17dd.Input-tooltip-e17dd { color: var(--text-colors-tint-1); }
4013.Input-icon-af7a4 { display: block; width: 100%; height: 100%; fill: var(--text-colors-tint-1); }
4014.Input-icon-af7a4.Input-loader-ca308 { animation: 1s linear 0s infinite normal none running Input-rotation-df697; }
4015.Input-icon-af7a4.Input-error-ebffe { fill: var(--error-colors-base-default); }
4016.Input-icon-af7a4.Input-checkmark-ea330 { fill: var(--success-colors-base-default); }
4017.Input-prefix-e1c26 { flex-grow: 0; flex-shrink: 0; margin-right: var(--spacings-s16); padding: var(--spacings-s0) var(--spacings-s12) var(--spacings-s0) var(--spacings-s0); border-right: 1px solid var(--background-colors-tint-3); font-weight: inherit; line-height: inherit; font-size: inherit; }
4018.Input-errorMessage-437a5 { color: var(--error-colors-base-default); font-weight: 600; font-size: var(--typography-t3-font-size); line-height: 1.2; margin: var(--spacings-s2) var(--spacings-s8); padding: var(--spacings-s0); }
4019.Avatax-zipCode-31926 input { font-weight: 500; font-family: Arial, sans-serif; }
4020.Avatax-zipCode-31926.Avatax-mobilePayment-81965 { margin-top: var(--spacings-s8); }
4021.Avatax-zipCode-31926.Avatax-mobilePayment-81965 input { font-size: var(--typography-t5-font-size); }
4022.Avatax-avataxTitle-4a1f0 { display: flex; flex-direction: column; gap: var(--spacings-s4); }
4023.Avatax-avataxContainer-e4cab { display: flex; flex-direction: column; gap: var(--spacings-s16); }
4024.CheckoutAccordion-accordion-8ca88 { border: 1px solid var(--background-colors-tint-2); border-radius: var(--corner-radius-r16); overflow: hidden; width: 100%; }
4025.CheckoutAccordion-item-9556c { border-top: 1px solid var(--background-colors-tint-2); padding: var(--spacings-s16); }
4026.CheckoutAccordion-header-38a61 { font-weight: 600; font-size: var(--typography-t5-font-size); padding: var(--spacings-s2); align-items: center; cursor: pointer; gap: var(--spacings-s8); display: flex; }
4027.CheckoutAccordion-cardPaymentIconsContainer-7cf91 { display: flex; gap: var(--spacings-s8); height: var(--spacings-s24); align-items: center; }
4028.CheckoutAccordion-cardPaymentIcon-deed4 { height: var(--spacings-s24); }
4029html.dark .CheckoutAccordion-visaIcon-88902 { filter: brightness(0) invert(1); }
4030.CheckoutAccordion-securityText-81cf4 { display: block; margin-top: var(--spacings-s16); }
4031.CheckoutAccordion-headerTitle-5b0ef { color: var(--text-colors-base); flex-grow: 1; }
4032.CheckoutAccordion-radio-d936f { place-content: center; height: var(--spacings-s16); width: var(--spacings-s16); border: 2px solid; border-radius: 50%; color: var(--text-colors-base); display: grid; }
4033.CheckoutAccordion-radio-d936f::before { transition: transform 0.12s ease-in-out; background-color: var(--text-colors-base); transform: scale(0); border-radius: 50%; content: ""; height: 8px; width: 8px; }
4034.CheckoutAccordion-radio-d936f:checked::before { transform: scale(1); }
4035.CheckoutAccordion-content-91f13 { transition: 0.2s ease-in-out; overflow: hidden; max-height: 0px; }
4036.CheckoutAccordion-contentOpen-842c2 { max-height: 50vh; opacity: 1; }
4037.CheckoutAccordion-contentClosed-315b2 { max-height: 0px !important; opacity: 0; }
4038.CheckoutAccordion-contentInner-d63bc { display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: var(--spacings-s16); }
4039.CheckoutAccordion-benefitsList-ca2fa { margin-bottom: var(--spacings-s16); gap: var(--spacings-s8); display: grid; width: 100%; }
4040.CheckoutAccordion-listItem-9bc63 { gap: var(--spacings-s12); display: flex; }
4041.CheckoutAccordion-applePayIcon-c7ae1 { fill: var(--negative-colors-base-default); }
4042.CheckoutAccordion-googlePayIcon-9ccff { height: var(--spacings-s24); }
4043.CheckoutAccordion-tickIcon-41bfb { fill: var(--negative-colors-base-default); flex-shrink: 0; }
4044.CheckoutAccordion-avatax-1b5f1, .CheckoutAccordion-cardContainer-f1163 { width: 100%; margin-bottom: var(--spacings-s16); }
4045.CheckoutAccordion-hidden-c7de2 { display: none; }
4046.CheckoutFormRadioButton-root-5f53d { display: inline-flex; align-items: stretch; position: relative; color: var(--text-colors-tint-1); }
4047.CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-withTextIcon-b2055 svg path { fill: var(--text-colors-tint-1); }
4048.CheckoutFormRadioButton-root-5f53d:active:not(.CheckoutFormRadioButton-disabled-3c669) .CheckoutFormRadioButton-outline-2a0a7, .CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-selected-4d6de:not(.CheckoutFormRadioButton-disabled-3c669) .CheckoutFormRadioButton-outline-2a0a7, .CheckoutFormRadioButton-root-5f53d:focus:not(.CheckoutFormRadioButton-disabled-3c669) .CheckoutFormRadioButton-outline-2a0a7 { box-shadow: inset 0 0 0 2px var(--checkout-accent); color: var(--text-colors-base); }
4049.CheckoutFormRadioButton-root-5f53d:active .CheckoutFormRadioButton-ribbon-d6da2, .CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-selected-4d6de .CheckoutFormRadioButton-ribbon-d6da2, .CheckoutFormRadioButton-root-5f53d:focus .CheckoutFormRadioButton-ribbon-d6da2 { background-color: var(--checkout-accent); }
4050.CheckoutFormRadioButton-root-5f53d:active .CheckoutFormRadioButton-ribbonIcon-80763 > path:first-child, .CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-selected-4d6de .CheckoutFormRadioButton-ribbonIcon-80763 > path:first-child, .CheckoutFormRadioButton-root-5f53d:focus .CheckoutFormRadioButton-ribbonIcon-80763 > path:first-child { fill: var(--checkout-accent); }
4051.CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-withTextIcon-b2055:active:not(.CheckoutFormRadioButton-disabled-3c669) .CheckoutFormRadioButton-outline-2a0a7 svg path, .CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-withTextIcon-b2055.CheckoutFormRadioButton-selected-4d6de:not(.CheckoutFormRadioButton-disabled-3c669) .CheckoutFormRadioButton-outline-2a0a7 svg path, .CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-withTextIcon-b2055:focus:not(.CheckoutFormRadioButton-disabled-3c669) .CheckoutFormRadioButton-outline-2a0a7 svg path { fill: var(--text-colors-base); }
4052@media (hover: hover) {
4053  .CheckoutFormRadioButton-root-5f53d:not(.CheckoutFormRadioButton-disabled-3c669):not(.CheckoutFormRadioButton-selected-4d6de):not(:focus):not
4053(:active):hover .CheckoutFormRadioButton-outline-2a0a7 { box-shadow: inset 0 0 0 1px var(--checkout-accent-action); }
4054  .CheckoutFormRadioButton-root-5f53d:not(.CheckoutFormRadioButton-disabled-3c669):not(.CheckoutFormRadioButton-selected-4d6de):not(:focus):not(:active):hover .CheckoutFormRadioButton-ribbon-d6da2 { background-color: var(--checkout-accent-action); }
4055  .CheckoutFormRadioButton-root-5f53d:not(.CheckoutFormRadioButton-disabled-3c669):not(.CheckoutFormRadioButton-selected-4d6de):not(:focus):not(:active):hover .CheckoutFormRadioButton-ribbonIcon-80763 > svg > path { fill: var(--checkout-accent-action); }
4056}
4057.CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-disabled-3c669 { pointer-events: none; }
4058.CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-disabled-3c669 .CheckoutFormRadioButton-outline-2a0a7 { opacity: var(--states-disabled); }
4059.CheckoutFormRadioButton-root-5f53d.CheckoutFormRadioButton-disabled-3c669 input[type="radio"] { cursor: default; }
4060.CheckoutFormRadioButton-root-5f53d input[type="radio"] { display: block; position: absolute; z-index: 1; top: 0px; left: 0px; width: 100%; height: 100%; border-radius: var(--corner-radius-r8); margin: var(--spacings-s0); padding: var(--spacings-s0); cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; appearance: none; }
4061.CheckoutFormRadioButton-outline-2a0a7 { box-shadow: inset 0 0 0 1px var(--background-colors-tint-3); padding: var(--spacings-s12) var(--spacings-s16); border-radius: var(--corner-radius-r8); position: relative; overflow: hidden; width: 100%; }
4062.CheckoutFormRadioButton-outline-2a0a7.CheckoutFormRadioButton-hasFullWidthRibbon-117f4 { padding-top: var(--spacings-s32); }
4063.CheckoutFormRadioButton-ribbon-d6da2 { border-bottom-left-radius: var(--corner-radius-r8); width: auto; padding: var(--spacings-s4) var(--spacings-s8); background-color: var(--background-colors-tint-3); font-weight: 600; font-size: var(--typography-t3-font-size); color: var(--negative-colors-text-default); position: absolute; text-align: center; line-height: 1.33; right: -1px; top: -1px; }
4064.CheckoutFormRadioButton-ribbonFullWidth-ee5b0 { border-bottom-left-radius: var(--corner-radius-r0); width: calc(100% + 2px); }
4065.CheckoutFormRadioButton-ribbonIcon-80763 { display: none; position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; }
4066.CheckoutFormRadioButton-ribbonIcon-80763 > path:first-child { fill: var(--background-colors-tint-3); }
4067@media screen and (max-width: 1023px) {
4068  .CheckoutFormRadioButton-ribbonIcon-80763 { display: block; }
4069}
4070.PlanRadioButtonLabelNew-root-ef92a { display: flex; justify-content: space-between; }
4071.PlanRadioButtonLabelNew-frequency-28d1e { font-weight: 700; font-size: var(--typography-t6-font-size); line-height: 1.4; }
4072.PlanRadioButtonLabelNew-price-a04ab { display: flex; justify-content: flex-end; align-items: baseline; font-weight: 700; font-size: var(--typography-t7-font-size); line-height: 32px; }
4073.PlanRadioButtonLabelNew-price-a04ab small { font-weight: 600; font-size: var(--typography-t4-font-size); line-height: 20px; }
4074.PlanRadioButtonLabelNew-info-c7d72 { font-weight: 500; font-size: var(--typography-t5-font-size); line-height: 1.5; color: var(--text-colors-tint-1); }
4075.PlanRadioButtonLabelNew-infoContainer-78258 { justify-content: center; flex-direction: column; gap: var(--spacings-s4); display: flex; }
4076.PlanRadioButtonInline-radioButton-64400 { flex-grow: 1; }
4077.PlanRadioButtonInline-container-f28bf { display: flex; justify-content: space-between; }
4078.PlanRadioButtonInline-radioButtonFrequency-662c0 { text-transform: capitalize; }
4079.PlanRadioButtonInline-disconuntText-e3d64 { text-decoration: line-through; }
4080.PlanRadioButtonInline-monthlyPrice-6114f { display: flex; }
4081.PlanSelector-toggle-f3185 { width: 100%; }
4082.PlanSelector-toggle-f3185 + .PlanSelector-toggle-f3185 { margin-top: var(--spacings-s16); }
4083.PlanSelector-inlineToggle-55287 { width: 100%; }
4084.PlanSelector-oldPrice-d00ac { font-weight: 600; margin-right: var(--spacings-s4); font-size: var(--typography-t6-font-size); display: inline-block; color: var(--text-colors-tint-1); }
4085.PlanSelector-price-2765b { align-self: flex-end; }
4086.PlanSelector-planRadioButtonLabelWithRibbon-a1378 { min-height: var(--spacings-s40); }
4087.PlanSelector-checkoutLabel-b87d6 { font-weight: 600; font-size: var(--typography-t4-font-size); line-height: 1.4; margin-bottom: var(--spacings-s8); color: var(--text-colors-tint-1); }
4088.SeatSelectorV2-container-34850 { border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r12); padding: var(--spacings-s4); color: var(--text-colors-tint-1); align-items: center; gap: var(--spacings-s4); display: flex; }
4089.SeatSelectorV2-button-c9c55.SeatSelectorV2-button-c9c55 { height: 24px; width: var(--spacings-s32); padding: 4px 0px 0px; display: flex; align-items: center; justify-content: center; }
4090.SeatSelectorV2-icon-7934e { fill: var(--text-colors-tint-1); }
4091.SeatSelectorV2-input-c056c.SeatSelectorV2-input-c056c { height: 26p
4091x; width: var(--spacings-s32); }
4092.SeatSelectorV2-input-c056c.SeatSelectorV2-input-c056c > input { text-align: center; }
4093.CreditsCallout-credits-4a8fc { display: flex; align-items: center; gap: var(--spacings-s12); padding: var(--spacings-s12) var(--spacings-s16); border-radius: var(--corner-radius-r12); border: 1px solid var(--background-colors-border); background-color: var(--background-colors-tint-2); }
4094.CreditsCallout-creditsIcon-0037d { fill: var(--credits-accent); flex-shrink: 0; }
4095.CreditsCallout-creditsCopy-7cdca { display: flex; flex-direction: column; gap: var(--spacings-s2); }
4096.SeatsBreakdown-root-7d20a { display: flex; flex-direction: column; gap: var(--spacings-s10); padding-bottom: var(--spacings-s12); border-bottom: 1px dashed var(--background-colors-border); }
4097.SeatsBreakdown-header-2f29d { display: flex; align-items: center; justify-content: space-between; gap: var(--spacings-s12); }
4098.SeatsBreakdown-headerLabel-73785 { display: flex; align-items: center; gap: var(--spacings-s8); color: var(--text-colors-base); }
4099.SeatsBreakdown-headerIcon-cc0ae { width: 20px; height: 20px; flex-shrink: 0; fill: currentcolor; }
4100.SeatsBreakdown-row-4d5e8 { display: flex; justify-content: space-between; align-items: baseline; gap: var(--spacings-s16); }
4101.SeatsBreakdown-rowLabel-be7c1 { display: flex; flex-direction: column; gap: var(--spacings-s2); min-width: 0px; }
4102.CheckoutFooterNote-root-1d796 { font-weight: 600; margin-bottom: var(--spacings-s8); font-size: var(--typography-t4-font-size); text-align: center; color: var(--text-colors-base); }
4103.ErrorMessage-root-2744f { color: var(--error-colors-base-default); font-weight: 600; line-height: var(--typography-t3-line-height); font-size: var(--typography-t3-font-size); }
4104.TermsFooterV2-termsFooterContainer-7e5f9.TermsFooterV2-termsFooterContainer-7e5f9 { display: flex; width: 100%; justify-content: center; align-items: center; color: var(--text-colors-tint-2); gap: var(--spacings-s8); }
4105.TermsFooterV2-termsButton-fae4f { padding: 0px; color: var(--text-colors-tint-2); }
4106.PaymentMethodSelector-toggle-9dc34 { flex-basis: 50%; }
4107.PaymentMethodSelector-toggle-9dc34:only-child { flex-basis: 100%; text-align: center; }
4108.PaymentMethodSelector-togglePaymentMethod-1eaa0 { justify-content: flex-start; font-weight: 600; font-size: var(--typography-t4-font-size); line-height: 1.4; display: flex; align-items: center; }
4109.PaymentMethodSelector-applePayIcon-2d2a4 { fill: var(--negative-colors-base-default); }
4110.PaymentMethodSelector-segment-fef08 { padding: var(--spacings-s0) var(--spacings-s4); }
4111.PaymentMethodSelector-segment-fef08 > :first-child { height: 24px; }
4112.PaymentMethodSelector-segmentContent-c2b3b { display: flex; align-items: center; justify-content: center; line-height: 1; }
4113.PaymentMethodSelector-textIcon-8259e path { fill: currentcolor; }
4114.PaymentMethodSelector-toggleIcon-1a2cd { margin-right: var(--toggle-icon-gap); display: inline-block; vertical-align: top; height: 24px; width: 24px; flex-shrink: 0; }
4115.PaymentMethodSelector-toggleImg-7b535 { height: 24px; width: auto; }
4116.PaymentMethodSelector-toggles-b194e { border: 1px solid var(--control-colors-button-background-active); width: 100%; }
4117.FrequencySwitch-container-ee988 { flex-direction: column; align-items: center; text-align: center; gap: var(--spacings-s4); display: flex; }
4118.FrequencySwitch-toggle-3d3bb { border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r12); padding: var(--spacings-s8); display: inline-flex; align-items: center; gap: var(--spacings-s12); }
4119@media screen and (max-width: 1365px) {
4120  .FrequencySwitch-toggle-3d3bb { padding: var(--spacings-s4) var(--spacings-s8); }
4121}
4122.FrequencySwitch-label-fe8be { font-weight: 600; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-2); background: none; cursor: pointer; padding: 0px; border: 0px; }
4123.FrequencySwitch-tag-03c12 { white-space: nowrap; }
4124.FrequencySwitch-labelActive-feb26 { color: var(--text-colors-base); }
4125.FrequencyToggle-container-bddfe { flex-direction: column; text-align: center; gap: var(--spacings-s4); display: flex; }
4126.FrequencyToggle-segments-0f75f { grid-template-columns: repeat(2, auto); border: 1px solid var(--background-colors-border); font-weight: 600; font-size: var(--typography-t5-font-size); }
4127@media screen and (max-width: 1365px), screen and (max-height: 767px) {
4128  .FrequencyToggle-segments-0f75f { padding: var(--spacings-s2); }
4129}
4130.FrequencyToggle-segment-60695 { border: 1px solid transparent; background: none; min-width: 138px; }
4131@media screen and (max-width: 1365px), screen and (max-height: 767px) {
4132  .FrequencyToggle-segment-60695 { padding-block: var(--spacings-s6); padding-inline: var(--spacings-s6); height: 32px; }
4133}
4134.FrequencyToggle-segmentContent-ad534 { padding-inline: var(--spacings-s10); display: inline-flex; align-items: center; gap: var(--spacings-s4); }
4135.FrequencyToggle-segmentYearly-bd95e { position: relative; }
4136.FrequencyToggle-tag-73159 { top: calc(-1 * var(--spacings-s16)); position: absolute; right: var(--spacings-s4); }
4137.FrequencyToggle-active-6be5d { background-color: var(--control-colors-button-background-active); border: 1px solid var(--control-colors-button-background-active); }
4138.MarqueeSlider-container-0ebf6 { display: flex; overflow: hidden; width: 100%; mask-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgb(0, 0, 0) 10%, rgb(0, 0, 0) 90%, rgba(0, 0, 0, 0)); }
4139@media (hover: hover) {
4140  .MarqueeSlider-container-0ebf6:hover .MarqueeSlider-track-1916d { animation-play-state: paused; }
4141}
4142.MarqueeSlider-track-1916d { padding-right: var(--spacings-s32); will-change: transform; gap: var(--spacings-s32); display: flex; flex-shrink: 0; }
4143.MarqueeSlider-trackLeft-c4cc0 { animation: 40s linear 0s infinite normal none running MarqueeSlider-scrollLeft-497e0; }
4144.MarqueeSlider-trackRight-b2c74 { animation: 40s linear 0s infinite normal none running MarqueeSlider-scrollRight-6374c; }
4145.MarqueeSlider-item-453ac { display: inline-flex; white-space: nowrap; align-items: center; flex-shrink: 0; }
4146.MarqueeSlider-item-453ac::after { background-color: var(--background-colors-tint-3); margin-left: var(--spacings-s32); display: inline-block; height: var(--spacings-s8); width: var(--spacings-s8); border-radius: 50%; flex-shrink: 0; content: ""; }
4147.MarqueeSlider-chipIcon-d84a1 { fill: var(--text-colors-base); }
4148.MarqueeSlider-chipIcon-d84a1 > path { fill: var(--text-colors-base); }
4149@keyframes MarqueeSlider-scrollLeft-497e0 { 
4150  0% { transform: translate(0px); }
4151  100% { transform: translate(-100%); }
4152}
4153@keyframes MarqueeSlider-scrollRight-6374c { 
4154  0% { transform: translate(-100%); }
4155  100% { transform: translate(0px); }
4156}
4157.AiModelsSlider-container-e7a43 { padding-bottom: var(--spacings-s72); width: 100%; }
4158.AiModelsSlider-item-867c8 { display: inline-flex; white-space: nowrap; align-items: center; gap: var(--spacings-s8); flex-shrink: 0; }
4159.AiModelsSlider-title-71d42 { margin-bottom: var(--spacings-s64); font-size: var(--typography-t10-font-size); line-height: var(--typography-t10-line-height); }
4160@media screen and (max-width: 767px) {
4161  .AiModelsSlider-title-71d42 { font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
4162}
4163.AiModelsSlider-sliderContainer-1baf8 { flex-direction: column; gap: var(--spacings-s24); display: flex; }
4164.AiModelsSlider-chipIcon-d0e16 { fill: var(--text-colors-base); height: 28px; width: 28px; }
4165.AiModelsSlider-chipIcon-d0e16 > path { fill: var(--text-colors-base); }
4166.Tooltip-root-a29ba { --arrow-width: 24px; --arrow-height: 24px; --arrow-gap: -13px; box-shadow: var(--shadows-tint-1); background-color: var(--negative-colors-base-default); color: var(--negative-colors-text-default); border-radius: var(--corner-radius-r4); padding: var(--spacings-s2) var(--spacings-s6); }
4167.Tooltip-content-a2201 { padding: var(--spacings-s4); }
4168.Tooltip-indicatorWrapper-4da39 { width: var(--arrow-width); height: var(--arrow-height); }
4169.Tooltip-indicatorWrapper-4da39[data-arrow-wrapper-dir^="top"] { bottom: var(--arrow-gap); }
4170.Tooltip-indicatorWrapper-4da39[data-arrow-wrapper-dir^="right"] { left: var(--arrow-gap); }
4171.Tooltip-indicatorWrapper-4da39[data-arrow-wrapper-dir^="bottom"] { top: var(--arrow-gap); }
4172.Tooltip-indicatorWrapper-4da39[data-arrow-wrapper-dir^="left"] { right: var(--arrow-gap); }
4173.Tooltip-indicator-99840 { border-width: 0px 5px; width: var(--arrow-width); height: var(--arrow-height); pointer-events: none; }
4174.Tooltip-indicator-99840 path { fill: var(--negative-colors-base-default); }
4175.Tooltip-tooltipContainer-f9152 { display: flex; align-items: center; }
4176.TooltipWrapper-wrapper-be582 { vertical-align: bottom; }
4177.Select-root-e6afd { position: relative; width: 100%; }
4178.Select-trigger-3882a { display: flex; align-items: center; width: 100%; height: 48px; padding: var(--spacings-s12) var(--spacings-s12); gap: var(--spacings-s8); background-color: var(--control-colors-button-background-default); color: var(--control-colors-value-default); border: 1px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r8); font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); font-weight: 500; cursor: pointer; text-align: left; transition: background-color 0.15s, border-color 0.15s; }
4179.Select-trigger-3882a:hover { background-color: var(--control-colors-button-background-action); }
4180.Select-trigger-3882a:focus-visible { outline: none; border-color: var(--control-colors-border-active); }
4181.Select-triggerOpen-e0bb3 { background-color: var(--control-colors-button-background-active); }
4182.Select-startIcon-36dc1 { flex-shrink: 0; width: 24px; height: 24px; fill: var(--control-colors-start-icon-default); }
4183.Select-startIcon-36dc1 path { fill: var(--control-colors-start-icon-default); }
4184.Select-label-71336 { flex: 1 1 0%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
4185.Select-endIcon-9d3ff { flex-shrink: 0; width: 24px; height: 24px; fill: var(--control-colors-end-icon-default); transition: transform 0.15s; }
4186.Select-endIcon-9d3ff path { fill: var(--control-colors-end-icon-default); }
4187.Select-endIconOpen-89261 { transform: rotate(180deg); }
4188.Select-menu-3a9a3 { position: fixed; display: flex; flex-direction: column; gap: var(--spacings-s4); padding: var(--spacings-s8); background-color: var(--background-colors-popover); border: 1px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r8); box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 16px; max-height: 320px; overflow-y: auto; }
4189.Select-item-b8a6b { display: flex; align-items: center; width: 100%; min-height: 48px; padding: var(--spacings-s12) var(--spacings-s12); gap: var(--spacings-s8); background-color: transparent; color: var(--text-colors-base); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); font-weight: 500; text-align: left; cursor: pointer; transition: background-color 0.15s; }
4190.Select-item-b8a6b:hover { background-color: var(--control-colors-button-background-action); }
4191.Select-item-b8a6b:focus-visible { outline: none; background-color: var(--control-colors-button-background-action); }
4192.Select-itemActive-0a89c, .Select-itemActive-0a89c:hover { background-color: var(--control-colors-button-background-active); }
4193.Select-itemDisabled-671d6 { cursor: not-allowed; opacity: 0.4; }
4194.Select-itemDisabled-671d6:hover { background-color: transparent; }
4195.Select-itemDisabled-671d6:focus-visible { background-color: transparent; }
4196.Select-itemLabel-55864 { flex: 1 1 0%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
4197.Select-tickIcon-02136 { flex-shrink: 0; width: 24px; height: 24px; fill: var(--text-colors-base); }
4198.Select-tickIcon-02136 path { fill: var(--text-colors-base); }
4199.SubscriptionBenefits-benefitSection-9ee2a { margin-bottom: var(--spacings-s24); color: var(--text-colors-base); width: 100%; }
4200.SubscriptionBenefits-benefitSection-9ee2a:not(:first-of-type) { margin-top: var(--spacings-s24); }
4201.SubscriptionBenefits-benefitSection-9ee2a:last-of-type ~ .SubscriptionBenefits-divider-f291a { display: none; }
4202.SubscriptionBenefits-divider-f291a { --subscription-benefits-divider: 1; }
4203.SubscriptionBenefits-benefitSectionTitle-5eafe { font-weight: 700; margin-bottom: var(--spacings-s12); font-size: var(--typography-t5-font-size); align-items: center; gap: var(--spacings-s8); line-height: 1.5; display: flex; }
4204.SubscriptionBenefits-benefitSectionTitle-5eafe svg { fill: var(--text-colors-base); }
4205.SubscriptionBenefits-benefitsList-e4272 { padding-left: var(--spacings-s0); list-style: none; }
4206.SubscriptionBenefits-benefitsList-e4272 > li:not(:last-child) { margin-bottom: var(--spacings-s8); }
4207.SubscriptionBenefits-benefitsList-e4272 a { color: var(--primary-colors-base-default); cursor: pointer; }
4208.SubscriptionBenefits-benefitsItem-286ba { gap: var(--spacings-s8); display: flex; }
4209.SubscriptionBenefits-benefitsText-eed99 { margin-right: var(--spacings-s8); }
4210.SubscriptionBenefits-benefitsText-eed99 a { font-weight: 700; text-decoration: underline; cursor: pointer; color: unset; }
4211.SubscriptionBenefits-tickIcon-e6e32 { flex-shrink: 0; }
4212.SubscriptionBenefits-tickIconNeutral-ced73 { fill: var(--text-colors-base); }
4213.SubscriptionBenefits-tier-max_performance-39d6f { fill: var(--monetization-pro-colors-base-default); }
4214.SubscriptionBenefits-tier-max_starter-b67b8 { fill: var(--monetization-plus-colors-base-default); }
4215.SubscriptionBenefits-tier-power-9e29c { fill: var(--monetization-ultra-colors-base-default); }
4216.SubscriptionBenefits-tier-pro-0cf9e { fill: var(--monetization-pro-colors-base-default); }
4217.SubscriptionBenefits-tier-plus-83c20 { fill: var(--monetization-plus-colors-base-default); }
4218.SubscriptionBenefits-tier-free-28827, .SubscriptionBenefits-tier-enterprise-b9bcb { fill: var(--text-colors-base); }
4219.SubscriptionBenefits-infoIcon-6eaa3 { fill: var(--text-colors-tint-1); height: var(--spacings-s16); width: var(--spacings-s16); vertical-align: middle; display: inline-block; }
4220.SubscriptionBenefits-benefitsItemContent-8ad5b > div { display: inline-block; }
4221.SubscriptionBenefits-tooltip-a0b6a { font-weight: 500; text-align: center; max-width: 188px; }
4222@keyframes PricingCard-fadeIn-cf634 { 
4223  0% { opacity: 0; translate: 0px 24px; }
4224  100% { opacity: 1; translate: 0px; }
4225}
4226.PricingCard-card-a370c { transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); border: 1px solid var(--background-colors-tint-3); border-radius: var(--corner-radius-r16); position: relative; color: var(--text-colors-base); display: flex; overflow: hidden; flex-direction: column; flex-shrink: 0; }
4227@media (hover: hover) {
4228  .PricingCard-card-a370c:hover:not(.PricingCard-standalone-baf6c):not(.PricingCard-static-3e007) { box-shadow: var(--card-hover-shadow, none); transform: translateY(-6px) scale(1.008) !important; }
4229}
4230.PricingCard-highlighted-afb84 { padding: var(--spacings-s2); background: var(--card-highlight-background); border-color: var(--card-highlight-border-color); }
4231.PricingCard-highlighted-afb84 .PricingCard-cardContent-c6827 { border-radius: var(--corner-radius-r12); }
4232.PricingCard-highlighted-afb84.PricingCard-standalone-baf6c { padding: 1px; }
4233.PricingCard-tier-max_performance-828c8 { --card-highlight-background: var(--monetization-pro-colors-base-default); --card-highlight-border-color: var(--monetization-pro-colors-base-default); }
4234.PricingCard-tier-max_starter-934fa { --card-highlight-background: var(--monetization-plus-colors-base-default); --card-highlight-border-color: var(--monetization-plus-colors-base-default); }
4235.PricingCard-tier-power-4bf93 { --card-highlight-background: var(--monetization-ultra-colors-base-default); --card-highlight-border-color: var(--monetization-ultra-colors-base-default); }
4236.PricingCard-tier-pro-c52c6 { --card-highlight-background: var(--monetization-pro-colors-base-default); --card-highlight-border-color: var(--monetization-pro-colors-base-default); }
4237.PricingCard-tier-plus-a635d { --card-highlight-background: var(--monetization-plus-colors-base-default); --card-highlight-border-color: var(--monetization-plus-colors-base-default); }
4238.PricingCard-tier-free-0c51f, .PricingCard-tier-enterprise-e1c24 { --card-highlight-background: var(--text-colors-base); --card-highlight-border-color: var(--text-colors-base); }
4239.PricingCard-tier-pro-c52c6 { --card-hover-shadow: 0 4px 8px rgba(90, 0, 238, .43); }
4240.PricingCard-tier-plus-a635d { --card-hover-shadow: 0 4px 8px rgba(194, 9, 193, .43); }
4241.PricingCard-tier-power-4bf93 { --card-hover-shadow: 0 4px 8px rgba(21, 131, 128, .43); }
4242.PricingCard-tier-enterprise-e1c24 { --card-hover-shadow: 0 4px 8px rgba(179, 179, 179, .43); }
4243.PricingCard-tier-power-4bf93 { --card-highlight-background: linear-gradient(90deg, #24c7c2 0%, #009994 100%); --card-highlight-border-color: transparent; }
4244.PricingCard-tier-free-0c51f { background-color: var(--background-colors-tint-1); }
4245.PricingCard-neutralHoverShadow-0eafd { --card-hover-shadow: 0 4px 8px rgba(179, 179, 179, .43); }
4246.PricingCard-animated-6bf5e { animation: 0.4s ease 0s 1 normal backwards running PricingCard-fadeIn-cf634; }
4247.PricingCard-cardContent-c6827 { background-color: var(--background-colors-base); padding: var(--spacings-s24); flex-direction: column; display: flex; flex-grow: 1; }
4248@media screen and (max-width: 767px) {
4249  .PricingCard-cardContent-c6827 { padding: var(--spacings-s16); }
4250}
4251.PricingCard-disabled-596ad { opacity: 0.32; pointer-events: none; }
4252.SavingText-savingText-c1d0c { color: var(--primary-colors-base-default); font-weight: 600; background-color: transparent; line-height: var(--typography-t5-line-height); justify-content: center; font-size: var(--typography-t5-font-size); display: inline-flex; padding: var(--spacings-s12); align-items: center; gap: var(--spacings-s4); height: 48px; overflow: hidden; transition: height 0.8s, padding 0.8s, margin 0.8s, opacity 0.8s; }
4253.SavingText-skinPro-f8be0 { color: var(--monetization-pro-colors-base-default); }
4254.SavingText-skinUltra-9fd43 { color: var(--monetization-ultra-colors-base-default); }
4255.SavingText-skinNegative-59018 { color: var(--negative-colors-base-default); }
4256.SavingText-savingTextHidden-fbe19 { height: 0px; opacity: 0; padding-top: 0px; padding-bottom: 0px; pointer-events: none; margin-top: 0px !important; margin-bottom: 0px !important; }
4257.SavingText-savingTextIcon-e3409 { fill: currentcolor; flex-shrink: 0; height: 24px; width: 24px; }
4258.SavingText-savingTextContent-c4f2b { padding: var(--spacings-s0) var(--spacings-s4); text-align: center; }
4259@keyframes ActionButton-fadeSwap-204fa { 
4260  0% { opacity: 0; translate: 0px 8px; }
4261  100% { opacity: 1; translate: 0px; }
4262}
4263.ActionButton-swapAnimated-b26fe { animation: 0.8s ease 0s 1 normal backwards running ActionButton-fadeSwap-204fa; }
4264.ActionButton-label-641fe { display: inline-block; }
4265@keyframes ActionButton-ctaShimmerSweep-766bd { 
4266  0%, 35% { transform: translate(-100%); }
4267  75%, 100% { transform: translate(220%); }
4268}
4269.ActionButton-shimmer-6cf93 { position: relative; overflow: hidden; }
4270.ActionButton-shimmer-6cf93::after { content: ""; position: absolute; top: 0px; left: 0px; width: 70%; height: 100%; pointer-events: none; background: linear-gradient(105deg, transparent 0%, transparent 30%, rgba(255, 255, 255, 0.28) 50%, transparent 70%, transparent 100%); animation: 3s ease-in-out 0s infinite normal none running ActionButton-ctaShimmerSweep-766bd; will-change: transform; }
4271@media screen and (min-width: 1024px) {
4272  .ExpandButton-expandButton-d6a9c { display: none; }
4273}
4274.PackageSelector-container-62ff0 { margin-top: var(--spacings-s8); margin-bottom: var(--spacings-s8); width: 100%; }
4275.PackageSelector-select-9fb15 { width: 100%; }
4276.PackageSelector-optionLabel-6e272 { display: inline-flex; align-items: center; justify-content: space-between; gap: var(--spacings-s8); width: 100%; }
4277.PackageSelector-badge-98f9f { background-color: var(--background-colors-tint-2); border: 1px solid var(--text-colors-base); font-weight: 600; padding: 0 var(--spacings-s8); border-radius: 999px; display: inline-flex; margin-left: auto; align-items: center; color: var(--text-colors-base); font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
4278.ProrateNote-tooltipWrapper-fa149 { vertical-align: bottom; display: inline-flex; align-items: center; height: var(--spacings-s24); }
4279.ProrateNote-tooltipIcon-fdfbd { height: var(--spacings-s16); width: var(--spacings-s16); }
4280.ProrateNote-tooltip-c1b0e { color: var(--negative-colors-text-default); font-weight: 500; font-size: var(--typography-t4-font-size); word-break: normal; text-align: center; max-width: 278px; }
4281@keyframes Description-fadeSwap-19535 { 
4282  0% { opacity: 0; translate: 0px 8px; }
4283  100% { opacity: 1; translate: 0px; }
4284}
4285.Description-swapAnimated-e7301 { animation: 0.8s ease 0s 1 normal backwards running Description-fadeSwap-19535; }
4286.Credits-credits-8a09a { color: var(--text-colors-tint-1); font-weight: 600; font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); align-items: center; gap: var(--spacings-s8); display: flex; }
4287.Credits-creditsIcon-38c35 { fill: var(--text-colors-tint-1); }
4288.Credits-tooltip-2b27d { color: var(--negative-colors-text-default); font-weight: 500; font-size: var(--typography-t4-font-size); word-break: normal; text-align: center; max-width: 340px; }
4289.Credits-tooltipIcon-780d6 { fill: var(--text-colors-tint-1); margin-left: var(--spacings-s4); cursor: pointer; }
4290.Credits-tooltipWrapper-31a2d { vertical-align: bottom; display: inline-block; height: var(--spacings-s24); }
4291.AddCreditsLine-addCreditsLine-6dce3 { color: var(--text-colors-tint-1); font-weight: 600; font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); margin-top: var(--spacings-s12); align-items: center; gap: var(--spacings-s8); display: flex; }
4292.AddCreditsLine-addCreditsIcon-25c13 { fill: var(--text-colors-tint-1); }
4293.AddCreditsLine-tooltip-022af { color: var(--negative-colors-text-default); font-weight: 500; font-size: var(--typography-t4-font-size); word-break: normal; text-align: center; max-width: 340px; }
4294.AddCreditsLine-tooltipIcon-b3e57 { fill: var(--text-colors-tint-1); margin-left: var(--spacings-s4); cursor: pointer; }
4295.AddCreditsLine-tooltipWrapper-edb69 { vertical-align: bottom; display: inline-block; height: var(--spacings-s24); }
4296.ModelGenerations-wrapper-bf595 { flex-direction: column; gap: var(--spacings-s8); display: flex; }
4297.ModelGenerations-row-f81f4 { font-weight: 500; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-1); gap: var(--spacings-s8); display: flex; line-height: 1.5; }
4298.ModelGenerations-row-f81f4 > span:first-child { white-space: nowrap; }
4299.ModelGenerations-countSkeleton-33273 { align-self: center; }
4300.CreditsVolume-root-4c1e6 { justify-content: space-between; align-items: center; display: flex; height: 24px; width: 100%; }
4301.CreditsVolume-tick-8a3fa { transition: height 0.18s, background-color 0.18s, box-shadow 0.18s; background-color: var(--background-colors-tint-3); border-radius: 100px; flex-shrink: 0; width: 6px; }
4302@media screen and (max-width: 766px) {
4303  .CreditsVolume-tick-8a3fa { width: 4px; }
4304}
4305.CreditsVolume-tickFilled-c1a7a { color: var(--text-colors-base); background-color: currentcolor; }
4306.CreditsVolume-tickFilledPower-3b0ac { color: var(--monetization-ultra-colors-base-default); }
4307.CreditsVolume-tickPeak-7e0bb { box-shadow: currentcolor 0px 0px 4px 0px; }
4308.CreditsLine-creditsLine-ffaac { color: var(--text-colors-tint-1); font-weight: 600; font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); margin-top: var(--spacings-s12); align-items: center; gap: var(--spacings-s12); display: flex; }
4309.CreditsLine-creditsIcon-701c6 { fill: var(--text-colors-base); flex-shrink: 0; }
4310.CreditsLine-creditsIconLarge-bf06f { width: 32px; height: 32px; }
4311.CreditsLine-creditsValue-4c87b { color: var(--text-colors-base); }
4312.CreditsLine-creditsValueLarge-17fee { font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
4313.CreditsLine-creditsSuffix-c95b9 { color: var(--text-colors-tint-1); margin-left: 0.25em; }
4314.CreditsLine-odometer-df319 { display: inline-flex; align-items: baseline; font-variant-numeric: tabular-nums; line-height: var(--typography-t5-line-height); }
4315.CreditsLine-odometerSlot-f0e82 { display: inline-block; height: 1.3em; overflow: hidden; vertical-align: bottom; line-height: 1.3em; }
4316.CreditsLine-odometerReel-7d989 { display: flex; flex-direction: column; transition: transform 0.7s cubic-bezier(0.34, 1.2, 0.4, 1); will-change: transform; }
4317.CreditsLine-odometerDigit-aa494 { height: 1.3em; line-height: 1.3em; display: block; }
4318.CreditsLine-odometerComma-225ce { display: inline-block; line-height: 1.3em; }
4319@keyframes CreditsBox-fadeSwap-44aa5 { 
4320  0% { opacity: 0; translate: 0px 8px; }
4321  100% { opacity: 1; translate: 0px; }
4322}
4323.CreditsBox-swapAnimated-b463b { animation: 0.8s ease 0s 1 normal backwards running CreditsBox-fadeSwap-44aa5; }
4324.CreditsBox-box-0d7e4 { border: 1px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r12); padding: var(--spacings-s16); flex-direction: column; gap: var(--spacings-s12); display: flex; }
4325.CreditsBox-header-8529c { align-items: center; display: flex; }
4326.CreditsBox-header-8529c > div:first-child { margin-top: var(--spacings-s0); }
4327.CreditsBox-benefitsSwap-b1f5e:empty { display: none; }
4328.CreditsBox-selectorSlot-a061e { flex-direction: column; min-height: 0px; display: flex; }
4329@media screen and (min-width: 1024px) {
4330  .CreditsBox-selectorSlot-a061e { min-height: 56px; }
4331}
4332.CreditsBox-enterpriseBenefits-5c131 { min-height: 110px; flex-direction: column; padding-left: var(--spacings-s0); margin: var(--spacings-s0); gap: var(--spacings-s8); list-style: none; display: flex; }
4333.CreditsBox-enterpriseBenefitsInline-3e76b { min-height: 0px; }
4334.CreditsBox-enterpriseBenefit-78b25 { font-weight: 500; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-1); align-items: center; gap: var(--spacings-s8); display: flex; line-height: 1.5; }
4335.CreditsBox-tickIcon-1d52f { fill: var(--text-colors-tint-1); height: 21px; width: auto; flex-shrink: 0; }
4336.CreditsBox-tooltipIcon-aeacb { fill: var(--text-colors-tint-1); margin-left: var(--spacings-s4); cursor: pointer; height: var(--spacings-s16); width: var(--spacings-s16); }
4337.CreditsBox-tooltipWrapper-8ca2b { vertical-align: bottom; display: inline-flex; align-items: center; height: var(--spacings-s24); }
4338.CreditsBox-tooltip-31ff7 { color: var(--negative-colors-text-default); font-weight: 500; font-size: var(--typography-t4-font-size); word-break: normal; text-align: center; max-width: 340px; }
4339@keyframes CreditSlider-thumbHaloAnim-00369 { 
4340  0% { opacity: 0; transform: scale(0.8); }
4341  18% { opacity: 0.95; transform: scale(1.5); }
4342  100% { opacity: 0; transform: scale(2.8); }
4343}
4344@keyframes CreditSlider-thumbRippleAnim-6740e { 
4345  0% { opacity: 0.9; transform: scale(1); }
4346  100% { opacity: 0; transform: scale(3); }
4347}
4348.CreditSlider-container-acde4 { width: 100%; }
4349.CreditSlider-readOnly-1021e { pointer-events: none; }
4350.CreditSlider-sliderWrap-96a95 { position: relative; width: 100%; }
4351.CreditSlider-slider-c8072.CreditSlider-slider-c8072 { width: 100%; --slider-thumb-bg: var(--control-colors-text-active); }
4352.CreditSlider-slider-c8072.CreditSlider-slider-c8072 .slider__mark { background: var(--control-colors-text-active); }
4353.CreditSlider-fillGlow-d4524 { position: absolute; top: 50%; left: 0px; height: 4px; pointer-events: none; border-radius: 2px; transform: translateY(-50%); transition: width 0.5s cubic-bezier(0.3, 0, 0.2, 1), background 0.5s cubic-bezier(0.3, 0, 0.2, 1), box-shadow 0.5s cubic-bezier(0.3, 0, 0.2, 1); z-index: 3; }
4354.CreditSlider-thumbOverlay-4de0e { position: absolute; top: 50%; width: 16px; height: 16px; pointer-events: none; transform: translate(-50%, -50%); transition: left 0.5s cubic-bezier(0.3, 0, 0.2, 1); z-index: 2; }
4355.CreditSlider-thumbHalo-f8416 { position: absolute; inset: 0px; border-radius: 50%; background: radial-gradient(circle,color-mix(in srgb,var(--control-colors-text-active) 55%,transparent) 0%,transparent 70%); pointer-events: none; animation: 0.6s cubic-bezier(0.25, 0.6, 0.3, 1) 0s 1 normal forwards running CreditSlider-thumbHaloAnim-00369; transform-origin: center center; }
4356.CreditSlider-thumbRipple-c34db { position: absolute; inset: 0px; border-radius: 50%; border: 1.5px solid color-mix(in srgb,var(--control-colors-text-active) 70%,transparent); pointer-events: none; animation: 0.6s cubic-bezier(0.2, 0.7, 0.3, 1) 0s 1 normal forwards running CreditSlider-thumbRippleAnim-6740e; transform-origin: center center; }
4357.CreditSlider-labelsRow-ab631 { position: relative; width: 100%; height: var(--typography-t5-line-height); }
4358.CreditSlider-label-88529 { position: absolute; top: 0px; appearance: none; background: none; border: 0px; padding: 0px; margin: 0px; cursor: pointer; color: var(--text-colors-tint-1); font-weight: 600; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); transition: color 0.3s; white-space: nowrap; font-variant-numeric: tabular-nums; }
4359.CreditSlider-labelActive-53382 { color: var(--text-colors-base); }
4360.CreditSlider-labelFirst-326db { text-align: left; }
4361.CreditSlider-labelLast-5f281 { text-align: right; }
4362.CreditSlider-labelCurrent-f93e5 { cursor: not-allowed; opacity: 0.5; }
4363.CreditSlider-currentNote-53668 { display: block; color: inherit; font-weight: 500; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
4364.FixedCreditsLine-fixedCreditsLine-2b7e1 { font-weight: 500; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-1); justify-content: flex-start; align-items: center; gap: var(--spacings-s8); display: flex; line-height: 1.5; }
4365.FixedCreditsLine-tickIcon-1ee65 { fill: var(--text-colors-tint-1); flex-shrink: 0; }
4366.AiModels-modelsTitle-6e149 { margin-bottom: var(--spacings-s24); }
4367.AiModels-modelsWrapper-2cd9f { flex-flow: column; gap: var(--spacings-s4); display: flex; }
4368@media screen and (min-width: 375px) {
4369  .AiModels-modelsWrapper-2cd9f { flex-flow: wrap; gap: var(--spacings-s8); }
4370}
4371.AiModels-modelChip-d8a2b { font-weight: 500; border-radius: var(--corner-radius-r4); background-color: unset; font-size: var(--typography-t5-font-size); color: var(--text-colors-base); padding: var(--spacings-s4); align-items: center; gap: var(--spacings-s8); display: flex; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
4372@media screen and (min-width: 375px) {
4373  .AiModels-modelChip-d8a2b { border: 1px solid var(--background-colors-border); background-color: var(--background-colors-tint-1); }
4374}
4375.AiModels-chipIcon-51b0d { fill: var(--chip-icon-color, var(--text-colors-base)); }
4376.AiModels-chipIcon-51b0d > path { fill: var(--chip-icon-color, var(--text-colors-base)); }
4377.AiModels-tier-max_performance-665ef { --chip-icon-color: var(--monetization-pro-colors-base-default); }
4378.AiModels-tier-max_starter-25f5b { --chip-icon-color: var(--monetization-plus-colors-base-default); }
4379.AiModels-tier-power-62be7 { --chip-icon-color: var(--monetization-ultra-colors-base-default); }
4380.AiModels-tier-pro-e9032 { --chip-icon-color: var(--monetization-pro-colors-base-default); }
4381.AiModels-tier-plus-b04cc { --chip-icon-color: var(--monetization-plus-colors-base-default); }
4382.AiModels-tier-free-1b26e, .AiModels-tier-enterprise-3fff9 { --chip-icon-color: var(--text-colors-base); }
4383.AiModels-accordionToggle-7623c { color: var(--control-colors-text-default); justify-content: space-between; padding: var(--spacings-s0); }
4384.AiModels-divider-54e38 { width: 100%; margin: var(--spacings-s16) var(--spacings-s0); background-color: var(--control-colors-border-default); height: 1px; }
4385.AiModels-accordionContent-0158b { grid-template-rows: 0fr; transition: grid-template-rows 0.3s ease-in-out; display: grid; }
4386.AiModels-accordionContent-0158b.AiModels-expanded-303a1 { grid-template-rows: 1fr; }
4387.AiModels-accordionInner-37636 { overflow: hidden; min-height: 0px; }
4388.ModelAccessSection-root-78fff { background-color: var(--background-colors-tint-1); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r16); flex-direction: column; padding: var(--spacings-s16); gap: var(--spacings-s16); display: flex; }
4389.ModelAccessSection-rootPower-fc5e1 { background-color: var(--monetization-ultra-colors-alpha-10); }
4390.ModelAccessSection-header-fb8ef { justify-content: space-between; align-items: center; display: flex; gap: var(--spacings-s8); }
4391.ModelAccessSection-headerTitle-3728b { align-items: center; display: flex; gap: var(--spacings-s6); min-width: 0px; }
4392.ModelAccessSection-infoIcon-84db9 { fill: var(--text-colors-tint-1); flex-shrink: 0; height: var(--spacings-s16); width: var(--spacings-s16); }
4393.ModelAccessSection-tooltip-3ef99 { font-weight: 500; text-align: center; max-width: 188px; }
4394.ModelAccessSection-models-ff376 { flex-direction: column; gap: var(--spacings-s12); list-style: none; display: flex; padding: 0px; margin: 0px; }
4395.ModelAccessSection-modelRow-7f971 { justify-content: space-between; align-items: center; gap: var(--spacings-s8); display: flex; }
4396.ModelAccessSection-modelChips-eeaac { align-items: center; gap: var(--spacings-s12); flex-wrap: wrap; list-style: none; display: flex; padding: 0px; margin: 0px; }
4397.ModelAccessSection-modelChip-2b8f8 { align-items: center; gap: var(--spacings-s8); display: flex; }
4398.ModelAccessSection-chipTag-87d6f { background-color: var(--background-colors-tint-3); color: var(--text-colors-base); white-space: nowrap; }
4399.ModelAccessSection-chipTag-87d6f svg { fill: var(--text-colors-base); }
4400.ModelAccessSection-modelInfo-cb603 { align-items: center; display: flex; gap: var(--spacings-s6); min-width: 0px; }
4401.ModelAccessSection-modelIcon-6120a { fill: var(--text-colors-base); flex-shrink: 0; height: 20px; width: 20px; }
4402.ModelAccessSection-modelIcon-6120a > path { fill: var(--text-colors-base); }
4403.ModelAccessSection-modelName-9b816 { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
4404.ModelAccessSection-tag-54092 { flex-shrink: 0; white-space: nowrap; }
4405.ModelAccessSection-valueTag-03cbc { background-color: var(--background-colors-tint-3); color: var(--text-colors-base); flex-shrink: 0; white-space: nowrap; }
4406.Header-headerImg-4db53 { margin: var(--spacings-s0) auto var(--spacings-s16); display: block; width: auto; height: 24px; }
4407@media screen and (min-width: 1024px) {
4408  .Header-headerImg-4db53 { height: 18px; }
4409}
4410@media screen and (min-width: 1281px) {
4411  .Header-headerImg-4db53 { height: 24px; }
4412}
4413.Header-headerImgEnterprise-8e412 { margin-bottom: var(--spacings-s8); height: 32px; }
4414@media screen and (min-width: 1024px) {
4415  .Header-headerImgEnterprise-8e412 { height: 24px; }
4416}
4417@media screen and (min-width: 1281px) {
4418  .Header-headerImgEnterprise-8e412 { height: 32px; }
4419}
4420.Header-header-534fe { width: 100%; display: flex; align-items: center; gap: var(--spacings-s8); }
4421.Header-title-506b2 { color: var(--text-colors-base); font-weight: 700; line-height: var(--typography-t9-line-height); font-size: var(--typography-t9-font-size); }
4422@media screen and (min-width: 1281px) {
4423  .Header-title-506b2 { font-size: var(--typography-t9-font-size); }
4424}
4425.Header-tier-max_performance-46cd8 { color: var(--monetization-pro-colors-base-default); }
4426.Header-tier-max_starter-b91be { color: var(--monetization-plus-colors-base-default); }
4427.Header-tier-power-88f5c { color: var(--monetization-ultra-colors-base-default); }
4428.Header-tier-pro-7fb45 { color: var(--monetization-pro-colors-base-default); }
4429.Header-tier-plus-2a0ea { color: var(--monetization-plus-colors-base-default); }
4430.Header-tier-free-9fb2e, .Header-tier-enterprise-4adf0 { color: var(--text-colors-base); }
4431.Header-titleGradient-d92d0 { -webkit-text-fill-color: transparent; background-clip: text; background-image: linear-gradient(90deg, rgb(36, 199, 194), rgb(0, 153, 148)); }
4432.Header-tag-5a338 { flex-shrink: 0; white-space: nowrap; }
4433@keyframes Price-fadeSwap-1e6ea { 
4434  0% { opacity: 0; translate: 0px 8px; }
4435  100% { opacity: 1; translate: 0px; }
4436}
4437.Price-swapAnimated-43575 { animation: 0.8s ease 0s 1 normal backwards running Price-fadeSwap-1e6ea; }
4438.Price-prices-33f1a { display: flex; flex-direction: column; justify-content: space-between; margin-bottom: var(--spacings-s16); }
4439@media screen and (min-width: 1024px) {
4440  .Price-prices-33f1a { min-height: 0px; }
4441}
4442@media screen and (min-width: 1024px) {
4443  .Price-prices-33f1a.Price-hasChildren-c9e1c { min-height: 90px; }
4444}
4445.Price-prices-33f1a em { color: var(--price-accent); font-style: inherit; }
4446.Price-priceContainer-db8c8 { flex-grow: 1; }
4447.Price-tier-max_performance-f4b0f { --price-accent: var(--monetization-pro-colors-base-default); }
4448.Price-tier-max_starter-b2899 { --price-accent: var(--monetization-plus-colors-base-default); }
4449.Price-tier-power-886b7 { --price-accent: var(--monetization-ultra-colors-base-default); }
4450.Price-tier-pro-b9f31 { --price-accent: var(--monetization-pro-colors-base-default); }
4451.Price-tier-plus-c283e { --price-accent: var(--monetization-plus-colors-base-default); }
4452.Price-tier-free-37b5a, .Price-tier-enterprise-eb7c7 { --price-accent: var(--text-colors-base); }
4453.Price-pricesGradientEm-51671 em { -webkit-text-fill-color: transparent; background-clip: text; background-image: linear-gradient(90deg, rgb(36, 199, 194), rgb(0, 153, 148)); }
4454.Price-monthlyPrice-57018 { font-size: var(--typography-t10-font-size); font-weight: 700; line-height: var(--typography-t8-line-height); align-items: baseline; gap: var(--spacings-s4); display: flex; }
4455.Price-monthlyPrice-57018 s { font-weight: 500; font-size: var(--typography-t8-font-size); color: var(--text-colors-tint-1); line-height: 1; }
4456@media screen and (min-width: 1024px) {
4457  .Price-monthlyPriceEnterprise-3e9da { font-size: var(--typography-t9-font-size); }
4458}
4459.Price-contactSalesPrice-4a646 { font-size: var(--typography-t7-font-size); font-weight: 700; line-height: var(--typography-t8-line-height); display: flex; align-items: center; flex-wrap: wrap; gap: var(--spacings-s4); }
4460.Price-priceFrequency-70be3 { font-size: var(--typography-t7-font-size); line-height: 24px; }
4461.Price-pricingNote-e5ee1 { font-weight: 500; font-size: var(--typography-t5-font-size); color: var(--text-colors-tint-1); line-height: 1.5; margin-top: auto; }
4462.Price-infoBox-2fcea { justify-content: space-between; font-weight: 500; font-size: var(--typography-t5-font-size); color: var(--text-colors-tint-1); align-items: flex-end; gap: var(--spacings-s8); display: flex; line-height: 1.5; }
4463.InlinePricingCard-topSection-e7d58 { align-items: center; justify-content: space-between; gap: var(--spacings-s24); display: flex; }
4464.InlinePricingCard-leftSide-4adce { flex-direction: column; gap: var(--spacings-s4); display: flex; max-width: 400px; flex: 1 1 0%; }
4465.InlinePricingCard-rightSide-68a31 { flex: 1 1 0%; }
4466.InlinePricingCard-rightSide-68a31 > div { margin-bottom: var(--spacings-s0); width: 100%; }
4467.InlinePricingCard-packageSelectorContainer-02305 { flex-direction: column; align-items: flex-end; gap: var(--spacings-s8); display: flex; width: 284px; }
4468.InlinePricingCard-addCreditsLine-3847d { margin-top: var(--spacings-s0); }
4469.InlinePricingCard-credits-8dcdb { margin-bottom: var(--spacings-s16); }
4470.InlinePricingCard-packageSelector-bb9cb { width: 100%; margin-bottom: var(--spacings-s0); }
4471.InlinePricingCard-price-c23fc { margin-top: var(--spacings-s8); }
4472.InlinePricingCard-actionButton-e75c1 { margin-top: var(--spacings-s2); }
4473.InlinePricingCard-description-ce235 { font-weight: 500; font-size: var(--typography-t5-font-size); color: var(--text-colors-tint-1); line-height: 1.5; }
4474.InlinePricingCard-prorateNote-7e0f5 { margin-top: var(--spacings-s8); font-weight: 500; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-1); align-items: center; gap: var(--spacings-s4); display: flex; line-height: 1.5; }
4475.InlinePricingCard-prorateNote-7e0f5 svg { fill: var(--text-colors-tint-1); }
4476.InlinePricingCard-divider-68968 { margin: var(--spacings-s24) var(--spacings-s0); background-color: var(--control-colors-border-default); height: 1px; }
4477.InlinePricingCard-modelAccessSections-a542e { margin-bottom: var(--spacings-s24); align-items: stretch; gap: var(--spacings-s16); display: flex; }
4478.InlinePricingCard-modelAccessSections-a542e > * { min-width: 0px; }
4479.InlinePricingCard-trendingModelsBlock-7ffab { flex: 3 1 0px; }
4480.InlinePricingCard-freeAccessBlock-04a55 { flex: 2 1 0px; }
4481.InlinePricingCard-benefitsColumns-ab3a9 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacings-s16); }
4482@media screen and (min-width: 1024px) {
4483  .InlinePricingCard-benefitsColumns-ab3a9 { gap: var(--spacings-s24); }
4484}
4485.VerticalPricingCard-card-16ef9 { max-width: 536px; width: 100%; margin-left: auto; margin-right: auto; }
4486.VerticalPricingCard-description-b7f84 { font-weight: 500; margin-bottom: var(--spacings-s16); font-size: var(--typography-t5-font-size); color: var(--text-colors-tint-1); line-height: 1.5; }
4487@media screen and (min-width: 1024px) {
4488  .VerticalPricingCard-description-b7f84 { margin-bottom: var(--spacings-s4); min-height: var(--spacings-s48); }
4489}
4490.VerticalPricingCard-priceSuffix-5b98e { align-self: center; }
4491.VerticalPricingCard-creditsBox-6e126 { margin-bottom: var(--spacings-s24); }
4492.VerticalPricingCard-savingText-a466b { font-weight: 600; font-size: var(--typography-t5-font-size); line-height: 1.5; }
4493.VerticalPricingCard-savingTextSmall-79c0f { padding: var(--spacings-s8); height: auto; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
4494.VerticalPricingCard-prorateNote-e7658 { margin-bottom: var(--spacings-s0); margin-top: var(--spacings-s16); font-weight: 500; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-1); align-items: center; gap: var(--spacings-s4); display: flex; line-height: 1.5; }
4495.VerticalPricingCard-prorateNote-e7658 svg { fill: var(--text-colors-tint-1); }
4496.VerticalPricingCard-actionButton-8550a { margin-bottom: var(--spacings-s16); }
4497.VerticalPricingCard-ctaFirstActions-083c4 { background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r20); flex-direction: column; display: flex; gap: var(--spacings-s0); }
4498.VerticalPricingCard-ctaFirstActions-083c4:not(:empty) { margin-bottom: var(--spacings-s16); }
4499.VerticalPricingCard-benefitViewMoreBtn-3687b { font-weight: 700; text-decoration: underline; font-size: var(--typography-t4-font-size); color: var(--positive-colors-text-default); padding: var(--spacings-s0); align-items: center; background: none; cursor: pointer; gap: var(--spacings-s8); display: flex; line-height: 1.5; }
4500.VerticalPricingCard-expandedViewActions-919e3 { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.3s ease-in-out; }
4501.VerticalPricingCard-expandedViewActions-919e3.VerticalPricingCard-expanded-a82db { grid-template-rows: 1fr; }
4502.VerticalPricingCard-expandedViewActionsInner-19a3b { min-height: 0px; overflow: hidden; }
4503.VerticalPricingCard-collapsedViewActions-fdb60 { display: grid; grid-template-rows: 1fr; transition: grid-template-rows 0.3s ease-in-out; }
4504.VerticalPricingCard-collapsedViewActions-fdb60.VerticalPricingCard-expanded-a82db { grid-template-rows: 0fr; }
4505.VerticalPricingCard-collapsedViewActionsInner-fe7f7 { overflow: hidden; min-height: 0px; }
4506.VerticalPricingCard-collapsedViewActionsContent-bec84 { transform: translateY(0px); transition: transform 0.3s ease-in-out; flex-direction: column; display: flex; }
4507.VerticalPricingCard-collapsedViewActionsContent-bec84.VerticalPricingCard-expanded-a82db { transform: translateY(-100%); }
4508.VerticalPricingCard-divider-cc972 { margin: var(--spacings-s16) var(--spacings-s0); background-color: var(--control-colors-border-default); height: 1px; }
4509.VerticalPricingCard-divider-cc972.VerticalPricingCard-expanded-a82db { margin: var(--spacings-s24) var(--spacings-s0); }
4510.VerticalPricingCard-modelAccessWrapper-71f51 { grid-template-rows: 0fr; transition: grid-template-rows 0.3s ease-in-out; display: grid; }
4511.VerticalPricingCard-modelAccessWrapper-71f51.VerticalPricingCard-expanded-a82db { grid-template-rows: 1fr; }
4512.VerticalPricingCard-modelAccessWrapperInner-d59c0 { overflow: hidden; min-height: 0px; }
4513.VerticalPricingCard-modelAccessSections-eb515 { flex-direction: column; margin-top: var(--spacings-s16); gap: var(--spacings-s12); display: flex; }
4514.VerticalPricingCard-featuresWrapper-1e5d5 { margin-bottom: var(--spacings-s0); grid-template-rows: 0fr; transition: grid-template-rows 0.3s ease-in-out; display: grid; }
4515.VerticalPricingCard-featuresWrapper-1e5d5.VerticalPricingCard-expanded-a82db { margin-bottom: var(--spacings-s16); grid-template-rows: 1fr; }
4516.VerticalPricingCard-featuresWrapperInner-8307a { overflow: hidden; min-height: 0px; }
4517.MiniPricingCard-description-dc94b { font-weight: 500; margin-bottom: var(--spacings-s16); font-size: var(--typography-t5-font-size); color: var(--text-colors-tint-1); line-height: 1.5; }
4518.MiniPricingCard-card-d9c5e { margin-bottom: var(--spacings-s0) !important; }
4519.MiniPricingCard-creditsBox-8e200 > div:last-child { min-height: var(--spacings-s0); }
4520.MiniPricingCard-usage-98327 { margin-block: var(--spacings-s16); }
4521.MiniPricingCard-usageHeader-c11e5 { justify-content: space-between; align-items: center; margin-bottom: var(--spacings-s12); display: flex; gap: var(--spacings-s8); }
4522.MiniPricingCard-usageLabel-48202 { font-weight: 600; line-height: var(--typography-t4-line-height); font-size: var(--typography-t4-font-size); color: var(--text-colors-base); }
4523.MiniPricingCard-usageValue-99ce5 { font-weight: 600; line-height: var(--typography-t4-line-height); font-size: var(--typography-t4-font-size); white-space: nowrap; }
4524.MiniPricingCard-tier-max_performance-60b63 { color: var(--monetization-pro-colors-base-default); }
4525.MiniPricingCard-tier-max_starter-2ced9 { color: var(--monetization-plus-colors-base-default); }
4526.MiniPricingCard-tier-power-b49a2 { color: var(--monetization-ultra-colors-base-default); }
4527.MiniPricingCard-tier-pro-cc651 { color: var(--monetization-pro-colors-base-default); }
4528.MiniPricingCard-tier-plus-bc57c { color: var(--monetization-plus-colors-base-default); }
4529.MiniPricingCard-tier-free-49f27, .MiniPricingCard-tier-enterprise-be26c { color: var(--text-colors-base); }
4530.MiniPricingCard-usageProgress-780f9 { --progress-status: var(--text-colors-base); }
4531.MiniPricingCard-mobileCreditsBox-17184 { border: 1px solid var(--control-colors-border-default); border-radius: var(--corner-radius-r16); margin-bottom: var(--spacings-s24); padding: var(--spacings-s12); flex-direction: column; gap: var(--spacings-s16); display: flex; }
4532.MiniPricingCard-mobileCreditsLine-6d06a { margin-top: var(--spacings-s0); }
4533.MiniPricingCard-infoBox-5dca5 { display: none; }
4534.MiniPricingCard-price-691ed { margin-bottom: var(--spacings-s16); min-height: auto !important; }
4535.MiniPricingCard-actionButton-c33a4 { margin-bottom: var(--spacings-s8); }
4536.MiniPricingCard-savingText-af746 { margin-top: var(--spacings-s0); }
4537.PricingCards-container-7e031 { padding: var(--spacings-s0) var(--spacings-s24); }
4538@media screen and (max-width: 766px) {
4539  .PricingCards-container-7e031 { padding: var(--spacings-s0) var(--spacings-s12); }
4540}
4541.PricingCards-containerTop-b2e1e { justify-content: center; margin-bottom: var(--spacings-s32); display: flex; }
4542@media screen and (max-width: 1365px), screen and (max-height: 767px) {
4543  .PricingCards-containerTop-b2e1e { margin-bottom: var(--spacings-s24); }
4544}
4545.PricingCards-cardsContainer-5bd1d { --card-track: 1fr; grid-template-columns: 1fr; margin-bottom: var(--spacings-s24); justify-content: center; flex-direction: column; display: grid; }
4546.PricingCards-cardsContainer-5bd1d > * { border-radius: var(--corner-radius-r16); }
4547@media screen and (min-width: 1024px) {
4548  .PricingCards-cardsContainer-5bd1d { grid-template-columns: repeat(var(--cards-count-md),var(--card-track)); padding-bottom: var(--spacings-s24); margin-bottom: var(--spacings-s72); flex-direction: row; gap: var(--spacings-s16); }
4549}
4550@media screen and (min-width: 1366px) {
4551  .PricingCards-cardsContainer-5bd1d { grid-template-columns: repeat(var(--cards-count),var(--card-track)); }
4552}
4553.PricingCards-verticalCards-03b4c { --card-track: minmax(0, 536px); }
4554.PricingCards-fourCards-d67cc { grid-template-areas: "power" "free" "pro" "enterprise"; }
4555@media screen and (min-width: 1024px) {
4556  .PricingCards-fourCards-d67cc { grid-template-areas: "pro power" "free enterprise"; }
4557}
4558@media screen and (min-width: 1366px) {
4559  .PricingCards-fourCards-d67cc { grid-template-areas: "free pro power enterprise"; }
4560}
4561.PricingCards-frequencyToggleSegments-61303 { margin: var(--spacings-s12) auto var(--spacings-s0); }
4562.PricingCards-highlighted-95eb4 { --pricing-cards-highlighted: 1; }
4563.PricingCards-firstOnMobile-e5157 { order: -1; }
4564@media screen and (min-width: 1024px) {
4565  .PricingCards-firstOnMobile-e5157 { order: 0; }
4566}
4567.PricingCards-card-21143 { margin-top: var(--spacings-s0); margin-bottom: var(--spacings-s32); }
4568@media screen and (min-width: 1024px) {
4569  .PricingCards-card-21143 { margin-bottom: var(--spacings-s0); flex-shrink: 1; margin-top: var(--spacings-s16); }
4570}
4571.WelcomeView-root-99105 { justify-content: center; align-items: center; position: relative; overflow: hidden; min-height: 100%; display: flex; width: 100%; }
4572.WelcomeView-content-56c68 { padding: var(--spacings-s44) var(--spacings-s48) var(--spacings-s24); align-items: center; text-align: center; justify-content: center; flex-direction: column; margin: 0px auto; max-width: 100%; display: flex; height: 100%; width: 640px; z-index: 1; }
4573.WelcomeView-content-56c68.WelcomeView-mobile-4e486 { padding: var(--spacings-s44) var(--spacings-s32) 140px; }
4574.WelcomeView-content-56c68.WelcomeView-creditsMobile-d4be6 { align-items: initial; }
4575.WelcomeView-logo-7face { height: 42px; margin-bottom: var(--spacings-s32); width: auto; }
4576.WelcomeView-credits-9b844 { background: linear-gradient(58deg, rgb(3, 2, 182) -40.37%, rgb(255, 52, 249) 81.3%) text; -webkit-text-fill-color: transparent; font-weight: 600; margin-bottom: var(--spacings-s32); letter-spacing: -2px; line-height: 1; font-size: 56px; }
4577.WelcomeView-description-1363f { font-size: var(--typography-t6-font-size); font-weight: 500; color: var(--text-colors-tint-1); line-height: 1.4; margin: 0px; }
4578.WelcomeView-description-1363f.WelcomeView-mobile-4e486 { font-size: var(--typography-t5-font-size); }
4579.WelcomeView-space-5f1ad { flex-grow: 1; }
4580.WelcomeView-imageWrapper-ce76a { margin-bottom: var(--spacings-s24); justify-content: center; align-items: center; display: flex; max-height: 200px; }
4581.WelcomeView-confetti-719e3 { position: absolute; z-index: 0; scale: 2; inset: 0px; }
4582@media (orientation: portrait) {
4583  .WelcomeView-confetti-719e3 { scale: 3; }
4584}
4585.WelcomeView-title-db111 { font-weight: 700; margin-bottom: var(--spacings-s32); font-size: var(--typography-t6-font-size); color: var(--text-colors-base); line-height: 1.4; }
4586.WelcomeView-qrBlock-67878 { border: 1px solid var(--primary-colors-base-default); justify-content: space-between; background: var(--background-colors-tint-2); border-radius: var(--corner-radius-r16); margin-top: var(--spacings-s32); align-items: center; display: flex; max-width: 648px; width: 100%; }
4587.WelcomeView-qrText-b34b3 { color: var(--primary-colors-base-default); font-weight: 500; border-radius: var(--corner-radius-r16); font-size: var(--typography-t6-font-size); padding: var(--spacings-s24); line-height: 1.4; max-width: 400px; flex-grow: 1; }
4588.WelcomeView-qrImgContainer-ac706 { padding: var(--spacings-s32) var(--spacings-s32) var(--spacings-s32) var(--spacings-s0); flex-shrink: 0; }
4589.WelcomeView-qrImg-5f72b { max-width: 100px; }
4590.WelcomeView-footer-aca93 { grid-template-columns: 1fr; margin-top: var(--spacings-s16); gap: var(--spacings-s8); display: grid; width: 100%; }
4591.WelcomeView-footer-aca93.WelcomeView-creditsView-88934 { margin-bottom: var(--spacings-s48); }
4592.WelcomeView-letsGoButton-65ca0 { margin-top: var(--spacings-s16); max-width: 100%; min-width: 328px; }
4593.WelcomeView-letsGoButton-65ca0.WelcomeView-mobile-4e486 { min-width: 100%; }
4594.WelcomeView-image-e29d6 { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
4595.WelcomeView-hidden-69882 { display: none; }
4596.DiscountTicket-container-94224 { position: relative; height: 194px; max-width: 100%; width: 378px; }
4597.DiscountTicket-ticket-ebc50 { background-repeat: no-repeat; background-position: center center; background-size: contain; justify-content: center; flex-direction: column; padding: var(--spacings-s24); align-items: center; position: relative; height: 194px; max-width: 378px; width: 100%; text-align: center; display: flex; z-index: 2; scale: 1; }
4598.DiscountTicket-ticket-ebc50.DiscountTicket-transparent-02915 { scale: 1.4; }
4599.DiscountTicket-title-bc80e { color: var(--absolute-white-colors-base-default); font-weight: 600; font-size: var(--typography-t7-font-size); line-height: 1.32; }
4600.DiscountTicket-discount-49a69 { color: var(--absolute-white-colors-base-default); font-weight: 600; font-size: var(--typography-t10-font-size); line-height: 1.2; }
4601.DiscountTicket-product-c30c5 { color: var(--absolute-white-colors-base-default); font-weight: 600; font-size: var(--typography-t7-font-size); line-height: 1.32; }
4602.DiscountTicket-transparent-02915 .DiscountTicket-discount-49a69 { font-size: var(--typography-t11-font-size); line-height: 1; }
4603.DiscountTicket-magenta-d9642 .DiscountTicket-title-bc80e, .DiscountTicket-magenta-d9642 .DiscountTicket-discount-49a69, .DiscountTicket-magenta-d9642 .DiscountTicket-product-c30c5 { color: var(--absolute-black-colors-base-default); }
4604.DiscountTicket-bgGradient-dce3b { transform: translate(-50%, -50%); background: var(--gradients-general-brand); position: absolute; filter: blur(57px); border-radius: 50%; left: 50%; top: 50%; height: 284px; width: 284px; z-index: 1; }
4605.Authentication-root-1015a { padding-bottom: var(--spacings-s16); padding-top: var(--spacings-s40); flex-direction: column; display: flex; width: 100%; padding-left: var(--spacings-s40); padding-right: var(--spacings-s40); }
4606@media screen and (max-width: 766px) {
4607  .Authentication-root-1015a { padding-bottom: var(--spacings-s16); padding-top: var(--spacings-s48); }
4608}
4609.Authentication-title-b6f6a { margin-bottom: var(--spacings-s24); }
4610.Authentication-registration-858fb { background: none; flex-grow: 1; padding: 0px; overflow: visible; }
4611.Authentication-registration-858fb form { overflow: auto; height: 100%; }
4612.Authentication-registration-858fb.Authentication-campaignWithMedia-23c91 form { height: auto; }
4613.Authentication-registration-858fb h2, .Authentication-registration-858fb h3 { font-weight: 700; font-size: var(--typography-t6-font-size); color: var(--text-colors-base); line-height: 1.4; display: flex; gap: var(--spacings-s12); align-items: center; margin-bottom: var(--spacings-s0); text-align: start; }
4614.Authentication-media-16b1d { width: 100%; display: flex; justify-content: center; align-items: center; }
4615.PackageCard-root-1e07e { display: inline-flex; align-items: stretch; position: relative; cursor: pointer; }
4616.PackageCard-radioButton-c66c1 { display: block; position: absolute; z-index: 1; top: 0px; left: 0px; width: 100%; height: 100%; border-radius: var(--corner-radius-r16); margin: var(--spacings-s0); padding: var(--spacings-s0); cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; appearance: none; }
4617.PackageCard-card-81493 { background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r16); padding: var(--spacings-s12) var(--spacings-s16); position: relative; overflow: hidden; width: 100%; display: flex; align-items: center; justify-content: space-between; box-shadow: inset 0 0 0 1px var(--background-colors-border); }
4618@media screen and (max-width: 766px) {
4619  .PackageCard-card-81493 { box-shadow: inset 0 0 0 1px var(--background-colors-border); }
4620}
4621.PackageCard-ribbonSelected-61609 { background-color: var(--primary-colors-base-default) !important; color: var(--negative-colors-text-default) !important; border-color: var(--primary-colors-base-default) !important; }
4622.PackageCard-cardSelected-cfd15 { box-shadow: inset 0 0 0 2px var(--primary-colors-base-default); }
4623.PackageCard-planInfo-a89e5 { display: flex; flex-direction: column; }
4624.PackageCard-creditCount-b4be3 { font-weight: 700; font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); color: var(--text-colors-base); }
4625@media screen and (max-width: 766px) {
4626  .PackageCard-creditCount-b4be3 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
4627}
4628.PackageCard-creditCountInactive-beece { color: var(--text-colors-tint-1); }
4629.PackageCard-totalPrice-90041 { font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); }
4630@media screen and (max-width: 766px) {
4631  .PackageCard-totalPrice-90041 { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
4632}
4633.PackageCard-totalPriceInactive-b00d0 { color: var(--text-colors-tint-2); }
4634.PackageCard-pricePerCredit-5aca2 { font-weight: 700; font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); color: var(--text-colors-base); }
4635@media screen and (max-width: 766px) {
4636  .PackageCard-pricePerCredit-5aca2 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
4637}
4638.PackageCard-pricePerCreditInactive-71f0b { color: var(--text-colors-tint-1); }
4639.PackageCard-ribbon-42e09 { position: absolute; top: -1px; right: -1px; background-color: var(--background-colors-tint-2); color: var(--text-colors-tint-1); border: 1px solid var(--background-colors-border); font-weight: 600; font-size: var(--typography-t2-font-size); line-height: var(--typography-t2-line-height); padding: var(--spacings-s4) var(--spacings-s10); border-bottom-left-radius: var(--corner-radius-r16); border-top-right-radius: var(--corner-radius-r16); }
4640@keyframes OtpPackagesV2Content-fadeIn-40183 { 
4641  0% { opacity: 0; translate: 0px 24px; }
4642  100% { opacity: 1; translate: 0px; }
4643}
4644.OtpPackagesV2Content-selectorWrapper-45c19 { backdrop-filter: blur(10px); border-radius: var(--corner-radius-r16); margin-top: var(--spacings-s8); flex-direction: column; padding: var(--spacings-s24); align-items: center; display: flex; width: 100%; max-width: 524px; border: 1px solid var(--background-colors-border); }
4645@media screen and (max-width: 766px) {
4646  .OtpPackagesV2Content-selectorWrapper-45c19 { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 0px; padding: 0px; max-width: 100%; flex-grow: 1; }
4647}
4648.OtpPackagesV2Content-packages-ccb6f { display: flex; flex-direction: column; gap: var(--spacings-s8); width: 100%; flex-grow: 1; margin-bottom: var(--spacings-s32); }
4649@media screen and (max-width: 766px) {
4650  .OtpPackagesV2Content-packages-ccb6f { margin-bottom: 0px; }
4651}
4652.OtpPackagesV2Content-animated-2f56e { animation: 0.4s ease 0s 1 normal backwards running OtpPackagesV2Content-fadeIn-40183; }
4653.OtpPackagesV2Content-ctaSection-1fd0f { width: 100%; display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s8); }
4654.OtpPackagesV2Content-ctaButton-c8f27 { width: 100%; }
4655.OtpPackagesV2Content-footerNote-b750e { font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--text-colors-tint-1); line-height: var(--typography-t4-line-height); text-align: center; }
4656.PlanCard-root-82728 { display: inline-flex; align-items: stretch; position: relative; cursor: pointer; }
4657.PlanCard-radioButton-76b43 { display: block; position: absolute; z-index: 1; top: 0px; left: 0px; width: 100%; height: 100%; border-radius: var(--corner-radius-r16); margin: var(--spacings-s0); padding: var(--spacings-s0); cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; appearance: none; }
4658.PlanCard-card-f32ec { background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r16); padding: var(--spacings-s24) var(--spacings-s16); position: relative; overflow: hidden; width: 100%; display: flex; align-items: center; justify-content: space-between; box-shadow: inset 0 0 0 1px var(--background-colors-border); }
4659@media screen and (max-width: 766px) {
4660  .PlanCard-card-f32ec { box-shadow: inset 0 0 0 1px var(--background-colors-border); }
4661}
4662.PlanCard-ribbonSelected-0c374 { background-color: var(--primary-colors-base-default) !important; color: var(--negative-colors-text-default) !important; border-color: var(--primary-colors-base-default) !important; }
4663.PlanCard-cardSelected-a74c6 { box-shadow: inset 0 0 0 2px var(--primary-colors-base-default); }
4664.PlanCard-planInfo-3a232 { display: flex; flex-direction: column; }
4665.PlanCard-creditCount-f02cb { font-weight: 700; font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); color: var(--text-colors-base); }
4666@media screen and (max-width: 766px) {
4667  .PlanCard-creditCount-f02cb { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
4668}
4669.PlanCard-creditCountInactive-90db6 { color: var(--text-colors-tint-1); }
4670.PlanCard-totalPrice-f12a6 { font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); }
4671@media screen and (max-width: 766px) {
4672  .PlanCard-totalPrice-f12a6 { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
4673}
4674.PlanCard-totalPriceInactive-68fe0 { color: var(--text-colors-tint-2); }
4675.PlanCard-pricePerCredit-6dbda { font-weight: 700; font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); color: var(--text-colors-base); }
4676@media screen and (max-width: 766px) {
4677  .PlanCard-pricePerCredit-6dbda { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
4678}
4679.PlanCard-pricePerCreditInactive-4550d { color: var(--text-colors-tint-1); }
4680.PlanCard-ribbon-67bcc { position: absolute; top: -1px; right: -1px; background-color: var(--background-colors-tint-2); color: var(--text-colors-tint-1); border: 1px solid var(--background-colors-border); font-weight: 600; font-size: var(--typography-t2-font-size); line-height: var(--typography-t2-line-height); padding: var(--spacings-s4) var(--spacings-s10); border-bottom-left-radius: var(--corner-radius-r16); border-top-right-radius: var(--corner-radius-r16); }
4681.AppPlansContent-selectorWrapper-ea8df { backdrop-filter: blur(10px); border-radius: var(--corner-radius-r16); margin-top: var(--spacings-s32); flex-direction: column; padding: var(--spacings-s24); align-items: center; display: flex; width: 100%; max-width: 524px; border: 1px solid var(--background-colors-border); }
4682@media screen and (max-width: 766px) {
4683  .AppPlansContent-selectorWrapper-ea8df { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 0px; padding: 0px; max-width: 100%; flex-grow: 1; }
4684}
4685.AppPlansContent-plans-a2b9d { display: flex; flex-direction: column; gap: var(--spacings-s8); width: 100%; flex-grow: 1; margin-bottom: var(--spacings-s32); }
4686@media screen and (max-width: 766px) {
4687  .AppPlansContent-plans-a2b9d { margin-bottom: 0px; }
4688}
4689.AppPlansContent-ctaSection-71ba0 { width: 100%; display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s8); }
4690.AppPlansContent-ctaButton-0f9c8 { width: 100%; }
4691.AppPlansContent-footerNote-927bd { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); font-weight: 600; color: var(--text-colors-tint-1); text-align: center; }
4692.MobileOrderSummary-sentinel-25939 { height: 36px; margin-bottom: -36px; flex-shrink: 0; pointer-events: none; }
4693.MobileOrderSummary-bar-ef3d2 { position: sticky; top: 0px; z-index: 6; padding-top: 32px; margin-bottom: -88px; flex-shrink: 0; background-color: transparent; border-bottom: 1px solid transparent; transition: background-color 0.22s, border-color 0.22s; }
4694.MobileOrderSummary-barSolid-f7e31 { background-color: var(--background-colors-base); border-bottom-color: var(--background-colors-border); }
4695.MobileOrderSummary-barOpen-45b7a { background-color: var(--background-colors-popover); border-bottom-color: transparent; }
4696.MobileOrderSummary-barRow-a98c6 { display: flex; align-items: center; justify-content: space-between; gap: var(--spacings-s12); height: 56px; padding: 0 var(--spacings-s16); box-sizing: border-box; }
4697.MobileOrderSummary-brand-90b0f { min-width: 0px; }
4698.MobileOrderSummary-brand-90b0f.MobileOrderSummary-brand-90b0f > * { font-size: var(--typography-t5-font-size); }
4699.MobileOrderSummary-detailsToggle-fb1dc { display: inline-flex; align-items: center; gap: var(--spacings-s4); padding: var(--spacings-s0); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; cursor: pointer; color: var(--text-colors-base); }
4700.MobileOrderSummary-detailsToggleLabel-c7eab { text-decoration: underline; }
4701.MobileOrderSummary-chevron-b1ed9 { width: 16px; height: 16px; fill: currentcolor; transition: transform 0.25s; }
4702.MobileOrderSummary-chevronOpen-76fd1 { transform: rotate(180deg); }
4703.MobileOrderSummary-details-d0816 { position: absolute; top: 100%; left: 0px; right: 0px; z-index: 8; overflow: hidden; max-height: 0px; opacity: 0; pointer-events: none; background-color: var(--background-colors-popover); border-bottom: 1px solid var(--background-colors-border); border-radius: 0 0 var(--corner-radius-r16) var(--corner-radius-r16); transition: max-height 0.4s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.28s, box-shadow 0.3s; }
4704.MobileOrderSummary-detailsOpen-10736 { max-height: 800px; opacity: 1; pointer-events: auto; box-shadow: rgba(0, 0, 0, 0.45) 0px 24px 48px; }
4705.MobileOrderSummary-detailsContent-6c468 { display: flex; flex-direction: column; gap: var(--spacings-s16); padding: var(--spacings-s16); }
4706.MobileOrderSummary-taxesAfterSeats-46ac7.MobileOrderSummary-taxesAfterSeats-46ac7 { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; margin-top: var(--spacings-s0); padding-top: var(--spacings-s0); }
4707.MobileOrderSummary-detailsActions-90ebd { display: flex; justify-content: center; }
4708.MobileOrderSummary-hero-b33b0 { position: relative; flex-shrink: 0; background-color: var(--background-colors-tint-1); border-bottom: 1px solid var(--background-colors-border); }
4709.MobileOrderSummary-heroGlow-73c06 { position: absolute; inset: 0px; pointer-events: none; }
4710.MobileOrderSummary-heroContent-b9e68 { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--spacings-s4); padding: calc(88px + var(--spacings-s6)) var(--spacings-s16) var(--spacings-s16); }
4711.MobileOrderSummary-badge-8f3e2 { margin-bottom: var(--spacings-s4); }
4712.MobileOrderSummary-badge-8f3e2.MobileOrderSummary-badge-8f3e2 { background: var(--order-summary-accent); }
4713.MobileOrderSummary-priceRow-d2732 { display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: var(--spacings-s6); }
4714.MobileOrderSummary-viewDetails-da7f8 { display: flex; justify-content: center; padding-top: var(--spacings-s16); }
4715.CardVerificationInfo-root-b2de4 { display: flex; padding: var(--spacings-s8); gap: var(--spacings-s8); background: var(--background-colors-tint-2); border-radius: var(--spacings-s8); align-items: center; margin-top: var(--spacings-s24); }
4716.CardVerificationInfo-icon-f2fd0 { fill: var(--success-colors-base-default); }
4717.PromoCode-labelCont-f357f { padding: var(--spacings-s0); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; margin: var(--spacings-s24) var(--spacings-s0) var(--spacings-s8) var(--spacings-s0); cursor: pointer; }
4718.PromoCode-label-4ae50 { text-decoration: underline; }
4719.PromoCode-label-4ae50.PromoCode-label-4ae50 { font-weight: 600; color: var(--checkout-accent); cursor: pointer; }
4720.PromoCode-label-4ae50.PromoCode-label-4ae50:hover { color: var(--checkout-accent-action); }
4721.PromoCode-validationBlock-15c9c { min-height: 16px; margin: var(--spacings-s4) var(--spacings-s0); padding-left: var(--spacings-s4); }
4722.PromoCode-validationMessage-9c3ed { font-size: var(--typography-t3-font-size); }
4723.PromoCode-validationSuccess-5c559 { color: var(--success-colors-base-default); }
4724.PromoCode-validationFail-3c6b8 { color: var(--error-colors-base-default); }
4725.PromoCode-checkoutLabel-ab2d8 { font-weight: 600; font-size: var(--typography-t4-font-size); line-height: 1.4; margin-bottom: var(--spacings-s8); color: var(--text-colors-tint-1); }
4726.PromoCode-inputWrapper-019d8 { margin-top: var(--spacings-s8); }
4727.PaymentFormFooter-footer-22473 { padding-top: var(--spacings-s16); padding-bottom: var(--spacings-s16); bottom: 0px; border-bottom-left-radius: var(--corner-radius-r16); margin: var(--spacings-s0) calc(-1 * var(--spacings-s40)); }
4728@media screen and (max-width: 766px) {
4729  .PaymentFormFooter-footer-22473 { margin: var(--spacings-s0) calc(-1 * var(--spacings-s16)); }
4730}
4731.PaymentFormFooter-errorMsg-5b561 { margin: var(--spacings-s8) var(--spacings-s8) var(--spacings-s4); text-align: center; }
4732.PaymentFormFooter-terms-29ee2 { margin-top: var(--spacings-s8); }
4733.PaymentFormFooter-stepperContent-c11c9 { padding-left: var(--spacings-s40); padding-right: var(--spacings-s40); }
4734@media screen and (max-width: 766px) {
4735  .PaymentFormFooter-stepperContent-c11c9 { padding-left: var(--spacings-s16); padding-right: var(--spacings-s16); }
4736}
4737.CheckoutForm-root-7ca29 { display: flex; flex-direction: column; width: 100%; height: 100%; }
4738.CheckoutForm-combinedPlanSelector-d7ff6 { display: flex; gap: var(--spacings-s8); width: 100%; }
4739.CheckoutForm-formTopElement-5396f { display: flex; justify-content: center; align-items: center; }
4740.CheckoutForm-planSelector-8c29c { margin-bottom: var(--spacings-s12); }
4741.CheckoutForm-mainContainer-d4b36 { flex-grow: 1; display: flex; flex-direction: column; height: 100%; }
4742.CheckoutForm-content-83d5e { padding-top: var(--spacings-s40); padding-bottom: var(--spacings-s0); }
4743@media screen and (max-width: 766px) {
4744  .CheckoutForm-content-83d5e { padding-top: var(--spacings-s48); }
4745}
4746.CheckoutForm-content-83d5e { padding-bottom: var(--spacings-s16); padding-top: var(--spacings-s24); }
4747.CheckoutForm-contentBelowSummary-497c9.CheckoutForm-contentBelowSummary-497c9 { padding-top: var(--spacings-s16); }
4748.CheckoutForm-checkoutTitle-499ab { font-weight: 700; color: var(--text-colors-base); display: flex; gap: var(--spacings-s12); align-items: center; margin-bottom: var(--spacings-s16); font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
4749@media screen and (max-width: 766px) {
4750  .CheckoutForm-checkoutTitle-499ab { font-size: var(--typography-t7-font-size); line-height: var(--typography-t7-line-height); }
4751}
4752.CheckoutForm-scrollbars-ca25b { flex-grow: 1; }
4753.CheckoutForm-scrollbars-ca25b::after { width: calc(100% - var(--spacings-s40) - var(--spacings-s40)); display: none; background: var(--background-colors-tint-2); left: var(--spacings-s40); position: absolute; content: ""; bottom: 0px; height: 1px; }
4754.CheckoutForm-scrollbars-ca25b.CheckoutForm-scrollable-72b58::after { display: block; }
4755.CheckoutForm-scrollbars-ca25b.CheckoutForm-accordionForm-3f402 { border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; }
4756.CheckoutForm-track-1d371 { right: 8px; height: 100%; }
4757.CheckoutForm-thumb-97ee7 { border-radius: var(--corner-radius-r4); cursor: pointer; }
4758.CheckoutForm-adyenWrapper-cc84d { margin-top: var(--spacings-s16); }
4759.CheckoutForm-footerComponent-c0790 { width: 100%; display: flex; flex-direction: column; align-items: flex-start; }
4760.CheckoutForm-footerComponent-c0790 > div { width: 100%; }
4761.CheckoutForm-footerComponent-c0790 > button { margin: var(--spacings-s0); }
4762.CheckoutForm-checkoutDescription-2cbfa { margin-bottom: var(--spacings-s16); }
4763.CheckoutForm-priceInfoContainer-23b7c { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--spacings-s16); }
4764.CheckoutForm-paymentContainer-e90e3 { position: relative; width: 100%; }
4765.CheckoutForm-paymentContainer-e90e3.CheckoutForm-disabled-c1e35 { pointer-events: none; }
4766.CheckoutForm-paymentContainer-e90e3.CheckoutForm-disabled-c1e35::after { content: ""; display: block; width: 100%; position: absolute; top: 0px; bottom: 0px; height: 100%; background-color: var(--absolute-white-colors-base-default); border-radius: var(--corner-radius-r24); opacity: 0.7; }
4767.CheckoutForm-togglesPaymentMethods-1b1c8 { margin-bottom: var(--spacings-s16); }
4768.CheckoutForm-infoBox-df594 { margin: var(--spacings-s24) var(--spacings-s0); padding: var(--spacings-s8) var(--spacings-s16) var(--spacings-s12); border-radius: var(--corner-radius-r8); border: 2px solid var(--success-colors-base-default); color: var(--success-colors-base-default); font-size: var(--typography-t3-font-size); font-weight: 500; line-height: 1.33; }
4769.CheckoutForm-infoBoxTitle-ce972 { font-size: var(--typography-t4-font-size); font-weight: 600; line-height: 1.42; margin-bottom: var(--spacings-s4); }
4770.CheckoutForm-plans-e21af { margin-bottom: var(--spacings-s16); }
4771.CheckoutForm-recaptchaBranding-0e732 { margin-top: var(--spacings-s16); }
4772.CheckoutForm-recaptchaBranding-0e732 a { color: var(--checkout-accent); }
4773.CheckoutForm-recaptchaBranding-0e732 a:hover { color: var(--checkout-accent-action); }
4774.CheckoutForm-registrationForm-8dd0d.CheckoutForm-registrationForm-8dd0d { height: 380px; padding: 16px 0px 0px; }
4775.CheckoutForm-registrationForm-8dd0d.CheckoutForm-registrationForm-8dd0d form { overflow: hidden; }
4776.CheckoutForm-hidden-da3a1.CheckoutForm-hidden-da3a1 { display: none; }
4777.CheckoutForm-actions-1e4a0 { display: flex; align-items: center; margin-bottom: var(--spacings-s8); }
4778.CheckoutForm-actions-1e4a0 > :last-child { flex-grow: 1; }
4779.CheckoutForm-checkoutLabel-8a24a { font-weight: 600; font-size: var(--typography-t4-font-size); line-height: 1.4; margin-bottom: var(--spacings-s8); color: var(--text-colors-tint-1); }
4780.CheckoutForm-stepperContent-d5441 { padding-left: var(--spacings-s40); padding-right: var(--spacings-s40); }
4781@media screen and (max-width: 766px) {
4782  .CheckoutForm-stepperContent-d5441 { padding-left: var(--spacings-s16); padding-right: var(--spacings-s16); }
4783}
4784.CheckoutForm-checkoutButton-2a1ad { display: flex; width: 100%; justify-content: center; }
4785.CheckoutForm-form-90c1c { display: flex; flex-direction: column; gap: var(--spacings-s8); }
4786.CheckoutForm-requiredAsterisk-23cd0 { color: var(--error-colors-base-default); font-size: var(--typography-t4-font-size); font-weight: 600; line-height: 1.42; margin-bottom: var(--spacings-s4); }
4787.CheckoutForm-avataxTitle-897f5 span { display: inline-block; color: var(--error-colors-base-default); }
4788.CheckoutForm-avataxTitle-897f5 em { font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-2); font-style: normal; }
4789.CheckoutForm-formDivider-fd643 { width: 100%; height: 1px; margin: var(--spacings-s8) var(--spacings-s0); background-color: var(--control-colors-border-default); }
4790.CheckoutForm-walletContainer-fdf0f { display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(50% - 4px), 1fr)); gap: var(--spacings-s8); width: 100%; }
4791.CheckoutForm-walletSlot-bf35c { position: relative; min-width: 0px; }
4792.CheckoutForm-walletSlot-bf35c iframe { border-width: medium !important; border-style: none !important; border-color: currentcolor !important; border-image: initial !important; }
4793.CheckoutForm-walletSlot-bf35c:empty { display: none; }
4794.CheckoutForm-walletSlot-bf35c.CheckoutForm-disabled-c1e35 { pointer-events: none; }
4795.CheckoutForm-walletSlot-bf35c.CheckoutForm-disabled-c1e35::after { content: ""; display: block; width: 100%; position: absolute; top: 0px; bottom: 0px; height: 100%; background-color: var(--absolute-white-colors-base-default); border-radius: var(--corner-radius-r8); opacity: 0.7; }
4796.CheckoutForm-divider-b169e { display: flex; align-items: center; gap: var(--spacings-s12); margin: var(--spacings-s4) var(--spacings-s0); font-size: var(--typography-t4-font-size); font-weight: 500; color: var(--text-colors-tint-2); text-transform: uppercase; }
4797.CheckoutForm-divider-b169e::before, .CheckoutForm-divider-b169e::after { content: ""; flex: 1 1 0%; height: 1px; background-color: var(--control-colors-border-default); }
4798.Pricing-title-9c931 > span { -webkit-text-fill-color: transparent; background-clip: text; background-image: var(--gradients-monetization-pro); }
4799@media screen and (max-width: 766px) {
4800  .Pricing-title-9c931 { text-align: center; }
4801}
4802.Pricing-pricingCardsContainer-84e68 { max-width: 980px; }
4803@media screen and (min-width: 767px) {
4804  .Pricing-pricingCardsContainer-84e68 { margin: 0px auto; }
4805}
4806.Pricing-pricingCardsContainerCompact-54d57 { max-width: unset; }
4807.Pricing-plansSectionToggle-7c6fe { box-shadow: rgba(0, 0, 0, 0.24) 0px 0px 16px; }
4808.Pricing-columnsWrapper-8dddc { padding: var(--spacings-s0) var(--spacings-s24); margin-bottom: var(--spacings-s40); justify-content: center; gap: var(--spacings-s24); display: flex; }
4809.Pricing-columnsWrapper-8dddc em { color: var(--monetization-ultra-colors-base-default); font-style: inherit; }
4810@media screen and (max-width: 767px) {
4811  .Pricing-columnsWrapper-8dddc { flex-direction: column-reverse; }
4812}
4813.WelcomeDiscount-container-2728f { justify-content: center; flex-direction: column; padding: var(--spacings-s24); align-items: center; position: relative; overflow: hidden; display: flex; height: 100%; width: 100%; }
4814.WelcomeDiscount-content-c0499 { justify-content: center; flex-direction: column; position: relative; align-items: center; text-align: center; gap: var(--spacings-s16); display: flex; height: 100%; max-width: 590px; z-index: 1; }
4815.WelcomeDiscount-title-157a8 { font-weight: 700; font-size: var(--typography-t9-font-size); color: var(--text-colors-base); line-height: 1.32; }
4816.WelcomeDiscount-description-d0d3d { margin: var(--spacings-s0) var(--spacings-s0) var(--spacings-s24); font-weight: 500; font-size: var(--typography-t5-font-size); color: var(--text-colors-tint-1); line-height: 1.5; }
4817.WelcomeDiscount-description-d0d3d a { color: var(--primary-colors-base-default); font-weight: 600; cursor: pointer; }
4818.WelcomeDiscount-confetti-30f4a { position: absolute; z-index: 0; scale: 2; inset: 0px; }
4819.WelcomeDiscount-iconWrapper-5b2d8 { border: 2px solid var(--background-colors-tint-3); justify-content: center; align-items: center; border-radius: 50%; display: flex; height: 56px; width: 56px; }
4820.WelcomeDiscount-icon-a07ee { fill: var(--text-colors-tint-2); height: 32px; width: 32px; }
4821.WelcomeDiscount-imageWrapper-982a6 { justify-content: center; align-items: center; margin-bottom: -24px; display: flex; }
4822.WelcomeDiscount-imageWrapper-982a6 img { width: auto; height: 200px; }
4823.WelcomeDiscount-cta-a0f83 { min-width: 320px; }
4824.WelcomeTiers-otpFooter-4e9a0 { justify-items: center; }
4825.WelcomeTiers-button-89ce6 { max-width: 328px; width: 100%; }
4826.WelcomeDesktop-container-64773 { justify-content: center; flex-direction: column; padding: var(--spacings-s24); align-items: center; position: relative; overflow: hidden; display: flex; height: 100%; width: 100%; }
4827.WelcomeDesktop-content-37136 { justify-content: center; flex-direction: column; position: relative; al
4827ign-items: center; text-align: center; gap: var(--spacings-s16); display: flex; height: 100%; z-index: 1; }
4828@media screen and (max-width: 767px) {
4829  .WelcomeDesktop-content-37136 { justify-content: space-between; }
4830}
4831.WelcomeDesktop-textContainer-f3142 { justify-content: center; flex-direction: column; align-items: center; gap: var(--spacings-s16); display: flex; }
4832.WelcomeDesktop-title-b6374 { font-weight: 600; color: var(--text-colors-base); font-size: var(--typography-t11-font-size); line-height: 1.2; }
4833@media screen and (max-width: 767px) {
4834  .WelcomeDesktop-title-b6374 { font-size: var(--typography-t8-font-size); }
4835}
4836.WelcomeDesktop-description-3e7db { margin: var(--spacings-s0) var(--spacings-s0) var(--spacings-s8); font-weight: 500; color: var(--text-colors-base); font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); max-width: 540px; }
4837.WelcomeDesktop-description-3e7db a { color: var(--checkout-accent); font-weight: 600; cursor: pointer; }
4838@media screen and (max-width: 767px) {
4839  .WelcomeDesktop-description-3e7db { font-size: var(--typography-t5-font-size); }
4840}
4841.WelcomeDesktop-note-a6b38 { margin-bottom: var(--spacings-s8); margin-top: var(--spacings-s32); }
4842.WelcomeDesktop-confetti-7c696 { position: absolute; z-index: 0; inset: 0px; }
4843.WelcomeDesktop-imageWrapper-6a7a6 { justify-content: center; align-items: center; margin-bottom: -24px; display: flex; }
4844.WelcomeDesktop-imageWrapper-6a7a6 img { width: auto; height: 200px; }
4845.WelcomeDesktop-cta-d2dd2 { min-width: 320px; }
4846.WelcomeDesktop-image-cb9eb { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
4847.WelcomeDesktop-hidden-d1b89 { display: none; }
4848.WelcomeDesktop-ctaContainer-ba8c3 { gap: var(--spacings-s12); display: flex; flex-direction: column; align-items: center; }
4849.TrialSkipWelcome-container-78af7 { display: flex; align-items: center; justify-content: center; height: 100%; overflow: hidden; width: 100%; position: relative; }
4850.TrialSkipWelcome-content-0f1e1 { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: var(--spacings-s16); z-index: 1; padding-right: ; padding-bottom: ; padding-left: ; width: min(100%, 514px); padding-top: var(--spacings-s24); }
4851.TrialSkipWelcome-mainCta-ab585 { min-width: min(378px, 100%); }
4852.TrialSkipWelcome-confetti-66574 { position: absolute; scale: 1.5; inset: 0px; }
4853@media (orientation: portrait) {
4854  .TrialSkipWelcome-confetti-66574 { scale: 3; }
4855}
4856.TrialSkipWelcome-image-5ed17 { width: 200px; height: 200px; scale: 1.55; }
4857.TrialSkipWelcome-toggle-a4e1f { width: min(100%, 378px); }
4858.TrialSkipWelcome-oldPrice-22fc9 { margin-right: var(--spacings-s4); display: inline-block; color: var(--text-colors-tint-1); }
4859.TrialSkipWelcome-title-514f6 { font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
4860@media screen and (max-width: 766px) {
4861  .TrialSkipWelcome-title-514f6 { font-size: var(--typography-t7-font-size); line-height: var(--typography-t7-line-height); }
4862}
4863@media screen and (max-width: 766px) {
4864  .TrialSkipWelcome-description-87a99 br { display: none; }
4865}
4866.TrialSkipWelcome-emptySpace-cc278 { flex-grow: 1; display: none; }
4867@media screen and (max-width: 766px) {
4868  .TrialSkipWelcome-emptySpace-cc278 { display: block; }
4869}
4870.TrialSkipWelcome-price-905a8 { align-self: center; }
4871.PowerBadge-root-95210 { padding: 1px var(--spacings-s4) var(--spacings-s0); color: var(--absolute-white-colors-base-default); font-weight: 600; background-image: linear-gradient(315deg, rgb(38, 93, 174) 14.64%, rgb(34, 175, 185) 51.75%); font-size: var(--typography-t4-font-size); display: inline-block; border-radius: 12px; line-height: 23px; width: 100%; }
4872.PlanComparison-container-2def4 { padding: var(--spacings-s32) var(--spacings-s4) var(--spacings-s8) var(--spacings-s16); background-color: var(--positive-colors-base-default); height: 100%; }
4873.PlanComparison-container-2def4.PlanComparison-tierPro-bd1ca { background-image: linear-gradient(220deg, rgba(0, 0, 0, 0) 47.32%, rgb(90, 0, 238) 133.96%); }
4874.PlanComparison-container-2def4.PlanComparison-tierPlus-b248b { background-image: linear-gradient(220deg, rgba(0, 0, 0, 0) 47.32%, rgb(229, 67, 170) 133.96%); }
4875.PlanComparison-container-2def4.PlanComparison-tierPower-f81f1 { background-image: linear-gradient(220deg, rgba(0, 0, 0, 0) 47.32%, rgb(34, 175, 185) 133.96%); }
4876.PlanComparison-container-2def4.PlanComparison-inline-4d74e { background-image: none; background-color: transparent; }
4877.PlanComparison-content-026b1 { position: relative; padding-bottom: var(--spacings-s8); }
4878.PlanComparison-content-026b1::before { border-radius: 28px; position: absolute; display: block; width: 56px; margin: auto; content: ""; opacity: 0.1; z-index: 0; bottom: 0px; right: var(--comparison-highlight-right, 0); top: 0px; }
4879.PlanComparison-tierPro-bd1ca .PlanComparison-content-026b1::before { background-image: var(--gradients-monetization-pro); }
4880.PlanComparison-tierPro-bd1ca .PlanComparison-active-ea61b { color: var(--monetization-pro-colors-base-default); }
4881.PlanComparison-tierPro-bd1ca .PlanComparison-activeIcon-af3cb { stroke: var(--monetization-pro-colors-base-default); }
4882.PlanComparison-tierPlus-b248b .PlanComparison-content-026b1::before { background-image: var(--gradients-monetization-plus); }
4883.PlanComparison-tierPlus-b248b .PlanComparison-active-ea61b { color: var(--primary-colors-base-default); }
4884.PlanComparison-tierPlus-b248b .PlanComparison-activeIcon-af3cb { stroke: var(--primary-colors-base-default); }
4885.PlanComparison-tierPower-f81f1 .PlanComparison-content-026b1::before { background-image: linear-gradient(315deg, rgb(38, 93, 174) 14.64%, rgb(34, 175, 185) 51.75%); }
4886.PlanComparison-tierPower-f81f1 .PlanComparison-active-ea61b { color: var(--monetization-ultra-colors-base-default); }
4887.PlanComparison-tierPower-f81f1 .PlanComparison-activeIcon-af3cb { stroke: var(--monetization-ultra-colors-base-default); }
4888.PlanComparison-title-437b9 { font-weight: 700; margin-bottom: var(--spacings-s16); font-size: var(--typography-t6-font-size); color: var(--positive-colors-text-default); text-align: center; line-height: 1.4; }
4889.PlanComparison-featuresList-21f74 > li { height: var(--comparison-row-height); font-weight: 500; font-size: var(--typography-t5-font-size); margin-top: var(--spacings-s2); color: var(--positive-colors-text-default); align-items: center; display: flex; line-height: 1.2; }
4890.PlanComparison-featureTitle-3b52b { flex-grow: 1; }
4891.PlanComparison-col-ec5d5 { justify-content: center; align-items: center; display: flex; width: 56px; flex-shrink: 0; flex-grow: 0; }
4892.PlanComparison-header-dabb6 { font-weight: 600; justify-content: flex-end; margin-bottom: var(--spacings-s4); font-size: var(--typography-t4-font-size); color: var(--positive-colors-text-default); align-items: center; text-align: center; display: flex; }
4893.PlanComparison-featureTitleContent-d0584 { display: flex; align-items: center; }
4894.PlanComparison-featureTitleContent-d0584 > div { height: var(--spacings-s24); width: var(--spacings-s24); margin-left: var(--spacings-s8); }
4895.PlanComparison-icon-85bcd { stroke: var(--text-colors-tint-3); stroke-width: 2px; }
4896.PlanComparison-activeIcon-af3cb { stroke-width: 2px; }
4897.PlanComparison-notAvailableIcon-3e601 { fill: var(--text-colors-tint-3); }
4898.PlanComparison-infoIcon-dfbc4 { fill: var(--text-colors-tint-1); height: var(--spacings-s24); width: var(--spacings-s24); }
4899.PlanComparison-tooltip-210e8 { font-weight: 500; font-size: var(--typography-t4-font-size); text-align: center; max-width: 188px; }
4900.TierFeaturesList-root-4419b { font-size: var(--typography-t5-font-size); color: var(--text-colors-base); line-height: 1.5; }
4901.TierFeaturesList-title-29be1 { font-weight: 600; margin-bottom: var(--spacings-s16); }
4902.TierFeaturesList-list-214e9 { margin-bottom: var(--spacings-s16); list-style: none; }
4903.TierFeaturesList-listItem-b97ee { grid-template-columns: 24px 1fr; margin-bottom: var(--spacings-s16); gap: var(--spacings-s12); display: grid; }
4904.TierFeaturesList-icon-2baa2 { background: var(--checkout-gradient); border-radius: 50%; margin: var(--spacings-s2); height: 20px;
4904 width: 20px; }
4905.TierFeaturesList-icon-2baa2 path { fill: var(--absolute-white-colors-base-default); transform-origin: center center; scale: 1.1; }
4906.TierFeatures-root-ac527 { background: var(--checkout-features-gradient); padding: var(--spacings-s32); color: var(--text-colors-base); height: 100%; }
4907.TierFeatures-title-71aec { margin: var(--spacings-s0) auto var(--spacings-s24); font-weight: 600; font-size: var(--typography-t6-font-size); text-align: center; line-height: 1.4; max-width: 320px; }
4908.TierFeatures-numbersSection-7986e { margin: var(--spacings-s0) auto var(--spacings-s32); grid-template-columns: 1fr 1fr; text-align: center; gap: var(--spacings-s16); display: grid; max-width: 320px; width: 100%; }
4909.TierFeatures-numbersSectionContainer-0562a { padding: var(--spacings-s8) var(--spacings-s12); background-color: rgb(255, 249, 249); border-radius: var(--corner-radius-r12); }
4910.TierFeatures-numbersSectionTitle-34132 { color: var(--checkout-accent); font-weight: 600; margin-bottom: var(--spacings-s4); line-height: 1.2; font-size: 34px; }
4911.TierFeatures-numbersSectionDescription-468b4 { color: var(--absolute-black-colors-base-default); font-weight: 500; font-size: var(--typography-t4-font-size); line-height: 1.42; }
4912.Awards-imageContainer-1116e { background-repeat: no-repeat; background-position: center center; background-size: contain; width: 100%; height: 82px; }
4913html[class*="dark"] .Awards-imageContainer-1116e { background-image: url("https://pastatic.picsart.com/cms-pastatic/1a1b6f08-f96a-4ac8-81c7-7e746ddf6c2b.png"); }
4914html[class*="light"] .Awards-imageContainer-1116e { background-image: url("https://pastatic.picsart.com/cms-pastatic/e39ee417-10bc-4ba0-8705-144fdf8e0112.png"); }
4915@keyframes RundownIcon-spin-5f5c2 { 
4916  0% { --angle: 0deg; }
4917  100% { --angle: 360deg; }
4918}
4919@keyframes RundownIcon-zoomInOut-63b7a { 
4920  0% { transform: scale(1); }
4921  50% { transform: scale(1.2); }
4922  100% { transform: scale(1); }
4923}
4924.RundownIcon-iconContainer-473c2 { display: flex; align-items: center; justify-content: center; flex-shrink: 0; flex-grow: 0; width: 42px; height: 42px; margin-right: var(--spacings-s12); border-radius: var(--corner-radius-circle); border: 2px solid var(--checkout-trial-rundown-active); background-color: var(--background-colors-tint-2); box-sizing: border-box; }
4925.RundownIcon-iconContainerAnimated-ab75c { fill: var(--checkout-trial-rundown-active); position: relative; }
4926.RundownIcon-iconContainerAnimated-ab75c::after { content: ""; position: absolute; inset: -1px; border-radius: var(--corner-radius-circle); background: conic-gradient(transparent 0deg var(--angle),var(--background-colors-tint-2) var(--angle) 360deg); animation-duration: 0.7s; animation-timing-function: ease-in-out; animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: forwards; animation-play-state: running; animation-name: RundownIcon-spin-5f5c2; animation-timeline: auto; animation-range: normal; animation-delay: var(--rundown-animation-delay, 0ms); }
4927.RundownIcon-iconContainerFilled-43171 { background-color: var(--checkout-trial-rundown-active); z-index: 1; }
4928.RundownIcon-iconContainerFilled-43171 svg { fill: var(--background-colors-tint-2); }
4929.RundownIcon-iconAnimated-946e5 { animation-duration: 1s; animation-timing-function: ease-in-out; animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: forwards; animation-play-state: running; animation-name: RundownIcon-zoomInOut-63b7a; animation-timeline: auto; animation-range: normal; animation-delay: calc(var(--rundown-animation-delay, 0ms) + .7s); }
4930.RundownIcon-icon-1a85f { width: 24px; height: 24px; fill: var(--checkout-trial-rundown-active); }
4931.TrialRundown-containerWrapper-f7e35 { height: 100%; width: 100%; background-color: var(--background-colors-tint-2); display: flex; align-items: center; justify-content: center; }
4932.TrialRundown-container-3335f { height: 100%; padding: var(--spacings-s40) var(--spacings-s32) var(--spacings-s32); display: flex; flex-direction: column; align-items: center; max-width: 456px; justify-content: center; }
4933.TrialRundown-gap-cb0db { height: 40px; }
4934.TrialRundown-title-5fab5 { font-weight: 700; font-size: var(--typography-t6-font-size); line-height: 1.4; text-align: center; color: var(--text-colors-base); flex-basis: 52px; }
4935.TrialRundown-steps-9bc15 { position: relative; flex-basis: 260px; display: flex; flex-direction: column; justify-content: space-between; }
4936.TrialRundown-steps-9bc15 .TrialRundown-section-a71cc:not(:last-child) { margin-bottom: var(--spacings-s8); }
4937@keyframes TrialRundown-progressBarFill-c75cb { 
4938  0% { height: 0%; }
4939  22% { height: 0%; }
4940  50% { height: 50%; }
4941  72% { height: 50%; }
4942  100% { height: 100%; }
4943}
4944@keyframes TrialRundown-sectionTitleFill-eb559 { 
4945  0% { color: var(--checkout-trial-rundown-active); opacity: 0.4; }
4946  100% { color: var(--text-colors-base); opacity: 1; }
4947}
4948@keyframes TrialRundown-sectionDescriptionFill-df140 { 
4949  0% { color: var(--checkout-trial-rundown-active); opacity: 0.4; }
4950  100% { color: var(--text-colors-tint-1); opacity: 1; }
4951}
4952.TrialRundown-progressBar-763cd { position: absolute; width: 4px; top: 0px; bottom: 0px; left: 19px; z-index: 0; background-color: var(--background-colors-tint-3); }
4953.TrialRundown-progressBar-763cd::after { content: ""; display: block; width: 100%; height: 0%; background-color: var(--checkout-trial-rundown-active); }
4954.TrialRundown-progressBarAnimated-ae25d::after { animation: 3.6s ease-in-out 0s 1 normal forwards running TrialRundown-progressBarFill-c75cb; }
4955.TrialRundown-section-a71cc { display: flex; z-index: 1; }
4956.TrialRundown-section-a71cc:last-child { background-color: var(--background-colors-tint-2); }
4957.TrialRundown-sectionTitle-db589 { font-weight: 600; font-size: var(--typography-t5-font-size); line-height: 1.5; margin-bottom: 2px; }
4958.TrialRundown-sectionTitleAnimated-9875d { color: var(--checkout-trial-rundown-active); opacity: 0.4; animation: 0.7s ease-out 0s 1 normal forwards running TrialRundown-sectionTitleFill-eb559; }
4959.TrialRundown-sectionDescription-989de { font-weight: 500; font-size: var(--typography-t4-font-size); line-height: 1.42; margin: var(--spacings-s0); }
4960.TrialRundown-sectionDescriptionAnimated-8afee { color: var(--checkout-trial-rundown-active); opacity: 0.4; animation: 0.7s ease-out 0s 1 normal forwards running TrialRundown-sectionDescriptionFill-df140; }
4961.TrialRundown-awards-acd79 { margin-right: calc(-1 * var(--spacings-s16)); margin-left: calc(-1 * var(--spacings-s16)); width: calc(100% + var(--spacings-s32)); }
4962.DiscountView-container-a73e1 { background-color: var(--background-colors-tint-2); place-content: center; position: relative; display: grid; height: 100%; overflow: hidden; }
4963.DiscountView-video-e9f53 { transform: translate(-50%, -50%); position: absolute; height: 900px; width: 900px; left: 50%; top: 50%; }
4964.DiscountView-videoSmall-bca8e { height: 600px; width: 450px; }
4965.OrderSummary-root-50d49 { position: relative; display: flex; width: 100%; height: 100%; background-color: var(--background-colors-tint-1); overflow: hidden; }
4966.OrderSummary-glow-7acf8 { position: absolute; inset: 0px; pointer-events: none; }
4967.OrderSummary-content-d21de { position: relative; z-index: 1; flex: 1 1 0%; display: flex; flex-direction: column; padding: var(--spacings-s16) var(--spacings-s32) var(--spacings-s32); box-sizing: border-box; }
4968.OrderSummary-object-ee283 { width: 100%; flex: 0 1 250px; max-height: 250px; min-height: 200px; margin-top: var(--spacings-s8); }
4969.OrderSummary-badgeRow-81c5a { display: flex; margin-top: var(--spacings-s8); }
4970.OrderSummary-badge-1c685.OrderSummary-badge-1c685 { background: var(--order-summary-accent); }
4971.OrderSummary-title-83463 { margin-top: var(--spacings-s12); }
4972.OrderSummary-notes-dca06 { margin-top: var(--spacings-s4); display: flex; flex-direction: column; gap: var(--spacings-s2); }
4973.OrderSummary-credits-d43a7 { margin-top: var(--spacings-s16); }
4974.OrderSummary-seats-dea14 { margin-top: var(--spacings-s24); padding-top: var(--spacings-s16); border-top: 1px solid var(--background-colors-border); }
4975.OrderSummary-taxesAfterSeats-717cc.OrderSummary-taxesAfterSeats-717cc { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; margin-top: var(--spacings-s12); padding-top: 0px; }
4976.Carousel-carousel-7dbd7 { position: relative; height: 100%; }
4977.Carousel-carouselContainer-7b9dc { overflow: hidden; height: 100%; width: 100%; }
4978.Carousel-carouselWrapper-6938a { display: flex; flex-shrink: 0; height: 100%; width: 100%; }
4979.Carousel-carouselWrapper-6938a.Carousel-animated-3c03c { transition: transform 0.3s; }
4980.Carousel-carouselSlide-fa9b6 { height: 100%; width: 100%; flex-shrink: 0; }
4981.Carousel-dots-58632 { transform: translate(-50%); justify-content: center; bottom: var(--spacings-s12); align-items: center; position: absolute; display: flex; left: 50%; }
4982.Carousel-dot-bb7a3 { background-color: var(--background-colors-tint-3); margin: var(--spacings-s4); height: var(--spacings-s8); width: var(--spacings-s8); border-radius: 50%; cursor: pointer; }
4983.Carousel-activeDot-3f7d4 { background-color: var(--primary-colors-base-active); }
4984.VideoPlayer-root-eb8ee { width: 100%; height: 100%; position: relative; }
4985.VideoPlayer-root-eb8ee.full { padding-top: 100%; }
4986.VideoPlayer-root-eb8ee.aspect-ratio-16-9 { padding-top: 56.25%; }
4987.VideoPlayer-root-eb8ee.aspect-ratio-4-3 { padding-top: 75%; }
4988@media (hover: hover) {
4989  .VideoPlayer-root-eb8ee:hover >
4989 .VideoPlayer-controls-5cd9a { display: block; }
4990}
4991.VideoPlayer-player-468c4 { inset: 0px; margin: auto; display: block; position: absolute; width: 100%; height: 100%; }
4992.VideoPlayer-controls-5cd9a { display: none; }
4993.VideoPlayer-control-0f716 { inset: 0px; margin: auto; display: block; position: absolute; width: 74px; height: 74px; cursor: pointer; }
4994.VideoPlayer-icon-b0a49 { display: block; width: 100%; height: 100%; }
4995.LayoutMedia-creative-cbb3b { display: block; width: 100%; height: 100%; object-fit: cover; }
4996.Layout-root-a8c26 { position: relative; display: flex; flex-direction: row-reverse; align-items: stretch; width: 1100px; height: 790px; max-height: 90vh; padding: var(--spacings-s0); max-width: 100%; }
4997.Layout-root-a8c26.Layout-expanded-565d9 { width: 1300px; height: 90vh; }
4998@media screen and (max-width: 767px) {
4999  .Layout-root-a8c26, .Layout-root-a8c26.Layout-expanded-565d9 { height: 100%; }
5000}
5001.Layout-content-acdb3 { width: 50%; align-items: stretch; position: relative; overflow: auto; display: flex; flex-grow: 1; scrollbar-width: none; }
5002.Layout-content-acdb3::-webkit-scrollbar { display: none; }
5003.Layout-content-acdb3.Layout-flushMedia-a2e3e { width: calc(100% - 460px); }
5004.Layout-content-acdb3.Layout-noMedia-7784d { width: 100%; }
5005.Layout-mediaWrapper-ff37d { padding: var(--spacings-s24); justify-content: stretch; flex-direction: column; position: relative; display: flex; width: 50%; flex-grow: 1; flex-shrink: 0; }
5006.Layout-mediaWrapper-ff37d.Layout-flushMedia-a2e3e { padding: var(--spacings-s0); width: 460px; flex-grow: 0; }
5007@media screen and (max-width: 767px) {
5008  .Layout-mediaWrapper-ff37d { display: none; }
5009}
5010.Layout-media-a4c63 { border-radius: var(--corner-radius-r12); overflow: hidden; height: 100%; flex-grow: 1; }
5011.Layout-media-a4c63.Layout-flushMedia-a2e3e { border-radius: 0px; }
5012.Layout-loader-3e8e7 { max-width: 100%; width: auto; }
5013.Layout-backIconButton-8d993 { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: var(--background-colors-transparent); border-radius: var(--corner-radius-circle); padding: var(--spacings-s0); width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; position: absolute; left: 8px; top: 8px; cursor: pointer; }
5014.Layout-backIcon-bbc2a { fill: var(--background-colors-transparent); }
5015.StepFooter-stepperContent-12772 { padding-left: var(--spacings-s40); padding-right: var(--spacings-s40); }
5016@media screen and (max-width: 766px) {
5017  .StepFooter-stepperContent-12772 { padding-left: var(--spacings-s16); padding-right: var(--spacings-s16); }
5018}
5019.StepFooter-footerDescription-ab531 { padding-top: var(--spacings-s16); margin-bottom: -4px; }
5020.StepFooter-footerDefaultButtonContainer-fbe84 { display: flex; align-items: center; padding-top: var(--spacings-s0); width: 100%; padding-bottom: var(--spacings-s16); }
5021.StepFooter-footer-75e02 { display: flex; align-items: center; padding-top: var(--spacings-s16); width: 100%; flex-direction: column; gap: var(--spacings-s12); }
5022.CheckoutViewContentLayout-root-bd1a1 { display: flex; flex-direction: column; width: 100%; padding-bottom: var(--spacings-s0); }
5023.CheckoutViewContentLayout-tabsContainer-85024 { padding-left: var(--spacings-s40); padding-right: var(--spacings-s40); }
5024@media screen and (max-width: 766px) {
5025  .CheckoutViewContentLayout-tabsContainer-85024 { padding-left: var(--spacings-s16); padding-right: var(--spacings-s16); }
5026}
5027.CheckoutViewContentLayout-tabsContainer-85024 { padding-top: var(--spacings-s40); padding-bottom: var(--spacings-s0); margin-bottom: var(--spacings-s24); }
5028.CheckoutViewContentLayout-tabs-699ba { border: 1px solid var(--control-colors-button-background-active); width: 100%; }
5029.CheckoutViewContentLayout-content-bcbb9 { overflow: auto; flex-grow: 1; padding-left: var(--spacings-s40); padding-right: var(--spacings-s40); }
5030@media screen and (max-width: 766px) {
5031  .CheckoutViewContentLayout-content-bcbb9 { padding-left: var(--spacings-s16); padding-right: var(--spacings-s16); }
5032}
5033.CheckoutViewContentLayout-content-bcbb9 { padding-top: var(--spacings-s40); padding-bottom: var(--spacings-s0); }
5034.CheckoutViewContentLayout-content-bcbb9.CheckoutViewContentLayout-withSegments-33b5e { padding-top: var(--spacings-s0); }
5035.CheckoutStepper-container-652d6 { border-radius: var(--corner-radius-r16); overflow: hidden; max-width: 100%; height: 100%; }
5036.CheckoutStepper-containerCompact-23449 { max-width: 100%; }
5037.CheckoutStepper-hidden-7f7f6 { display: none; }
5038.CheckoutStepper-checkoutButtonBack-92def { margin-right: var(--spacings-s8); flex-shrink: 0; }
5039.CheckoutStepper-checkoutStepperProgress-52bfb { margin: -12px var(--spacings-s0) var(--spacings-s12) -6px; }
5040.StepperProgress-wrapper-35683 { display: flex; position: relative; width: max-content; }
5041.StepperProgress-wrapper-35683::before, .StepperProgress-wrapper-35683::after { content: ""; display: block; position: absolute; left: 12px; bottom: 0px; top: 0px; z-index: 0; height: 1px; margin: auto; }
5042.StepperProgress-wrapper-35683::before { width: var(--stepper-line-width); background-color: var(--background-colors-tint-3); }
5043.StepperProgress-wrapper-35683::after { width: var(--stepper-progress-width); background-color: var(--stepper-active-color, var(--checkout-accent)); }
5044.StepperProgress-step-2b994 { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-circle); cursor: pointer; flex-shrink: 0; flex-grow: 0; padding: var(--spacings-s0); z-index: 2; }
5045.StepperProgress-step-2b994::after { content: ""; display: block; width: 12px; height: 12px; background-color: var(--stepper-inactive-color, var(--checkout-modal-background-color, #ffffff)); border: 1px solid var(--background-colors-tint-3); border-radius: var(--corner-radius-circle); }
5046.StepperProgress-step-2b994 + .StepperProgress-step-2b994 { margin-left: 4px; }
5047.StepperProgress-active-2dfa9::before { background-color: var(--stepper-active-color, var(--checkout-accent)); }
5048.StepperProgress-active-2dfa9::after { background-color: var(--stepper-active-color, var(--checkout-accent)); border-color: var(--stepper-active-color, var(--checkout-accent)); }
5049[data-checkout-tier] .grecaptcha-badge { visibility: hidden; }
5050.CheckoutModal-root-3b422 { height: 100%; }
5051.CheckoutObject3D-root-31b2c { display: block; width: 100%; height: 100%; touch-action: none; user-select: none; }
5052</style>
5053  <style data-prerender-css data-original-href="https://6f306cef61ba7a422fdcb7b25b91c10fd31af00d.miniapps-webapps.picsart.com/assets/entry-Gbngg0aW.css">
5054@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5055@layer ds-atoms {
5056  @keyframes toaster-animate-center { 
5057  0% { opacity: 0; transform: translate(0px) scale(1); }
5058  100% { opacity: var(--final-opacity, 1); }
5059}
5060  @keyframes toaster-animate-left { 
5061  0% { opacity: 0; transform: translate(-20px) scale(1); }
5062  100% { opacity: var(--final-opacity, 1); }
5063}
5064  @keyframes toaster-animate-right { 
5065  0% { opacity: 0; transform: translate(20px) scale(1); }
5066  100% { opacity: var(--final-opacity, 1); }
5067}
5068  .toaster { display: flex; flex-direction: column; justify-content: center; gap: var(--spacings-s12); width: 100%; max-width: var(--toaster-width); position: fixed; z-index: var(--toaster-z-index); list-style-type: none; color: var(--text-colors-base); height: max(0px,var(--item-height) + max(0,var(--total) - 1) * 10px); top: var(--toaster-top); bottom: var(--toaster-bottom); left: var(--toaster-left); right: var(--toaster-right); transform: var(--toaster-transform); }
5069  .toaster__item { opacity: 0; position: absolute; left: 0px; right: 0px; width: 100%;
5069 top: var(--toaster-item-top); bottom: var(--toaster-item-bottom); transform-origin: var(--toaster-item-transform-origin); z-index: var(--index); animation-duration: var(--timings-default); animation-timing-function: var(--easings-ease); animation-fill-mode: forwards; transition: transform var(--timings-default) var(--easings-ease),opacity var(--timings-default) var(--easings-ease); --scale-factor: calc(1 - var(--reverse-index) * var(--scale-step, .03)); --older-offset: calc(var(--reverse-index) * .2px * var(--direction, 1) * -1); --translate-y: calc(var(--index) * 6px * var(--direction, 1) + var(--older-offset)); --translate-x: calc(var(--index) * 6px * var(--direction-x, 0)); --final-opacity: .6; transform: translate(var(--translate-x),var(--translate-y)) scale(var(--scale-factor)); }
5070  .toaster__item:last-child { --final-opacity: 1; }
5071  .toaster__item--animate-center { animation-name: toaster-animate-center; }
5072  .toaster__item--animate-left { animation-name: toaster-animate-left; }
5073  .toaster__item--animate-right { animation-name: toaster-animate-right; }
5074}
5075@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5076@layer ds-atoms {
5077  .snackbar { display: inline-flex; align-items: center; width: 100%; border-radius: var(--spacings-s12); min-height: 48px; gap: var(--spacings-s4); padding: var(--spacings-s8); box-shadow: var(--shadows-tint-1); }
5078  .snackbar--information { background-color: var(--information-colors-base-default); }
5079  .snackbar--error { background-color: var(--error-colors-base-default); }
5080  .snackbar--success { background-color: var(--success-colors-base-default); }
5081  .snackbar--warning { background-color: var(--warning-colors-base-default); }
5082  .snackbar--premium { background-color: var(--monetization-ultra-colors-base-default); }
5083  .snackbar__button-no-handler { pointer-events: none; }
5084  .snackbar__close-button { margin-inline-start: auto; }
5085  .snackbar__text { word-break: break-word; min-width: 0px; }
5086  .snackbar--information .snackbar__text { color: var(--information-colors-text-default); }
5087  .snackbar--error .snackbar__text { color: var(--error-colors-text-default); }
5088  .snackbar--success .snackbar__text { color: var(--success-colors-text-default); }
5089  .snackbar--warning .snackbar__text { color: var(--warning-colors-text-default); }
5090  .snackbar--premium .snackbar__text { color: var(--monetization-ultra-colors-text-default); }
5091}
5092@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5093@layer ds-atoms {
5094  .button { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; max-width: 100%; transition-property: background-color, border, color; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); }
5095  .button--large { height: 40px; padding-block: var(--spacings-s10); padding-inline: var(--spacings-s10); border-radius: var(--corner-radius-r20); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
5096  .button--small { height: 32px; padding-block: var(--spacings-s6); padding-inline: var(--spacings-s6); border-radius: var(--corner-radius-r16); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
5097  .button--outline { border-style: solid; border-width: 1px; }
5098  .button--outline.button--small { border-width: 1px; }
5099  .button--no-border { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
5100  .button--center-icon { padding: 0px; font-size: 0px; border-radius: var(--corner-radius-circle); }
5101  .button--center-icon.button--large:not(.button--center-icon-full-width) { width: 40px; min-width: 40px; }
5102  .button--center-icon.button--small:not(.button--center-icon-full-width) { width: 32px; min-width: 32px; }
5103  .button--center-icon-full-width.button--large { border-radius: var(--corner-radius-r20); }
5104  .button--center-icon-full-width.button--small { border-radius: var(--corner-radius-r16); }
5105  .button--full-width { width: 100%; }
5106  .button--skin-primary.button--default-state { background-color: var(--primary-colors-base-default); color: var(--primary-colors-text-default); }
5107  .button--skin-primary.button--interactive:hover, .button--skin-primary.button--interactive:active { background-color: var(--primary-colors-base-action); color: var(--primary-colors-text-action); }
5108  .button--skin-primary.button--active-state { background-color: var(--primary-colors-base-active); color: var(--primary-colors-text-active); }
5109  .button--skin-primary.button--active-interactive:hover, .button--skin-primary.button--active-interactive:active { background-color: var(--primary-colors-base-active-action); color: var(--primary-colors-text-action); }
5110  .button--skin-primary.button--loading .button__loading-icon { color: var(--primary-colors-text-default); }
5111  .button--skin-primary.button--outline.button--default-state { background-color: transparent; border-color: var(--primary-colors-base-default); color: var(--primary-colors-base-default); }
5112  .button--skin-primary.button--outline.button--interactive:hover, .button--skin-primary.button--outline.button--interactive:active { background-color: transparent; border-color: var(--primary-colors-base-action); color: var(--primary-colors-base-action); }
5113  .button--skin-primary.button--outline.button--active-state { background-color: transparent; border-color: var(--primary-colors-base-active); color: var(--primary-colors-base-active); }
5114  .button--skin-primary.button--outline.button--active-interactive:hover, .button--skin-primary.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--primary-colors-base-active-action); color: var(--primary-colors-base-active-action); }
5115  .button--skin-primary.button--outline.button--loading .button__loading-icon { color: var(--primary-colors-base-default); }
5116  .button--skin-primary.button--text.button--default-state { background-color: transparent; color: var(--primary-colors-base-default); }
5117  .button--skin-primary.button--text.button--interactive:hover, .button--skin-primary.button--text.button--interactive:active { background-color: transparent; color: var(--primary-colors-base-action); }
5118  .button--skin-primary.button--text.button--active-state { background-color: transparent; color: var(--primary-colors-base-active); }
5119  .button--skin-primary.button--text.button--active-interactive:hover, .button--skin-primary.button--text.button--active-interactive:active { background-color: transparent; color: var(--primary-colors-base-active-action); }
5120  .button--skin-primary.button--text.button--loading .button__loading-icon { color: var(--primary-colors-base-default); }
5121  .button--skin-neutral.button--default-state { background-color: var(--neutral-colors-base-default); color: var(--neutral-colors-text-default); }
5122  .button--skin-neutral.button--interactive:hover, .button--skin-neutral.button--interactive:active { background-color: var(--neutral-colors-base-action); color: var(--neutral-colors-text-action); }
5123  .button--skin-neutral.button--active-state { background-color: var(--neutral-colors-base-active); color: var(--neutral-colors-text-active); }
5124  .button--skin-neutral.button--active-interactive:hover, .button--skin-neutral.button--active-interactive:active { background-color: var(--neutral-colors-base-active-action); color: var(--neutral-colors-text-action); }
5125  .button--skin-neutral.button--loading .button__loading-icon { color: var(--neutral-colors-text-default); }
5126  .button--skin-neutral.button--outline.button--default-state { background-color: transparent; border-color: var(--neutral-colors-base-default); color: var(--neutral-colors-base-default); }
5127  .button--skin-neutral.button--outline.button--interactive:hover, .button--skin-neutral.button--outline.button--interactive:active { background-color: transparent; border-color: var(--neutral-colors-base-action); color: var(--neutral-colors-base-action); }
5128  .button--skin-neutral.button--outline.button--active-state { background-color: transparent; border-color: var(--neutral-colors-base-active); color: var(--neutral-colors-base-active); }
5129  .button--skin-neutral.button--outline.button--active-interactive:hover, .button--skin-neutral.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--neutral-colors-base-active-action); color: var(--neutral-colors-base-active-action); }
5130  .button--skin-neutral.button--outline.button--loading .button__loading-icon { color: var(--neutral-colors-base-default); }
5131  .button--skin-neutral.button--text.button--default-state { background-color: transparent; color: var(--neutral-colors-base-default); }
5132  .button--skin-neutral.button--text.button--interactive:hover, .button--skin-neutral.button--text.button--interactive:active { background-color: transparent; color: var(--neutral-colors-base-action); }
5133  .button--skin-neutral.button--text.button--active-state { background-color: transparent; color: var(--neutral-colors-base-active); }
5134  .button--skin-neutral.button--text.button--active-interactive:hover, .button--skin-neutral.button--text.button--active-interactive:active { background-color: transparent; color: var(--neutral-colors-base-active-action); }
5135  .button--skin-neutral.button--text.button--loading .button__loading-icon { color: var(--neutral-colors-base-default); }
5136  .button--skin-plus.button--default-state { background-color: var(--monetization-plus-colors-base-default); color: var(--monetization-plus-colors-text-default); }
5137  .button--skin-plus.button--interactive:hover, .button--skin-plus.button--interactive:active { background-color: var(--monetization-plus-colors-base-action); color: var(--monetization-plus-colors-text-action); }
5138  .button--skin-plus.button--active-state { background-color: var(--monetization-plus-colors-base-active); color: var(--monetization-plus-colors-text-active); }
5139  .button--skin-plus.button--active-interactive:hover, .button--skin-plus.button--active-interactive:active { background-color: var(--monetization-plus-colors-base-active-action); color: var(--monetization-plus-colors-text-action); }
5140  .button--skin-plus.button--loading .button__loading-icon { color: var(--monetization-plus-colors-text-default); }
5141  .button--skin-plus.button--outline.button--default-state { background-color: transparent; border-color: var(--monetization-plus-colors-base-default); color: var(--monetization-plus-colors-base-default); }
5142  .button--skin-plus.button--outline.button--interactive:hover, .button--skin-plus.button--outline.button--interactive:active { background-color: transparent; border-color: var(--monetization-plus-colors-base-action); color: var(--monetization-plus-colors-base-action); }
5143  .button--skin-plus.button--outline.button--active-state { background-color: transparent; border-color: var(--monetization-plus-colors-base-active); color: var(--monetization-plus-colors-base-active); }
5144  .button--skin-plus.button--outline.button--active-interactive:hover, .button--skin-plus.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--monetization-plus-colors-base-active-action); color: var(--monetization-plus-colors-base-active-action); }
5145  .button--skin-plus.button--outline.button--loading .button__loading-icon { color: var(--monetization-plus-colors-base-default); }
5146  .button--skin-plus.button--text.button--default-state { background-color: transparent; color: var(--monetization-plus-colors-base-default); }
5147  .button--skin-plus.button--text.button--interactive:hover, .button--skin-plus.button--text.button--interactive:active { background-color: transparent; color: var(--monetization-plus-colors-base-action); }
5148  .button--skin-plus.button--text.button--active-state { background-color: transparent; color: var(--monetization-plus-colors-base-active); }
5149  .button--skin-plus.button--text.button--active-interactive:hover, .button--skin-plus.button--text.button--active-interactive:active { background-color: transparent; color: var(--monetization-plus-colors-base-active-action); }
5150  .button--skin-plus.button--text.button--loading .button__loading-icon { color: var(--monetization-plus-colors-base-default); }
5151  .button--skin-pro.button--default-state { background-color: var(--monetization-pro-colors-base-default); color: var(--monetization-pro-colors-text-default); }
5152  .button--skin-pro.button--interactive:hover, .button--skin-pro.button--interactive:active { background-color: var(--monetization-pro-colors-base-action); color: var(--monetization-pro-colors-text-action); }
5153  .button--skin-pro.button--active-state { background-color: var(--monetization-pro-colors-base-active); color: var(--monetization-pro-colors-text-active); }
5154  .button--skin-pro.button--active-interactive:hover, .button--skin-pro.button--active-interactive:active { background-color: var(--monetization-pro-colors-base-active-action); color: var(--monetization-pro-colors-text-action); }
5155  .button--skin-pro.button--loading .button__loading-icon { color: var(--monetization-pro-colors-text-default); }
5156  .button--skin-pro.button--outline.button--default-state { background-color: transparent; border-color: var(--monetization-pro-colors-base-default); color: var(--monetization-pro-colors-base-default); }
5157  .button--skin-pro.button--outline.button--interactive:hover, .button--skin-pro.button--outline.button--interactive:active { background-color: transparent; border-color: var(--monetization-pro-colors-base-action); color: var(--monetization-pro-colors-base-action); }
5158  .button--skin-pro.button--outline.button--active-state { background-color: transparent; border-color: var(--monetization-pro-colors-base-active); color: var(--monetization-pro-colors-base-active); }
5159  .button--skin-pro.button--outline.button--active-interactive:hover, .button--skin-pro.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--monetization-pro-colors-base-active-action); color: var(--monetization-pro-colors-base-active-action); }
5160  .button--skin-pro.button--outline.button--loading .button__loading-icon { color: var(--monetization-pro-colors-base-default); }
5161  .button--skin-pro.button--text.button--default-state { background-color: transparent; color: var(--monetization-pro-colors-base-default); }
5162  .button--skin-pro.button--text.button--interactive:hover, .button--skin-pro.button--text.button--interactive:active { background-color: transparent; color: var(--monetization-pro-colors-base-action); }
5163  .button--skin-pro.button--text.button--active-state { background-color: transparent; color: var(--monetization-pro-colors-base-active); }
5164  .button--skin-pro.button--text.button--active-interactive:hover, .button--skin-pro.button--text.button--active-interactive:active { background-color: transparent; color: var(--monetization-pro-colors-base-active-action); }
5165  .button--skin-pro.button--text.button--loading .button__loading-icon { color: var(--monetization-pro-colors-base-default); }
5166  .button--skin-ultra.button--default-state { background-color: var(--monetization-ultra-colors-base-default); color: var(--monetization-ultra-colors-text-default); }
5167  .button--skin-ultra.button--interactive:hover, .button--skin-ultra.button--interactive:active { background-color: var(--monetization-ultra-colors-base-action); color: var(--monetization-ultra-colors-text-action); }
5168  .button--skin-ultra.button--active-state { background-color: var(--monetization-ultra-colors-base-active); color: var(--monetization-ultra-colors-text-active); }
5169  .button--skin-ultra.button--active-interactive:hover, .button--skin-ultra.button--active-interactive:active { background-color: var(--monetization-ultra-colors-base-active-action); color: var(--monetization-ultra-colors-text-action); }
5170  .button--skin-ultra.button--loading .button__loading-icon { color: var(--monetization-ultra-colors-text-default); }
5171  .button--skin-ultra.button--outline.button--default-state { background-color: transparent; border-color: var(--monetization-ultra-colors-base-default); color: var(--monetization-ultra-colors-base-default); }
5172  .button--skin-ultra.button--outline.button
5172--interactive:hover, .button--skin-ultra.button--outline.button--interactive:active { background-color: transparent; border-color: var(--monetization-ultra-colors-base-action); color: var(--monetization-ultra-colors-base-action); }
5173  .button--skin-ultra.button--outline.button--active-state { background-color: transparent; border-color: var(--monetization-ultra-colors-base-active); color: var(--monetization-ultra-colors-base-active); }
5174  .button--skin-ultra.button--outline.button--active-interactive:hover, .button--skin-ultra.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--monetization-ultra-colors-base-active-action); color: var(--monetization-ultra-colors-base-active-action); }
5175  .button--skin-ultra.button--outline.button--loading .button__loading-icon { color: var(--monetization-ultra-colors-base-default); }
5176  .button--skin-ultra.button--text.button--default-state { background-color: transparent; color: var(--monetization-ultra-colors-base-default); }
5177  .button--skin-ultra.button--text.button--interactive:hover, .button--skin-ultra.button--text.button--interactive:active { background-color: transparent; color: var(--monetization-ultra-colors-base-action); }
5178  .button--skin-ultra.button--text.button--active-state { background-color: transparent; color: var(--monetization-ultra-colors-base-active); }
5179  .button--skin-ultra.button--text.button--active-interactive:hover, .button--skin-ultra.button--text.button--active-interactive:active { background-color: transparent; color: var(--monetization-ultra-colors-base-active-action); }
5180  .button--skin-ultra.button--text.button--loading .button__loading-icon { color: var(--monetization-ultra-colors-base-default); }
5181  .button--skin-success.button--default-state { background-color: var(--success-colors-base-default); color: var(--success-colors-text-default); }
5182  .button--skin-success.button--interactive:hover, .button--skin-success.button--interactive:active { background-color: var(--success-colors-base-action); color: var(--success-colors-text-action); }
5183  .button--skin-success.button--active-state { background-color: var(--success-colors-base-active); color: var(--success-colors-text-active); }
5184  .button--skin-success.button--active-interactive:hover, .button--skin-success.button--active-interactive:active { background-color: var(--success-colors-base-active-action); color: var(--success-colors-text-action); }
5185  .button--skin-success.button--loading .button__loading-icon { color: var(--success-colors-text-default); }
5186  .button--skin-success.button--outline.button--default-state { background-color: transparent; border-color: var(--success-colors-base-default); color: var(--success-colors-base-default); }
5187  .button--skin-success.button--outline.button--interactive:hover, .button--skin-success.button--outline.button--interactive:active { background-color: transparent; border-color: var(--success-colors-base-action); color: var(--success-colors-base-action); }
5188  .button--skin-success.button--outline.button--active-state { background-color: transparent; border-color: var(--success-colors-base-active); color: var(--success-colors-base-active); }
5189  .button--skin-success.button--outline.button--active-interactive:hover, .button--skin-success.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--success-colors-base-active-action); color: var(--success-colors-base-active-action); }
5190  .button--skin-success.button--outline.button--loading .button__loading-icon { color: var(--success-colors-base-default); }
5191  .button--skin-success.button--text.button--default-state { background-color: transparent; color: var(--success-colors-base-default); }
5192  .button--skin-success.button--text.button--interactive:hover, .button--skin-success.button--text.button--interactive:active { background-color: transparent; color: var(--success-colors-base-action); }
5193  .button--skin-success.button--text.button--active-state { background-color: transparent; color: var(--success-colors-base-active); }
5194  .button--skin-success.button--text.button--active-interactive:hover, .button--skin-success.button--text.button--active-interactive:active { background-color: transparent; color: var(--success-colors-base-active-action); }
5195  .button--skin-success.button--text.button--loading .button__loading-icon { color: var(--success-colors-base-default); }
5196  .button--skin-warning.button--default-state { background-color: var(--warning-colors-base-default); color: var(--warning-colors-text-default); }
5197  .button--skin-warning.button--interactive:hover, .button--skin-warning.button--interactive:active { background-color: var(--warning-colors-base-action); color: var(--warning-colors-text-action); }
5198  .button--skin-warning.button--active-state { background-color: var(--warning-colors-base-active); color: var(--warning-colors-text-active); }
5199  .button--skin-warning.button--active-interactive:hover, .button--skin-warning.button--active-interactive:active { background-color: var(--warning-colors-base-active-action); color: var(--warning-colors-text-action); }
5200  .button--skin-warning.button--loading .button__loading-icon { color: var(--warning-colors-text-default); }
5201  .button--skin-warning.button--outline.button--default-state { background-color: transparent; border-color: var(--warning-colors-base-default); color: var(--warning-colors-base-default); }
5202  .button--skin-warning.button--outline.button--interactive:hover, .button--skin-warning.button--outline.button--interactive:active { background-color: transparent; border-color: var(--warning-colors-base-action); color: var(--warning-colors-base-action); }
5203  .button--skin-warning.button--outline.button--active-state { background-color: transparent; border-color: var(--warning-colors-base-active); color: var(--warning-colors-base-active); }
5204  .button--skin-warning.button--outline.button--active-interactive:hover, .button--skin-warning.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--warning-colors-base-active-action); color: var(--warning-colors-base-active-action); }
5205  .button--skin-warning.button--outline.button--loading .button__loading-icon { color: var(--warning-colors-base-default); }
5206  .button--skin-warning.button--text.button--default-state { background-color: transparent; color: var(--warning-colors-base-default); }
5207  .button--skin-warning.button--text.button--interactive:hover, .button--skin-warning.button--text.button--interactive:active { background-color: transparent; color: var(--warning-colors-base-action); }
5208  .button--skin-warning.button--text.button--active-state { background-color: transparent; color: var(--warning-colors-base-active); }
5209  .button--skin-warning.button--text.button--active-interactive:hover, .button--skin-warning.button--text.button--active-interactive:active { background-color: transparent; color: var(--warning-colors-base-active-action); }
5210  .button--skin-warning.button--text.button--loading .button__loading-icon { color: var(--warning-colors-base-default); }
5211  .button--skin-error.button--default-state { background-color: var(--error-colors-base-default); color: var(--error-colors-text-default); }
5212  .button--skin-error.button--interactive:hover, .button--skin-error.button--interactive:active { background-color: var(--error-colors-base-action); color: var(--error-colors-text-action); }
5213  .button--skin-error.button--active-state { background-color: var(--error-colors-base-active); color: var(--error-colors-text-active); }
5214  .button--skin-error.button--active-interactive:hover, .button--skin-error.button--active-interactive:active { background-color: var(--error-colors-base-active-action); color: var(--error-colors-text-action); }
5215  .button--skin-error.button--loading .button__loading-icon { color: var(--error-colors-text-default); }
5216  .button--skin-error.button--outline.button--default-state { background-color: transparent; border-color: var(--error-colors-base-default); color: var(--error-colors-base-default); }
5217  .button--skin-error.button--outline.button--interactive:hover, .button--skin-error.button--outline.button--interactive:active { background-color: transparent; border-color: var(--error-colors-base-action); color: var(--error-colors-base-action); }
5218  .button--skin-error.button--outline.button--active-state { background-color: transparent; border-color: var(--error-colors-base-active); color: var(--error-colors-base-active); }
5219  .button--skin-error.button--outline.button--active-interactive:hover, .button--skin-error.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--error-colors-base-active-action); color: var(--error-colors-base-active-action); }
5220  .button--skin-error.button--outline.button--loading .button__loading-icon { color: var(--error-colors-base-default); }
5221  .button--skin-error.button--text.button--default-state { background-color: transparent; color: var(--error-colors-base-default); }
5222  .button--skin-error.button--text.button--interactive:hover, .button--skin-error.button--text.button--interactive:active { background-color: transparent; color: var(--error-colors-base-action); }
5223  .button--skin-error.button--text.button--active-state { background-color: transparent; color: var(--error-colors-base-active); }
5224  .button--skin-error.button--text.button--active-interactive:hover, .button--skin-error.button--text.button--active-interactive:active { background-color: transparent; color: var(--error-colors-base-active-action); }
5225  .button--skin-error.button--text.button--loading .button__loading-icon { color: var(--error-colors-base-default); }
5226  .button--skin-information.button--default-state { background-color: var(--information-colors-base-default); color: var(--information-colors-text-default); }
5227  .button--skin-information.button--interactive:hover, .button--skin-information.button--interactive:active { background-color: var(--information-colors-base-action); color: var(--information-colors-text-action); }
5228  .button--skin-information.button--active-state { background-color: var(--information-colors-base-active); color: var(--information-colors-text-active); }
5229  .button--skin-information.button--active-interactive:hover, .button--skin-information.button--active-interactive:active { background-color: var(--information-colors-base-active-action); color: var(--information-colors-text-action); }
5230  .button--skin-information.button--loading .button__loading-icon { color: var(--information-colors-text-default); }
5231  .button--skin-information.button--outline.button--default-state { background-color: transparent; border-color: var(--information-colors-base-default); color: var(--information-colors-base-default); }
5232  .button--skin-information.button--outline.button--interactive:hover, .button--skin-information.button--outline.button--interactive:active { background-color: transparent; border-color: var(--information-colors-base-action); color: var(--information-colors-base-action); }
5233  .button--skin-information.button--outline.button--active-state { background-color: transparent; border-color: var(--information-colors-base-active); color: var(--information-colors-base-active); }
5234  .button--skin-information.button--outline.button--active-interactive:hover, .button--skin-information.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--information-colors-base-active-action); color: var(--information-colors-base-active-action); }
5235  .button--skin-information.button--outline.button--loading .button__loading-icon { color: var(--information-colors-base-default); }
5236  .button--skin-information.button--text.button--default-state { background-color: transparent; color: var(--information-colors-base-default); }
5237  .button--skin-information.button--text.button--interactive:hover, .button--skin-information.button--text.button--interactive:active { background-color: transparent; color: var(--information-colors-base-action); }
5238  .button--skin-information.button--text.button--active-state { background-color: transparent; color: var(--information-colors-base-active); }
5239  .button--skin-information.button--text.button--active-interactive:hover, .button--skin-information.button--text.button--active-interactive:active { background-color: transparent; color: var(--information-colors-base-active-action); }
5240  .button--skin-information.button--text.button--loading .button__loading-icon { color: var(--information-colors-base-default); }
5241  .button--skin-positive.button--default-state { background-color: var(--positive-colors-base-default); color: var(--positive-colors-text-default); }
5242  .button--skin-positive.button--interactive:hover, .button--skin-positive.button--interactive:active { background-color: var(--positive-colors-base-action); color: var(--positive-colors-text-action); }
5243  .button--skin-positive.button--active-state { background-color: var(--positive-colors-base-active); color: var(--positive-colors-text-active); }
5244  .button--skin-positive.button--active-interactive:hover, .button--skin-positive.button--active-interactive:active { background-color: var(--positive-colors-base-active-action); color: var(--positive-colors-text-action); }
5245  .button--skin-positive.button--loading .button__loading-icon { color: var(--positive-colors-text-default); }
5246  .button--skin-positive.button--outline.button--default-state { background-color: transparent; border-color: var(--positive-colors-base-default); color: var(--positive-colors-base-default); }
5247  .button--skin-positive.button--outline.button--interactive:hover, .button--skin-positive.button--outline.button--interactive:active { background-color: transparent; border-color: var(--positive-colors-base-action); color: var(--positive-colors-base-action); }
5248  .button--skin-positive.button--outline.button--active-state { background-color: transparent; border-color: var(--positive-colors-base-active); color: var(--positive-colors-base-active); }
5249  .button--skin-positive.button--outline.button--active-interactive:hover, .button--skin-positive.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--positive-colors-base-active-action); color: var(--positive-colors-base-active-action); }
5250  .button--skin-positive.button--outline.button--loading .button__loading-icon { color: var(--positive-colors-base-default); }
5251  .button--skin-positive.button--text.button--default-state { background-color: transparent; color: var(--positive-colors-base-default); }
5252  .button--skin-positive.button--text.button--interactive:hover, .button--skin-positive.button--text.button--interactive:active { background-color: transparent; color: var(--positive-colors-base-action); }
5253  .button--skin-positive.button--text.button--active-state { background-color: transparent; color: var(--positive-colors-base-active); }
5254  .button--skin-positive.button--text.button--active-interactive:hover, .button--skin-positive.button--text.button--active-interactive:active { background-color: transparent; color: var(--positive-colors-base-active-action); }
5255  .button--skin-positive.button--text.button--loading .button__loading-icon { color: var(--positive-colors-base-default); }
5256  .button--skin-negative.button--default-state { background-color: var(--negative-colors-base-default); color: var(--negative-colors-text-default); }
5257  .button--skin-negative.button--interactive:hover, .button--skin-negative.button--interactive:active { background-color: var(--negative-colors-base-action); color: var(--negative-colors-text-action); }
5258  .button--skin-negative.button--active-state { background-color: var(--negative-colors-base-active); color: var(--negative-colors-text-active); }
5259  .button--skin-negative.button--active-interactive:hover, .button--skin-negative.button--active-interactive:active { background-color: var(--negative-colors-base-active-action); color: var(--negative-colors-text-action); }
5260  .button--skin-negative.button--loading .button__loading-icon { color: var(--negative-colors-text-default); }
5261  .button--skin-negative.button--outline.button--default-state { background-color: transparent; border-color: var(--negative-colors-base-default); color: var(--negative-colors-base-default); }
5262  .button--skin-negative.button--outline.button--intera
5262ctive:hover, .button--skin-negative.button--outline.button--interactive:active { background-color: transparent; border-color: var(--negative-colors-base-action); color: var(--negative-colors-base-action); }
5263  .button--skin-negative.button--outline.button--active-state { background-color: transparent; border-color: var(--negative-colors-base-active); color: var(--negative-colors-base-active); }
5264  .button--skin-negative.button--outline.button--active-interactive:hover, .button--skin-negative.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--negative-colors-base-active-action); color: var(--negative-colors-base-active-action); }
5265  .button--skin-negative.button--outline.button--loading .button__loading-icon { color: var(--negative-colors-base-default); }
5266  .button--skin-negative.button--text.button--default-state { background-color: transparent; color: var(--negative-colors-base-default); }
5267  .button--skin-negative.button--text.button--interactive:hover, .button--skin-negative.button--text.button--interactive:active { background-color: transparent; color: var(--negative-colors-base-action); }
5268  .button--skin-negative.button--text.button--active-state { background-color: transparent; color: var(--negative-colors-base-active); }
5269  .button--skin-negative.button--text.button--active-interactive:hover, .button--skin-negative.button--text.button--active-interactive:active { background-color: transparent; color: var(--negative-colors-base-active-action); }
5270  .button--skin-negative.button--text.button--loading .button__loading-icon { color: var(--negative-colors-base-default); }
5271  .button--skin-black.button--default-state { background-color: var(--absolute-black-colors-base-default); color: var(--absolute-black-colors-text-default); }
5272  .button--skin-black.button--interactive:hover, .button--skin-black.button--interactive:active { background-color: var(--absolute-black-colors-base-action); color: var(--absolute-black-colors-text-action); }
5273  .button--skin-black.button--active-state { background-color: var(--absolute-black-colors-base-active); color: var(--absolute-black-colors-text-active); }
5274  .button--skin-black.button--active-interactive:hover, .button--skin-black.button--active-interactive:active { background-color: var(--absolute-black-colors-base-active-action); color: var(--absolute-black-colors-text-action); }
5275  .button--skin-black.button--loading .button__loading-icon { color: var(--absolute-black-colors-text-default); }
5276  .button--skin-black.button--outline.button--default-state { background-color: transparent; border-color: var(--absolute-black-colors-base-default); color: var(--absolute-black-colors-base-default); }
5277  .button--skin-black.button--outline.button--interactive:hover, .button--skin-black.button--outline.button--interactive:active { background-color: transparent; border-color: var(--absolute-black-colors-base-action); color: var(--absolute-black-colors-base-action); }
5278  .button--skin-black.button--outline.button--active-state { background-color: transparent; border-color: var(--absolute-black-colors-base-active); color: var(--absolute-black-colors-base-active); }
5279  .button--skin-black.button--outline.button--active-interactive:hover, .button--skin-black.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--absolute-black-colors-base-active-action); color: var(--absolute-black-colors-base-active-action); }
5280  .button--skin-black.button--outline.button--loading .button__loading-icon { color: var(--absolute-black-colors-base-default); }
5281  .button--skin-black.button--text.button--default-state { background-color: transparent; color: var(--absolute-black-colors-base-default); }
5282  .button--skin-black.button--text.button--interactive:hover, .button--skin-black.button--text.button--interactive:active { background-color: transparent; color: var(--absolute-black-colors-base-action); }
5283  .button--skin-black.button--text.button--active-state { background-color: transparent; color: var(--absolute-black-colors-base-active); }
5284  .button--skin-black.button--text.button--active-interactive:hover, .button--skin-black.button--text.button--active-interactive:active { background-color: transparent; color: var(--absolute-black-colors-base-active-action); }
5285  .button--skin-black.button--text.button--loading .button__loading-icon { color: var(--absolute-black-colors-base-default); }
5286  .button--skin-white.button--default-state { background-color: var(--absolute-white-colors-base-default); color: var(--absolute-white-colors-text-default); }
5287  .button--skin-white.button--interactive:hover, .button--skin-white.button--interactive:active { background-color: var(--absolute-white-colors-base-action); color: var(--absolute-white-colors-text-action); }
5288  .button--skin-white.button--active-state { background-color: var(--absolute-white-colors-base-active); color: var(--absolute-white-colors-text-active); }
5289  .button--skin-white.button--active-interactive:hover, .button--skin-white.button--active-interactive:active { background-color: var(--absolute-white-colors-base-active-action); color: var(--absolute-white-colors-text-action); }
5290  .button--skin-white.button--loading .button__loading-icon { color: var(--absolute-white-colors-text-default); }
5291  .button--skin-white.button--outline.button--default-state { background-color: transparent; border-color: var(--absolute-white-colors-base-default); color: var(--absolute-white-colors-base-default); }
5292  .button--skin-white.button--outline.button--interactive:hover, .button--skin-white.button--outline.button--interactive:active { background-color: transparent; border-color: var(--absolute-white-colors-base-action); color: var(--absolute-white-colors-base-action); }
5293  .button--skin-white.button--outline.button--active-state { background-color: transparent; border-color: var(--absolute-white-colors-base-active); color: var(--absolute-white-colors-base-active); }
5294  .button--skin-white.button--outline.button--active-interactive:hover, .button--skin-white.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--absolute-white-colors-base-active-action); color: var(--absolute-white-colors-base-active-action); }
5295  .button--skin-white.button--outline.button--loading .button__loading-icon { color: var(--absolute-white-colors-base-default); }
5296  .button--skin-white.button--text.button--default-state { background-color: transparent; color: var(--absolute-white-colors-base-default); }
5297  .button--skin-white.button--text.button--interactive:hover, .button--skin-white.button--text.button--interactive:active { background-color: transparent; color: var(--absolute-white-colors-base-action); }
5298  .button--skin-white.button--text.button--active-state { background-color: transparent; color: var(--absolute-white-colors-base-active); }
5299  .button--skin-white.button--text.button--active-interactive:hover, .button--skin-white.button--text.button--active-interactive:active { background-color: transparent; color: var(--absolute-white-colors-base-active-action); }
5300  .button--skin-white.button--text.button--loading .button__loading-icon { color: var(--absolute-white-colors-base-default); }
5301  .button--skin-facebook.button--default-state { background-color: var(--facebook-colors-base-default); color: var(--facebook-colors-text-default); }
5302  .button--skin-facebook.button--interactive:hover, .button--skin-facebook.button--interactive:active { background-color: var(--facebook-colors-base-action); color: var(--facebook-colors-text-action); }
5303  .button--skin-facebook.button--active-state { background-color: var(--facebook-colors-base-active); color: var(--facebook-colors-text-active); }
5304  .button--skin-facebook.button--active-interactive:hover, .button--skin-facebook.button--active-interactive:active { background-color: var(--facebook-colors-base-active-action); color: var(--facebook-colors-text-action); }
5305  .button--skin-facebook.button--loading .button__loading-icon { color: var(--facebook-colors-text-default); }
5306  .button--skin-facebook.button--outline.button--default-state { background-color: transparent; border-color: var(--facebook-colors-base-default); color: var(--facebook-colors-base-default); }
5307  .button--skin-facebook.button--outline.button--interactive:hover, .button--skin-facebook.button--outline.button--interactive:active { background-color: transparent; border-color: var(--facebook-colors-base-action); color: var(--facebook-colors-base-action); }
5308  .button--skin-facebook.button--outline.button--active-state { background-color: transparent; border-color: var(--facebook-colors-base-active); color: var(--facebook-colors-base-active); }
5309  .button--skin-facebook.button--outline.button--active-interactive:hover, .button--skin-facebook.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--facebook-colors-base-active-action); color: var(--facebook-colors-base-active-action); }
5310  .button--skin-facebook.button--outline.button--loading .button__loading-icon { color: var(--facebook-colors-base-default); }
5311  .button--skin-facebook.button--text.button--default-state { background-color: transparent; color: var(--facebook-colors-base-default); }
5312  .button--skin-facebook.button--text.button--interactive:hover, .button--skin-facebook.button--text.button--interactive:active { background-color: transparent; color: var(--facebook-colors-base-action); }
5313  .button--skin-facebook.button--text.button--active-state { background-color: transparent; color: var(--facebook-colors-base-active); }
5314  .button--skin-facebook.button--text.button--active-interactive:hover, .button--skin-facebook.button--text.button--active-interactive:active { background-color: transparent; color: var(--facebook-colors-base-active-action); }
5315  .button--skin-facebook.button--text.button--loading .button__loading-icon { color: var(--facebook-colors-base-default); }
5316  .button--skin-google.button--default-state { background-color: var(--google-colors-base-default); color: var(--google-colors-text-default); }
5317  .button--skin-google.button--interactive:hover, .button--skin-google.button--interactive:active { background-color: var(--google-colors-base-action); color: var(--google-colors-text-action); }
5318  .button--skin-google.button--active-state { background-color: var(--google-colors-base-active); color: var(--google-colors-text-active); }
5319  .button--skin-google.button--active-interactive:hover, .button--skin-google.button--active-interactive:active { background-color: var(--google-colors-base-active-action); color: var(--google-colors-text-action); }
5320  .button--skin-google.button--loading .button__loading-icon { color: var(--google-colors-text-default); }
5321  .button--skin-google.button--outline.button--default-state { background-color: transparent; border-color: var(--google-colors-base-default); color: var(--google-colors-base-default); }
5322  .button--skin-google.button--outline.button--interactive:hover, .button--skin-google.button--outline.button--interactive:active { background-color: transparent; border-color: var(--google-colors-base-action); color: var(--google-colors-base-action); }
5323  .button--skin-google.button--outline.button--active-state { background-color: transparent; border-color: var(--google-colors-base-active); color: var(--google-colors-base-active); }
5324  .button--skin-google.button--outline.button--active-interactive:hover, .button--skin-google.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--google-colors-base-active-action); color: var(--google-colors-base-active-action); }
5325  .button--skin-google.button--outline.button--loading .button__loading-icon { color: var(--google-colors-base-default); }
5326  .button--skin-google.button--text.button--default-state { background-color: transparent; color: var(--google-colors-base-default); }
5327  .button--skin-google.button--text.button--interactive:hover, .button--skin-google.button--text.button--interactive:active { background-color: transparent; color: var(--google-colors-base-action); }
5328  .button--skin-google.button--text.button--active-state { background-color: transparent; color: var(--google-colors-base-active); }
5329  .button--skin-google.button--text.button--active-interactive:hover, .button--skin-google.button--text.button--active-interactive:active { background-color: transparent; color: var(--google-colors-base-active-action); }
5330  .button--skin-google.button--text.button--loading .button__loading-icon { color: var(--google-colors-base-default); }
5331  .button--skin-apple.button--default-state { background-color: var(--apple-colors-base-default); color: var(--apple-colors-text-default); }
5332  .button--skin-apple.button--interactive:hover, .button--skin-apple.button--interactive:active { background-color: var(--apple-colors-base-action); color: var(--apple-colors-text-action); }
5333  .button--skin-apple.button--active-state { background-color: var(--apple-colors-base-active); color: var(--apple-colors-text-active); }
5334  .button--skin-apple.button--active-interactive:hover, .button--skin-apple.button--active-interactive:active { background-color: var(--apple-colors-base-active-action); color: var(--apple-colors-text-action); }
5335  .button--skin-apple.button--loading .button__loading-icon { color: var(--apple-colors-text-default); }
5336  .button--skin-apple.button--outline.button--default-state { background-color: transparent; border-color: var(--apple-colors-base-default); color: var(--apple-colors-base-default); }
5337  .button--skin-apple.button--outline.button--interactive:hover, .button--skin-apple.button--outline.button--interactive:active { background-color: transparent; border-color: var(--apple-colors-base-action); color: var(--apple-colors-base-action); }
5338  .button--skin-apple.button--outline.button--active-state { background-color: transparent; border-color: var(--apple-colors-base-active); color: var(--apple-colors-base-active); }
5339  .button--skin-apple.button--outline.button--active-interactive:hover, .button--skin-apple.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--apple-colors-base-active-action); color: var(--apple-colors-base-active-action); }
5340  .button--skin-apple.button--outline.button--loading .button__loading-icon { color: var(--apple-colors-base-default); }
5341  .button--skin-apple.button--text.button--default-state { background-color: transparent; color: var(--apple-colors-base-default); }
5342  .button--skin-apple.button--text.button--interactive:hover, .button--skin-apple.button--text.button--interactive:active { background-color: transparent; color: var(--apple-colors-base-action); }
5343  .button--skin-apple.button--text.button--active-state { background-color: transparent; color: var(--apple-colors-base-active); }
5344  .button--skin-apple.button--text.button--active-interactive:hover, .button--skin-apple.button--text.button--active-interactive:active { background-color: transparent; color: var(--apple-colors-base-active-action); }
5345  .button--skin-apple.button--text.button--loading .button__loading-icon { color: var(--apple-colors-base-default); }
5346  .button--skin-snapchat.button--default-state { background-color: var(--snapchat-colors-base-default); color: var(--snapchat-colors-text-default); }
5347  .button--skin-snapchat.button--interactive:hover, .button--skin-snapchat.button--interactive:active { background-color: var(--snapchat-colors-base-action); color: var(--snapchat-colors-text-action); }
5348  .button--skin-snapchat.button--active-state { background-color: var(--snapchat-colors-base-active); color: var(--snapchat-colors-text-active); }
5349  .button--skin-snapchat.button--active-interactive:hover, .button--skin-snapchat.button--active-interactive:active { background-color: var(--snapchat-colors-base-active-action); color: var(--snapchat-colors-text-action); }
5350  .button--skin-snapchat.button--loading .button__loading-icon { color: var(--snapchat-colors-text-default); }
5351  .button--skin-snapchat.button--outline.button--default-state { background-color: transparent; border-color: var(--snapchat-colors-base-default); color: var(--snapchat-colors-base-default); }
5352  .button--skin-snapchat.button--outline.button--interactive:hover, .button--skin-snapchat.button--outline.button--interactive:ac
5352tive { background-color: transparent; border-color: var(--snapchat-colors-base-action); color: var(--snapchat-colors-base-action); }
5353  .button--skin-snapchat.button--outline.button--active-state { background-color: transparent; border-color: var(--snapchat-colors-base-active); color: var(--snapchat-colors-base-active); }
5354  .button--skin-snapchat.button--outline.button--active-interactive:hover, .button--skin-snapchat.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--snapchat-colors-base-active-action); color: var(--snapchat-colors-base-active-action); }
5355  .button--skin-snapchat.button--outline.button--loading .button__loading-icon { color: var(--snapchat-colors-base-default); }
5356  .button--skin-snapchat.button--text.button--default-state { background-color: transparent; color: var(--snapchat-colors-base-default); }
5357  .button--skin-snapchat.button--text.button--interactive:hover, .button--skin-snapchat.button--text.button--interactive:active { background-color: transparent; color: var(--snapchat-colors-base-action); }
5358  .button--skin-snapchat.button--text.button--active-state { background-color: transparent; color: var(--snapchat-colors-base-active); }
5359  .button--skin-snapchat.button--text.button--active-interactive:hover, .button--skin-snapchat.button--text.button--active-interactive:active { background-color: transparent; color: var(--snapchat-colors-base-active-action); }
5360  .button--skin-snapchat.button--text.button--loading .button__loading-icon { color: var(--snapchat-colors-base-default); }
5361  .button--skin-kakao.button--default-state { background-color: var(--kakao-colors-base-default); color: var(--kakao-colors-text-default); }
5362  .button--skin-kakao.button--interactive:hover, .button--skin-kakao.button--interactive:active { background-color: var(--kakao-colors-base-action); color: var(--kakao-colors-text-action); }
5363  .button--skin-kakao.button--active-state { background-color: var(--kakao-colors-base-active); color: var(--kakao-colors-text-active); }
5364  .button--skin-kakao.button--active-interactive:hover, .button--skin-kakao.button--active-interactive:active { background-color: var(--kakao-colors-base-active-action); color: var(--kakao-colors-text-action); }
5365  .button--skin-kakao.button--loading .button__loading-icon { color: var(--kakao-colors-text-default); }
5366  .button--skin-kakao.button--outline.button--default-state { background-color: transparent; border-color: var(--kakao-colors-base-default); color: var(--kakao-colors-base-default); }
5367  .button--skin-kakao.button--outline.button--interactive:hover, .button--skin-kakao.button--outline.button--interactive:active { background-color: transparent; border-color: var(--kakao-colors-base-action); color: var(--kakao-colors-base-action); }
5368  .button--skin-kakao.button--outline.button--active-state { background-color: transparent; border-color: var(--kakao-colors-base-active); color: var(--kakao-colors-base-active); }
5369  .button--skin-kakao.button--outline.button--active-interactive:hover, .button--skin-kakao.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--kakao-colors-base-active-action); color: var(--kakao-colors-base-active-action); }
5370  .button--skin-kakao.button--outline.button--loading .button__loading-icon { color: var(--kakao-colors-base-default); }
5371  .button--skin-kakao.button--text.button--default-state { background-color: transparent; color: var(--kakao-colors-base-default); }
5372  .button--skin-kakao.button--text.button--interactive:hover, .button--skin-kakao.button--text.button--interactive:active { background-color: transparent; color: var(--kakao-colors-base-action); }
5373  .button--skin-kakao.button--text.button--active-state { background-color: transparent; color: var(--kakao-colors-base-active); }
5374  .button--skin-kakao.button--text.button--active-interactive:hover, .button--skin-kakao.button--text.button--active-interactive:active { background-color: transparent; color: var(--kakao-colors-base-active-action); }
5375  .button--skin-kakao.button--text.button--loading .button__loading-icon { color: var(--kakao-colors-base-default); }
5376  .button--skin-line.button--default-state { background-color: var(--line-colors-base-default); color: var(--line-colors-text-default); }
5377  .button--skin-line.button--interactive:hover, .button--skin-line.button--interactive:active { background-color: var(--line-colors-base-action); color: var(--line-colors-text-action); }
5378  .button--skin-line.button--active-state { background-color: var(--line-colors-base-active); color: var(--line-colors-text-active); }
5379  .button--skin-line.button--active-interactive:hover, .button--skin-line.button--active-interactive:active { background-color: var(--line-colors-base-active-action); color: var(--line-colors-text-action); }
5380  .button--skin-line.button--loading .button__loading-icon { color: var(--line-colors-text-default); }
5381  .button--skin-line.button--outline.button--default-state { background-color: transparent; border-color: var(--line-colors-base-default); color: var(--line-colors-base-default); }
5382  .button--skin-line.button--outline.button--interactive:hover, .button--skin-line.button--outline.button--interactive:active { background-color: transparent; border-color: var(--line-colors-base-action); color: var(--line-colors-base-action); }
5383  .button--skin-line.button--outline.button--active-state { background-color: transparent; border-color: var(--line-colors-base-active); color: var(--line-colors-base-active); }
5384  .button--skin-line.button--outline.button--active-interactive:hover, .button--skin-line.button--outline.button--active-interactive:active { background-color: transparent; border-color: var(--line-colors-base-active-action); color: var(--line-colors-base-active-action); }
5385  .button--skin-line.button--outline.button--loading .button__loading-icon { color: var(--line-colors-base-default); }
5386  .button--skin-line.button--text.button--default-state { background-color: transparent; color: var(--line-colors-base-default); }
5387  .button--skin-line.button--text.button--interactive:hover, .button--skin-line.button--text.button--interactive:active { background-color: transparent; color: var(--line-colors-base-action); }
5388  .button--skin-line.button--text.button--active-state { background-color: transparent; color: var(--line-colors-base-active); }
5389  .button--skin-line.button--text.button--active-interactive:hover, .button--skin-line.button--text.button--active-interactive:active { background-color: transparent; color: var(--line-colors-base-active-action); }
5390  .button--skin-line.button--text.button--loading .button__loading-icon { color: var(--line-colors-base-default); }
5391  .button--disabled { opacity: var(--states-disabled); pointer-events: none; }
5392  .button--loading { position: relative; color: transparent; pointer-events: none; }
5393  .button--cursor-pointer { cursor: pointer; }
5394  .button--cursor-default { cursor: default; }
5395  .button--cursor-not-allowed { cursor: not-allowed; }
5396  .button__icon { display: inline-block; flex: 0 0 20px; width: 20px; height: 20px; }
5397  .button--small .button__icon { flex-basis: 20px; width: 20px; height: 20px; }
5398  .button__icon > path:not([fill]) { fill: currentcolor; }
5399  .button__content { display: flex; align-items: center; min-width: 0px; max-width: 100%; height: 20px; column-gap: var(--spacings-s4); font-family: var(--fonts-gilroy); }
5400  .button--small .button__content { height: 20px; column-gap: var(--spacings-s4); }
5401  .button__content--hidden { visibility: hidden; }
5402  .button__text { min-width: 0px; padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
5403  .button--small .button__text { padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
5404  .button__credit { display: flex; flex-shrink: 0; align-items: center; column-gap: var(--spacings-s4); padding-inline-end: var(--spacings-s2); }
5405  .button--small .button__credit { column-gap: var(--spacings-s4); }
5406  .button__credit-icon { flex: 0 0 20px; width: 20px; height: 20px; }
5407  .button--small .button__credit-icon { flex-basis: 20px; width: 20px; height: 20px; }
5408  .button__credit-icon > path:not([fill]) { fill: currentcolor; }
5409  .button__control { display: none; }
5410  .button__loading-icon { position: absolute; inset: 0px; margin: auto; pointer-events: none; }
5411  @keyframes button-rotate { 
5412  100% { transform: rotate(360deg); }
5413}
5414  .button__loading-icon { animation: button-rotate var(--timings-long) var(--easings-linear) infinite; }
5415}
5416@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5417@layer ds-atoms {
5418  .text--t1 { font-size: var(--typography-t1-font-size); line-height: var(--typography-t1-line-height); }
5419  .text--t2 { font-size: var(--typography-t2-font-size); line-height: var(--typography-t2-line-height); }
5420  .text--t3 { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
5421  .text--t4 { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
5422  .text--t5 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
5423  .text--t6 { font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); }
5424  .text--t7 { font-size: var(--typography-t7-font-size); line-height: var(--typography-t7-line-height); }
5425  .text--t8 { font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
5426  .text--t9 { font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
5427  .text--t10 { font-size: var(--typography-t10-font-size); line-height: var(--typography-t10-line-height); }
5428  .text--color-primary { color: var(--primary-colors-base-default); }
5429  .text--color-neutral { color: var(--neutral-colors-base-default); }
5430  .text--color-plus { color: var(--monetization-plus-colors-base-default); }
5431  .text--color-pro { color: var(--monetization-pro-colors-base-default); }
5432  .text--color-ultra { color: var(--monetization-ultra-colors-base-default); }
5433  .text--color-success { color: var(--success-colors-base-default); }
5434  .text--color-warning { color: var(--warning-colors-base-default); }
5435  .text--color-error { color: var(--error-colors-base-default); }
5436  .text--color-information { color: var(--information-colors-base-default); }
5437  .text--color-positive { color: var(--positive-colors-base-default); }
5438  .text--color-negative { color: var(--negative-colors-base-default); }
5439  .text--color-black { color: var(--absolute-black-colors-base-default); }
5440  .text--color-white { color: var(--absolute-white-colors-base-default); }
5441  .text--color-base { color: var(--text-colors-base); }
5442  .text--color-tint-1 { color: var(--text-colors-tint-1); }
5443  .text--color-tint-2 { color: var(--text-colors-tint-2); }
5444  .text--color-tint-3 { color: var(--text-colors-tint-3); }
5445  .text--full-width { display: block; width: 100%; }
5446  .text--align-left { text-align: left; }
5447  .text--align-center { text-align: center; }
5448  .text--align-right { text-align: right; }
5449  .text--truncated { display: inline-block; max-width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
5450  .text--multi-line-truncated { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--text-max-visible-row-count); overflow: hidden; }
5451}
5452@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5453@layer ds-subatoms {
5454  .base-text--font-gilroy { font-family: var(--fonts-gilroy); }
5455  .base-text--font-acorn { font-family: var(--fonts-acorn); }
5456  .base-text--weight-medium { font-weight: 500; }
5457  .base-text--weight-semibold { font-weight: 600; }
5458  .base-text--weight-bold { font-weight: 700; }
5459  .base-text--weight-normal { font-weight: 400; }
5460}
5461@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5462@layer ds-molecules {
5463  .notification { width: 100%; padding: var(--spacings-s12) var(--spacings-s12); border-width: 2px; border-style: solid; border-radius: var(--corner-radius-r16); box-shadow: var(--shadows-tint-1); background-color: var(--background-colors-tint-1); border-color: var(--ntf-border-color); }
5464  .notification--large { max-width: 434px; }
5465  .notification--small { max-width: 382px; }
5466  .notification__information { display: flex; flex-wrap: wrap; column-gap: var(--spacings-s8); min-height: var(--typography-t7-line-height); }
5467  .notification__information--centered { align-items: center; }
5468  .notification__progress { padding: var(--spacings-s8) var(--spacings-s0) var(--spacings-s8) var(--spacings-s32); }
5469  .notification__type-icon { display: inline-block; vertical-align: top; width: 24px; height: 24px; order: 0; }
5470  .notification__close-icon { order: 2; }
5471  .notification__title { display: block; word-break: break-word; margin-bottom: var(--spacings-s4); order: 1; flex: 1 1 0%; }
5472  .notification__description { word-break: break-word; }
5473  .notification__description--with-title { order: 3; flex: 0 0 100%; padding-left: 32px; margin-bottom: 6px; }
5474  .notification__description--without-title { order: 1; flex: 1 1 0%; }
5475  .notification__external-actions { display: flex; justify-content: flex-end; margin-top: var(--spacings-s8); gap: var(--spacings-s8); }
5476  .notification--skin-success { --ntf-border-color: var(--success-colors-base-default); }
5477  .notification--skin-success .ntf-typeIcon > path:not([fill]) { fill: var(--success-colors-base-default); }
5478  .notification--skin-warning { --ntf-border-color: var(--warning-colors-base-default); }
5479  .notification--skin-warning .ntf-typeIcon > path:not([fill]) { fill: var(--warning-colors-base-default); }
5480  .notification--skin-error { --ntf-border-color: var(--error-colors-base-default); }
5481  .notification--skin-error .ntf-typeIcon > path:not([fill]) { fill: var(--error-colors-base-default); }
5482  .notification--skin-information { --ntf-border-color: var(--information-colors-base-default); }
5483  .notification--skin-information .ntf-typeIcon > path:not([fill]) { fill: var(--information-colors-base-default); }
5484  .notification--skin-premium { --ntf-border-color: var(--monetization-ultra-colors-base-default); }
5485  .notification--skin-premium .ntf-typeIcon > path:not([fill]) { fill: var(--monetization-ultra-colors-base-default); }
5486}
5487@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5488@layer ds-atoms {
5489  .inline-button { display: inline-flex; vertical-align: top; flex-shrink: 0; align-items: center; transition-property: background-color, border-color, color; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); }
5490  .inline-button--large { height: 40px; padding-block: var(--spacings-s10); padding-inline: var(--spacings-s10); column-gap: var(--spacings-s2); border-radius: var(--corner-radius-r8); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
5491  .inline-button--small { height: 32px; padding-block: var(--spacings-s6); padding-inline: var(--spacings-s6); column-gap: var(--spacings-s2); border-radius: var(--corner-radius-r8); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
5492  .inline-button--full-width { width: 100%; }
5493  .inline-button--with-border { border-style: solid; border-width: 1px; }
5494  .inline-button--with-border.inline-button--small { border-width: 1px; }
5495  .inline-button--no-border { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
5496  .inline-button--transparent-bg { background-color: transparent; }
5497  .inline-button--center-content { justify-content: center; }
5498  .inline-button--cursor-pointer { cursor: pointer; }
5499  .inline-button--cursor-default { cursor: default; }
5500  .inline-button--cursor-not-allowed { cursor: not-allowed; }
5501  .inline-button--default { background-color: var(--control-colors-button-background-default); border-color: var(--control-colors-border-default); color: var(--control-colors-text-default); }
5502  @media (hover: hover) and (pointer: fine) {
5503  .inline-button--interactive:hover { background-color: var(--control-colors-button-background-action); border-color: var(--control-colors-border-action); color: var(--control-colors-text-action); }
5504}
5505  @media (hover: none) and (pointer: coarse) {
5506  .inline-button--interactive:active { background-color: var(--control-colors-button-background-action); border-color: var(--control-colors-border-action); color: var(--control-colors-text-action); }
5507}
5508  .inline-button--active { background-color: var(--control-colors-button-background-active); border-color: var(--control-colors-border-active); color: var(--control-colors-text-active); }
5509  @media (hover: hover) and (pointer: fine) {
5510  .inline-button--active-interactive:hover { background-color: var(--control-colors-button-background-active-action); border-color: var(--control-colors-border-active-action); color: var(--control-colors-text-active-action); }
5511}
5512  @media (hover: none) and (pointer: coarse) {
5513  .inline-button--active-interactive:active { background-color: var(--control-colors-button-background-active-action); border-color: var(--control-colors-border-active-action); color: var(--control-colors-text-active-action); }
5514}
5515  .inline-button--without-border-override { border-color: transparent; }
5516  @media (hover: hover) and (pointer: fine) {
5517  .inline-button--without-border-override:hover { border-color: transparent; }
5518}
5519  @media (hover: none) and (pointer: coarse) {
5520  .inline-button--without-border-override:active { border-color: transparent; }
5521}
5522  .inline-button--without-bg-override { background-color: transparent; }
5523  .inline-button--disabled { opacity: var(--states-disabled); cursor: not-allowed; }
5524  .inline-button--loading-skin { position: relative; color: transparent; }
5525  .inline-button__icon-holder { display: block; width: 20px; height: 20px; }
5526  .inline-button--small .inline-button__icon-holder { width: 20px; height: 20px; }
5527  .inline-button__icon { display: inline-block; flex-shrink: 0; flex-basis: 20px; width: 20px; height: 20px; min-width: 0px; min-height: 0px; transition-property: transform; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); }
5528  .inline-button--small .inline-button__icon { flex-basis: 20px; width: 20px; height: 20px; }
5529  .inline-button__icon > path:not([fill]) { fill: currentcolor; }
5530  .inline-button__arrow-active { transform: rotate(180deg); }
5531  .inline-button__content-wrap { display: grid; flex-grow: 1; height: 20px; padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
5532  .inline-button--small .inline-button__content-wrap { height: 20px; padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
5533  .inline-button__content-align-start { text-align: start; }
5534  .inline-button__content-align-center { text-align: center; }
5535  .inline-button__content-align-end { text-align: end; }
5536  .inline-button__content { width: 100%; min-width: 0px; min-height: 0px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-family: var(--fonts-gilroy); }
5537  .inline-button__control { display: none; }
5538  .inline-button__loading-icon { position: absolute; inset: 0px; margin: auto; pointer-events: none; }
5539  @keyframes inline-btn-rotate { 
5540  100% { transform: rotate(360deg); }
5541}
5542  .inline-button__loading-icon-skin { color: var(--control-colors-text-default); animation: inline-btn-rotate var(--timings-long) var(--easings-linear) infinite; }
5543}
5544@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5545@layer ds-atoms {
5546  .monetization-badge { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; background: var(--gradients-status-info); color: var(--information-colors-text-default); }
5547  .monetization-badge--shadow { box-shadow: var(--shadows-tint-2); }
5548  .monetization-badge--rectangle.monetization-badge--large { width: 44px; height: 20px; border-radius: var(--corner-radius-r16); }
5549  .monetization-badge--rectangle.monetization-badge--small { width: 32px; height: 14px; border-radius: var(--corner-radius-r12); }
5550  .monetization-badge--skin-plus { background: var(--gradients-monetization-plus); color: var(--monetization-plus-colors-text-default); }
5551  .monetization-badge--skin-pro { background: var(--gradients-monetization-pro); color: var(--monetization-pro-colors-text-default); }
5552  .monetization-badge--skin-ultra { background: var(--gradients-monetization-ultra); color: var(--negative-colors-text-default); }
5553  .monetization-badge__icon { display: block; }
5554  .monetization-badge__icon > path:not([fill]) { fill: currentcolor; }
5555  .monetization-badge__icon--rectangle-large { width: 32px; height: 16px; }
5556  .monetization-badge__icon--rectangle-small { width: 28px; height: 14px; }
5557}
5558@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5559@layer ds-atoms {
5560  .tool-badge { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; background-color: var(--information-colors-base-default); color: var(--information-colors-text-default); }
5561  .tool-badge--shadow { box-shadow: var(--shadows-tint-2); }
5562  .tool-badge--circle { border-radius: var(--corner-radius-circle); }
5563  .tool-badge--circle.tool-badge--large { width: 20px; height: 20px; }
5564  .tool-badge--circle.tool-badge--small { width: 14px; height: 14px; }
5565  .tool-badge--rectangle.tool-badge--large { width: 44px; height: 20px; border-radius: var(--corner-radius-r16); }
5566  .tool-badge--rectangle.tool-badge--small { width: 32px; height: 14px; border-radius: var(--corner-radius-r12); }
5567  .tool-badge--skin-new { background: var(--gradients-status-success); color: var(--information-colors-text-default); }
5568  .tool-badge--skin-live { background: var(--gradients-status-success); color: var(--success-colors-text-default); }
5569  .tool-badge--skin-hot-text { background: var(--gradients-status-warning); color: var(--warning-colors-text-default); }
5570  .tool-badge__icon { display: block; }
5571  .tool-badge__icon > path:not([fill]) { fill: currentcolor; }
5572  .tool-badge__icon--circle-large { width: 12px; height: 12px; }
5573  .tool-badge__icon--circle-small { width: 10px; height: 10px; }
5574  .tool-badge__icon--rectangle-large { width: 32px; height: 16px; }
5575  .tool-badge__icon--rectangle-small { width: 28px; height: 14px; }
5576}
5577@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5578@layer ds-atoms {
5579  .user-badge { display: inline-flex; vertical-align: top; align-items: center; justify-content: center; background-color: var(--information-colors-base-default); color: var(--information-colors-text-default); }
5580  .user-badge--shadow { box-shadow: var(--shadows-tint-2); }
5581  .user-badge--circle { border-radius: var(--corner-radius-circle); }
5582  .user-badge--circle.user-badge--large { width: 20px; height: 20px; }
5583  .user-badge--circle.user-badge--small { width: 14px; height: 14px; }
5584  .user-badge--skin-crown { background-color: var(--warning-colors-base-default); color: var(--warning-colors-text-default); }
5585  .user-badge__icon { display: block; }
5586  .user-badge__icon > path:not([fill]) { fill: currentcolor; }
5587  .user-badge__icon--circle-large { width: 12px; height: 12px; }
5588  .user-badge__icon--circle-small { width: 10px; height: 10px; }
5589}
5590@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5591@layer ds-atoms {
5592  @keyframes progress-loading-bar { 
5593  0% { transform: translate(-100%); }
5594  100% { transform: translate(400%); }
5595}
5596  .progress { display: inline-block; vertical-align: top; }
5597  .progress__circle-bg { stroke: var(--background-colors-tint-3); }
5598  .progress__circle-load { stroke: var(--progress-status); transition: all var(--timings-fast) var(--easings-linear); }
5599  .progress--circular { width: 60px; height: 60px; }
5600  .progress--rectangular { background-color: var(--background-colors-tint-2); height: 4px; overflow: hidden; }
5601  .progress--full-width { width: 100%; }
5602  .progress--with-border-radius { border-radius: var(--corner-radius-r4); }
5603  .progress--status-default { --progress-status: var(--primary-colors-base-default); }
5604  .progress--status-error { --progress-status: var(--error-colors-base-default); }
5605  .progress--status-success { --progress-status: var(--success-colors-base-default); }
5606  .progress--status-warning { --progress-status: var(--warning-colors-base-default); }
5607  .progress--status-information { --progress-status: var(--information-colors-base-default); }
5608  .progress--linear::after { content: ""; display: block; width: 100%; height: 100%; background-color: var(--progress-status); will-change: transform; transition: all var(--timings-fast) var(--easings-linear); border-radius: inherit; }
5609  [dir="ltr"] .progress--linear::after { transform: translate(calc(-1 * (100 - var(--progress-percent)) * 1%)); }
5610  [dir="rtl"] .progress--linear::after { transform: translate(calc((100 - var(--progress-percent)) * 1%)); }
5611  .progress--continues::before { content: ""; display: block; width: 30%; height: 100%; background-color: var(--progress-status); border-radius: inherit; transform: translate(-100%); animation: progress-loading-bar var(--timings-heavy) cubic-bezier(.65,.815,.735,.395) infinite; }
5612}
5613@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5614@layer ds-templates {
5615  .blank-skeleton { display: flex; flex-direction: column; gap: var(--spacings-s8); width: 100%; padding: var(--spacings-s16); }
5616  .blank-skeleton__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--spacings-s8); }
5617  .blank-skeleton__item { aspect-ratio: 1 / 1; }
5618}
5619@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5620@layer ds-atoms {
5621  @keyframes skeleton-ltr { 
5622  0% { transform: translate(-200%, -50%); }
5623  100% { transform: translate(100%, -50%); }
5624}
5625  @keyframes skeleton-rtl { 
5626  0% { transform: translate(100%, -50%); }
5627  100% { transform: translate(-200%, -50%); }
5628}
5629  .skeleton { display: block; position: relative; overflow: hidden; clip-path: view-box; background-color: var(--background-colors-tint-2); width: var(--skeleton-width); height: var(--skeleton-height); border-radius: var(--skeleton-border-radius, 0); }
5630  .skeleton::before { content: ""; display: block; width: 50%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-image: linear-gradient(90deg,transparent,var(--background-colors-tint-3),transparent); will-change: transform; }
5631  [dir="ltr"] .skeleton::before { animation: skeleton-ltr var(--timings-long) var(--easings-linear) infinite; }
5632  [dir="rtl"] .skeleton::before { animation: skeleton-rtl var(--timings-long) var(--easings-linear) infinite; }
5633}
5634@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5635@layer ds-templates {
5636  .blank-credits-count { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: var(--spacings-s6); padding-top: var(--spacings-s10); padding-bottom: var(--spacings-s10); }
5637  .blank-credits-count__info { display: flex; align-items: center; gap: var(--spacings-s6); }
5638  .blank-credits-count__icon { width: 20px; height: 20px; fill: var(--text-colors-base); }
5639  .blank-credits-count__action-button { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; color: var(--primary-colors-base-default); background-color: transparent; font-weight: 600; cursor: pointer; white-space: nowrap; }
5640  @media (hover: hover) and (pointer: fine) {
5641  .blank-credits-count__action-button:hover { color: var(--primary-colors-base-action); }
5642}
5643}
5644@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5645@layer ds-templates {
5646  .blank-footer-text-block { display: flex; justify-content: center; text-align: center; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
5647}
5648@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5649@layer ds-atoms {
5650  .anchor-text__anchor { color: var(--primary-colors-base-default); text-decoration: none; cursor: pointer; }
5651  .anchor-text__anchor--underlined { text-decoration: underline; }
5652  @media (hover: hover) and (pointer: fine) {
5653  .anchor-text__anchor:hover { text-decoration: underline; }
5654}
5655}
5656@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5657@layer ds-subatoms {
5658  .base-link--font-gilroy { font-family: var(--fonts-gilroy); }
5659  .base-link--font-acorn { font-family: var(--fonts-acorn); }
5660  .base-link--weight-normal { font-weight: 400; }
5661  .base-link--weight-medium { font-weight: 500; }
5662  .base-link--weight-semibold { font-weight: 600; }
5663  .base-link--weight-bold { font-weight: 700; }
5664}
5665@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5666@layer ds-templates {
5667  .blank { display: grid; grid-template: "header" "body" 1fr "footer" / 1fr; width: 100%; background-color: var(--background-colors-base); transition: background-color var(--timings-default) var(--easings-ease); }
5668  .blank--disabled { opacity: var(--states-disabled); pointer-events: none; }
5669  .blank--full-height { height: 100%; }
5670  .blank--dynamic { min-height: 100%; }
5671  .blank__common { min-width: 0px; min-height: 0px; }
5672  .blank__header { grid-area: header; padding: var(--spacings-s6) var(--spacings-s16) var(--spacings-s8) var(--spacings-s16); }
5673  @media screen and (min-width: 1600px) {
5674  .blank__header--desktop { padding-top: var(--spacings-s10); }
5675}
5676  .blank__body { grid-area: body; height: 100%; padding-inline-start: var(--spacings-s16); overflow: hidden scroll; }
5677  @supports (-moz-appearance: none) {
5678  .blank__body { padding-inline-end: var(--spacings-s16); scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
5679}
5680  @media (pointer: fine) {
5681  .blank__body::-webkit-scrollbar { width: 16px; height: 16px; }
5682  .blank__body::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
5683  .blank__body::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r12); background-color: var(--background-colors-border); background-clip: content-box; border: 6px solid transparent; transition: background-color var(--timings-default) var(--easings-ease); }
5684  .blank__body::-webkit-scrollbar-corner { background: transparent; }
5685}
5686  @media (pointer: coarse) {
5687  .blank__body::-webkit-scrollbar { display: none; }
5688}
5689  @supports not (-moz-appearance: none) {
5690  .blank__body--desktop { padding-inline-end: 0px; }
5691}
5692  @supports not (-moz-appearance: none) {
5693  .blank__body--non-desktop { padding-inline-end: var(--spacings-s16); }
5694}
5695  .blank__body--loading { padding-inline: 0px; overflow-y: hidden; }
5696  .blank__footer { grid-area: footer; display: flex; flex-direction: column; gap: var(--spacings-s8); padding: var(--spacings-s8) var(--spacings-s16) var(--spacings-s16) var(--spacings-s16); }
5697}
5698@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5699@layer ds-molecules {
5700  .credit-button { position: relative; display: inline-flex; vertical-align: top; align-items: center; justify-content: center; max-width: 100%; border-style: solid; border-width: 0px; background-color: transparent; transition: background-color var(--timings-default) var(--easings-ease),border-color var(--timings-default) var(--easings-ease),color var(--timings-default) var(--easings-ease),opacity var(--timings-default) var(--easings-ease); height: 32px; padding-block: 4px; padding-inline: 4px; border-radius: 30px; font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); --credit-button-blink-glow: var(--text-colors-base); --credit-button-blink-ring: #6C6C6C; }
5701  .credit-button--status-default { background-color: var(--neutral-colors-base-default); }
5702  @media (hover: hover) and (pointer: fine) {
5703  .credit-button--status-default:hover { background-color: var(--neutral-colors-base-action); }
5704}
5705  .credit-button--status-default:active { background-color: var(--neutral-colors-base-active); }
5706  @media (hover: hover) and (pointer: fine) {
5707  .credit-button--status-default:active:hover { background-color: var(--neutral-colors-base-active-action); }
5708}
5709  .credit-button--status-default { color: var(--neutral-colors-text-default); }
5710  @media (hover: hover) and (pointer: fine) {
5711  .credit-button--status-default:hover { color: var(--neutral-colors-text-action); }
5712}
5713  .credit-button--status-default:active { color: var(--neutral-colors-text-active); }
5714  @media (hover: hover) and (pointer: fine) {
5715  .credit-button--status-default:active:hover { color: var(--neutral-colors-text-active-action); }
5716}
5717  .credit-button--status-low { --credit-button-blink-glow: var(--warning-colors-base-default); --credit-button-blink-ring: var(--warning-colors-base-default); border-width: 1px; border-color: var(--warning-colors-base-default); }
5718  @media (hover: hover) and (pointer: fine) {
5719  .credit-button--status-low:hover { border-color: var(--warning-colors-base-action); }
5720}
5721  .credit-button--status-low:active { border-color: var(--warning-colors-base-active); }
5722  @media (hover: hover) and (pointer: fine) {
5723  .credit-button--status-low:active:hover { border-color: var(--warning-colors-base-active-action); }
5724}
5725  .credit-button--status-low { color: var(--warning-colors-base-default); }
5726  @media (hover: hover) and (pointer: fine) {
5727  .credit-button--status-low:hover { color: var(--warning-colors-base-action); }
5728}
5729  .credit-button--status-low:active { color: var(--warning-colors-base-active); }
5730  @media (hover: hover) and (pointer: fine) {
5731  .credit-button--status-low:active:hover { color: var(--warning-colors-base-active-action); }
5732}
5733  .credit-button--status-critical { --credit-button-blink-glow: var(--error-colors-base-default); --credit-button-blink-ring: var(--error-colors-base-default); border-width: 1px; border-color: var(--error-colors-base-default); }
5734  @media (hover: hover) and (pointer: fine) {
5735  .credit-button--status-critical:hover { border-color: var(--error-colors-base-action); }
5736}
5737  .credit-button--status-critical:active { border-color: var(--error-colors-base-active); }
5738  @media (hover: hover) and (pointer: fine) {
5739  .credit-button--status-critical:active:hover { border-color: var(--error-colors-base-active-action); }
5740}
5741  .credit-button--status-critical { color: var(--error-colors-base-default); }
5742  @media (hover: hover) and (pointer: fine) {
5743  .credit-button--status-critical:hover { color: var(--error-colors-base-action); }
5744}
5745  .credit-button--status-critical:active { color: var(--error-colors-base-active); }
5746  @media (hover: hover) and (pointer: fine) {
5747  .credit-button--status-critical:active:hover { color: var(--error-colors-base-active-action); }
5748}
5749  .credit-button__content { display: inline-flex; align-items: center; min-width: 0px; column-gap: var(--spacings-s2); }
5750  .credit-button__icon { display: inline-block; flex: 0 0 20px; width: 20px; height: 20px; }
5751  .credit-button__icon > path:not([fill]) { fill: currentcolor; }
5752  .credit-button__credits { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-inline: 2px; }
5753  .credit-button--blink { animation: credit-button-shadow var(--timings-medium) var(--easings-ease) forwards; }
5754  .credit-button--blink::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1.1); transition: scale var(--timings-medium) var(--easings-ease),box-shadow var(--timings-medium) var(--easings-ease); width: calc(100% + 1px); height: calc(100% + 1px); border: 1px solid var(--credit-button-blink-ring); border-radius: 30px; animation: credit-button-blink var(--timings-medium) var(--easings-ease) forwards; pointer-events: none; }
5755  @keyframes credit-button-shadow { 
5756  0%, 100% { box-shadow: none; }
5757  25%, 50% { box-shadow: 0 0 6px 6px color-mix(in srgb,var(--credit-button-blink-glow) 24%,transparent); }
5758}
5759  @keyframes credit-button-blink { 
5760  0% { transform: translate(-50%, -50%) scale(1.1); opacity: 0; }
5761  25% { transform: translate(-50%, -50%) scale(1.1, 1.2); opacity: 0.8; }
5762  50% { transform: translate(-50%, -50%) scale(1.2, 1.3); opacity: 0.6; }
5763  100% { transform: translate(-50%, -50%) scale(1.1); opacity: 0; }
5764}
5765}
5766@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5767@layer ds-subatoms {
5768  .base-button { appearance: none; margin: 0px; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; font: inherit; color: inherit; text-align: inherit; }
5769  .base-button:disabled { color: inherit; }
5770  .base-button--not-interactive { cursor: not-allowed; pointer-events: none; }
5771  .base-button--enabled { cursor: pointer; }
5772  .base-button--disabled { opacity: var(--states-disabled); pointer-events: none; }
5773  .base-button--loading { cursor: default; pointer-events: none; }
5774}
5775@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5776@layer ds-molecules {
5777  .panel-heading__top { display: grid; align-items: center; grid-template: "action title optional" 1fr / auto 1fr auto; }
5778  .panel-heading__brand-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-inline-end: var(--spacings-s4); }
5779  .panel-heading__brand-icon svg { width: 20px; height: 20px; fill: var(--text-colors-tint-1); }
5780  .panel-heading__common { min-width: 0px; }
5781  .panel-heading__back-button { grid-area: action; margin-inline-end: var(--spacings-s4); }
5782  [dir="rtl"] .panel-heading__back-button { transform: rotate(180deg); }
5783  .panel-heading__center-container { grid-area: title; display: flex; align-items: center; }
5784  .panel-heading__title-start { justify-content: start; }
5785  .panel-heading__title-container { display: grid; align-items: center; grid-template: "mainTitle count badge" 1fr / auto min-content 1fr; }
5786  .panel-heading__title { display: block; grid-area: mainTitle; transition: color var(--timings-default) var(--easings-ease); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
5787  .panel-heading__count { margin-inline-start: var(--spacings-s4); grid-area: count; }
5788  .panel-heading [data-testid="badge"] { grid-area: badge; vertical-align: baseline; margin-inline-start: var(--spacings-s8); }
5789  .panel-heading__optional { display: flex; gap: var(--spacings-s2); }
5790  .panel-heading__actions { grid-area: optional; display: flex; align-items: center; gap: var(--spacings-s2); margin-inline-start: var(--spacings-s8); }
5791  .panel-heading__bottom { margin-top: var(--spacings-s8); }
5792}
5793@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5794@layer ds-atoms {
5795  .text-tooltip { max-width: 390px; z-index: var(--text-tooltip-z-index); --container-background-color: var(--negative-colors-base-default); --container-border-color: var(--background-colors-border); background-color: var(--container-background-color); border-radius: var(--corner-radius-r8); }
5796  .text-tooltip__text { display: block; padding: var(--spacings-s8); color: var(--negative-colors-text-default); text-align: center; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
5797}
5798@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5799@layer ds-subatoms {
5800  .base-floating-container { position: relative; border: 1px solid var(--container-border-color); background-color: var(--container-background-color); }
5801  .base-floating-container--transform-start { transform: translate(10px); }
5802  .base-floating-container--transform-end { transform: translate(-10px); }
5803  .base-floating-container--transform-default { transform: translate(0px); }
5804  .base-floating-container__indicator { display: inline-block; position: absolute; width: 20px; height: 14px; }
5805  .base-floating-container__indicator > path:nth-child(1) { fill: var(--container-background-color); }
5806  .base-floating-container__indicator > path:nth-child(2) { fill: var(--container-border-color); }
5807}
5808@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5809@layer ds-atoms {
5810  .text-field { width: 100%; }
5811  .text-field--large { height: 40px; }
5812  .text-field--small { height: 32px; }
5813  .text-field--relative { position: relative; }
5814  .text-field__control { display: block; width: 100%; height: 100%; border-width: 1px; border-style: solid; border-radius: var(--corner-radius-r8); font-family: var(--fonts-gilroy); font-weight: 500; transition-property: background-color, border-color, color; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease); }
5815  .text-field__control::placeholder { font-size: var(--typography-t4-font-size); line-height: 1; font-family: inherit; }
5816  .text-field__control::-webkit-outer-spin-button, .text-field__control::-webkit-inner-spin-button { appearance: none; margin: 0px; }
5817  .text-field__control[type="number"] { }
5818  .text-field__control--centered { text-align: center; }
5819  .text-field__control--large, .text-field__control--small { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); font-weight: 500; }
5820  .text-field__control--default-padding.text-field__control--large { padding: 0 calc(var(--spacings-s10) - 1px); }
5821  .text-field__control--default-padding.text-field__control--small { padding: 0 calc(var(--spacings-s6) - 1px); }
5822  .text-field__control--placeholder-padding.text-field__control--large { padding-inline-start: calc(var(--spacings-s10) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
5823  .text-field__control--placeholder-padding.text-field__control--small { padding-inline-start: calc(var(--spacings-s6) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
5824  .text-field__control--button-padding.text-field__control--large { padding-inline-end: calc(var(--spacings-s10) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
5825  .text-field__control--button-padding.text-field__control--small { padding-inline-end: calc(var(--spacings-s6) + 20px + var(--spacings-s2) + var(--spacings-s2)); }
5826  .text-field__placeholder-icon { display: inline-block; vertical-align: top; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; pointer-events: none; }
5827  .text-field__placeholder-icon--large { width: 20px; height: 20px; inset-inline-start: var(--spacings-s10); }
5828  .text-field__placeholder-icon--small { width: 20px; height: 20px; inset-inline-start: var(--spacings-s6); }
5829  .text-field__button { display: inline-block; vertical-align: top; position: absolute; top: 0px; bottom: 0px; margin: auto 0px; cursor: pointer; }
5830  .text-field__button--large { width: 20px; height: 20px; inset-inline-end: var(--spacings-s10); }
5831  .text-field__button--small { width: 20px; height: 20px; inset-inline-end: var(--spacings-s6); }
5832  .text-field--default-skin { border-color: var(--control-colors-border-default); color: var(--control-colors-value-default); background-color: var(--text-field-bg-override, var(--control-colors-field-background-default)); }
5833  @media (hover: hover) and (pointer: fine) {
5834  .text-field--interactive:hover { border-color: var(--control-colors-border-action); color: var(--control-colors-value-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-action)); }
5835}
5836  @media (hover: none) and (pointer: coarse) {
5837  .text-field--interactive:active { border-color: var(--control-colors-border-action); color: var(--control-colors-value-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-action)); }
5838}
5839  .text-field--interactive:focus { border-color: var(--control-colors-border-active); color: var(--control-colors-value-active); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active)); }
5840  .text-field--filled { color: var(--control-colors-value-active); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active)); border-color: var(--control-colors-border-active); }
5841  @media (hover: hover) and (pointer: fine) {
5842  .text-field--filled:hover { border-color: var(--control-colors-border-active-action); color: var(--control-colors-value-active-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active-action)); }
5843}
5844  @media (hover: none) and (pointer: coarse) {
5845  .text-field--filled:active { border-color: var(--control-colors-border-active-action); color: var(--control-colors-value-active-action); background-color: var(--text-field-bg-override, var(--control-colors-field-background-active-action)); }
5846}
5847  .text-field--error { border-color: var(--error-colors-base-default); }
5848  @media (hover: hover) and (pointer: fine) {
5849  .text-field--error:hover { border-color: var(--error-colors-base-action); }
5850}
5851  @media (hover: none) and (pointer: coarse) {
5852  .text-field--error:active { border-color: var(--error-colors-base-active); }
5853}
5854  .text-field--error-active { border-color: var(--error-colors-base-active); }
5855  @media (hover: hover) and (pointer: fine) {
5856  .text-field--error-active:hover { border-color: var(--error-colors-base-active-action); }
5857}
5858  @media (hover: none) and (pointer: coarse) {
5859  .text-field--error-active:active { border-color: var(--error-colors-base-active-action); }
5860}
5861  .text-field--warning { border-color: var(--warning-colors-base-default); }
5862  @media (hover: hover) and (pointer: fine) {
5863  .text-field--warning:hover { border-color: var(--warning-colors-base-action); }
5864}
5865  @media (hover: none) and (pointer: coarse) {
5866  .text-field--warning:active { border-color: var(--warning-colors-base-action); }
5867}
5868  .text-field--warning-active { border-color: var(--warning-colors-base-active); }
5869  @media (hover: hover) and (pointer: fine) {
5870  .text-field--warning-active:hover { border-color: var(--warning-colors-base-active-action); }
5871}
5872  @media (hover: none) and (pointer: coarse) {
5873  .text-field--warning-active:active { border-color: var(--warning-colors-base-active-action); }
5874}
5875  .text-field--success { border-color: var(--success-colors-base-default); }
5876  @media (hover: hover) and (pointer: fine) {
5877  .text-field--success:hover { border-color: var(--success-colors-base-action); }
5878}
5879  @media (hover: none) and (pointer: coarse) {
5880  .text-field--success:active { border-color: var(--success-colors-base-action); }
5881}
5882  .text-field--success-active { border-color: var(--success-colors-base-active); }
5883  @media (hover: hover) and (pointer: fine) {
5884  .text-field--success-active:hover { border-color: var(--success-colors-base-active-action); }
5885}
5886  @media (hover: none) and (pointer: coarse) {
5887  .text-field--success-active:active { border-color: var(--success-colors-base-active-action); }
5888}
5889  .text-field--disabled { opacity: var(--states-disabled); }
5890  .text-field--disabled-icon { opacity: var(--states-disabled); cursor: auto; }
5891  .text-field--without-background { --text-field-bg-override: transparent; }
5892  .text-field--without-borders { border-style: none; }
5893  .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-default); }
5894  .text-field__skin-placeholder-icon > path { fill: currentcolor; }
5895  .text-field__skin-button { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; color: var(--control-colors-end-icon-default); transition: color var(--timings-default) var(--easings-ease); }
5896  @media (hover: hover) and (pointer: fine) {
5897  .text-field__skin-button:hover { color: var(--control-colors-end-icon-action); }
5898}
5899  @media (hover: none) and (pointer: coarse) {
5900  .text-field__skin-button:active { color: var(--control-colors-end-icon-action); }
5901}
5902  .text-field__skin-button-icon { display: block; width: 100%; height: 100%; }
5903  .text-field__skin-button-icon > path { fill: currentcolor; }
5904  @media (hover: hover) and (pointer: fine) {
5905  .text-field--interactive:hover + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-action); }
5906}
5907  @media (hover: none) and (pointer: coarse) {
5908  .text-field--interactive:active + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-action); }
5909}
5910  .text-field--filled + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-active); }
5911  @media (hover: hover) and (pointer: fine) {
5912  .text-field--filled:hover + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-active-action); }
5913}
5914  @media (hover: none) and (pointer: coarse) {
5915  .text-field--filled:active + .text-field__skin-placeholder-icon { color: var(--control-colors-start-icon-active-action); }
5916}
5917  .text-field--with-glassy-effect { position: relative; z-index: 0; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; --text-field-bg-override: transparent; }
5918  .text-field--with-glassy-effect .text-field__control:not(:where(.text-field--error, .text-field--warning, .text-field--success)) { border-color: transparent; }
5919  .text-field__glass { position: relative; overflow: hidden; background-color: var(--effects-glassy-tint); border: 1px solid var(--effects-glassy-highlight-border); box-shadow: var(--effects-glassy-shadow),var(--effects-glassy-inner-shadow); backdrop-filter: var(--effects-glassy-backdrop); border-block-start: 0px; border-inline-start: 0px; }
5920  .text-field__glass::before, .text-field__glass::after { content: ""; position: absolute; pointer-events: none; }
5921  .text-field__glass::before { inset-block-start: 0px; inset-inline: 10%; height: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-top); }
5922  .text-field__glass::after { inset-block: 0px; inset-inline-start: 0px; width: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-side); }
5923  .text-field__glass { position: absolute; inset: 0px; z-index: -1; border-radius: var(--corner-radius-r8); pointer-events: none; }
5924}
5925@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5926@layer ds-atoms {
5927  .image-frame { position: relative; display: inline-grid; overflow: hidden; width: var(--imageframe-width); height: var(--imageframe-height); border-radius: var(--imageframe-border-radius, 0); }
5928  .image-frame::before { content: ""; position: absolute; inset: 0px; z-index: 1; border: 1px solid var(--background-colors-tint-2); border-radius: var(--imageframe-border-radius, 0); opacity: 0; transition: opacity var(--timings-default) var(--easings-ease); pointer-events: none; }
5929  .image-frame--bg { background-color: var(--background-colors-tint-1); }
5930  .image-frame--interactive { cursor: pointer; }
5931  .image-frame--interactive::before { opacity: 1; }
5932  @media (hover: hover) and (pointer: fine) {
5933  .image-frame--interactive:hover::before { opacity: 0; }
5934}
5935  .image-frame--active-border::before { border-color: var(--primary-colors-base-default); }
5936  @media (hover: hover) and (pointer: fine) {
5937  .image-frame--active-border:hover::before { opacity: 0.7; }
5938}
5939  .image-frame--transparent { background-image: conic-gradient(var(--background-colors-tint-1) 90deg,var(--background-colors-tint-3) 0 180deg,var(--background-colors-tint-1) 0 270deg,var(--background-colors-tint-3) 0); background-size: 8px 8px; background-clip: content-box; padding: var(--spacings-s2); }
5940  .image-frame--disabled { opacity: var(--states-disabled); pointer-events: none; }
5941  .image-frame__content { grid-area: 1 / 1; min-height: 0px; min-width: 0px; pointer-events: none; }
5942  .image-frame__content * { pointer-events: initial; }
5943}
5944@keyframes marching-ants { 
5945  0% { background-position: 0px 0px, 0px 100%, 0px 0px, 100% 0px; }
5946  100% { background-position: 20px 0px, -20px 100%, 0px -20px, 100% 20px; }
5947}
5948:root { --rc-drag-handle-size: 12px; --rc-drag-handle-mobile-size: 24px; --rc-drag-handle-bg-colour: #0003; --rc-drag-bar-size: 6px; --rc-border-color: #ffffffb3; --rc-focus-color: #08f; }
5949.ReactCrop { cursor: crosshair; max-width: 100%; display: inline-block; position: relative; }
5950.ReactCrop *, .ReactCrop ::before, .ReactCrop ::after { box-sizing: border-box; }
5951.ReactCrop--disabled, .ReactCrop--locked { cursor: inherit; }
5952.ReactCrop__child-wrapper { max-height: inherit; overflow: hidden; }
5953.ReactCrop__child-wrapper > img, .ReactCrop__child-wrapper > video { max-width: 100%; max-height: inherit; display: block; }
5954.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper > img, .ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper > video, .ReactCrop:not(.ReactCrop--disabled) .ReactCrop__crop-selection { touch-action: none; }
5955.ReactCrop__crop-mask { pointer-events: none; width: calc(100% + 0.5px); height: calc(100% + 0.5px); position: absolute; inset: 0px; }
5956.ReactCrop__crop-selection { cursor: move; position: absolute; top: 0px; left: 0px; transform: translate(0px); }
5957.ReactCrop--disabled .ReactCrop__crop-selection { cursor: inherit; }
5958.ReactCrop--circular-crop .ReactCrop__crop-selection { border-radius: 50%; }
5959.ReactCrop--circular-crop .ReactCrop__crop-selection::after { pointer-events: none; content: ""; border: 1px solid var(--rc-border-color); opacity: 0.3; position: absolute; inset: -1px; }
5960.ReactCrop--no-animate .ReactCrop__crop-selection { outline: rgb(255, 255, 255) dashed 1px; }
5961.ReactCrop__crop-selection:not(.ReactCrop--no-animate .ReactCrop__crop-selection) { color: rgb(255, 255, 255); background-image: linear-gradient(90deg, rgb(255, 255, 255) 50%, rgb(68, 68, 68) 50%), linear-gradient(90deg, rgb(255, 255, 255) 50%, rgb(68, 68, 68) 50%), linear-gradient(rgb(255, 255, 255) 50%, rgb(68, 68, 68) 50%), linear-gradient(rgb(255, 255, 255) 50%, rgb(68, 68, 68) 50%);
5961 background-position: 0px 0px, 0px 100%, 0px 0px, 100% 0px; background-repeat: repeat-x, repeat-x, repeat-y, repeat-y; background-size: 10px 1px, 10px 1px, 1px 10px, 1px 10px; animation: 1s linear 0s infinite normal none running marching-ants; }
5962.ReactCrop__crop-selection:focus { outline: 2px solid var(--rc-focus-color); outline-offset: -1px; }
5963.ReactCrop--invisible-crop .ReactCrop__crop-mask, .ReactCrop--invisible-crop .ReactCrop__crop-selection { display: none; }
5964.ReactCrop__rule-of-thirds-vt::before, .ReactCrop__rule-of-thirds-vt::after, .ReactCrop__rule-of-thirds-hz::before, .ReactCrop__rule-of-thirds-hz::after { content: ""; background-color: rgba(255, 255, 255, 0.4); display: block; position: absolute; }
5965.ReactCrop__rule-of-thirds-vt::before, .ReactCrop__rule-of-thirds-vt::after { width: 1px; height: 100%; }
5966.ReactCrop__rule-of-thirds-vt::before { left: 33.3333%; }
5967.ReactCrop__rule-of-thirds-vt::after { left: 66.6667%; }
5968.ReactCrop__rule-of-thirds-hz::before, .ReactCrop__rule-of-thirds-hz::after { width: 100%; height: 1px; }
5969.ReactCrop__rule-of-thirds-hz::before { top: 33.3333%; }
5970.ReactCrop__rule-of-thirds-hz::after { top: 66.6667%; }
5971.ReactCrop__drag-handle { width: var(--rc-drag-handle-size); height: var(--rc-drag-handle-size); background-color: var(--rc-drag-handle-bg-colour); border: 1px solid var(--rc-border-color); position: absolute; }
5972.ReactCrop__drag-handle:focus { background: var(--rc-focus-color); }
5973.ReactCrop .ord-nw { cursor: nw-resize; top: 0px; left: 0px; transform: translate(-50%, -50%); }
5974.ReactCrop .ord-n { cursor: n-resize; top: 0px; left: 50%; transform: translate(-50%, -50%); }
5975.ReactCrop .ord-ne { cursor: ne-resize; top: 0px; right: 0px; transform: translate(50%, -50%); }
5976.ReactCrop .ord-e { cursor: e-resize; top: 50%; right: 0px; transform: translate(50%, -50%); }
5977.ReactCrop .ord-se { cursor: se-resize; bottom: 0px; right: 0px; transform: translate(50%, 50%); }
5978.ReactCrop .ord-s { cursor: s-resize; bottom: 0px; left: 50%; transform: translate(-50%, 50%); }
5979.ReactCrop .ord-sw { cursor: sw-resize; bottom: 0px; left: 0px; transform: translate(-50%, 50%); }
5980.ReactCrop .ord-w { cursor: w-resize; top: 50%; left: 0px; transform: translate(-50%, -50%); }
5981.ReactCrop__disabled .ReactCrop__drag-handle { cursor: inherit; }
5982.ReactCrop__drag-bar { position: absolute; }
5983.ReactCrop__drag-bar.ord-n { width: 100%; height: var(--rc-drag-bar-size); top: 0px; left: 0px; transform: translateY(-50%); }
5984.ReactCrop__drag-bar.ord-e { width: var(--rc-drag-bar-size); height: 100%; top: 0px; right: 0px; transform: translate(50%); }
5985.ReactCrop__drag-bar.ord-s { width: 100%; height: var(--rc-drag-bar-size); bottom: 0px; left: 0px; transform: translateY(50%); }
5986.ReactCrop__drag-bar.ord-w { width: var(--rc-drag-bar-size); height: 100%; top: 0px; left: 0px; transform: translate(-50%); }
5987.ReactCrop--new-crop .ReactCrop__drag-bar, .ReactCrop--new-crop .ReactCrop__drag-handle, .ReactCrop--fixed-aspect .ReactCrop__drag-bar, .ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-n, .ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-e, .ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-s, .ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-w { display: none; }
5988@media (pointer: coarse) {
5989  .ReactCrop .ord-n, .ReactCrop .ord-e, .ReactCrop .ord-s, .ReactCrop .ord-w { display: none; }
5990  .ReactCrop__drag-handle { width: var(--rc-drag-handle-mobile-size); height: var(--rc-drag-handle-mobile-size); }
5991}
5992@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
5993@layer ds-atoms {
5994  .image { display: block; max-width: 100%; }
5995}
5996.crop-modal__backdrop { position: fixed; inset: 0px; z-index: 9999; display: flex; align-items: center; justify-content: center; background-color: rgba(0, 0, 0, 0.6); backdrop-filter: blur(8px); }
5997@media (max-width: 768px) {
5998  .crop-modal__backdrop { align-items: flex-end; }
5999}
6000.crop-modal__dialog { position: relative; display: flex; flex-direction: column; background-color: var(--background-colors-base); border-radius: var(--corner-radius-r12); border: 1px solid var(--background-colors-border); box-shadow: rgba(0, 0, 0, 0.24) 0px 8px 32px; padding: var(--spacings-s24) 124px; gap: var(--spacings-s16); width: 700px; max-width: 95vw; height: 620px; max-height: 85vh; min-height: 0px; }
6001@media (max-width: 768px) {
6002  .crop-modal__dialog { width: 100%; height: 85vh; max-width: 100%; max-height: 85vh; border-radius: 16px 16px 0px 0px; box-shadow: rgba(0, 0, 0, 0.2) 0px -4px 24px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: var(--spacings-s24) var(--spacings-s16) var(--spacings-s24); }
6003}
6004.crop-modal__close-btn { position: absolute; top: 0px; right: 0px; transform: translate(50%, -50%); z-index: 1; box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px; border-radius: 50% !important; min-width: 36px !important; width: 36px !important; height: 36px !important; padding: 0px !important; }
6005@media (max-width: 768px) {
6006  .crop-modal__close-btn { top: var(--spacings-s24); right: var(--spacings-s16); transform: none; box-shadow: none; }
6007}
6008.crop-modal__header { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--spacings-s6); padding-bottom: var(--spacings-s8); }
6009@media (max-width: 768px) {
6010  .crop-modal__header { align-items: flex-start; text-align: left; padding-right: 44px; }
6011}
6012.crop-modal__header-title { font-family: Bangers, cursive; font-weight: 400;
6012 line-height: 26px; margin: 0px; }
6013@media (max-width: 768px) {
6014  .crop-modal__header-title { font-size: var(--typography-t5-font-size); line-height: 20px; }
6015}
6016.crop-modal__header-subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; line-height: 20px; color: var(--text-colors-tint-1); margin: 0px; }
6017@media (max-width: 768px) {
6018  .crop-modal__header-subtitle { font-size: var(--typography-t3-font-size); line-height: 16px; }
6019}
6020.crop-modal__crop-container { flex: 1 1 0%; min-height: 0px; overflow: hidden; display: flex; align-items: center; justify-content: center; }
6021.crop-modal__react-crop { max-width: 100%; max-height: 100%; overflow: hidden; }
6022@media (max-width: 768px) {
6023  .crop-modal__react-crop { max-height: 55vh; }
6024}
6025.crop-modal__crop-image { display: block; width: auto; height: auto; max-width: 100%; }
6026.crop-modal__footer { display: flex; align-items: center; justify-content: center; }
6027.crop-modal__done-btn { min-width: 118px; height: 40px; }
6028@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6029@layer ds-molecules {
6030  .segments { display: grid; grid-template-rows: 1fr; grid-template-columns: var(--seg-cols, repeat(1, 1fr)); list-style-type: none; border-radius: var(--corner-radius-r12); background-color: var(--background-colors-base); }
6031  .segments--large { column-gap: var(--spacings-s4); padding: var(--spacings-s4); }
6032  .segments--large.segments--bordered { padding: calc(var(--spacings-s4) - 1px); }
6033  .segments--small { column-gap: var(--spacings-s4); padding: var(--spacings-s2); }
6034  .segments--small.segments--bordered { padding: calc(var(--spacings-s4) - 1px); }
6035  .segments--bordered { border: 1px solid var(--background-colors-border); }
6036  .segments__item { min-width: 0px; }
6037}
6038.story-types { display: flex; flex-direction: column; gap: var(--spacings-s12); }
6039.story-types__tier { display: flex; flex-direction: column; gap: var(--spacings-s4); }
6040.story-types__title { font-family: Bangers, cursive; font-size: 16px; line-height: 24px; letter-spacing: 0.5px; color: var(--absolute-white-colors-base-default); margin: 0px; user-select: none; }
6041.story-types__carousel { display: flex; gap: var(--spacings-s8); overflow: auto hidden; }
6042@media (pointer: fine) {
6043  .story-types__carousel::-webkit-scrollbar { width: 4px; height: 0px; }
6044  .story-types__carousel::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6045  .story-types__carousel::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6046  .story-types__carousel::-webkit-scrollbar-corner { background: transparent; }
6047}
6048@supports (-moz-appearance: none) {
6049  .story-types__carousel { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6050}
6051@media (pointer: coarse) {
6052  .story-types__carousel::-webkit-scrollbar { display: none; }
6053}
6054.story-types__carousel { scrollbar-width: none; }
6055.story-types__carousel::-webkit-scrollbar { display: none; }
6056.story-types__carousel--fade-end { mask-image: linear-gradient(to right,#000 calc(100% - var(--spacings-s24)),transparent 100%); }
6057.story-types__carousel--fade-start { mask-image: linear-gradient(to left,#000 calc(100% - var(--spacings-s24)),transparent 100%); }
6058.story-types__carousel--fade-both { mask-image: linear-gradient(to right,transparent 0,#000 var(--spacings-s24),#000 calc(100% - var(--spacings-s24)),transparent 100%); }
6059.story-types__carousel-wrap { position: relative; }
6060.story-types__arrow { display: none; position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-circle); background: var(--background-colors-tint-3); color: var(--absolute-white-colors-base-default); }
6061.story-types__arrow .button__icon { flex-basis: 16px; width: 16px; height: 16px; }
6062.story-types__arrow { cursor: pointer; transition: opacity 0.12s; }
6063.story-types__arrow:hover { background: var(--background-colors-tint-2); }
6064.story-types__arrow:active { opacity: 0.8; }
6065.story-types__arrow:focus-visible { outline: 2px solid var(--background-colors-border); outline-offset: 2px; }
6066.story-types__arrow--start { left: 0px; }
6067.story-types__arrow--end { right: 0px; }
6068.story-types__card { display: flex; flex-direction: column; align-items: center; flex: 1 1 0px; min-width: 88px; height: 64px; gap: var(--spacings-s4); padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; cursor: pointer; transition: opacity 0.12s; }
6069.story-types__card:active { opacity: 0.8; }
6070.story-types__card:focus-visible { outline: 2px solid var(--background-colors-border); outline-offset: 2px; }
6071.story-types__card-frame { width: 100%; height: 46px; }
6072.story-types__label-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t2-font-size); font-weight: 600; line-height: var(--typography-t2-line-height); color: var(--absolute-white-colors-base-default); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0px; max-width: 100%; }
6073.story-types__format-segments { width: 100%; }
6074.story-types__format-icon { display: inline-flex; vertical-align: middle; margin-right: var(--spacings-s4); }
6075.credits-badge__badge { display: inline-flex; align-items: center; gap: var(--spacings-s4); padding: 0px; color: currentcolor; font-family: Picsart-Fonts, sans-serif; font-weight: 600; font-size: var(--typography-t3-font-size); line-height: 1; flex-shrink: 0; letter-spacing: 0.01em; }
6076.credits-badge__badge .credits-badge__value { color: currentcolor; letter-spacing: inherit; }
6077.credits-badge__badge .credits-badge__value--sm, .credits-badge__badge--sm { font-size: 11px; }
6078.credits-badge__icon { display: inline-flex; }
6079.button-label { display: inline-flex; align-items: center; gap: var(--spacings-s8); }
6080.button-label > .text { color: currentcolor; font-size: inherit; font-weight: inherit; line-height: inherit; font-family: inherit; letter-spacing: inherit; }
6081.button-label--gap-sm { gap: var(--spacings-s6); }
6082.button-label--center { justify-content: center; }
6083.button-label--fill { flex: 1 1 0%; }
6084@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6085@layer ds-atoms {
6086  .link { max-width: 100%; }
6087  .link--t1 { font-size: var(--typography-t1-font-size);
6087 line-height: var(--typography-t1-line-height); }
6088  .link--t2 { font-size: var(--typography-t2-font-size); line-height: var(--typography-t2-line-height); }
6089  .link--t3 { font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
6090  .link--t4 { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
6091  .link--t5 { font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); }
6092  .link--t6 { font-size: var(--typography-t6-font-size); line-height: var(--typography-t6-line-height); }
6093  .link--t7 { font-size: var(--typography-t7-font-size); line-height: var(--typography-t7-line-height); }
6094  .link--t8 { font-size: var(--typography-t8-font-size); line-height: var(--typography-t8-line-height); }
6095  .link--t9 { font-size: var(--typography-t9-font-size); line-height: var(--typography-t9-line-height); }
6096  .link--t10 { font-size: var(--typography-t10-font-size); line-height: var(--typography-t10-line-height); }
6097  .link--color-primary { color: var(--primary-colors-base-default); }
6098  .link--color-neutral { color: var(--neutral-colors-base-default); }
6099  .link--color-plus { color: var(--monetization-plus-colors-base-default); }
6100  .link--color-pro { color: var(--monetization-pro-colors-base-default); }
6101  .link--color-ultra { color: var(--monetization-ultra-colors-base-default); }
6102  .link--color-success { color: var(--success-colors-base-default); }
6103  .link--color-warning { color: var(--warning-colors-base-default); }
6104  .link--color-error { color: var(--error-colors-base-default); }
6105  .link--color-information { color: var(--information-colors-base-default); }
6106  .link--color-positive { color: var(--positive-colors-base-default); }
6107  .link--color-negative { color: var(--negative-colors-base-default); }
6108  .link--color-black { color: var(--absolute-black-colors-base-default); }
6109  .link--color-white { color: var(--absolute-white-colors-base-default); }
6110  .link--color-tint-1 { color: var(--text-colors-tint-1); }
6111  .link--underline { text-decoration: underline; }
6112  .link--prevent-next-line { display: inline-block; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; vertical-align: bottom; }
6113  .link--multi-line-clamp { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: var(--link-max-row-count); }
6114}
6115@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6116@layer ds-atoms {
6117  .text-area { display: flex; flex-direction: column; row-gap: var(--spacings-s4); border-style: solid; transition-property: background-color, border, color; transition-duration: var(--timings-default); transition-timing-function: var(--easings-ease); height: var(--textarea-container-height, auto); max-height: var(--textarea-max-height, none); }
6118  .text-area--large { border-width: 1px; border-radius: var(--corner-radius-r8); min-height: 40px; }
6119  .text-area--large .text-area__input { font-size: 14px; }
6120  .text-area--small { border-width: 1px; border-radius: var(--corner-radius-r8); min-height: 32px; }
6121  .text-area--small .text-area__input { font-size: 14px; }
6122  .text-area--full-height .text-area__input, .text-area--custom-height .text-area__input { height: 100%; }
6123  .text-area__input { display: block; width: 100%; background-color: inherit; font-family: var(--fonts-gilroy); font-weight: 500; color: inherit; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; resize: none; cursor: auto; line-height: var(--typography-t4-line-height); }
6124  @media (pointer: fine) {
6125  .text-area__input::-webkit-scrollbar { width: 14px; }
6126  .text-area__input::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6127  .text-area__input::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6128  .text-area__input::-webkit-scrollbar-corner { background: transparent; }
6129}
6130  @supports (-moz-appearance: none) {
6131  .text-area__input { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6132}
6133  @media (pointer: coarse) {
6134  .text-area__input::-webkit-scrollbar { display: none; }
6135}
6136  .text-area__input::-webkit-scrollbar-track { margin-block: var(--spacings-s4); }
6137  .text-area__input::-webkit-scrollbar-thumb { background-clip: content-box; border: 4px solid transparent; background-color: var(--control-colors-border-action); border-radius: var(--corner-radius-r12); }
6138  .text-area__action-wrapper { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 32px; }
6139  .text-area__left-side { display: inline-flex; align-items: center; column-gap: var(--spacings-s6); }
6140  .text-area__right-side { display: inline-flex; align-items: center; column-gap: var(--spacings-s6); margin-inline-start: auto; align-self: flex-start; }
6141  .text-area--default-skin { color: var(--control-colors-value-default); border-color: var(--control-colors-border-default); background-color: var(--textarea-bg-override, var(--control-colors-field-background-default)); }
6142  @media (hover: hover) and (pointer: fine) {
6143  .text-area--interactive:hover { color: var(--control-colors-value-action); border-color: var(--control-colors-border-action); background-color: var(--textarea-bg-override, var(--control-colors-field-background-action)); }
6144}
6145  @media (hover: none) and (pointer: coarse) {
6146  .text-area--interactive:active { color: var(--control-colors-value-action); border-color: var(--control-colors-border-action); background-color: var(--textarea-bg-override, var(--control-colors-field-background-action)); }
6147}
6148  .text-area--interactive:focus { color: var(--control-colors-value-active); border-color: var(--control-colors-border-active); background-color: var(--textarea-bg-override, var(--control-colors-field-background-active)); }
6149  .text-area--filled { color: var(--control-colors-value-active); border-color: var(--control-colors-border-active); background-color: var(--textarea-bg-override, var(--control-colors-field-background-active)); }
6150  @media (hover: hover) and (pointer: fine) {
6151  .text-area--filled:hover { border-color: var(--control-colors-border-active-action); background-color: var(--textarea-bg-override, var(--control-colors-field-background-active-action)); }
6152}
6153  @media (hover: none) and (pointer: coarse) {
6154  .text-area--filled:active { border-color: var(--control-colors-border-active-action); background-color: var(--textarea-bg-override, var(--control-colors-field-background-active-action)); }
6155}
6156  .text-area--error { border-color: var(--error-colors-base-default); background-color: var(--textarea-bg-override, var(--control-colors-field-background-default)); }
6157  @media (hover: hover) and (pointer: fine) {
6158  .text-area--error:hover { border-color: var(--error-colors-base-action); }
6159}
6160  @media (hover: none) and (pointer: coarse) {
6161  .text-area--error:active { border-color: var(--error-colors-base-action); }
6162}
6163  .text-area--error-active { border-color: var(--error-colors-base-active); }
6164  @media (hover: hover) and (pointer: fine) {
6165  .text-area--error-active:hover { border-color: var(--error-colors-base-active-action); }
6166}
6167  @media (hover: none) and (pointer: coarse) {
6168  .text-area--error-active:active { border-color: var(--error-colors-base-active-action); }
6169}
6170  .text-area--warning { border-color: var(--warning-colors-base-default); background-color: var(--textarea-bg-override, var(--control-colors-field-background-default)); }
6171  @media (hover: hover) and (pointer: fine) {
6172  .text-area--warning:hover { border-color: var(--warning-colors-base-action); }
6173}
6174  @media (hover: none) and (pointer: coarse) {
6175  .text-area--warning:active { border-color: var(--warning-colors-base-action); }
6176}
6177  .text-area--warning-active { border-color: var(--warning-colors-base-active); }
6178  @media (hover: hover) and (pointer: fine) {
6179  .text-area--warning-active:hover { border-color: var(--warning-colors-base-active-action); }
6180}
6181  @media (hover: none) and (pointer: coarse) {
6182  .text-area--warning-active:active { border-color: var(--warning-colors-base-active-action); }
6183}
6184  .text-area--success { border-color: var(--success-colors-base-default); background-color: var(--textarea-bg-override, var(--control-colors-field-background-default)); }
6185  @media (hover: hover) and (pointer: fine) {
6186  .text-area--success:hover { border-color: var(--success-colors-base-action); }
6187}
6188  @media (hover: none) and (pointer: coarse) {
6189  .text-area--success:active { border-color: var(--success-colors-base-action); }
6190}
6191  .text-area--success-active { border-color: var(--success-colors-base-active); }
6192  @media (hover: hover) and (pointer: fine) {
6193  .text-area--success-active:hover { border-color: var(--success-colors-base-active-action); }
6194}
6195  @media (hover: none) and (pointer: coarse) {
6196  .text-area--success-active:active { border-color: var(--success-colors-base-active-action); }
6197}
6198  .text-area--with-glassy-effect { position: relative; border: 0px; z-index: 0; --textarea-bg-override: transparent; }
6199  .text-area__glass { position: relative; overflow: hidden; background-color: var(--effects-glassy-tint); border: 1px solid var(--effects-glassy-highlight-border); box-shadow: var(--effects-glassy-shadow),var(--effects-glassy-inner-shadow); backdrop-filter: var(--effects-glassy-backdrop); border-block-start: 0px; border-inline-start: 0px; }
6200  .text-area__glass::before, .text-area__glass::after { content: ""; position: absolute; pointer-events: none; }
6201  .text-area__glass::before { inset-block-start: 0px; inset-inline: 10%; height: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-top); }
6202  .text-area__glass::after { inset-block: 0px; inset-inline-start: 0px; width: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-side); }
6203  .text-area__glass { position: absolute; inset: 0px; z-index: -1; border-radius: inherit; pointer-events: none; }
6204  .text-area--without-borders { border-style: none; }
6205  .text-area--disabled { opacity: var(--states-disabled); }
6206}
6207@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6208@layer ds-molecules {
6209  .chip--skin-default { --border-color: var(--control-colors-border-default); --start-icon-color: var(--control-colors-start-icon-default); --text-color: var(--control-colors-text-default); --end-icon-color: var(--control-colors-end-icon-default); --bg-color: var(--control-colors-button-background-default); }
6210  @media (hover: hover) and (pointer: fine) {
6211  .chip--skin-default:hover { --border-color: var(--control-colors-border-action); --start-icon-color: var(--control-colors-start-icon-action); --text-color: var(--control-colors-text-action); --end-icon-color: var(--control-colors-end-icon-action); --bg-color: var(--control-colors-button-background-action); }
6212}
6213  @media (hover: none) and (pointer: coarse) {
6214  .chip--skin-default:active { --border-color: var(--control-colors-border-action); --start-icon-color: var(--control-colors-start-icon-action); --text-color: var(--control-colors-text-action); --end-icon-color: var(--control-colors-end-icon-action); --bg-color: var(--control-colors-button-background-action); }
6215}
6216  .chip--skin-default-active { --border-color: var(--control-colors-button-background-active); --start-icon-color: var(--control-colors-start-icon-active); --text-color: var(--control-colors-text-active); --end-icon-color: var(--control-colors-end-icon-active); --bg-color: var(--control-colors-button-background-active); }
6217  @media (hover: hover) and (pointer: fine) {
6218  .chip--skin-default-active:hover { --border-color: var(--control-colors-button-background-active-action); --start-icon-color: var(--control-colors-start-icon-active-action); --text-color: var(--control-colors-text-active-action); --end-icon-color: var(--control-colors-end-icon-active-action); --bg-color: var(--control-colors-button-background-active-action); }
6219}
6220  @media (hover: none) and (pointer: coarse) {
6221  .chip--skin-default-active:active { --border-color: var(--control-colors-button-background-active-action); --start-icon-color: var(--control-colors-start-icon-active-action); --text-color: var(--control-colors-text-active-action); --end-icon-color: var(--control-colors-end-icon-active-action); --bg-color: var(--control-colors-button-background-active-action); }
6222}
6223  .chip--skin-primary { --border-color: var(--primary-colors-base-default); --start-icon-color: var(--primary-colors-text-default); --text-color: var(--primary-colors-text-default); --end-icon-color: var(--primary-colors-text-default); --bg-color: var(--primary-colors-base-default); }
6224  @media (hover: hover) and (pointer: fine) {
6225  .chip--skin-primary:hover { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
6226}
6227  @media (hover: none) and (pointer: coarse) {
6228  .chip--skin-primary:active { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
6229}
6230  .chip--skin-primary-active { --border-color: var(--primary-colors-base-active); --start-icon-color: var(--primary-colors-text-active); --text-color: var(--primary-colors-text-active); --end-icon-color: var(--primary-colors-text-active); --bg-color: var(--primary-colors-base-active); }
6231  @media (hover: hover) and (pointer: fine) {
6232  .chip--skin-primary-active:hover { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-action); --bg-color: var(--primary-colors-base-active-action); }
6233}
6234  @media (hover: none) and (pointer: coarse) {
6235  .chip--skin-primary-active:active { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-action); --bg-color: var(--primary-colors-base-active-action); }
6236}
6237  .chip--skin-secondary { --border-color: var(--primary-colors-base-default); --start-icon-color: var(--primary-colors-text-default); --text-color: var(--primary-colors-text-default); --end-icon-color: var(--primary-colors-text-default); --bg-color: var(--primary-colors-base-default); }
6238  @media (hover: hover) and (pointer: fine) {
6239  .chip--skin-secondary:hover { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
6240}
6241  @media (hover: none) and (pointer: coarse) {
6242  .chip--skin-secondary:active { --border-color: var(--primary-colors-base-action); --start-icon-color: var(--primary-colors-text-action); --text-color: var(--primary-colors-text-action); --end-icon-color: var(--primary-colors-text-action); --bg-color: var(--primary-colors-base-action); }
6243}
6244  .chip--skin-secondary-active { --border-color: var(--primary-colors-base-active); --start-icon-color: var(--primary-colors-text-active); --text-color: var(--primary-colors-text-active); --end-icon-color: var(--primary-colors-text-active); --bg-color: var(--primary-colors-base-active); }
6245  @media (hover: hover) and (pointer: fine) {
6246  .chip--skin-secondary-active:hover { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-action); --bg-color: var(--primary-colors-base-active-action); }
6247}
6248  @media (hover: none) and (pointer: coarse) {
6249  .chip--skin-secondary-active:active { --border-color: var(--primary-colors-base-active-action); --start-icon-color: var(--primary-colors-text-active-action); --text-color: var(--primary-colors-text-active-action); --end-icon-color: var(--primary-colors-text-active-
6249action); --bg-color: var(--primary-colors-base-active-action); }
6250}
6251  .chip--skin-tertiary { --border-color: var(--neutral-colors-base-default); --start-icon-color: var(--neutral-colors-text-default); --text-color: var(--neutral-colors-text-default); --end-icon-color: var(--neutral-colors-text-default); --bg-color: var(--neutral-colors-base-default); }
6252  @media (hover: hover) and (pointer: fine) {
6253  .chip--skin-tertiary:hover { --border-color: var(--neutral-colors-base-action); --start-icon-color: var(--neutral-colors-text-action); --text-color: var(--neutral-colors-text-action); --end-icon-color: var(--neutral-colors-text-action); --bg-color: var(--neutral-colors-base-action); }
6254}
6255  @media (hover: none) and (pointer: coarse) {
6256  .chip--skin-tertiary:active { --border-color: var(--neutral-colors-base-action); --start-icon-color: var(--neutral-colors-text-action); --text-color: var(--neutral-colors-text-action); --end-icon-color: var(--neutral-colors-text-action); --bg-color: var(--neutral-colors-base-action); }
6257}
6258  .chip--skin-tertiary-active { --border-color: var(--neutral-colors-base-active); --start-icon-color: var(--neutral-colors-text-active); --text-color: var(--neutral-colors-text-active); --end-icon-color: var(--neutral-colors-text-active); --bg-color: var(--neutral-colors-base-active); }
6259  @media (hover: hover) and (pointer: fine) {
6260  .chip--skin-tertiary-active:hover { --border-color: var(--neutral-colors-base-active-action); --start-icon-color: var(--neutral-colors-text-active-action); --text-color: var(--neutral-colors-text-active-action); --end-icon-color: var(--neutral-colors-text-active-action); --bg-color: var(--neutral-colors-base-active-action); }
6261}
6262  @media (hover: none) and (pointer: coarse) {
6263  .chip--skin-tertiary-active:active { --border-color: var(--neutral-colors-base-active-action); --start-icon-color: var(--neutral-colors-text-active-action); --text-color: var(--neutral-colors-text-active-action); --end-icon-color: var(--neutral-colors-text-active-action); --bg-color: var(--neutral-colors-base-active-action); }
6264}
6265  .chip--skin-positive { --border-color: var(--positive-colors-base-default); --start-icon-color: var(--positive-colors-text-default); --text-color: var(--positive-colors-text-default); --end-icon-color: var(--positive-colors-text-default); --bg-color: var(--positive-colors-base-default); }
6266  @media (hover: hover) and (pointer: fine) {
6267  .chip--skin-positive:hover { --border-color: var(--positive-colors-base-action); --start-icon-color: var(--positive-colors-text-action); --text-color: var(--positive-colors-text-action); --end-icon-color: var(--positive-colors-text-action); --bg-color: var(--positive-colors-base-action); }
6268}
6269  @media (hover: none) and (pointer: coarse) {
6270  .chip--skin-positive:active { --border-color: var(--positive-colors-base-action); --start-icon-color: var(--positive-colors-text-action); --text-color: var(--positive-colors-text-action); --end-icon-color: var(--positive-colors-text-action); --bg-color: var(--positive-colors-base-action); }
6271}
6272  .chip--skin-positive-active { --border-color: var(--positive-colors-base-active); --start-icon-color: var(--positive-colors-text-active); --text-color: var(--positive-colors-text-active); --end-icon-color: var(--positive-colors-text-active); --bg-color: var(--positive-colors-base-active); }
6273  @media (hover: hover) and (pointer: fine) {
6274  .chip--skin-positive-active:hover { --border-color: var(--positive-colors-base-active-action); --start-icon-color: var(--positive-colors-text-active-action); --text-color: var(--positive-colors-text-active-action); --end-icon-color: var(--positive-colors-text-active-action); --bg-color: var(--positive-colors-base-active-action); }
6275}
6276  @media (hover: none) and (pointer: coarse) {
6277  .chip--skin-positive-active:active { --border-color: var(--positive-colors-base-active-action); --start-icon-color: var(--positive-colors-text-active-action); --text-color: var(--positive-colors-text-active-action); --end-icon-color: var(--positive-colors-text-active-action); --bg-color: var(--positive-colors-base-active-action); }
6278}
6279  .chip--skin-negative { --border-color: var(--negative-colors-base-default); --start-icon-color: var(--negative-colors-text-default); --text-color: var(--negative-colors-text-default); --end-icon-color: var(--negative-colors-text-default); --bg-color: var(--negative-colors-base-default); }
6280  @media (hover: hover) and (pointer: fine) {
6281  .chip--skin-negative:hover { --border-color: var(--negative-colors-base-action); --start-icon-color: var(--negative-colors-text-action); --text-color: var(--negative-colors-text-action); --end-icon-color: var(--negative-colors-text-action); --bg-color: var(--negative-colors-base-action); }
6282}
6283  @media (hover: none) and (pointer: coarse) {
6284  .chip--skin-negative:active { --border-color: var(--negative-colors-base-action); --start-icon-color: var(--negative-colors-text-action); --text-color: var(--negative-colors-text-action); --end-icon-color: var(--negative-colors-text-action); --bg-color: var(--negative-colors-base-action); }
6285}
6286  .chip--skin-negative-active { --border-color: var(--negative-colors-base-active); --start-icon-color: var(--negative-colors-text-active); --text-color: var(--negative-colors-text-active); --end-icon-color: var(--negative-colors-text-active); --bg-color: var(--negative-colors-base-active); }
6287  @media (hover: hover) and (pointer: fine) {
6288  .chip--skin-negative-active:hover { --border-color: var(--negative-colors-base-active-action); --start-icon-color: var(--negative-colors-text-active-action); --text-color: var(--negative-colors-text-active-action); --end-icon-color: var(--negative-colors-text-active-action); --bg-color: var(--negative-colors-base-active-action); }
6289}
6290  @media (hover: none) and (pointer: coarse) {
6291  .chip--skin-negative-active:active { --border-color: var(--negative-colors-base-active-action); --start-icon-color: var(--negative-colors-text-active-action); --text-color: var(--negative-colors-text-active-action); --end-icon-color: var(--negative-colors-text-active-action); --bg-color: var(--negative-colors-base-active-action); }
6292}
6293  .chip--skin-success { --border-color: var(--success-colors-base-default); --start-icon-color: var(--success-colors-text-default); --text-color: var(--success-colors-text-default); --end-icon-color: var(--success-colors-text-default); --bg-color: var(--success-colors-base-default); }
6294  @media (hover: hover) and (pointer: fine) {
6295  .chip--skin-success:hover { --border-color: var(--success-colors-base-action); --start-icon-color: var(--success-colors-text-action); --text-color: var(--success-colors-text-action); --end-icon-color: var(--success-colors-text-action); --bg-color: var(--success-colors-base-action); }
6296}
6297  @media (hover: none) and (pointer: coarse) {
6298  .chip--skin-success:active { --border-color: var(--success-colors-base-action); --start-icon-color: var(--success-colors-text-action); --text-color: var(--success-colors-text-action); --end-icon-color: var(--success-colors-text-action); --bg-color: var(--success-colors-base-action); }
6299}
6300  .chip--skin-success-active { --border-color: var(--success-colors-base-active); --start-icon-color: var(--success-colors-text-active); --text-color: var(--success-colors-text-active); --end-icon-color: var(--success-colors-text-active); --bg-color: var(--success-colors-base-active); }
6301  @media (hover: hover) and (pointer: fine) {
6302  .chip--skin-success-active:hover { --border-color: var(--success-colors-base-active-action); --start-icon-color: var(--success-colors-text-active-action); --text-color: var(--success-colors-text-active-action); --end-icon-color: var(--success-colors-text-active-action); --bg-color: var(--success-colors-base-active-action); }
6303}
6304  @media (hover: none) and (pointer: coarse) {
6305  .chip--skin-success-active:active { --border-color: var(--success-colors-base-active-action); --start-icon-color: var(--success-colors-text-active-action); --text-color: var(--success-colors-text-active-action); --end-icon-color: var(--success-colors-text-active-action); --bg-color: var(--success-colors-base-active-action); }
6306}
6307  .chip--skin-warning { --border-color: var(--warning-colors-base-default); --start-icon-color: var(--warning-colors-text-default); --text-color: var(--warning-colors-text-default); --end-icon-color: var(--warning-colors-text-default); --bg-color: var(--warning-colors-base-default); }
6308  @media (hover: hover) and (pointer: fine) {
6309  .chip--skin-warning:hover { --border-color: var(--warning-colors-base-action); --start-icon-color: var(--warning-colors-text-action); --text-color: var(--warning-colors-text-action); --end-icon-color: var(--warning-colors-text-action); --bg-color: var(--warning-colors-base-action); }
6310}
6311  @media (hover: none) and (pointer: coarse) {
6312  .chip--skin-warning:active { --border-color: var(--warning-colors-base-action); --start-icon-color: var(--warning-colors-text-action); --text-color: var(--warning-colors-text-action); --end-icon-color: var(--warning-colors-text-action); --bg-color: var(--warning-colors-base-action); }
6313}
6314  .chip--skin-warning-active { --border-color: var(--warning-colors-base-active); --start-icon-color: var(--warning-colors-text-active); --text-color: var(--warning-colors-text-active); --end-icon-color: var(--warning-colors-text-active); --bg-color: var(--warning-colors-base-active); }
6315  @media (hover: hover) and (pointer: fine) {
6316  .chip--skin-warning-active:hover { --border-color: var(--warning-colors-base-active-action); --start-icon-color: var(--warning-colors-text-active-action); --text-color: var(--warning-colors-text-active-action); --end-icon-color: var(--warning-colors-text-active-action); --bg-color: var(--warning-colors-base-active-action); }
6317}
6318  @media (hover: none) and (pointer: coarse) {
6319  .chip--skin-warning-active:active { --border-color: var(--warning-colors-base-active-action); --start-icon-color: var(--warning-colors-text-active-action); --text-color: var(--warning-colors-text-active-action); --end-icon-color: var(--warning-colors-text-active-action); --bg-color: var(--warning-colors-base-active-action); }
6320}
6321  .chip--skin-error { --border-color: var(--error-colors-base-default); --start-icon-color: var(--error-colors-text-default); --text-color: var(--error-colors-text-default); --end-icon-color: var(--error-colors-text-default); --bg-color: var(--error-colors-base-default); }
6322  @media (hover: hover) and (pointer: fine) {
6323  .chip--skin-error:hover { --border-color: var(--error-colors-base-action); --start-icon-color: var(--error-colors-text-action); --text-color: var(--error-colors-text-action); --end-icon-color: var(--error-colors-text-action); --bg-color: var(--error-colors-base-action); }
6324}
6325  @media (hover: none) and (pointer: coarse) {
6326  .chip--skin-error:active { --border-color: var(--error-colors-base-action); --start-icon-color: var(--error-colors-text-action); --text-color: var(--error-colors-text-action); --end-icon-color: var(--error-colors-text-action); --bg-color: var(--error-colors-base-action); }
6327}
6328  .chip--skin-error-active { --border-color: var(--error-colors-base-active); --start-icon-color: var(--error-colors-text-active); --text-color: var(--error-colors-text-active); --end-icon-color: var(--error-colors-text-active); --bg-color: var(--error-colors-base-active); }
6329  @media (hover: hover) and (pointer: fine) {
6330  .chip--skin-error-active:hover { --border-color: var(--error-colors-base-active-action); --start-icon-color: var(--error-colors-text-active-action); --text-color: var(--error-colors-text-active-action); --end-icon-color: var(--error-colors-text-active-action); --bg-color: var(--error-colors-base-active-action); }
6331}
6332  @media (hover: none) and (pointer: coarse) {
6333  .chip--skin-error-active:active { --border-color: var(--error-colors-base-active-action); --start-icon-color: var(--error-colors-text-active-action); --text-color: var(--error-colors-text-active-action); --end-icon-color: var(--error-colors-text-active-action); --bg-color: var(--error-colors-base-active-action); }
6334}
6335  @keyframes chip-rotate { 
6336  100% { transform: rotate(360deg); }
6337}
6338  .chip { display: inline-grid; align-items: center; justify-content: center; vertical-align: top; max-width: 100%; background-color: var(--bg-color); border-style: solid; border-color: var(--border-color); transition-property: background-color, border; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); cursor: pointer; overflow: hidden; position: relative; grid-template-columns: var(--chip-grid-cols, auto); width: var(--chip-width, auto); pointer-events: var(--chip-pointer-events, auto); }
6339  .chip--large { height: 40px; border-width: 1px; border-radius: var(--corner-radius-r8); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
6340  .chip--large .chip__interactive-area { gap: var(--spacings-s2); padding: calc(var(--spacings-s10) - 1px) calc(var(--spacings-s10) - 1px);
6340 padding-inline-end: var(--chip-ia-pie, calc(var(--spacings-s10) - 1px)); }
6341  .chip--large .chip__icon-holder { flex: 0 0 20px; width: 20px; height: 20px; }
6342  .chip--large .chip__text { padding: var(--spacings-s0) var(--spacings-s2); }
6343  .chip--large .chip__badge { margin: 0 var(--spacings-s2); }
6344  .chip--large .chip__dismiss-button, .chip--large .chip__dismiss-icon { width: 40px; height: 40px; }
6345  .chip--large .chip__dismiss-icon { width: 20px; height: 20px; }
6346  .chip--small { height: 32px; border-width: 1px; border-radius: var(--corner-radius-r8); column-gap: var(--spacings-s2); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
6347  .chip--small .chip__interactive-area { gap: var(--spacings-s2); padding: calc(var(--spacings-s6) - 1px) calc(var(--spacings-s6) - 1px); padding-inline-end: var(--chip-ia-pie, calc(var(--spacings-s6) - 1px)); }
6348  .chip--small .chip__icon-holder { flex: 0 0 20px; width: 20px; height: 20px; }
6349  .chip--small .chip__text { padding: var(--spacings-s0) var(--spacings-s2); }
6350  .chip--small .chip__badge { margin: 0 var(--spacings-s2); }
6351  .chip--small .chip__dismiss-button { width: 32px; height: 32px; }
6352  .chip--small .chip__dismiss-icon { width: 20px; height: 20px; }
6353  .chip__interactive-area { min-width: 0px; display: flex; align-items: center; visibility: var(--chip-ia-visibility, visible); }
6354  .chip__icon { display: block; width: 100%; height: 100%; }
6355  .chip__icon-holder { min-width: 0px; }
6356  .chip__icon-holder path { fill: var(--start-icon-color); transition: fill var(--timings-default) var(--easings-ease); }
6357  .chip__loading-icon { animation: chip-rotate var(--timings-long) var(--easings-linear) infinite; }
6358  .chip__loading-icon-layout { position: absolute; inset: 0px; margin: auto; fill: var(--end-icon-color); width: 24px; height: 24px; }
6359  .chip__text-wrap { min-width: 0px; flex-grow: 1; color: var(--text-color); text-align: center; word-break: break-all; }
6360  .chip__text { width: 100%; color: var(--text-color); text-align: center; word-break: break-all; max-width: 100%; display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; transition: color var(--timings-default) var(--easings-ease); }
6361  .chip__badge { min-width: 0px; }
6362  .chip__dismiss-button { display: grid; place-items: center; min-width: 0px; cursor: pointer; }
6363  .chip__dismiss-icon path { fill: var(--end-icon-color); transition: fill var(--timings-default) var(--easings-ease); }
6364}
6365@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6366@layer ds-atoms {
6367  .loader { display: flex; width: 100%; height: 100%; inset: 0px; z-index: var(--loader-z-index, 1); background-color: var(--loader-bg-color, transparent); }
6368  .loader--local { position: absolute; }
6369  .loader--global { position: fixed; }
6370  .loader--no-bg { background-color: transparent; }
6371  @keyframes loader-rotate { 
6372  100% { transform: rotate(360deg); }
6373}
6374  .loader__icon { display: inline-block; margin: auto; animation: loader-rotate var(--timings-long) var(--easings-linear) infinite; }
6375  .loader__icon path { fill: var(--primary-colors-base-default); }
6376  .loader--large .loader__icon { width: 48px; height: 48px; }
6377  .loader--small .loader__icon { width: 24px; height: 24px; }
6378}
6379.sidebar { box-sizing: border-box; width: 100%; height: 100%; background-color: var(--background-colors-base); display: flex; flex-direction: column; overflow: hidden; }
6380.sidebar--blocked { pointer-events: none; }
6381.sidebar--mobile { height: 100%; width: 100%; min-width: 100%; max-width: 100%; }
6382.sidebar__content { flex: 1 1 0%; min-height: 0px; overflow: hidden auto; margin-top: var(--spacings-s16); display: flex; flex-direction: column; padding: 0 var(--spacings-s16) var(--spacings-s16); }
6383@media (pointer: fine) {
6384  .sidebar__content::-webkit-scrollbar { width: 4px; height: 4px; }
6385  .sidebar__content::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6386  .sidebar__content::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6387  .sidebar__content::-webkit-scrollbar-corner { background: transparent; }
6388}
6389@supports (-moz-appearance: none) {
6390  .sidebar__content { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6391}
6392@media (pointer: coarse) {
6393  .sidebar__content::-webkit-scrollbar { display: none; }
6394}
6395.sidebar--mobile .sidebar__content { padding: 0px; margin-top: var(--spacings-s8); }
6396.sidebar--mobile .sidebar__story-types-bar { padding: 0px; position: sticky; top: 0px; z-index: 3; background-color: var(--background-colors-base); }
6397.sidebar--mobile .sidebar__story-types-bar--scrollable { position: static; }
6398.sidebar__story-types-bar { display: flex; flex-direction: column; gap: var(--spacings-s12); padding: var(--spacings-s16) var(--spacings-s16) 0; flex-shrink: 0; overflow-x: auto; }
6399@media (pointer: fine) {
6400  .sidebar__story-types-bar::-webkit-scrollbar { width: 4px; height: 0px; }
6401  .sidebar__story-types-bar::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6402  .sidebar__story-types-bar::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6403  .sidebar__story-types-bar::-webkit-scrollbar-corner { background: transparent; }
6404}
6405@supports (-moz-appearance: none) {
6406  .sidebar__story-types-bar { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6407}
6408@media (pointer: coarse) {
6409  .sidebar__story-types-bar::-webkit-scrollbar { display: none; }
6410}
6411.sidebar__story-types-bar { scrollbar-width: none; }
6412.sidebar__story-types-bar::-webkit-scrollbar { display: none; }
6413.sidebar__upload-section { display: flex; flex-direction: column; gap: var(--spacings-s12); width: 100%; }
6414.sidebar__upload-heading-block { display: flex; flex-direction: column; gap: var(--spacings-s2); }
6415.sidebar__upload-heading { font-family: Bangers, cursive; font-size: var(--typography-t5-font-size); line-height: var(--typography-t5-line-height); letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-colors-base); margin: 0px; }
6416.sidebar__upload-cards { display: flex; flex-flow: wrap; gap: var(--spacings-s8); width: 100%; }
6417.sidebar__upload-cards--scrollable { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x mandatory; }
6418@media (pointer: fine) {
6419  .sidebar__upload-cards--scrollable::-webkit-scrollbar { width: 4px; height: 0px; }
6420  .sidebar__upload-cards--scrollable::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6421  .sidebar__upload-cards--scrollable::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6422  .sidebar__upload-cards--scrollable::-webkit-scrollbar-corner { background: transparent; }
6423}
6424@supports (-moz-appearance: none) {
6425  .sidebar__upload-cards--scrollable { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6426}
6427@media (pointer: coarse) {
6428  .sidebar__upload-cards--scrollable::-webkit-scrollbar { display: none; }
6429}
6430.sidebar__upload-cards--scrollable { scrollbar-width: none; }
6431.sidebar__upload-cards--scrollable::-webkit-scrollbar { display: none; }
6432.sidebar__upload-card-arrow-wrap { position: relative; width: 100%; }
6433.sidebar__upload-card-arrow { position: absolute; top: 50%; right: var(--spacings-s8); transform: translateY(-50%); z-index: 2; width: 32px; height: 32px; border-radius: 50%; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: rgba(0, 0, 0, 0.55); color: var(--absolute-white-colors-base-default); display: flex; align-items: center; justify-content: center; cursor: pointer; appearance: none; padding: 0px; }
6434.sidebar__upload-card-col { flex: 0 0 calc(50% - var(--spacings-s8) / 2); min-width: 0px; display: flex; flex-direction: column; gap: var(--spacings-s8); scroll-snap-align: start; }
6435.sidebar--mobile .sidebar__upload-card { aspect-ratio: auto; height: 136px; }
6436.sidebar__upload-card { appearance: none; font: inherit; position: relative; width: 100%; aspect-ratio: 1 / 1; box-sizing: border-box; border-radius: var(--corner-radius-r8); border: 1px dashed var(--background-colors-tint-3); background-color: var(--background-colors-tint-1); display: flex; align-items: flex-end; justify-content: center; padding: var(--spacings-s10); color: var(--text-colors-base); cursor: pointer; overflow: hidden; transition: border-color 0.15s; }
6437.sidebar__upload-card:hover { border-color: var(--primary-colors-base-default); }
6438.sidebar__upload-card:focus-visible { outline: 2px solid var(--primary-colors-base-default); outline-offset: 2px; }
6439.sidebar__upload-card--hero { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/96a94082-fc02-41ed-a2a9-91f4d10b4773.png?to=max&r=160&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/96a94082-fc02-41ed-a2a9-91f4d10b4773.png?to=max&r=320&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6440.sidebar__upload-card--nemesis { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/b207b8a3-b4eb-4ff0-b491-55aea41fa43c.png?to=max&r=160&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/b207b8a3-b4eb-4ff0-b491-55aea41fa43c.png?to=max&r=320&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6441.sidebar__upload-card--tale-hero { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/766990d0-96e8-4c7e-81a7-8c36c2597285.png?to=max&r=160&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/766990d0-96e8-4c7e-81a7-8c36c2597285.png?to=max&r=320&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6442.sidebar__upload-card--tale-companion { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/acf105d8-be71-4f5d-8772-4495224830a9.png?to=max&r=160&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/acf105d8-be71-4f5d-8772-4495224830a9.png?to=max&r=320&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6443@media (max-width: 600px) {
6444  .sidebar__upload-card--hero { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/96a94082-fc02-41ed-a2a9-91f4d10b4773.png?to=max&r=220&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/96a94082-fc02-41ed-a2a9-91f4d10b4773.png?to=max&r=440&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6445  .sidebar__upload-card--nemesis { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/b207b8a3-b4eb-4ff0-b491-55aea41fa43c.png?to=max&r=220&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/b207b8a3-b4eb-4ff0-b491-55aea41fa43c.png?to=max&r=440&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6446  .sidebar__upload-card--tale-hero { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/766990d0-96e8-4c7e-81a7-8c36c2597285.png?to=max&r=220&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/766990d0-96e8-4c7e-81a7-8c36c2597285.png?to=max&r=440&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6447  .sidebar__upload-card--tale-companion { background-image: image-set(url("https://cdn-cms-uploads.picsart.com/cms-uploads/acf105d8-be71-4f5d-8772-4495224830a9.png?to=max&r=220&format=webp") 1x, url("https://cdn-cms-uploads.picsart.com/cms-uploads/acf105d8-be71-4f5d-8772-4495224830a9.png?to=max&r=440&format=webp") 2x); background-size: cover; background-position: center center; background-repeat: no-repeat; }
6448}
6449.sidebar__upload-card--filled { border: 1px solid var(--background-colors-border); background-color: var(--background-colors-base); overflow: hidden; }
6450.sidebar__upload-card-inner { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--spacings-s4); width: 100%; height: 100%; box-sizing: border-box; }
6451.sidebar__upload-icon-circle { position: relative; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; box-sizing: border-box; border-radius: 50%; background: rgba(255, 255, 255, 0.1); }
6452.sidebar__upload-card-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; line-height: var(--typography-t4-line-height); color: var(--text-colors-base); margin: 0px; text-align: center; }
6453.sidebar__upload-card-subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); color: var(--text-colors-tint-2); margin: 0px; text-align: center; }
6454.sidebar__upload-card-img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; display: block; }
6455.sidebar__upload-card-filled-actions { position: absolute; top: 0px; right: 0px; display: flex; flex-direction: row; gap: var(--spacings-s4); z-index: 2; }
6456.sidebar__upload-card-icon-btn { width: 36px; height: 36px; border-radius: var(--corner-radius-r8); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: var(--control-colors-button-background-default); display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0px; transition: background-color 0.12s; color: var(--text-colors-base); }
6457.sidebar__upload-card-icon-btn:hover { background-color: var(--control-colors-button-background-action); }
6458.sidebar__section-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--text-colors-tint-1); margin: 0px; }
6459.sidebar--mobile .sidebar__section-header { align-items: center; text-align: center; }
6460.sidebar__options-panel { display: flex; flex-direction: column; gap: var(--spacings-s16); }
6461.sidebar--mobile .sidebar__options-panel { gap: var(--spacings-s12); }
6462.sidebar__option-label { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; color: var(--text-colors-base); margin-bottom: var(--spacings-s6); }
6463.sidebar__option-hint { display: block; margin-bottom: var(--spacings-s12); line-height: 1.4; }
6464.sidebar__custom-premise { margin-top: var(--spacings-s12); display: flex; flex-direction: column; gap: 14px; }
6465.sidebar__tall-text-box textarea { min-height: 88px; }
6466.sidebar__char-count { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t2-font-size); color: var(--text-colors-tint-2); align-self: flex-end; margin: -8px 0px 0px; }
6467.sidebar__quote-card { margin-top: var(--spacings-s12); display: flex; flex-direction: column; gap: var(--spacings-s8); padding: var(--spacings-s16); border-radius: var(--corner-radius-r12); border: 1px solid var(--background-colors-border); background-color: var(--background-colors-tint-1); }
6468.sidebar__quote-mark { font-family: Bangers, cursive; font-size: var(--typography-t7-font-size); line-height: 0.6; color: var(--primary-colors-base-default); margin: 0px; }
6469.sidebar__quote-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-style: italic; font-weight: 500; line-height: 1.45; color: var(--text-colors-base); margin: 0px; }
6470.sidebar__quote-author { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 600; color: var(--text-colors-tint-2); text-align: right; margin: 0px; }
6471.sidebar__plot-highlight { padding: var(--spacings-s12); border-radius: var(--corner-radius-r12); border: 1.5px solid var(--primary-colors-base-default); background-color: var(--background-colors-tint-1); }
6472.sidebar__plot-label-row { display: flex; align-items: center; gap: var(--spacings-s6); margin-bottom: var(--spacings-s2); }
6473.sidebar__plot-badge { display: inline-flex; align-items: center; gap: 2px; padding: 1px var(--spacings-s6); border-radius: var(--corner-radius-r20); font-family: Picsart-Fonts, sans-serif; font-size: var(--
6473typography-t2-font-size); font-weight: 600; color: var(--primary-colors-base-default); background: var(--primary-colors-alpha-20); text-transform: uppercase; letter-spacing: 0.4px; white-space: nowrap; }
6474.sidebar__plot-hint { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); color: var(--text-colors-tint-2); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s6); }
6475.sidebar__genre-scroll-inner { display: inline-flex; align-items: flex-start; gap: var(--spacings-s8); flex-wrap: nowrap; }
6476.sidebar__preset-item { display: inline-flex; flex-direction: column; align-items: center; flex-shrink: 0; width: 91px; gap: var(--spacings-s4); cursor: pointer; }
6477.sidebar__preset-item:focus-visible { outline: none; }
6478.sidebar__preset-frame-content { position: relative; width: 100%; height: 100%; overflow: hidden; }
6479.sidebar__genre-preset-frame { background-color: transparent; }
6480.sidebar__genre-preset-frame.image-frame--interactive:not(.image-frame--active-border)::before { opacity: 0; }
6481.sidebar__setting-preset-frame { background-color: transparent; }
6482.sidebar__setting-preset-frame.image-frame--interactive:not(.image-frame--active-border)::before { opacity: 0; }
6483.sidebar__preset-img { width: 100%; height: 100%; background-size: 130%; background-position: center center; background-repeat: no-repeat; display: block; pointer-events: none; }
6484.sidebar__preset-check-badge { position: absolute; top: var(--spacings-s4); right: var(--spacings-s4); display: flex; align-items: center; justify-content: center; z-index: 2; }
6485.sidebar__preset-label { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; color: var(--text-colors-base); text-align: center; line-height: 1.3; }
6486.sidebar__chips-row { overflow: auto hidden; padding-bottom: var(--spacings-s2); }
6487@media (pointer: fine) {
6488  .sidebar__chips-row::-webkit-scrollbar { width: 4px; height: 0px; }
6489  .sidebar__chips-row::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6490  .sidebar__chips-row::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6491  .sidebar__chips-row::-webkit-scrollbar-corner { background: transparent; }
6492}
6493@supports (-moz-appearance: none) {
6494  .sidebar__chips-row { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6495}
6496@media (pointer: coarse) {
6497  .sidebar__chips-row::-webkit-scrollbar { display: none; }
6498}
6499.sidebar__chips-row { scrollbar-width: none; }
6500.sidebar__chips-row::-webkit-scrollbar { display: none; }
6501.sidebar__chips-row-inner { display: inline-flex; align-items: flex-start; gap: var(--spacings-s6); flex-wrap: nowrap; }
6502.sidebar__chip-btn { flex-shrink: 0; }
6503.sidebar__footer { flex-shrink: 0; width: 100%; box-sizing: border-box; padding: var(--spacings-s8) var(--spacings-s16); background-color: var(--background-colors-base); display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: var(--spacings-s8); }
6504.sidebar__terms-wrapper { display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s4); }
6505.sidebar__terms-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); color: var(--text-colors-tint-3); text-align: center; line-height: 1.5; }
6506.sidebar__terms-link { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); color: var(--primary-colors-base-default); padding-right: var(--spacings-s8); text-decoration: underline; }
6507.sidebar__terms-link:hover { color: var(--primary-colors-base-action); }
6508@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6509@layer ds-atoms {
6510  .divider::before { content: ""; display: block; background-color: var(--background-colors-border); }
6511  .divider--rounded::before { border-radius: var(--corner-radius-r2); }
6512  .divider--horizontal { display: block; width: var(--divider-size, 100%);
6512 padding-top: var(--divider-start); padding-bottom: var(--divider-end); }
6513  .divider--horizontal::before { height: 2px; }
6514  .divider--vertical { display: inline-block; vertical-align: top; height: var(--divider-size, 100%); padding-inline-start: var(--divider-start); padding-inline-end: var(--divider-end); }
6515  .divider--vertical::before { width: 2px; height: 100%; }
6516}
6517@keyframes gcc-halftone-pulse { 
6518  0% { opacity: 0.2; }
6519  50% { opacity: 0.5; }
6520  100% { opacity: 0.2; }
6521}
6522@keyframes gcc-star-float { 
6523  0% { transform: translateY(0px) rotate(0deg) scale(1); }
6524  100% { transform: translateY(-14px) rotate(200deg) scale(1.2); }
6525}
6526@keyframes gcc-progress-sweep { 
6527  0% { transform: scaleX(0); transform-origin: left center; }
6528  50% { transform: scaleX(1); transform-origin: left center; }
6529  51% { transform: scaleX(1); transform-origin: right center; }
6530  100% { transform: scaleX(0); transform-origin: right center; }
6531}
6532@keyframes gcc-glow-pulse { 
6533  0% { opacity: 0.5; transform: scale(1); }
6534  50% { opacity: 0.9; transform: scale(1.05); }
6535  100% { opacity: 0.5; transform: scale(1); }
6536}
6537@keyframes gcc-sweep-diagonal { 
6538  0% { transform: translate(-60%, 60%) rotate(-35deg); opacity: 0; }
6539  15% { opacity: 1; }
6540  55% { opacity: 1; }
6541  100% { transform: translate(60%, -60%) rotate(-35deg); opacity: 0; }
6542}
6543.generating-creative-card { width: 100%; aspect-ratio: 2 / 3; border-radius: var(--corner-radius-r12); background: linear-gradient(160deg, rgb(26, 10, 46), rgb(45, 16, 96) 40%, rgb(26, 10, 46)); display: flex; flex-direction: column; align-items: stretch; position: relative; overflow: hidden; cursor: default; container-type: inline-size; padding: 8% 6% 5%; box-sizing: border-box; }
6544.generating-creative-card__root-clickable { cursor: pointer; }
6545.generating-creative-card__glow { position: absolute; width: 70%; height: 50%; border-radius: 50%; background: radial-gradient(rgba(168, 85, 247, 0.35) 0%, transparent 70%); animation-name: gcc-glow-pulse; animation-duration: 3s; animation-timing-function: ease-in-out; animation-iteration-count: infinite; pointer-events: none; }
6546.generating-creative-card__halftone { position: absolute; inset: 0px; background-image: radial-gradient(circle, rgba(255, 255, 255, 0.18) 1px, transparent 1px); background-size: 10px 10px; animation-name: gcc-halftone-pulse; animation-duration: 3s; animation-timing-function: ease; animation-iteration-count: infinite; pointer-events: none; }
6547.generating-creative-card__film-left { position: absolute; top: 0px; left: 0px; bottom: 0px; width: 12px; display: flex; flex-direction: column; gap: 5px; padding: 8px 0px; pointer-events: none; z-index: 3; }
6548.generating-creative-card__film-right { position: absolute; top: 0px; right: 0px; bottom: 0px; width: 12px; display: flex; flex-direction: column; gap: 5px; padding: 8px 0px; pointer-events: none; z-index: 3; }
6549.generating-creative-card__film-hole { width: 8px; height: 8px; border-radius: 2px; background-color: rgba(0, 0, 0, 0.7); border: 1px solid rgba(255, 255, 255, 0.1); flex-shrink: 0; align-self: center; }
6550.generating-creative-card__star { position: absolute; border-radius: 50%; animation-name: gcc-star-float; animation-timing-function: ease-in-out; animation-iteration-count: infinite; animation-direction: alternate; pointer-events: none; box-shadow: currentcolor 0px 0px 6px 2px; }
6551.generating-creative-card__badge-wrap { display: flex; justify-content: center; z-index: 2; margin-bottom: 3%; }
6552.generating-creative-card__badge { position: relative; transform: rotate(-2deg); font-family: Bangers, cursive; font-size: clamp(12px, 7cqi, 18px); line-height: normal; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 0.35em 1.1em; white-space: nowrap; clip-path: polygon(4% 0%, 96% 0%, 100% 50%, 96% 100%, 4% 100%, 0% 50%); box-shadow: rgba(0, 0, 0, 0.4) 0px 3px 6px; }
6553.generating-creative-card__badge-gold { background: linear-gradient(90deg, rgb(246, 209, 90), rgb(246, 166, 35)); color: rgb(36, 16, 64); }
6554.generating-creative-card__badge-blue { background: linear-gradient(90deg, rgb(91, 141, 239), rgb(58, 99, 209)); color: rgb(245, 248, 255); }
6555.generating-creative-card__headline-wrap { display: flex; align-items: center; justify-content: center; gap: 4%; z-index: 2; margin-bottom: 4%; }
6556.generating-creative-card__sparkle { font-size: clamp(10px, 4.5cqi, 15px); line-height: normal;
6556 color: rgba(255, 255, 255, 0.6); flex-shrink: 0; }
6557.generating-creative-card__headline-text { text-align: center; font-family: Picsart-Fonts, sans-serif; font-size: clamp(12px, 6.5cqi, 18px); line-height: normal; font-weight: 600; color: rgba(255, 255, 255, 0.9); }
6558.generating-creative-card__headline-lead { position: relative; font-weight: 800; color: rgb(201, 163, 255); margin-right: 0.3em; display: inline-block; line-height: inherit; }
6559.generating-creative-card__headline-underline { position: absolute; left: 0px; right: 0px; bottom: -0.18em; height: 2px; opacity: 0.8; }
6560.generating-creative-card__headline-underline::before { height: 2px; border-radius: 2px; background: linear-gradient(90deg, rgb(168, 85, 247), rgb(236, 72, 153)); }
6561.generating-creative-card__centerpiece { position: relative; flex: 1 1 0%; min-height: 0px; display: flex; align-items: center; justify-content: center; z-index: 1; margin-bottom: 4%; }
6562.generating-creative-card__steps-row { position: relative; display: flex; align-items: center; justify-content: center; z-index: 2; margin-bottom: 3%; }
6563.generating-creative-card__step-traveler { position: absolute; top: 50%; width: 6px; height: 6px; border-radius: 50%; background-color: rgb(255, 255, 255); box-shadow: rgba(255, 255, 255, 0.85) 0px 0px 8px 3px; transform: translate(-50%, -50%); transition: left 0.7s cubic-bezier(0.65, 0, 0.35, 1); z-index: 3; pointer-events: none; }
6564.generating-creative-card__step-dot { width: clamp(16px, 8cqi, 30px); height: clamp(16px, 8cqi, 30px); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: clamp(10px, 5.5cqi, 16px); background-color: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.25); transition: 0.4s; flex-shrink: 0; }
6565.generating-creative-card__step-dot-active { background: linear-gradient(135deg, rgb(246, 209, 90), rgb(246, 166, 35)); border-color: transparent; box-shadow: rgba(246, 166, 35, 0.8) 0px 0px 10px; transform: scale(1.12); }
6566.generating-creative-card__step-connector { flex: 1 1 8px; min-width: 4px; height: 0px; border-top: 2px dotted rgba(255, 255, 255, 0.25); align-self: center; }
6567.generating-creative-card__caption { text-align: center; font-family: Picsart-Fonts, sans-serif; font-size: clamp(11px, 5.5cqi, 16px); font-weight: 600; color: rgba(255, 255, 255, 0.85); line-height: 1.35; padding: 0px 4%; z-index: 2; }
6568.generating-creative-card__caption-gold { color: rgb(246, 209, 90); font-weight: 800; line-height: inherit; }
6569.generating-creative-card__caption-blue { color: rgb(201, 214, 255); font-weight: 800; line-height: inherit; }
6570.generating-creative-card__hint { text-align: center; font-family: Picsart-Fonts, sans-serif; font-size: clamp(8px, 4cqi, 12px); font-weight: 500; color: rgba(255, 255, 255, 0.55); line-height: 1.3; z-index: 2; }
6571.generating-creative-card__progress-bar { position: absolute; bottom: 0px; left: 0px; right: 0px; height: 5px; background-color: rgba(255, 255, 255, 0.1); overflow: hidden; border-radius: 0 0 var(--corner-radius-r12) var(--corner-radius-r12); }
6572.generating-creative-card__progress-fill { height: 100%; width: 100%; background: linear-gradient(90deg, rgb(168, 85, 247), rgb(236, 72, 153), rgb(168, 85, 247)) 0% 0% / 200% 100%; transform-origin: left center; animation-name: gcc-progress-sweep; animation-duration: 3s; animation-timing-function: ease-in-out; animation-iteration-count: infinite; }
6573.generating-creative-card__art-frame { position: relative; width: 86%; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.5) 0px 8px 18px; overflow: hidden; line-height: 0; }
6574.generating-creative-card__art-image { display: block; width: 100%; height: auto; }
6575.generating-creative-card__art-sweep { position: absolute; inset: -30%; background: linear-gradient(100deg, transparent 40%, rgba(255, 255, 255, 0.55) 50%, transparent 60%); animation-name: gcc-sweep-diagonal; animation-duration: 3.2s; animation-timing-function: ease-in-out; animation-iteration-count: infinite; pointer-events: none; }
6576.empty-state { width: 100%; height: 100%; overflow: hidden auto; box-sizing: border-box; background-color: var(--background-colors-base); display: flex; align-items: center; justify-content: center; }
6577@media (pointer: fine) {
6578  .empty-state::-webkit-scrollbar { width: 4px; height: 4px; }
6579  .empty-state::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6580  .empty-state::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6581  .empty-state::-webkit-scrollbar-corner { background: transparent; }
6582}
6583@supports (-moz-appearance: none) {
6584  .empty-state { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6585}
6586@media (pointer: coarse) {
6587  .empty-state::-webkit-scrollbar { display: none; }
6588}
6589.empty-state--mobile { padding-block: var(--spacings-s32); }
6590.empty-state--mobile .empty-state__content { padding: var(--spacings-s16); }
6591.empty-state__content { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--spacings-s16); padding: var(--spacings-s24); max-width: 420px; }
6592.empty-state__heading { font-family: Bangers, cursive; font-weight: 400; color: var(--text-colors-base); font-size: 24px; line-height: normal; letter-spacing: 1px; margin: 0px; }
6593.empty-state__subtitle { margin: 0px; }
6594.collection { height: 100%; overflow-y: auto; }
6595@media (pointer: fine) {
6596  .collection::-webkit-scrollbar { width: 4px; height: 4px; }
6597  .collection::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6598  .collection::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6599  .collection::-webkit-scrollbar-corner { background: transparent; }
6600}
6601@supports (-moz-appearance: none) {
6602  .collection { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6603}
6604@media (pointer: coarse) {
6605  .collection::-webkit-scrollbar { display: none; }
6606}
6607.collection { padding: var(--spacings-s8); box-sizing: border-box; background-color: var(--background-colors-base); }
6608.collection--mobile { padding-bottom: var(--spacings-s32); }
6609.collection--with-header { display: flex; flex-direction: column; gap: var(--spacings-s24); padding: var(--spacings-s24) 0 var(--spacings-s64); }
6610.collection--with-header > * { flex-shrink: 0; }
6611.collection__title { font-family: Bangers, cursive; font-weight: 400; font-size: 42px; line-height: 48px; letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-colors-base); margin: 0px; }
6612.collection__chip-bar { display: flex; flex-direction: row; align-items: center; gap: var(--spacings-s6); min-width: 0px; }
6613.collection__chip-bar > .collection__chip-row { flex: 0 1 auto; min-width: 0px; }
6614.collection__chip-row { display: flex; flex-direction: row; align-items: center; gap: var(--spacings-s6); min-width: 0px; overflow-x: auto; scrollbar-width: none; }
6615.collection__chip-row::-webkit-scrollbar { display: none; }
6616.collection__chip-row > * { flex-shrink: 0; }
6617.collection__filter-empty-state { display: flex; flex: 1 1 auto; min-height: 0px; }
6618.collection__loading-state { height: 100%; display: flex; align-items: center; justify-content: center; background-image: none; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: var(--background-colors-base); }
6619.collection__centered { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--spacings-s8); text-align: center; background-color: var(--background-colors-base); }
6620.collection__centered-clickable { cursor: pointer; border-radius: 12px; padding: var(--spacings-s16); display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s8); }
6621.collection__centered-clickable:active { transform: scale(0.98); }
6622.collection__empty-images-container { position: relative; width: 350px; height: 300px; }
6623.collection__empty-frame { width: 180px; aspect-ratio: 2 / 3; overflow: hidden; position: absolute; }
6624.collection__empty-frame.collection__empty-frame { border-radius: var(--corner-radius-r12); }
6625.collection__empty-frame-back { left: 20px; top: 0px; transform: rotate(-12.5deg); z-index: 2; }
6626.collection__empty-frame-front { right: 25px; top: 10px; transform: rotate(10deg); z-index: 1; }
6627.collection__empty-frame-placeholder { display: flex; align-items: center; justify-content: center; font-size: 64px; background: var(--background-colors-tint-1); border-radius: var(--corner-radius-r12); }
6628.collection__empty-frame-image { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; display: block; }
6629.collection__empty-text-container { display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s4); }
6630.collection__empty-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--text-colors-base); margin: 0px; }
6631.collection__empty-subtext { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); color: var(--text-colors-tint-1); margin: 0px; }
6632.collection__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--spacings-s16); }
6633.collection--mobile .collection__grid { grid-template-columns: repeat(2, 1fr); gap: var(--spacings-s10); }
6634.collection__card { display: block; }
6635.collection__frame { width: 100%; aspect-ratio: 2 / 3; overflow: visible; position: relative; cursor: pointer; background-color: var(--background-colors-tint-3); border-radius: var(--corner-radius-r12) !important; }
6636@media (hover: hover) {
6637  .collection__frame:hover .collection__play-overlay { opacity: 1; }
6638}
6639.collection__image-wrapper { position: absolute; inset: 0px; border-radius: var(--corner-radius-r12); overflow: hidden; }
6640.collection__cover-img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; display: block; }
6641.collection__fallback { position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; background: var(--background-colors-tint-3); }
6642.collection__fallback-icon { font-size: 36px; line-height: normal; opacity: 0.7; }
6643.collection__overlay { position: absolute; inset: 0px; display: flex; flex-direction: column; justify-content: space-between; pointer-events: none; }
6644.collection__top-actions { display: flex; justify-content: flex-end; padding: var(--spacings-s6); pointer-events: auto; }
6645.collection__menu-root { position: relative; }
6646.collection__more-btn { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: var(--corner-radius-r8); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: rgba(0, 0, 0, 0.55); backdrop-filter: blur(4px); cursor: pointer; padding: 0px; transition: background-color 0.12s; }
6647.collection__more-btn:hover { background-color: rgba(0, 0, 0, 0.75); }
6648.collection__more-btn { color: var(--absolute-white-colors-base-default); min-width: 28px; }
6649.collection__more-btn-mobile { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: var(--corner-radius-r8); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: rgba(0, 0, 0, 0.5); cursor: pointer; padding: 0px; transition: background-color 0.12s; }
6650.collection__more-btn-mobile:hover { background-color: rgba(0, 0, 0, 0.7); }
6651.collection__more-btn-mobile { color: var(--absolute-white-colors-base-default); }
6652.collection__dropdown { position: absolute; top: calc(100% + 4px); right: 0px; min-width: 160px; background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r12); box-shadow: rgba(0, 0, 0, 0.35) 0px 8px 24px; overflow: hidden; z-index: 200; }
6653.collection__dropdown--open-right { left: 0px; right: auto; }
6654.collection__dropdown--open-up { top: auto; bottom: calc(100% + 4px); }
6655.collection__dropdown-item { display: flex; align-items: center; gap: var(--spacings-s8); width: 100%; padding: var(--spacings-s12) var(--spacings-s16); font-size: var(--typography-t4-font-size); font-family: Picsart-Fonts, sans-serif; font-weight: 500; color: var(--text-colors-base); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; text-align: left; transition: background-color 0.12s; }
6656.collection__dropdown-item:hover { background-color: var(--background-colors-tint-2); }
6657.collection__dropdown-item--delete { color: var(--negative-colors-base-default); }
6658.collection__dropdown-item--delete svg { fill: var(--negative-colors-base-default); }
6659.collection__page-count-badge { display: flex; justify-content: flex-end; padding: var(--spacings-s6); pointer-events: none; }
6660.collection__page-count-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 600; color: rgb(255, 255, 255); background-color: rgba(0, 0, 0, 0.55); backdrop-filter: blur(4px); border-radius: var(--corner-radius-r4); padding: var(--spacings-s2) var(--spacings-s6); line-height: 1.4; }
6661.collection__generating-card { position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; }
6662.collection__generating-cover-img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; filter: blur(4px) brightness(0.7); transform: scale(1.05); }
6663.collection__generating-overlay { position: relative; display: flex; align-items: center; justify-content: center; z-index: 1; width: 64px; height: 64px; border-radius: 50%; }
6664.collection__section-header { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--text-colors-tint-1); padding: var(--spacings-s8) var(--spacings-s4) var(--spacings-s4); margin: 0px; }
6665.collection__video-card { display: block; cursor: pointer; border-radius: var(--corner-radius-r12); overflow: hidden; position: relative; aspect-ratio: 9 / 16; background-color: rgb(0, 0, 0); }
6666.collection__video-card:hover .collection__video-overlay { opacity: 1; }
6667.collection__video-el { width: 100%; height: 100%; object-fit: cover; display: block; }
6668.collection__video-overlay { position: absolute; inset: 0px; display: flex; align-items: flex-end; padding: var(--spacings-s8); background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, transparent 60%); opacity: 0; transition: opacity 0.2s; }
6669.collection__video-label { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 600; color: rgb(255, 255, 255); }
6670.collection__video-player-backdrop { position: fixed; inset: 0px; z-index: 1000; background-color: rgba(0, 0, 0, 0.92); display: flex; align-items: center; justify-content: center; }
6671.collection__video-player-content { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s12); max-height: 100vh; max-width: 100vw; padding: var(--spacings-s16); box-sizing: border-box; }
6672.collection__video-player-el { max-height: calc(-120px + 100vh); max-width: 100%; border-radius: var(--corner-radius-r12); display: block; }
6673.collection__video-player-close { position: absolute; top: var(--spacings-s8); right: var(--spacings-s8); background: rgba(255, 255, 255, 0.15); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 50%; width: 36px; height: 36px; cursor: pointer; display: flex; align-items: center; justify-content: center; color: rgb(255, 255, 255); font-size: 20px; line-height: 1; }
6674.collection__video-player-close:hover { background: rgba(255, 255, 255, 0.3); }
6675.collection__video-player-open-book { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; color: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.4); border-radius: var(--corner-radius-r8); padding: var(--spacings-s8) var(--spacings-s16); cursor: pointer; }
6676.collection__video-player-open-book:hover { background: rgba(255, 255, 255, 0.35); }
6677.collection__bottom-actions { display: flex; justify-content: space-between; align-items: center; padding: var(--spacings-s6); pointer-events: auto; gap: var(--spacings-s4); }
6678.collection__video-play-badge { display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; min-width: 28px; min-height: 28px; border-radius: 50%; background: var(--negative-colors-base-default); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; padding: 0px; transition: background-color 0.12s; }
6679.collection__video-play-badge:hover { background: var(--negative-colors-base-action); }
6680.collection__video-play-badge { color: var(--negative-colors-text-default); }
6681.collection__video-play-badge .button__icon { flex-basis: 16px; width: 16px; height: 16px; }
6682.collection__play-overlay { position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; opacity: 0.9; transition: opacity 0.18s; z-index: 2; pointer-events: none; }
6683.collection__play-circle { width: 44px; height: 44px; border-radius: 50%; background-color: rgba(0, 0, 0, 0.45); backdrop-filter: blur(6px); border: 1.5px solid rgba(255, 255, 255, 0.3); display: flex; align-items: center; justify-content: center; box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 12px; cursor: pointer; padding: 0px; pointer-events: auto; color: var(--absolute-white-colors-base-default); }
6684.collection__video-generating-badge { display: flex; align-items: center; justify-content: center; gap: var(--spacings-s4); height: 24px; border-radius: var(--corner-radius-r12); padding: 0 var(--spacings-s8); background: var(--negative-colors-base-default); box-shadow: rgba(0, 0, 0, 0.35) 0px 2px 8px; white-space: nowrap; }
6685.collection__video-generating-badge-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--negative-colors-text-default); }
6686.collection__play-menu { position: absolute; bottom: calc(100% + 4px); right: 0px; background: rgba(20, 20, 20, 0.95); border-radius: var(--corner-radius-r8); overflow: hidden; z-index: 300; white-space: nowrap; box-shadow: rgba(0, 0, 0, 0.5) 0px 4px 12px; }
6687.collection__play-menu-item { display: block; width: 100%; padding: var(--spacings-s6) var(--spacings-s12); color: rgb(255, 255, 255); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; text-align: left; font-size: var(--typography-t4-font-size); font-family: Picsart-Fonts, sans-serif; font-weight: 500; transition: background-color 0.1s; }
6688.collection__play-menu-item:hover { background: rgba(255, 255, 255, 0.15); }
6689.collection__video-generating-banner { position: absolute; bottom: 0px; left: 0px; right: 0px; display: flex; align-items: center; justify-content: center; gap: var(--spacings-s4); padding: var(--spacings-s6) var(--spacings-s8); background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, transparent 100%); border-radius: 0 0 var(--corner-radius-r12) var(--corner-radius-r12); pointer-events: none; }
6690.collection__video-generating-banner-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t2-font-size); font-weight: 600; color: rgb(255, 255, 255); letter-spacing: 0.02em; }
6691.collection__video-book-label { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t2-font-size); font-weight: 600; color: rgb(255, 255, 255); letter-spacing: 0.6px; text-transform: uppercase; padding: 2px var(--spacings-s6); background: rgba(0, 0, 0, 0.55); backdrop-filter: blur(4px); border-radius: var(--corner-radius-r20); }
6692.book-options-sheet__sheet-header { display: flex; justify-content: space-between; align-items: center; width: 100%; }
6693.book-options-sheet__sheet-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; line-height: var(--typography-t5-line-height); color: var(--text-colors-base); margin: 0px; }
6694.book-options-sheet__content { display: flex; flex-direction: column; align-items: center; padding-top: var(--spacings-s8); width: 100%; }
6695.book-options-sheet__cover-image { width: 166px; height: 246px; object-fit: cover; border-radius: 16px; margin-bottom: var(--spacings-s8); }
6696.book-options-sheet__cover-placeholder { width: 166px; height: 246px; border-radius: 16px; margin-bottom: var(--spacings-s8); background-color: rgba(128, 128, 128, 0.15); }
6697.book-options-sheet__options-list { display: flex; flex-direction: column; gap: var(--spacings-s4); width: 100%; }
6698.book-options-sheet__option-item { display: flex; align-items: center; gap: var(--spacings-s12); padding: var(--spacings-s12) var(--spacings-s16); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; width: 100%; text-align: left; transition: background-color 0.12s; }
6699.book-options-sheet__option-item:hover { background-color: var(--backgrounds-tint-1); }
6700.book-options-sheet__option-item:disabled { opacity: 0.4;
6700 cursor: not-allowed; }
6701.book-options-sheet__option-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 500; color: var(--control-colors-text-default); }
6702.book-options-sheet__confirm-content { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 32px; padding-bottom: 16px; width: 100%; }
6703.book-options-sheet__confirm-icon-circle { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 28px; background: var(--primary-colors-alpha-20); margin-bottom: var(--spacings-s12); }
6704.book-options-sheet__confirm-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; line-height: var(--typography-t5-line-height); color: var(--text-colors-base); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s8); }
6705.book-options-sheet__confirm-subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s16); }
6706.book-options-sheet__confirm-actions { display: flex; flex-direction: column; gap: var(--spacings-s8); width: 100%; }
6707.book-options-sheet__generating-image { filter: blur(4px) brightness(0.7); }
6708.book-options-sheet__generating-overlay { position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; z-index: 1; }
6709@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6710@layer ds-atoms {
6711  .bottom-sheet__content { display: grid; grid-template-rows: auto 1fr auto; height: 100%; min-height: 0px; }
6712  .bottom-sheet__header { position: sticky; top: 0px; padding: var(--spacings-s0) var(--spacings-s16) var(--spacings-s8) var(--spacings-s16); background-color: var(--background-colors-base); }
6713  .bottom-sheet__body { padding: var(--spacings-s0) var(--spacings-s16); overflow-y: auto; min-height: 0px; scrollbar-gutter: stable both-edges; }
6714  .bottom-sheet__footer { position: sticky; bottom: 0px; padding: var(--spacings-s0) var(--spacings-s16); background-color: var(--background-colors-base); }
6715}
6716@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6717@layer ds-subatoms {
6718  .base-bottom-sheet { position: fixed; bottom: 0px; left: 0px; z-index: var(--bbs-z-index, 9); width: 100%; border-radius: var(--corner-radius-r16); background-color: var(--background-colors-base); isolation: isolate; transform-origin: center bottom; will-change: transform, height; transition-property: transform, opacity, max-height; transition-duration: 0.25s; transition-timing-function: cubic-bezier(0.4, 0, 1, 1); }
6719  .base-bottom-sheet--static { padding-top: var(--spacings-s12); border-radius: var(--corner-radius-r0); }
6720  .base-bottom-sheet--full-height { border-radius: var(--corner-radius-r0); }
6721  .base-bottom-sheet--open { transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
6722  .base-bottom-sheet--dragging { transition-duration: 0s; }
6723  .base-bottom-sheet__touch-area { display: grid; place-content: center; position: relative; height: 12px; border-radius: var(--corner-radius-r16) var(--corner-radius-r16) var(--corner-radius-r0) var(--corner-radius-r0); background-color: var(--background-colors-base); }
6724  .base-bottom-sheet--full-height .base-bottom-sheet__touch-area { border-radius: var(--corner-radius-r0); }
6725  .base-bottom-sheet__touch-area::before { content: ""; position: absolute; left: 50%; z-index: calc(var(--bbs-z-index, 9) + 1); width: 100%; max-width: 80%; height: 44px; background-color: transparent; translate: -50%; transform: translateY(0px); }
6726  .base-bottom-sheet--open .base-bottom-sheet__touch-area::before { transform: translateY(-45%); }
6727  .base-bottom-sheet__touch-area::after { content: ""; width: 32px; height: 4px; border-radius: var(--corner-radius-r4); background-color: var(--background-colors-tint-3); }
6728  .base-bottom-sheet__overlay { position: absolute; top: 12px; z-index: -1; width: 100%; height: 105%; background-color: var(--background-colors-transparent); opacity: var(--bbs-overlay-opacity, 0); transform: translateY(-100%); transition: opacity var(--timings-default) var(--easings-ease); user-select: none; }
6729  .base-bottom-sheet--static .base-bottom-sheet__overlay { top: 0px; }
6730  .base-bottom-sheet__content { height: 100%; contain: layout; touch-action: pan-y; }
6731  .base-bottom-sheet__content--with-bg-effect::before { content: ""; position: absolute; top: 50%; left: 50%; z-index: 0; width: 100%; max-height: 100%; height: auto; aspect-ratio: 1 / 1; background: var(--effects-vignette); transform: translate(-50%, -50%); pointer-events: none; }
6732  .base-bottom-sheet--enter { opacity: 0; }
6733  .base-bottom-sheet--enter-active { opacity: 1; transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1), opacity 0.25s cubic-bezier(0, 0, 0.2, 1), max-height 0.25s cubic-bezier(0, 0, 0.2, 1); }
6734  .base-bottom-sheet--exit { opacity: 1; }
6735  .base-bottom-sheet--exit-active { opacity: 0; transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1), opacity 0.25s cubic-bezier(0.4, 0, 1, 1), max-height 0.25s cubic-bezier(0.4, 0, 1, 1); }
6736}
6737.filter-chips__filter-bar { flex-shrink: 0; overflow: auto hidden; padding-top: ; padding-right: ; padding-left: ; padding-bottom: var(--spacings-s8); }
6738@media (pointer: fine) {
6739  .filter-chips__filter-bar::-webkit-scrollbar { width: 4px; height: 0px; }
6740  .filter-chips__filter-bar::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6741  .filter-chips__filter-bar::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6742  .filter-chips__filter-bar::-webkit-scrollbar-corner { background: transparent; }
6743}
6744@supports (-moz-appearance: none) {
6745  .filter-chips__filter-bar { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6746}
6747@media (pointer: coarse) {
6748  .filter-chips__filter-bar::-webkit-scrollbar { display: none; }
6749}
6750.filter-chips__filter-bar { scrollbar-width: none; }
6751.filter-chips__filter-bar::-webkit-scrollbar { display: none; }
6752.filter-chips__filter-bar--fade-end { mask-image: linear-gradient(to right,#000 calc(100% - var(--spacings-s24)),transparent 100%); }
6753.filter-chips__filter-bar--fade-start { mask-image: linear-gradient(to left,#000 calc(100% - var(--spacings-s24)),transparent 100%); }
6754.filter-chips__filter-bar--fade-both { mask-image: linear-gradient(to right,transparent 0,#000 var(--spacings-s24),#000 calc(100% - var(--spacings-s24)),transparent 100%); }
6755.filter-chips__chips-row-inner { display: inline-flex; align-items: center; gap: var(--spacings-s8); flex-wrap: nowrap; }
6756.filter-chips__chips-row-inner > .chip { flex-shrink: 0; }
6757.filter-menu { position: relative; flex-shrink: 0; }
6758.filter-menu__dropdown { position: absolute; top: calc(100% + var(--spacings-s4)); left: 0px; z-index: 200; }
6759.filter-menu__dropdown--align-right { left: auto; right: 0px; }
6760.filter-menu__dropdown { display: flex; flex-direction: column; min-width: 180px; padding: var(--spacings-s12); background-color: var(--background-colors-tint-1); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r16); box-shadow: rgba(0, 0, 0, 0.35) 0px 8px 24px; }
6761.filter-menu__dropdown--mobile { min-width: 150px; max-width: calc(100vw - var(--spacings-s16) * 2); box-sizing: border-box; }
6762.filter-menu__option { display: flex; align-items: center; }
6763@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6764@layer ds-atoms {
6765  .checkbox { display: inline-flex; column-gap: var(--spacings-s2); padding: var(--spacings-s6) 0; color: var(--text-colors-base); }
6766  .checkbox__box { display: inline-block; vertical-align: top; position: relative; flex: 0 0 auto; width: 20px; height: 20px; }
6767  .checkbox__control { display: inline-block; vertical-align: top; position: absolute; inset: 0px; width: 100%; height: 100%; }
6768  .checkbox__control--pointer { cursor: pointer; }
6769  .checkbox__control--not-allowed { cursor: not-allowed; }
6770  .checkbox__icon { display: block; width: 100%; height: 100%; transition: color var(--timings-default) var(--easings-ease); }
6771  .checkbox__icon > path:not([fill]) { fill: currentcolor; }
6772  .checkbox__label { display: flex; align-items: center; padding: var(--spacings-s0) var(--spacings-s2); font-weight: 600; user-select: none; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
6773  .checkbox__label--pointer { cursor: pointer; }
6774  .checkbox--default .checkbox__icon { color: var(--control-colors-start-icon-default); }
6775  @media (hover: hover) and (pointer: fine) {
6776  .checkbox--default-interactive:hover .checkbox__icon { color: var(--control-colors-start-icon-action); }
6777}
6778  @media (hover: none) and (pointer: coarse) {
6779  .checkbox--default-interactive:active .checkbox__icon { color: var(--control-colors-start-icon-action); }
6780}
6781  .checkbox--skin-primary.checkbox--active .checkbox__icon { color: var(--primary-colors-base-active); }
6782  .checkbox--skin-primary.checkbox--active .checkbox__icon > path[fill] { fill: var(--primary-colors-base-active); }
6783  @media (hover: hover) and (pointer: fine) {
6784  .checkbox--skin-primary.checkbox--active-interactive:hover .checkbox__icon { color: var(--primary-colors-base-active-action); }
6785  .checkbox--skin-primary.checkbox--active-interactive:hover .checkbox__icon > path[fill] { fill: var(--primary-colors-base-active-action); }
6786}
6787  @media (hover: none) and (pointer: coarse) {
6788  .checkbox--skin-primary.checkbox--active-interactive:active .checkbox__icon { color: var(--primary-colors-base-active-action); }
6789  .checkbox--skin-primary.checkbox--active-interactive:active .checkbox__icon > path[fill] { fill: var(--primary-colors-base-active-action); }
6790}
6791  .checkbox--skin-premium.checkbox--active .checkbox__icon { color: var(--monetization-ultra-colors-base-active); }
6792  .checkbox--skin-premium.checkbox--active .checkbox__icon > path[fill] { fill: var(--monetization-ultra-colors-base-active); }
6793  @media (hover: hover) and (pointer: fine) {
6794  .checkbox--skin-premium.checkbox--active-interactive:hover .checkbox__icon { color: var(--monetization-ultra-colors-base-active-action); }
6795  .checkbox--skin-premium.checkbox--active-interactive:hover .checkbox__icon > path[fill] { fill: var(--monetization-ultra-colors-base-active-action); }
6796}
6797  @media (hover: none) and (pointer: coarse) {
6798  .checkbox--skin-premium.checkbox--active-interactive:active .checkbox__icon { color: var(--monetization-ultra-colors-base-active-action); }
6799  .checkbox--skin-premium.checkbox--active-interactive:active .checkbox__icon > path[fill] { fill: var(--monetization-ultra-colors-base-active-action); }
6800}
6801  .checkbox--disabled { opacity: var(--states-disabled); }
6802}
6803.anime-episode-feed { position: relative; width: 100%; height: 100%; aspect-ratio: 2 / 3; overflow-y: scroll; scroll-snap-type: y mandatory; scrollbar-width: none; background: rgb(0, 0, 0); }
6804.anime-episode-feed::-webkit-scrollbar { display: none; }
6805.anime-episode-feed__slide { position: relative; width: 100%; height: 100%; scroll-snap-align: start; scroll-snap-stop: always; display: flex; align-items: center; justify-content: center; background: rgb(0, 0, 0); }
6806.anime-episode-feed__slide--with-submit { flex-direction: column; align-items: stretch; }
6807.anime-episode-feed__slide--with-submit .anime-episode-feed__video { flex: 1 1 0%; min-height: 0px; height: auto; }
6808.anime-episode-feed__submit { flex-shrink: 0; padding: var(--spacings-s16); }
6809.anime-episode-feed__video { width: 100%; height: 100%; object-fit: cover; background: rgb(0, 0, 0); }
6810.anime-episode-feed__video:fullscreen, .anime-episode-feed__video:-webkit-full-screen { object-fit: contain; }
6811.anime-episode-feed__placeholder { flex-direction: column; gap: var(--spacings-s16); background-color: var(--background-colors-tint-1); }
6812.anime-episode-feed__placeholder--generate { background: linear-gradient(135deg,#4c1d958c,#9333ac80,#db27776b),var(--background-colors-tint-1); }
6813.anime-episode-feed__placeholder--busy { background-size: 200% 200%; animation: 8s ease-in-out 0s infinite normal none running anime-episode-feed-drift; }
6814@media (prefers-reduced-motion: reduce) {
6815  .anime-episode-feed__placeholder--busy { animation: auto ease 0s 1 normal none running none; }
6816}
6817@keyframes anime-episode-feed-drift { 
6818  0% { background-position: 0% 0%; }
6819  50% { background-position: 100% 100%; }
6820  100% { background-position: 0% 0%; }
6821}
6822.anime-episode-feed__placeholder--stuck { background: linear-gradient(rgb(246, 166, 35), rgb(217, 130, 15)); }
6823.anime-episode-feed__badge { position: absolute; top: var(--spacings-s16); left: var(--spacings-s16); right: var(--spacings-s16); color: var(--absolute-white-colors-base-default); text-shadow: rgba(0, 0, 0, 0.6) 0px 1px 3px; font-size: 14px; font-weight: 600; pointer-events: none; }
6824.anime-episode-feed__placeholder .anime-episode-feed__badge { position: static; text-align: center; }
6825.anime-episode-feed__idea-box { max-width: 80%; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: var(--spacings-s12) var(--spacings-s16); border-radius: var(--corner-radius-r12); background: rgb(20, 11, 38); border: 1px solid rgba(219, 39, 119, 0.3); }
6826.anime-episode-feed__idea-label { text-align: center; color: var(--absolute-white-colors-base-default); opacity: 0.7; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
6827.anime-episode-feed__idea-text { text-align: center; color: var(--absolute-white-colors-base-default); font-size: 13px; font-weight: 400; }
6828.anime-episode-feed__busy-icon { position: relative; width: 48px; height: 48px; }
6829.anime-episode-feed__busy-glow { position: absolute; inset: -20px; border-radius: 50%; background: radial-gradient(circle,var(--primary-colors-alpha-50) 0%,transparent 70%); animation: 2s ease-in-out 0s infinite normal none running anime-episode-feed-pulse; }
6830@media (prefers-reduced-motion: reduce) {
6831  .anime-episode-feed__busy-glow { animation: auto ease 0s 1 normal none running none; }
6832}
6833@keyframes anime-episode-feed-pulse { 
6834  0%, 100% { transform: scale(0.85); opacity: 0.5; }
6835  50% { transform: scale(1.15); opacity: 1; }
6836}
6837@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
6838@layer ds-molecules {
6839  .carousel { position: relative; width: 100%; user-select: none; height: var(--car-h, auto); }
6840  .carousel__content-wrapper { overflow: hidden; }
6841  .carousel__content { display: flex; justify-content: flex-start; width: 100%; overscroll-behavior-x: contain; scrollbar-width: none; }
6842  .carousel__content::-webkit-scrollbar { display: none; }
6843  .carousel__content--swipe-transition { transition: transform var(--timings-default) var(--easings-ease-out); }
6844  .carousel__content--multi-slide { overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; }
6845  .carousel__slide { display: flex; justify-content: center; flex-shrink: 0; margin: 0px auto; width: 100%; transform: translateZ(0px); }
6846  .carousel__slide--fade { opacity: 0; transition: opacity var(--timings-default) var(--easings-ease-out); }
6847  .carousel__slide--active.carousel__slide--fade { opacity: 1; }
6848  .carousel__arrow-wrap { display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; transform: translateY(-50%); width: 60px; height: 100%; pointer-events: none; }
6849  .carousel__arrow-wrap.left { inset-inline-start: var(--spacings-s0); }
6850  .carousel__arrow-wrap.right { inset-inline-end: var(--spacings-s0); }
6851  .carousel__arrow-wrap--gradients-left.left { background: var(--car-gradient-left); }
6852  .carousel__arrow-wrap--gradients-right.right { background: var(--car-gradient-right); }
6853  .carousel__arrow-button { box-shadow: var(--shadows-tint-1); pointer-events: auto; }
6854  .carousel__arrow-button.left { margin-inline-start: var(--car-arrow-left-margin, 0); left: var(--car-arrow-left-pos, auto); }
6855  .carousel__arrow-button.right { margin-inline-end: var(--car-arrow-right-margin, 0); right: var(--car-arrow-right-pos, auto); }
6856  .carousel__arrow-button--overhang { position: absolute; }
6857  [dir="rtl"] .carousel__arrow-button--rtl-flip { transform: scaleX(-1); }
6858  .carousel__merged-slide { display: inline-flex; gap: var(--car-gap, 10px); }
6859  .carousel__pagination { display: flex; justify-content: center; list-style: none; }
6860  .carousel__pagination--on-content { position: absolute; transform: translate(-50%); left: 50%; bottom: var(--spacings-s32); }
6861  .carousel__pagination--below-content { margin-top: var(--spacings-s16); margin-bottom: var(--spacings-s16); }
6862  .carousel__scroller { display: flex; transition: transform var(--timings-default) var(--easings-ease-out); will-change: transform; }
6863  .carousel__pagination-item { width: 8px; height: 8px; border-radius: var(--corner-radius-circle); background-color: var(--control-colors-border-default); margin: var(--spacings-s0) var(--spacings-s4); flex-shrink: 0; transition: transform var(--timings-default),opacity var(--timings-default),background-color var(--timings-default); cursor: pointer; opacity: 0; transform: scale(0); }
6864  @media (hover: hover) and (pointer: fine) {
6865  .carousel__pagination-item:hover { background-color: var(--primary-colors-base-action); }
6866}
6867  @media (hover: none) and (pointer: coarse) {
6868  .carousel__pagination-item:hover { background-color: var(--primary-colors-base-action); }
6869}
6870  .carousel__pagination-item--active { background-color: var(--primary-colors-base-default); }
6871  .carousel__pagination-item--visible { opacity: 1; transform: scale(0.6); }
6872  .carousel__pagination-item--mid-visible, .carousel__pagination-item--normal { opacity: 1; transform: scale(1); }
6873  .carousel__pagination-item--edge { transform: scale(0.6); opacity: 1; }
6874}
6875.inspire-me { height: 100%; overflow-y: auto; }
6876@media (pointer: fine) {
6877  .inspire-me::-webkit-scrollbar { width: 4px; height: 4px; }
6878  .inspire-me::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6879  .inspire-me::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6880  .inspire-me::-webkit-scrollbar-corner { background: transparent; }
6881}
6882@supports (-moz-appearance: none) {
6883  .inspire-me { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6884}
6885@media (pointer: coarse) {
6886  .inspire-me::-webkit-scrollbar { display: none; }
6887}
6888.inspire-me { padding: var(--spacings-s24) 0 var(--spacings-s64); box-sizing: border-box; background-color: var(--background-colors-base); display: flex; flex-direction: column; gap: var(--spacings-s24); }
6889.inspire-me--mobile { padding: var(--spacings-s8) var(--spacings-s6) var(--spacings-s32); gap: var(--spacings-s16); }
6890.inspire-me__header { display: flex; flex-direction: column; gap: var(--spacings-s16); }
6891.inspire-me__title-block { display: flex; flex-direction: column; gap: var(--spacings-s8); }
6892.inspire-me__title { font-family: Bangers, cursive; font-weight: 400; font-size: 42px; line-height: 48px; letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-colors-base); margin: 0px; }
6893.inspire-me--mobile .inspire-me__title { font-size: 36px; line-height: 42px; }
6894.inspire-me__subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); margin: 0px; }
6895.inspire-me__chip-row { display: flex; flex-flow: wrap; align-items: center; gap: var(--spacings-s6); }
6896.inspire-me__chip-scroll { display: contents; }
6897.inspire-me--mobile .inspire-me__chip-row { flex-wrap: nowrap; min-width: 0px; }
6898.inspire-me--mobile .inspire-me__chip-row > .filter-menu { flex-shrink: 0; margin-top: var(--spacings-s0); }
6899.inspire-me--mobile .inspire-me__chip-scroll { display: flex; flex-direction: row; align-items: center; gap: var(--spacings-s6); flex: 1 1 0px; min-width: 0px; overflow-x: auto; scrollbar-width: none; }
6900.inspire-me--mobile .inspire-me__chip-scroll::-webkit-scrollbar { display: none; }
6901.inspire-me--mobile .inspire-me__chip-scroll > * { flex-shrink: 0; }
6902.inspire-me__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--spacings-s16); }
6903.inspire-me--mobile .inspire-me__grid { grid-template-columns: repeat(2, 1fr); gap: var(--spacings-s12); }
6904.inspire-me__card { position: relative; width: 100%; aspect-ratio: 200 / 300; background-color: var(--background-colors-tint-3); border-radius: var(--corner-radius-r12); overflow: hidden; }
6905.inspire-me__card--clickable { cursor: pointer; }
6906.inspire-me__card--stacked { aspect-ratio: auto; background-color: transparent; border-radius: 0px; overflow: visible; display: flex; flex-direction: column; gap: var(--spacings-s12); }
6907.inspire-me__card--framed { background-color: rgb(28, 28, 28); border-radius: var(--corner-radius-r16); padding: var(--spacings-s16); }
6908.inspire-me__card--framed .inspire-me__card-media { background-color: rgb(28, 28, 28); }
6909.inspire-me__card-hit { position: absolute; inset: 0px; }
6910.inspire-me__card-media { position: relative; width: 100%; aspect-ratio: 200 / 300; background-color: var(--background-colors-tint-3); border-radius: var(--corner-radius-r12); overflow: hidden; }
6911.inspire-me__card-pill { position: absolute; left: 50%; bottom: var(--spacings-s16); transform: translate(-50%); z-index: 3; pointer-events: none; }
6912.inspire-me__card-pill > * { pointer-events: auto; }
6913.inspire-me__card-carousel { position: absolute; inset: 0px; }
6914.inspire-me__card-carousel .carousel__content-wrapper, .inspire-me__card-carousel .carousel__content, .inspire-me__card-carousel .carousel__slide { height: 100%; }
6915.inspire-me__card-slide-image { width: 100%; height: 100%; object-fit: cover; display: block;
6915 -webkit-user-drag: none; user-select: none; }
6916.inspire-me__card-dots { display: flex; align-items: center; justify-content: center; gap: var(--spacings-s6); padding: var(--spacings-s4) 0; }
6917.inspire-me__card-dot { appearance: none; border: 0px; padding: 0px; width: 6px; height: 6px; border-radius: var(--corner-radius-circle); background-color: rgb(59, 59, 59); cursor: pointer; transition: background-color 0.15s, width 0.15s; }
6918.inspire-me__card-dot--active { background-color: var(--primary-colors-base-default); width: 8px; height: 8px; }
6919.inspire-me__card-cta { display: flex; }
6920.inspire-me__card-cta > * { width: 100%; }
6921.inspire-me__card-image { width: 100%; height: 100%; object-fit: cover; display: block; }
6922.inspire-me__card-overlay { position: absolute; inset: 0px; background-color: var(--background-colors-transparent); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.2s; pointer-events: none; }
6923.inspire-me__card-overlay > * { pointer-events: auto; }
6924.inspire-me__card:hover .inspire-me__card-overlay, .inspire-me__card:focus-within .inspire-me__card-overlay { opacity: 1; }
6925.inspire-me__card-badge { position: absolute; right: var(--spacings-s6); bottom: var(--spacings-s6); display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; min-width: 28px; min-height: 28px; border-radius: var(--corner-radius-circle); background-color: var(--negative-colors-base-default); color: var(--negative-colors-text-default); pointer-events: none; }
6926.inspire-me--mobile .inspire-me__card-badge { display: none; }
6927.inspire-me--preview { margin-inline: calc(-1 * (var(--spacings-s10) + var(--spacings-s16))); padding: 0 var(--spacings-s16) var(--spacings-s32); gap: var(--spacings-s16); }
6928.inspire-me--preview .inspire-me__grid { grid-template-columns: 1fr; gap: var(--spacings-s24); }
6929.inspire-me--preview .inspire-me__header { display: none; }
6930.inspire-me--preview .inspire-me__back { align-self: stretch; justify-content: flex-start; min-height: 52px; padding: 0 var(--spacings-s16); margin: 0 calc(-1 * var(--spacings-s16)); border-radius: 0px; box-shadow: none; background-color: var(--background-colors-base); }
6931.inspire-me__back { position: sticky; top: 0px; z-index: 4; align-self: flex-start; appearance: none; border: 0px; padding: var(--spacings-s8); margin: 0 0 var(--spacings-s8) -var(--spacings-s4); display: inline-flex; align-items: center; justify-content: center; color: var(--text-colors-base); background-color: var(--background-colors-base); border-radius: var(--corner-radius-circle); box-shadow: rgba(0, 0, 0, 0.25) 0px 2px 8px; cursor: pointer; }
6932.inspire-me__back:hover, .inspire-me__back:focus-visible { background-color: var(--background-colors-tint-3); }
6933.inspire-me-rail { flex-shrink: 0; flex-grow: 0; width: 177px; height: 100%; box-sizing: border-box; padding-right: ; padding-bottom: ; padding-left: ; padding-top: var(--spacings-s8); overflow-y: auto; }
6934@media (pointer: fine) {
6935  .inspire-me-rail::-webkit-scrollbar { width: 4px; height: 4px; }
6936  .inspire-me-rail::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
6937  .inspire-me-rail::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
6938  .inspire-me-rail::-webkit-scrollbar-corner { background: transparent; }
6939}
6940@supports (-moz-appearance: none) {
6941  .inspire-me-rail { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
6942}
6943@media (pointer: coarse) {
6944  .inspire-me-rail::-webkit-scrollbar { display: none; }
6945}
6946.inspire-me-rail { background-color: var(--background-colors-base); border-right: 1px solid var(--background-colors-border); }
6947.inspire-me-rail__title { font-family: Bangers, cursive; font-size: 16px; line-height: 24px; color: var(--text-colors-base); letter-spacing: 1px; margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s8); white-space: nowrap; }
6948.inspire-me-rail__section-label { position: sticky; top: 0px; z-index: 2; margin: 0px; padding: var(--spacings-s4) 0 var(--spacings-s6); background-color: var(--background-colors-base); font-family: Bangers, cursive; font-size: 14px; line-height: 20px; letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-colors-tint-1); }
6949.inspire-me-rail__section + .inspire-me-rail__section { margin-top: var(--spacings-s12); }
6950.inspire-me-rail__list { display: flex; flex-direction: column; gap: var(--spacings-s10); }
6951.inspire-me-rail__thumb { position: relative; width: 100%; aspect-ratio: 2 / 3; padding: 0px; background-color: var(--background-colors-tint-1); border: 1px solid var(--background-colors-tint-2); border-radius: var(--corner-radius-r8); overflow: hidden; cursor: pointer; opacity: 1; }
6952.inspire-me-rail__thumb:disabled { cursor: default; }
6953.inspire-me-rail__thumb--active { border-color: var(--primary-colors-base-active); }
6954.inspire-me-rail__thumb-image { width: 100%; height: 100%; object-fit: cover; display: block; }
6955.export-sheet__sheet-header { display: flex; justify-content: space-between; align-items: center; width: 100%; }
6956.export-sheet__sheet-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; line-height: var(--typography-t5-line-height); color: var(--text-colors-base); margin: 0px; }
6957.export-sheet__content { display: flex; flex-direction: column; align-items: center; padding-top: var(--spacings-s8); width: 100%; }
6958.export-sheet__cover-image { width: 166px; height: 246px; object-fit: cover; border-radius: 16px; margin-bottom: var(--spacings-s8); }
6959.export-sheet__cover-placeholder { width: 166px; height: 246px; border-radius: 16px; margin-bottom: var(--spacings-s8); background-color: rgba(128, 128, 128, 0.15); }
6960.export-sheet__options-list { display: flex; flex-direction: column; gap: var(--spacings-s4); width: 100%; }
6961.export-sheet__option-item { display: flex; align-items: center; gap: var(--spacings-s12); padding: var(--spacings-s12) var(--spacings-s16); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; width: 100%; text-align: left; transition: background-color 0.12s; }
6962.export-sheet__option-item:hover { background-color: var(--backgrounds-tint-1); }
6963.export-sheet__option-item:disabled { opacity: 0.4;
6963 cursor: not-allowed; }
6964.export-sheet__option-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 500; }
6965.export-sheet__actions-container { display: flex; flex-direction: column; gap: var(--spacings-s12); width: 100%; padding-bottom: var(--spacings-s8); }
6966.settings__page { display: flex; flex-direction: column; width: 100%; height: 100%; background-color: var(--background-colors-base); }
6967.settings__page-header { display: flex; align-items: center; gap: var(--spacings-s4); border-bottom: 1px solid var(--background-colors-border); flex-shrink: 0; }
6968.settings__page-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; color: var(--text-colors-base); }
6969.settings__dropdown { display: flex; flex-direction: column; position: absolute; top: calc(100% + 6px); right: 0px; background-color: var(--background-colors-base); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r12); z-index: 500; width: 360px; max-height: 620px; overflow-y: auto; box-shadow: rgba(0, 0, 0, 0.12) 0px 4px 16px; }
6970.settings__dropdown-header { padding: var(--spacings-s12) var(--spacings-s16) var(--spacings-s4); }
6971.settings__content { flex: 1 1 0%; overflow-y: auto; padding-left: var(--spacings-s8); }
6972.settings__section { padding: var(--spacings-s4) 0; }
6973.settings__section-title { color: var(--primary-colors-base-default); padding: var(--spacings-s12) var(--spacings-s12) var(--spacings-s4); display: block; }
6974.settings__menu-item { padding: var(--spacings-s4) var(--spacings-s8); }
6975.settings__version-item { display: flex; flex-direction: column; padding: var(--spacings-s8) var(--spacings-s12); gap: 2px; }
6976.settings__version-label { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); color: var(--text-colors-base); }
6977.settings__version-value { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-2); }
6978.settings__actions { display: flex; flex-direction: column; gap: var(--spacings-s12); padding: var(--spacings-s16) var(--spacings-s16) var(--spacings-s24); margin-top: auto; flex-shrink: 0; }
6979@keyframes inking-page-ring-fill { 
6980  0% { stroke-dashoffset: 540.354; }
6981  100% { stroke-dashoffset: 0; }
6982}
6983@keyframes inking-page-fade-in-up { 
6984  0% { opacity: 0; transform: translateY(10px); }
6985  100% { opacity: 1; transform: translateY(0px); }
6986}
6987.inking-page__root { width: 100%; height: 100%; background-color: rgb(0, 0, 0); display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
6988.inking-page__content { display: flex; flex-direction: column; align-items: center; gap: 28px; padding: 0px 24px; }
6989.inking-page__image-wrapper { width: 230px; height: 230px; flex-shrink: 0; }
6990.inking-page__ring-svg { width: 100%; height: 100%; display: block; }
6991.inking-page__ring-track { fill: none; stroke: rgba(255, 255, 255, 0.08); stroke-width: 4; }
6992.inking-page__ring-progress { fill: none; stroke: rgb(217, 70, 239); stroke-width: 4; stroke-linecap: round; animation: 20s linear 0s 1 normal forwards running inking-page-ring-fill; }
6993.inking-page__caption { font-family: Bangers, cursive; font-size: clamp(14px, 3.5vw, 20px); letter-spacing: 0.1em; color: rgb(255, 255, 255); text-align: center; text-transform: uppercase; line-height: 1.3; max-width: 300px; animation: 0.35s ease-out 0s 1 normal none running inking-page-fade-in-up; user-select: none; pointer-events: none; }
6994@media (max-width: 480px) {
6995  .inking-page__caption { max-width: 300px; font-size: clamp(12px, 3vw, 16px); }
6996}
6997.inking-page__subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; color: rgba(255, 255, 255, 0.6); text-align: center; line-height: 1.5; max-width: 380px; margin: 0px; user-select: none; }
6998.inking-page__cta-button { margin-top: var(--spacings-s8); display: inline-flex; align-items: center; justify-content: center; padding: var(--spacings-s12) var(--spacings-s32); height: 48px; border-radius: 24px; background: rgb(217, 70, 239); color: rgb(0, 0, 0); font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; transition: background-color 0.12s, transform 0.05s; }
6999.inking-page__cta-button:hover { background: rgb(232, 121, 249); }
7000.inking-page__cta-button:active { transform: scale(0.98); }
7001@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
7002@layer ds-atoms {
7003  .video { display: block; }
7004}
7005.app-promo-card { background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r16); border: 1px solid var(--background-colors-tint-2); padding: var(--spacings-s10); display: flex; flex-direction: column; gap: var(--spacings-s6); width: clamp(260px, 26vw, 400px); flex-shrink: 0; position: fixed; z-index: 10; box-sizing: border-box; transition: opacity 1s; }
7006.app-promo-card--mobile { width: calc(-32px + 100vw); z-index: 1000; }
7007.app-promo-card--hiding { opacity: 0; pointer-events: none; }
7008.app-promo-card__close-button { position: absolute; top: var(--spacings-s8); right: var(--spacings-s8); z-index: 1; width: 28px; height: 28px; padding: 0px; display: flex; align-items: center; justify-content: center; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-circle); background-color: rgba(0, 0, 0, 0.5); cursor: pointer; transition: opacity 0.2s; }
7009.app-promo-card__close-button:hover { opacity: 0.8; }
7010.app-promo-card__close-button:active { opacity: 0.6; }
7011.app-promo-card__close-button { color: var(--absolute-white-colors-base-default); min-width: 28px; }
7012.app-promo-card__close-button .button__icon { flex-basis: 16px; width: 16px; height: 16px; }
7013.app-promo-card--mobile .app-promo-card__close-button { width: 44px; height: 44px; }
7014.app-promo-card--story { right: 100px; bottom: 110px; }
7015.app-promo-card--cover { right: 300px; bottom: 110px; }
7016.app-promo-card__video-wrapper { width: 100%; aspect-ratio: 16 / 9; background-color: rgb(0, 0, 0); border-radius: var(--corner-radius-r8); overflow: hidden; flex-shrink: 0; position: relative; }
7017.app-promo-card__video { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center top; }
7018.app-promo-card__content { display: flex; align-items: center; gap: var(--spacings-s16); }
7019.app-promo-card__icon { width: 32px; height: 32px; border-radius: var(--corner-radius-r8); flex-shrink: 0; object-fit: cover; }
7020.app-promo-card__text-wrapper { padding-top: var(--spacings-s4); flex: 1 1 0%; min-width: 0px; }
7021.app-promo-card__title { margin: 0px; font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 600; color: var(--text-colors-base); line-height: var(--typography-t3-line-height); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
7022.app-promo-card__description { margin: 0px; font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 500; color: var(--text-colors-tint-1); line-height: var(--typography-t3-line-height); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
7023.app-promo-card__try-button { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0 var(--spacings-s8); border-radius: var(--corner-radius-r4); font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 600; color: var(--text-colors-base); cursor: pointer; flex-shrink: 0; line-height: var(--typography-t3-line-height); transition: opacity 0.2s; }
7024.app-promo-card__try-button:hover { opacity: 0.8; }
7025.app-promo-card__try-button:active { opacity: 0.6; }
7026.app-promo-card--mobile.app-promo-card--story, .app-promo-card--mobile.app-promo-card--cover { right: 50%; bottom: 20px; transform: translate(50%); }
7027.app-promo-card--mobile .app-promo-card__try-button { min-height: 44px; min-width: 44px; display: flex; align-items: center; justify-content: center; }
7028.app-icon-badges__badge { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; border-radius: var(--corner-radius-r8); }
7029:root { --page-height: min(clamp(320px, calc(100vh - 134px) , 960px), calc((100vw - 64px)*.75) ); --page-width: calc(var(--page-height) * .666); }
7030@media (min-width: 1400px) {
7031  :root { --page-height: min(clamp(480px, calc(100vh - 134px) , 1080px), calc((100vw - 64px)*.75) ); }
7032}
7033@media (min-width: 769px) and (max-width: 1399px) {
7034  :root { --page-height: min(clamp(360px, calc(100vh - 134px) , 900px), calc((100vw - 64px)*.75) ); }
7035}
7036@media (max-width: 768px) {
7037  :root { --page-height: clamp(300px, min(70vh, 120vw), 600px); --page-width: calc(var(--page-height) * .666); }
7038}
7039.book__panel-error-full-page { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: var(--spacings-s24); }
7040.book__panel-error-content { display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 400px; width: 100%; background-color: var(--background-colors-base); border-radius: 16px; padding: var(--spacings-s24); box-shadow: rgba(0, 0, 0, 0.12) 0px 4px 16px; }
7041.book__panel-error-icon-circle { display: inline-flex; align-items: center; justify-content: center; width: 72px; height: 72px;
7041 border-radius: 36px; background-color: var(--primary-colors-alpha-20); margin-bottom: var(--spacings-s24); }
7042.book__panel-error-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; line-height: var(--typography-t5-line-height); color: var(--text-colors-base); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s12); }
7043.book__panel-error-subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s24); }
7044.book__panel-error-retry-btn { min-width: 200px; }
7045@media (max-width: 768px) {
7046  .book__panel-error-retry-btn { width: 100%; }
7047}
7048.book__panel-missing-outer { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; background: linear-gradient(to right bottom, rgb(31, 41, 55), rgb(17, 24, 39)); color: rgb(156, 163, 175); padding: var(--spacings-s16); }
7049.book__panel-missing-icon { font-size: 48px; opacity: 0.5; margin-bottom: var(--spacings-s8); }
7050@media (min-width: 640px) {
7051  .book__panel-missing-icon { font-size: 60px; }
7052}
7053@media (min-width: 768px) {
7054  .book__panel-missing-icon { font-size: 72px; }
7055}
7056.book__panel-missing-label { font-family: Bangers, cursive; font-size: var(--typography-t3-font-size); text-transform: uppercase; letter-spacing: 0.05em; text-align: center; margin-bottom: var(--spacings-s4); }
7057@media (min-width: 640px) {
7058  .book__panel-missing-label { font-size: var(--typography-t4-font-size); }
7059}
7060.book__panel-missing-page-label { font-size: 10px; opacity: 0.5; }
7061@media (min-width: 640px) {
7062  .book__panel-missing-page-label { font-size: var(--typography-t3-font-size); }
7063}
7064.book__panel-missing-retry-btn { margin-top: var(--spacings-s8); padding: 6px 12px; background-color: var(--information-colors-base-default); color: rgb(255, 255, 255); font-size: 10px; font-family: Bangers, cursive; border-radius: var(--corner-radius-r4); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; transition: background-color 0.15s; }
7065.book__panel-missing-retry-btn:hover { background-color: var(--information-colors-base-action); }
7066.book__panel-missing-retry-btn:active { transform: scale(0.95); }
7067@media (min-width: 640px) {
7068  .book__panel-missing-retry-btn { margin-top: var(--spacings-s12); padding: 6px 16px; font-size: var(--typography-t3-font-size); }
7069}
7070.book__cover-action-area { position: absolute; bottom: 5rem; left: 0px; right: 0px; display: flex; justify-content: center; z-index: 20; }
7071.book__back-cover-action-area { position: absolute; bottom: 6rem; left: 0px; right: 0px; display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s16); z-index: 20; }
7072.book__back-cover-download-btn { font-family: Bangers, cursive; letter-spacing: 1.5px; border: 3px solid black; box-shadow: rgb(0, 0, 0) 5px 5px; transition: 0.1s; text-transform: uppercase; cursor: pointer; background-color: var(--information-colors-base-default); color: rgb(255, 255, 255); padding: var(--spacings-s12) var(--spacings-s32); font-size: 1.25rem; font-weight: 700; height: auto; border-radius: 0px; line-height: normal; }
7073.book__back-cover-download-btn:hover { transform: scale(1.05); box-shadow: rgb(0, 0, 0) 7px 7px; }
7074.book__back-cover-download-btn:active { transform: scale(0.95); box-shadow: rgb(0, 0, 0) 2px 2px; }
7075.book__back-cover-new-anthology-btn { font-family: Bangers, cursive; letter-spacing: 1.5px; border: 3px solid black; box-shadow: rgb(0, 0, 0) 5px 5px; transition: 0.1s; text-transform: uppercase; cursor: pointer; background-color: var(--success-colors-base-default); color: rgb(255, 255, 255); padding: var(--spacings-s16) var(--spacings-s32); font-size: 1.5rem; font-weight: 700; height: auto; border-radius: 0px; line-height: normal; }
7076.book__back-cover-new-anthology-btn:hover { transform: scale(1.05); box-shadow: rgb(0, 0, 0) 7px 7px; }
7077.book__back-cover-new-anthology-btn:active { transform: scale(0.95); box-shadow: rgb(0, 0, 0) 2px 2px; }
7078.book__panel-empty { width: 100%; height: 100%; background-color: var(--background-colors-tint-3); }
7079.book__desktop-book-container { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; }
7080.book__desktop-top-row { display: flex; flex-direction: row; align-items: center; justify-content: space-between; flex-shrink: 0; padding: 8px 20px; gap: 20px; width: calc(var(--page-width) * 2); }
7081.book__desktop-top-left { display: flex; align-items: center; flex: 1 1 0%; }
7082.book__desktop-top-right { display: flex; align-items: center; gap: 12px; flex: 1 1 0%; justify-content: flex-end; }
7083.book__book-center { flex: 1 1 0%; display: flex; justify-content: center; align-items: center; perspective: 3500px; min-height: 0px; }
7084.book__book-hidden { transform: translateZ(-600px) translateY(-100px) rotateX(20deg) scale(0.9); filter: blur(6px) brightness(0.7); pointer-events: none; }
7085.book__book { position: relative; width: var(--page-width); height: var(--page-height); transform-style: preserve-3d; transition: transform 0.5s, filter 0.5s; }
7086.book__book-opened { transform: translate(calc(var(--page-width) / 2)); }
7087.book__book-blank-right::after { content: ""; position: absolute; inset: 0px; border: 1px solid var(--background-colors-border); pointer-events: none; }
7088.book__paper { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; transform-origin: left center; transform-style: preserve-3d; transition: transform 0.8s cubic-bezier(0.645, 0.045, 0.355, 1); cursor: pointer; }
7089.book__paper-flipped { transform: rotateY(-180deg); }
7090.book__front { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; overflow: hidden; background-color: rgb(10, 10, 10); transform-style: preserve-3d; padding-left: 6px; box-shadow: rgba(0, 0, 0, 0.6) 25px 0px 40px -20px inset; border: 1px solid var(--background-colors-border); }
7091.book__back { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; overflow: hidden; background-color: rgb(10, 10, 10); transform-style: preserve-3d; transform: rotateY(180deg); padding-right: 6px; box-shadow: rgba(0, 0, 0, 0.6) -25px 0px 40px -20px inset; border: 1px solid var(--background-colors-border); }
7092.book__panel-container { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: var(--background-colors-base); box-sizing: border-box; position: relative; }
7093.book__panel-image { width: 100%; height: 100%; object-fit: contain; display: block; pointer-events: none; background-color: var(--background-colors-base); }
7094.book__panel-container-full-bleed { padding: 0px !important; background-color: rgb(10, 10, 10) !important; }
7095.book__panel-image-full-bleed { object-fit: cover !important; }
7096.book__paper-first { box-shadow: rgba(0, 0, 0, 0.8) 1px 1px 1px; }
7097.book__paper-first-front { box-sizing: border-box; padding-left: 14px; box-shadow: none; }
7098.book__paper-first-front::before { content: ""; position: absolute; left: 0px; top: 0px; bottom: 0px; width: 14px; background: linear-gradient(to right, rgb(10, 10, 10), rgb(51, 51, 51) 20%, rgb(102, 102, 102) 30%, rgb(51, 51, 51) 50%, rgb(10, 10, 10)); border-right: 1px solid rgb(0, 0, 0); z-index: 25; box-shadow: rgba(0, 0, 0, 0.5) 2px 0px 5px; }
7099.book__paper-first-front::after { content: ""; position: absolute; left: 14px; top: 0px; bottom: 0px; width: 4px; background: linear-gradient(to right, rgba(0, 0, 0, 0.7), transparent); z-index: 25; }
7100.book__paper-first-front-panel-container { padding: 0px !important; background-color: rgb(10, 10, 10) !important; }
7101.book__paper-first-front-panel-image { background-color: rgb(10, 10, 10); object-fit: cover !important; width: 100% !important; height: 100% !important; }
7102.book__more-options-btn { position: absolute; top: 8px; right: 8px; z-index: 20; width: 32px; height: 32px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0px; background-color: rgba(0, 0, 0, 0.5); opacity: 0; transition: background-color 0.12s, opacity 0.15s; }
7103.book__panel-container:hover .book__more-options-btn, .group:hover .book__more-options-btn { opacity: 1; }
7104@media (max-width: 768px) {
7105  .book__more-options-btn { opacity: 1; }
7106}
7107.book__more-options-btn:hover { background-color: rgba(0, 0, 0, 0.7); }
7108.book__page-action-overlay { position: absolute; top: 4px; right: 6px; display: flex; flex-direction: row; gap: 4px; z-index: 20; opacity: 0; transition: opacity 0.15s; }
7109.book__panel-container:hover .book__page-action-overlay, .group:hover .book__page-action-overlay { opacity: 1; }
7110.book__page-action-overlay-btn { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 6px; background-color: var(--background-colors-base); transition: background-color 0.12s; }
7111.book__page-action-overlay-btn:hover { background-color: var(--background-colors-tint-3); }
7112.book__page-action-overlay-btn { color: var(--negative-colors-base-default); }
7113.book__page-action-overlay-btn-labeled { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; display: inline-flex; align-items: center; gap: var(--spacings-s8); padding: var(--spacings-s2) var(--spacings-s8); background-color: var(--background-colors-base); color: var(--text-colors-base); font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; white-space: nowrap; transition: background-color 0.12s; }
7114.book__page-action-overlay-btn-labeled:hover { background-color: var(--background-colors-tint-3); }
7115.book__page-menu-root { position: relative; display: inline-flex; }
7116.book__page-menu-dropdown { position: absolute; top: calc(100% + 4px); right: 0px; min-width: 184px; background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r12); box-shadow: rgba(0, 0, 0, 0.35) 0px 8px 24px; overflow: hidden; z-index: 200; }
7117.book__page-menu-item { display: flex; align-items: center; gap: var(--spacings-s12); width: 100%; padding: var(--spacings-s12) var(--spacings-s16); font-size: var(--typography-t4-font-size); font-family: Picsart-Fonts, sans-serif; font-weight: 500; color: var(--text-colors-base); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; text-align: left; white-space: nowrap; transition: background-color 0.12s; }
7118.book__page-menu-item:hover { background-color: var(--background-colors-tint-2); }
7119.book__more-options-btn:disabled, .book__page-action-overlay-btn:disabled, .book__page-action-overlay-btn-labeled:disabled, .book__page-menu-item:disabled { opacity: 0.4;
7119 cursor: not-allowed; }
7120.book__desktop-book-with-actions { display: flex; flex-direction: column; align-items: center; }
7121.book__mobile-book-wrapper { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 100vw; height: 100%; padding-top: 16px; padding-right: 16px; padding-left: 16px; padding-bottom: max(16px,env(safe-area-inset-bottom,0px)); box-sizing: border-box; user-select: none; overflow: hidden; }
7122.book__mobile-page-text { font-family: Picsart-Fonts, sans-serif; color: var(--text-colors-tint-1); font-size: clamp(13px, 3.5vw, 15px); font-weight: 600; letter-spacing: 0.04em; user-select: none; white-space: nowrap; }
7123.book__mobile-page-text-total { color: var(--texts-tint-2); font-size: clamp(11px, 3vw, 13px); font-weight: 400; }
7124.book__mobile-flip-scene { position: relative; margin: auto; width: 100%; max-width: 450px; aspect-ratio: 2 / 3; perspective: 2000px; touch-action: manipulation; }
7125@media (min-width: 480px) and (max-width: 768px) {
7126  .book__mobile-flip-scene { max-width: 400px; }
7127}
7128.book__mobile-page { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: var(--background-colors-base); border-radius: 4px; overflow: hidden; box-shadow: 0 15px 40px #0006,0 0 0 1px var(--background-colors-border); backface-visibility: hidden; }
7129.book__mobile-page .book__panel-container { border-radius: 0px; }
7130.book__mobile-page-front { z-index: 2; transform-style: preserve-3d; cursor: pointer; }
7131.book__mobile-page-front::before { content: ""; position: absolute; inset: 0px; pointer-events: none; z-index: 10; }
7132.book__mobile-page-back { z-index: 1; }
7133.book__flip-forward { animation: 0.6s cubic-bezier(0.645, 0.045, 0.355, 1) 0s 1 normal forwards running book-flip-forward; }
7134.book__flip-backward { animation: 0.6s cubic-bezier(0.645, 0.045, 0.355, 1) 0s 1 normal forwards running book-flip-backward; }
7135.book__flip-forward::after, .book__flip-backward::after { content: ""; position: absolute; inset: 0px; background: linear-gradient(to right, rgba(0, 0, 0, 0.2), transparent 30%); pointer-events: none; }
7136.book__mobile-bottom-nav { display: flex; flex-direction: column; width: 100%; padding: 0px 0px 4px; align-items: center; gap: var(--spacings-s8); }
7137.book__mobile-nav-center { display: flex; align-items: center; justify-content: center; gap: var(--spacings-s8); }
7138.book__mobile-nav-right { display: flex; width: 100%; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--spacings-s8); }
7139.book__mobile-nav-button { flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background-color: var(--background-colors-tint-1); border-radius: 50%; width: 36px; height: 36px; padding: 0px; color: var(--texts-tint-1); cursor: pointer; transition: 0.15s; user-select: none; -webkit-tap-highlight-color: transparent; }
7140.book__mobile-nav-button:active:not(:disabled) { color: var(--texts-base); transform: scale(0.85); }
7141.book__mobile-nav-button:disabled { opacity: 0.3; cursor: default; pointer-events: none; }
7142.book__mobile-generate-inline { flex-shrink: 0; }
7143.book__play-round-btn, .book__play-round-btn:hover, .book__play-round-btn:active { border-radius: 50% !important; min-width: 36px !important; width: 36px !important; height: 36px !important; padding: 0px !important; }
7144.book__teaser-panel { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--spacings-s12); padding: var(--spacings-s24); box-sizing: border-box; background-color: var(--background-colors-base); text-align: center; }
7145.book__teaser-title { font-family: Bangers, cursive; font-size: clamp(18px, 3.5vw, 28px); letter-spacing: 0.04em; color: var(--text-colors-base); margin: 0px; line-height: 1.15; }
7146.book__teaser-subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-1); margin: 0px; }
7147.book__video-play-badge { position: absolute; bottom: var(--spacings-s8); right: var(--spacings-s8); display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--primary-colors-base-default); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; padding: 0px; z-index: 10; transition: background-color 0.12s; }
7148.book__video-play-badge:hover { background: var(--primary-colors-base-action); }
7149@keyframes book-start-reading-bounce { 
7150  0%, 100% { transform: translateY(0px); }
7151  50% { transform: translateY(-6px); }
7152}
7153@keyframes book-flip-forward { 
7154  0% { transform: rotateY(0deg); transform-origin: left center; }
7155  100% { transform: rotateY(-180deg); transform-origin: left center; box-shadow: -10px 10px 30px #0000004d,0 0 0 1px var(--primary-colors-base-default); }
7156}
7157@keyframes book-flip-backward { 
7158  0% { transform: rotateY(0deg); transform-origin: right center; }
7159  100% { transform: rotateY(180deg); transform-origin: right center; }
7160}
7161.layout__body--detail-preset .book__front, .layout__body--detail-preset .book__back { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; padding-bottom: var(--spacings-s6); }
7162.layout__body--detail-preset .book__book-blank-right::after { border-top-width: medium; border-top-style: none; border-top-color: currentcolor; }
7163.page-options-sheet__sheet-header { display: flex; justify-content: space-between; align-items: center; width: 100%; }
7164.page-options-sheet__sheet-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; line-height: var(--typography-t5-line-height); color: var(--text-colors-base); margin: 0px; }
7165.page-options-sheet__options-list { display: flex; flex-direction: column; gap: var(--spacings-s4); padding: var(--spacings-s8) 0; }
7166.page-options-sheet__option-item { display: flex; align-items: center; gap: var(--spacings-s12); padding: var(--spacings-s12) var(--spacings-s16); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; width: 100%; text-align: left; transition: background-color 0.12s; }
7167.page-options-sheet__option-item:hover { background-color: var(--backgrounds-tint-1); }
7168.page-options-sheet__option-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 500; color: var(--control-colors-text-default); }
7169.page-options-sheet__confirm-content { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 48px; padding-bottom: 16px; width: 100%; }
7170.page-options-sheet__confirm-icon-circle { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 28px; background: var(--primary-colors-alpha-20); margin-bottom: var(--spacings-s12); }
7171.page-options-sheet__confirm-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; line-height: var(--typography-t5-line-height); color: var(--text-colors-base); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s8); }
7172.page-options-sheet__confirm-subtitle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s16); }
7173.page-options-sheet__confirm-actions { display: flex; flex-direction: column; gap: var(--spacings-s8); width: 100%; }
7174.design-in-sheet__sheet-header { display: flex; justify-content: space-between; align-items: center; width: 100%; }
7175.design-in-sheet__sheet-title-wrapper { display: flex; align-items: center; gap: var(--spacings-s8); }
7176.design-in-sheet__sheet-title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 700; font-style: italic; line-height: var(--typography-t5-line-height); color: var(--text-colors-base); text-transform: uppercase; margin: 0px; }
7177.design-in-sheet__content { display: flex; flex-direction: column; align-items: center; text-align: center; padding-bottom: var(--spacings-s24); width: 100%; height: 100%; }
7178.design-in-sheet__promo-image { flex: 1 1 0%; min-height: 0px; width: auto; max-width: 100%; border-radius: var(--corner-radius-r20); overflow: hidden; display: block; margin-bottom: var(--spacings-s24); }
7179.design-in-sheet__title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t6-font-size); font-weight: 700; line-height: var(--typography-t7-line-height); color: var(--text-colors-base); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s8); }
7180.design-in-sheet__description { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; line-height: var(--typography-t4-line-height); color: var(--text-colors-tint-1); margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s24); max-width: 320px; }
7181.design-in-sheet__cta { width: 100%; }
7182.mobile-book-view__mobile-book-wrapper { width: 100%; height: 100%; display: flex; flex-direction: column; background-color: var(--background-colors-base); }
7183.mobile-book-view__mobile-book-action-bar { display: flex; flex-direction: row; align-items: center; justify-content: space-between; width: 100%; min-height: 52px; flex-shrink: 0; background-color: var(--background-colors-base); box-sizing: border-box; }
7184.mobile-book-view__mobile-book-content { flex: 1 1 0%; overflow: auto; position: relative; }
7185.mobile-book-view__action-bar-left { display: flex; align-items: center; }
7186.mobile-book-view__action-bar-right { display: flex; align-items: center; gap: var(--spacings-s8); }
7187.mobile-book-view__export-round-btn, .mobile-book-view__export-round-btn:hover, .mobile-book-view__export-round-btn:active { border-radius: 50% !important; min-width: 36px !important; width: 36px !important; height: 36px !important; padding: 0px !important; }
7188.mobile-book-view__mobile-video-loading-wrapper { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: var(--spacings-s16); box-sizing: border-box; background-color: var(--background-colors-base); }
7189.mobile-book-view__mobile-video-loading-page { width: 100%; max-width: 450px; aspect-ratio: 2 / 3; background: rgb(0, 0, 0); overflow: hidden; }
7190@media (min-width: 480px) and (max-width: 768px) {
7191  .mobile-book-view__mobile-video-loading-page { max-width: 400px; }
7192}
7193.delete-confirmation__overlay { position: fixed; inset: 0px; background-color: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; z-index: 9999; animation: 0.18s ease-out 0s 1 normal none running delete-confirmation-fade-in; }
7194.delete-confirmation__modal { position: relative; border-radius: var(--corner-radius-r16); padding: var(--spacings-s16); width: 320px; display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s16); background-color: var(--background-colors-base); }
7195.delete-confirmation__icon-wrap { width: 48px; height: 48px; border-radius: 50%; background-color: var(--primary-colors-alpha-20); display: flex; align-items: center; justify-content: center; }
7196.delete-confirmation__title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); line-height: 1.3; font-weight: 700; color: var(--text-colors-base); margin: 0px; text-align: center; }
7197.delete-confirmation__text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); color: var(--text-colors-tint-1); margin: 0px; line-height: 1.5; text-align: center; }
7198.delete-confirmation__actions { display: flex; flex-direction: column; gap: var(--spacings-s8); width: 100%; }
7199@keyframes delete-confirmation-fade-in { 
7200  0% { opacity: 0; }
7201  100% { opacity: 1; }
7202}
7203@keyframes delete-confirmation-pop-in { 
7204  0% { transform: scale(0.92); opacity: 0; }
7205  100% { transform: scale(1); opacity: 1; }
7206}
7207@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
7208@layer ds-molecules {
7209  .popup { padding: var(--spacings-s24); position: relative; }
7210  @media screen and (max-width: 479px) {
7211  .popup { padding: var(--spacings-s16); }
7212}
7213  @media screen and (min-width: 480px) and (max-width: 767px) {
7214  .popup { padding: var(--spacings-s16); }
7215}
7216  .popup__holder { padding: var(--spacings-s24); position: relative; background-color: var(--background-colors-base); box-shadow: var(--shadows-tint-1); border-radius: var(--corner-radius-r16); border: 1px solid var(--background-colors-tint-3); }
7217  .popup__content--with-background-effect { background: var(--effects-vignette); }
7218  .popup__close-button { --dir-position: calc(-1 * var(--spacings-s16)); position: absolute; inset-block-start: var(--dir-position); inset-inline: auto var(--dir-position); }
7219  .popup__overlay-visible { opacity: 1; transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1); }
7220  .popup__overlay-hidden { opacity: 0; transition: opacity 0.2s cubic-bezier(0.4, 0, 1, 1); }
7221  .popup__holder--with-glassy-effect { background-color: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
7222  .popup__glass { position: relative; overflow: hidden; background-color: var(--effects-glassy-tint); border: 1px solid var(--effects-glassy-highlight-border); box-shadow: var(--effects-glassy-shadow),var(--effects-glassy-inner-shadow); backdrop-filter: var(--effects-glassy-backdrop); border-block-start: 0px; border-inline-start: 0px; }
7223  .popup__glass::before, .popup__glass::after { content: ""; position: absolute; pointer-events: none; }
7224  .popup__glass::before { inset-block-start: 0px; inset-inline: 10%; height: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-top); }
7225  .popup__glass::after { inset-block: 0px; inset-inline-start: 0px; width: var(--effects-glassy-border-width); background: var(--effects-glassy-edge-side); }
7226  .popup__glass { position: absolute; inset: 0px; z-index: -1; border-radius: inherit; pointer-events: none; }
7227}
7228@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
7229@layer ds-atoms {
7230  html.scroll-frozen { height: 100%; overflow: hidden; }
7231  .overlay { position: relative; inset: 0px; width: 100%; height: 100%; overflow: auto; z-index: var(--overlay-z-index); background-color: var(--background-colors-transparent); }
7232  @media (pointer: fine) {
7233  .overlay::-webkit-scrollbar { width: 4px; }
7234  .overlay::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
7235  .overlay::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
7236  .overlay::-webkit-scrollbar-corner { background: transparent; }
7237}
7238  @supports (-moz-appearance: none) {
7239  .overlay { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
7240}
7241  @media (pointer: coarse) {
7242  .overlay::-webkit-scrollbar { display: none; }
7243}
7244  .overlay--hide-scrollbars { scrollbar-width: none; }
7245  .overlay--hide-scrollbars::-webkit-scrollbar { display: none; }
7246  .overlay--global { position: fixed; }
7247  .overlay--local { position: absolute; }
7248  .overlay--blurred { backdrop-filter: var(--effects-blurred); }
7249  .overlay__table { display: table; table-layout: fixed; width: 100%; min-height: 100%; }
7250  .overlay__row { display: table-row; }
7251  .overlay__cell { display: table-cell; }
7252  .overlay__cell--v-top { vertical-align: top; }
7253  .overlay__cell--v-middle { vertical-align: middle; }
7254  .overlay__cell--v-bottom { vertical-align: bottom; }
7255  .overlay__cell--h-left { text-align: left; }
7256  .overlay__cell--h-center { text-align: center; }
7257  .overlay__cell--h-right { text-align: right; }
7258  .overlay__content { display: inline-block; max-width: 100%; text-align: initial; }
7259  .overlay__content--v-top { vertical-align: top; }
7260  .overlay__content--v-middle { vertical-align: middle; }
7261  .overlay__content--v-bottom { vertical-align: bottom; }
7262  .overlay__content--full-width { width: 100%; }
7263  .overlay__content--fit-width { width: fit-content; margin: auto; }
7264}
7265.explore
7265-tab__format-row { padding-right: ; padding-bottom: ; padding-left: ; max-width: 1360px; width: 100%; box-sizing: border-box; margin: 0px auto; padding-top: 41px; display: flex; flex-direction: row; gap: var(--spacings-s12); }
7266.explore-tab__format-card { position: relative; flex: 1 1 0px; min-width: 0px; aspect-ratio: 200 / 290; padding: 0px; margin: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r24); background-color: var(--background-colors-base); color: var(--text-colors-base); cursor: pointer; overflow: hidden; transition: transform 0.2s, background-color 0.2s, color 0.2s; }
7267.explore-tab__format-card::before { content: ""; position: absolute; inset: 0px; pointer-events: none; opacity: 0; background: radial-gradient(80% 90% at 50% -12%, rgb(73, 73, 73) 0%, transparent 100%); transition: opacity 0.2s; }
7268.explore-tab__format-card::after { content: ""; position: absolute; inset: 0px; pointer-events: none; border-radius: inherit; border: 1px solid color-mix(in srgb,var(--negative-colors-base-default) 20%,transparent); transition: border-color 0.2s; }
7269.explore-tab__format-card--active { background-color: rgb(0, 0, 0); }
7270.explore-tab__format-card--active::before { opacity: 1; }
7271.explore-tab__format-card--active::after { border-color: var(--primary-colors-base-default); }
7272.explore-tab__format-card--inactive:hover { transform: translateY(-6px); }
7273.explore-tab__format-card-title { position: absolute; top: var(--spacings-s24); left: 0px; right: 0px; font-family: Bangers, cursive; font-weight: 400; font-size: 24px; line-height: 1; letter-spacing: 0.5px; text-transform: uppercase; text-align: center; color: var(--text-colors-base); text-shadow: rgba(0, 0, 0, 0.3) 0px 2px 4px; white-space: nowrap; }
7274.explore-tab__format-card-credits { position: absolute; top: 60px; left: 0px; right: 0px; display: flex; align-items: center; justify-content: center; gap: var(--spacings-s4); }
7275.explore-tab__format-card-image-wrap { position: absolute; inset: 96px 8% var(--spacings-s16); display: flex; align-items: flex-end; justify-content: center; pointer-events: none; }
7276.explore-tab__format-card-image { object-fit: contain; max-width: min(100%, 250px); max-height: 100%; display: block; }
7277.explore-tab--mobile .explore-tab__format-row { padding-top: 17px; max-width: none; width: calc(100% + var(--spacings-s16) * 2); margin-inline: calc(var(--spacings-s16) * -1); padding-inline: var(--spacings-s16); overflow-x: auto; scrollbar-width: none; }
7278.explore-tab--mobile .explore-tab__format-row::-webkit-scrollbar { display: none; }
7279.explore-tab--mobile .explore-tab__format-card { flex: 0 0 160px; }
7280.explore-tab--mobile .explore-tab__format-card--inactive:hover { transform: none; }
7281.explore-tab__values { padding-right: ; padding-bottom: ; padding-left: ; max-width: 1360px; width: 100%; box-sizing: border-box; margin: 0px auto; padding-top: var(--spacings-s72); display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s24); }
7282.explore-tab__values-heading { font-family: Bangers, cursive; font-weight: 400; font-size: 42px; line-height: 48px; letter-spacing: 0.5px; text-transform: uppercase; text-align: center; color: var(--text-colors-base); margin: 0px; }
7283.explore-tab__values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--spacings-s16); width: 100%; }
7284.explore-tab__value-card { position: relative; display: flex; flex-direction: column; height: 100%; background-color: var(--background-colors-base); color: var(--text-colors-base); border-radius: var(--corner-radius-r24); overflow: hidden; transition: transform 0.2s; }
7285.explore-tab__value-card::after { content: ""; position: absolute; inset: 0px; border-radius: inherit; border: 1px solid color-mix(in srgb,var(--negative-colors-base-default) 20%,transparent); pointer-events: none; }
7286.explore-tab__value-card:hover { transform: translateY(-6px); }
7287.explore-tab__value-card-media { position: relative; width: 100%; aspect-ratio: 344 / 235; background-color: var(--background-colors-tint-3); flex-shrink: 0; overflow: hidden; }
7288.explore-tab__value-card-image { width: 100%; height: 100%; object-fit: cover; display: block; }
7289.explore-tab__value-card-content { display: flex; flex-direction: column; flex: 1 1 0%; gap: var(--spacings-s12); padding: 21px var(--spacings-s24) var(--spacings-s24); }
7290.explore-tab__value-card-heading { display: flex; align-items: center; gap: var(--spacings-s12); }
7291.explore-tab__value-card-number { width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background-color: var(--text-colors-base); color: var(--background-colors-base); display: flex; align-items: center; justify-content: center; font-family: Bangers, cursive; font-weight: 400; font-size: 20px; line-height: 20px; letter-spacing: 0.5px; }
7292.explore-tab__value-card-title { font-family: Bangers, cursive; font-weight: 400; font-size: 20px; line-height: 24px; letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-colors-base); margin: 0px; }
7293.explore-tab__value-card-body { margin: 0px; }
7294.explore-tab--mobile .explore-tab__values { padding-top: var(--spacings-s56); gap: var(--spacings-s16); }
7295.explore-tab--mobile .explore-tab__values-heading { font-size: 36px; line-height: 42px; }
7296.explore-tab--mobile .explore-tab__values-grid { grid-template-columns: 1fr; }
7297.explore-tab__story-formats { padding-right: ; padding-bottom: ; padding-left: ; max-width: 1360px; width: 100%; box-sizing: border-box; margin: 0px auto; padding-top: var(--spacings-s72); display: flex; flex-direction: column; gap: var(--spacings-s24); }
7298.explore-tab__story-formats-heading-block { display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s10); text-align: center; }
7299.explore-tab__story-formats-heading { font-family: Bangers, cursive; font-weight: 400; font-size: 42px; line-height: 48px; letter-spacing: 0.5px; text-transform: uppercase; text-align: center; color: var(--text-colors-base); margin: 0px; }
7300.explore-tab__story-formats-subtitle { max-width: 560px; margin: 0px; }
7301.explore-tab__story-formats-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: var(--spacings-s16); width: 100%; }
7302.explore-tab__story-format-card { position: relative; display: flex; flex-direction: column; background-color: var(--background-colors-base); color: var(--text-colors-base); border-radius: var(--corner-radius-r24); overflow: hidden; transition: transform 0.2s; }
7303.explore-tab__story-format-card::after { content: ""; position: absolute; inset: 0px; border-radius: inherit; border: 1px solid color-mix(in srgb,var(--negative-colors-base-default) 20%,transparent); pointer-events: none; }
7304.explore-tab__story-format-card:hover { transform: translateY(-6px); }
7305.explore-tab__story-format-card-image { width: 100%; aspect-ratio: 524 / 294; object-fit: cover; display: block; flex-shrink: 0; }
7306.explore-tab__story-format-card-content { display: flex; flex-direction: column; flex: 1 1 0%; gap: var(--spacings-s12); padding: var(--spacings-s24); }
7307.explore-tab__story-format-card-heading { display: flex; align-items: center; gap: var(--spacings-s10); }
7308.explore-tab__story-format-card-badge { width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background-color: var(--text-colors-base); color: var(--background-colors-base); display: flex; align-items: center; justify-content: center; }
7309.explore-tab__story-format-card-title { font-family: Bangers, cursive; font-weight: 400; font-size: 20px; line-height: 24px; letter-spacing: 0.5px; text-transform: uppercase; color: var(--text-colors-base); margin: 0px; }
7310.explore-tab__story-format-card-body { flex: 1 1 0%; margin: 0px; }
7311.explore-tab__story-format-card-actions { display: flex; flex-wrap: wrap; gap: var(--spacings-s10); }
7312.explore-tab--mobile .explore-tab__story-formats { padding-top: var(--spacings-s56); gap: var(--spacings-s16); }
7313.explore-tab--mobile .explore-tab__story-formats-heading { font-size: 36px; line-height: 42px; }
7314.explore-tab--mobile .explore-tab__story-formats-grid { grid-template-columns: minmax(0px, 1fr); }
7315.explore-tab__templates { padding-right: ; padding-bottom: ; padding-left: ; max-width: 1360px; width: 100%; box-sizing: border-box; margin: 0px auto; padding-top: var(--spacings-s72); display: flex; flex-direction: column; gap: var(--spacings-s32); }
7316.explore-tab__templates-heading-block { display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s10); text-align: center; }
7317.explore-tab__templates-heading { font-family: Bangers, cursive; font-weight: 400; font-size: 42px; line-height: 48px; letter-spacing: 0.5px; text-transform: uppercase; text-align: center; color: var(--text-colors-base); margin: 0px; }
7318.explore-tab__templates-subtitle { max-width: 560px; margin: 0px; }
7319.explore-tab__templates-body { display: flex; flex-direction: column; gap: var(--spacings-s16); }
7320.explore-tab__templates-controls { display: flex; align-items: center; justify-content: space-between; gap: var(--spacings-s6); min-width: 0px; }
7321.explore-tab__templates-filter-cluster { display: flex; align-items: center; gap: var(--spacings-s6); min-width: 0px; }
7322.explore-tab__templates-filter-cluster > .filter-menu { flex-shrink: 0; }
7323.explore-tab__templates-chip-row { display: flex; align-items: center; gap: var(--spacings-s6); min-width: 0px; overflow-x: auto; scrollbar-width: none; }
7324.explore-tab__templates-chip-row::-webkit-scrollbar { display: none; }
7325.explore-tab__templates-chip-row > * { flex-shrink: 0; }
7326.explore-tab__template-grid { display: flex; flex-direction: row; gap: var(--spacings-s16); min-width: 0px; overflow-x: auto; scrollbar-width: none; }
7327.explore-tab__template-grid::-webkit-scrollbar { display: none; }
7328.explore-tab__template-grid > * { flex-shrink: 0; }
7329.explore-tab__template-card { position: relative; width: 200px; height: 300px; flex-shrink: 0; border-radius: var(--corner-radius-r12); background-color: var(--background-colors-tint-3); overflow: hidden; }
7330.explore-tab__template-card--clickable { cursor: pointer; }
7331.explore-tab__template-card-hit { position: absolute; inset: 0px; }
7332.explore-tab__template-card-img { width: 100%; height: 100%; object-fit: cover; display: block; }
7333.explore-tab__template-card-overlay { position: absolute; inset: 0px; background-color: var(--background-colors-transparent); display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--timings-default) var(--easings-ease),visibility var(--timings-default) var(--easings-ease); }
7334.explore-tab__template-card-overlay > * { pointer-events: auto; }
7335.explore-tab__template-card:hover .explore-tab__template-card-overlay, .explore-tab__template-card:focus-within .explore-tab__template-card-overlay { opacity: 1; visibility: visible; }
7336.explore-tab--mobile .explore-tab__templates { padding-top: var(--spacings-s56); gap: var(--spacings-s16); }
7337.explore-tab--mobile .explore-tab__templates-heading { font-size: 36px; line-height: 42px; }
7338.explore-tab--mobile .explore-tab__template-grid { gap: var(--spacings-s12); }
7339.explore-tab--mobile .explore-tab__template-card { width: 140px; height: 210px; }
7340@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
7341@layer ds-atoms {
7342  .list { display: grid; list-style-type: none; }
7343  .list-item { min-width: 0px; min-height: 0px; }
7344}
7345.explore-tab__faq { padding-right: ; padding-left: ; max-width: 1360px; width: 100%; box-sizing: border-box; margin: 0px auto; padding-top: var(--spacings-s32); padding-bottom: var(--spacings-s32); display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s16); }
7346.explore-tab__faq-title { font-family: Bangers, cursive; font-weight: 400; font-size: 42px; line-height: 48px; letter-spacing: 0.5px; text-transform: uppercase; text-align: center; color: var(--text-colors-base); margin: 0px; }
7347.explore-tab__faq-list { width: 100%; margin: 0px; padding: 0px; }
7348.explore-tab__faq-item { background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r12); padding: var(--spacings-s16); }
7349.explore-tab__faq-question { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: var(--spacings-s16); width: 100%; padding: var(--spacings-s6) 0; margin: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; cursor: pointer; text-align: left; color: var(--text-colors-base); }
7350.explore-tab__faq-chevron { display: inline-flex; flex-shrink: 0; transition: transform 0.3s cubic-bezier(0.2, 0, 0.2, 1); }
7351.explore-tab__faq-chevron--open { transform: rotate(180deg); }
7352.explore-tab__faq-answer-wrap { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
7353.explore-tab__faq-answer-wrap--open { grid-template-rows: 1fr; }
7354.explore-tab__faq-answer-inner { overflow: hidden; min-height: 0px; }
7355.explore-tab__faq-answer { margin: 0px; padding-top: var(--spacings-s16); }
7356.explore-tab--mobile .explore-tab__faq { padding-top: var(--spacings-s48); }
7357.explore-tab--mobile .explore-tab__faq-title { font-size: 36px; line-height: 42px; }
7358.explore-tab { width: 100%; height: 100%; overflow: hidden auto; box-sizing: border-box; background-color: var(--background-colors-base); padding-bottom: var(--spacings-s64); }
7359@media (pointer: fine) {
7360  .explore-tab::-webkit-scrollbar { width: 4px; height: 4px; }
7361  .explore-tab::-webkit-scrollbar-track { border-radius: var(--corner-radius-r4); background-color: transparent; }
7362  .explore-tab::-webkit-scrollbar-thumb { border-radius: var(--corner-radius-r4); background-color: var(--background-colors-border); }
7363  .explore-tab::-webkit-scrollbar-corner { background: transparent; }
7364}
7365@supports (-moz-appearance: none) {
7366  .explore-tab { scrollbar-color: var(--background-colors-border) transparent; scrollbar-width: thin; }
7367}
7368@media (pointer: coarse) {
7369  .explore-tab::-webkit-scrollbar { display: none; }
7370}
7371.explore-tab__hero { padding: var(--spacings-s24) 0 0; max-width: 1360px; width: 100%; box-sizing: border-box; margin: 0px auto; text-align: center; }
7372.explore-tab__hero-heading { font-family: Bangers, cursive; font-weight: 400; color: var(--text-colors-base); font-size: 48px; line-height: normal; letter-spacing: 2px; text-transform: uppercase; margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s12); }
7373.explore-tab__hero-highlight { color: var(--primary-colors-base-default); font-family: Bangers, cursive; font-size: inherit; line-height: normal; }
7374.explore-tab__hero-description { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 500; line-height: var(--typography-t5-line-height); color: var(--text-colors-tint-1); margin: 0px auto; max-width: 620px; }
7375.explore-tab--mobile { padding-top: var(--spacings-s8); padding-bottom: var(--spacings-s32); }
7376.explore-tab--mobile .explore-tab__hero { padding-top: 0px; }
7377.explore-tab--mobile .explore-tab__hero-heading { font-size: 36px; line-height: 42px; letter-spacing: 0.5px; margin-bottom: var(--spacings-s10); }
7378.explore-tab--mobile .explore-tab__hero-description { font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
7379.create-own-tooltip { position: relative; }
7380.create-own-tooltip__card { position: absolute; bottom: calc(100% + 14px); right: 0px; width: 340px; left: calc(50% - 170px); background-color: var(--background-colors-base); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r12); overflow: visible; box-shadow: rgba(0, 0, 0, 0.45) 0px 8px 32px; animation: 0.35s ease-out 0s 1 normal none running create-own-tooltip-fade-in-up; z-index: 1100; }
7381.create-own-tooltip__card::after { content: ""; position: absolute; bottom: -8px; right: calc(50% - 8px); width: 16px; height: 16px; background-color: var(--background-colors-base); border-right: 1px solid var(--background-colors-border); border-bottom: 1px solid var(--background-colors-border); transform: rotate(45deg); border-radius: 2px; }
7382.create-own-tooltip__card-inner { border-radius: var(--corner-radius-r12); overflow: hidden; position: relative; z-index: 1; }
7383.create-own-tooltip__preview-wrapper { position:
7383 relative; margin: var(--spacings-s16); aspect-ratio: 16 / 9; border-radius: var(--corner-radius-r8); overflow: hidden; }
7384.create-own-tooltip__preview-image { width: 100%; height: 100%; object-fit: cover; display: block; }
7385.create-own-tooltip__dismiss-btn { position: absolute; top: 8px; right: 8px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; padding: 0px; line-height: 0; width: 20px; min-width: 20px; height: 20px; color: rgb(255, 45, 85); }
7386.create-own-tooltip__dismiss-btn::before { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: rgb(255, 255, 255); }
7387.create-own-tooltip__dismiss-btn svg { position: relative; }
7388.create-own-tooltip__body { padding: 0 var(--spacings-s16) var(--spacings-s16); flex-direction: column; gap: var(--spacings-s8); }
7389.create-own-tooltip__title { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 700; color: var(--texts-base); margin-top: 0px; margin-right: 0px; margin-left: 0px; line-height: 1.3; margin-bottom: var(--spacings-s4); }
7390.create-own-tooltip__description { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 500; color: var(--texts-tint-2); margin-top: 0px; margin-right: 0px; margin-left: 0px; line-height: 1.5; margin-bottom: var(--spacings-s8); }
7391.create-own-tooltip__cta-button { width: 100%; margin-top: var(--spacings-s4); }
7392@keyframes create-own-tooltip-fade-in-up { 
7393  0% { opacity: 0; transform: translateY(8px); }
7394  100% { opacity: 1; transform: translateY(0px); }
7395}
7396.desktop-book-view__book-wrapper { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; }
7397.desktop-book-view__book-wrapper--has-help-footer { padding-top: 17px; }
7398@media (min-width: 1400px) {
7399  .desktop-book-view__book-wrapper--has-help-footer { --page-height: min(clamp(480px, calc(100vh - 186px) , 1080px), calc((100vw - 64px)*.75) ); --page-width: calc(var(--page-height) * .666); }
7400}
7401@media (min-width: 769px) and (max-width: 1399px) {
7402  .desktop-book-view__book-wrapper--has-help-footer { --page-height: min(clamp(360px, calc(100vh - 186px) , 900px), calc((100vw - 64px)*.75) ); --page-width: calc(var(--page-height) * .666); }
7403}
7404.desktop-book-view__book-area { flex: 1 1 0%; width: 100%; display: flex; align-items: center; justify-content: center; min-height: 0px; position: relative; }
7405.desktop-book-view__video-inking-container { width: var(--page-width); height: var(--page-height); overflow: hidden; background: rgb(0, 0, 0); }
7406.desktop-book-view__bottom-action-bar { display: flex; align-items: center; justify-content: space-between; align-self: center; width: calc(var(--page-width) * 2); box-sizing: border-box; flex-shrink: 0; padding: var(--spacings-s16) 0; margin-top: var(--spacings-s24); }
7407.desktop-book-view__pagination-left { display: flex; align-items: center; gap: var(--spacings-s8); flex: 0 0 auto; }
7408.desktop-book-view__pagination-spacer { flex: 1 1 0%; }
7409.desktop-book-view__nav-arrow-btn { display: flex; align-items: center; justify-content: center; background-color: var(--background-colors-tint-3); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r24); padding: var(--spacings-s4); cursor: pointer; transition: background 0.15s; width: 28px; min-width: 28px; height: 28px; color: var(--text-colors-base); }
7410.desktop-book-view__nav-arrow-btn:hover:not(:disabled) { background-color: var(--background-colors-tint-2); }
7411.desktop-book-view__nav-arrow-btn:disabled { opacity: 0.3; cursor: default; pointer-events: none; }
7412.desktop-book-view__page-label { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--text-colors-tint-1); user-select: none; white-space: nowrap; letter-spacing: 0.02em; }
7413.desktop-book-view__page-label-total { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); font-weight: 500; color: var(--texts-tint-2); }
7414.desktop-book-view__button-group { display: flex; align-items: center; gap: var(--spacings-s8); flex-shrink: 0; }
7415.desktop-book-view__generate-button { flex-shrink: 0; }
7416.desktop-book-view__play-round-btn, .desktop-book-view__play-round-btn:hover, .desktop-book-view__play-round-btn:active { border-radius: 50% !important; min-width: 40px !important; width: 40px !important; height: 40px !important; padding: 0px !important; }
7417.desktop-book-view__share-tooltip { position: absolute; top: 6px; right: 12px; width: 340px; background-color: var(--background-colors-base); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r12); box-shadow: rgba(0, 0, 0, 0.45) 0px 8px 32px; padding: var(--spacings-s16); z-index: 1100; animation: 0.35s ease-out 0s 1 normal none running desktop-book-view-share-tooltip-fade-in; }
7418.desktop-book-view__share-tooltip-arrow { position: absolute; top: -6px; right: 20px; width: 10px; height: 10px; background-color: var(--background-colors-base); border-left: 1px solid var(--background-colors-border); border-top: 1px solid var(--background-colors-border); transform: rotate(45deg); border-radius: 2px; }
7419.desktop-book-view__share-tooltip-title { margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s4); }
7420.desktop-book-view__share-tooltip-description { margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: var(--spacings-s12); }
7421.desktop-book-view__share-tooltip-cta { width: 100%; }
7422@keyframes desktop-book-view-share-tooltip-fade-in { 
7423  0% { opacity: 0; transform: translateY(-8px); }
7424  100% { opacity: 1; transform: translateY(0px); }
7425}
7426@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
7427@layer ds-molecules {
7428  .tabs { display: grid; overflow: auto hidden; scroll-behavior: smooth; overscroll-behavior: contain; scrollbar-width: none; }
7429  .tabs::-webkit-scrollbar { display: none; }
7430  .tabs--large { min-height: 40px; max-height: 40px; }
7431  .tabs--large .tabs__list { height: 40px; }
7432  .tabs--small { min-height: 32px; max-height: 32px; }
7433  .tabs--small .tabs__list { height: 32px; }
7434  .tabs--not-fixed { justify-content: start; }
7435  .tabs__list { --tabs-indicator-color: var(--primary-colors-base-active); position: relative; display: flex; }
7436  .tabs__list[active-tab-hovered] { --tabs-indicator-color: var(--primary-colors-base-active-action); }
7437  .tabs__list::after { content: ""; position: absolute; bottom: var(--spacings-s0); left: var(--spacings-s0); width: var(--tabs-active-tab-width); height: 2px; transform: translate(var(--tabs-active-tab-x)); transition: all var(--timings-default) var(--easings-linear); pointer-events: none; background-color: var(--tabs-indicator-color); }
7438  .tab { display: flex; align-items: center; justify-content: center; column-gap: var(--spacings-s4); position: relative; background-color: transparent; color: var(--control-colors-text-default); height: 100%; transition-property: color; transition-timing-function: var(--easings-ease); transition-duration: var(--timings-default); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; white-space: nowrap; }
7439  .tab--large { padding: var(--spacings-s10); font-weight: 600; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); }
7440  .tab--large .tab__item { padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
7441  .tab--large .tab__icon { width: 20px; height: 20px; }
7442  .tab--small { padding: var(--spacings-s6); font-weight: 600; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); }
7443  .tab--small .tab__item { padding-block: var(--spacings-s0); padding-inline: var(--spacings-s2); }
7444  .tab--small .tab__icon { width: 20px; height: 20px; }
7445  .tab::after { content: ""; position: absolute; bottom: var(--spacings-s0); left: var(--spacings-s0); right: var(--spacings-s0); height: 2px; opacity: 0; transition: all var(--timings-default) var(--easings-linear); background-color: transparent; pointer-events: none; }
7446  .tab--not-fixed { flex: 0 0 auto; }
7447  .tab--fixed { width: 100%; }
7448  @media (hover: hover) and (pointer: fine) {
7449  .tab--interactive:hover { color: var(--control-colors-text-action); }
7450  .tab--interactive:hover::after { opacity: 1; background-color: var(--control-colors-border-action); }
7451}
7452  @media (hover: none) and (pointer: coarse) {
7453  .tab--interactive:active { color: var(--control-colors-text-action); }
7454  .tab--interactive:active::after { opacity: 1; background-color: var(--control-colors-border-action); }
7455}
7456  .tab--active { color: var(--primary-colors-base-active); }
7457  @media (hover: hover) and (pointer: fine) {
7458  .tab--active:hover { color: var(--primary-colors-base-active-action); }
7459}
7460  @media (hover: none) and (pointer: coarse) {
7461  .tab--active:active { color: var(--primary-colors-base-active-action); }
7462}
7463  .tab__icon { flex-shrink: 0; }
7464  .tab__icon path { fill: currentcolor; }
7465}
7466@keyframes powEnter { 
7467  0% { transform: scale(0) rotate(-45deg); opacity: 0; }
7468  30% { transform: scale(1.5) rotate(10deg); opacity: 1; }
7469  100% { transform: scale(1.8) rotate(0deg); opacity: 0; }
7470}
7471.desktop-content-panel { flex: 1 1 0%; min-width: 0px; overflow: hidden; display: flex; flex-direction: column; position: relative; box-sizing: border-box; background-color: var(--background-colors-base); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r24); padding: var(--spacings-s16) var(--spacings-s24); }
7472.desktop-content-panel--chromeless { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 0px; padding: 0px; }
7473.desktop-content-panel__tab-header { display: flex; flex-direction: column; background-color: var(--background-colors-base); flex-shrink: 0; }
7474.desktop-content-panel__library-tabs { width: fit-content; }
7475.desktop-content-panel__tab-content { flex: 1 1 0%; overflow: hidden; position: relative; display: flex; flex-direction: column; }
7476.desktop-content-panel__save-status { position: absolute; z-index: 400; top: var(--spacings-s16); left: var(--spacings-s16); padding: var(--spacings-s6) var(--spacings-s12); font-size: var(--typography-t3-font-size); font-family: Picsart-Fonts, sans-serif; border-radius: var(--corner-radius-r8); pointer-events: none; }
7477.desktop-content-panel__save-status--saving, .desktop-content-panel__save-status--saved { background-color: var(--background-colors-tint-2); color: var(--text-colors-tint-2); }
7478.desktop-content-panel__save-status--error { background-color: var(--background-colors-tint-2); color: var(--text-colors-base); }
7479.desktop-content-panel__save-status-content { display: flex; align-items: center; gap: var(--spacings-s6); color: currentcolor; }
7480.desktop-content-panel__save-status-content .text { color: currentcolor; }
7481.desktop-content-panel__pdf-progress { position: absolute; z-index: 400; top: var(--spacings-s16); left: var(--spacings-s16); padding: var(--spacings-s6) var(--spacings-s12); font-size: var(--typography-t3-font-size); font-family: Picsart-Fonts, sans-serif; border-radius: var(--corner-radius-r8); pointer-events: none; }
7482.desktop-content-panel__pdf-progress--normal { background-color: var(--background-colors-tint-2); color: var(--text-colors-tint-2); }
7483.desktop-content-panel__pdf-progress--error { background-color: var(--background-colors-tint-2); color: var(--text-colors-base); }
7484.desktop-content-panel__pdf-progress-content { display: flex; align-items: center; gap: var(--spacings-s6); }
7485.desktop-content-panel__transition-overlay { position: absolute; inset: 0px; z-index: 100; pointer-events: none; display: flex; align-items: center; justify-content: center; }
7486.desktop-content-panel__pow-svg { width: 500px; height: 400px; filter: drop-shadow(rgba(0, 0, 0, 0.5) 0px 10px 0px); animation: 1s ease-out 0s 1 normal forwards running powEnter; }
7487.desktop-content-panel__footer { flex-shrink: 0; display: flex; justify-content: flex-end; align-items: center; gap: var(--spacings-s4); padding: var(--spacings-s8) var(--spacings-s16); border-top: 1px solid var(--background-colors-border); }
7488.desktop-content-panel__faq-help-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); color: var(--text-colors-tint-3); }
7489.desktop-content-panel__faq-link { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); color: var(--text-colors-tint-2); text-decoration: underline; }
7490.desktop-content-panel__faq-link:hover { color: var(--text-colors-base); }
7491.desktop-content-panel__collection-wrapper { flex: 1 1 0%; overflow: hidden; background-color: var(--background-colors-base); }
7492.header-components__title-red { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 700; color: var(--primary-colors-base-default); letter-spacing: 0.01em; }
7493.header-components__title-yellow { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 700; color: var(--primary-colors-base-default); }
7494.header-components__title-golden { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--primary-colors-base-default); letter-spacing: 0.01em; }
7495.header-components__close-button { width: 32px; height: 32px; background-color: transparent; color: var(--text-colors-tint-2); font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color 0.15s, color 0.15s; }
7496.header-components__close-button-mobile { width: 36px; height: 36px; background-color: transparent; color: var(--text-colors-tint-2); font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color 0.15s, color 0.15s; }
7497.header-components__close-button .button__icon, .header-components__close-button-mobile .button__icon { flex-basis: 16px; width: 16px; height: 16px; }
7498.header-components__close-button:hover, .header-components__close-button-mobile:hover { background-color: var(--background-colors-tint-2); color: var(--text-colors-base); }
7499.header-components__close-button:active, .header-components__close-button-mobile:active { transform: scale(0.95); }
7500.apps-menu__menu { position: fixed; top: 58px; left: var(--spacings-s16); max-width: 500px; max-height: calc(-100px + 100vh); display: flex; flex-direction: column; background-color: var(--background-colors-base); border-radius: var(--corner-radius-r12); z-index: 1000; animation: 0.3s ease-out 0s 1 normal none running apps-menu-slide-in-left; border: 1px solid var(--background-colors-border); overflow-y: auto; }
7501.apps-menu__header { display: flex; align-items: center; justify-content: flex-start; padding: var(--spacings-s12) var(--spacings-s16); flex-shrink: 0; }
7502.apps-menu__section-title { font-size: var(--typography-t5-font-size); font-weight: 600; color: var(--text-colors-base); margin: 0px; }
7503.apps-menu__apps-list { display: flex; flex-direction: column; gap: 0px; }
7504.apps-menu__app-item { display: flex; align-items: center; padding: var(--spacings-s6); border-radius: var(--corner-radius-r8); background-color: transparent; cursor: pointer; transition: 0.15s; text-decoration: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
7505.apps-menu__app-item:hover { background-color: var(--background-colors-tint-1); }
7506.apps-menu__app-item:active { background-color: var(--background-colors-tint-2); }
7507.apps-menu__app-icon { width: 46px; height: 46px; border-radius: var(--corner-radius-r8); display: flex; align-items: center; justify-content: center; overflow: hidden; }
7508.apps-menu__app-info { flex: 1 1 0%; min-width: 0px; }
7509.apps-menu__app-title { font-size: var(--typography-t4-font-size); font-weight: 600; color: var(--text-colors-base); margin-bottom: var(--spacings-s2); text-align: left; }
7510.apps-menu__app-description { font-size: var(--typography-t3-font-size); font-weight: 500; color: var(--text-colors-tint-2); text-align: left; }
7511@keyframes apps-menu-slide-in-left { 
7512  0% { opacity: 0; transform: translate(-20px); }
7513  100% { opacity: 1; transform: translate(0px); }
7514}
7515.sidebar-header { padding: var(--spacings-s12) var(--spacings-s16); border-bottom: 1px solid var(--background-colors-border); display: flex; align-items: center; justify-content: space-between; background-color: var(--background-colors-base); min-height: 48px; }
7516.sidebar-header__buttons-wrapper { display: flex; align-items: center; gap: var(--spacings-s8); }
7517.mobile-header__container { display: flex; flex-direction: row; align-items: center; justify-content: space-between; width: 100%; height: max-content; padding: var(--spacings-s8) 0; background-color: var(--background-colors-base); box-sizing: border-box; flex-shrink: 0; gap: var(--spacings-s8); }
7518.mobile-header__left-section { display: flex; align-items: center; gap: var(--spacings-s8); flex-shrink: 0; }
7519.mobile-header__right-section { display: flex; align-items: center; gap: var(--spacings-s6); flex-shrink: 0; }
7520.mobile-header__branding { display: flex; align-items: center; gap: var(--spacings-s6); }
7521.mobile-header__logo-tile { width: 32px; height: 32px; border-radius: var(--corner-radius-r8); flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--primary-colors-alpha-10); color: var(--primary-colors-base-default); }
7522.mobile-header__close-button { color: var(--text-colors-tint-2); font-size: 1rem; line-height: 1; padding: var(--spacings-s6); background: none !important; border-width: medium !important; border-style: none !important; border-color: currentcolor !important; border-image: initial !important; box-shadow: none !important; }
7523.mobile-header__close-button:hover { color: var(--text-colors-base); background: none !important; }
7524.mobile-header__library-container { display: flex; flex-direction: column; width: 100%; background-color: var(--background-colors-base); flex-shrink: 0; }
7525.mobile-header__library-segments { padding: var(--spacings-s12) var(--spacings-s16) 0; }
7526.mobile-header__library-filter-row { display: flex; flex-direction: row; align-items: center; gap: var(--spacings-s6); padding-right: var(--spacings-s16); }
7527.mobile-header__library-filter-row > .filter-chips__filter-bar { flex: 1 1 0px; min-width: 0px; padding-right: 0px; }
7528.mobile-header__library-filter-row > .filter-chips__filter-bar .filter-chips__chips-row-inner { gap: var(--spacings-s6); }
7529.mobile-header__library-filter-row > .filter-menu { flex-shrink: 0; margin-top: var(--spacings-s4); }
7530@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
7531@layer ds-molecules {
7532  .avatar { display: flex; align-items: center; justify-content: center; position: relative; border-radius: 50%; flex-shrink: 0; width: var(--avatar-size); height: var(--avatar-size); background-color: var(--avatar-bg, var(--control-colors-button-background-default)); box-shadow: var(--avatar-shadow, none); border: var(--avatar-border, var(--avatar-border-width, 0px) solid var(--avatar-border-color, transparent)); cursor: var(--avatar-cursor, default); }
7533  .avatar__placeholder-icon { width: 50%; height: 50%; }
7534  .avatar__image { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
7535  .avatar__icon { display: inline-block; }
7536  .avatar__icon > path { fill: var(--control-colors-value-default); }
7537  .avatar__skeleton { position: absolute; inset: calc(-1 * var(--avatar-border-width, 0px)); border-radius: inherit; }
7538  .avatar__control { display: none; }
7539  .avatar__badge { display: flex; position: absolute; bottom: 0px; }
7540  [dir="ltr"] .avatar__badge { right: 0px; }
7541  [dir="rtl"] .avatar__badge { left: 0px; }
7542  .avatar--with-shadow { box-shadow: var(--shadows-tint-1); }
7543  .avatar--no-border { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; }
7544  .avatar--cursor-pointer { cursor: pointer; }
7545  [dir="ltr"] .avatar__badge--rectangle, [dir="rtl"] .avatar__badge--rectangle { left: 50%; right: auto; transform: translate(-50%); }
7546}
7547.user-menu-button { position: relative; }
7548.user-menu-button__avatar-btn { background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; cursor: pointer; display: flex; align-items: center; justify-content: center; border-radius: var(--corner-radius-circle); }
7549.user-menu-button__dropdown { position: absolute; top: calc(100% + 8px); right: 0px; width: 260px; background-color: var(--background-colors-base); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r12); z-index: 600; overflow: hidden; box-shadow: rgba(0, 0, 0, 0.24) 0px 8px 24px; }
7550.user-menu-button__dropdown--above { top: auto; bottom: calc(100% + 8px); }
7551.user-menu-button__sheet-content { width: 100%; max-height: 100%; overflow: hidden auto; box-sizing: border-box; display: flex; flex-direction: column; gap: var(--spacings-s12); padding-bottom: var(--spacings-s8); }
7552.user-menu-button__user-card-sheet { border-radius: var(--corner-radius-r12); padding: var(--spacings-s12); gap: var(--spacings-s8); }
7553.user-menu-button__menu-group-sheet { border-radius: var(--corner-radius-r12); background-color: var(--background-colors-tint-1); overflow: hidden; }
7554.user-menu-button__user-card, .user-menu-button__user-card-sheet { display: flex; align-items: center; gap: var(--spacings-s4); padding: var(--spacings-s8); background: var(--gradients-general-primary); }
7555.user-menu-button__user-info { display: flex; flex-direction: column; gap: 2px; min-width: 0px; }
7556.user-menu-button__user-name { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t5-font-size); font-weight: 600; line-height: var(--typography-t5-line-height); color: rgb(255, 255, 255); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
7557.user-menu-button__user-handle { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); line-height: var(--typography-t4-line-height); color: rgba(255, 255, 255, 0.75); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
7558.user-menu-button__menu-item-label { font-size: var(--typography-t5-font-size); line-height: var(--typography-t2-line-height); }
7559.credits-display { padding: var(--spacings-s16); background-color: var(--background-colors-base); border-radius: 12px; border: 1px solid var(--background-colors-border); display: flex; flex-direction: column; gap: var(--spacings-s12); }
7560.credits-display__top-section { display: flex; gap: var(--spacings-s12); align-items: center; }
7561.credits-display__icon-wrapper { width: 48px; height: 48px; border-radius: 50%; border: 3px solid var(--primary-colors-base-action); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
7562.credits-display__credits-info { display: flex; flex-direction: column; gap: var(--spacings-s4); flex: 1 1 0%; }
7563.credits-display__credit-line { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 600; line-height: var(--typography-t4-line-height); color: var(--text-colors-base); display: block; white-space: normal; word-break: break-word; }
7564.credits-display__get-more-button { align-self: flex-end; }
7565.credits-display__plan-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t3-font-size); line-height: var(--typography-t3-line-height); color: var(--text-colors-base); width: 100%; white-space: normal; word-break: break-word; }
7566.app-header { display: flex; align-items: center; justify-content: space-between; height: 72px; padding: 0 var(--spacings-s16); background-color: var(--background-colors-base); flex-shrink: 0; width: 100%; box-sizing: border-box; }
7567.app-header--compact { height: auto; padding: var(--spacings-s6); }
7568.app-header--divided { height: auto; padding: var(--spacings-s6); border-bottom: 1px solid var(--background-colors-border); }
7569.app-header__back-area { display: flex; align-items: center; gap: var(--spacings-s6); }
7570.app-header__video-back-btn { width: 20px; min-width: 20px; height: 20px; padding: 0px; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; color: var(--text-colors-tint-1); }
7571.app-header__branding { display: flex; align-items: center; gap: var(--spacings-s10); }
7572.app-header__logo-circle { width: 40px; height: 40px; border-radius: var(--corner-radius-circle); flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--primary-colors-alpha-10); }
7573.app-header__comic-me-logo-frame { width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--primary-colors-alpha-10); color: var(--primary-colors-base-default); }
7574.app-header__app-name { font-family: Bangers, cursive; font-weight: 400; font-size: 20px; line-height: 24px; letter-spacing: 0.5px; color: var(--text-colors-base); margin: 0px; }
7575.app-header__right-area { display: flex; align-items: center; gap: var(--spacings-s8); }
7576.app-header__dropdown-title { font-family: Bangers, cursive; font-size: var(--typography-t5-font-size); font-weight: 400; line-height: 24px; color: var(--text-colors-base); text-transform: uppercase; margin: 0px; padding: var(--spacings-s8) var(--spacings-s16) var(--spacings-s4); display: block; }
7577.app-header__settings-wrapper, .app-header__export-wrapper { position: relative; }
7578.app-header__dropdown { position: absolute; top: calc(100% + 6px); right: 0px; background-color: var(--background-colors-base); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r8); z-index: 500; width: 300px; min-width: 160px; padding: var(--spacings-s8) 0; }
7579.app-header__dropdown-item { display: flex; align-items: center; gap: var(--spacings-s10); width: 100%; padding: var(--spacings-s10) var(--spacings-s16); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; text-align: left; font-family: Picsart-Fonts, sans-serif; transition: background-color 0.12s; }
7580.app-header__dropdown-item:hover { background-color: var(--background-colors-tint-1); }
7581.app-header__dropdown-item:disabled { opacity: 0.5; cursor: not-allowed; }
7582.app-header__dropdown-item-text { font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; color: var(--text-colors-base); }
7583.app-header__dropdown-actions { display: flex; flex-direction: column; gap: var(--spacings-s8); padding: 0 var(--spacings-s8) var(--spacings-s8); }
7584.app-header__video-compact-export-btn { margin-right: var(--spacings-s8); }
7585.app-header__video-compact-export-btn, .app-header__video-compact-export-btn:hover, .app-header__video-compact-export-btn:active { border-radius: 50% !important; min-width: 36px !important; width: 36px !important; height: 36px !important; padding: 0px !important; }
7586.app-header__close-button { color: var(--text-colors-tint-2); font-size: 1rem; line-height: 1; padding: var(--spacings-s10); background: none !important; border-width: medium !important; border-style: none !important; border-color: currentcolor !important; border-image: initial !important; box-shadow: none !important; }
7587.app-header__close-button:hover { color: var(--text-colors-base); background: none !important; }
7588.mobile-bottom-nav { position: sticky; bottom: 0px; width: calc(100% + var(--spacings-s16) * 2); margin-inline: calc(var(--spacings-s16) * -1); flex-shrink: 0; box-sizing: border-box; z-index: 20; display: flex; align-items: stretch; padding-top: var(--spacings-s8); padding-bottom: calc(var(--spacings-s6) + env(safe-area-inset-bottom,0px)); background-color: rgba(0, 0, 0, 0.8); backdrop-filter: blur(26px); }
7589.mobile-bottom-nav__item-button { flex: 1 1 0px; min-width: 0px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--spacings-s2); padding: 0px; border: 0px; background: transparent; cursor: pointer; color: var(--text-colors-base); -webkit-tap-highlight-color: transparent; }
7590.mobile-bottom-nav__item-button--active { color: var(--primary-colors-base-default); }
7591.mobile-bottom-nav__item-button:active { opacity: 0.6; }
7592.mobile-bottom-nav__item-label { font-family: Picsart-Fonts, sans-serif; font-size: 10px; font-weight: 600; line-height: 14px; color: inherit; white-space: nowrap; }
7593.mobile-write-footer { flex-shrink: 0; width: calc(100% + var(--spacings-s16) * 2); margin-inline: calc(var(--spacings-s16) * -1); box-sizing: border-box; display: flex; flex-direction: column; align-items: center; gap: var(--spacings-s8); padding: var(--spacings-s4) var(--spacings-s16); background-color: rgba(0, 0, 0, 0.8); }
7594.mobile-apps-view { width: 100%; height: 100%; overflow: hidden auto; display: flex; flex-direction: column; box-sizing: border-box; background-color: var(--background-colors-base); padding: var(--spacings-s12) var(--spacings-s6) var(--spacings-s32); }
7595.mobile-apps-view__section-header { display: flex; flex-direction: column; gap: var(--spacings-s12); margin-bottom: var(--spacings-s16); }
7596.mobile-apps-view__section-title { font-family: Bangers, cursive; font-size: 24px; line-height: normal; letter-spacing: 1px; color: var(--text-colors-base); margin: 0px; }
7597.mobile-apps-view__cards-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--spacings-s12); }
7598.mobile-apps-view__card { width: 100%; aspect-ratio: 2 / 3; border-radius: var(--corner-radius-r16); position: relative; overflow: hidden; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; background: none; display: block; cursor: pointer; text-align: left; text-decoration: none; }
7599.mobile-apps-view__card:active { opacity: 0.85; }
7600.mobile-apps-view__card--non-nav { cursor: default; }
7601.mobile-apps-view__card--non-nav:active { opacity: 1; }
7602.mobile-apps-view__card-banner { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; display: block; }
7603.mobile-apps-view__card-info { position: absolute; bottom: 0px; left: 0px; right: 0px; display: flex; flex-direction: row; align-items: center; gap: var(--spacings-s8); padding: var(--spacings-s12); background-color: var(--effects-alpha-50); backdrop-filter: blur(8px); }
7604.mobile-apps-view__card-icon-wrapper { width: var(--spacings-s32); height: var(--spacings-s32); border-radius: var(--corner-radius-r8); overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
7605.mobile-apps-view__card-icon-image { width: 100%; height: 100%; object-fit: cover; display: block; }
7606.mobile-apps-view__card-text-group { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: var(--spacings-s2); overflow: hidden; }
7607.mobile-apps-view__card-title, .mobile-apps-view__card-description { margin: 0px; }
7608.onboarding { position: fixed; inset: 0px; z-index: 200; background-color: rgb(26, 26, 26); overflow: hidden; }
7609.onboarding__slide { position: absolute; inset: 0px; transition: transform 0.4s, opacity 0.4s; }
7610.onboarding__background-image { position: absolute; inset: 0px; background-size: cover; background-position: center center; background-repeat: no-repeat; }
7611.onboarding__skip-button { position: absolute; top: 16px; right: 20px; z-index: 10; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; color: var(--negative-colors-base-default); font-size: 16px; font-family: Picsart-Fonts, sans-serif; cursor: pointer; padding: 8px 4px; opacity: 0.9; }
7612.onboarding__skip-button:hover { opacity: 1; }
7613.onboarding__footer { position: absolute; bottom: 0px; left: 0px; right: 0px; z-index: 10; display: flex; flex-direction: column; gap: 20px; padding: 0px 20px 40px; }
7614body { min-height: 100vh; font-family: Picsart-Fonts, sans-serif; margin: 0px; }
7615@media (min-width: 769px) {
7616  body { overflow-x: hidden; }
7617}
7618*, ::before, ::after { box-sizing: border-box; font-family: Picsart-Fonts, sans-serif; }
7619.blank__body { overflow-y: hidden; }
7620@keyframes layout-pow-enter { 
7621  0% { transform: scale(0) rotate(-45deg); opacity: 0; }
7622  30% { transform: scale(1.5) rotate(10deg); opacity: 1; }
7623  100% { transform: scale(1.8) rotate(0deg); opacity: 0; }
7624}
7625.layout__container { display: flex; flex-direction: column; width: calc(100% + var(--spacings-s16)); margin-inline-start: calc(var(--spacings-s16) * -1); overflow: hidden; background-color: var(--background-colors-base); }
7626.layout__body { display: flex; flex: 1 1 0%; flex-direction: row; overflow: hidden; position: relative; padding: 0 var(--spacings-s16) var(--spacings-s16); gap: 14px; box-sizing: border-box; }
7627.layout__body--detail { padding: 0 0 var(--spacings-s4); gap: 0px; }
7628.layout__body--detail-preset { padding-top: var(--spacings-s12); }
7629.layout__sidebar-panel { flex-shrink: 0; flex-grow: 0; width: 380px; height: 100%; z-index: 10; box-sizing: border-box; background-color: var(--background-colors-base); border: 1px solid var(--background-colors-border); border-radius: var(--corner-radius-r24); overflow: hidden; }
7630.layout__mobile-container { display: flex; flex-direction: column; width: calc(100% + var(--spacings-s16) * 2); margin-inline: calc(var(--spacings-s16) * -1); padding-inline: var(--spacings-s16); box-sizing: border-box; overflow: hidden; background-color: var(--background-colors-base); }
7631.layout__mobile-content { flex: 1 1 0%; overflow: hidden; position: relative; margin-inline: calc(var(--spacings-s16) * -1); padding-inline: var(--spacings-s16); }
7632.layout__mobile-sidebar-wrapper { width: 100%; height: 100%; overflow: auto; background-color: var(--background-colors-base); }
7633.layout__mobile-collection-wrapper { width: calc(100% + var(--spacings-s16) * 2); margin-inline: calc(var(--spacings-s16) * -1); height: 100%; overflow: auto; padding-block: var(--spacings-s2); padding-inline: calc(var(--spacings-s10) + var(--spacings-s16)); box-sizing: border-box; }
7634.layout__video-player-content { display: flex; flex-direction: column; align-items: stretch; justify-content: center; flex: 1 1 0%; overflow: hidden; min-height: 0px; }
7635.layout__video-player-content-desktop { align-items: center; justify-content: center; gap: 12px; }
7636.layout__video-player-wrapper { position: relative; width: 100%; aspect-ratio: 2 / 3; overflow: hidden; }
7637.layout__video-player-wrapper--full { aspect-ratio: unset; height: 100%; }
7638.layout__video-player-wrapper-desktop { flex: 0 0 auto; height: clamp(480px, -134px + 100vh, 1080px); width: auto; border-radius: 12px; }
7639.layout__video-player-wrapper-desktop--full { height: 100%; }
7640.layout__video-player-el { display: block; width: 100%; height: 100%; object-fit: contain; }
7641.layout__video-hover-actions { position: absolute; top: 4px; right: 6px; display: flex; flex-direction: row; gap: 4px; z-index: 20; opacity: 0; transition: opacity 0.15s; }
7642.layout__video-player-wrapper-desktop:hover .layout__video-hover-actions { opacity: 1; }
7643.layout__video-hover-actions-btn { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 6px; background-color: var(--background-colors-base); transition: background-color 0.12s; color: var(--negative-colors-base-default); }
7644.layout__video-hover-actions-btn:hover { background-color: var(--background-colors-tint-3); }
7645.layout__video-hover-actions-btn:disabled { opacity: 0.4;
7645 cursor: not-allowed; }
7646.layout__video-hover-actions-btn-labeled { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: var(--corner-radius-r8); cursor: pointer; display: inline-flex; align-items: center; gap: var(--spacings-s8); padding: var(--spacings-s2) var(--spacings-s8); background-color: var(--background-colors-base); color: var(--text-colors-base); font-family: Picsart-Fonts, sans-serif; font-size: var(--typography-t4-font-size); font-weight: 500; white-space: nowrap; transition: background-color 0.12s; }
7647.layout__video-hover-actions-btn-labeled:hover { background-color: var(--background-colors-tint-3); }
7648.layout__video-hover-menu-root { position: relative; display: inline-flex; }
7649.layout__video-hover-menu-dropdown { position: absolute; top: calc(100% + 4px); right: 0px; min-width: 184px; background-color: var(--background-colors-tint-1); border-radius: var(--corner-radius-r12); box-shadow: rgba(0, 0, 0, 0.35) 0px 8px 24px; overflow: hidden; z-index: 200; }
7650.layout__video-hover-menu-item { display: flex; align-items: center; gap: var(--spacings-s12); width: 100%; padding: var(--spacings-s12) var(--spacings-s16); font-size: var(--typography-t4-font-size); font-family: Picsart-Fonts, sans-serif; font-weight: 500; color: var(--text-colors-base); background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: pointer; text-align: left; white-space: nowrap; transition: background-color 0.12s; }
7651.layout__video-hover-menu-item:hover { background-color: var(--background-colors-tint-3); }
7652.layout__video-player-overlay { position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; pointer-events: none; }
7653.layout__video-player-error { position: absolute; inset: 0px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; background-color: rgba(0, 0, 0, 0.7); }
7654.layout__video-player-inline { position: absolute; inset: 0px; z-index: 10; background-color: var(--background-colors-base); display: flex; flex-direction: column; }
7655.layout__video-player-inline--with-rail { left: 177px; }
7656.layout__video-player-inline-mobile { margin-inline: var(--spacings-s16); }
7657.layout__video-player-inline-mobile--full { margin-inline: 0px; }
7658.layout__video-player-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: var(--spacings-s24); flex-shrink: 0; }
7659.layout__video-player-actions-desktop { width: calc(0.666667 * clamp(480px, -134px + 100vh, 1080px)); padding: var(--spacings-s16) 0; }
7660.layout__video-player-submit { display: flex; flex-shrink: 0; padding-top: var(--spacings-s16); }
7661.layout__video-player-submit-desktop { width: calc(0.666667 * clamp(480px, -134px + 100vh, 1080px)); padding-top: 0px; }
7662.faq-section__section { width: 100%; padding: var(--spacings-s32) var(--spacings-s16); box-sizing: border-box; }
7663.faq-section__inner { max-width: 720px; margin: 0px auto; }
7664.faq-section__heading { font-family: Bangers, cursive; font-size: var(--typography-t9-font-size); letter-spacing: var(--spacings-s2); line-height: var(--typography-t9-line-height); margin: var(--spacings-s0) var(--spacings-s0) var(--spacings-s24); }
7665.faq-section__item { background-color: var(--background-colors-base); border: 2px solid var(--background-colors-border); border-radius: var(--corner-radius-r8); box-shadow: var(--shadows-tint-2); padding: var(--spacings-s16) var(--spacings-s16); margin-bottom: var(--spacings-s16); }
7666.faq-section__question { font-family: Bangers, cursive; font-size: var(--typography-t6-font-size); letter-spacing: var(--spacings-s2); line-height: var(--typography-t6-line-height); margin: var(--spacings-s0) var(--spacings-s0) var(--spacings-s12); }
7667.faq-section__answer { margin: 0px; color: var(--text-colors-tint-2); line-height: 1.6; }
7668.faq-page { position: fixed; inset: 0px; z-index: 100; background-color: var(--background-colors-base); display: flex; flex-direction: column; overflow: hidden; }
7669.faq-page__header { display: flex; align-items: center; gap: var(--spacings-s8); padding: var(--spacings-s12) var(--spacings-s16); border-bottom: 2px solid var(--background-colors-border); flex-shrink: 0; }
7670.faq-page__title { font-family: Bangers, cursive; font-size: var(--typography-t8-font-size); letter-spacing: var(--spacings-s2); line-height: var(--typography-t8-line-height); margin: var(--spacings-s0); }
7671.faq-page__body { flex: 1 1 0%; overflow-y: auto; background-image: radial-gradient(circle, rgba(0, 0, 0, 0.05) 1px, transparent 1px); background-size: var(--spacings-s24) var(--spacings-s24); }
7672.seo-headings__sr-only { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; }
7673@layer ds-reset, ds-foundation, ds-subatoms, ds-atoms, ds-molecules, ds-organisms, ds-templates, ds-landing;
7674@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 400; src: local("Gilroy-Regular"), url("https://pastatic.picsart.com/cms-pastatic/d018cb40-40a8-4efa-a202-947285ae8329.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
7675@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 500; src: local("Gilroy-Medium"), url("https://pastatic.picsart.com/cms-pastatic/3de40576-a960-483a-a3ab-a1743e3c4ba6.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
7676@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 600; src: local("Gilroy-SemiBold"), url("https://pastatic.picsart.com/cms-pastatic/eae6e1ea-9319-406c-a3de-00431f8f03f4.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
7677@font-face { font-family: Gilroy-Fonts; font-style: normal; font-weight: 700; src: local("Gilroy-Bold"), url("https://pastatic.picsart.com/cms-pastatic/0ea441d6-d0d4-4236-b649-67a987887865.woff2") format("woff2"); font-display: swap; unicode-range: U+20-7F; }
7678html { --fonts-gilroy: Gilroy-Fonts, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, Helvetica, Arial, sans-serif; }
7679@layer ds-reset {
7680  * { margin: 0px; padding: 0px; box-sizing: border-box; }
7681  ::selection { background-color: var(--primary-colors-base-default); color: var(--primary-colors-text-default); }
7682  html { min-height: 100dvh;
7682 overscroll-behavior: none; text-rendering: optimizelegibility; -webkit-font-smoothing: antialiased; text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; font-feature-settings: normal; }
7683  @supports (-webkit-touch-callout: none) and (padding-top: env(safe-area-inset-top)) {
7684  html { padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
7685}
7686  a { text-decoration: none; }
7687  iframe { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; outline: none; }
7688  button { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: none; cursor: pointer; }
7689  input, textarea, select { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; outline: none; background: none; font-family: inherit; }
7690  input, select { appearance: none; }
7691  a, button, input, textarea, select, div { -webkit-tap-highlight-color: transparent; }
7692  input, button, textarea, select { font-family: var(--fonts-gilroy); }
7693  ul, ol { list-style: none; }
7694}
7695@layer ds-foundation {
7696  html { --easings-ease: cubic-bezier(.25, .1, .25, 1); --easings-ease-in: cubic-bezier(.42, 0, 1, 1); --easings-ease-in-out: cubic-bezier(.42, 0, .58, 1); --easings-ease-out: cubic-bezier(0, 0, .58, 1); --easings-linear: cubic-bezier(0, 0, 1, 1); --easings-practical: cubic-bezier(.4, 0, .2, 1); --easings-expressive: cubic-bezier(.4, 0, 0, 1); --easings-bounce: cubic-bezier(.34, 1.56, .64, 1); --states-disabled: .4; --corner-radius-circle: 50%; --corner-radius-r0: 0px; --corner-radius-r2: 2px; --corner-radius-r4: 4px; --corner-radius-r8: 8px; --corner-radius-r12: 12px; --corner-radius-r16: 16px; --corner-radius-r20: 20px; --corner-radius-r22: 22px; --corner-radius-r24: 24px; --corner-radius-r32: 32px; --spacings-s0: 0px; --spacings-s2: 2px; --spacings-s4: 4px; --spacings-s6: 6px; --spacings-s8: 8px; --spacings-s10: 10px; --spacings-s12: 12px; --spacings-s16: 16px; --spacings-s24: 24px; --spacings-s32: 32px; --spacings-s40: 40px; --spacings-s44: 44px; --spacings-s48: 48px; --spacings-s56: 56px; --spacings-s64: 64px; --spacings-s72: 72px; --stacking-context-lowest: -9999; --stacking-context-initial: 0; --stacking-context-layout: 1000; --stacking-context-popover: 2000; --stacking-context-popup: 3000; --stacking-context-tooltip: 4000; --stacking-context-toast: 5000; --stacking-context-highest: 9999; --timings-fast: .1s; --timings-default: .3s; --timings-medium: .5s; --timings-long: 1s; --timings-heavy: 2s; --typography-t1-font-size: 8px; --typography-t1-line-height: 10px; --typography-t2-font-size: 10px; --typography-t2-line-height: 14px; --typography-t3-font-size: 12px; --typography-t3-line-height: 16px; --typography-t4-font-size: 14px; --typography-t4-line-height: 20px; --typography-t5-font-size: 16px; --typography-t5-line-height: 24px; --typography-t6-font-size: 20px; --typography-t6-line-height: 28px; --typography-t7-font-size: 24px; --typography-t7-line-height: 32px; --typography-t8-font-size: 30px; --typography-t8-line-height: 36px; --typography-t9-font-size: 36px; --typography-t9-line-height: 48px; --typography-t10-font-size: 42px; --typography-t10-line-height: 50px; --typography-t11-font-size: 60px; --typography-t11-line-height: 72px; }
7697  html.light { --brand-colors-default: #F40BF4; --brand-colors-light: #FFFCF8; --brand-colors-dark: #000000; --absolute-black-colors-base-default: #000000; --absolute-black-colors-base-action: #313131; --absolute-black-colors-base-active: #000000; --absolute-black-colors-base-active-action: #313131; --absolute-black-colors-text-default: #ffffff; --absolute-black-colors-text-action: #ffffff; --absolute-black-colors-text-active: #ffffff; --absolute-black-colors-text-active-action: #ffffff; --absolute-white-colors-base-default: #ffffff; --absolute-white-colors-base-action: #ececec; --absolute-white-colors-base-active: #ffffff; --absolute-white-colors-base-active-action: #ececec; --absolute-white-colors-text-default: #000000; --absolute-white-colors-text-action: #000000; --absolute-white-colors-text-active: #000000; --absolute-white-colors-text-active-action: #000000; --background-colors-base: #fcfcfc; --background-colors-tint-1: #f7f7f7; --background-colors-tint-2: #f2f2f2; --background-colors-tint-3: #d9d9d9; --background-colors-border: #e8e8e8; --background-colors-transparent: rgba(0, 0, 0, .5215686275); --background-colors-tooltip: #ffffff; --background-colors-popover: #ffffff; --background-colors-canvas-back-layer: #ededed; --control-colors-border-default: #e0e0e0; --control-colors-border-action: #e0e0e0; --control-colors-border-active: #e0e0e0; --control-colors-border-active-action: #e0e0e0; --control-colors-button-background-default: #ffffff; --control-colors-button-background-action: #f7f7f7; --control-colors-button-background-active: #eeeeee; --control-colors-button-background-active-action: #f7f7f7; --control-colors-caret-default: #5a00ee; --control-colors-caret-action: #5a00ee; --control-colors-caret-active: #5a00ee; --control-colors-caret-active-action: #5a00ee; --control-colors-end-icon-default: #525252; --control-colors-end-icon-action: #3d3d3d; --control-colors-end-icon-active: #000000; --control-colors-end-icon-active-action: #3d3d3d; --control-colors-field-background-default: #ffffff; --control-colors-field-background-action: #f7f7f7; --control-colors-field-background-active: #eeeeee; --control-colors-field-background-active-action: #f7f7f7; --control-colors-placeholder-default: #707070; --control-colors-placeholder-action: #707070; --control-colors-placeholder-active: #707070; --control-colors-placeholder-active-action: #707070; --control-colors-slider-thumb-default: #fefefe; --control-colors-slider-thumb-action: #f1f1f1; --control-colors-slider-thumb-active: #fefefe; --control-colors-slider-thumb-active-action: #f1f1f1; --control-colors-slider-track-default: #C209C1; --control-colors-slider-track-action: #C209C1; --control-colors-slider-track-active: #C209C1; --control-colors-slider-track-active-action: #C209C1; --control-colors-start-icon-default: #525252; --control-colors-start-icon-action: #3d3d3d; --control-colors-start-icon-active: #000000; --control-colors-start-icon-active-action: #3d3d3d; --control-colors-text-default: #525252; --control-colors-text-action: #3d3d3d; --control-colors-text-active: #000000; --control-colors-text-active-action: #3d3d3d; --control-colors-value-default: #525252; --control-colors-value-action: #3d3d3d; --control-colors-value-active: #000000; --control-colors-value-active-action: #3d3d3d; --text-colors-base: #000000; --text-colors-tint-1: #4c4c4c; --text-colors-tint-2: #666666; --text-colors-tint-3: #737373; --error-colors-base-default: #D10037; --error-colors-base-action: #A9002D; --error-colors-base-active: #D10037; --error-colors-base-active-action: #A9002D; --error-colors-text-default: #ffffff; --error-colors-text-action: #ffffff; --error-colors-text-active: #ffffff; --error-colors-text-active-action: #ffffff; --information-colors-base-default: #0066eb; --information-colors-base-action: #0055c3; --information-colors-base-active: #0066eb; --information-colors-base-active-action: #0055c3; --information-colors-text-default: #ffffff; --information-colors-text-action: #ffffff; --information-colors-text-active: #ffffff; --information-colors-text-active-action: #ffffff; --success-colors-base-default: #00804A; --success-colors-base-action: #005A34; --success-colors-base-active: #00804A; --success-colors-base-active-action: #005A34; --success-colors-text-default: #ffffff; --success-colors-text-action: #ffffff; --success-colors-text-active: #ffffff; --success-colors-text-active-action: #ffffff; --warning-colors-base-default: #FFAA00; --warning-colors-base-action: #D99100; --warning-colors-base-active: #FFAA00; --warning-colors-base-active-action: #D99100; --warning-colors-text-default: #000000; --warning-colors-text-action: #000000; --warning-colors-text-active: #000000; --warning-colors-text-active-action: #000000; --negative-colors-base-default: #000000; --negative-colors-base-action: #787878; --negative-colors-base-active: #000000; --negative-colors-base-active-action: #787878; --negative-colors-text-default: #ffffff; --negative-colors-text-action: #ffffff; --negative-colors-text-active: #ffffff; --negative-colors-text-active-action: #ffffff; --neutral-colors-base-default: #f2f2f2; --neutral-colors-base-action: #b4b4b4; --neutral-colors-base-active: #f2f2f2; --neutral-colors-base-active-action: #b4b4b4; --neutral-colors-text-default: #000000; --neutral-colors-text-action: #000000; --neutral-colors-text-active: #000000; --neutral-colors-text-active-action: #000000; --positive-colors-base-default: #ffffff; --positive-colors-base-action: #b4b4b4; --positive-colors-base-active: #ffffff; --positive-colors-base-active-action: #b4b4b4; --positive-colors-text-default: #000000; --positive-colors-text-action: #000000; --positive-colors-text-active: #000000; --positive-colors-text-active-action: #000000; --primary-colors-base-default: #c209c1; --primary-colors-base-action: #920792; --primary-colors-base-active: #c209c1; --primary-colors-base-active-action: #920792; --primary-colors-text-default: #ffffff; --primary-colors-text-action: #ffffff; --primary-colors-text-active: #ffffff; --primary-colors-text-active-action: #ffffff; --primary-colors-alpha-10: rgba(194, 9, 193, .1019607843); --primary-colors-alpha-20: rgba(194, 9, 193, .2); --primary-colors-alpha-50: rgba(194, 9, 193, .5019607843); --primary-colors-alpha-80: rgba(194, 9, 193, .8); --transformer-colors-base-default: #3b8ce2; --transformer-colors-base-action: #3b8ce2; --transformer-colors-base-active: #3b8ce2; --transformer-colors-base-active-action: #3b8ce2; --transformer-colors-text-default: #ffffff; --transformer-colors-text-action: #ffffff; --transformer-colors-text-active: #ffffff; --transformer-colors-text-active-action: #ffffff; --monetization-plus-colors-base-default: #ac06ca; --monetization-plus-colors-base-action: #87059e; --monetization-plus-colors-base-active: #ac06ca; --monetization-plus-colors-base-active-action: #87059e; --monetization-plus-colors-text-default: #ffffff; --monetization-plus-colors-text-action: #ffffff; --monetization-plus-colors-text-active: #ffffff; --monetization-plus-colors-text-active-action: #ffffff; --monetization-plus-colors-alpha-10: rgba(172, 6, 202, .1019607843); --monetization-plus-colors-alpha-20: rgba(172, 6, 202, .2); --monetization-plus-colors-alpha-50: rgba(172, 6, 202, .5019607843); --monetization-plus-colors-alpha-80: rgba(172, 6, 202, .8); --monetization-pro-colors-base-default: #5a00ee; --monetization-pro-colors-base-action: #3d00a2; --monetization-pro-colors-base-active: #5a00ee; --monetization-pro-colors-base-active-action: #3d00a2; --monetization-pro-colors-text-default: #ffffff; --monetization-pro-colors-text-action: #ffffff; --monetization-pro-colors-text-active: #ffffff; --monetization-pro-colors-text-active-action: #ffffff; --monetization-pro-colors-alpha-10: rgba(90, 0, 238, .1019607843); --monetization-pro-colors-alpha-20: rgba(90, 0, 238, .2); --monetization-pro-colors-alpha-50: rgba(90, 0, 238, .5019607843); --monetization-pro-colors-alpha-80: rgba(90, 0, 238, .8); --monetization-ultra-colors-base-default: #158380; --monetization-ultra-colors-base-action: #0e5957; --monetization-ultra-colors-base-active: #158380; --monetization-ultra-colors-base-active-action: #0e5957; --monetization-ultra-colors-text-default: #ffffff; --monetization-ultra-colors-text-action: #ffffff; --monetization-ultra-colors-text-active: #ffffff; --monetization-ultra-colors-text-active-action: #ffffff; --monetization-ultra-colors-alpha-10: rgba(21, 131, 128, .1019607843); --monetization-ultra-colors-alpha-20: rgba(21, 131, 128, .2); --monetization-ultra-colors-alpha-50: rgba(21, 131, 128, .5019607843); --monetization-ultra-colors-alpha-80: rgba(21, 131, 128, .8); --gradients-general-brand: linear-gradient(225deg, #00ffed 0%, #19d7e7 22.96%, #7f4ad9 45.31%, #af1fc6 66.73%, #df02c0 100%); --gradients-general-primary: linear-gradient(270deg, #f749f6 0%, #c209c1 100%); --gradients-status-info: linear-gradient(270deg, #17bbf2 0%, #0066eb 100%); --gradients-status-success: linear-gradient(269.27deg, #1ac490 3.29%, #008c62 99.37%); --gradients-status-warning: linear-gradient(270deg, #ffcc63 0%, #ff921e 100%); --gradients-status-error: linear-gradient(270deg, #ff6170 0%, #d10037 100%); --gradients-monetization-plus: linear-gradient(270deg, #f749f6 0%, #c209c1 100%); --gradients-monetization-pro: linear-gradient(270deg, #8a43ff 0%, #5600e3 100%); --gradients-monetization-ultra: linear-gradient(270deg, #0fbeb9 0%, #00827e 100%); --gradients-background-up: linear-gradient(360deg, #fcfcfc 0%, transparent 100%); --gradients-background-down: linear-gradient(180deg, #fcfcfc 0%, transparent 100%); --gradients-background-left: linear-gradient(90deg, #fcfcfc 0%, transparent 100%); --gradients-background-right: linear-gradient(270deg, #fcfcfc 0%, transparent 100%); --apple-colors-base-default: #ffffff; --apple-colors-base-action: #e6e6e6; --apple-colors-base-active: #ffffff; --apple-colors-base-active-action: #e6e6e6; --apple-colors-text-default: #ffffff; --apple-colors-text-action: #ffffff; --apple-colors-text-active: #ffffff; --apple-colors-text-active-action: #ffffff; --facebook-colors-base-default: #0766ff; --facebook-colors-base-action: #0050d1; --facebook-colors-base-active: #0766ff; --facebook-colors-base-active-action: #0050d1; --facebook-colors-text-default: #ffffff; --facebook-colors-text-action: #ffffff; --facebook-colors-text-active: #ffffff; --facebook-colors-text-active-action: #ffffff; --google-colors-base-default: #f2f2f2; --google-colors-base-action: #c2c2c2; --google-colors-base-active: #f2f2f2; --google-colors-base-active-action: #c2c2c2; --google-colors-text-default: #1f1f1f;
7697 --google-colors-text-action: #1f1f1f; --google-colors-text-active: #1f1f1f; --google-colors-text-active-action: #1f1f1f; --kakao-colors-base-default: #fee500; --kakao-colors-base-action: #ebd402; --kakao-colors-base-active: #fee500; --kakao-colors-base-active-action: #ebd402; --kakao-colors-text-default: #262200; --kakao-colors-text-action: #262200; --kakao-colors-text-active: #262200; --kakao-colors-text-active-action: #262200; --line-colors-base-default: #06c755; --line-colors-base-action: #1fcd66; --line-colors-base-active: #048b3c; --line-colors-base-active-action: #06c755; --line-colors-text-default: #ffffff; --line-colors-text-action: #ffffff; --line-colors-text-active: #ffffff; --line-colors-text-active-action: #ffffff; --snapchat-colors-base-default: #fffc00; --snapchat-colors-base-action: #ece801; --snapchat-colors-base-active: #fffc00; --snapchat-colors-base-active-action: #ece801; --snapchat-colors-text-default: #000000; --snapchat-colors-text-action: #000000; --snapchat-colors-text-active: #000000; --snapchat-colors-text-active-action: #000000; --christmas-green-colors-base-default: #007c02; --christmas-green-colors-base-action: #0e5a18; --christmas-green-colors-base-active: #007c02; --christmas-green-colors-base-active-action: #0e5a18; --christmas-green-colors-text-default: #ffffff; --christmas-green-colors-text-action: #ffffff; --christmas-green-colors-text-active: #ffffff; --christmas-green-colors-text-active-action: #ffffff; --christmas-red-colors-base-default: #c70e17; --christmas-red-colors-base-action: #9e0b12; --christmas-red-colors-base-active: #c70e17; --christmas-red-colors-base-active-action: #9e0b12; --christmas-red-colors-text-default: #ffffff; --christmas-red-colors-text-action: #ffffff; --christmas-red-colors-text-active: #ffffff; --christmas-red-colors-text-active-action: #ffffff; --effects-alpha-20: color-mix(in srgb, #ffffff 20%, transparent); --effects-alpha-50: color-mix(in srgb, #ffffff 50%, transparent); --effects-alpha-80: color-mix(in srgb, #ffffff 80%, transparent); --effects-vignette: radial-gradient(44.71% 44.71% at 50.14% 50.12%, rgba(243, 10, 242, .484) 0%, rgba(243, 10, 242, .33) 32%, rgba(243, 10, 242, .187) 56%, rgba(243, 10, 242, .088) 76%, rgba(243, 10, 242, .022) 91%, rgba(243, 10, 242, 0) 100%); --effects-glassy-tint: rgba(255, 255, 255, .64); --effects-glassy-highlight: rgb(255, 255, 255); --effects-glassy-highlight-top: rgb(255, 255, 255); --effects-glassy-highlight-border: rgb(255, 255, 255); --effects-glassy-inner-shadow: inset 0px 1px 0 rgb(255 255 255 / 18%), inset 0 1px 0 rgb(255 255 255 / 10%), inset 0px 0px 19px 12px rgb(255 255 255 / 29%); --effects-glassy-blur-radius: 8px; --effects-glassy-border-width: 1px; --effects-glassy-backdrop: blur(var(--effects-glassy-blur-radius)); --effects-glassy-edge-top: linear-gradient(90deg, transparent, var(--effects-glassy-highlight-top), transparent); --effects-glassy-edge-side: linear-gradient(180deg, var(--effects-glassy-highlight), transparent, var(--effects-glassy-highlight)); --effects-glassy-shadow: 0px 8px 32px 0px rgba(0, 0, 0, .12); --effects-blurred-radius: 32px; --effects-blurred: blur(var(--effects-blurred-radius)); --shadows-tint-1: 0px 0px 16px 0px rgba(0, 0, 0, .12); --shadows-tint-2: 0px 0px 24px 0px rgba(0, 0, 0, .16); --shadows-tint-3: 0px 0px 32px 0px rgba(0, 0, 0, .16); }
7698  @media (prefers-reduced-transparency: reduce) {
7699  html.light { --effects-glassy-tint: var(--background-colors-base); --effects-glassy-backdrop: none; --effects-glassy-edge-top: none; --effects-glassy-edge-side: none; --effects-blurred: none; }
7700}
7701  html.dark { --brand-colors-default: #FF47FF; --brand-colors-light: #FFFCF8; --brand-colors-dark: #000000; --absolute-black-colors-base-default: #000000; --absolute-black-colors-base-action: #313131; --absolute-black-colors-base-active: #000000; --absolute-black-colors-base-active-action: #313131; --absolute-black-colors-text-default: #ffffff; --absolute-black-colors-text-action: #ffffff; --absolute-black-colors-text-active: #ffffff; --absolute-black-colors-text-active-action: #ffffff; --absolute-white-colors-base-default: #ffffff; --absolute-white-colors-base-action: #ececec; --absolute-white-colors-base-active: #ffffff; --absolute-white-colors-base-active-action: #ececec; --absolute-white-colors-text-default: #000000; --absolute-white-colors-text-action: #000000; --absolute-white-colors-text-active: #000000; --absolute-white-colors-text-active-action: #000000; --background-colors-base: #121212; --background-colors-tint-1: #1c1c1c; --background-colors-tint-2: #262626; --background-colors-tint-3: #454545; --background-colors-border: #303030; --background-colors-transparent: rgba(0, 0, 0, .6); --background-colors-tooltip: #000000; --background-colors-popover: #0f0f0f;
7701 --background-colors-canvas-back-layer: #262626; --control-colors-border-default: #3b3b3b; --control-colors-border-action: #3b3b3b; --control-colors-border-active: #3b3b3b; --control-colors-border-active-action: #3b3b3b; --control-colors-button-background-default: #000000; --control-colors-button-background-action: #212121; --control-colors-button-background-active: #2a2a2a; --control-colors-button-background-active-action: #212121; --control-colors-caret-default: #ff47ff; --control-colors-caret-action: #ff47ff; --control-colors-caret-active: #ff47ff; --control-colors-caret-active-action: #ff47ff; --control-colors-end-icon-default: #b3b3b3; --control-colors-end-icon-action: #cccccc; --control-colors-end-icon-active: #ffffff; --control-colors-end-icon-active-action: #cccccc; --control-colors-field-background-default: #000000; --control-colors-field-background-action: #212121; --control-colors-field-background-active: #2a2a2a; --control-colors-field-background-active-action: #212121; --control-colors-placeholder-default: #7a7a7a; --control-colors-placeholder-action: #7a7a7a; --control-colors-placeholder-active: #7a7a7a; --control-colors-placeholder-active-action: #7a7a7a; --control-colors-slider-thumb-default: #ffffff; --control-colors-slider-thumb-action: #f1f1f1; --control-colors-slider-thumb-active: #ffffff; --control-colors-slider-thumb-active-action: #f1f1f1; --control-colors-slider-track-default: #FF47FF; --control-colors-slider-track-action: #FF47FF; --control-colors-slider-track-active: #FF47FF; --control-colors-slider-track-active-action: #FF47FF; --control-colors-start-icon-default: #b3b3b3; --control-colors-start-icon-action: #cccccc; --control-colors-start-icon-active: #ffffff; --control-colors-start-icon-active-action: #cccccc; --control-colors-text-default: #b3b3b3; --control-colors-text-action: #cccccc; --control-colors-text-active: #ffffff; --control-colors-text-active-action: #cccccc; --control-colors-value-default: #b3b3b3; --control-colors-value-action: #cccccc; --control-colors-value-active: #ffffff; --control-colors-value-active-action: #cccccc; --text-colors-base: #ffffff; --text-colors-tint-1: #b3b3b3; --text-colors-tint-2: #808080; --text-colors-tint-3: #7d7d7d; --error-colors-base-default: #F8495A; --error-colors-base-action: #FC6574; --error-colors-base-active: #F8495A; --error-colors-base-active-action: #FC6574; --error-colors-text-default: #000000; --error-colors-text-action: #000000; --error-colors-text-active: #000000; --error-colors-text-active-action: #000000; --information-colors-base-default: #42c6ff; --information-colors-base-action: #7fd6fc; --information-colors-base-active: #42c6ff; --information-colors-base-active-action: #7fd6fc; --information-colors-text-default: #000000; --information-colors-text-action: #000000; --information-colors-text-active: #000000; --information-colors-text-active-action: #000000; --success-colors-base-default: #00E099; --success-colors-base-action: #4CE1B2; --success-colors-base-active: #00E099; --success-colors-base-active-action: #4CE1B2; --success-colors-text-default: #000000; --success-colors-text-action: #000000; --success-colors-text-active: #000000; --success-colors-text-active-action: #000000; --warning-colors-base-default: #FF9D00; --warning-colors-base-action: #FFBE55; --warning-colors-base-active: #FF9D00; --warning-colors-base-active-action: #FFBE55; --warning-colors-text-default: #000000; --warning-colors-text-action: #000000; --warning-colors-text-active: #000000; --warning-colors-text-active-action: #000000; --negative-colors-base-default: #ffffff; --negative-colors-base-action: #b4b4b4; --negative-colors-base-active: #ffffff; --negative-colors-base-active-action: #b4b4b4; --negative-colors-text-default: #000000; --negative-colors-text-action: #000000; --negative-colors-text-active: #000000; --negative-colors-text-active-action: #000000; --neutral-colors-base-default: #2f2f2f; --neutral-colors-base-action: #080808; --neutral-colors-base-active: #2f2f2f; --neutral-colors-base-active-action: #080808; --neutral-colors-text-default: #ffffff; --neutral-colors-text-action: #ffffff; --neutral-colors-text-active: #ffffff; --neutral-colors-text-active-action: #ffffff; --positive-colors-base-default: #000000; --positive-colors-base-action: #787878; --positive-colors-base-active: #000000; --positive-colors-base-active-action: #787878; --positive-colors-text-default: #ffffff; --positive-colors-text-action: #ffffff; --positive-colors-text-active: #ffffff; --positive-colors-text-active-action: #ffffff; --primary-colors-base-default: #ff47ff; --primary-colors-base-action: #e636e6; --primary-colors-base-active: #ff47ff; --primary-colors-base-active-action: #e636e6; --primary-colors-text-default: #000000; --primary-colors-text-action: #000000; --primary-colors-text-active: #000000; --primary-colors-text-active-action: #000000; --primary-colors-alpha-10: rgba(255, 71, 255, .1019607843); --primary-colors-alpha-20: rgba(255, 71, 255, .2); --primary-colors-alpha-50: rgba(255, 71, 255, .5019607843); --primary-colors-alpha-80: rgba(255, 71, 255, .8); --transformer-colors-base-default: #3b8ce2; --transformer-colors-base-action: #3b8ce2; --transformer-colors-base-active: #3b8ce2; --transformer-colors-base-active-action: #3b8ce2; --transformer-colors-text-default: #ffffff; --transformer-colors-text-action: #ffffff; --transformer-colors-text-active: #ffffff; --transformer-colors-text-active-action: #ffffff; --monetization-plus-colors-base-default: #e982f4; --monetization-plus-colors-base-action: #e156f0; --monetization-plus-colors-base-active: #e982f4; --monetization-plus-colors-base-active-action: #e156f0; --monetization-plus-colors-text-default: #000000; --monetization-plus-colors-text-action: #000000; --monetization-plus-colors-text-active: #000000; --monetization-plus-colors-text-active-action: #000000; --monetization-plus-colors-alpha-10: rgba(233, 130, 244, .1019607843); --monetization-plus-colors-alpha-20: rgba(233, 130, 244, .2); --monetization-plus-colors-alpha-50: rgba(233, 130, 244, .5019607843); --monetization-plus-colors-alpha-80: rgba(233, 130, 244, .8); --monetization-pro-colors-base-default: #bd99f8; --monetization-pro-colors-base-action: #8168a9; --monetization-pro-colors-base-active: #bd99f8; --monetization-pro-colors-base-active-action: #8168a9; --monetization-pro-colors-text-default: #000000; --monetization-pro-colors-text-action: #000000; --monetization-pro-colors-text-active: #000000; --monetization-pro-colors-text-active-action: #000000; --monetization-pro-colors-alpha-10: rgba(189, 153, 248, .1019607843); --monetization-pro-colors-alpha-20: rgba(189, 153, 248, .2); --monetization-pro-colors-alpha-50: rgba(189, 153, 248, .5019607843); --monetization-pro-colors-alpha-80: rgba(189, 153, 248, .8); --monetization-ultra-colors-base-default: #158380; --monetization-ultra-colors-base-action: #0e5957; --monetization-ultra-colors-base-active: #158380; --monetization-ultra-colors-base-active-action: #0e5957; --monetization-ultra-colors-text-default: #ffffff; --monetization-ultra-colors-text-action: #ffffff; --monetization-ultra-colors-text-active: #ffffff; --monetization-ultra-colors-text-active-action: #ffffff; --monetization-ultra-colors-alpha-10: rgba(21, 131, 128, .1019607843); --monetization-ultra-colors-alpha-20: rgba(21, 131, 128, .2); --monetization-ultra-colors-alpha-50: rgba(21, 131, 128, .5019607843); --monetization-ultra-colors-alpha-80: rgba(21, 131, 128, .8); --gradients-general-brand: linear-gradient(225deg, #00ffed 0%, #19d7e7 22.96%, #7f4ad9 45.31%, #af1fc6 66.73%, #df02c0 100%); --gradients-general-primary: linear-gradient(270deg, #f749f6 0%, #c209c1 100%); --gradients-status-info: linear-gradient(270deg, #6fd4ff 0%, #22afec 100%); --gradients-status-success: linear-gradient(270.09deg, #33f3b6 -1.08%, #05d08f 99.92%); --gradients-status-warning: linear-gradient(270deg, #ffcc63 0%, #ff921e 100%); --gradients-status-error: linear-gradient(270deg, #ff6170 0%, #ee3446 100%); --gradients-monetization-plus: linear-gradient(270deg, #ef5eff 0%, #d41ee8 100%); --gradients-monetization-pro: linear-gradient(270deg, #b78aff 0%, #904cff 100%); --gradients-monetization-ultra: linear-gradient(270deg, #24c7c2 0%, #009994 100%); --gradients-background-up: linear-gradient(360deg, #121212 0%, transparent 100%); --gradients-background-down: linear-gradient(180deg, #121212 0%, transparent 100%); --gradients-background-left: linear-gradient(90deg, #121212 0%, transparent 100%); --gradients-background-right: linear-gradient(270deg, #121212 0%, transparent 100%); --apple-colors-base-default: #000000; --apple-colors-base-action: #1a1a1a; --apple-colors-base-active: #000000; --apple-colors-base-active-action: #1a1a1a; --apple-colors-text-default: #ffffff; --apple-colors-text-action: #ffffff; --apple-colors-text-active: #ffffff; --apple-colors-text-active-action: #ffffff; --facebook-colors-base-default: #0766ff; --facebook-colors-base-action: #0050d1; --facebook-colors-base-active: #0766ff; --facebook-colors-base-active-action: #0050d1; --facebook-colors-text-default: #ffffff; --facebook-colors-text-action: #ffffff; --facebook-colors-text-active: #ffffff; --facebook-colors-text-active-action: #ffffff; --google-colors-base-default: #f2f2f2; --google-colors-base-action: #c2c2c2; --google-colors-base-active: #f2f2f2; --google-colors-base-active-action: #c2c2c2; --google-colors-text-default: #1f1f1f;
7701 --google-colors-text-action: #1f1f1f; --google-colors-text-active: #1f1f1f; --google-colors-text-active-action: #1f1f1f; --kakao-colors-base-default: #fee500; --kakao-colors-base-action: #ebd402; --kakao-colors-base-active: #fee500; --kakao-colors-base-active-action: #ebd402; --kakao-colors-text-default: #262200; --kakao-colors-text-action: #262200; --kakao-colors-text-active: #262200; --kakao-colors-text-active-action: #262200; --line-colors-base-default: #06c755; --line-colors-base-action: #1fcd66; --line-colors-base-active: #048b3c; --line-colors-base-active-action: #06c755; --line-colors-text-default: #ffffff; --line-colors-text-action: #ffffff; --line-colors-text-active: #ffffff; --line-colors-text-active-action: #ffffff; --snapchat-colors-base-default: #fffc00; --snapchat-colors-base-action: #ece801; --snapchat-colors-base-active: #fffc00; --snapchat-colors-base-active-action: #ece801; --snapchat-colors-text-default: #000000; --snapchat-colors-text-action: #000000; --snapchat-colors-text-active: #000000; --snapchat-colors-text-active-action: #000000; --christmas-green-colors-base-default: #13a745; --christmas-green-colors-base-action: #12942a; --christmas-green-colors-base-active: #13a745; --christmas-green-colors-base-active-action: #12942a; --christmas-green-colors-text-default: #000000; --christmas-green-colors-text-action: #000000; --christmas-green-colors-text-active: #000000; --christmas-green-colors-text-active-action: #000000; --christmas-red-colors-base-default: #ff3f53; --christmas-red-colors-base-action: #e02639; --christmas-red-colors-base-active: #ff3f53; --christmas-red-colors-base-active-action: #e02639; --christmas-red-colors-text-default: #000000; --christmas-red-colors-text-action: #000000; --christmas-red-colors-text-active: #000000; --christmas-red-colors-text-active-action: #000000; --effects-alpha-20: color-mix(in srgb, #000000 20%, transparent); --effects-alpha-50: color-mix(in srgb, #000000 50%, transparent); --effects-alpha-80: color-mix(in srgb, #000000 80%, transparent); --effects-vignette: radial-gradient(44.71% 44.71% at 50.14% 50.12%, rgba(243, 10, 242, .484) 0%, rgba(243, 10, 242, .33) 32%, rgba(243, 10, 242, .187) 56%, rgba(243, 10, 242, .088) 76%, rgba(243, 10, 242, .022) 91%, rgba(243, 10, 242, 0) 100%); --effects-glassy-tint: rgba(0, 0, 0, .64); --effects-glassy-highlight: rgb(43, 43, 43); --effects-glassy-highlight-top: rgb(102, 96, 96); --effects-glassy-highlight-border: var(--background-colors-tint-3); --effects-glassy-inner-shadow: inset 0px 1px 0 rgb(116 107 107 / 18%), inset 0 -1px 0 rgb(110 63 63 / 10%), inset 0px 0px 19px 12px rgb(0 0 0 / 29%); --effects-glassy-blur-radius: 8px; --effects-glassy-border-width: 1px; --effects-glassy-backdrop: blur(var(--effects-glassy-blur-radius)); --effects-glassy-edge-top: linear-gradient(90deg, transparent, var(--effects-glassy-highlight-top), transparent); --effects-glassy-edge-side: linear-gradient(180deg, var(--effects-glassy-highlight), transparent, var(--effects-glassy-highlight)); --effects-glassy-shadow: 0px 8px 32px 0px rgba(0, 0, 0, .12); --effects-blurred-radius: 32px; --effects-blurred: blur(var(--effects-blurred-radius)); --shadows-tint-1: 0px 2px 12px 0px rgba(0, 0, 0, .5), 0px 1px 4px 0px rgba(0, 0, 0, .35); --shadows-tint-2: 0px 6px 24px 0px rgba(0, 0, 0, .6), 0px 3px 10px 0px rgba(0, 0, 0, .4); --shadows-tint-3: 0px 20px 60px 0px rgba(0, 0, 0, .75), 0px 8px 28px 0px rgba(0, 0, 0, .55); }
7702  @media (prefers-reduced-transparency: reduce) {
7703  html.dark { --effects-glassy-tint: var(--background-colors-base); --effects-glassy-backdrop: none; --effects-glassy-edge-top: none; --effects-glassy-edge-side: none; --effects-blurred: none; }
7704}
7705}
7706</style><style id="app-snackbar-gilroy" data-prerender-captured="">
7707    .app-snackbar-gilroy, .app-snackbar-gilroy * { font-family: "Picsart-Fonts", sans-serif !important; }
7708    .app-snackbar-gilroy [class*="title"] { white-space: pre-line !important; }
7709  </style>
7710  
7711  
7712  
7713  
7714  
7715  
7716  
7717  
7718  
7719  
7720  
7721  
7722  
7723  
7724  
7725  
7726  
7727  
7728  
7729<link id="bangers-font" rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Bangers&amp;display=swap"><style type="text/css" id="editor-root-styles" data-prerender-captured="">html {
7730        --editor-root-height: 100vh;
7731        height: var(--editor-root-height);
7732        overflow: hidden;
7733        background-color: var(--background-colors-base);
7734        user-select: none;
7735        -webkit-user-select: none;
7736      }
7737      body {
7738        height: 100%;
7739      }
7740      #root {
7741        height: 100%;
7742      }</style>
7743  <!-- SEO: injected from miniapp manifest -->
7744  <meta name="description" content="Create personalized superhero stories with AI-powered comic book generator"/>
7745  <meta name="theme-color" content="#000000" />
7746  <meta name="robots" content="index, follow, max-image-preview:large, max-video-preview:-1" />
7747  <meta name="keywords" content="AI comic book generator, AI comic generator from photo, photo to comic generator, AI comic maker, AI comic story generator, personalized comic book generator, turn photo into comic, AI fairy tale generator, comic strip generator, manga comic generator, superhero comic generator, AI story creator from image, create comics online, 
7747comic book maker online, Picsart ComicMe" />
7748  <link rel="canonical" href="https://comicme.ai/" />
7749  <link rel="alternate" hreflang="en-US" href="https://comicme.ai/" />
7750  <link rel="alternate" hreflang="x-default" href="https://comicme.ai/" />
7751  <meta property="og:type" content="website" />
7752  <meta property="og:site_name" content="ComicMe by Picsart" />
7753  <meta property="og:title" content="ComicMe - AI Comic Book Generator | Picsart" />
7754  <meta property="og:description" content="Upload your photo, choose a comic genre and art style, and let ComicMe turn you into the hero of a personalized AI-generated comic book or fairy tale." />
7755  <meta property="og:url" content="https://comicme.ai/" />
7756  <meta property="og:image" content="https://cdn-pipeline-output.picsart.com/pipeline-output/0431cfbc-5aff-4a95-8fed-573decd18a51.png" />
7757  <meta property="og:image:width" content="1024" />
7758  <meta property="og:image:height" content="576" />
7759  <meta property="og:image:alt" content="ComicMe – AI Comic Book Generator from Photos by Picsart" />
7760  <meta name="twitter:card" content="summary_large_image" />
7761  <meta name="twitter:site" content="@picsart" />
7762  <meta name="twitter:title" content="ComicMe - AI Comic Book Generator | Picsart" />
7763  <meta name="twitter:description" content="Create personalized comics and fairy tales from your photos with AI. Choose your hero, genre, art style, tone, and language." />
7764  <meta name="twitter:image" content="https://cdn-pipeline-output.picsart.com/pipeline-output/0431cfbc-5aff-4a95-8fed-573decd18a51.png" />
7765  <meta name="twitter:image:alt" content="ComicMe – AI Comic Book Generator from Photos by Picsart" />
7766  
7766<script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Picsart","url":"https://picsart.com","logo":"https://pastatic.picsart.com/cms-pastatic/picsart-og-default.jpg","sameAs":["https://twitter.com/picsart","https://www.instagram.com/picsart/","https://www.youtube.com/picsart","https://www.linkedin.com/company/picsart/"]}</script>
7766
7767  
7767<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebApplication","name":"ComicMe – AI Comic Book Generator from Photos | Picsart","url":"https://comicme.ai/","description":"Turn your photos into personalized comic books and fairy tales with ComicMe. Upload a hero photo, choose a genre, art style, tone, and language, then let AI create your story.","applicationCategory":"MultimediaApplication","operatingSystem":"Web","creator":{"@type":"Organization","name":"Picsart","url":"https://picsart.com"},"featureList":["Turn yourself into a comic book hero","Choose your genre, art style, and story tone","Create comics and fairy tales in multiple languages","No drawing or editing skills required"]}</script>
7767
7768  
7768<script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","mainEntity":[{"@type":"Question","name":"What is ComicMe?","acceptedAnswer":{"@type":"Answer","text":"ComicMe is an AI comic book generator that turns your photos into personalized comic-style stories. Upload a hero photo, choose a genre and art style, and create a comic or fairy tale in just a few steps."}},{"@type":"Question","name":"How does ComicMe work?","acceptedAnswer":{"@type":"Answer","text":"Upload a photo of your hero, optionally add a nemesis, then select a genre, art style, tone, premise, and language. ComicMe uses AI to generate a personalized comic-style story based on your choices."}},{"@type":"Question","name":"Can I create a comic from my own photo?","acceptedAnswer":{"@type":"Answer","text":"Yes. ComicMe is designed to turn your own photo into a comic book-style character and story."}},{"@type":"Question","name":"Do I need drawing or editing skills to use ComicMe?","acceptedAnswer":{"@type":"Answer","text":"No. ComicMe does the comic creation for you. You only need to upload a photo and choose the story settings you like."}},{"@type":"Question","name":"What comic styles can I choose from?","acceptedA
7768nswer":{"@type":"Answer","text":"ComicMe supports styles such as Golden Age, Noir, Halftone, Manga, Funny Pages, and Ligne Claire."}},{"@type":"Question","name":"What genres does ComicMe support?","acceptedAnswer":{"@type":"Answer","text":"You can create stories in genres such as Action, High Fantasy, Horror, Sci-Fi, Neon Noir, Wasteland, Comedy, and Teen Drama."}},{"@type":"Question","name":"Can ComicMe create fairy tales too?","acceptedAnswer":{"@type":"Answer","text":"Yes. ComicMe supports both comic creation and fairy tale generation."}},{"@type":"Question","name":"Is ComicMe available in multiple languages?","acceptedAnswer":{"@type":"Answer","text":"Yes. ComicMe supports multiple languages, including English, German, Spanish, French, Italian, Hindi, Indonesian, Japanese, Korean, Portuguese, Russian, Ukrainian, Vietnamese, Chinese, Arabic, and Armenian."}},{"@type":"Question","name":"Who is ComicMe best for?","acceptedAnswer":{"@type":"Answer","text":"ComicMe is great for anyone who wants to create fun, personalized comic stories from photos, including social media creators, families, friends, storytellers, and comic fans."}},{"@type":"Question","name":"Is ComicMe made by Picsart?","acceptedA
7768nswer":{"@type":"Answer","text":"Yes. ComicMe is a Picsart AI experience for creating personalized comic-style stories from photos."}}]}</script>
7768
7769<link rel="modulepreload" href="/assets/index-HF9S6n1b.js">
7770<script id="shell-config" type="application/json">{"packageId":"com.picsart.infinite-heroes","appVersion":"1.102.0","deploymentUrl":"https://6f306cef61ba7a422fdcb7b25b91c10fd31af00d.miniapps-webapps.picsart.com","pulseApp":"com.picsart.apps.comicme","pulseEnvironment":"prod","exposedModule":"Sidebar","prerender":false,"language":"en","theme":"dark","sso":{"authUrl":"https://auth.picsart.com/api","clientId":"auth-service-StandaloneminiappsOAuth2Clinet","redirectUri":"https://comicme.ai","scope":"openid user-global"}}</script>
7770
7771<link rel="preconnect" href="https://6f306cef61ba7a422fdcb7b25b91c10fd31af00d.miniapps-webapps.picsart.com" crossorigin>
7772<link rel="modulepreload" href="https://6f306cef61ba7a422fdcb7b25b91c10fd31af00d.miniapps-webapps.picsart.com/remoteEntry.js" crossorigin>
7773<link rel="icon" sizes="16x16" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=16" data-favicons="true"/>
7774<link rel="icon" sizes="32x32" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=32" data-favicons="true"/>
7775<link rel="icon" sizes="48x48" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=48" data-favicons="true"/>
7776<link rel="icon" sizes="96x96" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=96" data-favicons="true"/>
7777<link rel="icon" sizes="144x144" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=144" data-favicons="true"/>
7778<link rel="icon" sizes="192x192" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=192" data-favicons="true"/>
7779<link rel="icon" sizes="256x256" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=256" data-favicons="true"/>
7780<link rel="icon" sizes="384x384" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=384" data-favicons="true"/>
7781<link rel="icon" sizes="512x512" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=512" data-favicons="true"/>
7782<link rel="shortcut icon" type="image/png" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=32" data-favicons="true"/>
7783<link rel="apple-touch-icon" sizes="57x57" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=57" data-favicons="true"/>
7784<link rel="apple-touch-icon" sizes="60x60" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=60" data-favicons="true"/>
7785<link rel="apple-touch-icon" sizes="72x72" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=72" data-favicons="true"/>
7786<link rel="apple-touch-icon" sizes="76x76" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=76" data-favicons="true"/>
7787<link rel="apple-touch-icon" sizes="114x114" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=114" data-favicons="true"/>
7788<link rel="apple-touch-icon" sizes="120x120" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=120" data-favicons="true"/>
7789<link rel="apple-touch-icon" sizes="152x152" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=152" data-favicons="true"/>
7790<link rel="apple-touch-icon" sizes="167x167" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=167" data-favicons="true"/>
7791<link rel="apple-touch-icon" sizes="180x180" href="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=180" data-favicons="true"/>
7792<meta name="msapplication-TileColor" content="#C209C1" data-favicons="true"/>
7793<meta name="msapplication-TileImage" content="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=144" data-favicons="true"/>
7794<meta name="application-name" content="ComicMe" data-favicons="true"/>
7795<meta name="msapplication-square70x70logo" content="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=70" data-favicons="true"/>
7796<meta name="msapplication-square150x150logo" content="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=150" data-favicons="true"/>
7797<meta name="msapplication-wide310x150logo" content="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=310" data-favicons="true"/>
7798<meta name="msapplication-square310x310logo" content="https://cdn-cms-uploads.picsart.com/cms-uploads/e280410d-0f6c-476f-a7d6-3ba14ebe15c8.svg?to=min&r=310" data-favicons="true"/>
7799<meta data-favicons="true"/>
7800</head>
7801  <body>
7802    <div id="embedded-host" style=""></div>
7803    <div id="root" style="position: fixed; inset: 0px;"><div id="miniapp-container"><div id="317406bc-b5ea-4add-b533-3b0d53d2a3b7-miniapp-container-com.picsart.infinite~dheroes" data-pulse-miniapp-sid="317406bc-b5ea-4add-b533-3b0d53d2a3b7" data-pulse-miniapp-miniapp_id="com.picsart.infinite-heroes" data-pulse-miniapp-origin="editor" data-pulse-miniapp-p
7803ackage_id="com.picsart.infinite-heroes" data-pulse-miniapp-app_version="1.102.0" data-pulse-miniapp-platform_version="" data-pulse-miniapp-type="undefined" data-bootstrapped="true"><div id="317406bc-b5ea-4add-b533-3b0d53d2a3b7-miniapp-frame-com.picsart.infinite~dheroes" data-testid="com.picsart.infinite-heroes"><section class="blank blank--full-height" data-testid="blank"><div class="blank__common blank__body blank__body--desktop" data-testid="body"><div class="seo-headings__sr-only"><h1 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Create Personalized AI Comics from Your Photos</h1><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Turn yourself into a comic book hero</h2><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Choose your genre, art style, and story tone</h2><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Create comics and fairy tales in multiple languages</h2><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">No drawing or editing skills required</h2><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">ComicMe is an AI-powered comic book and fairy tale generator by Picsart. Upload a photo of yourself or anyone else, pick a comic genre like Action, Sci-Fi, Horror, or High Fantasy, choose an art style such as Manga, Noir, or Golden Age, set the story tone and premise, select your language, and let AI generate a fully personalized comic-style story. No drawing or editing skills required. ComicMe works in over 16 languages and supports both comic book and fairy tale formats.</p><section><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Frequently Asked Questions</h2><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">What is ComicMe?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">ComicMe is an AI-powered platform and app created by Picsart that transforms ordinary photos into personalized multi-page comic books, fairy tales, and illustrated story videos. It allows users to turn themselves, friends, or children into graphic novel or storybook characters without needing any drawing or writing skills.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">How does ComicMe work?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Upload a photo of your hero, optionally add a nemesis, then select a genre, art style, tone, premise, and language. ComicMe uses AI to generate a personalized comic-style story based on your choices.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Can I create a comic from my own photo?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Yes. ComicMe is designed to turn your own photo into a comic book-style character and story.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Do I need drawing or editing skills to use ComicMe?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">No. ComicMe does the comic creation for you. You only need to upload a photo and choose the story settings you like.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">What comic styles can I choose from?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">ComicMe supports styles such as Golden Age, Noir, Halftone, Manga, Funny Pages, and Ligne Claire.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">What genres does ComicMe support?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">You can create stories in genres such as Action, High Fantasy, Horror, Sci-Fi, Neon Noir, Wasteland, Comedy, and Teen Drama.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Can ComicMe create fairy tales too?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Yes. ComicMe supports both comic creation and fairy tale generation.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Is ComicMe available in multiple languages?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Yes. ComicMe supports multiple languages, including English, German, Spanish, French, Ital
7803ian, Hindi, Indonesian, Japanese, Korean, Portuguese, Russian, Ukrainian, Vietnamese, Chinese, Arabic, and Armenian.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Who is ComicMe best for?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">ComicMe is great for anyone who wants to create fun, personalized comic stories from photos, including social media creators, families, friends, storytellers, and comic fans.</p></div><div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Is ComicMe made by Picsart?</h3><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Yes. ComicMe is a Picsart AI experience for creating personalized comic-style stories from photos.</p></div></section></div><div class="layout__container" style="height: 100vh;"><div class="app-header"><div class="app-header__branding"><div><button aria-label="Menu" type="button" class="inline-button inline-button--small inline-button--no-border inline-button--without-border-override inline-button--transparent-bg inline-button--without-bg-override inline-button--center-content inline-button--default inline-button--interactive inline-button--cursor-pointer" data-testid="ihero-app-header-menu"><svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="inline-button__icon" data-testid="center-icon"><path d="M8.25 12.75a3 3 0 0 1 3 3V19a3 3 0 0 1-3 3H5l-.154-.004A3 3 0 0 1 2 19v-3.25a3 3 0 0 1 2.846-2.996L5 12.75zM5 14.25a1.5 1.5 0 0 0-1.5 1.5V19A1.5 1.5 0 0 0 5 20.5h3.25a1.5 1.5 0 0 0 1.5-1.5v-3.25a1.5 1.5 0 0 0-1.5-1.5zm14-1.5a3 3 0 0 1 3 3V19a3 3 0 0 1-3 3h-3.25l-.154-.004A3 3 0 0 1 12.75 19v-3.25a3 3 0 0 1 2.846-2.996l.154-.004zm-3.25 1.5a1.5 1.5 0 0 0-1.5 1.5V19a1.5 1.5 0 0 0 1.5 1.5H19a1.5 1.5 0 0 0 1.5-1.5v-3.25a1.5 1.5 0 0 0-1.5-1.5zM8.25 2a3 3 0 0 1 3 3v3.25a3 3 0 0 1-3 3H5l-.154-.004A3 3 0 0 1 2 8.25V5a3 3 0 0 1 2.846-2.996L5 2zM5 3.5A1.5 1.5 0 0 0 3.5 5v3.25A1.5 1.5 0 0 0 5 9.75h3.25a1.5 1.5 0 0 0 1.5-1.5V5a1.5 1.5 0 0 0-1.5-1.5zM19 2a3 3 0 0 1 3 3v3.25a3 3 0 0 1-3 3h-3.25l-.154-.004A3 3 0 0 1 12.75 8.25V5a3 3 0 0 1 2.846-2.996L15.75 2zm-3.25 1.5a1.5 1.5 0 0 0-1.5 1.5v3.25a1.5 1.5 0 0 0 1.5 1.5H19a1.5 1.5 0 0 0 1.5-1.5V5A1.5 1.5 0 0 0 19 3.5z"></path></svg></button></div><div class="app-header__logo-circle"><svg width="24" height="24" fill="var(--primary-colors-base-default)" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m6.626 6.754-.28 1.537L4.1 7.164l.248 2.543-1.462.47-.544-5.573zm8.208-.892 5.834-3.04-1.264 5.627h-1.537l.63-2.804-4.286 2.234-1.64-3.072-.824 1.119-1.232-1.3L12.773 2zM8.322 17.308l-.894 1.323 3.483-1.149 1.354 2.173 2.326-2.184.296.008.19.06 2.43.757-.23-.756 1.581.041.917 2.992-4.728-1.473-3.088 2.9-1.698-2.724-6.542 2.159 2.823-4.173zm11.105-3.462a.4.4 0 0 1-.287-.442l.23-1.611.873-3.08a.4.4 0 0 1 .494-.275l.8.227a.4.4 0 0 1 .276.494l-.872 3.079-.65 1.493a.4.4 0 0 1-.475.225zm-.393 2.125a.826.826 0 0 1-.573-1.027.831.831 0 1 1 1.6.454.826.826 0 0 1-1.027.573M5.65 13.936a1.2 1.2 0 0 1 .84.932c.181.863-.272 1.53-1.374 1.763l-1.637.345a.4.4 0 0 1-.473-.31l-.845-4.011a.4.4 0 0 1 .308-.474l1.513-.319c1.083-.228 1.76.137 1.942 1 .09.425-.02.791-.274 1.074m-1.502-.878-.452.095.136.644.526-.118c.153-.054.271-.172.228-.377-.048-.226-.253-.283-.438-.244m.637 2.412c.22-.046.355-.218.312-.423-.04-.192-.189-.282-.38-.27l-.651.13.144.684zm13.871-4.665-.769 4.434a.4.4 0 0 1-.463.326l-.59-.103a.4.4 0 0 1-.326-.462l.34-1.958-1.39 1.62-.124-.021-.763-1.994-.34 1.958a.4.4 0 0 1-.462.326l-.591-.103a.4.4 0 0 1-.326-.462l.769-4.434 1.38.24.797 2.162 1.478-1.768zm-7.666 2.908a.4.4 0 0 1-.383-.286l-.185-.623H8.325l-.185.623a.4.4 0 0 1-.384.286H6.85a.4.4 0 0 1-.382-.517L8.3 7.224a.4.4 0 0 1 .382-.282h1.371a.4.4 0 0 1 .383.282l1.833 5.972a.4.4 0 0 1-.383.517zm-2.25-2.295h1.269l-.64-2.613zM6.256 3.052c.139-.111.516-.282 1.328-.698L8.59 4.27 7.502 5.424z"></path></svg></div><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base app-header__app-name">Comic Me</h2></div><div class="app-header__right-area"><div class="user-menu-button"><button class="base-button base-button--default base-button--enabled user-menu-button__avatar-btn" tabindex="0" aria-label="User menu" aria-disabled="false" data-testid="ihero-user-menu-avatar" type="button"><div class="avatar avatar--with-shadow" data-testid="avatar-container" width="40" height="40" style="--avatar-size: 40px;"><svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="avatar__placeholder-icon avatar__icon" aria-hidden="true"><path d="M17.053 7.077q0-1.068-.38-1.97a5.2 5.2 0 0 0-1.09-1.611 5.2 5.2 0 0 0-1.614-1.09A4.9 4.9 0 0 0 11.999 2q-1.043 0-1.97.404a5.2 5.2 0 0 0-1.612 1.091 5.2 5.2 0 0 0-1.091 1.614 5 5 0 0 0-.38 1.97q0 1.042.38 1.968a5.2 5.2 0 0 0 1.09 1.613q.69.664 1.614 1.068a4.9 4.9 0 0 0 1.969.403q1.044 0 1.969-.403a5.4 5.4 0 0 0 1.614-1.068 5.2 5.2 0 0 0 1.09-1.613q.38-.926.38-1.97m-1.518 0q0 1.472-1.044 2.514-1.02 1.02-2.491 1.02a3.47 3.47 0 0 1-2.514-1.02 3.47 3.47 0 0 1-1.02-2.514q0-1.471 1.02-2.515A3.42 3.42 0 0 1 12 3.519q1.472 0 2.49 1.043a3.44 3.44 0 0 1 1.045 2.515M4.906 19.224a8 8 0 0 0-.237 2.016.74.74 0 0 1-.238.547.7.7 0 0 1-.52.213.74.74 0 0 1-.548-.213.8.8 0 0 1-.213-.547c.004-.823.1-1.642.284-2.443q.31-1.257 1.33-2.277.995-.996 2.75-1.542 1.756-.57 4.484-.57 2.729 0 4.484.57 1.755.545 2.751 1.542 1.02 1.02 1.305 2.277.31 1.258.31 2.443a.8.8 0 0 1-.215.547.73.73 0 0 1-.544.212.8.8 0 0 1-.547-.213.8.8 0 0 1-.214-.547q0-1.091-.237-2.016a3.47 3.47 0 0 0-.925-1.614q-.688-.712-2.136-1.186-1.447-.498-4.033-.498t-4.033.498q-1.447.474-2.136 1.186a3.46 3.46 0 0 0-.925 1.614z"></path></svg></div></button></div></div></div><div class="layout__body"><div class="layout__sidebar-panel"><div class="sidebar  "><div class="sidebar__story-types-bar"><div class="story-types"><div class="story-types__tier"><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base story-types__title">Story types</p><div class="story-types__carousel-wrap"><button aria-hidden="true" tabindex="-1" type="button" class="button button--small button--skin-neutral button--text button--no-border button--center-icon button--default-state button--interactive button--cursor-pointer story-types__arrow story-types__arrow--end" data-testid="story-types-scroll-next"><svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="button__icon" data-testid="center-icon"><path d="M7.94 4.243a.75.75 0 0 0-.217.555.72.72 0 0 0 .217.531L14.612 12l-6.67 6.67a.76.76 0 0 0-.218.556.72.72 0 0 0 .217.531.77.77 0 0 0 .557.242.69.69 0 0 0 .532-.243l6.863-6.838q.387-.387.387-.919t-.387-.918L9.03 4.24a.7.7 0 0 0-.239-.18.7.7 0 0 0-.293-.063.76.76 0 0 0-.557.243l.001.001z"></path></svg></button><div class="story-types__carousel story-types__carousel--fade-end" role="tablist" aria-label="Story types"><button role="tab" aria-selected="true" class="base-button base-button--default base-button--enabled story-types__card" tabindex="0" aria-disabled="false" data-testid="new-anime-series" type="button"><div class="image-frame image-frame--bg image-frame--active-border image-frame--interactive story-types__card-frame" tabindex="0" data-testid="image-frame" style="--imageframe-width: 100%; --imageframe-height: auto; --imageframe-border-radius: var(--corner-radius-r8);"><div class="image-frame__content"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/162463cf-d839-4152-861c-e0cf6ee7aab1.png" loading="lazy" alt="" class="image" data-testid="new-anime-series-image" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(2); height: 34px; width: auto; object-fit: contain; display: block;"></div></div><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base story-types__label-text">Series</span></button><button role="tab" aria-selected="false" class="base-button base-button--default base-button--enabled story-types__card" tabindex="0" aria-disabled="false" data-testid="story-kind-comic" type="button"><div class="image-frame image-frame--bg image-frame--interactive story-types__card-frame" tabindex="0" data-testid="image-frame" style="--imageframe-width: 100%; --imageframe-height: auto; --imageframe-border-radius: var(--corner-radius-r8);"><div class="image-frame__content"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/d35d5044-098a-4bdb-b722-318f705e2a6b.png" loading="lazy" alt="" class="image" data-testid="story-kind-comic-image" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); height: 34px; width: auto; object-fit: contain; display: block;"></div></div><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base story-types__label-text">Comic</span></button><button role="tab" aria-selected="false" class="base-button base-button--default base-button--enabled story-types__card" tabindex="0" aria-disabled="false" data-testid="story-kind-tale" type="button"><div class="image-frame image-frame--bg image-frame--interactive story-types__card-frame" tabindex="0" data-testid="image-frame" style="--imageframe-width: 100%; --imageframe-height: auto; --imageframe-border-radius: var(--corner-radius-r8);"><div class="image-frame__content"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/09ce7dbd-9d84-4d7c-ab6a-7abbbe31ad0c.png" loading="lazy" alt="" class="image" data-testid="story-kind-tale-image" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); height: 34px; width: auto; object-fit: contain; display: block;"></div></div><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base story-types__label-text">Fairy Tale</span></button><button role="tab" aria-selected="false" class="base-button base-button--default base-button--enabled story-types__card" tabindex="0" aria-disabled="false" data-testid="new-aphorism" type="button"><div class="image-frame image-frame--bg image-frame--interactive story-types__card-frame" tabindex="0" data-testid="image-frame" style="--imageframe-width: 100%; --imageframe-height: auto; --imageframe-border-radius: var(--corner-radius-r8);"><div class="image-frame__content"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/78647d49-319c-41f9-bef9-e2bf150269bb.png" loading="lazy" alt="" class="image" data-testid="new-aphorism-image" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); height: 34px; width: auto; object-fit: contain; display: block;"></div></div><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base story-types__label-text">Aphorism</span></button></div></div></div></div></div><div class="sidebar__content"><div class="sidebar__options-panel"><div class="sidebar__upload-heading-block"><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base sidebar__upload-heading">Your characters</h3><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1">Protagonist required - add up to 3 more. Give each a name and their role in the story.</span></div><div class="sidebar__upload-card-arrow-wrap"><div class="sidebar__upload-cards sidebar__upload-cards--scrollable"><div class="sidebar__upload-card-col"><button type="button" class="sidebar__upload-card sidebar__upload-card--required sidebar__upload-card--hero" data-testid="upload-card-protagonist" aria-label="Hero name"><span aria-hidden="true" class="sidebar__upload-icon-circle"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18.14 3.447H6.581q-.994 0-1.715.722a2.3 2.3 0 0 0-.7 1.693v6.975a.722.722 0 1 1-1.444 0V5.862q0-1.603 1.13-2.731a3.72 3.72 0 0 1 2.73-1.129H18.14q1.605 0 2.731 1.129a3.72 3.72 0 0 1 1.13 2.731v11.557q0 1.603-1.13 2.731a3.72 3.72 0 0 1-2.73 1.129h-6.976a.722.722 0 1 1 0-1.444h6.975q.994 0 1.693-.7.723-.723.722-1.715v-1.377l-.023-.022-.022-.023-3.454-3.453a1.13 1.13 0 0 0-.835-.339q-.495 0-.857.338l-.475.475 1.851 1.986a.67.67 0 0 1 .18.52.64.64 0 0 1-.226.496.7.7 0 0 1-.52.202.7.7 0 0 1-.496-.247l-4.808-5.169a1.2 1.2 0 0 0-.903-.385q-.52 0-.88.406l-1.965 2.257a.73.73 0 0 1-.496.249.8.8 0 0 1-.52-.181.7.7 0 0 1-.247-.496.68.68 0 0 1 .181-.521l1.9
780364-2.257a2.54 2.54 0 0 1 1.94-.904q1.196-.021 1.987.858l1.986 2.122.43-.429a2.52 2.52 0 0 1 1.85-.767q1.107 0 1.897.768l2.46 2.461V5.861q0-.994-.722-1.693a2.27 2.27 0 0 0-1.693-.721"></path><path d="M5.892 14.826a.7.7 0 0 0-.28-.047.75.75 0 0 0-.52.202.7.7 0 0 0-.202.52v2.167H2.723a.75.75 0 0 0-.52.203.7.7 0 0 0-.203.518.75.75 0 0 0 .202.52.75.75 0 0 0 .52.203H4.89v2.167a.67.67 0 0 0 .202.496.71.71 0 0 0 .804.171.7.7 0 0 0 .235-.171.67.67 0 0 0 .202-.497v-2.167H8.5a.7.7 0 0 0 .52-.202.75.75 0 0 0 .202-.519.7.7 0 0 0-.202-.52.7.7 0 0 0-.52-.202H6.332v-2.167a.7.7 0 0 0-.202-.52.7.7 0 0 0-.239-.155z"></path></svg></span></button><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="name-input-protagonist" placeholder="Hero name" maxlength="120" value=""></div><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="role-input-protagonist" placeholder="Role: curious student" maxlength="400" value=""></div></div><div class="sidebar__upload-card-col"><button type="button" class="sidebar__upload-card  sidebar__upload-card--hero" data-testid="upload-card-second-character" aria-label="2nd character"><span aria-hidden="true" class="sidebar__upload-icon-circle"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18.14 3.447H6.581q-.994 0-1.715.722a2.3 2.3 0 0 0-.7 1.693v6.975a.722.722 0 1 1-1.444 0V5.862q0-1.603 1.13-2.731a3.72 3.72 0 0 1 2.73-1.129H18.14q1.605 0 2.731 1.129a3.72 3.72 0 0 1 1.13 2.731v11.557q0 1.603-1.13 2.731a3.72 3.72 0 0 1-2.73 1.129h-6.976a.722.722 0 1 1 0-1.444h6.975q.994 0 1.693-.7.723-.723.722-1.715v-1.377l-.023-.022-.022-.023-3.454-3.453a1.13 1.13 0 0 0-.835-.339q-.495 0-.857.338l-.475.475 1.851 1.986a.67.67 0 0 1 .18.52.64.64 0 0 1-.226.496.7.7 0 0 1-.52.202.7.7 0 0 1-.496-.247l-4.808-5.169a1.2 1.2 0 0 0-.903-.385q-.52 0-.88.406l-1.965 2.257a.73.73 0 0 1-.496.249.8.8 0 0 1-.52-.181.7.7 0 0 1-.247-.496.68.68 0 0 1 .181-.521l1.964-2.257a2.54 2.54 0 0 1 1.94-.904q1.196-.021 1.987.858l1.986 2.122.43-.429a2.52 2.52 0 0 1 1.85-.767q1.107 0 1.897.768l2.46 2.461V5.861q0-.994-.722-1.693a2.27 2.27 0 0 0-1.693-.721"></path><path d="M5.892 14.826a.7.7 0 0 0-.28-.047.75.75 0 0 0-.52.202.7.7 0 0 0-.202.52v2.167H2.723a.75.75 0 0 0-.52.203.7.7 0 0 0-.203.518.75.75 0 0 0 .202.52.75.75 0 0 0 .52.203H4.89v2.167a.67.67 0 0 0 .202.496.71.71 0 0 0 .804.171.7.7 0 0 0 .235-.171.67.67 0 0 0 .202-.497v-2.167H8.5a.7.7 0 0 0 .52-.202.75.75 0 0 0 .202-.519.7.7 0 0 0-.202-.52.7.7 0 0 0-.52-.202H6.332v-2.167a.7.7 0 0 0-.202-.52.7.7 0 0 0-.239-.155z"></path></svg></span></button><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="name-input-second-character" placeholder="2nd character" maxlength="120" value=""></div><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="role-input-second-character" placeholder="Role: loyal friend" maxlength="400" value=""></div></div><div class="sidebar__upload-card-col"><button type="button" class="sidebar__upload-card  sidebar__upload-card--hero" data-testid="upload-card-third-character" aria-label="3rd character"><span aria-hidden="true" class="sidebar__upload-icon-circle"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18.14 3.447H6.581q-.994 0-1.715.722a2.3 2.3 0 0 0-.7 1.693v6.975a.722.722 0 1 1-1.444 0V5.862q0-1.603 1.13-2.731a3.72 3.72 0 0 1 2.73-1.129H18.14q1.605 0 2.731 1.129a3.72 3.72 0 0 1 1.13 2.731v11.557q0 1.603-1.13 2.731a3.72 3.72 0 0 1-2.73 1.129h-6.976a.722.722 0 1 1 0-1.444h6.975q.994 0 1.693-.7.723-.723.722-1.715v-1.377l-.023-.022-.022-.023-3.454-3.453a1.13 1.13 0 0 0-.835-.339q-.495 0-.857.338l-.475.475 1.851 1.986a.67.67 0 0 1 .18.52.64.64 0 0 1-.226.496.7.7 0 0 1-.52.202.7.7 0 0 1-.496-.247l-4.808-5.169a1.2 1.2 0 0 0-.903-.385q-.52 0-.88.406l-1.965 2.257a.73.73 0 0 1-.496.249.8.8 0 0 1-.52-.181.7.7 0 0 1-.247-.496.68.68 0 0 1 .181-.521l1.9
780364-2.257a2.54 2.54 0 0 1 1.94-.904q1.196-.021 1.987.858l1.986 2.122.43-.429a2.52 2.52 0 0 1 1.85-.767q1.107 0 1.897.768l2.46 2.461V5.861q0-.994-.722-1.693a2.27 2.27 0 0 0-1.693-.721"></path><path d="M5.892 14.826a.7.7 0 0 0-.28-.047.75.75 0 0 0-.52.202.7.7 0 0 0-.202.52v2.167H2.723a.75.75 0 0 0-.52.203.7.7 0 0 0-.203.518.75.75 0 0 0 .202.52.75.75 0 0 0 .52.203H4.89v2.167a.67.67 0 0 0 .202.496.71.71 0 0 0 .804.171.7.7 0 0 0 .235-.171.67.67 0 0 0 .202-.497v-2.167H8.5a.7.7 0 0 0 .52-.202.75.75 0 0 0 .202-.519.7.7 0 0 0-.202-.52.7.7 0 0 0-.52-.202H6.332v-2.167a.7.7 0 0 0-.202-.52.7.7 0 0 0-.239-.155z"></path></svg></span></button><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="name-input-third-character" placeholder="3rd character" maxlength="120" value=""></div><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="role-input-third-character" placeholder="Role: missing boy" maxlength="400" value=""></div></div><div class="sidebar__upload-card-col"><button type="button" class="sidebar__upload-card  sidebar__upload-card--hero" data-testid="upload-card-fourth-character" aria-label="4th character"><span aria-hidden="true" class="sidebar__upload-icon-circle"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18.14 3.447H6.581q-.994 0-1.715.722a2.3 2.3 0 0 0-.7 1.693v6.975a.722.722 0 1 1-1.444 0V5.862q0-1.603 1.13-2.731a3.72 3.72 0 0 1 2.73-1.129H18.14q1.605 0 2.731 1.129a3.72 3.72 0 0 1 1.13 2.731v11.557q0 1.603-1.13 2.731a3.72 3.72 0 0 1-2.73 1.129h-6.976a.722.722 0 1 1 0-1.444h6.975q.994 0 1.693-.7.723-.723.722-1.715v-1.377l-.023-.022-.022-.023-3.454-3.453a1.13 1.13 0 0 0-.835-.339q-.495 0-.857.338l-.475.475 1.851 1.986a.67.67 0 0 1 .18.52.64.64 0 0 1-.226.496.7.7 0 0 1-.52.202.7.7 0 0 1-.496-.247l-4.808-5.169a1.2 1.2 0 0 0-.903-.385q-.52 0-.88.406l-1.965 2.257a.73.73 0 0 1-.496.249.8.8 0 0 1-.52-.181.7.7 0 0 1-.247-.496.68.68 0 0 1 .181-.521l1.964-2.257a2.54 2.54 0 0 1 1.94-.904q1.196-.021 1.987.858l1.986 2.122.43-.429a2.52 2.52 0 0 1 1.85-.767q1.107 0 1.897.768l2.46 2.461V5.861q0-.994-.722-1.693a2.27 2.27 0 0 0-1.693-.721"></path><path d="M5.892 14.826a.7.7 0 0 0-.28-.047.75.75 0 0 0-.52.202.7.7 0 0 0-.202.52v2.167H2.723a.75.75 0 0 0-.52.203.7.7 0 0 0-.203.518.75.75 0 0 0 .202.52.75.75 0 0 0 .52.203H4.89v2.167a.67.67 0 0 0 .202.496.71.71 0 0 0 .804.171.7.7 0 0 0 .235-.171.67.67 0 0 0 .202-.497v-2.167H8.5a.7.7 0 0 0 .52-.202.75.75 0 0 0 .202-.519.7.7 0 0 0-.202-.52.7.7 0 0 0-.52-.202H6.332v-2.167a.7.7 0 0 0-.202-.52.7.7 0 0 0-.239-.155z"></path></svg></span></button><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="name-input-fourth-character" placeholder="4th character" maxlength="120" value=""></div><div class="text-field text-field--small" data-testid="text-field-root"><input class="text-field__control text-field__control--small text-field--default-skin text-field__control--default-padding text-field__control--centered text-field--interactive" tabindex="0" data-testid="role-input-fourth-character" placeholder="Role: mother of hero" maxlength="400" value=""></div></div></div><button type="button" class="sidebar__upload-card-arrow" aria-label="Show more characters" data-testid="anime-characters-scroll-right"><svg width="18" height="18" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M7.94 4.243a.75.75 0 0 0-.217.555.72.72 0 0 0 .217.531L14.612 12l-6.67 6.67a.76.76 0 0 0-.218.556.72.72 0 0 0 .217.531.77.77 0 0 0 .557.242.69.69 0 0 0 .532-.243l6.863-6.838q.387-.387.387-.919t-.387-.918L9.03 4.24a.7.7 0 0 0-.239-.18.7.7 0 0 0-.293-.063.76.76 0 0 0-.557.243l.001.001z"></path></svg></button></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Number of episodes</p><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 sidebar__option-hint">
7803Each episode is 15 seconds. 4 episodes = 1m.</span><div class="sidebar__chips-row"><div class="sidebar__chips-row-inner"><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">2 episodes</span></div></div></button><button data-testid="chip" type="button" data-is-active="true" class="chip chip--small chip--skin-negative-active sidebar__chip-btn" aria-pressed="true" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">4 episodes</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">6 episodes</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">8 episodes</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">12 episodes</span></div></div></button></div></div></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Story Idea</p><div class="sidebar__custom-premise sidebar__tall-text-box"><div class="text-area text-area--small text-area--default-skin text-area--interactive" data-testid="text-area-wrap"><textarea maxlength="1000" rows="1" data-testid="text-area" class="text-area__input" placeholder="A girl discovers she can see memories stored in objects…"></textarea></div></div></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Facts to preserve</p><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 sidebar__option-hint">Series canon, one per line. Never contradicted.</span><div class="sidebar__custom-premise sidebar__tall-text-box"><div class="text-area text-area--small text-area--default-skin text-area--interactive" data-testid="text-area-wrap"><textarea maxlength="1200" rows="1" data-testid="text-area" class="text-area__input" placeholder="She can read an object only once
7804Every reading leaves her hands burned
7805The city is never shown in daylight"></textarea></div></div></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Genre</p><div class="sidebar__chips-row"><div class="sidebar__chips-row-inner"><button data-testid="chip" type="button" data-is-active="true" class="chip chip--small chip--skin-negative-active sidebar__chip-btn" aria-pressed="true" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Action</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Mystery</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Romance</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Fantasy</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Sci-Fi</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Slice of Life</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Comedy</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Horror</span></div></div></button></div></div></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Genre Flavor</p><div class="sidebar__chips-row"><div class="sidebar__chips-row-inner"><button data-testid="chip" type="button" data-is-active="true" class="chip chip--small chip--skin-negative-active sidebar__chip-btn" aria-pressed="true" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Action &amp; Adventure</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Cinematic Drama</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Cyberpunk</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Fantasy</span></div></div></button></div></div></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Mood</p><div class="sidebar__chips-row"><div class="sidebar__chips-row-inner"><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Dark</span></div></div></button><button data-testid="chip" type="button" data-is-active="true" class="chip chip--small chip--skin-negative-active sidebar__chip-btn" aria-pressed="true" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Epic</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Emotional</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Suspenseful</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Funny</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Calm</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Inspirational</span></div></div></button></div></div></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Visual Feel</p><div class="sidebar__chips-row"><div class="sidebar__chips-row-inner"><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Cartoon</span></div></div></button><button data-testid="chip" type="button" data-is-active="true" class="chip chip--small chip--skin-negative-active sidebar__chip-btn" aria-pressed="true" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Anime</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Realistic</span></div></div></button></div></div></div><div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__option-label">Language</p><div class="sidebar__chips-row"><div class="sidebar__chips-row-inner"><button data-testid="chip" type="button" data-is-active="true" class="chip chip--small chip--skin-negative-active sidebar__chip-btn" aria-pressed="true" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">English</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">
7805Deutsch</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Español</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Français</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Italiano</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">हिन्दी</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Bahasa Indonesia</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">日本語</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">한국어</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Português</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Русский</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Українська</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Tiếng Việt</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">中文</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">العربية</span></div></div></button><button data-testid="chip" type="button" data-is-active="false" class="chip chip--small chip--skin-default sidebar__chip-btn" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Հայերեն</span></div></div></button></div></div></div></div></div><div class="sidebar__footer"><button type="button" class="button button--large button--skin-primary button--outline button--full-width button--default-state button--interactive button--cursor-pointer" data-testid="launch-anime-series-btn"><span class="button__content"><span class="button__text"><span class="button-label button-label--center button-label--fill"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Generate first episode</span></span></span></span></button><button type="button" class="button button--large button--skin-primary button--no-border button--full-width button--default-state button--interactive button--cursor-pointer" data-testid="launch-anime-full-series-btn"><span class="button__content"><span class="button__text"><span class="button-label button-label--center button-label--fill"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base">Generate full series</span></span></span></span></button><div class="sidebar__terms-wrapper"><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base sidebar__terms-text">By continuing, you agree to <a data-testid="ihero-sidebar-terms-link" class="base-link base-link--font-gilroy base-link--weight-normal link link--font-gilroy link--t3 link--weight-normal link--color-primary sidebar__terms-link" href="https://picsart.com/genaitermsofuse/" target="_blank" rel="noopener noreferrer" tabindex="0">Gen AI ToU</a>.</p></div></div></div></div><div class="desktop-content-panel"><div class="desktop-content-panel__tab-header"><div data-testid="ihero-desktop-content-panel-tabs" class="tabs tabs--large tabs--not-fixed desktop-content-panel__library-tabs" style="--tabs-active-tab-x: 0px; --tabs-active-tab-width: 99px;"><div class="tabs__list"><button index="0" data-testid="ihero-desktop-content-panel-tab-explore" role="tab" type="button" class="tab tab--large tab--not-fixed tab--active"><svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="tab__icon" data-testid="start-icon"><path d="M22 12a9.6 9.6 0 0 0-.796-3.888 9.9 9.9 0 0 0-2.13-3.185 9.9 9.9 0 0 0-3.185-2.13A9.6 9.6 0 0 0 12.001 2a9.6 9.6 0 0 0-3.887.796A9.9 9.9 0 0 0 4.93 4.927 9.9 9.9 0 0 0 2.8 8.111 9.6 9.6 0 0 0 2.001 12a9.6 9.6 0 0 0 .796 3.887 9.9 9.9 0 0 0 2.131 3.185 9.9 9.9 0 0 0 3.184 2.131 9.6 9.6 0 0 0 3.888.796 9.6 9.6 0 0 0 3.887-.796 9.9 9.9 0 0 0 3.185-2.13 9.9 9.9 0 0 0 2.131-3.185A9.6 9.6 0 0 0 22 12m-1.499 0a8.1 8.1 0 0 1-.679 3.301 8.5 8.5 0 0 1-1.826 2.716 8.4 8.4 0 0 1-2.693 1.804 8.1 8.1 0 0 1-3.302.68 8.1 8.1 0 0 1-3.302-.68 8.7 8.7 0 0 1-2.716-1.804 8.7 8.7 0 0 1-1.804-2.716A8.1 8.1 0 0 1 3.5 12q0-1.755.68-3.302a8.4 8.4 
78050 0 1 1.803-2.693A8.5 8.5 0 0 1 8.7 4.178a8.1 8.1 0 0 1 3.302-.679q1.756 0 3.302.68a8.3 8.3 0 0 1 2.693 1.825 8.2 8.2 0 0 1 1.826 2.693 8.1 8.1 0 0 1 .68 3.302"></path><path d="M14.248 13.906a.6.6 0 0 1-.14.21.6.6 0 0 1-.212.142L8.72 15.967a.5.5 0 0 1-.562-.116q-.235-.234-.117-.563l1.71-5.176a.6.6 0 0 1 .14-.21.6.6 0 0 1 .212-.141l5.176-1.71a.5.5 0 0 1 .562.117q.235.234.117.563zm-3.114-2.904a.4.4 0 0 0-.094.07.3.3 0 0 0-.047.07l-.796 2.436a.2.2 0 0 0 .024.21.2.2 0 0 0 .101.042.2.2 0 0 0 .108-.017l2.436-.796a.3.3 0 0 0 .07-.047.4.4 0 0 0 .07-.094l.797-2.435q.046-.116-.047-.188-.07-.093-.188-.047z"></path></svg><div class="tab__item">Explore</div></button><button index="1" data-testid="ihero-desktop-content-panel-tab-presets" role="tab" type="button" class="tab tab--large tab--not-fixed tab--interactive"><svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="tab__icon" data-testid="start-icon"><path d="M16.256 2.004q.305 0 .516.212.234.21.234.54v1.2a.7.7 0 0 1-.234.54.7.7 0 0 1-.516.21.78.78 0 0 1-.54-.21.73.73 0 0 1-.21-.54v-1.2a.73.73 0 0 1 .21-.541.78.78 0 0 1 .54-.211m-2.531 4.484q.21.235.515.235a.7.7 0 0 0 .54-.235.67.67 0 0 0 .234-.516.7.7 0 0 0-.235-.54l-3-3.001a.73.73 0 0 0-.539-.21.7.7 0 0 0-.515.21.73.73 0 0 0-.21.54q0 .305.21.515zm7.814-4.216a.7.7 0 0 1 .247.16h.001a.73.73 0 0 1 .21.54.7.7 0 0 1-.21.515l-3 3.002a.7.7 0 0 1-.54.235.66.66 0 0 1-.515-.235.66.66 0 0 1-.235-.516.7.7 0 0 1 .235-.54l3-3.001a.7.7 0 0 1 .515-.21.7.7 0 0 1 .291.05M2.214 20.714 15.716 7.427v-.001a.78.78 0 0 1 .54-.21.78.78 0 0 1 .54.21c.136.147.21.34.21.54a.78.78 0 0 1-.21.54L3.292 21.794a.8.8 0 0 1-.54.21.8.8 0 0 1-.54-.21.8.8 0 0 1-.21-.54.78.78 0 0 1 .21-.54m16.574-11.27 3 3.001q.21.21.211.54a.7.7 0 0 1-.21.515.73.73 0 0 1-.54.21.7.7 0 0 1-.515-.21l-3-3a.67.67 0 0 1-.235-.517q0-.33.235-.54a.67.67 0 0 1 .515-.234.69.69 0 0 1 .54.235m-5.999-.939a.8.8 0 0 0 .21-.54.7.7 0 0 0-.21-.516.7.7 0 0 0-.54-.234h-.984a.7.7 0 0 0-.54.234.7.7 0 0 0-.21.516c-.002.2.073.394.21.54a.73.73 0 0 0 .54.21h.984a.73.73 0 0 0 .54-.21m8.46.211h-.984a.73.73 0 0 1-.54-.21.79.79 0 0 1-.158-.82.7.7 0 0 1 .158-.237.7.7 0 0 1 .54-.234h.984a.7.7 0 0 1 .54.234.7.7 0 0 1 .21.516.78.78 0 0 1-.21.54.73.73 0 0 1-.54.21m-4.242 4.245v-.985a.7.7 0 0 0-.234-.54.7.7 0 0 0-.516-.21.78.78 0 0 0-.54.21.73.73 0 0 0-.21.54v.984q0 .33.21.54.236.21.54.21t.516-.21a.7.7 0 0 0 .234-.54"></path></svg><div class="tab__item">Inspire me</div></button><button index="2" data-testid="ihero-desktop-content-panel-tab-my-books" role="tab" type="button" class="tab tab--large tab--not-fixed tab--interactive"><svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="tab__icon" data-testid="start-icon"><path d="M7.36 2h11.154q1.045 0 1.787.762.762.741.762 1.81v10.674q0 .544-.261 1.002c-.157.302-.39.557-.676.741v2.44q0 1.068-.741 1.83a2.46 2.46 0 0 1-1.808.741H5.965a2.93 2.93 0 0 1-2.156-.893 2.96 2.96 0 0 1-.872-2.135V6.423q0-.915.349-1.72A4.45 4.45 0 0 1 5.639 2.35 4.3 4.3 0 0 1 7.359 2m.915 16.274h10.457v-.937H5.966q-.677 0-1.154.48a1.6 1.6 0 0 0-.479 1.155q0 .675.48 1.154.48.48 1.154.48h11.612q.414 0 .74-.26.329-.285.393-.677H8.276a.73.73 0 0 1-.501-.195.73.73 0 0 1-.195-.502q0-.284.195-.48a.7.7 0 0 1 .5-.218m10.697-2.33a.66.66 0 0 0 .48-.196.65.65 0 0 0 .218-.502V4.571q0-.48-.35-.827a1.07 1.07 0 0 0-.805-.349H7.36q-1.264 0-2.156.893a2.96 2.96 0 0 0-.872 2.135v10q.358-.223.762-.349.414-.13.872-.13z"></path><path d="m14.876 8.928-3.661-2.766q-.48-.37-1.023-.109-.524.26-.523.85v5.556q0 .588.523.85a.96.96 0 0 0 1.023-.11l3.66-2.788a.89.89 0 0 0 .37-.742.88.88 0 0 0-.37-.74"></path></svg><div class="tab__item">My Library</div></button></div></div></div><div class="desktop-content-panel__tab-content"><div class="desktop-content-panel__collection-wrapper"><div class="explore-tab"><div class="explore-tab__hero"><h1 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__hero-heading">From <span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__hero-highlight">Photo</span> to <span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__hero-highlight">Hero</span></h1><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__hero-description">Add your photo, shape your story, and create a fully illustrated flip book, video, or aphorism.</p></div><div class="explore-tab__format-row"><button aria-pressed="false" class="base-button base-button--default base-button--enabled explore-tab__format-card explore-tab__format-card--inactive" tabindex="0" aria-disabled="false" data-testid="explore-format-video-comic" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__format-card-title">Video Comic</span><div class="explore-tab__format-card-image-wrap"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/1633af7b-fe07-4cda-add9-2528fef57c79.webp" loading="lazy" alt="" class="image explore-tab__format-card-image" data-testid="image"></div></button><button aria-pressed="false" class="base-button base-button--default base-button--enabled explore-tab__format-card explore-tab__format-card--inactive" tabindex="0" aria-disabled="false" data-testid="explore-format-comic-book" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__format-card-title">Comic Book</span><div class="explore-tab__format-card-image-wrap"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/6ff41712-0764-423a-96a5-14f4603145da.webp" loading="lazy" alt="" class="image explore-tab__format-card-image" data-testid="image"></div></button><button aria-pressed="false" class="base-button base-button--default base-button--enabled explore-tab__format-card explore-tab__format-card--inactive" tabindex="0" aria-disabled="false" data-testid="explore-format-video-tale" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__format-card-title">Video Tale</span><div class="explore-tab__format-card-image-wrap"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/67adcea6-6e6a-4bc8-9cc7-e6adf3230be1.webp" loading="lazy" alt="" class="image explore-tab__format-card-image" data-testid="image"></div></button><button aria-pressed="false" class="base-button base-button--default base-button--enabled explore-tab__format-card explore-tab__format-card--inactive" tabindex="0" aria-disabled="false" data-testid="explore-format-tale-book" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__format-card-title">Tale Book</span><div class="explore-tab__format-card-image-wrap"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/652cf296-b8ed-49b9-a100-dbd6e864e8c9.webp" loading="lazy" alt="" class="image explore-tab__format-card-image" data-testid="image"></div></button><button aria-pressed="false" class="base-button base-button--default base-button--enabled explore-tab__format-card explore-tab__format-card--inactive" tabindex="0" aria-disabled="false" data-testid="explore-format-aphorism" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-base explore-tab__format-card-title">Aphorism</span><div class="explore-tab__format-card-image-wrap"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/37882b13-ccb7-4433-a0b3-c203c122e830.webp" loading="lazy" alt="" class="image explore-tab__format-card-image" data-testid="image"></div></button></div><div class="explore-tab__values"><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__values-heading">Create stories in seconds</h2><div class="explore-tab__values-grid"><div class="explore-tab__value-card"><div class="explore-tab__value-card-media"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/492ef68b-1fb6-41be-920f-ce9f2b2ff8aa.webp" loading="lazy" alt="" class="image explore-tab__value-card-image" data-testid="image"></div><div class="explore-tab__value-card-content"><div class="explore-tab__value-card-heading"><div class="explore-tab__value-card-number">1.</div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__value-card-title">Choose your format</h3></div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__value-card-body">Watch your story come to life as a 15-second video reel, a 30-second episode, or a digital flip book.</p></div></div><div class="explore-tab__value-card"><div class="explore-tab__value-card-media"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/c214bc8b-f298-4773-9ac4-62fbe8bdfd40.webp" loading="lazy" alt="" class="image explore-tab__value-card-image" data-testid="image"></div><div class="explore-tab__value-card-content"><div class="explore-tab__value-card-heading"><div class="explore-tab__value-card-number">2.</div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__value-card-title">Add your characters</h3></div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__value-card-body">Upload photos of yourself, friends, family, or even pets! Name your characters to make them the stars of your story.</p></div></div><div class="explore-tab__value-card"><div class="explore-tab__value-card-media"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/5610752d-773a-4aa4-8120-d734b3eeea62.webp" loading="lazy" alt="" class="image explore-tab__value-card-image" data-testid="image"></div><div class="explore-tab__value-card-content"><div class="explore-tab__value-card-heading"><div class="explore-tab__value-card-number">3.</div><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__value-card-title">Shape your story</h3></div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__value-card-body">Pick the setting, genre, and art style, then dream up your own plot for one-of-a-kind adventures to share with friends.</p></div></div></div></div><div class="explore-tab__story-formats"><div class="explore-tab__story-formats-heading-block"><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__story-formats-heading">Tell the story your way</h2><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__story-formats-subtitle">Watch it as a quick reel, unfold it as an episode, or flip through it as a digital book — every story finds its perfect format.</p></div><div class="explore-tab__story-formats-grid"><div class="explore-tab__story-format-card"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/23bde834-f574-4f34-805e-a33d0b0631ed.webp" loading="lazy" alt="" class="image explore-tab__story-format-card-image" data-testid="image"><div class="explore-tab__story-format-card-content"><div class="explore-tab__story-format-card-heading"><span class="explore-tab__story-format-card-badge"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M2.706 2c.39 0 .706.318.706.709V21.29a.71.71 0 0 1-.706.709A.71.71 0 0 1 2 21.29V2.71c0-.393.317-.71.706-.71m17.882.709c0-.392.317-.709.706-.709.39 0 .706.318.706.709V21.29a.71.71 0 0 1-.706.709.71.71 0 0 1-.706-.709zM5 3.18c.39 0 .706.318.706.709v16.219a.71.71 0 0 1-.706.708.71.71 0 0 1-.706-.708V3.888c0-.391.317-.708.706-.708m13.294.71c0-.391.317-.708.706-.708.39 0 .706.318.706.708v16.22a.71.71 0 0 1-.706.708.71.71 0 0 1-.706-.708zM8.526 4h6.942c1.04 0 1.884.846 1.884 1.89v12.22c0 1.044-.843 1.89-1.884 1.89H8.526a1.887 1.887 0 0 1-1.884-1.89V5.89c0-1.044.844-1.89 1.884-1.89M9 5.42a.944.944 0 0 0-.942.946V17.64c0 .522.422.945.942.945h6c.52 0 .943-.423.943-.945V6.366A.944.944 0 0 0 15 5.42z"></path><path d="M10.438 10.601c0-.481.533-.767.927-.497l1.937 1.328a.604.604 0 0 1 0 .993l-1.937 1.327a.594.594 0 0 1-.927-.496z"></path></svg></span><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__story-format-card-title">Reels</h3></div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__story-format-card-body">Short-form 15 second adventures, perfect for sharing on your socials. Try different genres, art styles and plots to find your vibe.</p><div class="explore-tab__story-format-card-actions"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="format-card-create-reels"><span class="button__content"><span class="button__text">Create a Reel</span></span></button><button type="button" class="button button--large button--skin-white button--outline button--default-state button--interactive button--cursor-pointer" data-testid="format-card-inspire-reels"><span class="button__content"><span class="button__text">See inspiration</span></span></button></div></div></div><div class="explore-tab__story-format-card"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/efc34170-4fee-4f87-8b2e-6074573cc0f0.webp" loading="lazy" alt="" class="image explore-tab__story-format-card-image" data-testid="image"><div class="explore-tab__story-format-card-content"><div class="explore-tab__story-format-card-heading"><span class="explore-tab__story-format-card-badge"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M6.009 2Q4.345 2 3.175 3.171T2.004 6.005v11.99q0 1.663 1.17 2.834Q4.346 21.999 6.01 22H18q1.663 0 2.834-1.171 1.17-1.171 1.17-2.834V6.005q0-1.663-1.17-2.834Q19.662 2.001 17.999 2zm11.99 1.499q1.03 0 1.757.726t.749 1.757H3.503a2.48 2.48 0 0 1 .75-1.756A2.4 2.4 0 0 1 6.01 3.5zM3.503 17.995V7.48h17.002v10.515q0 1.03-.75 1.78a2.4 2.4 0 0 1-1.756.726H6.009a2.46 2.46 0 0 1-1.78-.726 2.46 2.46 0 0 1-.725-1.779z"></path><path d="M9.498 16.216v-5.035q0-.586.492-.866.492-.306 1.007 0l4.426 2.529q.492.281.492.866a.92.92 0 0 1-.515.866l-4.426 2.506a.93.93 0 0 1-.984 0q-.492-.305-.492-.866"></path></svg></span><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__story-format-card-title">Videos</h3></div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__story-format-card-body">Watch your plot come to life in a 30 second video, perfect for sharing with family and friends.</p><div class="explore-tab__story-format-card-actions"><button type="button" class=
7805"button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="format-card-create-episodes"><span class="button__content"><span class="button__text">Create a Video</span></span></button><button type="button" class="button button--large button--skin-white button--outline button--default-state button--interactive button--cursor-pointer" data-testid="format-card-inspire-episodes"><span class="button__content"><span class="button__text">See inspiration</span></span></button></div></div></div><div class="explore-tab__story-format-card"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/6bccd11e-d628-424e-9982-cee030488455.webp" loading="lazy" alt="" class="image explore-tab__story-format-card-image" data-testid="image"><div class="explore-tab__story-format-card-content"><div class="explore-tab__story-format-card-heading"><span class="explore-tab__story-format-card-badge"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M2.001 7.22q0-.916.35-1.722a4.44 4.44 0 0 1 2.352-2.353 4.3 4.3 0 0 1 1.721-.349h1.852q1.176 0 2.156.567c.637.347 1.176.85 1.569 1.46a4.3 4.3 0 0 1 1.569-1.46 4.23 4.23 0 0 1 2.156-.567h1.852q.914 0 1.722.35c.524.222.998.549 1.393.958.41.396.735.87.958 1.394Q22 6.303 22 7.219v7.428q0 .915-.349 1.722a4.44 4.44 0 0 1-2.352 2.352 4.3 4.3 0 0 1-1.722.35h-2.179c-.405 0-.8.08-1.176.24a2.8 2.8 0 0 0-.96.631L12 21.204l-1.264-1.264a2.8 2.8 0 0 0-.98-.632 2.8 2.8 0 0 0-1.154-.239H6.423a4.3 4.3 0 0 1-1.721-.349 4.7 4.7 0 0 1-1.416-.937 4.7 4.7 0 0 1-.937-1.415A4.3 4.3 0 0 1 2 14.648zm9.302 0q0-1.264-.892-2.135a2.87 2.87 0 0 0-2.136-.894H6.423q-1.242 0-2.135.893-.892.873-.892 2.135v7.428q0 1.242.892 2.135.893.892 2.135.892h2.179q.74 0 1.437.241.698.24 1.263.675zm1.394 11.371a4.4 4.4 0 0 1 1.264-.675 4.4 4.4 0 0 1 1.437-.24h2.178q1.241 0 2.135-.893.892-.893.892-2.135V7.22q0-1.263-.892-2.134-.893-.894-2.135-.894h-1.852q-1.264 0-2.156.893-.872.873-.872 2.135z"></path></svg></span><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__story-format-card-title">Books</h3></div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__story-format-card-body">Become the star of personalized digital flip books. Add pages and narration to build on your story and share with friends.</p><div class="explore-tab__story-format-card-actions"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="format-card-create-books"><span class="button__content"><span class="button__text">Create a Book</span></span></button><button type="button" class="button button--large button--skin-white button--outline button--default-state button--interactive button--cursor-pointer" data-testid="format-card-inspire-books"><span class="button__content"><span class="button__text">See inspiration</span></span></button></div></div></div><div class="explore-tab__story-format-card"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/39588b74-12f3-453c-86f0-293e7db7ff37.webp" loading="lazy" alt="" class="image explore-tab__story-format-card-image" data-testid="image"><div class="explore-tab__story-format-card-content"><div class="explore-tab__story-format-card-heading"><span class="explore-tab__story-format-card-badge"><svg width="20" height="20" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M21.99 2.66a.74.74 0 0 1-.143.576.88.88 0 0 1-.506.313q-2.21.36-3.46 1.08-1.249.698-1.896 1.754a6.7 6.7 0 0 0-.673 1.538q-.26.947-.36 1.923.48-.314 1.008-.482a4 4 0 0 1 1.153-.167h1.034q1.585 0 2.714 1.129 1.129 1.106 1.13 2.715v5.117q0 1.586-1.13 2.714Q19.73 22 18.146 22h-1.033q-1.585 0-2.713-1.13-1.13-1.129-1.13-2.714v-5.117q0-2.308.264-4.18.288-1.876 1.13-3.268a6.46 6.46 0 0 1 2.475-2.306q1.56-.864 3.964-1.273a.7.7 0 0 1 .551.143.84.84 0 0 1 .335.505m-11.304.3a.7.7 0 0 0 .012-.303.74.74 0 0 0-.312-.505.74.74 0 0 0-.577-.143q-2.379.41-3.964 1.273a6.3 6.3 0 0 0-2.451 2.306q-.864 1.393-1.129 3.268Q2 10.731 2 13.036v5.117q0 1.586 1.13 2.714 1.129 1.13 2.714 1.13h1.033q1.586 0 2.714-1.13 1.13-1.129 1.13-2.714v-5.117q0-1.609-1.13-2.715-1.129-1.129-2.714-1.129H5.844q-.6 0-1.153.167a3.7 3.7 0 0 0-1.009.482q.1-.976.36-1.923.24-.864.672-1.538.625-1.056 1.875-1.753 1.249-.722 3.483-1.08a.78.78 0 0 0 .481-.314.8.8 0 0 0 .131-.273z"></path></svg></span><h3 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__story-format-card-title">Aphorisms</h3></div><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t4 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__story-format-card-body">Choose an art style and add your favorite quote to share 15 seconds of wisdom with friends.</p><div class="explore-tab__story-format-card-actions"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="format-card-create-aphorisms"><span class="button__content"><span class="button__text">Create an Aphorism</span></span></button><button type="button" class="button button--large button--skin-white button--outline button--default-state button--interactive button--cursor-pointer" data-testid="format-card-inspire-aphorisms"><span class="button__content"><span class="button__text">See inspiration</span></span></button></div></div></div></div></div><div class="explore-tab__templates"><div class="explore-tab__templates-heading-block"><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__templates-heading">Story Templates</h2><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__templates-subtitle">Add your photo and become the star of the adventure.</p></div><div class="explore-tab__templates-body"><div class="explore-tab__templates-controls"><div class="explore-tab__templates-filter-cluster"><div class="explore-tab__templates-chip-row"><button type="button" data-is-active="true" class="chip chip--small chip--skin-negative-active" data-testid="explore-template-chip-all" aria-pressed="true" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">All</span></div></div></button><button type="button" data-is-active="false" class="chip chip--small chip--skin-default" data-testid="explore-template-chip-reels" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Reels</span></div></div></button><button type="button" data-is-active="false" class="chip chip--small chip--skin-default" data-testid="explore-template-chip-aphorisms" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Aphorisms</span></div></div></button><button type="button" data-is-active="false" class="chip chip--small chip--skin-default" data-testid="explore-template-chip-videos" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Videos</span></div></div></button><button type="button" data-is-active="false" class="chip chip--small chip--skin-default" data-testid="explore-template-chip-books" aria-pressed="false" aria-busy="false"><div class="chip__interactive-area" data-testid="container-icon"><div class="chip__text-wrap"><span class="chip__text">Books</span></div></div></button></div></div><button type="button" class="button button--large button--skin-negative button--text button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="explore-templates-see-more"><span class="button__content"><span class="button__text">See more</span></span></button></div><div class="explore-tab__template-grid"><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-rain-check"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Rain Check" data-testid="story-template-rain-check-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/09323133-ae51-49a6-afef-e35a51073300.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-rain-check-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-singing-mermaid"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Singing Mermaid" data-testid="story-template-the-singing-mermaid-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/2c1cd402-420f-4238-80e0-dedf1ebcb374.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-singing-mermaid-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-dragon-at-the-gate"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Dragon at the Gate" data-testid="story-template-the-dragon-at-the-gate-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/5ddd416f-c85d-4284-804b-89bbf56d1ca8.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-dragon-at-the-gate-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-aphorism-success-mindset"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Success Mindset" data-testid="story-template-aphorism-success-mindset-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/646a0cb9-393d-47b5-bf9f-a4b04d9a2013.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-aphorism-success-mindset-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-aphorism-rise-again"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Rise Again" data-testid="story-template-aphorism-rise-again-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/6be8dcff-af81-4944-b34c-26f237c5ff8e.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-aphorism-rise-again-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-table-for-two"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Table for Two" data-testid="story-template-table-for-two-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/9897be83-4157-4088-8727-02556f4743c7.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-table-for-two-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-one-step-then-another"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open One Step, Then Another" data-testid="story-template-one-step-then-another-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/b92b830b-7ca1-4f67-abd1-a25c72aad174.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-one-step-then-another-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-star-who-overslept"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Star Who Overslept" data-testid="story-template-the-star-who-overslept-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/3ac4f627-5d1b-43f6-8501-f4bc460f8187.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-star-who-overslept-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-robot-wh
7805o-wanted-a-pet"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Robot Who Wanted a Pet" data-testid="story-template-the-robot-who-wanted-a-pet-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/86146b86-602c-49e6-86e8-b9c9189922b5.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-robot-who-wanted-a-pet-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-balloon-postman"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Balloon Postman" data-testid="story-template-the-balloon-postman-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/749058bc-861e-4e65-a010-1c530e273c33.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-balloon-postman-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-lost-puppy"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Lost Puppy" data-testid="story-template-the-lost-puppy-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/9b8bbeb0-e547-4465-b123-4e40e2c6775f.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-lost-puppy-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-clockwork-tide"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Clockwork Tide" data-testid="story-template-the-clockwork-tide-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/fb73a20d-f10e-4cb4-8111-18ec92068c53.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-clockwork-tide-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-midnight-broadcast"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Midnight Broadcast" data-testid="story-template-the-midnight-broadcast-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/91c7905a-ab24-4262-a100-60fd57eebfbb.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-midnight-broadcast-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-lantern-that-lost-its-light"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Lantern That Lost Its Light" data-testid="story-template-the-lantern-that-lost-its-light-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/391f6461-d94e-4e9a-acac-21eafdaf22f5.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-lantern-that-lost-its-light-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-aphorism-wisdom-of-age"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Wisdom of Age" data-testid="story-template-aphorism-wisdom-of-age-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/7a9cb63c-11fd-45b0-a571-a601ab536bb3.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-aphorism-wisdom-of-age-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-football-champions"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Football Champions" data-testid="story-template-football-champions-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/7d72911c-c6fa-46c3-88c7-354c99e28527.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-football-champions-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-last-spellslinger"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Last Spellslinger" data-testid="story-template-the-last-spellslinger-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/4f89f2dc-bab5-4b26-9a1c-1614a0542db5.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-last-spellslinger-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-aphorism-bravery"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Bravery" data-testid="story-template-aphorism-bravery-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/a0a429ee-19c5-4d36-b6b0-fb7cdcc5100f.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-aphorism-bravery-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-book-that-asked"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Book That Asked" data-testid="story-template-the-book-that-asked-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/e715d5b0-78cf-4e1c-b066-fb2363b75999.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-book-that-asked-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-thank-you-cactus"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Thank-You Cactus" data-testid="story-template-the-thank-you-cactus-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/d6dc0c51-7a29-46a1-8893-8311eb59ecf8.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-thank-you-cactus-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-snow-day-mystery"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Snow Day Mystery" data-testid="story-template-the-snow-day-mystery-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/9625125c-3c19-43a7-9383-ed8c617fdc40.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-snow-day-mystery-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-cavern-of-quiet-songs"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Cavern of Quiet Songs" data-testid="story-template-the-cavern-of-quiet-songs-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/3a5c07d7-cace-44f0-b9d9-530f0903c37c.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-cavern-of-quiet-songs-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-ghost-in-my-homework"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Ghost in My Homework" data-testid="story-template-the-ghost-in-my-homework-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/d5713239-a787-46e8-bb33-9e04e7
78057ff9f3.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-ghost-in-my-homework-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-mitten-swap"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Mitten Swap" data-testid="story-template-the-mitten-swap-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/94ecf6a7-921a-4781-92b8-39e5d65e9a96.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-mitten-swap-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-aphorism-on-failure"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open On Failure" data-testid="story-template-aphorism-on-failure-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/b9a13742-7f75-4d32-bf39-2dcc3d63b6ac.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-aphorism-on-failure-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-dust-runner"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Dust Runner" data-testid="story-template-dust-runner-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/ead73a64-b7d3-4d28-827c-25d97f94fd1e.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-dust-runner-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-hollow-crown"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Hollow Crown" data-testid="story-template-hollow-crown-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/1b989b00-a447-456e-a39c-a338b2c58a50.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-hollow-crown-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-capes-don-t-do-mondays"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Capes Don't Do Mondays" data-testid="story-template-capes-don-t-do-mondays-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/b0477522-102a-4c9b-a725-a79f6b85b1af.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-capes-don-t-do-mondays-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-my-human-must-never-know"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open My Human Must Never Know" data-testid="story-template-my-human-must-never-know-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/ee771349-4b37-452c-9fee-1f921497b3fa.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-my-human-must-never-know-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-borrowed-bakery"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Borrowed Bakery" data-testid="story-template-the-borrowed-bakery-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/665b0ab1-605a-499c-8e10-0636184e621f.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-borrowed-bakery-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-wishing-tree-at-the-end-of-the-world"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Wishing Tree at the End of the World" data-testid="story-template-the-wishing-tree-at-the-end-of-the-world-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/d06fc494-23b9-4462-bdd6-a3b3ad6667bc.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-wishing-tree-at-the-end-of-the-world-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-starfall-requiem"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Starfall Requiem" data-testid="story-template-starfall-requiem-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/cb340f17-286b-4994-bd36-501f2a5acdf5.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-starfall-requiem-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-ice-cream-volcano"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Ice Cream Volcano" data-testid="story-template-the-ice-cream-volcano-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/337c319b-1902-4a60-8479-b135f335ce6d.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-ice-cream-volcano-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-signal"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Signal" data-testid="story-template-the-signal-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/bfa32369-dc57-4f0b-b35b-f5ff0ea0eab0.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-signal-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-note-in-locker-118"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Note in Locker 118" data-testid="story-template-the-note-in-locker-118-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/62baec7b-b298-47f9-8c47-38
78050e0ffbd28a.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-note-in-locker-118-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-great-cafeteria-heist"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Great Cafeteria Heist" data-testid="story-template-the-great-cafeteria-heist-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/f610e55b-9a27-488a-8bb7-c0cc9e8dda9f.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-great-cafeteria-heist-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-sixty-floors-down"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Sixty Floors Down" data-testid="story-template-sixty-floors-down-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/5ea6ce5c-67ac-4764-91d7-810be32727a3.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-sixty-floors-down-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-bravest-bubble"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Bravest Bubble" data-testid="story-template-the-bravest-bubble-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/665cf839-543c-40b3-96b2-88838f326fba.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-bravest-bubble-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-great-snack-heist"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Great Snack Heist" data-testid="story-template-the-great-snack-heist-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/914f110e-9eaf-4281-aed4-93f34d58831f.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-great-snack-heist-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-knock-at-3-33"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Knock at 3:33" data-testid="story-template-the-knock-at-3-33-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/713943ae-
7805a0cc-4d7f-a53b-fa3574e785db.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-knock-at-3-33-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-birthday-wish-on-a-star"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Birthday Wish on a Star" data-testid="story-template-birthday-wish-on-a-star-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/877abe8f-90eb-4bc4-b580-e1850891e287.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-birthday-wish-on-a-star-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-last-track"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Last Track" data-testid="story-template-the-last-track-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/993c7095-cdab-4113-956d-ca9fe3e5c6a3.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-last-track-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-space-camp-rescue"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open Space Camp Rescue" data-testid="story-template-space-camp-rescue-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/916712e9-3c8f-43ce-8875-be329596d178.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-space-camp-rescue-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-umbrella-that-knew-too-much"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Umbrella That Knew Too Much" data-testid="story-template-the-umbrella-that-knew-too-much-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/0ede7ee7-0fe7-4d7d-a227-ec57430444db.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-umbrella-that-knew-too-much-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-dragon-who-was-scared-of-fire"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Dragon Who Was Scared of Fire" data-testid="story-template-the-dragon-who-was-scared-of-fire-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/9028240a-53ea-4127-a358-c1502ce96a2e.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-dragon-who-was-scared-of-fire-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-door-in-the-old-oak"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Door in the Old Oak" data-testid="story-template-the-door-in-the-old-oak-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/0b705366-e5a6-44a2-8d9d-cad40006cc95.jpg?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-door-in-the-old-oak-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div><div class="explore-tab__template-card explore-tab__template-card--clickable" data-testid="story-template-the-night-watch-puppy"><div class="explore-tab__template-card-hit" role="button" tabindex="0" aria-label="Open The Night Watch Puppy" data-testid="story-template-the-night-watch-puppy-hit"><img src="https://cdn-cms-uploads.picsart.com/cms-uploads/9a39b660-416a-4c4a-9552-9710131e9712.png?to=max&amp;r=400&amp;format=webp" loading="lazy" alt="" class="image explore-tab__template-card-img" data-testid="image"></div><div class="explore-tab__template-card-overlay"><button type="button" class="button button--large button--skin-white button--no-border button--default-state button--interactive button--cursor-pointer" data-testid="story-template-the-night-watch-puppy-try"><span class="button__content"><span class="button__text">Try your own</span></span></button></div></div></div></div></div><div class="explore-tab__faq"><h2 data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t5 text--weight-normal text--font-gilroy text--color-base explore-tab__faq-title">Frequently Asked Questions</h2><ul class="list explore-tab__faq-list" data-testid="list" style="gap: 8px;"><li class="list-item explore-tab__faq-item" data-testid="list-item"><button aria-expanded="false" class="base-button base-button--default base-button--enabled explore-tab__faq-question" tabindex="0" aria-disabled="false" data-testid="explore-faq-item-0" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t6 text--weight-medium text--font-gilroy text--color-base">What is ComicMe?</span><svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="explore-tab__faq-chevron"><path d="M4.242 7.938a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217L12 14.61l6.672-6.672a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217.75.75 0 0 1 .179.861.8.8 0 0 1-.178.253l-6.84 6.84a1.26 1.26 0 0 1-.917.386q-.532 0-.918-.387l-6.84-6.84A.77.77 0 0 1 4 8.495q0-.314.242-.557"></path></svg></button><div class="explore-tab__faq-answer-wrap"><div class="explore-tab__faq-answer-inner"><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__faq-answer">ComicMe is an AI-powered platform and app created by Picsart that transforms ordinary photos into personalized multi-page comic books, fairy tales, and illustrated story videos. It allows users to turn themselves, friends, or children into graphic novel or storybook characters without needing any drawing or writing skills.</p></div></div></li><li class="list-item explore-tab__faq-item" data-testid="list-item"><button aria-expanded="false" class="base-button base-button--default base-button--enabled explore-tab__faq-question" tabindex="0" aria-disabled="false" data-testid="explore-faq-item-1" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t6 text--weight-medium text--font-gilroy text--color-base">
7805How do I get started with ComicMe?</span><svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="explore-tab__faq-chevron"><path d="M4.242 7.938a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217L12 14.61l6.672-6.672a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217.75.75 0 0 1 .179.861.8.8 0 0 1-.178.253l-6.84 6.84a1.26 1.26 0 0 1-.917.386q-.532 0-.918-.387l-6.84-6.84A.77.77 0 0 1 4 8.495q0-.314.242-.557"></path></svg></button><div class="explore-tab__faq-answer-wrap"><div class="explore-tab__faq-answer-inner"><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__faq-answer">Upload a photo of your hero, optionally add a nemesis, then select a genre, art style, tone, premise, and language. ComicMe uses AI to generate a personalized comic-style story based on your choices.</p></div></div></li><li class="list-item explore-tab__faq-item" data-testid="list-item"><button aria-expanded="false" class="base-button base-button--default base-button--enabled explore-tab__faq-question" tabindex="0" aria-disabled="false" data-testid="explore-faq-item-2" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t6 text--weight-medium text--font-gilroy text--color-base">Can I use my own photos?</span><svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="explore-tab__faq-chevron"><path d="M4.242 7.938a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217L12 14.61l6.672-6.672a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217.75.75 0 0 1 .179.861.8.8 0 0 1-.178.253l-6.84 6.84a1.26 1.26 0 0 1-.917.386q-.532 0-.918-.387l-6.84-6.84A.77.77 0 0 1 4 8.495q0-.314.242-.557"></path></svg></button><div class="explore-tab__faq-answer-wrap"><div class="explore-tab__faq-answer-inner"><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__faq-answer">Yes. ComicMe is designed to turn your own photo into a comic book-style character and story.</p></div></div></li><li class="list-item explore-tab__faq-item" data-testid="list-item"><button aria-expanded="false" class="base-button base-button--default base-button--enabled explore-tab__faq-question" tabindex="0" aria-disabled="false" data-testid="explore-faq-item-3" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t6 text--weight-medium text--font-gilroy text--color-base">What formats can I export to?</span><svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="explore-tab__faq-chevron"><path d="M4.242 7.938a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217L12 14.61l6.672-6.672a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217.75.75 0 0 1 .179.861.8.8 0 0 1-.178.253l-6.84 6.84a1.26 1.26 0 0 1-.917.386q-.532 0-.918-.387l-6.84-6.84A.77.77 0 0 1 4 8.495q0-.314.242-.557"></path></svg></button><div class="explore-tab__faq-answer-wrap"><div class="explore-tab__faq-answer-inner"><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__faq-answer">You can read your story as a flip book, download it as a PDF or a set of images for printing, or turn it into a narrated video and a social-ready reel.</p></div></div></li><li class="list-item explore-tab__faq-item" data-testid="list-item"><button aria-expanded="false" class="base-button base-button--default base-button--enabled explore-tab__faq-question" tabindex="0" aria-disabled="false" data-testid="explore-faq-item-4" type="button"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t6 text--weight-medium text--font-gilroy text--color-base">Can I use my Credits with all Picsart apps?</span><svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="explore-tab__faq-chevron"><path d="M4.242 7.938a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217L12 14.61l6.672-6.672a.75.75 0 0 1 .556-.217.72.72 0 0 1 .53.217.75.75 0 0 1 .179.861.8.8 0 0 1-.178.253l-6.84 6.84a1.26 1.26 0 0 1-.917.386q-.532 0-.918-.387l-6.84-6.84A.77.77 0 0 1 4 8.495q0-.314.242-.557"></path></svg></button><div class="explore-tab__faq-answer-wrap"><div class="explore-tab__faq-answer-inner"><p data-testid="text" class="base-text base-text--font-gilroy base-text--weight-medium text text--t5 text--weight-medium text--font-gilroy text--color-tint-1 explore-tab__faq-answer">Yes. Credits belong to your Picsart account, so you can spend them in ComicMe and across Picsart’s other AI-powered a
7805pps and tools.</p></div></div></li></ul></div></div></div></div><div class="desktop-content-panel__footer"><span data-testid="text" class="base-text base-text--font-gilroy base-text--weight-normal text text--t3 text--weight-normal text--font-gilroy text--color-base desktop-content-panel__faq-help-text">Need help?</span><a data-testid="ihero-desktop-content-panel-faq-link" class="base-link base-link--font-gilroy base-link--weight-normal link link--font-gilroy link--t3 link--weight-normal link--color-primary link--underline desktop-content-panel__faq-link" href="#" tabindex="0">Frequently Asked Questions</a></div></div></div></div></div></section></div></div></div></div>
7806  
7807
7808<script type="module" src="/assets/index-HF9S6n1b.js"></script>
vendor: 1 bytes, line 7808
7808
7809<script>(function(){function c(){var b=a.contentDocument||(a.contentWindow&&a.contentWindow.document);if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'a4551e142d111e95',t:'MTc5MTEyNjY2OQ=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
7809<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"0d0271b5debd4078be89b0628bbe2623","r":1,"spa":2}' crossorigin="anonymous"></script>
7809
7810</body></html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.