/* ============================================================ Acelera Gráfica — Página de captura (versão estática) Tailwind CSS v4 compilado + design tokens + utilities globais. Gerado a partir de app/tokens.css + app/globals.css do projeto Next.js, com escopo limitado às classes usadas em index.html. Fontes auto-hospedadas em ./assets — nenhum recurso externo. ============================================================ */ /* ── Plus Jakarta Sans (self-hosted) ───────────────────────── */ @font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('assets/jakarta-cyrillic-ext.woff2') format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F} @font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('assets/jakarta-vietnamese.woff2') format('woff2');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:'Plus Jakarta Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('assets/jakarta-latin-ext.woff2') format('woff2');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:'Plus Jakarta Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('assets/jakarta-latin.woff2') format('woff2');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} /* Métricas de fallback — evita layout shift antes da fonte carregar (equivalente ao 'Plus Jakarta Sans Fallback' gerado pelo next/font) */ @font-face{font-family:'Plus Jakarta Sans Fallback';src:local('Arial');ascent-override:98.88%;descent-override:21.15%;line-gap-override:0%;size-adjust:104.98%} /* Variável consumida por --font-sans e pelo style inline do . Na versão Next.js vinha da classe gerada pelo next/font. */ :root{--font-jakarta:'Plus Jakarta Sans','Plus Jakarta Sans Fallback'} /*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */ @layer properties; @layer theme, base, components, utilities; @layer theme { :root, :host { --font-sans: var(--font-jakarta), system-ui, -apple-system, BlinkMacSystemFont, "Plus Jakarta Sans", "Segoe UI", sans-serif; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-red-400: oklch(70.4% 0.191 22.216); --color-red-500: oklch(63.7% 0.237 25.331); --color-red-600: oklch(57.7% 0.245 27.325); --color-emerald-500: oklch(69.6% 0.17 162.48); --color-white: #fff; --spacing: 0.25rem; --container-sm: 24rem; --container-md: 28rem; --container-lg: 32rem; --container-xl: 36rem; --container-2xl: 42rem; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --tracking-wider: 0.05em; --tracking-widest: 0.1em; --leading-tight: 1.25; --leading-snug: 1.375; --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; --default-transition-duration: 150ms; --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); --color-background: var(--bg-primary); --color-text-main: var(--label); --radius-card: var(--radius-card); --radius-control: var(--radius-control); --radius-sheet: var(--radius-sheet); --radius-container: var(--radius-container); } } @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, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; } hr { height: 0; color: inherit; border-top-width: 1px; } abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; -webkit-text-decoration: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings, normal); font-variation-settings: var(--default-mono-font-variation-settings, normal); font-size: 1em; } small { font-size: 80%; } sub, sup { 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 { 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 { .fixed { position: fixed; } .top-0 { top: calc(var(--spacing) * 0); } .z-50 { z-index: 50; } .mx-auto { margin-inline: auto; } .mt-0\.5 { margin-top: calc(var(--spacing) * 0.5); } .mt-1 { margin-top: calc(var(--spacing) * 1); } .mt-3 { margin-top: calc(var(--spacing) * 3); } .mt-5 { margin-top: calc(var(--spacing) * 5); } .mt-8 { margin-top: calc(var(--spacing) * 8); } .mt-12 { margin-top: calc(var(--spacing) * 12); } .scroll-mt-14 { scroll-margin-top: calc(var(--spacing) * 14); } .mb-0\.5 { margin-bottom: calc(var(--spacing) * 0.5); } .mb-1 { margin-bottom: calc(var(--spacing) * 1); } .mb-2 { margin-bottom: calc(var(--spacing) * 2); } .mb-2\.5 { margin-bottom: calc(var(--spacing) * 2.5); } .mb-3 { margin-bottom: calc(var(--spacing) * 3); } .mb-5 { margin-bottom: calc(var(--spacing) * 5); } .mb-6 { margin-bottom: calc(var(--spacing) * 6); } .mb-14 { margin-bottom: calc(var(--spacing) * 14); } .mb-8 { margin-bottom: calc(var(--spacing) * 8); } .mb-10 { margin-bottom: calc(var(--spacing) * 10); } .mb-12 { margin-bottom: calc(var(--spacing) * 12); } .block { display: block; } .flex { display: flex; } .grid { display: grid; } .hidden { display: none; } .inline { display: inline; } .inline-flex { display: inline-flex; } .h-1\.5 { height: calc(var(--spacing) * 1.5); } .h-4 { height: calc(var(--spacing) * 4); } .h-5 { height: calc(var(--spacing) * 5); } .h-6 { height: calc(var(--spacing) * 6); } .h-7 { height: calc(var(--spacing) * 7); } .h-12 { height: calc(var(--spacing) * 12); } .h-14 { height: calc(var(--spacing) * 14); } .h-\[46px\] { height: 46px; } .min-h-\[50px\] { min-height: 50px; } .min-h-\[52px\] { min-height: 52px; } .min-h-screen { min-height: 100vh; } .h-10 { height: calc(var(--spacing) * 10); } .w-1\.5 { width: calc(var(--spacing) * 1.5); } .w-4 { width: calc(var(--spacing) * 4); } .w-5 { width: calc(var(--spacing) * 5); } .w-6 { width: calc(var(--spacing) * 6); } .w-12 { width: calc(var(--spacing) * 12); } .w-auto { width: auto; } .w-full { width: 100%; } .max-w-2xl { max-width: var(--container-2xl); } .max-w-\[720px\] { max-width: 720px; } .max-w-\[860px\] { max-width: 860px; } .max-w-\[1100px\] { max-width: 1100px; } .max-w-md { max-width: var(--container-md); } .max-w-lg { max-width: var(--container-lg); } .max-w-sm { max-width: var(--container-sm); } .max-w-xl { max-width: var(--container-xl); } .flex-1 { flex: 1 1 0%; } .flex-shrink-0 { flex-shrink: 0; } .animate-pulse { animation: var(--animate-pulse); } .animate-spin { animation: var(--animate-spin); } .flex-col { flex-direction: column; } .items-center { align-items: center; } .items-start { align-items: flex-start; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .gap-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-12 { gap: calc(var(--spacing) * 12); } .space-y-3 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-4 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-5 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-6 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))); } } .overflow-hidden { overflow: hidden; } .rounded-\[var\(--radius-card\)\] { border-radius: var(--radius-card); } .rounded-\[var\(--radius-control\)\] { border-radius: var(--radius-control); } .rounded-full { border-radius: calc(infinity * 1px); } .border { border-style: var(--tw-border-style); border-width: 1px; } .border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; } .border-b { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } .border-l-4 { border-left-style: var(--tw-border-style); border-left-width: 4px; } .border-\[var\(--separator-opaque\)\]\/30 { border-color: var(--separator-opaque); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--separator-opaque) 30%, transparent); } } .border-\[var\(--separator-opaque\)\]\/40 { border-color: var(--separator-opaque); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--separator-opaque) 40%, transparent); } } .border-red-500\/30 { border-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 30%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-red-500) 30%, transparent); } } .border-white\/10 { border-color: color-mix(in srgb, #fff 10%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-white) 10%, transparent); } } .bg-\[\#1D1D1F\] { background-color: #1D1D1F; } .bg-\[var\(--bg-grouped\)\] { background-color: var(--bg-grouped); } .bg-\[var\(--bg-primary\)\] { background-color: var(--bg-primary); } .bg-background { background-color: var(--color-background); } .bg-red-400 { background-color: var(--color-red-400); } .bg-red-500\/15 { background-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 15%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-red-500) 15%, transparent); } } .object-contain { object-fit: contain; } .p-4 { padding: calc(var(--spacing) * 4); } .p-5 { padding: calc(var(--spacing) * 5); } .p-6 { padding: calc(var(--spacing) * 6); } .p-7 { padding: calc(var(--spacing) * 7); } .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-\[22px\] { padding-inline: 22px; } .px-\[26px\] { padding-inline: 26px; } .py-1\.5 { padding-block: calc(var(--spacing) * 1.5); } .py-4 { padding-block: calc(var(--spacing) * 4); } .py-5 { padding-block: calc(var(--spacing) * 5); } .py-6 { padding-block: calc(var(--spacing) * 6); } .py-16 { padding-block: calc(var(--spacing) * 16); } .py-20 { padding-block: calc(var(--spacing) * 20); } .pt-0\.5 { padding-top: calc(var(--spacing) * 0.5); } .pt-2 { padding-top: calc(var(--spacing) * 2); } .pt-32 { padding-top: calc(var(--spacing) * 32); } .pb-20 { padding-bottom: calc(var(--spacing) * 20); } .text-center { text-align: center; } .text-left { text-align: left; } .font-sans { font-family: var(--font-sans); } .text-\[11px\] { font-size: 11px; } .text-\[12px\] { font-size: 12px; } .text-\[14px\] { font-size: 14px; } .text-\[13px\] { font-size: 13px; } .whitespace-nowrap { white-space: nowrap; } .tabular-nums { font-variant-numeric: tabular-nums; } .text-\[15px\] { font-size: 15px; } .text-\[16px\] { font-size: 16px; } .text-\[17px\] { font-size: 17px; } .text-\[18px\] { font-size: 18px; } .text-\[22px\] { font-size: 22px; } .text-\[clamp\(18px\,2\.5vw\,24px\)\] { font-size: clamp(18px, 2.5vw, 24px); } .text-\[clamp\(22px\,4vw\,30px\)\] { font-size: clamp(22px, 4vw, 30px); } .text-\[clamp\(28px\,5vw\,44px\)\] { font-size: clamp(28px, 5vw, 44px); } .text-\[clamp\(26px\,3\.5vw\,34px\)\] { font-size: clamp(26px, 3.5vw, 34px); } .text-\[clamp\(26px\,4vw\,42px\)\] { font-size: clamp(26px, 4vw, 42px); } .text-\[clamp\(28px\,4\.5vw\,48px\)\] { font-size: clamp(28px, 4.5vw, 48px); } .text-\[clamp\(30px\,4\.5vw\,52px\)\] { font-size: clamp(30px, 4.5vw, 52px); } .text-\[clamp\(34px\,6vw\,52px\)\] { font-size: clamp(34px, 6vw, 52px); } .leading-\[1\.1\] { --tw-leading: 1.1; line-height: 1.1; } .leading-\[1\.4\] { --tw-leading: 1.4; line-height: 1.4; } .leading-\[1\.5\] { --tw-leading: 1.5; line-height: 1.5; } .leading-\[1\.6\] { --tw-leading: 1.6; line-height: 1.6; } .leading-\[1\.65\] { --tw-leading: 1.65; line-height: 1.65; } .leading-\[1\.7\] { --tw-leading: 1.7; line-height: 1.7; } .leading-none { --tw-leading: 1; line-height: 1; } .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-\[400\] { --tw-font-weight: 400; font-weight: 400; } .font-bold { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } .font-medium { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } .font-semibold { --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } .tracking-\[-0\.4px\] { --tw-tracking: -0.4px; letter-spacing: -0.4px; } .tracking-\[0\.3px\] { --tw-tracking: 0.3px; letter-spacing: 0.3px; } .tracking-wider { --tw-tracking: var(--tracking-wider); letter-spacing: var(--tracking-wider); } .tracking-widest { --tw-tracking: var(--tracking-widest); letter-spacing: var(--tracking-widest); } .text-\[var\(--label\)\] { color: var(--label); } .text-\[var\(--label-secondary\)\] { color: var(--label-secondary); } .text-\[var\(--tint\)\] { color: var(--tint); } .text-emerald-500 { color: var(--color-emerald-500); } .text-red-400 { color: var(--color-red-400); } .text-red-500 { color: var(--color-red-500); } .text-red-600 { color: var(--color-red-600); } .text-text-main { color: var(--color-text-main); } .text-white { color: var(--color-white); } .text-white\/40 { color: color-mix(in srgb, #fff 40%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 40%, transparent); } } .text-white\/45 { color: color-mix(in srgb, #fff 45%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 45%, transparent); } } .text-white\/50 { color: color-mix(in srgb, #fff 50%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 50%, transparent); } } .text-white\/55 { color: color-mix(in srgb, #fff 55%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 55%, transparent); } } .text-white\/70 { color: color-mix(in srgb, #fff 70%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 70%, transparent); } } .text-white\/75 { color: color-mix(in srgb, #fff 75%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 75%, transparent); } } .uppercase { text-transform: uppercase; } .not-italic { font-style: normal; } .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .opacity-25 { opacity: 25%; } .opacity-75 { opacity: 75%; } .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-transform { transition-property: transform, translate, scale, rotate; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .duration-200 { --tw-duration: 200ms; transition-duration: 200ms; } .duration-\[80ms\] { --tw-duration: 80ms; transition-duration: 80ms; } .ease-out { --tw-ease: var(--ease-out); transition-timing-function: var(--ease-out); } .hover\:text-white\/60 { &:hover { @media (hover: hover) { color: color-mix(in srgb, #fff 60%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 60%, transparent); } } } } .hover\:opacity-90 { &:hover { @media (hover: hover) { opacity: 90%; } } } .focus\:outline-none { &:focus { --tw-outline-style: none; outline-style: none; } } .active\:scale-\[0\.97\] { &:active { scale: 0.97; } } .disabled\:pointer-events-none { &:disabled { pointer-events: none; } } .disabled\:opacity-40 { &:disabled { opacity: 40%; } } .md\:grid-cols-2 { @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .md\:col-span-2 { @media (width >= 48rem) { grid-column: span 2 / span 2; } } .md\:flex-row { @media (width >= 48rem) { flex-direction: row; } } .md\:gap-5 { @media (width >= 48rem) { gap: calc(var(--spacing) * 5); } } .md\:gap-16 { @media (width >= 48rem) { gap: calc(var(--spacing) * 16); } } .md\:p-7 { @media (width >= 48rem) { padding: calc(var(--spacing) * 7); } } .md\:p-8 { @media (width >= 48rem) { padding: calc(var(--spacing) * 8); } } .md\:p-9 { @media (width >= 48rem) { padding: calc(var(--spacing) * 9); } } .md\:px-7 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 7); } } .md\:px-10 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 10); } } .md\:py-28 { @media (width >= 48rem) { padding-block: calc(var(--spacing) * 28); } } .md\:pt-40 { @media (width >= 48rem) { padding-top: calc(var(--spacing) * 40); } } .md\:pb-28 { @media (width >= 48rem) { padding-bottom: calc(var(--spacing) * 28); } } .md\:text-\[13px\] { @media (width >= 48rem) { font-size: 13px; } } .md\:text-\[14px\] { @media (width >= 48rem) { font-size: 14px; } } .md\:text-\[16px\] { @media (width >= 48rem) { font-size: 16px; } } .md\:text-\[17px\] { @media (width >= 48rem) { font-size: 17px; } } .md\:text-\[18px\] { @media (width >= 48rem) { font-size: 18px; } } .md\:text-\[19px\] { @media (width >= 48rem) { font-size: 19px; } } } :root { --font-apple: system-ui, -apple-system, BlinkMacSystemFont, "Plus Jakarta Sans", "Segoe UI", sans-serif; --text-caption2: 11px; --text-caption1: 12px; --text-footnote: 13px; --text-subheadline: 15px; --text-callout: 16px; --text-body: 17px; --text-headline: 17px; --text-title3: 20px; --text-title2: 22px; --text-title1: 28px; --text-large-title: 34px; --lh-caption2: 13px; --lh-footnote: 18px; --lh-body: 22px; --lh-title3: 25px; --lh-title2: 28px; --lh-title1: 34px; --lh-large-title: 41px; --tracking-title: -0.4px; --tracking-body: -0.41px; --tracking-label: 0px; --weight-regular: 400; --weight-medium: 500; --weight-semibold: 600; --space-1: 4px; --space-2: 8px; --space-4: 16px; --space-6: 24px; --space-8: 32px; --space-11: 44px; --radius-control: 10px; --radius-card: 14px; --radius-sheet: 20px; --radius-container: 28px; --glass-blur: blur(20px); --glass-saturate: saturate(180%); --glass-bg-light: rgba(255, 255, 255, 0.72); --glass-bg-dark: rgba(28, 28, 30, 0.72); --glass-border-light: rgba(255, 255, 255, 0.5); --glass-border-dark: rgba(255, 255, 255, 0.12); --label: rgba(0, 0, 0, 1); --label-secondary: rgba(60, 60, 67, 0.60); --label-tertiary: rgba(60, 60, 67, 0.30); --label-quaternary: rgba(60, 60, 67, 0.18); --fill: rgba(120, 120, 128, 0.20); --fill-secondary: rgba(120, 120, 128, 0.16); --fill-tertiary: rgba(118, 118, 128, 0.12); --fill-quaternary: rgba(116, 116, 128, 0.08); --bg-primary: #FFFFFF; --bg-secondary: #F2F2F7; --bg-tertiary: #FFFFFF; --bg-grouped: #F2F2F7; --bg-grouped-secondary: #FFFFFF; --bg-grouped-tertiary: #F2F2F7; --separator: rgba(60, 60, 67, 0.29); --separator-opaque: #C6C6C8; --tint: #5D5DFF; --tint-fill: rgba(93, 93, 255, 0.15); --tint-light: rgba(93, 93, 255, 0.08); --color-green: #34C759; --color-orange: #FF9F0A; --color-red: #FF3B30; --color-blue: #007AFF; --spring: cubic-bezier(0.34, 1.56, 0.64, 1); --spring-duration: 0.4s; --ease-nav: 0.3s ease-in-out; --press-scale: 0.97; --press-ms: 80ms; } @media (prefers-color-scheme: dark) { :root { --label: rgba(255, 255, 255, 1); --label-secondary: rgba(235, 235, 245, 0.60); --label-tertiary: rgba(235, 235, 245, 0.30); --label-quaternary: rgba(235, 235, 245, 0.18); --fill: rgba(120, 120, 128, 0.36); --fill-secondary: rgba(120, 120, 128, 0.32); --fill-tertiary: rgba(118, 118, 128, 0.24); --fill-quaternary: rgba(118, 118, 128, 0.18); --bg-primary: #1C1C1E; --bg-secondary: #2C2C2E; --bg-tertiary: #3A3A3C; --bg-grouped: #111111; --bg-grouped-secondary: #2C2C2E; --bg-grouped-tertiary: #3A3A3C; --separator: rgba(84, 84, 88, 0.60); --separator-opaque: #38383A; --tint: #7B7BFF; --tint-fill: rgba(123, 123, 255, 0.20); --tint-light: rgba(123, 123, 255, 0.10); --color-green: #30D158; --color-orange: #FFD60A; --color-red: #FF453A; --color-blue: #0A84FF; --glass-bg-light: rgba(28, 28, 30, 0.72); --glass-border-light: rgba(255, 255, 255, 0.12); } } @layer base { html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } body { font-family: var(--font-jakarta), var(--font-apple); font-size: var(--text-body); line-height: var(--lh-body); letter-spacing: var(--tracking-body); color: var(--label); background-color: var(--bg-primary); } h1, h2, h3, h4, h5, h6 { letter-spacing: var(--tracking-title); font-weight: var(--weight-semibold); } :focus-visible { outline: 2px solid var(--tint); outline-offset: 2px; border-radius: var(--radius-control); } } @layer utilities { .glass { backdrop-filter: var(--glass-blur) var(--glass-saturate); -webkit-backdrop-filter: var(--glass-blur) var(--glass-saturate); background: var(--glass-bg-light); border: 1px solid var(--glass-border-light); } .glass-dark { backdrop-filter: var(--glass-blur) var(--glass-saturate); -webkit-backdrop-filter: var(--glass-blur) var(--glass-saturate); background: var(--glass-bg-dark); border: 1px solid var(--glass-border-dark); } .press { transition: transform var(--press-ms) ease; } .press:active { transform: scale(var(--press-scale)); } .apple-card { background: var(--bg-grouped-secondary); border-radius: var(--radius-card); border: none; } .inset-separator { border-bottom: 1px solid var(--separator); margin-left: var(--space-4); } } @keyframes ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } } @layer utilities { .animate-ticker { animation: ticker-scroll 35s linear infinite; will-change: transform; } } @media (prefers-reduced-motion: no-preference) { .animate-spring-in { animation: springIn var(--spring-duration) var(--spring) both; } .animate-fade-in-up { animation: fadeInUp 0.5s ease both; } .animate-fade-in-up.delay-100 { animation-delay: 100ms; } .animate-fade-in-up.delay-200 { animation-delay: 200ms; } .animate-fade-in-up.delay-300 { animation-delay: 300ms; } .animate-fade-in-up.delay-400 { animation-delay: 400ms; } .animate-fade-in-up.delay-500 { animation-delay: 500ms; } .animate-float { animation: float 3s ease-in-out infinite; } .animate-float-slow { animation: float 4.5s ease-in-out infinite; } .animate-fade-in-down { animation: fadeInDown 0.25s var(--spring) both; } } @keyframes springIn { from { opacity: 0; transform: scale(0.94) translateY(8px); } to { opacity: 1; transform: scale(1) translateY(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeInDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } } @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } } ::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: var(--separator-opaque); border-radius: 3px; } ::-webkit-scrollbar-thumb:hover { background: var(--label-secondary); } @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-leading { syntax: "*"; inherits: false; } @property --tw-font-weight { syntax: "*"; inherits: false; } @property --tw-tracking { syntax: "*"; inherits: false; } @property --tw-duration { syntax: "*"; inherits: false; } @property --tw-ease { syntax: "*"; inherits: false; } @keyframes spin { to { transform: rotate(360deg); } } @keyframes pulse { 50% { opacity: 0.5; } } @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-space-y-reverse: 0; --tw-border-style: solid; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-duration: initial; --tw-ease: initial; } } }