/* /app/styles/app.css */ /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */ @layer properties; @font-face { font-family: 'Bricolage Grotesque Variable'; font-style: normal; font-display: swap; font-weight: 200 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/bricolage-grotesque/files/bricolage-grotesque-vietnamese-opsz-normal.woff2) format('woff2-variations'); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; } @font-face { font-family: 'Bricolage Grotesque Variable'; font-style: normal; font-display: swap; font-weight: 200 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/bricolage-grotesque/files/bricolage-grotesque-latin-ext-opsz-normal.woff2) format('woff2-variations'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; } @font-face { font-family: 'Bricolage Grotesque Variable'; font-style: normal; font-display: swap; font-weight: 200 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/bricolage-grotesque/files/bricolage-grotesque-latin-opsz-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; } @font-face { font-family: 'Instrument Sans Variable'; font-style: normal; font-display: swap; font-weight: 400 700; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/instrument-sans/files/instrument-sans-latin-ext-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; } @font-face { font-family: 'Instrument Sans Variable'; font-style: normal; font-display: swap; font-weight: 400 700; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/instrument-sans/files/instrument-sans-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; } @font-face { font-family: 'JetBrains Mono Variable'; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/jetbrains-mono/files/jetbrains-mono-cyrillic-ext-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; } @font-face { font-family: 'JetBrains Mono Variable'; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/jetbrains-mono/files/jetbrains-mono-cyrillic-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; } @font-face { font-family: 'JetBrains Mono Variable'; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/jetbrains-mono/files/jetbrains-mono-greek-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF; } @font-face { font-family: 'JetBrains Mono Variable'; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/jetbrains-mono/files/jetbrains-mono-vietnamese-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; } @font-face { font-family: 'JetBrains Mono Variable'; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/jetbrains-mono/files/jetbrains-mono-latin-ext-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; } @font-face { font-family: 'JetBrains Mono Variable'; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/@fs/Users/johannbuscail/projects/code/warmup-farm/node_modules/@fontsource-variable/jetbrains-mono/files/jetbrains-mono-latin-wght-normal.woff2) format('woff2-variations'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; } @layer theme, base, components, utilities; @layer theme { :root, :host { --spacing: 2.8px; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --font-weight-extrabold: 800; --leading-tight: 1.45; --leading-snug: 1.5; --leading-normal: normal; --leading-relaxed: 1.625; --radius-xs: 2px; --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px; --radius-xl: 16px; --radius-2xl: 1rem; --ease-out: cubic-bezier(0, 0, 0.2, 1); --animate-spin: spin 1s linear infinite; --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; --blur-sm: 8px; --default-transition-duration: 150ms; --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --default-mono-font-family: var(--font-mono); --color-chrome: #202023; --color-sidebar: #1a1a1d; --color-bg: #141416; --color-rail: #0f0f11; --color-card: #1b1b1f; --color-well: #18181b; --color-field: #1e1e22; --color-raised: #222226; --color-control: #26262b; --color-control-hover: #2c2c31; --color-selected: #2a2a2f; --color-selected-strong: #34343a; --color-tab: #2f2f34; --color-scrim: rgb(8 8 10 / 60%); --color-hairline: rgb(255 255 255 / 7%); --color-hairline-strong: rgb(255 255 255 / 13%); --color-text: #f2f2ef; --color-text-2: #b4b4ba; --color-text-3: #8b8b93; --color-accent: #c8f04a; --color-accent-ink: #0b0b0d; --color-accent-100: #f4fcd6; --color-accent-200: #e8f9ad; --color-accent-400: #d2f266; --color-accent-600: #a3c73a; --color-accent-700: #7c982b; --color-attention: #e9a13f; --color-ok: #3ddc97; --color-attention-ink: #2a1a04; --color-neutral-100: #f3f3f0; --color-neutral-200: #dedee0; --color-neutral-300: #c4c4c9; --color-neutral-400: #a7a7ad; --color-neutral-600: #6f6f78; --color-neutral-700: #55555d; --color-neutral-800: #3a3a42; --color-neutral-900: #1c1c21; --color-range-1: #35c5b8; --color-range-2: #e9a13f; --color-range-3: #5b8def; --color-range-1-ink: #06231f; --color-range-2-ink: #2a1a04; --color-range-3-ink: #f5f7ff; --color-app-tiktok: #f1f1f5; --color-app-instagram: #e1479a; --color-app-shorts: #ee3b34; --color-check: #4ad3ff; --color-today: #f0453b; --color-today-ink: #fff2f1; --color-bezel: #0b0b0c; --color-promo: #ec4a86; --color-promo-2: #b43fe0; --color-promo-ink: #fff4f8; --color-app-tiktok-ink: #14141a; --color-app-instagram-ink: #fff3f9; --color-app-shorts-ink: #fff1f0; --color-fam-look: #4cc3ff; --color-fam-touch: #8f93ff; --color-fam-phone: #d08bfa; --color-fam-flow: #3ddc97; --color-fam-values: #ff9f4a; --color-fam-values-ink: #ffb877; --color-fam-help: #ff7eb3; --font-display: "Bricolage Grotesque Variable", "Instrument Sans Variable", system-ui, sans-serif; --font-heading: "Instrument Sans Variable", system-ui, sans-serif; --font-body: "Instrument Sans Variable", system-ui, sans-serif; --font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular, Menlo, monospace; --text-micro: 10px; --text-mini: 11px; --text-tiny: 12px; --text-small: 13px; --text-row: 13.5px; --text-ui: 14px; --text-body: 15px; --text-body--line-height: 1.55; --text-md: 16px; --text-tile: 17px; --text-lead: 18px; --text-title: 28px; --text-title--line-height: 1; --text-title--letter-spacing: -0.03em; --text-page: 30px; --text-page--line-height: 1.15; --text-page--letter-spacing: -0.02em; --text-h4: 20px; --text-h4--letter-spacing: -0.015em; --text-h3: 25px; --text-h3--line-height: 1.12; --text-h3--letter-spacing: -0.015em; --text-h2: 32px; --text-h2--line-height: 1.12; --text-h2--letter-spacing: -0.015em; --text-display: 38px; --text-display--line-height: 1.12; --text-display--letter-spacing: -0.015em; --tracking-display: -0.03em; --tracking-heading: -0.015em; --tracking-tag: 0.02em; --tracking-label: 0.08em; --tracking-kicker: 0.1em; --tracking-mono: 0em; --leading-heading: 1.12; --leading-control: 1.2; --leading-body: 1.55; --radius-2xs: 1px; --radius-bar: 3px; --radius-mark: 5px; --radius-ctl: 6px; --radius-key: 7px; --radius-chip: 9px; --radius-btn: 10px; --radius-tab: 11px; --radius-tile: 13px; --radius-field: 14px; --radius-step: 15px; --radius-frame: 18px; --radius-card: 20px; --radius-sheet: 22px; --radius-screen: 23px; --radius-panel: 24px; --radius-bezel: 30px; --shadow-phone: 0 0 0 1px rgb(255 255 255 / 12%), 0 20px 40px rgb(0 0 0 / 45%); --ease-nocturne: cubic-bezier(0.2, 0.7, 0.2, 1); --animate-pop-in: pop-in 0.18s var(--ease-nocturne) both; --animate-onb-up: onb-up 0.45s var(--ease-nocturne) both; --animate-onb-pop: onb-pop 0.5s var(--ease-nocturne) both; --animate-onb-breathe: onb-breathe 2.6s ease-in-out infinite; --animate-onb-float: onb-float 5s ease-in-out infinite; --animate-onb-glow: onb-glow 7s ease-in-out infinite; } } @layer base { *, ::after, ::before, ::backdrop, ::file-selector-button { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; } html, :host { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; } hr { height: 0; color: inherit; border-top-width: 1px; } abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; -webkit-text-decoration: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings, normal); font-variation-settings: var(--default-mono-font-variation-settings, normal); font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } table { text-indent: 0; border-color: inherit; border-collapse: collapse; } :-moz-focusring:where(:not(iframe)) { outline: auto; } progress { vertical-align: baseline; } summary { display: list-item; } ol, ul, menu { list-style: none; } img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; } img, video { max-width: 100%; height: auto; } button, input, select, optgroup, textarea, ::file-selector-button { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; border-radius: 0; background-color: transparent; opacity: 1; } :where(select:is([multiple], [size])) optgroup { font-weight: bolder; } :where(select:is([multiple], [size])) optgroup option { padding-inline-start: 20px; } ::file-selector-button { margin-inline-end: 4px; } ::placeholder { opacity: 1; } @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) { ::placeholder { color: currentcolor; @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, currentcolor 50%, transparent); } } } textarea { resize: vertical; } ::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit-fields-wrapper { padding: 0; } ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { padding-block: 0; } ::-webkit-calendar-picker-indicator { line-height: 1; } :-moz-ui-invalid { box-shadow: none; } button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button { appearance: button; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } [hidden]:where(:not([hidden="until-found"])) { display: none !important; } } @layer utilities { .\@container\/page { container-type: inline-size; container-name: page; } .\@container\/script { container-type: inline-size; container-name: script; } .\@container\/toolbar { container-type: inline-size; container-name: toolbar; } .\@container { container-type: inline-size; } .\@container-size { container-type: size; } .pointer-events-auto { pointer-events: auto; } .pointer-events-none { pointer-events: none; } .collapse { visibility: collapse; } .invisible { visibility: hidden; } .visible { visibility: visible; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } .\!fixed { position: fixed !important; } .absolute { position: absolute; } .fixed { position: fixed; } .relative { position: relative; } .static { position: static; } .sticky { position: sticky; } .-inset-\[7px\] { inset: calc(7px * -1); } .inset-0 { inset: 0px; } .inset-\[3px\] { inset: 3px; } .inset-\[6px\] { inset: 6px; } .inset-\[10px\] { inset: 10px; } .inset-x-0 { inset-inline: 0px; } .inset-x-\[6px\] { inset-inline: 6px; } .inset-x-\[10px\] { inset-inline: 10px; } .inset-x-\[14px\] { inset-inline: 14px; } .-inset-y-\[3px\] { inset-block: calc(3px * -1); } .inset-y-0 { inset-block: 0px; } .inset-y-\[3px\] { inset-block: 3px; } .inset-y-\[6px\] { inset-block: 6px; } .-top-\[1\.5px\] { top: calc(1.5px * -1); } .-top-\[2px\] { top: calc(2px * -1); } .-top-\[3px\] { top: calc(3px * -1); } .-top-\[6px\] { top: calc(6px * -1); } .-top-\[10px\] { top: calc(10px * -1); } .-top-\[14px\] { top: calc(14px * -1); } .-top-\[34px\] { top: calc(34px * -1); } .-top-\[180px\] { top: calc(180px * -1); } .top-\(--t\) { top: var(--t); } .top-\(--y\) { top: var(--y); } .top-0 { top: 0px; } .top-1\/2 { top: calc(1 / 2 * 100%); } .top-3 { top: calc(var(--spacing) * 3); } .top-20 { top: calc(var(--spacing) * 20); } .top-\[1px\] { top: 1px; } .top-\[3px\] { top: 3px; } .top-\[4px\] { top: 4px; } .top-\[5px\] { top: 5px; } .top-\[6px\] { top: 6px; } .top-\[7px\] { top: 7px; } .top-\[8px\] { top: 8px; } .top-\[10px\] { top: 10px; } .top-\[12px\] { top: 12px; } .top-\[14px\] { top: 14px; } .top-\[24px\] { top: 24px; } .top-\[36px\] { top: 36px; } .top-\[62px\] { top: 62px; } .top-\[78px\] { top: 78px; } .top-\[84px\] { top: 84px; } .top-\[114px\] { top: 114px; } .top-\[116px\] { top: 116px; } .top-\[118px\] { top: 118px; } .top-auto { top: auto; } .top-full { top: 100%; } .-right-\[2px\] { right: calc(2px * -1); } .-right-\[4px\] { right: calc(4px * -1); } .-right-\[6px\] { right: calc(6px * -1); } .-right-\[10px\] { right: calc(10px * -1); } .-right-\[140px\] { right: calc(140px * -1); } .right-\(--aside\) { right: var(--aside); } .right-\(--right\) { right: var(--right); } .right-0 { right: 0px; } .right-3 { right: calc(var(--spacing) * 3); } .right-6 { right: calc(var(--spacing) * 6); } .right-\[-1\.5px\] { right: -1.5px; } .right-\[5px\] { right: 5px; } .right-\[6px\] { right: 6px; } .right-\[7px\] { right: 7px; } .right-\[10px\] { right: 10px; } .right-\[12px\] { right: 12px; } .right-\[14px\] { right: 14px; } .right-\[18px\] { right: 18px; } .right-full { right: 100%; } .-bottom-\[3px\] { bottom: calc(3px * -1); } .-bottom-\[4px\] { bottom: calc(4px * -1); } .-bottom-\[12px\] { bottom: calc(12px * -1); } .bottom-\(--lift\) { bottom: var(--lift); } .bottom-0 { bottom: 0px; } .bottom-6 { bottom: calc(var(--spacing) * 6); } .bottom-\[3px\] { bottom: 3px; } .bottom-\[4px\] { bottom: 4px; } .bottom-\[5px\] { bottom: 5px; } .bottom-\[6px\] { bottom: 6px; } .bottom-\[10px\] { bottom: 10px; } .bottom-\[12px\] { bottom: 12px; } .bottom-\[14px\] { bottom: 14px; } .bottom-\[16px\] { bottom: 16px; } .bottom-\[18px\] { bottom: 18px; } .bottom-\[22px\] { bottom: 22px; } .bottom-\[26px\] { bottom: 26px; } .bottom-full { bottom: 100%; } .-left-\[1\.5px\] { left: calc(1.5px * -1); } .-left-\[3px\] { left: calc(3px * -1); } .left-\(--l\) { left: var(--l); } .left-\(--x\) { left: var(--x); } .left-0 { left: 0px; } .left-1\/2 { left: calc(1 / 2 * 100%); } .left-4 { left: calc(var(--spacing) * 4); } .left-\[-1\.5px\] { left: -1.5px; } .left-\[2px\] { left: 2px; } .left-\[3px\] { left: 3px; } .left-\[4px\] { left: 4px; } .left-\[5px\] { left: 5px; } .left-\[6px\] { left: 6px; } .left-\[7px\] { left: 7px; } .left-\[10px\] { left: 10px; } .left-\[12px\] { left: 12px; } .left-\[14px\] { left: 14px; } .left-\[16px\] { left: 16px; } .left-\[17px\] { left: 17px; } .left-\[18px\] { left: 18px; } .left-\[calc\(50\%\+22px\)\] { left: calc(50% + 22px); } .left-full { left: 100%; } .z-1 { z-index: 1; } .z-2 { z-index: 2; } .z-3 { z-index: 3; } .z-10 { z-index: 10; } .z-15 { z-index: 15; } .z-20 { z-index: 20; } .z-30 { z-index: 30; } .z-40 { z-index: 40; } .z-50 { z-index: 50; } .z-\[1\] { z-index: 1; } .z-\[2\] { z-index: 2; } .z-\[3\] { z-index: 3; } .z-\[4\] { z-index: 4; } .z-\[70\] { z-index: 70; } .z-\[80\] { z-index: 80; } .z-\[90\] { z-index: 90; } .z-\[100\] { z-index: 100; } .col-span-\(--span\) { grid-column: span var(--span) / span var(--span); } .col-span-full { grid-column: 1 / -1; } .col-start-1 { grid-column-start: 1; } .col-start-2 { grid-column-start: 2; } .col-start-3 { grid-column-start: 3; } .row-start-1 { grid-row-start: 1; } .container { width: 100%; @media (width >= 40rem) { max-width: 40rem; } @media (width >= 48rem) { max-width: 48rem; } @media (width >= 64rem) { max-width: 64rem; } @media (width >= 80rem) { max-width: 80rem; } @media (width >= 96rem) { max-width: 96rem; } } .m-0 { margin: 0px; } .m-4 { margin: calc(var(--spacing) * 4); } .m-8 { margin: calc(var(--spacing) * 8); } .m-\[12px\] { margin: 12px; } .m-auto { margin: auto; } .-mx-\[8px\] { margin-inline: calc(8px * -1); } .-mx-\[10px\] { margin-inline: calc(10px * -1); } .mx-2 { margin-inline: calc(var(--spacing) * 2); } .mx-\[2px\] { margin-inline: 2px; } .mx-\[4px\] { margin-inline: 4px; } .mx-\[6px\] { margin-inline: 6px; } .mx-\[8px\] { margin-inline: 8px; } .mx-auto { margin-inline: auto; } .-my-\[4px\] { margin-block: calc(4px * -1); } .my-3 { margin-block: calc(var(--spacing) * 3); } .my-4 { margin-block: calc(var(--spacing) * 4); } .my-5 { margin-block: calc(var(--spacing) * 5); } .my-\[3px\] { margin-block: 3px; } .my-\[4px\] { margin-block: 4px; } .my-\[6px\] { margin-block: 6px; } .my-auto { margin-block: auto; } .-mt-2 { margin-top: calc(var(--spacing) * -2); } .-mt-\[2px\] { margin-top: calc(2px * -1); } .-mt-\[4px\] { margin-top: calc(4px * -1); } .-mt-\[6px\] { margin-top: calc(6px * -1); } .-mt-\[8px\] { margin-top: calc(8px * -1); } .mt-1 { margin-top: var(--spacing); } .mt-2 { margin-top: calc(var(--spacing) * 2); } .mt-3 { margin-top: calc(var(--spacing) * 3); } .mt-4 { margin-top: calc(var(--spacing) * 4); } .mt-5 { margin-top: calc(var(--spacing) * 5); } .mt-6 { margin-top: calc(var(--spacing) * 6); } .mt-7 { margin-top: calc(var(--spacing) * 7); } .mt-\[1px\] { margin-top: 1px; } .mt-\[2px\] { margin-top: 2px; } .mt-\[3px\] { margin-top: 3px; } .mt-\[4px\] { margin-top: 4px; } .mt-\[5px\] { margin-top: 5px; } .mt-\[6px\] { margin-top: 6px; } .mt-\[8px\] { margin-top: 8px; } .mt-\[9px\] { margin-top: 9px; } .mt-\[10px\] { margin-top: 10px; } .mt-\[12px\] { margin-top: 12px; } .mt-\[14px\] { margin-top: 14px; } .mt-\[15px\] { margin-top: 15px; } .mt-\[16px\] { margin-top: 16px; } .mt-\[18px\] { margin-top: 18px; } .mt-\[20px\] { margin-top: 20px; } .mt-\[22px\] { margin-top: 22px; } .mt-\[24px\] { margin-top: 24px; } .mt-\[26px\] { margin-top: 26px; } .mt-auto { margin-top: auto; } .mt-px { margin-top: 1px; } .-mr-2 { margin-right: calc(var(--spacing) * -2); } .-mr-\[6px\] { margin-right: calc(6px * -1); } .mr-1 { margin-right: var(--spacing); } .mr-\[8px\] { margin-right: 8px; } .mr-\[12px\] { margin-right: 12px; } .mr-auto { margin-right: auto; } .-mb-px { margin-bottom: -1px; } .mb-0 { margin-bottom: 0px; } .mb-1 { margin-bottom: var(--spacing); } .mb-2 { margin-bottom: calc(var(--spacing) * 2); } .mb-3 { margin-bottom: calc(var(--spacing) * 3); } .mb-\[2px\] { margin-bottom: 2px; } .mb-\[4px\] { margin-bottom: 4px; } .mb-\[6px\] { margin-bottom: 6px; } .mb-\[8px\] { margin-bottom: 8px; } .mb-\[10px\] { margin-bottom: 10px; } .mb-\[12px\] { margin-bottom: 12px; } .mb-\[14px\] { margin-bottom: 14px; } .mb-\[30px\] { margin-bottom: 30px; } .-ml-3 { margin-left: calc(var(--spacing) * -3); } .-ml-\[6px\] { margin-left: calc(6px * -1); } .-ml-\[8px\] { margin-left: calc(8px * -1); } .ml-\(--in\) { margin-left: var(--in); } .ml-\(--indent\) { margin-left: var(--indent); } .ml-0 { margin-left: 0px; } .ml-\[2px\] { margin-left: 2px; } .ml-\[4px\] { margin-left: 4px; } .ml-\[6px\] { margin-left: 6px; } .ml-\[8px\] { margin-left: 8px; } .ml-\[10px\] { margin-left: 10px; } .ml-\[26px\] { margin-left: 26px; } .ml-\[40\%\] { margin-left: 40%; } .ml-\[44px\] { margin-left: 44px; } .ml-\[50px\] { margin-left: 50px; } .ml-\[56px\] { margin-left: 56px; } .ml-auto { margin-left: auto; } .line-clamp-2 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .line-clamp-3 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } .block { display: block; } .contents { display: contents; } .flex { display: flex; } .grid { display: grid; } .hidden { display: none; } .inline { display: inline; } .inline-block { display: inline-block; } .inline-flex { display: inline-flex; } .table { display: table; } .field-sizing-content { field-sizing: content; } .aspect-\(--ar\) { aspect-ratio: var(--ar); } .aspect-\[3\/4\] { aspect-ratio: 3/4; } .aspect-\[4\/5\] { aspect-ratio: 4/5; } .aspect-\[16\/7\] { aspect-ratio: 16/7; } .aspect-\[143\/170\] { aspect-ratio: 143/170; } .aspect-square { aspect-ratio: 1 / 1; } .size-\(--t\) { width: var(--t); height: var(--t); } .size-\[5px\] { width: 5px; height: 5px; } .size-\[6px\] { width: 6px; height: 6px; } .size-\[7px\] { width: 7px; height: 7px; } .size-\[8px\] { width: 8px; height: 8px; } .size-\[9px\] { width: 9px; height: 9px; } .size-\[10px\] { width: 10px; height: 10px; } .size-\[11px\] { width: 11px; height: 11px; } .size-\[12px\] { width: 12px; height: 12px; } .size-\[13px\] { width: 13px; height: 13px; } .size-\[14px\] { width: 14px; height: 14px; } .size-\[15px\] { width: 15px; height: 15px; } .size-\[16px\] { width: 16px; height: 16px; } .size-\[18px\] { width: 18px; height: 18px; } .size-\[20px\] { width: 20px; height: 20px; } .size-\[22px\] { width: 22px; height: 22px; } .size-\[24px\] { width: 24px; height: 24px; } .size-\[26px\] { width: 26px; height: 26px; } .size-\[28px\] { width: 28px; height: 28px; } .size-\[30px\] { width: 30px; height: 30px; } .size-\[32px\] { width: 32px; height: 32px; } .size-\[34px\] { width: 34px; height: 34px; } .size-\[36px\] { width: 36px; height: 36px; } .size-\[38px\] { width: 38px; height: 38px; } .size-\[40px\] { width: 40px; height: 40px; } .size-\[42px\] { width: 42px; height: 42px; } .size-\[44px\] { width: 44px; height: 44px; } .size-\[52px\] { width: 52px; height: 52px; } .size-\[54px\] { width: 54px; height: 54px; } .size-\[84px\] { width: 84px; height: 84px; } .size-\[460px\] { width: 460px; height: 460px; } .size-full { width: 100%; height: 100%; } .h-\(--h\) { height: var(--h); } .h-0 { height: 0px; } .h-84 { height: calc(var(--spacing) * 84); } .h-\[3px\] { height: 3px; } .h-\[4px\] { height: 4px; } .h-\[5px\] { height: 5px; } .h-\[6px\] { height: 6px; } .h-\[7px\] { height: 7px; } .h-\[9px\] { height: 9px; } .h-\[10px\] { height: 10px; } .h-\[12px\] { height: 12px; } .h-\[13px\] { height: 13px; } .h-\[14px\] { height: 14px; } .h-\[16px\] { height: 16px; } .h-\[18px\] { height: 18px; } .h-\[20px\] { height: 20px; } .h-\[22px\] { height: 22px; } .h-\[24px\] { height: 24px; } .h-\[26px\] { height: 26px; } .h-\[28px\] { height: 28px; } .h-\[30px\] { height: 30px; } .h-\[32px\] { height: 32px; } .h-\[34px\] { height: 34px; } .h-\[36px\] { height: 36px; } .h-\[38px\] { height: 38px; } .h-\[40px\] { height: 40px; } .h-\[42px\] { height: 42px; } .h-\[44px\] { height: 44px; } .h-\[46px\] { height: 46px; } .h-\[48px\] { height: 48px; } .h-\[50px\] { height: 50px; } .h-\[52px\] { height: 52px; } .h-\[54px\] { height: 54px; } .h-\[56px\] { height: 56px; } .h-\[58px\] { height: 58px; } .h-\[62px\] { height: 62px; } .h-\[64px\] { height: 64px; } .h-\[70px\] { height: 70px; } .h-\[72px\] { height: 72px; } .h-\[78px\] { height: 78px; } .h-\[88px\] { height: 88px; } .h-\[90px\] { height: 90px; } .h-\[96px\] { height: 96px; } .h-\[104px\] { height: 104px; } .h-\[112px\] { height: 112px; } .h-\[126px\] { height: 126px; } .h-\[140px\] { height: 140px; } .h-\[150px\] { height: 150px; } .h-\[156px\] { height: 156px; } .h-\[160px\] { height: 160px; } .h-\[190px\] { height: 190px; } .h-\[222px\] { height: 222px; } .h-\[236px\] { height: 236px; } .h-\[240px\] { height: 240px; } .h-\[330px\] { height: 330px; } .h-\[440px\] { height: 440px; } .h-\[calc\(100vh-56px\)\] { height: calc(100vh - 56px); } .h-\[clamp\(240px\,calc\(\(100dvh-56px\)\*0\.49\)\,520px\)\] { height: clamp(240px, calc((100dvh - 56px) * 0.49), 520px); } .h-auto { height: auto; } .h-dvh { height: 100dvh; } .h-full { height: 100%; } .h-px { height: 1px; } .h-screen { height: 100vh; } .max-h-\[40vh\] { max-height: 40vh; } .max-h-\[45\%\] { max-height: 45%; } .max-h-\[56vh\] { max-height: 56vh; } .max-h-\[60\%\] { max-height: 60%; } .max-h-\[60vh\] { max-height: 60vh; } .max-h-\[200px\] { max-height: 200px; } .max-h-\[300px\] { max-height: 300px; } .max-h-\[320px\] { max-height: 320px; } .max-h-\[360px\] { max-height: 360px; } .max-h-\[calc\(100vh-120px\)\] { max-height: calc(100vh - 120px); } .max-h-\[calc\(100vh-140px\)\] { max-height: calc(100vh - 140px); } .max-h-\[min\(84vh\,760px\)\] { max-height: min(84vh, 760px); } .max-h-\[min\(86vh\,820px\)\] { max-height: min(86vh, 820px); } .max-h-\[min\(92vh\,680px\)\] { max-height: min(92vh, 680px); } .max-h-\[min\(92vh\,720px\)\] { max-height: min(92vh, 720px); } .max-h-\[min\(92vh\,780px\)\] { max-height: min(92vh, 780px); } .max-h-\[min\(640px\,calc\(100dvh-180px\)\)\] { max-height: min(640px, calc(100dvh - 180px)); } .max-h-full { max-height: 100%; } .max-h-none { max-height: none; } .min-h-0 { min-height: 0px; } .min-h-\[24px\] { min-height: 24px; } .min-h-\[26px\] { min-height: 26px; } .min-h-\[30px\] { min-height: 30px; } .min-h-\[32px\] { min-height: 32px; } .min-h-\[34px\] { min-height: 34px; } .min-h-\[36px\] { min-height: 36px; } .min-h-\[38px\] { min-height: 38px; } .min-h-\[40px\] { min-height: 40px; } .min-h-\[42px\] { min-height: 42px; } .min-h-\[44px\] { min-height: 44px; } .min-h-\[46px\] { min-height: 46px; } .min-h-\[48px\] { min-height: 48px; } .min-h-\[50px\] { min-height: 50px; } .min-h-\[52px\] { min-height: 52px; } .min-h-\[54px\] { min-height: 54px; } .min-h-\[56px\] { min-height: 56px; } .min-h-\[58px\] { min-height: 58px; } .min-h-\[60px\] { min-height: 60px; } .min-h-\[64px\] { min-height: 64px; } .min-h-\[72px\] { min-height: 72px; } .min-h-\[84px\] { min-height: 84px; } .min-h-\[92px\] { min-height: 92px; } .min-h-\[96px\] { min-height: 96px; } .min-h-\[110px\] { min-height: 110px; } .min-h-\[120px\] { min-height: 120px; } .min-h-\[130px\] { min-height: 130px; } .min-h-\[140px\] { min-height: 140px; } .min-h-\[150px\] { min-height: 150px; } .min-h-\[156px\] { min-height: 156px; } .min-h-\[240px\] { min-height: 240px; } .min-h-\[250px\] { min-height: 250px; } .min-h-\[360px\] { min-height: 360px; } .min-h-\[400px\] { min-height: 400px; } .min-h-\[420px\] { min-height: 420px; } .min-h-\[640px\] { min-height: 640px; } .min-h-screen { min-height: 100vh; } .w-\(--done\) { width: var(--done); } .w-\(--fill\) { width: var(--fill); } .w-\(--progress\) { width: var(--progress); } .w-\(--w\) { width: var(--w); } .w-0 { width: 0px; } .w-28 { width: calc(var(--spacing) * 28); } .w-\[1\.5px\] { width: 1.5px; } .w-\[1px\] { width: 1px; } .w-\[2px\] { width: 2px; } .w-\[6px\] { width: 6px; } .w-\[7px\] { width: 7px; } .w-\[8px\] { width: 8px; } .w-\[10px\] { width: 10px; } .w-\[12px\] { width: 12px; } .w-\[14px\] { width: 14px; } .w-\[16px\] { width: 16px; } .w-\[18px\] { width: 18px; } .w-\[21px\] { width: 21px; } .w-\[22ch\] { width: 22ch; } .w-\[22px\] { width: 22px; } .w-\[24px\] { width: 24px; } .w-\[28px\] { width: 28px; } .w-\[30\%\] { width: 30%; } .w-\[34\%\] { width: 34%; } .w-\[34px\] { width: 34px; } .w-\[36px\] { width: 36px; } .w-\[38px\] { width: 38px; } .w-\[40px\] { width: 40px; } .w-\[42\%\] { width: 42%; } .w-\[42px\] { width: 42px; } .w-\[44px\] { width: 44px; } .w-\[46\%\] { width: 46%; } .w-\[48px\] { width: 48px; } .w-\[50px\] { width: 50px; } .w-\[54px\] { width: 54px; } .w-\[56px\] { width: 56px; } .w-\[64px\] { width: 64px; } .w-\[72px\] { width: 72px; } .w-\[84px\] { width: 84px; } .w-\[86px\] { width: 86px; } .w-\[88px\] { width: 88px; } .w-\[92px\] { width: 92px; } .w-\[96px\] { width: 96px; } .w-\[100px\] { width: 100px; } .w-\[110px\] { width: 110px; } .w-\[118px\] { width: 118px; } .w-\[128px\] { width: 128px; } .w-\[132px\] { width: 132px; } .w-\[148px\] { width: 148px; } .w-\[150px\] { width: 150px; } .w-\[170px\] { width: 170px; } .w-\[180px\] { width: 180px; } .w-\[195px\] { width: 195px; } .w-\[224px\] { width: 224px; } .w-\[236px\] { width: 236px; } .w-\[240px\] { width: 240px; } .w-\[248px\] { width: 248px; } .w-\[250px\] { width: 250px; } .w-\[260px\] { width: 260px; } .w-\[280px\] { width: 280px; } .w-\[290px\] { width: 290px; } .w-\[300px\] { width: 300px; } .w-\[320px\] { width: 320px; } .w-\[340px\] { width: 340px; } .w-\[350px\] { width: 350px; } .w-\[360px\] { width: 360px; } .w-\[380px\] { width: 380px; } .w-\[410px\] { width: 410px; } .w-\[420px\] { width: 420px; } .w-\[660px\] { width: 660px; } .w-\[calc\(100\%-12px\)\] { width: calc(100% - 12px); } .w-\[clamp\(340px\,46\%\,440px\)\] { width: clamp(340px, 46%, 440px); } .w-\[min\(100cqw\,calc\(100cqh\*var\(--r\)\)\)\] { width: min(100cqw, calc(100cqh * var(--r))); } .w-\[min\(388px\,45\%\)\] { width: min(388px, 45%); } .w-\[min\(400px\,36\%\)\] { width: min(400px, 36%); } .w-\[min\(400px\,42vw\)\] { width: min(400px, 42vw); } .w-\[min\(410px\,40vw\)\] { width: min(410px, 40vw); } .w-\[min\(410px\,45\%\)\] { width: min(410px, 45%); } .w-\[min\(420px\,calc\(100vw-32px\)\)\] { width: min(420px, calc(100vw - 32px)); } .w-\[min\(430px\,calc\(100vw-140px\)\)\] { width: min(430px, calc(100vw - 140px)); } .w-\[min\(440px\,calc\(100vw-32px\)\)\] { width: min(440px, calc(100vw - 32px)); } .w-\[min\(460px\,calc\(100vw-32px\)\)\] { width: min(460px, calc(100vw - 32px)); } .w-\[min\(460px\,calc\(100vw-120px\)\)\] { width: min(460px, calc(100vw - 120px)); } .w-\[min\(480px\,calc\(100vw-32px\)\)\] { width: min(480px, calc(100vw - 32px)); } .w-\[min\(520px\,calc\(100vw-32px\)\)\] { width: min(520px, calc(100vw - 32px)); } .w-\[min\(600px\,calc\(100vw-32px\)\)\] { width: min(600px, calc(100vw - 32px)); } .w-\[min\(640px\,calc\(100vw-32px\)\)\] { width: min(640px, calc(100vw - 32px)); } .w-\[min\(680px\,calc\(100vw-32px\)\)\] { width: min(680px, calc(100vw - 32px)); } .w-\[min\(760px\,calc\(100vw-32px\)\)\] { width: min(760px, calc(100vw - 32px)); } .w-\[min\(860px\,calc\(100vw-32px\)\)\] { width: min(860px, calc(100vw - 32px)); } .w-\[min\(960px\,calc\(100vw-32px\)\)\] { width: min(960px, calc(100vw - 32px)); } .w-auto { width: auto; } .w-dvw { width: 100dvw; } .w-fit { width: fit-content; } .w-full { width: 100%; } .w-max { width: max-content; } .w-px { width: 1px; } .max-w-\[32ch\] { max-width: 32ch; } .max-w-\[40ch\] { max-width: 40ch; } .max-w-\[60ch\] { max-width: 60ch; } .max-w-\[60px\] { max-width: 60px; } .max-w-\[64ch\] { max-width: 64ch; } .max-w-\[72ch\] { max-width: 72ch; } .max-w-\[78\%\] { max-width: 78%; } .max-w-\[85\%\] { max-width: 85%; } .max-w-\[88\%\] { max-width: 88%; } .max-w-\[120px\] { max-width: 120px; } .max-w-\[150px\] { max-width: 150px; } .max-w-\[160px\] { max-width: 160px; } .max-w-\[180px\] { max-width: 180px; } .max-w-\[220px\] { max-width: 220px; } .max-w-\[230px\] { max-width: 230px; } .max-w-\[240px\] { max-width: 240px; } .max-w-\[260px\] { max-width: 260px; } .max-w-\[280px\] { max-width: 280px; } .max-w-\[300px\] { max-width: 300px; } .max-w-\[320px\] { max-width: 320px; } .max-w-\[342px\] { max-width: 342px; } .max-w-\[360px\] { max-width: 360px; } .max-w-\[420px\] { max-width: 420px; } .max-w-\[440px\] { max-width: 440px; } .max-w-\[460px\] { max-width: 460px; } .max-w-\[520px\] { max-width: 520px; } .max-w-\[540px\] { max-width: 540px; } .max-w-\[560px\] { max-width: 560px; } .max-w-\[600px\] { max-width: 600px; } .max-w-\[620px\] { max-width: 620px; } .max-w-\[640px\] { max-width: 640px; } .max-w-\[720px\] { max-width: 720px; } .max-w-\[748px\] { max-width: 748px; } .max-w-\[760px\] { max-width: 760px; } .max-w-\[780px\] { max-width: 780px; } .max-w-\[860px\] { max-width: 860px; } .max-w-\[880px\] { max-width: 880px; } .max-w-\[900px\] { max-width: 900px; } .max-w-\[960px\] { max-width: 960px; } .max-w-\[1014px\] { max-width: 1014px; } .max-w-\[1046px\] { max-width: 1046px; } .max-w-\[1100px\] { max-width: 1100px; } .max-w-\[1120px\] { max-width: 1120px; } .max-w-\[1140px\] { max-width: 1140px; } .max-w-\[1180px\] { max-width: 1180px; } .max-w-\[calc\(100\%-24px\)\] { max-width: calc(100% - 24px); } .max-w-full { max-width: 100%; } .max-w-none { max-width: none; } .min-w-0 { min-width: 0px; } .min-w-\[5px\] { min-width: 5px; } .min-w-\[12px\] { min-width: 12px; } .min-w-\[18px\] { min-width: 18px; } .min-w-\[20px\] { min-width: 20px; } .min-w-\[22px\] { min-width: 22px; } .min-w-\[26px\] { min-width: 26px; } .min-w-\[34px\] { min-width: 34px; } .min-w-\[46px\] { min-width: 46px; } .min-w-\[48px\] { min-width: 48px; } .min-w-\[52px\] { min-width: 52px; } .min-w-\[64px\] { min-width: 64px; } .min-w-\[72px\] { min-width: 72px; } .min-w-\[74px\] { min-width: 74px; } .min-w-\[88px\] { min-width: 88px; } .min-w-\[96px\] { min-width: 96px; } .min-w-\[122px\] { min-width: 122px; } .min-w-\[160px\] { min-width: 160px; } .min-w-\[180px\] { min-width: 180px; } .min-w-\[220px\] { min-width: 220px; } .min-w-\[240px\] { min-width: 240px; } .min-w-\[260px\] { min-width: 260px; } .min-w-\[340px\] { min-width: 340px; } .min-w-full { min-width: 100%; } .flex-\(--grow\) { flex: var(--grow); } .flex-1 { flex: 1; } .flex-\[2\] { flex: 2; } .flex-\[3\] { flex: 3; } .flex-auto { flex: auto; } .shrink { flex-shrink: 1; } .shrink-0 { flex-shrink: 0; } .grow { flex-grow: 1; } .grow-0 { flex-grow: 0; } .basis-0 { flex-basis: 0px; } .basis-full { flex-basis: 100%; } .border-collapse { border-collapse: collapse; } .-translate-1\/2 { --tw-translate-x: calc(calc(1 / 2 * 100%) * -1); --tw-translate-y: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-x-1\/2 { --tw-translate-x: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-x-\[8px\] { --tw-translate-x: calc(8px * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-x-\[14px\] { --tw-translate-x: calc(14px * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-x-\[30px\] { --tw-translate-x: calc(30px * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-\[8px\] { --tw-translate-x: 8px; translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-\[14px\] { --tw-translate-x: 14px; translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-\[30px\] { --tw-translate-x: 30px; translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-y-1\/2 { --tw-translate-y: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-y-\[3px\] { --tw-translate-y: calc(3px * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-\[6px\] { --tw-translate-y: 6px; translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-\[8px\] { --tw-translate-y: 8px; translate: var(--tw-translate-x) var(--tw-translate-y); } .-rotate-6 { rotate: calc(6deg * -1); } .-rotate-9 { rotate: calc(9deg * -1); } .-rotate-\[1\.2deg\] { rotate: calc(1.2deg * -1); } .rotate-6 { rotate: 6deg; } .rotate-7 { rotate: 7deg; } .rotate-9 { rotate: 9deg; } .rotate-45 { rotate: 45deg; } .\[transform\:translate3d\(var\(--tx\)\,var\(--ty\)\,0\)\] { transform: translate3d(var(--tx),var(--ty),0); } .transform { transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); } .animate-onb-breathe { animation: var(--animate-onb-breathe); } .animate-onb-float { animation: var(--animate-onb-float); } .animate-onb-glow { animation: var(--animate-onb-glow); } .animate-onb-pop { animation: var(--animate-onb-pop); } .animate-onb-up { animation: var(--animate-onb-up); } .animate-pop-in { animation: var(--animate-pop-in); } .animate-pulse { animation: var(--animate-pulse); } .animate-spin { animation: var(--animate-spin); } .cursor-col-resize { cursor: col-resize; } .cursor-crosshair { cursor: crosshair; } .cursor-default { cursor: default; } .cursor-grab { cursor: grab; } .cursor-grabbing { cursor: grabbing; } .cursor-not-allowed { cursor: not-allowed; } .cursor-pointer { cursor: pointer; } .cursor-text { cursor: text; } .touch-none { touch-action: none; } .resize { resize: both; } .resize-none { resize: none; } .resize-y { resize: vertical; } .scroll-mt-24 { scroll-margin-top: calc(var(--spacing) * 24); } .list-decimal { list-style-type: decimal; } .list-disc { list-style-type: disc; } .list-none { list-style-type: none; } .appearance-none { appearance: none; } .grid-cols-\(--cols\) { grid-template-columns: var(--cols); } .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grid-cols-\[0px_minmax\(0\,1fr\)\] { grid-template-columns: 0px minmax(0,1fr); } .grid-cols-\[1\.35fr_1fr\] { grid-template-columns: 1.35fr 1fr; } .grid-cols-\[1fr_auto_1fr\] { grid-template-columns: 1fr auto 1fr; } .grid-cols-\[28px_minmax\(0\,1fr\)_120px_70px_70px_minmax\(0\,180px\)\] { grid-template-columns: 28px minmax(0,1fr) 120px 70px 70px minmax(0,180px); } .grid-cols-\[30px_minmax\(0\,1fr\)_auto\] { grid-template-columns: 30px minmax(0,1fr) auto; } .grid-cols-\[30px_minmax\(0\,1fr\)_auto_16px\] { grid-template-columns: 30px minmax(0,1fr) auto 16px; } .grid-cols-\[64px_28px_minmax\(0\,1fr\)\] { grid-template-columns: 64px 28px minmax(0,1fr); } .grid-cols-\[70px_22px_minmax\(0\,1\.3fr\)_130px_110px_60px_minmax\(0\,1\.2fr\)\] { grid-template-columns: 70px 22px minmax(0,1.3fr) 130px 110px 60px minmax(0,1.2fr); } .grid-cols-\[92px_minmax\(0\,1fr\)\] { grid-template-columns: 92px minmax(0,1fr); } .grid-cols-\[96px_132px_1fr\] { grid-template-columns: 96px 132px 1fr; } .grid-cols-\[132px_1fr\] { grid-template-columns: 132px 1fr; } .grid-cols-\[150px_minmax\(0\,1fr\)\] { grid-template-columns: 150px minmax(0,1fr); } .grid-cols-\[280px_1fr\] { grid-template-columns: 280px 1fr; } .grid-cols-\[340px_minmax\(0\,1fr\)\] { grid-template-columns: 340px minmax(0,1fr); } .grid-cols-\[max-content_minmax\(0\,1fr\)\] { grid-template-columns: max-content minmax(0,1fr); } .grid-cols-\[minmax\(0\,1fr\)_110px\] { grid-template-columns: minmax(0,1fr) 110px; } .grid-cols-\[minmax\(0\,1fr\)_120px_40px\] { grid-template-columns: minmax(0,1fr) 120px 40px; } .grid-cols-\[minmax\(0\,1fr\)_minmax\(340px\,428px\)\] { grid-template-columns: minmax(0,1fr) minmax(340px,428px); } .grid-cols-\[minmax\(0\,1fr\)_minmax\(380px\,40\%\)\] { grid-template-columns: minmax(0,1fr) minmax(380px,40%); } .grid-cols-\[minmax\(0\,110px\)_minmax\(0\,1fr\)\] { grid-template-columns: minmax(0,110px) minmax(0,1fr); } .grid-cols-\[repeat\(auto-fill\,minmax\(64px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(64px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(96px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(96px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(118px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(118px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(130px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(130px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(140px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(140px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(180px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(180px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(200px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(220px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(230px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(230px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(270px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(270px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(272px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(272px,1fr)); } .grid-cols-\[repeat\(auto-fill\,minmax\(280px\,1fr\)\)\] { grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); } .grid-rows-\[minmax\(0\,1fr\)_auto\] { grid-template-rows: minmax(0,1fr) auto; } .flex-col { flex-direction: column; } .flex-row { flex-direction: row; } .flex-wrap { flex-wrap: wrap; } .items-baseline { align-items: baseline; } .items-center { align-items: center; } .items-end { align-items: flex-end; } .items-start { align-items: flex-start; } .items-stretch { align-items: stretch; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .justify-end { justify-content: flex-end; } .justify-start { justify-content: flex-start; } .gap-1 { gap: var(--spacing); } .gap-2 { gap: calc(var(--spacing) * 2); } .gap-3 { gap: calc(var(--spacing) * 3); } .gap-4 { gap: calc(var(--spacing) * 4); } .gap-5 { gap: calc(var(--spacing) * 5); } .gap-6 { gap: calc(var(--spacing) * 6); } .gap-7 { gap: calc(var(--spacing) * 7); } .gap-8 { gap: calc(var(--spacing) * 8); } .gap-10 { gap: calc(var(--spacing) * 10); } .gap-16 { gap: calc(var(--spacing) * 16); } .gap-\[1px\] { gap: 1px; } .gap-\[2px\] { gap: 2px; } .gap-\[3px\] { gap: 3px; } .gap-\[4px\] { gap: 4px; } .gap-\[5px\] { gap: 5px; } .gap-\[6px\] { gap: 6px; } .gap-\[7px\] { gap: 7px; } .gap-\[8px\] { gap: 8px; } .gap-\[9px\] { gap: 9px; } .gap-\[10px\] { gap: 10px; } .gap-\[11px\] { gap: 11px; } .gap-\[12px\] { gap: 12px; } .gap-\[14px\] { gap: 14px; } .gap-\[16px\] { gap: 16px; } .gap-\[18px\] { gap: 18px; } .gap-\[20px\] { gap: 20px; } .gap-\[22px\] { gap: 22px; } .gap-\[24px\] { gap: 24px; } .gap-\[26px\] { gap: 26px; } .gap-\[28px\] { gap: 28px; } .gap-\[36px\] { gap: 36px; } .gap-px { gap: 1px; } .gap-x-\[7px\] { column-gap: 7px; } .gap-x-\[8px\] { column-gap: 8px; } .gap-x-\[10px\] { column-gap: 10px; } .gap-x-\[12px\] { column-gap: 12px; } .gap-x-\[14px\] { column-gap: 14px; } .gap-x-\[16px\] { column-gap: 16px; } .gap-x-\[18px\] { column-gap: 18px; } .gap-x-\[20px\] { column-gap: 20px; } .gap-x-\[24px\] { column-gap: 24px; } :where(.-space-x-\[6px\] > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(6px * -1) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(6px * -1) * calc(1 - var(--tw-space-x-reverse))); } :where(.-space-x-\[8px\] > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(8px * -1) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(8px * -1) * calc(1 - var(--tw-space-x-reverse))); } .gap-y-\[4px\] { row-gap: 4px; } .gap-y-\[6px\] { row-gap: 6px; } .gap-y-\[8px\] { row-gap: 8px; } .gap-y-\[14px\] { row-gap: 14px; } .gap-y-\[26px\] { row-gap: 26px; } :where(.divide-x > :not(:last-child)) { --tw-divide-x-reverse: 0; border-inline-style: var(--tw-border-style); border-inline-start-width: calc(1px * var(--tw-divide-x-reverse)); border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); } :where(.divide-hairline > :not(:last-child)) { border-color: var(--color-hairline); } .self-center { align-self: center; } .self-end { align-self: flex-end; } .self-start { align-self: flex-start; } .justify-self-center { justify-self: center; } .justify-self-end { justify-self: flex-end; } .justify-self-start { justify-self: flex-start; } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .overflow-auto { overflow: auto; } .overflow-hidden { overflow: hidden; } .overflow-visible { overflow: visible; } .overflow-x-auto { overflow-x: auto; } .overflow-y-auto { overflow-y: auto; } .rounded { border-radius: 0.25rem; } .rounded-2xl { border-radius: var(--radius-2xl); } .rounded-2xs { border-radius: var(--radius-2xs); } .rounded-\[7px\] { border-radius: 7px; } .rounded-\[27\%\] { border-radius: 27%; } .rounded-bar { border-radius: var(--radius-bar); } .rounded-bezel { border-radius: var(--radius-bezel); } .rounded-btn { border-radius: var(--radius-btn); } .rounded-card { border-radius: var(--radius-card); } .rounded-chip { border-radius: var(--radius-chip); } .rounded-ctl { border-radius: var(--radius-ctl); } .rounded-field { border-radius: var(--radius-field); } .rounded-frame { border-radius: var(--radius-frame); } .rounded-full { border-radius: calc(infinity * 1px); } .rounded-key { border-radius: var(--radius-key); } .rounded-lg { border-radius: var(--radius-lg); } .rounded-mark { border-radius: var(--radius-mark); } .rounded-md { border-radius: var(--radius-md); } .rounded-none { border-radius: 0; } .rounded-panel { border-radius: var(--radius-panel); } .rounded-screen { border-radius: var(--radius-screen); } .rounded-sheet { border-radius: var(--radius-sheet); } .rounded-sm { border-radius: var(--radius-sm); } .rounded-step { border-radius: var(--radius-step); } .rounded-tab { border-radius: var(--radius-tab); } .rounded-tile { border-radius: var(--radius-tile); } .rounded-xl { border-radius: var(--radius-xl); } .rounded-xs { border-radius: var(--radius-xs); } .rounded-l-btn { border-top-left-radius: var(--radius-btn); border-bottom-left-radius: var(--radius-btn); } .rounded-b-key { border-bottom-right-radius: var(--radius-key); border-bottom-left-radius: var(--radius-key); } .rounded-b-xl { border-bottom-right-radius: var(--radius-xl); border-bottom-left-radius: var(--radius-xl); } .rounded-bl-mark { border-bottom-left-radius: var(--radius-mark); } .border { border-style: var(--tw-border-style); border-width: 1px; } .border-0 { border-style: var(--tw-border-style); border-width: 0px; } .border-2 { border-style: var(--tw-border-style); border-width: 2px; } .border-\[1\.5px\] { border-style: var(--tw-border-style); border-width: 1.5px; } .border-\[1\.6px\] { border-style: var(--tw-border-style); border-width: 1.6px; } .border-y { border-block-style: var(--tw-border-style); border-block-width: 1px; } .border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; } .border-r { border-right-style: var(--tw-border-style); border-right-width: 1px; } .border-r-0 { border-right-style: var(--tw-border-style); border-right-width: 0px; } .border-b { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } .border-b-2 { border-bottom-style: var(--tw-border-style); border-bottom-width: 2px; } .border-l { border-left-style: var(--tw-border-style); border-left-width: 1px; } .border-l-2 { border-left-style: var(--tw-border-style); border-left-width: 2px; } .border-l-\[3px\] { border-left-style: var(--tw-border-style); border-left-width: 3px; } .border-dashed { --tw-border-style: dashed; border-style: dashed; } .border-solid { --tw-border-style: solid; border-style: solid; } .border-\(--c\) { border-color: var(--c); } .border-\(--c\)\/35 { border-color: var(--c); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--c) 35%, transparent); } } .border-\(--c\)\/60 { border-color: var(--c); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--c) 60%, transparent); } } .border-\(--c\)\/65 { border-color: var(--c); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--c) 65%, transparent); } } .border-\(--tone\) { border-color: var(--tone); } .border-accent { border-color: var(--color-accent); } .border-accent\/25 { border-color: color-mix(in srgb, #c8f04a 25%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 25%, transparent); } } .border-accent\/30 { border-color: color-mix(in srgb, #c8f04a 30%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 30%, transparent); } } .border-accent\/35 { border-color: color-mix(in srgb, #c8f04a 35%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 35%, transparent); } } .border-accent\/40 { border-color: color-mix(in srgb, #c8f04a 40%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 40%, transparent); } } .border-accent\/45 { border-color: color-mix(in srgb, #c8f04a 45%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 45%, transparent); } } .border-accent\/50 { border-color: color-mix(in srgb, #c8f04a 50%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 50%, transparent); } } .border-accent\/55 { border-color: color-mix(in srgb, #c8f04a 55%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 55%, transparent); } } .border-accent\/60 { border-color: color-mix(in srgb, #c8f04a 60%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 60%, transparent); } } .border-attention\/30 { border-color: color-mix(in srgb, #e9a13f 30%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-attention) 30%, transparent); } } .border-attention\/35 { border-color: color-mix(in srgb, #e9a13f 35%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-attention) 35%, transparent); } } .border-attention\/40 { border-color: color-mix(in srgb, #e9a13f 40%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-attention) 40%, transparent); } } .border-attention\/50 { border-color: color-mix(in srgb, #e9a13f 50%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-attention) 50%, transparent); } } .border-attention\/60 { border-color: color-mix(in srgb, #e9a13f 60%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-attention) 60%, transparent); } } .border-check { border-color: var(--color-check); } .border-current { border-color: currentcolor; } .border-fam-flow\/28 { border-color: color-mix(in srgb, #3ddc97 28%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-fam-flow) 28%, transparent); } } .border-fam-flow\/45 { border-color: color-mix(in srgb, #3ddc97 45%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-fam-flow) 45%, transparent); } } .border-fam-flow\/80 { border-color: color-mix(in srgb, #3ddc97 80%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-fam-flow) 80%, transparent); } } .border-fam-help\/45 { border-color: color-mix(in srgb, #ff7eb3 45%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-fam-help) 45%, transparent); } } .border-fam-values\/50 { border-color: color-mix(in srgb, #ff9f4a 50%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-fam-values) 50%, transparent); } } .border-hairline { border-color: var(--color-hairline); } .border-hairline-strong { border-color: var(--color-hairline-strong); } .border-hairline-strong\/70 { border-color: color-mix(in srgb, rgb(255 255 255 / 13%) 70%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-hairline-strong) 70%, transparent); } } .border-neutral-600 { border-color: var(--color-neutral-600); } .border-neutral-800 { border-color: var(--color-neutral-800); } .border-text-2 { border-color: var(--color-text-2); } .border-text-3 { border-color: var(--color-text-3); } .border-text-3\/70 { border-color: color-mix(in srgb, #8b8b93 70%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-text-3) 70%, transparent); } } .border-text\/8 { border-color: color-mix(in srgb, #f2f2ef 8%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-text) 8%, transparent); } } .border-text\/10 { border-color: color-mix(in srgb, #f2f2ef 10%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-text) 10%, transparent); } } .border-text\/16 { border-color: color-mix(in srgb, #f2f2ef 16%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-text) 16%, transparent); } } .border-text\/20 { border-color: color-mix(in srgb, #f2f2ef 20%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-text) 20%, transparent); } } .border-text\/22 { border-color: color-mix(in srgb, #f2f2ef 22%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-text) 22%, transparent); } } .border-today { border-color: var(--color-today); } .border-today\/25 { border-color: color-mix(in srgb, #f0453b 25%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-today) 25%, transparent); } } .border-today\/30 { border-color: color-mix(in srgb, #f0453b 30%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-today) 30%, transparent); } } .border-today\/35 { border-color: color-mix(in srgb, #f0453b 35%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-today) 35%, transparent); } } .border-today\/40 { border-color: color-mix(in srgb, #f0453b 40%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-today) 40%, transparent); } } .border-today\/70 { border-color: color-mix(in srgb, #f0453b 70%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-today) 70%, transparent); } } .border-transparent { border-color: transparent; } .border-t-accent { border-top-color: var(--color-accent); } .border-r-transparent { border-right-color: transparent; } .border-b-accent { border-bottom-color: var(--color-accent); } .border-b-transparent { border-bottom-color: transparent; } .border-l-\(--tone\) { border-left-color: var(--tone); } .bg-\(--c\) { background-color: var(--c); } .bg-\(--c\)\/10 { background-color: var(--c); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--c) 10%, transparent); } } .bg-\(--c\)\/14 { background-color: var(--c); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--c) 14%, transparent); } } .bg-\(--c\)\/20 { background-color: var(--c); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--c) 20%, transparent); } } .bg-\(--tile\) { background-color: var(--tile); } .bg-\(--tone\) { background-color: var(--tone); } .bg-\[\#2aabee\] { background-color: #2aabee; } .bg-\[\#2b5278\] { background-color: #2b5278; } .bg-\[color-mix\(in_oklab\,var\(--color-fam-values\)_20\%\,var\(--color-card\)\)\] { background-color: color-mix(in srgb,#ff9f4a 20%,#1b1b1f); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab,var(--color-fam-values) 20%,var(--color-card)); } } .bg-\[color-mix\(in_oklab\,var\(--color-well\)_88\%\,var\(--color-today\)\)\] { background-color: color-mix(in srgb,#18181b 88%,#f0453b); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab,var(--color-well) 88%,var(--color-today)); } } .bg-\[color-mix\(in_oklab\,var\(--color-well\)_90\%\,var\(--color-accent\)\)\] { background-color: color-mix(in srgb,#18181b 90%,#c8f04a); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab,var(--color-well) 90%,var(--color-accent)); } } .bg-\[color-mix\(in_oklab\,var\(--tone\)_20\%\,transparent\)\] { background-color: var(--tone); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab,var(--tone) 20%,transparent); } } .bg-accent { background-color: var(--color-accent); } .bg-accent-400 { background-color: var(--color-accent-400); } .bg-accent-600 { background-color: var(--color-accent-600); } .bg-accent-ink { background-color: var(--color-accent-ink); } .bg-accent\/4 { background-color: color-mix(in srgb, #c8f04a 4%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 4%, transparent); } } .bg-accent\/5 { background-color: color-mix(in srgb, #c8f04a 5%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 5%, transparent); } } .bg-accent\/6 { background-color: color-mix(in srgb, #c8f04a 6%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 6%, transparent); } } .bg-accent\/8 { background-color: color-mix(in srgb, #c8f04a 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 8%, transparent); } } .bg-accent\/10 { background-color: color-mix(in srgb, #c8f04a 10%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 10%, transparent); } } .bg-accent\/12 { background-color: color-mix(in srgb, #c8f04a 12%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 12%, transparent); } } .bg-accent\/14 { background-color: color-mix(in srgb, #c8f04a 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 14%, transparent); } } .bg-accent\/16 { background-color: color-mix(in srgb, #c8f04a 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 16%, transparent); } } .bg-accent\/18 { background-color: color-mix(in srgb, #c8f04a 18%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 18%, transparent); } } .bg-accent\/22 { background-color: color-mix(in srgb, #c8f04a 22%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 22%, transparent); } } .bg-accent\/25 { background-color: color-mix(in srgb, #c8f04a 25%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 25%, transparent); } } .bg-accent\/28 { background-color: color-mix(in srgb, #c8f04a 28%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 28%, transparent); } } .bg-accent\/35 { background-color: color-mix(in srgb, #c8f04a 35%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 35%, transparent); } } .bg-accent\/40 { background-color: color-mix(in srgb, #c8f04a 40%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 40%, transparent); } } .bg-accent\/45 { background-color: color-mix(in srgb, #c8f04a 45%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 45%, transparent); } } .bg-accent\/50 { background-color: color-mix(in srgb, #c8f04a 50%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 50%, transparent); } } .bg-accent\/60 { background-color: color-mix(in srgb, #c8f04a 60%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-accent) 60%, transparent); } } .bg-attention { background-color: var(--color-attention); } .bg-attention\/5 { background-color: color-mix(in srgb, #e9a13f 5%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 5%, transparent); } } .bg-attention\/6 { background-color: color-mix(in srgb, #e9a13f 6%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 6%, transparent); } } .bg-attention\/7 { background-color: color-mix(in srgb, #e9a13f 7%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 7%, transparent); } } .bg-attention\/8 { background-color: color-mix(in srgb, #e9a13f 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 8%, transparent); } } .bg-attention\/10 { background-color: color-mix(in srgb, #e9a13f 10%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 10%, transparent); } } .bg-attention\/14 { background-color: color-mix(in srgb, #e9a13f 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 14%, transparent); } } .bg-attention\/16 { background-color: color-mix(in srgb, #e9a13f 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 16%, transparent); } } .bg-attention\/18 { background-color: color-mix(in srgb, #e9a13f 18%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-attention) 18%, transparent); } } .bg-bezel { background-color: var(--color-bezel); } .bg-bezel\/70 { background-color: color-mix(in srgb, #0b0b0c 70%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-bezel) 70%, transparent); } } .bg-bg { background-color: var(--color-bg); } .bg-bg\/60 { background-color: color-mix(in srgb, #141416 60%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-bg) 60%, transparent); } } .bg-bg\/70 { background-color: color-mix(in srgb, #141416 70%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-bg) 70%, transparent); } } .bg-bg\/80 { background-color: color-mix(in srgb, #141416 80%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-bg) 80%, transparent); } } .bg-bg\/85 { background-color: color-mix(in srgb, #141416 85%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-bg) 85%, transparent); } } .bg-bg\/95 { background-color: color-mix(in srgb, #141416 95%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-bg) 95%, transparent); } } .bg-card { background-color: var(--color-card); } .bg-card\/90 { background-color: color-mix(in srgb, #1b1b1f 90%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-card) 90%, transparent); } } .bg-card\/95 { background-color: color-mix(in srgb, #1b1b1f 95%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-card) 95%, transparent); } } .bg-check { background-color: var(--color-check); } .bg-chrome { background-color: var(--color-chrome); } .bg-control { background-color: var(--color-control); } .bg-control-hover { background-color: var(--color-control-hover); } .bg-control\/50 { background-color: color-mix(in srgb, #26262b 50%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-control) 50%, transparent); } } .bg-control\/60 { background-color: color-mix(in srgb, #26262b 60%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-control) 60%, transparent); } } .bg-fam-flow { background-color: var(--color-fam-flow); } .bg-fam-flow\/4 { background-color: color-mix(in srgb, #3ddc97 4%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-flow) 4%, transparent); } } .bg-fam-flow\/14 { background-color: color-mix(in srgb, #3ddc97 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-flow) 14%, transparent); } } .bg-fam-flow\/24 { background-color: color-mix(in srgb, #3ddc97 24%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-flow) 24%, transparent); } } .bg-fam-flow\/25 { background-color: color-mix(in srgb, #3ddc97 25%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-flow) 25%, transparent); } } .bg-fam-flow\/30 { background-color: color-mix(in srgb, #3ddc97 30%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-flow) 30%, transparent); } } .bg-fam-help { background-color: var(--color-fam-help); } .bg-fam-help\/8 { background-color: color-mix(in srgb, #ff7eb3 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-help) 8%, transparent); } } .bg-fam-help\/12 { background-color: color-mix(in srgb, #ff7eb3 12%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-help) 12%, transparent); } } .bg-fam-help\/14 { background-color: color-mix(in srgb, #ff7eb3 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-help) 14%, transparent); } } .bg-fam-help\/15 { background-color: color-mix(in srgb, #ff7eb3 15%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-help) 15%, transparent); } } .bg-fam-help\/16 { background-color: color-mix(in srgb, #ff7eb3 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-help) 16%, transparent); } } .bg-fam-look { background-color: var(--color-fam-look); } .bg-fam-look\/14 { background-color: color-mix(in srgb, #4cc3ff 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-look) 14%, transparent); } } .bg-fam-look\/16 { background-color: color-mix(in srgb, #4cc3ff 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-look) 16%, transparent); } } .bg-fam-phone { background-color: var(--color-fam-phone); } .bg-fam-phone\/14 { background-color: color-mix(in srgb, #d08bfa 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-phone) 14%, transparent); } } .bg-fam-touch { background-color: var(--color-fam-touch); } .bg-fam-touch\/14 { background-color: color-mix(in srgb, #8f93ff 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-touch) 14%, transparent); } } .bg-fam-touch\/16 { background-color: color-mix(in srgb, #8f93ff 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-touch) 16%, transparent); } } .bg-fam-values { background-color: var(--color-fam-values); } .bg-fam-values\/10 { background-color: color-mix(in srgb, #ff9f4a 10%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-values) 10%, transparent); } } .bg-fam-values\/12 { background-color: color-mix(in srgb, #ff9f4a 12%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-values) 12%, transparent); } } .bg-fam-values\/14 { background-color: color-mix(in srgb, #ff9f4a 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-values) 14%, transparent); } } .bg-fam-values\/16 { background-color: color-mix(in srgb, #ff9f4a 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-fam-values) 16%, transparent); } } .bg-field { background-color: var(--color-field); } .bg-hairline { background-color: var(--color-hairline); } .bg-hairline-strong { background-color: var(--color-hairline-strong); } .bg-neutral-100 { background-color: var(--color-neutral-100); } .bg-neutral-600 { background-color: var(--color-neutral-600); } .bg-neutral-700 { background-color: var(--color-neutral-700); } .bg-neutral-800 { background-color: var(--color-neutral-800); } .bg-neutral-800\/50 { background-color: color-mix(in srgb, #3a3a42 50%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-neutral-800) 50%, transparent); } } .bg-neutral-900 { background-color: var(--color-neutral-900); } .bg-neutral-900\/50 { background-color: color-mix(in srgb, #1c1c21 50%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-neutral-900) 50%, transparent); } } .bg-ok { background-color: var(--color-ok); } .bg-ok\/6 { background-color: color-mix(in srgb, #3ddc97 6%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-ok) 6%, transparent); } } .bg-ok\/8 { background-color: color-mix(in srgb, #3ddc97 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-ok) 8%, transparent); } } .bg-ok\/14 { background-color: color-mix(in srgb, #3ddc97 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-ok) 14%, transparent); } } .bg-promo { background-color: var(--color-promo); } .bg-rail { background-color: var(--color-rail); } .bg-rail\/70 { background-color: color-mix(in srgb, #0f0f11 70%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-rail) 70%, transparent); } } .bg-rail\/80 { background-color: color-mix(in srgb, #0f0f11 80%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-rail) 80%, transparent); } } .bg-raised { background-color: var(--color-raised); } .bg-raised\/50 { background-color: color-mix(in srgb, #222226 50%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-raised) 50%, transparent); } } .bg-raised\/60 { background-color: color-mix(in srgb, #222226 60%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-raised) 60%, transparent); } } .bg-raised\/90 { background-color: color-mix(in srgb, #222226 90%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-raised) 90%, transparent); } } .bg-range-1 { background-color: var(--color-range-1); } .bg-range-2 { background-color: var(--color-range-2); } .bg-range-3 { background-color: var(--color-range-3); } .bg-scrim { background-color: var(--color-scrim); } .bg-scrim\/60 { background-color: color-mix(in srgb, rgb(8 8 10 / 60%) 60%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-scrim) 60%, transparent); } } .bg-selected { background-color: var(--color-selected); } .bg-selected-strong { background-color: var(--color-selected-strong); } .bg-sidebar { background-color: var(--color-sidebar); } .bg-tab { background-color: var(--color-tab); } .bg-text { background-color: var(--color-text); } .bg-text-2 { background-color: var(--color-text-2); } .bg-text-2\/30 { background-color: color-mix(in srgb, #b4b4ba 30%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text-2) 30%, transparent); } } .bg-text-3 { background-color: var(--color-text-3); } .bg-text-3\/60 { background-color: color-mix(in srgb, #8b8b93 60%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text-3) 60%, transparent); } } .bg-text\/5 { background-color: color-mix(in srgb, #f2f2ef 5%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text) 5%, transparent); } } .bg-text\/6 { background-color: color-mix(in srgb, #f2f2ef 6%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text) 6%, transparent); } } .bg-text\/7 { background-color: color-mix(in srgb, #f2f2ef 7%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text) 7%, transparent); } } .bg-text\/8 { background-color: color-mix(in srgb, #f2f2ef 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text) 8%, transparent); } } .bg-text\/10 { background-color: color-mix(in srgb, #f2f2ef 10%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text) 10%, transparent); } } .bg-text\/12 { background-color: color-mix(in srgb, #f2f2ef 12%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text) 12%, transparent); } } .bg-text\/16 { background-color: color-mix(in srgb, #f2f2ef 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-text) 16%, transparent); } } .bg-today { background-color: var(--color-today); } .bg-today\/4 { background-color: color-mix(in srgb, #f0453b 4%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 4%, transparent); } } .bg-today\/6 { background-color: color-mix(in srgb, #f0453b 6%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 6%, transparent); } } .bg-today\/8 { background-color: color-mix(in srgb, #f0453b 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 8%, transparent); } } .bg-today\/10 { background-color: color-mix(in srgb, #f0453b 10%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 10%, transparent); } } .bg-today\/12 { background-color: color-mix(in srgb, #f0453b 12%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 12%, transparent); } } .bg-today\/14 { background-color: color-mix(in srgb, #f0453b 14%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 14%, transparent); } } .bg-today\/16 { background-color: color-mix(in srgb, #f0453b 16%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 16%, transparent); } } .bg-today\/20 { background-color: color-mix(in srgb, #f0453b 20%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-today) 20%, transparent); } } .bg-transparent { background-color: transparent; } .bg-well { background-color: var(--color-well); } .bg-linear-90 { --tw-gradient-position: 90deg; @supports (background-image: linear-gradient(in lab, red, red)) { --tw-gradient-position: 90deg in oklab; } background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-b { --tw-gradient-position: to bottom; @supports (background-image: linear-gradient(in lab, red, red)) { --tw-gradient-position: to bottom in oklab; } background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-linear-to-r { --tw-gradient-position: to right; @supports (background-image: linear-gradient(in lab, red, red)) { --tw-gradient-position: to right in oklab; } background-image: linear-gradient(var(--tw-gradient-stops)); } .rule-faded { background-image: linear-gradient( to right, transparent, var(--color-hairline) 48px, var(--color-hairline) calc(100% - 48px), transparent ); background-repeat: no-repeat; background-position: bottom; background-size: 100% 1px; } .rule-soft { background-image: linear-gradient(to right, var(--color-hairline), transparent); background-repeat: no-repeat; background-position: bottom; background-size: 100% 1px; } .bg-\[linear-gradient\(90deg\,var\(--color-accent\)_0_50\%\,var\(--color-control-hover\)_50\%\)\] { background-image: linear-gradient(90deg,var(--color-accent) 0 50%,var(--color-control-hover) 50%); } .bg-\[linear-gradient\(to_top\,var\(--color-bg\)_0\%\,transparent_100\%\)\] { background-image: linear-gradient(to top,var(--color-bg) 0%,transparent 100%); } .bg-\[radial-gradient\(circle\,color-mix\(in_oklab\,var\(--color-accent\)_16\%\,transparent\)\,transparent_68\%\)\] { background-image: radial-gradient(circle,color-mix(in srgb,#c8f04a 16%,transparent),transparent 68%); @supports (color: color-mix(in lab, red, red)) { background-image: radial-gradient(circle,color-mix(in oklab,var(--color-accent) 16%,transparent),transparent 68%); } } .bg-\[radial-gradient\(rgb\(255_255_255\/0\.07\)_1px\,transparent_1\.3px\)\] { background-image: radial-gradient(rgb(255 255 255/0.07) 1px,transparent 1.3px); } .bg-\[repeating-linear-gradient\(135deg\,rgb\(255_255_255\/0\.018\)_0_6px\,transparent_6px_12px\)\] { background-image: repeating-linear-gradient(135deg,rgb(255 255 255/0.018) 0 6px,transparent 6px 12px); } .bg-\[repeating-linear-gradient\(135deg\,var\(--c\)_0_3px\,color-mix\(in_oklab\,var\(--c\)_25\%\,transparent\)_3px_7px\)\] { background-image: repeating-linear-gradient(135deg,var(--c) 0 3px,var(--c) 3px 7px); @supports (color: color-mix(in lab, red, red)) { background-image: repeating-linear-gradient(135deg,var(--c) 0 3px,color-mix(in oklab,var(--c) 25%,transparent) 3px 7px); } } .bg-\[repeating-linear-gradient\(135deg\,var\(--color-card\)_0_8px\,var\(--color-rail\)_8px_16px\)\] { background-image: repeating-linear-gradient(135deg,var(--color-card) 0 8px,var(--color-rail) 8px 16px); } .bg-\[repeating-linear-gradient\(135deg\,var\(--color-hairline-strong\)_0_4px\,transparent_4px_9px\)\] { background-image: repeating-linear-gradient(135deg,var(--color-hairline-strong) 0 4px,transparent 4px 9px); } .from-accent-700 { --tw-gradient-from: var(--color-accent-700); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-bg { --tw-gradient-from: var(--color-bg); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-promo { --tw-gradient-from: var(--color-promo); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-70\% { --tw-gradient-from-position: 70%; } .to-accent-400 { --tw-gradient-to: var(--color-accent-400); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .to-promo-2 { --tw-gradient-to: var(--color-promo-2); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .to-transparent { --tw-gradient-to: transparent; --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .bg-size-\[18px_18px\] { background-size: 18px 18px; } .fill-today { fill: var(--color-today); } .stroke-today { stroke: var(--color-today); } .object-contain { object-fit: contain; } .object-cover { object-fit: cover; } .object-top { object-position: top; } .p-0 { padding: 0px; } .p-3 { padding: calc(var(--spacing) * 3); } .p-4 { padding: calc(var(--spacing) * 4); } .p-6 { padding: calc(var(--spacing) * 6); } .p-7 { padding: calc(var(--spacing) * 7); } .p-8 { padding: calc(var(--spacing) * 8); } .p-16 { padding: calc(var(--spacing) * 16); } .p-\[0px\] { padding: 0px; } .p-\[2px\] { padding: 2px; } .p-\[3px\] { padding: 3px; } .p-\[4px\] { padding: 4px; } .p-\[6px\] { padding: 6px; } .p-\[7px\] { padding: 7px; } .p-\[8px\] { padding: 8px; } .p-\[10px\] { padding: 10px; } .p-\[12px\] { padding: 12px; } .p-\[14px\] { padding: 14px; } .p-\[16px\] { padding: 16px; } .p-\[18px\] { padding: 18px; } .p-\[20px\] { padding: 20px; } .p-\[24px\] { padding: 24px; } .p-\[28px\] { padding: 28px; } .px-1 { padding-inline: var(--spacing); } .px-2 { padding-inline: calc(var(--spacing) * 2); } .px-3 { padding-inline: calc(var(--spacing) * 3); } .px-4 { padding-inline: calc(var(--spacing) * 4); } .px-5 { padding-inline: calc(var(--spacing) * 5); } .px-6 { padding-inline: calc(var(--spacing) * 6); } .px-16 { padding-inline: calc(var(--spacing) * 16); } .px-\[2px\] { padding-inline: 2px; } .px-\[3px\] { padding-inline: 3px; } .px-\[4px\] { padding-inline: 4px; } .px-\[5px\] { padding-inline: 5px; } .px-\[6px\] { padding-inline: 6px; } .px-\[7px\] { padding-inline: 7px; } .px-\[8px\] { padding-inline: 8px; } .px-\[9px\] { padding-inline: 9px; } .px-\[10px\] { padding-inline: 10px; } .px-\[11px\] { padding-inline: 11px; } .px-\[12px\] { padding-inline: 12px; } .px-\[13px\] { padding-inline: 13px; } .px-\[14px\] { padding-inline: 14px; } .px-\[16px\] { padding-inline: 16px; } .px-\[18px\] { padding-inline: 18px; } .px-\[20px\] { padding-inline: 20px; } .px-\[22px\] { padding-inline: 22px; } .px-\[24px\] { padding-inline: 24px; } .px-\[28px\] { padding-inline: 28px; } .px-\[36px\] { padding-inline: 36px; } .px-\[40px\] { padding-inline: 40px; } .px-\[48px\] { padding-inline: 48px; } .py-0 { padding-block: 0px; } .py-1 { padding-block: var(--spacing); } .py-2 { padding-block: calc(var(--spacing) * 2); } .py-3 { padding-block: calc(var(--spacing) * 3); } .py-4 { padding-block: calc(var(--spacing) * 4); } .py-8 { padding-block: calc(var(--spacing) * 8); } .py-10 { padding-block: calc(var(--spacing) * 10); } .py-\[1px\] { padding-block: 1px; } .py-\[2px\] { padding-block: 2px; } .py-\[3px\] { padding-block: 3px; } .py-\[4px\] { padding-block: 4px; } .py-\[5px\] { padding-block: 5px; } .py-\[6px\] { padding-block: 6px; } .py-\[7px\] { padding-block: 7px; } .py-\[8px\] { padding-block: 8px; } .py-\[9px\] { padding-block: 9px; } .py-\[10px\] { padding-block: 10px; } .py-\[11px\] { padding-block: 11px; } .py-\[12px\] { padding-block: 12px; } .py-\[14px\] { padding-block: 14px; } .py-\[16px\] { padding-block: 16px; } .py-\[20px\] { padding-block: 20px; } .py-\[22px\] { padding-block: 22px; } .py-\[24px\] { padding-block: 24px; } .py-\[28px\] { padding-block: 28px; } .py-\[64px\] { padding-block: 64px; } .py-px { padding-block: 1px; } .pt-2 { padding-top: calc(var(--spacing) * 2); } .pt-3 { padding-top: calc(var(--spacing) * 3); } .pt-4 { padding-top: calc(var(--spacing) * 4); } .pt-10 { padding-top: calc(var(--spacing) * 10); } .pt-16 { padding-top: calc(var(--spacing) * 16); } .pt-\[1px\] { padding-top: 1px; } .pt-\[2px\] { padding-top: 2px; } .pt-\[3px\] { padding-top: 3px; } .pt-\[4px\] { padding-top: 4px; } .pt-\[5px\] { padding-top: 5px; } .pt-\[6px\] { padding-top: 6px; } .pt-\[8px\] { padding-top: 8px; } .pt-\[10px\] { padding-top: 10px; } .pt-\[12px\] { padding-top: 12px; } .pt-\[14px\] { padding-top: 14px; } .pt-\[16px\] { padding-top: 16px; } .pt-\[18px\] { padding-top: 18px; } .pt-\[20px\] { padding-top: 20px; } .pt-\[22px\] { padding-top: 22px; } .pt-\[24px\] { padding-top: 24px; } .pt-\[26px\] { padding-top: 26px; } .pt-\[28px\] { padding-top: 28px; } .pt-\[30px\] { padding-top: 30px; } .pt-\[34px\] { padding-top: 34px; } .pt-\[66px\] { padding-top: 66px; } .pt-\[72px\] { padding-top: 72px; } .pr-2 { padding-right: calc(var(--spacing) * 2); } .pr-3 { padding-right: calc(var(--spacing) * 3); } .pr-8 { padding-right: calc(var(--spacing) * 8); } .pr-16 { padding-right: calc(var(--spacing) * 16); } .pr-\[2px\] { padding-right: 2px; } .pr-\[4px\] { padding-right: 4px; } .pr-\[5px\] { padding-right: 5px; } .pr-\[6px\] { padding-right: 6px; } .pr-\[8px\] { padding-right: 8px; } .pr-\[9px\] { padding-right: 9px; } .pr-\[10px\] { padding-right: 10px; } .pr-\[11px\] { padding-right: 11px; } .pr-\[12px\] { padding-right: 12px; } .pr-\[14px\] { padding-right: 14px; } .pr-\[24px\] { padding-right: 24px; } .pr-\[26px\] { padding-right: 26px; } .pr-\[30px\] { padding-right: 30px; } .pr-\[40px\] { padding-right: 40px; } .pr-\[48px\] { padding-right: 48px; } .pb-1 { padding-bottom: var(--spacing); } .pb-2 { padding-bottom: calc(var(--spacing) * 2); } .pb-3 { padding-bottom: calc(var(--spacing) * 3); } .pb-8 { padding-bottom: calc(var(--spacing) * 8); } .pb-\[2px\] { padding-bottom: 2px; } .pb-\[4px\] { padding-bottom: 4px; } .pb-\[6px\] { padding-bottom: 6px; } .pb-\[8px\] { padding-bottom: 8px; } .pb-\[10px\] { padding-bottom: 10px; } .pb-\[12px\] { padding-bottom: 12px; } .pb-\[14px\] { padding-bottom: 14px; } .pb-\[16px\] { padding-bottom: 16px; } .pb-\[18px\] { padding-bottom: 18px; } .pb-\[20px\] { padding-bottom: 20px; } .pb-\[22px\] { padding-bottom: 22px; } .pb-\[24px\] { padding-bottom: 24px; } .pb-\[32px\] { padding-bottom: 32px; } .pb-\[60px\] { padding-bottom: 60px; } .pb-\[100px\] { padding-bottom: 100px; } .pb-\[110px\] { padding-bottom: 110px; } .pb-\[160px\] { padding-bottom: 160px; } .pb-\[200px\] { padding-bottom: 200px; } .pl-\(--indent\) { padding-left: var(--indent); } .pl-1 { padding-left: var(--spacing); } .pl-4 { padding-left: calc(var(--spacing) * 4); } .pl-5 { padding-left: calc(var(--spacing) * 5); } .pl-11 { padding-left: calc(var(--spacing) * 11); } .pl-\[2px\] { padding-left: 2px; } .pl-\[3px\] { padding-left: 3px; } .pl-\[4px\] { padding-left: 4px; } .pl-\[5px\] { padding-left: 5px; } .pl-\[6px\] { padding-left: 6px; } .pl-\[7px\] { padding-left: 7px; } .pl-\[8px\] { padding-left: 8px; } .pl-\[9px\] { padding-left: 9px; } .pl-\[10px\] { padding-left: 10px; } .pl-\[11px\] { padding-left: 11px; } .pl-\[12px\] { padding-left: 12px; } .pl-\[13px\] { padding-left: 13px; } .pl-\[14px\] { padding-left: 14px; } .pl-\[15px\] { padding-left: 15px; } .pl-\[16px\] { padding-left: 16px; } .pl-\[18px\] { padding-left: 18px; } .pl-\[23px\] { padding-left: 23px; } .pl-\[26px\] { padding-left: 26px; } .pl-\[27px\] { padding-left: 27px; } .pl-\[28px\] { padding-left: 28px; } .pl-\[38px\] { padding-left: 38px; } .pl-\[40px\] { padding-left: 40px; } .pl-\[43px\] { padding-left: 43px; } .pl-\[48px\] { padding-left: 48px; } .pl-\[50px\] { padding-left: 50px; } .pl-\[56px\] { padding-left: 56px; } .pl-\[64px\] { padding-left: 64px; } .text-center { text-align: center; } .text-end { text-align: end; } .text-left { text-align: left; } .text-right { text-align: right; } .text-start { text-align: start; } .align-top { vertical-align: top; } .kicker { font-family: var(--font-mono); font-size: var(--text-micro); letter-spacing: var(--tracking-kicker); text-transform: uppercase; color: var(--color-text-3); } .mono-id { font-family: var(--font-mono); font-size: var(--text-mini); letter-spacing: var(--tracking-mono); font-variant-numeric: tabular-nums; color: var(--color-text-3); } .display-title { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-display); line-height: 1; } .font-body { font-family: var(--font-body); } .font-display { font-family: var(--font-display); } .font-mono { font-family: var(--font-mono); } .text-display { font-size: var(--text-display); line-height: var(--tw-leading, var(--text-display--line-height)); letter-spacing: var(--tw-tracking, var(--text-display--letter-spacing)); } .text-h2 { font-size: var(--text-h2); line-height: var(--tw-leading, var(--text-h2--line-height)); letter-spacing: var(--tw-tracking, var(--text-h2--letter-spacing)); } .text-h3 { font-size: var(--text-h3); line-height: var(--tw-leading, var(--text-h3--line-height)); letter-spacing: var(--tw-tracking, var(--text-h3--letter-spacing)); } .text-page { font-size: var(--text-page); line-height: var(--tw-leading, var(--text-page--line-height)); letter-spacing: var(--tw-tracking, var(--text-page--letter-spacing)); } .text-title { font-size: var(--text-title); line-height: var(--tw-leading, var(--text-title--line-height)); letter-spacing: var(--tw-tracking, var(--text-title--letter-spacing)); } .text-body { font-size: var(--text-body); line-height: var(--tw-leading, var(--text-body--line-height)); } .text-h4 { font-size: var(--text-h4); letter-spacing: var(--tw-tracking, var(--text-h4--letter-spacing)); } .text-\[0\.88em\] { font-size: 0.88em; } .text-\[9px\] { font-size: 9px; } .text-\[10\.5px\] { font-size: 10.5px; } .text-\[10px\] { font-size: 10px; } .text-\[11px\] { font-size: 11px; } .text-\[12\.5px\] { font-size: 12.5px; } .text-\[13\.5px\] { font-size: 13.5px; } .text-\[14\.5px\] { font-size: 14.5px; } .text-\[15px\] { font-size: 15px; } .text-\[22px\] { font-size: 22px; } .text-\[28px\] { font-size: 28px; } .text-lead { font-size: var(--text-lead); } .text-md { font-size: var(--text-md); } .text-micro { font-size: var(--text-micro); } .text-mini { font-size: var(--text-mini); } .text-row { font-size: var(--text-row); } .text-small { font-size: var(--text-small); } .text-tile { font-size: var(--text-tile); } .text-tiny { font-size: var(--text-tiny); } .text-ui { font-size: var(--text-ui); } .leading-\[1\.2\] { --tw-leading: 1.2; line-height: 1.2; } .leading-\[1\.3\] { --tw-leading: 1.3; line-height: 1.3; } .leading-\[1\.5\] { --tw-leading: 1.5; line-height: 1.5; } .leading-\[1\.6\] { --tw-leading: 1.6; line-height: 1.6; } .leading-\[1\.7\] { --tw-leading: 1.7; line-height: 1.7; } .leading-\[1\.15\] { --tw-leading: 1.15; line-height: 1.15; } .leading-\[1\.45\] { --tw-leading: 1.45; line-height: 1.45; } .leading-\[1\.55\] { --tw-leading: 1.55; line-height: 1.55; } .leading-\[13px\] { --tw-leading: 13px; line-height: 13px; } .leading-\[14px\] { --tw-leading: 14px; line-height: 14px; } .leading-\[15px\] { --tw-leading: 15px; line-height: 15px; } .leading-\[18px\] { --tw-leading: 18px; line-height: 18px; } .leading-\[22px\] { --tw-leading: 22px; line-height: 22px; } .leading-\[30px\] { --tw-leading: 30px; line-height: 30px; } .leading-body { --tw-leading: var(--leading-body); line-height: var(--leading-body); } .leading-control { --tw-leading: var(--leading-control); line-height: var(--leading-control); } .leading-heading { --tw-leading: var(--leading-heading); line-height: var(--leading-heading); } .leading-none { --tw-leading: 1; line-height: 1; } .leading-normal { --tw-leading: var(--leading-normal); line-height: var(--leading-normal); } .leading-relaxed { --tw-leading: var(--leading-relaxed); line-height: var(--leading-relaxed); } .leading-snug { --tw-leading: var(--leading-snug); line-height: var(--leading-snug); } .leading-tight { --tw-leading: var(--leading-tight); line-height: var(--leading-tight); } .font-bold { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } .font-extrabold { --tw-font-weight: var(--font-weight-extrabold); font-weight: var(--font-weight-extrabold); } .font-medium { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } .font-normal { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); } .font-semibold { --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } .tracking-\[-0\.02em\] { --tw-tracking: -0.02em; letter-spacing: -0.02em; } .tracking-\[-0\.005em\] { --tw-tracking: -0.005em; letter-spacing: -0.005em; } .tracking-\[-0\.015em\] { --tw-tracking: -0.015em; letter-spacing: -0.015em; } .tracking-\[0\.02em\] { --tw-tracking: 0.02em; letter-spacing: 0.02em; } .tracking-\[0\.04em\] { --tw-tracking: 0.04em; letter-spacing: 0.04em; } .tracking-kicker { --tw-tracking: var(--tracking-kicker); letter-spacing: var(--tracking-kicker); } .tracking-label { --tw-tracking: var(--tracking-label); letter-spacing: var(--tracking-label); } .tracking-tag { --tw-tracking: var(--tracking-tag); letter-spacing: var(--tracking-tag); } .\[overflow-wrap\:anywhere\] { overflow-wrap: anywhere; } .break-words { overflow-wrap: break-word; } .break-all { word-break: break-all; } .whitespace-nowrap { white-space: nowrap; } .whitespace-pre { white-space: pre; } .whitespace-pre-line { white-space: pre-line; } .whitespace-pre-wrap { white-space: pre-wrap; } .\[tab-size\:2\] { tab-size: 2; } .text-\(--c\) { color: var(--c); } .text-\(--ink\) { color: var(--ink); } .text-\(--tone\) { color: var(--tone); } .text-\[color-mix\(in_oklab\,var\(--color-today\)_45\%\,white\)\] { color: color-mix(in srgb,#f0453b 45%,white); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab,var(--color-today) 45%,white); } } .text-\[color-mix\(in_oklab\,var\(--color-today\)_55\%\,white\)\] { color: color-mix(in srgb,#f0453b 55%,white); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab,var(--color-today) 55%,white); } } .text-\[color-mix\(in_oklab\,var\(--color-today\)_60\%\,white\)\] { color: color-mix(in srgb,#f0453b 60%,white); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab,var(--color-today) 60%,white); } } .text-\[color-mix\(in_oklab\,var\(--color-today\)_65\%\,white\)\] { color: color-mix(in srgb,#f0453b 65%,white); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab,var(--color-today) 65%,white); } } .text-accent { color: var(--color-accent); } .text-accent-100 { color: var(--color-accent-100); } .text-accent-200 { color: var(--color-accent-200); } .text-accent-ink { color: var(--color-accent-ink); } .text-app-tiktok { color: var(--color-app-tiktok); } .text-attention { color: var(--color-attention); } .text-attention-ink { color: var(--color-attention-ink); } .text-bg { color: var(--color-bg); } .text-check { color: var(--color-check); } .text-current { color: currentcolor; } .text-fam-flow { color: var(--color-fam-flow); } .text-fam-flow\/90 { color: color-mix(in srgb, #3ddc97 90%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-fam-flow) 90%, transparent); } } .text-fam-help { color: var(--color-fam-help); } .text-fam-look { color: var(--color-fam-look); } .text-fam-phone { color: var(--color-fam-phone); } .text-fam-touch { color: var(--color-fam-touch); } .text-fam-values { color: var(--color-fam-values); } .text-fam-values-ink { color: var(--color-fam-values-ink); } .text-fam-values\/60 { color: color-mix(in srgb, #ff9f4a 60%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-fam-values) 60%, transparent); } } .text-neutral-200 { color: var(--color-neutral-200); } .text-neutral-300 { color: var(--color-neutral-300); } .text-neutral-400 { color: var(--color-neutral-400); } .text-neutral-600 { color: var(--color-neutral-600); } .text-ok { color: var(--color-ok); } .text-promo { color: var(--color-promo); } .text-promo-ink { color: var(--color-promo-ink); } .text-range-3-ink { color: var(--color-range-3-ink); } .text-text { color: var(--color-text); } .text-text-2 { color: var(--color-text-2); } .text-text-3 { color: var(--color-text-3); } .text-text-3\/50 { color: color-mix(in srgb, #8b8b93 50%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text-3) 50%, transparent); } } .text-text\/25 { color: color-mix(in srgb, #f2f2ef 25%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 25%, transparent); } } .text-text\/28 { color: color-mix(in srgb, #f2f2ef 28%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 28%, transparent); } } .text-text\/35 { color: color-mix(in srgb, #f2f2ef 35%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 35%, transparent); } } .text-text\/40 { color: color-mix(in srgb, #f2f2ef 40%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 40%, transparent); } } .text-text\/45 { color: color-mix(in srgb, #f2f2ef 45%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 45%, transparent); } } .text-text\/50 { color: color-mix(in srgb, #f2f2ef 50%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 50%, transparent); } } .text-text\/55 { color: color-mix(in srgb, #f2f2ef 55%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 55%, transparent); } } .text-text\/60 { color: color-mix(in srgb, #f2f2ef 60%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 60%, transparent); } } .text-text\/65 { color: color-mix(in srgb, #f2f2ef 65%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 65%, transparent); } } .text-text\/68 { color: color-mix(in srgb, #f2f2ef 68%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 68%, transparent); } } .text-text\/70 { color: color-mix(in srgb, #f2f2ef 70%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 70%, transparent); } } .text-text\/72 { color: color-mix(in srgb, #f2f2ef 72%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 72%, transparent); } } .text-text\/78 { color: color-mix(in srgb, #f2f2ef 78%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 78%, transparent); } } .text-text\/82 { color: color-mix(in srgb, #f2f2ef 82%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 82%, transparent); } } .text-text\/85 { color: color-mix(in srgb, #f2f2ef 85%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-text) 85%, transparent); } } .text-today { color: var(--color-today); } .text-today-ink { color: var(--color-today-ink); } .text-today-ink\/85 { color: color-mix(in srgb, #fff2f1 85%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-today-ink) 85%, transparent); } } .text-transparent { color: transparent; } .lowercase { text-transform: lowercase; } .uppercase { text-transform: uppercase; } .italic { font-style: italic; } .tabular-nums { --tw-numeric-spacing: tabular-nums; font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); } .line-through { text-decoration-line: line-through; } .no-underline { text-decoration-line: none; } .underline { text-decoration-line: underline; } .decoration-accent\/40 { text-decoration-color: color-mix(in srgb, #c8f04a 40%, transparent); @supports (color: color-mix(in lab, red, red)) { text-decoration-color: color-mix(in oklab, var(--color-accent) 40%, transparent); } } .decoration-today\/50 { text-decoration-color: color-mix(in srgb, #f0453b 50%, transparent); @supports (color: color-mix(in lab, red, red)) { text-decoration-color: color-mix(in oklab, var(--color-today) 50%, transparent); } } .underline-offset-2 { text-underline-offset: 2px; } .caret-accent { caret-color: var(--color-accent); } .accent-accent { accent-color: var(--color-accent); } .\[color-scheme\:dark\] { color-scheme: dark; } .opacity-0 { opacity: 0%; } .opacity-25 { opacity: 25%; } .opacity-30 { opacity: 30%; } .opacity-35 { opacity: 35%; } .opacity-40 { opacity: 40%; } .opacity-45 { opacity: 45%; } .opacity-50 { opacity: 50%; } .opacity-55 { opacity: 55%; } .opacity-60 { opacity: 60%; } .opacity-70 { opacity: 70%; } .opacity-75 { opacity: 75%; } .opacity-80 { opacity: 80%; } .opacity-90 { opacity: 90%; } .opacity-95 { opacity: 95%; } .opacity-100 { opacity: 100%; } .opacity-\[0\.42\] { opacity: 0.42; } .shadow { --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1\.5px_rgb\(74_211_255\/0\.55\)\,0_30px_60px_-20px_rgb\(0_0_0\/0\.9\)\] { --tw-shadow: 0 0 0 1.5px var(--tw-shadow-color, rgb(74 211 255/0.55)), 0 30px 60px -20px var(--tw-shadow-color, rgb(0 0 0/0.9)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1\.5px_rgb\(200_240_74\/0\.6\)\,0_0_24px_rgb\(200_240_74\/0\.2\)\] { --tw-shadow: 0 0 0 1.5px var(--tw-shadow-color, rgb(200 240 74/0.6)), 0 0 24px var(--tw-shadow-color, rgb(200 240 74/0.2)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1\.5px_rgb\(240_69_59\/0\.85\)\,0_30px_60px_-20px_rgb\(0_0_0\/0\.9\)\] { --tw-shadow: 0 0 0 1.5px var(--tw-shadow-color, rgb(240 69 59/0.85)), 0 30px 60px -20px var(--tw-shadow-color, rgb(0 0 0/0.9)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1\.5px_rgb\(255_255_255\/0\.10\)\,0_30px_60px_-20px_rgb\(0_0_0\/0\.9\)\] { --tw-shadow: 0 0 0 1.5px var(--tw-shadow-color, rgb(255 255 255/0.10)), 0 30px 60px -20px var(--tw-shadow-color, rgb(0 0 0/0.9)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1\.5px_var\(--color-accent\)\,0_26px_50px_-10px_rgb\(0_0_0\/0\.95\)\] { --tw-shadow: 0 0 0 1.5px var(--tw-shadow-color, var(--color-accent)), 0 26px 50px -10px var(--tw-shadow-color, rgb(0 0 0/0.95)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1\.5px_var\(--color-text\)\] { --tw-shadow: 0 0 0 1.5px var(--tw-shadow-color, var(--color-text)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1\.5px_var\(--color-today\)\] { --tw-shadow: 0 0 0 1.5px var(--tw-shadow-color, var(--color-today)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1px_var\(--color-accent\)\,0_10px_28px_rgba\(0\,0\,0\,0\.5\)\] { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--color-accent)), 0 10px 28px var(--tw-shadow-color, rgba(0,0,0,0.5)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1px_var\(--color-bg\)\] { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--color-bg)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1px_var\(--color-hairline-strong\)\,0_24px_60px_rgb\(0_0_0\/0\.6\)\] { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--color-hairline-strong)), 0 24px 60px var(--tw-shadow-color, rgb(0 0 0/0.6)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_1px_var\(--color-hairline-strong\)\] { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--color-hairline-strong)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_color-mix\(in_oklab\,var\(--color-today\)_55\%\,transparent\)\,var\(--shadow-phone\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, color-mix(in srgb,#f0453b 55%,transparent)), var(--shadow-phone); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 55%,transparent)), var(--shadow-phone); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_rgb\(255_159_74\/0\.45\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, rgb(255 159 74/0.45)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_var\(--color-accent\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_var\(--color-bg\)\,0_0_0_3\.5px_var\(--color-accent\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, var(--color-bg)), 0 0 0 3.5px var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_var\(--color-bg\)\,0_0_0_3\.5px_var\(--color-today\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, var(--color-bg)), 0 0 0 3.5px var(--tw-shadow-color, var(--color-today)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_var\(--color-fam-values\)\,0_0_0_5px_rgb\(255_159_74\/0\.18\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, var(--color-fam-values)), 0 0 0 5px var(--tw-shadow-color, rgb(255 159 74/0.18)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_var\(--color-rail\)\,0_0_0_3\.5px_var\(--color-accent\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, var(--color-rail)), 0 0 0 3.5px var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_2px_var\(--color-rail\)\,0_12px_28px_rgb\(0_0_0\/55\%\)\] { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, var(--color-rail)), 0 12px 28px var(--tw-shadow-color, rgb(0 0 0/55%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_3px_color-mix\(in_oklab\,var\(--color-today\)_18\%\,transparent\)\] { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, color-mix(in srgb,#f0453b 18%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 18%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_3px_color-mix\(in_srgb\,var\(--color-accent\)_10\%\,transparent\)\] { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 10%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, color-mix(in srgb,var(--color-accent) 10%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_3px_rgb\(200_240_74\/0\.18\)\] { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, rgb(200 240 74/0.18)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_3px_var\(--color-bg\)\,0_0_0_5px_var\(--color-accent\)\] { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, var(--color-bg)), 0 0 0 5px var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_3px_var\(--color-chrome\)\] { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, var(--color-chrome)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_4px_rgb\(200_240_74\/0\.22\)\] { --tw-shadow: 0 0 0 4px var(--tw-shadow-color, rgb(200 240 74/0.22)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_0_0_4px_rgb\(255_255_255\/0\.04\)\] { --tw-shadow: 0 0 0 4px var(--tw-shadow-color, rgb(255 255 255/0.04)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_18px_40px_rgb\(0_0_0\/0\.55\)\] { --tw-shadow: 0 18px 40px var(--tw-shadow-color, rgb(0 0 0/0.55)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_18px_50px_rgb\(0_0_0\/0\.55\)\] { --tw-shadow: 0 18px 50px var(--tw-shadow-color, rgb(0 0 0/0.55)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-accent\)_45\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 45%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-accent) 45%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-accent\)_55\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 55%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-accent) 55%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-accent\)_60\%\,transparent\)\,0_0_26px_rgb\(200_240_74\/0\.14\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 60%,transparent)), 0 0 26px var(--tw-shadow-color, rgb(200 240 74/0.14)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-accent) 60%,transparent)), 0 0 26px var(--tw-shadow-color, rgb(200 240 74/0.14)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-accent\)_60\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 60%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-accent) 60%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-accent\)_70\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 70%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-accent) 70%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-attention\)_55\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#e9a13f 55%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-attention) 55%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-attention\)_70\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#e9a13f 70%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-attention) 70%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-fam-help\)_50\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#ff7eb3 50%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-fam-help) 50%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-fam-values\)_55\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#ff9f4a 55%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-fam-values) 55%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-today\)_55\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#f0453b 55%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 55%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_color-mix\(in_oklab\,var\(--color-today\)_60\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in srgb,#f0453b 60%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 60%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_rgb\(255_255_255\/0\.08\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, rgb(255 255 255/0.08)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_rgb\(255_255_255\/14\%\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, rgb(255 255 255/14%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_var\(--color-accent\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_var\(--color-hairline-strong\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, var(--color-hairline-strong)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1\.5px_var\(--color-today\)\] { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, var(--color-today)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_--alpha\(var\(--color-text\)\/7\%\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb, #f2f2ef 7%, transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab, var(--color-text) 7%, transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-attention\)_22\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#e9a13f 22%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-attention) 22%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-fam-help\)_22\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#ff7eb3 22%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-fam-help) 22%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-fam-values\)_35\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#ff9f4a 35%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-fam-values) 35%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-fam-values\)_60\%\,transparent\)\,0_10px_24px_rgb\(0_0_0\/0\.6\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#ff9f4a 60%,transparent)), 0 10px 24px var(--tw-shadow-color, rgb(0 0 0/0.6)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-fam-values) 60%,transparent)), 0 10px 24px var(--tw-shadow-color, rgb(0 0 0/0.6)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-ok\)_20\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#3ddc97 20%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-ok) 20%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-ok\)_30\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#3ddc97 30%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-ok) 30%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-today\)_30\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#f0453b 30%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 30%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-today\)_35\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#f0453b 35%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 35%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-today\)_45\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#f0453b 45%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 45%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-today\)_60\%\,transparent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#f0453b 60%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-today) 60%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(240_69_59\/0\.3\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(240 69 59/0.3)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_159_74\/0\.35\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 159 74/0.35)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_159_74\/0\.38\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 159 74/0.38)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/0\.1\)\,0_18px_40px_rgb\(0_0_0\/0\.55\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/0.1)), 0 18px 40px var(--tw-shadow-color, rgb(0 0 0/0.55)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/0\.1\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/0\.08\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/0.08)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/0\.14\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/0.14)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/6\%\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/6%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/10\%\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/10%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/12\%\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/12%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/14\%\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/14%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/25\%\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/25%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_var\(--color-accent\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_var\(--color-attention\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--color-attention)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_var\(--color-hairline\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--color-hairline)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_var\(--color-hairline-strong\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--color-hairline-strong)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_2px_var\(--color-accent\)\] { --tw-shadow: inset 0 0 0 2px var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_2px_var\(--color-attention\)\] { --tw-shadow: inset 0 0 0 2px var(--tw-shadow-color, var(--color-attention)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_2px_0_0_var\(--color-accent\)\] { --tw-shadow: inset 2px 0 0 var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_3px_0_0_var\(--color-accent\)\] { --tw-shadow: inset 3px 0 0 var(--tw-shadow-color, var(--color-accent)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-ctl { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255 / 8%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-dialog { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255 / 8%)), 0 30px 80px var(--tw-shadow-color, rgb(0 0 0 / 60%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-edge { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255 / 5%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-float { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255 / 8%)), 0 14px 36px var(--tw-shadow-color, rgb(0 0 0 / 50%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-lg { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--color-hairline-strong)), 0 20px 48px var(--tw-shadow-color, rgb(0 0 0 / 60%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-md { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--color-hairline-strong)), 0 8px 24px var(--tw-shadow-color, rgb(0 0 0 / 50%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-phone { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255 / 12%)), 0 20px 40px var(--tw-shadow-color, rgb(0 0 0 / 45%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-sm { --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--color-hairline)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring-1 { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring-2 { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring-3 { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring-accent { --tw-ring-color: var(--color-accent); } .ring-card { --tw-ring-color: var(--color-card); } .ring-chrome { --tw-ring-color: var(--color-chrome); } .ring-hairline { --tw-ring-color: var(--color-hairline); } .ring-hairline-strong { --tw-ring-color: var(--color-hairline-strong); } .ring-rail { --tw-ring-color: var(--color-rail); } .outline { outline-style: var(--tw-outline-style); outline-width: 1px; } .outline-1 { outline-style: var(--tw-outline-style); outline-width: 1px; } .outline-\[1\.5px\] { outline-style: var(--tw-outline-style); outline-width: 1.5px; } .-outline-offset-\[1\.5px\] { outline-offset: calc(1.5px * -1); } .outline-offset-2 { outline-offset: 2px; } .outline-attention { outline-color: var(--color-attention); } .outline-fam-values { outline-color: var(--color-fam-values); } .outline-hairline-strong { outline-color: var(--color-hairline-strong); } .blur { --tw-blur: blur(8px); filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); } .brightness-50 { --tw-brightness: brightness(50%); filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); } .drop-shadow-\[0_12px_24px_rgb\(0_0_0\/0\.6\)\] { --tw-drop-shadow-size: drop-shadow(0 12px 24px var(--tw-drop-shadow-color, rgb(0 0 0/0.6))); --tw-drop-shadow: var(--tw-drop-shadow-size); filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); } .filter { filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); } .backdrop-blur-\[2px\] { --tw-backdrop-blur: blur(2px); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); } .backdrop-blur-sm { --tw-backdrop-blur: blur(var(--blur-sm)); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); } .backdrop-grayscale { --tw-backdrop-grayscale: grayscale(100%); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); } .transition { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[background-color\,box-shadow\] { transition-property: background-color,box-shadow; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[background-color\,color\] { transition-property: background-color,color; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[background-color\] { transition-property: background-color; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[bottom\,right\] { transition-property: bottom,right; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[box-shadow\,background-color\] { transition-property: box-shadow,background-color; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[box-shadow\,transform\] { transition-property: box-shadow,transform; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[box-shadow\] { transition-property: box-shadow; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[left\,width\,opacity\,background-color\] { transition-property: left,width,opacity,background-color; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[left\] { transition-property: left; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[opacity\,box-shadow\,background-color\] { transition-property: opacity,box-shadow,background-color; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[opacity\,box-shadow\] { transition-property: opacity,box-shadow; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-\[width\] { transition-property: width; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-all { transition-property: all; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-colors { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-opacity { transition-property: opacity; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-shadow { transition-property: box-shadow; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .duration-150 { --tw-duration: 150ms; transition-duration: 150ms; } .duration-200 { --tw-duration: 200ms; transition-duration: 200ms; } .duration-250 { --tw-duration: 250ms; transition-duration: 250ms; } .duration-300 { --tw-duration: 300ms; transition-duration: 300ms; } .duration-500 { --tw-duration: 500ms; transition-duration: 500ms; } .duration-\[180ms\] { --tw-duration: 180ms; transition-duration: 180ms; } .duration-\[450ms\] { --tw-duration: 450ms; transition-duration: 450ms; } .ease-nocturne { --tw-ease: var(--ease-nocturne); transition-timing-function: var(--ease-nocturne); } .ease-out { --tw-ease: var(--ease-out); transition-timing-function: var(--ease-out); } .will-change-transform { will-change: transform; } .outline-dashed { --tw-outline-style: dashed; outline-style: dashed; } .outline-none { --tw-outline-style: none; outline-style: none; } .select-all { -webkit-user-select: all; user-select: all; } .select-none { -webkit-user-select: none; user-select: none; } .\[background\:repeating-linear-gradient\(0deg\,transparent_0_0\)\] { background: repeating-linear-gradient(0deg,transparent 0 0); } .\[clip-path\:polygon\(9px_0\,calc\(100\%_-_9px\)_0\,100\%_50\%\,calc\(100\%_-_9px\)_100\%\,9px_100\%\,0_50\%\)\] { clip-path: polygon(9px 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,9px 100%,0 50%); } .\[clip-path\:polygon\(13px_0\,calc\(100\%_-_13px\)_0\,100\%_50\%\,calc\(100\%_-_13px\)_100\%\,13px_100\%\,0_50\%\)\] { clip-path: polygon(13px 0,calc(100% - 13px) 0,100% 50%,calc(100% - 13px) 100%,13px 100%,0 50%); } .\[grid-area\:bar\] { grid-area: bar; } .\[grid-area\:stage\] { grid-area: stage; } .\[grid-area\:work\] { grid-area: work; } .\[grid-template-areas\:\'stage_work\'_\'stage_bar\'\] { grid-template-areas: 'stage work' 'stage bar'; } .\[transition\:var\(--tr\)\] { transition: var(--tr); } .ring-inset { --tw-ring-inset: inset; } @media (hover: hover) { .group-hover\:bg-neutral-700:is(:where(.group):hover *) { background-color: var(--color-neutral-700); } .group-hover\:bg-text\/4:is(:where(.group):hover *) { background-color: color-mix(in srgb, #f2f2ef 4%, transparent); } @supports (color: color-mix(in lab, red, red)) { .group-hover\:bg-text\/4:is(:where(.group):hover *) { background-color: color-mix(in oklab, var(--color-text) 4%, transparent); } } .group-hover\:text-text:is(:where(.group):hover *) { color: var(--color-text); } .group-hover\:text-text-2:is(:where(.group):hover *) { color: var(--color-text-2); } .group-hover\:opacity-0:is(:where(.group):hover *) { opacity: 0%; } .group-hover\:opacity-100:is(:where(.group):hover *) { opacity: 100%; } .group-hover\:shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/0\.28\)\]:is(:where(.group):hover *) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/0.28)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .group-hover\:ring-hairline-strong:is(:where(.group):hover *) { --tw-ring-color: var(--color-hairline-strong); } .group-hover\/bar\:opacity-100:is(:where(.group\/bar):hover *) { opacity: 100%; } .group-hover\/block\:hidden:is(:where(.group\/block):hover *) { display: none; } .group-hover\/block\:inline:is(:where(.group\/block):hover *) { display: inline; } .group-hover\/chip\:opacity-100:is(:where(.group\/chip):hover *) { opacity: 100%; } .group-hover\/row\:text-text-2:is(:where(.group\/row):hover *) { color: var(--color-text-2); } .group-hover\/sep\:bg-accent\/30:is(:where(.group\/sep):hover *) { background-color: color-mix(in srgb, #c8f04a 30%, transparent); } @supports (color: color-mix(in lab, red, red)) { .group-hover\/sep\:bg-accent\/30:is(:where(.group\/sep):hover *) { background-color: color-mix(in oklab, var(--color-accent) 30%, transparent); } } .group-hover\/tab\:visible:is(:where(.group\/tab):hover *) { visibility: visible; } } .peer-focus-visible\:ring-2:is(:where(.peer):focus-visible ~ *) { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .peer-focus-visible\:ring-accent:is(:where(.peer):focus-visible ~ *) { --tw-ring-color: var(--color-accent); } .marker\:text-text-3 ::marker { color: var(--color-text-3); } .marker\:text-text-3::marker { color: var(--color-text-3); } .marker\:text-text-3 ::-webkit-details-marker { color: var(--color-text-3); } .marker\:text-text-3::-webkit-details-marker { color: var(--color-text-3); } .file\:mr-3::file-selector-button { margin-right: calc(var(--spacing) * 3); } .file\:rounded-md::file-selector-button { border-radius: var(--radius-md); } .file\:border-0::file-selector-button { border-style: var(--tw-border-style); border-width: 0px; } .file\:bg-raised::file-selector-button { background-color: var(--color-raised); } .file\:px-3::file-selector-button { padding-inline: calc(var(--spacing) * 3); } .file\:py-1::file-selector-button { padding-block: var(--spacing); } .file\:text-text::file-selector-button { color: var(--color-text); } .placeholder\:font-normal::placeholder { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); } .placeholder\:text-text-3::placeholder { color: var(--color-text-3); } .backdrop\:bg-bg\/80::backdrop { background-color: color-mix(in srgb, #141416 80%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-bg) 80%, transparent); } } .backdrop\:bg-scrim::backdrop { background-color: var(--color-scrim); } .after\:pointer-events-none::after { content: var(--tw-content); pointer-events: none; } .after\:absolute::after { content: var(--tw-content); position: absolute; } .after\:top-1\/2::after { content: var(--tw-content); top: calc(1 / 2 * 100%); } .after\:-right-\[3px\]::after { content: var(--tw-content); right: calc(3px * -1); } .after\:h-\[16px\]::after { content: var(--tw-content); height: 16px; } .after\:w-px::after { content: var(--tw-content); width: 1px; } .after\:-translate-y-1\/2::after { content: var(--tw-content); --tw-translate-y: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .after\:bg-hairline-strong::after { content: var(--tw-content); background-color: var(--color-hairline-strong); } .after\:opacity-0::after { content: var(--tw-content); opacity: 0%; } .after\:transition-opacity::after { content: var(--tw-content); transition-property: opacity; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .first\:mt-0:first-child { margin-top: 0px; } .first\:translate-x-0:first-child { --tw-translate-x: 0px; translate: var(--tw-translate-x) var(--tw-translate-y); } .first\:border-t-0:first-child { border-top-style: var(--tw-border-style); border-top-width: 0px; } .first\:pt-\[4px\]:first-child { padding-top: 4px; } .last\:mb-0:last-child { margin-bottom: 0px; } .last\:border-r-0:last-child { border-right-style: var(--tw-border-style); border-right-width: 0px; } .last\:border-b-0:last-child { border-bottom-style: var(--tw-border-style); border-bottom-width: 0px; } .focus-within\:border-accent\/35:focus-within { border-color: color-mix(in srgb, #c8f04a 35%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 35%, transparent); } } .focus-within\:bg-raised:focus-within { background-color: var(--color-raised); } .focus-within\:opacity-100:focus-within { opacity: 100%; } .focus-within\:shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-accent\)_55\%\,transparent\)\]:focus-within { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 55%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-accent) 55%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .focus-within\:shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/12\%\)\]:focus-within { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/12%)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .focus-within\:shadow-\[inset_0_0_0_1px_var\(--color-hairline-strong\)\]:focus-within { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--color-hairline-strong)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } @media (hover: hover) { .hover\:border-accent\/50:hover { border-color: color-mix(in srgb, #c8f04a 50%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:border-accent\/50:hover { border-color: color-mix(in oklab, var(--color-accent) 50%, transparent); } } .hover\:border-accent\/60:hover { border-color: color-mix(in srgb, #c8f04a 60%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:border-accent\/60:hover { border-color: color-mix(in oklab, var(--color-accent) 60%, transparent); } } .hover\:border-hairline-strong:hover { border-color: var(--color-hairline-strong); } .hover\:border-text-3:hover { border-color: var(--color-text-3); } .hover\:border-text\/25:hover { border-color: color-mix(in srgb, #f2f2ef 25%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:border-text\/25:hover { border-color: color-mix(in oklab, var(--color-text) 25%, transparent); } } .hover\:border-text\/30:hover { border-color: color-mix(in srgb, #f2f2ef 30%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:border-text\/30:hover { border-color: color-mix(in oklab, var(--color-text) 30%, transparent); } } .hover\:border-today:hover { border-color: var(--color-today); } .hover\:bg-\[color-mix\(in_oklab\,var\(--color-card\)_92\%\,white\)\]:hover { background-color: color-mix(in srgb,#1b1b1f 92%,white); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-\[color-mix\(in_oklab\,var\(--color-card\)_92\%\,white\)\]:hover { background-color: color-mix(in oklab,var(--color-card) 92%,white); } } .hover\:bg-\[color-mix\(in_oklab\,var\(--color-card\)_93\%\,white\)\]:hover { background-color: color-mix(in srgb,#1b1b1f 93%,white); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-\[color-mix\(in_oklab\,var\(--color-card\)_93\%\,white\)\]:hover { background-color: color-mix(in oklab,var(--color-card) 93%,white); } } .hover\:bg-accent-400:hover { background-color: var(--color-accent-400); } .hover\:bg-accent\/6:hover { background-color: color-mix(in srgb, #c8f04a 6%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-accent\/6:hover { background-color: color-mix(in oklab, var(--color-accent) 6%, transparent); } } .hover\:bg-accent\/20:hover { background-color: color-mix(in srgb, #c8f04a 20%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-accent\/20:hover { background-color: color-mix(in oklab, var(--color-accent) 20%, transparent); } } .hover\:bg-card:hover { background-color: var(--color-card); } .hover\:bg-card\/60:hover { background-color: color-mix(in srgb, #1b1b1f 60%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-card\/60:hover { background-color: color-mix(in oklab, var(--color-card) 60%, transparent); } } .hover\:bg-control:hover { background-color: var(--color-control); } .hover\:bg-control-hover:hover { background-color: var(--color-control-hover); } .hover\:bg-control\/50:hover { background-color: color-mix(in srgb, #26262b 50%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-control\/50:hover { background-color: color-mix(in oklab, var(--color-control) 50%, transparent); } } .hover\:bg-control\/60:hover { background-color: color-mix(in srgb, #26262b 60%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-control\/60:hover { background-color: color-mix(in oklab, var(--color-control) 60%, transparent); } } .hover\:bg-field:hover { background-color: var(--color-field); } .hover\:bg-neutral-200:hover { background-color: var(--color-neutral-200); } .hover\:bg-neutral-700:hover { background-color: var(--color-neutral-700); } .hover\:bg-neutral-800:hover { background-color: var(--color-neutral-800); } .hover\:bg-raised:hover { background-color: var(--color-raised); } .hover\:bg-raised\/40:hover { background-color: color-mix(in srgb, #222226 40%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-raised\/40:hover { background-color: color-mix(in oklab, var(--color-raised) 40%, transparent); } } .hover\:bg-raised\/60:hover { background-color: color-mix(in srgb, #222226 60%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-raised\/60:hover { background-color: color-mix(in oklab, var(--color-raised) 60%, transparent); } } .hover\:bg-selected:hover { background-color: var(--color-selected); } .hover\:bg-selected-strong:hover { background-color: var(--color-selected-strong); } .hover\:bg-text\/3:hover { background-color: color-mix(in srgb, #f2f2ef 3%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-text\/3:hover { background-color: color-mix(in oklab, var(--color-text) 3%, transparent); } } .hover\:bg-text\/5:hover { background-color: color-mix(in srgb, #f2f2ef 5%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-text\/5:hover { background-color: color-mix(in oklab, var(--color-text) 5%, transparent); } } .hover\:bg-today\/10:hover { background-color: color-mix(in srgb, #f0453b 10%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-today\/10:hover { background-color: color-mix(in oklab, var(--color-today) 10%, transparent); } } .hover\:bg-today\/24:hover { background-color: color-mix(in srgb, #f0453b 24%, transparent); } @supports (color: color-mix(in lab, red, red)) { .hover\:bg-today\/24:hover { background-color: color-mix(in oklab, var(--color-today) 24%, transparent); } } .hover\:bg-transparent:hover { background-color: transparent; } .hover\:text-accent:hover { color: var(--color-accent); } .hover\:text-accent-ink:hover { color: var(--color-accent-ink); } .hover\:text-bg:hover { color: var(--color-bg); } .hover\:text-fam-look:hover { color: var(--color-fam-look); } .hover\:text-neutral-200:hover { color: var(--color-neutral-200); } .hover\:text-neutral-600:hover { color: var(--color-neutral-600); } .hover\:text-text:hover { color: var(--color-text); } .hover\:text-text-2:hover { color: var(--color-text-2); } .hover\:text-today:hover { color: var(--color-today); } .hover\:underline:hover { text-decoration-line: underline; } .hover\:decoration-accent:hover { text-decoration-color: var(--color-accent); } .hover\:opacity-80:hover { opacity: 80%; } .hover\:opacity-85:hover { opacity: 85%; } .hover\:opacity-100:hover { opacity: 100%; } .hover\:shadow-\[0_0_0_3px_var\(--color-control-hover\)\]:hover { --tw-shadow: 0 0 0 3px var(--tw-shadow-color, var(--color-control-hover)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .hover\:shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/0\.2\)\]:hover { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/0.2)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .hover\:shadow-\[inset_0_0_0_1px_rgb\(255_255_255\/0\.28\)\]:hover { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(255 255 255/0.28)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .hover\:after\:opacity-0:hover::after { content: var(--tw-content); opacity: 0%; } } .focus\:border-accent\/50:focus { border-color: color-mix(in srgb, #c8f04a 50%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 50%, transparent); } } .focus\:border-accent\/60:focus { border-color: color-mix(in srgb, #c8f04a 60%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-accent) 60%, transparent); } } .focus-visible\:bg-raised:focus-visible { background-color: var(--color-raised); } .focus-visible\:opacity-100:focus-visible { opacity: 100%; } .focus-visible\:shadow-\[0_0_0_2px_rgb\(200_240_74\/0\.6\)\]:focus-visible { --tw-shadow: 0 0 0 2px var(--tw-shadow-color, rgb(200 240 74/0.6)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .focus-visible\:shadow-\[inset_0_0_0_1\.5px_var\(--color-fam-values\)\]:focus-visible { --tw-shadow: inset 0 0 0 1.5px var(--tw-shadow-color, var(--color-fam-values)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .focus-visible\:shadow-\[inset_0_0_0_1px_color-mix\(in_oklab\,var\(--color-accent\)_55\%\,transparent\)\]:focus-visible { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#c8f04a 55%,transparent)); @supports (color: color-mix(in lab, red, red)) { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in oklab,var(--color-accent) 55%,transparent)); } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .focus-visible\:outline-2:focus-visible { outline-style: var(--tw-outline-style); outline-width: 2px; } .focus-visible\:outline-offset-0:focus-visible { outline-offset: 0px; } .focus-visible\:outline-accent:focus-visible { outline-color: var(--color-accent); } .focus-visible\:outline-accent\/70:focus-visible { outline-color: color-mix(in srgb, #c8f04a 70%, transparent); @supports (color: color-mix(in lab, red, red)) { outline-color: color-mix(in oklab, var(--color-accent) 70%, transparent); } } .active\:cursor-grabbing:active { cursor: grabbing; } .active\:bg-accent-600:active { background-color: var(--color-accent-600); } @media (hover: hover) { .enabled\:hover\:text-text:enabled:hover { color: var(--color-text); } } .disabled\:pointer-events-none:disabled { pointer-events: none; } .disabled\:cursor-default:disabled { cursor: default; } .disabled\:cursor-not-allowed:disabled { cursor: not-allowed; } .disabled\:resize-none:disabled { resize: none; } .disabled\:bg-control:disabled { background-color: var(--color-control); } .disabled\:text-text-2:disabled { color: var(--color-text-2); } .disabled\:text-text-3:disabled { color: var(--color-text-3); } .disabled\:opacity-30:disabled { opacity: 30%; } .disabled\:opacity-35:disabled { opacity: 35%; } .disabled\:opacity-40:disabled { opacity: 40%; } .disabled\:opacity-50:disabled { opacity: 50%; } .disabled\:opacity-60:disabled { opacity: 60%; } @media (hover: hover) { .disabled\:hover\:bg-transparent:disabled:hover { background-color: transparent; } .disabled\:hover\:text-text-3:disabled:hover { color: var(--color-text-3); } } :where(:disabled) .in-disabled\:hidden { display: none; } @media (width >= 40rem) { .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sm\:grid-cols-\[160px_minmax\(0\,1fr\)\] { grid-template-columns: 160px minmax(0,1fr); } .sm\:grid-cols-\[minmax\(0\,1fr\)_96px\] { grid-template-columns: minmax(0,1fr) 96px; } } @media (width >= 48rem) { .md\:flex { display: flex; } .md\:hidden { display: none; } .md\:grid-cols-\[252px_minmax\(0\,1fr\)\] { grid-template-columns: 252px minmax(0,1fr); } .md\:grid-cols-\[272px_minmax\(0\,1fr\)\] { grid-template-columns: 272px minmax(0,1fr); } .md\:border-r { border-right-style: var(--tw-border-style); border-right-width: 1px; } .md\:border-b-0 { border-bottom-style: var(--tw-border-style); border-bottom-width: 0px; } .md\:px-\[28px\] { padding-inline: 28px; } .md\:px-\[32px\] { padding-inline: 32px; } .md\:px-\[40px\] { padding-inline: 40px; } .md\:py-\[26px\] { padding-block: 26px; } } @container script (width < 860px) { .\@max-\[860px\]\/script\:pl-\[80px\] { padding-left: 80px; } } @container page (width < 780px) { .\@max-\[780px\]\/page\:w-full { width: 100%; } .\@max-\[780px\]\/page\:flex-none { flex: none; } .\@max-\[780px\]\/page\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .\@max-\[780px\]\/page\:flex-col { flex-direction: column; } .\@max-\[780px\]\/page\:overflow-visible { overflow: visible; } .\@max-\[780px\]\/page\:overflow-y-auto { overflow-y: auto; } .\@max-\[780px\]\/page\:border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; } .\@max-\[780px\]\/page\:border-l-0 { border-left-style: var(--tw-border-style); border-left-width: 0px; } .\@max-\[780px\]\/page\:pb-\[24px\] { padding-bottom: 24px; } } @container toolbar (width < 760px) { .\@max-\[760px\]\/toolbar\:sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } } @container page (width < 640px) { .\@max-\[640px\]\/page\:w-full { width: 100%; } } @container toolbar (width < 620px) { .\@max-\[620px\]\/toolbar\:sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } } @container page (width < 560px) { .\@max-\[560px\]\/page\:hidden { display: none; } .\@max-\[560px\]\/page\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .\@max-\[560px\]\/page\:px-\[16px\] { padding-inline: 16px; } .\@max-\[560px\]\/page\:pl-\[16px\] { padding-left: 16px; } } @container toolbar (width < 520px) { .\@max-\[520px\]\/toolbar\:col-span-3 { grid-column: span 3 / span 3; } .\@max-\[520px\]\/toolbar\:col-start-1 { grid-column-start: 1; } .\@max-\[520px\]\/toolbar\:row-start-2 { grid-row-start: 2; } } @container (width < 90px) { .\@max-\[90px\]\:hidden { display: none; } } @container (width < 64px) { .\@max-\[64px\]\:hidden { display: none; } } @container (width >= 440px) { .\@min-\[440px\]\:grid { display: grid; } .\@min-\[440px\]\:grid-cols-\[180px_minmax\(0\,1fr\)\] { grid-template-columns: 180px minmax(0,1fr); } .\@min-\[440px\]\:items-start { align-items: flex-start; } .\@min-\[440px\]\:gap-x-\[20px\] { column-gap: 20px; } } @container (width >= 460px) { .\@min-\[460px\]\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @container (width >= 560px) { .\@min-\[560px\]\:flex { display: flex; } .\@min-\[560px\]\:pl-\[20px\] { padding-left: 20px; } } @container (width >= 600px) { .\@min-\[600px\]\:col-span-2 { grid-column: span 2 / span 2; } .\@min-\[600px\]\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .\@min-\[600px\]\:border-t-0 { border-top-style: var(--tw-border-style); border-top-width: 0px; } .\@min-\[600px\]\:border-l { border-left-style: var(--tw-border-style); border-left-width: 1px; } } @container page (width >= 640px) { .\@min-\[640px\]\/page\:col-span-2 { grid-column: span 2 / span 2; } .\@min-\[640px\]\/page\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .\@min-\[640px\]\/page\:grid-cols-\[minmax\(0\,300px\)_minmax\(0\,1fr\)\] { grid-template-columns: minmax(0,300px) minmax(0,1fr); } } @container (width >= 640px) { .\@min-\[640px\]\:flex-col { flex-direction: column; } .\@min-\[640px\]\:flex-row { flex-direction: row; } .\@min-\[640px\]\:items-end { align-items: flex-end; } .\@min-\[640px\]\:items-start { align-items: flex-start; } .\@min-\[640px\]\:gap-\[24px\] { gap: 24px; } } @container page (width >= 640px) { .\@min-\[640px\]\/page\:pl-\[40px\] { padding-left: 40px; } } @container (width >= 680px) { .\@min-\[680px\]\:sticky { position: sticky; } .\@min-\[680px\]\:top-\[66px\] { top: 66px; } .\@min-\[680px\]\:w-\[260px\] { width: 260px; } .\@min-\[680px\]\:flex-row { flex-direction: row; } .\@min-\[680px\]\:items-start { align-items: flex-start; } } @container page (width >= 700px) { .\@min-\[700px\]\/page\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @container (width >= 760px) { .\@min-\[760px\]\:\[grid-column\:var\(--span\)\] { grid-column: var(--span); } .\@min-\[760px\]\:\[grid-template-columns\:var\(--cols\)\] { grid-template-columns: var(--cols); } .\@min-\[760px\]\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @container page (width >= 900px) { .\@min-\[900px\]\/page\:block { display: block; } } @container (width >= 900px) { .\@min-\[900px\]\:block { display: block; } .\@min-\[900px\]\:inline { display: inline; } } @container (width >= 960px) { .\@min-\[960px\]\:w-\[300px\] { width: 300px; } } @container page (width >= 960px) { .\@min-\[960px\]\/page\:grid-cols-\[auto_minmax\(0\,1fr\)\] { grid-template-columns: auto minmax(0,1fr); } } @container (width >= 960px) { .\@min-\[960px\]\:gap-\[36px\] { gap: 36px; } } @container page (width >= 1000px) { .\@min-\[1000px\]\/page\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } } @container (width >= 1100px) { .\@min-\[1100px\]\:inline { display: inline; } } .\[\&_code\]\:bg-transparent code { background-color: transparent; } .\[\&_code\]\:p-0 code { padding: 0px; } .\[\&_code\]\:text-\[1em\] code { font-size: 1em; } .\[\&_svg\]\:animate-spin svg { animation: var(--animate-spin); } .\[\&_svg\]\:text-text-2 svg { color: var(--color-text-2); } .\[\&\:\:-webkit-search-cancel-button\]\:hidden::-webkit-search-cancel-button { display: none; } .\[\&\:has\(\+\[aria-selected\=true\]\)\]\:after\:opacity-0:has( + [aria-selected=true])::after { content: var(--tw-content); opacity: 0%; } .\[\&\:has\(\+\[role\=tab\]\:hover\)\]\:after\:opacity-0:has( + [role=tab]:hover)::after { content: var(--tw-content); opacity: 0%; } .\[\&\:not\(\:has\(\+\[role\=tab\]\)\)\]\:after\:hidden:not(:has( + [role=tab]))::after { content: var(--tw-content); display: none; } } @layer base { html, body { margin: 0; background: var(--color-chrome); color: var(--color-text); font-family: var(--font-body); font-size: var(--text-body); line-height: var(--leading-body); font-weight: 400; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 500; line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); margin: 0; } a { color: inherit; text-underline-offset: 3px; text-decoration-color: var(--color-text-3); } a:hover { color: var(--color-accent); text-decoration-color: currentColor; } ::selection { background: color-mix(in srgb, #c8f04a 30%, transparent); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in oklab, var(--color-accent) 30%, transparent); } } :focus { outline: none; } :focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; } input[type="range"]:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 4px; } input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.8); cursor: pointer; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } } } #min-widget > iframe { scale: calc(40 / 60); transform-origin: 100% 100%; } #chat-bubble { display: none !important; } @media (display-mode: window-controls-overlay) { .app-titlebar { padding-left: env(titlebar-area-x, 0px); app-region: drag; -webkit-app-region: drag; } .app-titlebar :is(button, a, input, [role="tab"], [role="button"], [role="menu"], [role="dialog"]) { app-region: no-drag; -webkit-app-region: no-drag; } } @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-rotate-x { syntax: "*"; inherits: false; } @property --tw-rotate-y { syntax: "*"; inherits: false; } @property --tw-rotate-z { syntax: "*"; inherits: false; } @property --tw-skew-x { syntax: "*"; inherits: false; } @property --tw-skew-y { syntax: "*"; inherits: false; } @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-divide-x-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-gradient-position { syntax: "*"; inherits: false; } @property --tw-gradient-from { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-via { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-to { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-stops { syntax: "*"; inherits: false; } @property --tw-gradient-via-stops { syntax: "*"; inherits: false; } @property --tw-gradient-from-position { syntax: ""; inherits: false; initial-value: 0%; } @property --tw-gradient-via-position { syntax: ""; inherits: false; initial-value: 50%; } @property --tw-gradient-to-position { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-leading { syntax: "*"; inherits: false; } @property --tw-font-weight { syntax: "*"; inherits: false; } @property --tw-tracking { syntax: "*"; inherits: false; } @property --tw-ordinal { syntax: "*"; inherits: false; } @property --tw-slashed-zero { syntax: "*"; inherits: false; } @property --tw-numeric-figure { syntax: "*"; inherits: false; } @property --tw-numeric-spacing { syntax: "*"; inherits: false; } @property --tw-numeric-fraction { syntax: "*"; inherits: false; } @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-shadow-color { syntax: "*"; inherits: false; } @property --tw-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-shadow-color { syntax: "*"; inherits: false; } @property --tw-inset-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-ring-color { syntax: "*"; inherits: false; } @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-ring-color { syntax: "*"; inherits: false; } @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-ring-inset { syntax: "*"; inherits: false; } @property --tw-ring-offset-width { syntax: ""; inherits: false; initial-value: 0px; } @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; } @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-blur { syntax: "*"; inherits: false; } @property --tw-brightness { syntax: "*"; inherits: false; } @property --tw-contrast { syntax: "*"; inherits: false; } @property --tw-grayscale { syntax: "*"; inherits: false; } @property --tw-hue-rotate { syntax: "*"; inherits: false; } @property --tw-invert { syntax: "*"; inherits: false; } @property --tw-opacity { syntax: "*"; inherits: false; } @property --tw-saturate { syntax: "*"; inherits: false; } @property --tw-sepia { syntax: "*"; inherits: false; } @property --tw-drop-shadow { syntax: "*"; inherits: false; } @property --tw-drop-shadow-color { syntax: "*"; inherits: false; } @property --tw-drop-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-drop-shadow-size { syntax: "*"; inherits: false; } @property --tw-backdrop-blur { syntax: "*"; inherits: false; } @property --tw-backdrop-brightness { syntax: "*"; inherits: false; } @property --tw-backdrop-contrast { syntax: "*"; inherits: false; } @property --tw-backdrop-grayscale { syntax: "*"; inherits: false; } @property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false; } @property --tw-backdrop-invert { syntax: "*"; inherits: false; } @property --tw-backdrop-opacity { syntax: "*"; inherits: false; } @property --tw-backdrop-saturate { syntax: "*"; inherits: false; } @property --tw-backdrop-sepia { syntax: "*"; inherits: false; } @property --tw-duration { syntax: "*"; inherits: false; } @property --tw-ease { syntax: "*"; inherits: false; } @property --tw-content { syntax: "*"; initial-value: ""; inherits: false; } @keyframes spin { to { transform: rotate(360deg); } } @keyframes pulse { 50% { opacity: 0.5; } } @keyframes pop-in { from { opacity: 0; transform: translateY(4px) scale(0.96); } to { opacity: 1; transform: none; } } @keyframes onb-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } } @keyframes onb-pop { 0% { opacity: 0; transform: scale(0.72); } 62% { transform: scale(1.06); } 100% { opacity: 1; transform: scale(1); } } @keyframes onb-breathe { 0%, 100% { opacity: 0.28; transform: scale(1); } 50% { opacity: 1; transform: scale(1.18); } } @keyframes onb-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } } @keyframes onb-glow { 0%, 100% { opacity: 0.25; } 50% { opacity: 0.6; } } @layer properties { @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { *, ::before, ::after, ::backdrop { --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-space-x-reverse: 0; --tw-divide-x-reverse: 0; --tw-border-style: solid; --tw-gradient-position: initial; --tw-gradient-from: #0000; --tw-gradient-via: #0000; --tw-gradient-to: #0000; --tw-gradient-stops: initial; --tw-gradient-via-stops: initial; --tw-gradient-from-position: 0%; --tw-gradient-via-position: 50%; --tw-gradient-to-position: 100%; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-backdrop-blur: initial; --tw-backdrop-brightness: initial; --tw-backdrop-contrast: initial; --tw-backdrop-grayscale: initial; --tw-backdrop-hue-rotate: initial; --tw-backdrop-invert: initial; --tw-backdrop-opacity: initial; --tw-backdrop-saturate: initial; --tw-backdrop-sepia: initial; --tw-duration: initial; --tw-ease: initial; --tw-content: ""; } } }