ví_crypto_an_toàn_và_mạnh_mẽ___ctrl_wallet___style_reference:
  info: "> sticker-bombed white lab — confetti cards on surgical chrome"

  theme: "light"

  info: "Ctrl sử dụng chủ nghĩa tối giản trên nền trắng tinh, bị ngắt quãng bởi những mảng màu confetti vui tươi — một bảng chrome gần như đơn sắc, nơi chữ đen và viền mỏng đảm nhận vai trò cấu trúc, còn các card màu vàng, hồng, xanh dương và xanh lá bão hòa rải rác khắp layout như những tờ giấy ghi chú. Màu chức năng duy nhất là xanh lá tươi (#05c92f), dành riêng cho pill download/CTA neo giữ mọi màn hình. Typography là một font grotesque tùy chỉnh duy nhất (Tomato Grotesk) được triển khai ở kích thước display cực lớn với leading dày đặc (0.77–0.90), khiến headline mang cảm giác kiến trúc hơn là typographic. Các component phẳng, dựa trên viền, và được bo tròn rộng rãi — pill buttons, card góc bo mềm ở 17.5px, và bán kính lớn hơn 35–52px trên các phần tử tương tác. Hệ thống tránh hoàn toàn elevation; thứ bậc đến từ kích thước, weight, và độ tương phản màu sắc, không phải độ sâu đổ bóng."

  tokens___colors:

    info: "| Tên | Giá trị | Token | Vai trò |"
    info: "|------|-------|-------|---------|"
    info: "| Acid Lime | `#05c92f` | `--color-acid-lime` | Lớp phủ xanh lá cho highlight background, dải trang trí, và điểm nhấn mềm phía sau nội dung. Không nâng cấp nó thành màu CTA chính |"
    info: "| Sticker Yellow | `#fcea59` | `--color-sticker-yellow` | Nền card accent trang trí, icon fills, điểm nhấn confetti trên hero và feature spreads |"
    info: "| Cotton Pink | `#ffd0e2` | `--color-cotton-pink` | Nền card accent trang trí, dấu câu màu sắc mềm mại trên layout tính năng |"
    info: "| Powder Blue | `#a7cbf6` | `--color-powder-blue` | Nền card accent trang trí, bề mặt callout thông tin |"
    info: "| Obsidian | `#000000` | `--color-obsidian` | Văn bản chính, icon strokes chính, viền mảnh, nút download đặc trong nav |"
    info: "| Carbon | `#0f0f0f` | `--color-carbon` | Bề mặt tối phụ, viền nút, viền card, strokes tương tác mạnh |"
    info: "| Ash Gray | `#5a585a` | `--color-ash-gray` | Văn bản body mờ, viền link, nav sublabels, icon strokes phụ |"
    info: "| Slate Gray | `#6e726e` | `--color-slate-gray` | Văn bản trợ giúp, viền ưu tiên thấp, metadata cấp ba |"
    info: "| Paper White | `#f9faf9` | `--color-paper-white` | Canvas trang, nền chính, bề mặt mục FAQ |"
    info: "| Pure White | `#ffffff` | `--color-pure-white` | Bề mặt card, trường nhập liệu, panel nội dung nâng cao |"
    info: "| Bone | `#ecefec` | `--color-bone` | Nền nav pill, hàng accordion FAQ, bề mặt card mềm, chip mờ |"
    info: "| Plaster | `#eeeeee` | `--color-plaster` | Nền trường nhập liệu, bề mặt disabled tinh tế |"

  tokens___typography:

    tomato_grotesk___font_duy_nhất_mang_toàn_bộ_thương_hiệu___một_geometric_grotesque_tùy_chỉnh_được_triển_khai_ở_kích_thước_display_cực_lớn_lên_đến_176px_với_leading_dày_đặc_0_77_0_80_khiến_headline_có_cảm_giác_như_những_mảng_cắt_kiến_trúc_thay_vì_type_được_sắp_chữ__weight_600_ở_display__500_ở_body_và_ui__line_height_dày_đặc_ở_tỷ_lệ_hero_là_điểm_nhấn__nó_xếp_chồng__take__và__ctrl__thành_một_khối_thị_giác_duy_nhất_____font_tomato_grotesk:
      - "**Thay thế:** Inter Tight, Manrope, Space Grotesk"
      - "**Weights:** 500, 600"
      - "**Kích thước:** 11, 13, 14, 18, 21, 25, 26, 28, 32, 35, 53, 70, 84, 105, 153, 158, 176"
      - "**Line height:** 0.77–0.90 cho display (70–176px), 1.0–1.13 cho subheadings (25–53px), 1.25–1.50 cho body"
      - "**Letter spacing:** normal ở mọi kích thước — tracking giữ mặc định, độ chặt về thị giác đến từ nén line-height, không phải tracking âm"
      - "**Vai trò:** Font duy nhất mang toàn bộ thương hiệu — một geometric grotesque tùy chỉnh được triển khai ở kích thước display cực lớn (lên đến 176px) với leading dày đặc (0.77–0.80) khiến headline có cảm giác như những mảng cắt kiến trúc thay vì type được sắp chữ. Weight 600 ở display, 500 ở body và UI. Line-height dày đặc ở tỷ lệ hero là điểm nhấn: nó xếp chồng 'Take' và 'Ctrl.' thành một khối thị giác duy nhất."

    type_scale:

      info: "| Vai trò | Kích thước | Line Height | Letter Spacing | Token |"
      info: "|---------|-----------|-------------|----------------|-------|"
      info: "| caption | 11px | 1.5 | — | `--text-caption` |"
      info: "| body-lg | 18px | 1.5 | — | `--text-body-lg` |"
      info: "| subheading | 25px | 1.13 | — | `--text-subheading` |"
      info: "| heading-sm | 35px | 1.06 | — | `--text-heading-sm` |"
      info: "| heading | 53px | 1.02 | — | `--text-heading` |"
      info: "| heading-lg | 84px | 0.9 | — | `--text-heading-lg` |"
      info: "| display | 153px | 0.8 | — | `--text-display` |"
      info: "| display-xl | 176px | 0.77 | — | `--text-display-xl` |"

  tokens___spacing___shapes:

    density: "spacious"

    spacing_scale:

      info: "| Tên | Giá trị | Token |"
      info: "|-----|--------|-------|"
      info: "| 4 | 4px | `--spacing-4` |"
      info: "| 7 | 7px | `--spacing-7` |"
      info: "| 9 | 9px | `--spacing-9` |"
      info: "| 11 | 11px | `--spacing-11` |"
      info: "| 13 | 13px | `--spacing-13` |"
      info: "| 18 | 18px | `--spacing-18` |"
      info: "| 26 | 26px | `--spacing-26` |"
      info: "| 31 | 31px | `--spacing-31` |"
      info: "| 35 | 35px | `--spacing-35` |"
      info: "| 42 | 42px | `--spacing-42` |"
      info: "| 44 | 44px | `--spacing-44` |"
      info: "| 53 | 53px | `--spacing-53` |"
      info: "| 55 | 55px | `--spacing-55` |"
      info: "| 70 | 70px | `--spacing-70` |"
      info: "| 105 | 105px | `--spacing-105` |"
      info: "| 149 | 149px | `--spacing-149` |"

    border_radius:

      info: "| Phần tử | Giá trị |"
      info: "|---------|--------|"
      info: "| nav | 9px |"
      info: "| tags | 14px |"
      info: "| cards | 17.5px |"
      info: "| inputs | 35px |"
      info: "| buttons | 35px |"
      info: "| largeElements | 53px |"

    layout:

      - "**Page max-width:** 1200px"
      - "**Section gap:** 80px"
      - "**Card padding:** 26px"
      - "**Element gap:** 18px"

  components:

    green_download_pill:
      vai_trò: "CTA hành động chính"

      info: "Pill xanh lá tươi (#05c92f) với chữ trắng, border-radius 35px, padding dọc 18px, padding ngang ~26px. Chứa icon Chrome Dots nhỏ (ba vòng tròn chồng lên nhau màu cyan/vàng/đỏ hoặc màu thương hiệu) theo sau là nhãn 'Download for Chrome' bằng Tomato Grotesk 500 ở 14–18px. Đây là nút màu đặc duy nhất trong hệ thống — mọi CTA khác đều là đen hoặc ghost."

    black_nav_download_button:
      vai_trò: "CTA hành động phụ trong navigation"

      info: "Pill đen đặc (#0f0f0f), radius 35px, chữ trắng ở 14px weight 500, padding dọc 14px / ngang 18px. Nằm ở góc trên bên phải của header. Nhẹ hơn pill xanh lá — dùng làm hành động hỗ trợ khi pill xanh đã có trên trang."

    ghost_nav_pill:
      vai_trò: "Container navigation với các link phụ"

      info: "Container bo tròn màu Bone (#ecefec), radius ~9px, padding dọc 18px / ngang 18px+, chứa các link $CTRL | Support | Security | Resources được phân cách bằng dải phân cách dọc mảnh màu #0f0f0f. Link có kích thước 13–14px Tomato Grotesk 500 màu #0f0f0f."

    confetti_accent_card:
      vai_trò: "Card tính năng trang trí với nền màu"

      info: "Card nền đặc màu Sticker Yellow (#fcea59), Cotton Pink (#ffd0e2), hoặc Powder Blue (#a7cbf6), border-radius 17.5px, padding 26px. Chứa headline ngắn ở 18–25px weight 500 màu #0f0f0f và một pill tag nhỏ (ví dụ 'Simple') ở 11–13px. Các card này rải rác khắp các section tính năng để thêm màu sắc vào hệ thống đơn sắc — không bao giờ dùng quá 3 card màu trên mỗi vùng thị giác."

    faq_accordion_row:
      vai_trò: "Mục FAQ có thể mở rộng"

      info: "Nền Bone (#ecefec), border-radius 17.5px, padding dọc 26px, văn bản câu hỏi ở 18px weight 500 màu #0f0f0f bên trái, icon plus tròn (viền 1px, 24px) bên phải. Các hàng xếp chồng với khoảng cách 4–8px. Khi mở rộng hiển thị padding bổ sung và văn bản câu trả lời màu #5a585a."

    display_headline:
      vai_trò: "Văn bản hero và tiêu đề section"

      info: "Tomato Grotesk 600 ở 153–176px, line-height 0.77–0.80, #0f0f0f hoặc #000000. Nén line-height cực đoan khiến tiêu đề nhiều từ có cảm giác như một khối thị giác duy nhất. Luôn căn giữa hoặc căn trái — không bao giờ justified."

    section_eyebrow:
      vai_trò: "Văn bản nhỏ phía trên display headline"

      info: "Tomato Grotesk 500 ở 14–18px, #0f0f0f hoặc #5a585a, căn giữa phía trên display headline (ví dụ 'One wallet for all your crypto' phía trên 'Take Ctrl.'). Cung cấp bối cảnh tông màu cho headline khổng lồ bên dưới."

    social_auth_icon_cluster:
      vai_trò: "Nút OAuth provider"

      info: "Ba icon tròn nhỏ (Google G, Facebook f, Apple logo) ở ~28–35px, mỗi icon trong một vòng tròn pastel mềm (xanh dương, vàng, xanh lá nhạt) với glyph thương hiệu ở trung tâm. Sắp xếp theo hàng ngang trên card đăng nhập xã hội."

    phone_mockup_container:
      vai_trò: "Khung xem trước sản phẩm"

      info: "Khung thiết bị hình chữ nhật cao (tỷ lệ màn hình điện thoại) với nội thất trắng hiển thị UI ứng dụng, được bao quanh bởi các phần tử confetti rải rác (chip vàng, hồng, xanh dương với văn bản vui tươi). Khung có viền 1px #0f0f0f và radius ~17.5px."

    chrome_dots_icon:
      vai_trò: "Chỉ báo trình duyệt/extension"

      info: "Ba vòng tròn nhỏ chồng lên nhau theo hàng (thường là xanh lá, vàng, đỏ hoặc màu thương hiệu), đường kính 12–16px mỗi vòng, dùng inline trước nhãn download. Một dấu hiệu nhận biết của thương hiệu Ctrl — xác định tải xuống Chrome extension."

    plus_toggle_icon:
      vai_trò: "Chỉ báo mở rộng/thu gọn cho accordion"

      info: "Nút tròn, viền 1px #0f0f0f, đường kính ~24px, chứa glyph plus mảnh. Dùng trên hàng FAQ và bất kỳ nội dung có thể thu gọn nào. Không có nền — chỉ outline."

  do_s_and_don_ts:

    nên_làm:
      - "Dùng #05c92f (Acid Lime) độc quyền cho pill download/CTA chính — đây là màu hành động màu sắc duy nhất trong hệ thống"
      - "Đặt display headline ở 153–176px với line-height 0.77–0.80 để đạt hiệu ứng cắt kiến trúc"
      - "Dùng radius 17.5px cho card và 35px cho nút/input — bo tròn hai cấp này là dấu hiệu cấu trúc của hệ thống"
      - "Thể hiện elevation thông qua chuyển đổi màu bề mặt (#f9faf9 → #ffffff → #ecefec) và viền 1px, không bao giờ dùng drop shadows"
      - "Rải rác card confetti màu (vàng, hồng, xanh dương) khắp các section tính năng để thêm năng lượng vào canvas đơn sắc — giới hạn 2–3 card mỗi vùng thị giác"
      - "Giữ tất cả văn bản body và UI ở weight 500, tất cả văn bản display ở weight 600 — không giới thiệu weight 400 hoặc 700"
      - "Dùng Tomato Grotesk làm font duy nhất; không bao giờ kết hợp với họ font thứ hai"

    không_nên_làm:
      - "Không dùng drop shadows, glows, hoặc hiệu ứng mờ — hệ thống cố tình phẳng và dựa trên viền"
      - "Không dùng nhiều hơn một màu card accent trong một nhóm thị giác duy nhất — hiệu ứng confetti yêu cầu khoảng cách giữa các màu"
      - "Không đặt văn bản display với line-height trên 0.90 — nén chặt là điều khiến headline có cảm giác hoành tráng"
      - "Không giới thiệu màu hành động thứ hai cho CTA phụ — dùng nút đen đặc hoặc ghost thay vì thêm pill màu"
      - "Không dùng góc nhọn (0px radius) trên bất kỳ phần tử tương tác nào — tối thiểu 9px trên nav, 17.5px trên card, 35px trên nút"
      - "Không kết hợp CTA xanh lá với phần tử xanh lá khác trên cùng màn hình — nó phải là điểm nhấn màu sắc duy nhất"
      - "Không dùng #000000 và #0f0f0f thay thế cho nhau — dành #0f0f0f cho viền và bề mặt tối, #000000 cho văn bản chính và nav"

  surfaces:

    info: "| Cấp | Tên | Giá trị | Mục đích |"
    info: "|-----|-----|--------|----------|"
    info: "| 0 | Canvas | `#f9faf9` | Nền trang — trắng ấm làm mềm độ tương phản gay gắt của trắng tinh |"
    info: "| 1 | Card | `#ffffff` | Card nội dung, panel tính năng, và khối nội dung nâng cao |"
    info: "| 2 | Bone Surface | `#ecefec` | Nav pill, hàng accordion FAQ, bề mặt tương tác mờ |"
    info: "| 3 | Input | `#eeeeee` | Nền trường biểu mẫu, trạng thái disabled |"

  elevation:

    info: "Hệ thống này cố tình tránh box-shadows. Elevation được thể hiện thông qua chuyển đổi màu bề mặt (canvas #f9faf9 → card #ffffff → bone #ecefec) và viền mảnh 1–2px màu #0f0f0f hoặc #5a585a. Cách tiếp cận phẳng, dựa trên viền giữ cho giao diện có cảm giác đồ họa và giống in ấn, như sticker dán trên giấy. Không giới thiệu drop shadows, glows, hoặc hiệu ứng mờ — chúng sẽ phá vỡ ngôn ngữ sticker/collage."

  imagery:

    info: "Ảnh chụp màn hình sản phẩm được trình bày bên trong khung mockup điện thoại với các phần tử confetti màu rải rác (chip giống sticker màu vàng, hồng, xanh dương với văn bản ngắn vui tươi) được sắp xếp xung quanh thiết bị. Không có ảnh chụp lối sống, không có hình ảnh con người. Ngôn ngữ thị giác là sticker-bomb/collage — các mảnh accent giống giấy màu chồng lên nhau và trôi nổi xung quanh khung sản phẩm sạch sẽ trên nền trắng. Icon dạng line, stroke 1–1.5px, đơn sắc (#0f0f0f) trừ khi hoạt động như bảng màu confetti. Thẩm mỹ mang phong cách 'designer's moodboard' — sự hỗn loạn có chủ đích xung quanh một sản phẩm sạch sẽ duy nhất."

  layout:

    info: "Các section full-width với nội dung căn giữa max-width ~1200px. Hero căn giữa: eyebrow text → display headline khổng lồ → green CTA pill, tất cả xếp chồng dọc với khoảng trống dọc rộng rãi. Các section tính năng xen kẽ giữa bố cục trái-text/phải-visual và căn giữa. Section FAQ căn trái với eyebrow căn giữa phía trên display heading. Navigation là thanh trên cùng với logo trái, nav pill giữa, nút download phải. Nhịp điệu dọc dùng section gap 80px; card trong section dùng padding 26px. Cảm giác tổng thể rộng rãi nhưng nén trong type — whitespace rộng bao quanh các khối văn bản dày đặc, line-height chặt."

  agent_prompt_guide:

  quick_color_reference:
    - "Text (primary): #0f0f0f"
    - "Text (muted): #5a585a"
    - "Background (canvas): #f9faf9"
    - "Background (card): #ffffff"
    - "Border: #0f0f0f"
    - "Accent (confetti cards): #fcea59, #ffd0e2, #a7cbf6"
    - "primary action: #0f0f0f (filled action)"

  example_component_prompts:

    - "Tạo Primary Action Button: nền #0f0f0f, chữ #ffffff, radius 9999px, padding pill nhỏ gọn. Dùng xử lý đặc này cho CTA chính."

    - "**Confetti Feature Card**: Nền Cotton Pink (#ffd0e2), radius 17.5px, padding 26px. Headline 'Create your wallet in seconds.' bằng Tomato Grotesk 500, 25px, line-height 1.13, #0f0f0f, kèm icon tia sét nhỏ. Tag 'Simple' ở góc dưới trái bằng 11px weight 500 trên pill trắng với radius 14px."

    - "**FAQ Accordion Row**: Nền #ecefec, radius 17.5px, padding dọc 26px. Văn bản câu hỏi bằng Tomato Grotesk 500, 18px, #0f0f0f. Nút plus tròn căn phải: viền 1px #0f0f0f, đường kính 24px, glyph plus mảnh."

    - "**Ghost Nav Pill**: Nền #ecefec, radius 9px, padding 7px 18px. Bốn link ('$CTRL', 'Support', 'Security', 'Resources') ở 13px weight 500, #0f0f0f, được phân cách bằng dải phân cách dọc 1px màu #0f0f0f."

    - "**Display FAQ Heading**: Section eyebrow 'Any questions?' bằng 18px weight 500, #0f0f0f, căn giữa. Bên dưới: 'FAQ' bằng Tomato Grotesk 600, 153px, line-height 0.80, #0f0f0f, căn trái."

  similar_brands:

    - "**Phantom Wallet** — Cùng thẩm mỹ confetti-card vui tươi trên nền trắng với một màu nhấn tươi sáng duy nhất dẫn dắt CTA chính, và nút download hình pill tương tự"
    - "**Rainbow Wallet** — Chia sẻ card accent màu giống sticker rải rác trên layout trắng sạch, với headline nén cỡ lớn làm điểm nhấn hero"
    - "**Notion** — Cùng canvas trắng ấm (#f9faf9) và phong cách component phẳng dựa trên viền không có drop shadows, dựa vào chuyển đổi màu bề mặt cho thứ bậc"
    - "**Linear** — Kỷ luật single-typeface giống hệt (một grotesque tùy chỉnh ở weight 500/600), line-height chặt trên văn bản display, và container navigation hình pill"
    - "**Trust Wallet** — Cấu trúc trang sản phẩm crypto-wallet tương tự với hero căn giữa, pill CTA download một màu, và chrome đơn sắc được nhấn bằng accent chức năng"

  quick_start:

    css_custom_properties:

      css: |
        :root {
          /* Colors */
          --color-acid-lime: #05c92f;
          --color-sticker-yellow: #fcea59;
          --color-cotton-pink: #ffd0e2;
          --color-powder-blue: #a7cbf6;
          --color-obsidian: #000000;
          --color-carbon: #0f0f0f;
          --color-ash-gray: #5a585a;
          --color-slate-gray: #6e726e;
          --color-paper-white: #f9faf9;
          --color-pure-white: #ffffff;
          --color-bone: #ecefec;
          --color-plaster: #eeeeee;
        
          /* Typography — Font Families */
          --font-tomato-grotesk: 'Tomato Grotesk', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        
          /* Typography — Scale */
          --text-caption: 11px;
          --leading-caption: 1.5;
          --text-body-lg: 18px;
          --leading-body-lg: 1.5;
          --text-subheading: 25px;
          --leading-subheading: 1.13;
          --text-heading-sm: 35px;
          --leading-heading-sm: 1.06;
          --text-heading: 53px;
          --leading-heading: 1.02;
          --text-heading-lg: 84px;
          --leading-heading-lg: 0.9;
          --text-display: 153px;
          --leading-display: 0.8;
          --text-display-xl: 176px;
          --leading-display-xl: 0.77;
        
          /* Typography — Weights */
          --font-weight-medium: 500;
          --font-weight-semibold: 600;
        
          /* Spacing */
          --spacing-4: 4px;
          --spacing-7: 7px;
          --spacing-9: 9px;
          --spacing-11: 11px;
          --spacing-13: 13px;
          --spacing-18: 18px;
          --spacing-26: 26px;
          --spacing-31: 31px;
          --spacing-35: 35px;
          --spacing-42: 42px;
          --spacing-44: 44px;
          --spacing-53: 53px;
          --spacing-55: 55px;
          --spacing-70: 70px;
          --spacing-105: 105px;
          --spacing-149: 149px;
        
          /* Layout */
          --page-max-width: 1200px;
          --section-gap: 80px;
          --card-padding: 26px;
          --element-gap: 18px;
        
          /* Border Radius */
          --radius-lg: 8.78054px;
          --radius-xl: 14px;
          --radius-2xl: 17.5611px;
          --radius-3xl: 26.3416px;
          --radius-3xl-2: 35.1222px;
          --radius-full: 52.6833px;
        
          /* Named Radii */
          --radius-nav: 9px;
          --radius-tags: 14px;
          --radius-cards: 17.5px;
          --radius-inputs: 35px;
          --radius-buttons: 35px;
          --radius-largeelements: 53px;
        
          /* Surfaces */
          --surface-canvas: #f9faf9;
          --surface-card: #ffffff;
          --surface-bone-surface: #ecefec;
          --surface-input: #eeeeee;
        }

    tailwind_v4:

      css: |
        @theme {
          /* Colors */
          --color-acid-lime: #05c92f;
          --color-sticker-yellow: #fcea59;
          --color-cotton-pink: #ffd0e2;
          --color-powder-blue: #a7cbf6;
          --color-obsidian: #000000;
          --color-carbon: #0f0f0f;
          --color-ash-gray: #5a585a;
          --color-slate-gray: #6e726e;
          --color-paper-white: #f9faf9;
          --color-pure-white: #ffffff;
          --color-bone: #ecefec;
          --color-plaster: #eeeeee;
        
          /* Typography */
          --font-tomato-grotesk: 'Tomato Grotesk', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        
          /* Typography — Scale */
          --text-caption: 11px;
          --leading-caption: 1.5;
          --text-body-lg: 18px;
          --leading-body-lg: 1.5;
          --text-subheading: 25px;
          --leading-subheading: 1.13;
          --text-heading-sm: 35px;
          --leading-heading-sm: 1.06;
          --text-heading: 53px;
          --leading-heading: 1.02;
          --text-heading-lg: 84px;
          --leading-heading-lg: 0.9;
          --text-display: 153px;
          --leading-display: 0.8;
          --text-display-xl: 176px;
          --leading-display-xl: 0.77;
        
          /* Spacing */
          --spacing-4: 4px;
          --spacing-7: 7px;
          --spacing-9: 9px;
          --spacing-11: 11px;
          --spacing-13: 13px;
          --spacing-18: 18px;
          --spacing-26: 26px;
          --spacing-31: 31px;
          --spacing-35: 35px;
          --spacing-42: 42px;
          --spacing-44: 44px;
          --spacing-53: 53px;
          --spacing-55: 55px;
          --spacing-70: 70px;
          --spacing-105: 105px;
          --spacing-149: 149px;
        
          /* Border Radius */
          --radius-lg: 8.78054px;
          --radius-xl: 14px;
          --radius-2xl: 17.5611px;
          --radius-3xl: 26.3416px;
          --radius-3xl-2: 35.1222px;
          --radius-full: 52.6833px;
        }
