@charset "UTF-8";
.dds__icon--add-sqr::before {
  content: "⊞";
}

.dds__icon--alarm-bell::before {
  content: "🕭";
}

.dds__icon--alarm-clock::before {
  content: "🕑";
}

.dds__icon--alert-check::before {
  content: "✅";
}

.dds__icon--alert-check-alt::before {
  content: "🗸";
}

.dds__icon--alert-check-sqr::before {
  content: "🗹";
}

.dds__icon--alert-error::before {
  content: "⛔";
}

.dds__icon--alert-info-cir::before {
  content: "🛈";
}

.dds__icon--alert-info::before {
  content: "⚠";
}

.dds__icon--app-window::before {
  content: "🗔";
}

.dds__icon--arrow-cir-down::before {
  content: "⭳";
}

.dds__icon--arrow-cir-left::before {
  content: "⭰";
}

.dds__icon--arrow-cir-right::before {
  content: "⭲";
}

.dds__icon--arrow-cir-up::before {
  content: "⭱";
}

.dds__icon--arrow-down::before {
  content: "↓";
}

.dds__icon--arrow-left::before {
  content: "←";
}

.dds__icon--arrow-right::before {
  content: "→";
}

.dds__icon--arrow-tri-down::before {
  content: "▽";
}

.dds__icon--arrow-tri-left::before {
  content: "◁";
}

.dds__icon--arrow-tri-right::before {
  content: "▷";
}

.dds__icon--arrow-tri-solid-right::before {
  content: "⏵";
}

.dds__icon--arrow-tri-solid-left::before {
  content: "◀";
}

.dds__icon--arrow-tri-solid-down::before {
  content: "▼";
}

.dds__icon--arrow-tri-solid-up::before {
  content: "▴";
}

.dds__icon--arrow-tri-up::before {
  content: "⃤";
}

.dds__icon--arrow-up::before {
  content: "↑";
}

.dds__icon--audio-speaker-mute::before {
  content: "🔇";
}

.dds__icon--audio-speaker-on::before {
  content: "🔊";
}

.dds__icon--audio-speaker::before {
  content: "🔈";
}

.dds__icon--award-certificate::before {
  content: "🎗";
}

.dds__icon--award-trophy::before {
  content: "🏆";
}

.dds__icon--backspace::before {
  content: "⌦";
}

.dds__icon--battery-charge::before {
  content: "🔋";
}

.dds__icon--bolt-leaf::before {
  content: "🌳";
}

.dds__icon--book-open::before {
  content: "📖";
}

.dds__icon--capture-image::before {
  content: "+";
}

.dds__icon--card-credit::before {
  content: "💴";
}

.dds__icon--card-info::before {
  content: "💳";
}

.dds__icon--carry-case::before {
  content: "💼";
}

.dds__icon--chain-link::before {
  content: "🖇";
}

.dds__icon--charge-back::before {
  content: "💰";
}

.dds__icon--chart-bars-axis::before {
  content: "📊";
}

.dds__icon--chart-bars::before {
  content: "📉";
}

.dds__icon--chart-insights::before {
  content: "📈";
}

.dds__icon--chat-dots::before {
  content: "💬";
}

.dds__icon--chevron-cir-down::before {
  content: "⮋";
}

.dds__icon--chevron-cir-left::before {
  content: "⮈";
}

.dds__icon--chevron-cir-right::before {
  content: "⮊";
}

.dds__icon--chevron-cir-up::before {
  content: "⮉";
}

.dds__icon--chevron-down::before {
  content: "﹀";
}

.dds__icon--chevron-left::before {
  content: "〈";
}

.dds__icon--chevron-right::before {
  content: "〉";
}

.dds__icon--chevron-up::before {
  content: "︿";
}

.dds__icon--clock-arrow-left::before {
  content: "🕓";
}

.dds__icon--clock-arrow-right::before {
  content: "🕕";
}

.dds__icon--close-sqr::before {
  content: "🗷";
}

.dds__icon--close-x::before {
  content: "🗙";
}

.dds__icon--cloud-check::before {
  content: "🌩";
}

.dds__icon--collapse-down-sqr::before {
  content: "⏬";
}

.dds__icon--collapse-up-sqr::before {
  content: "⏫";
}

.dds__icon--conversation-cir::before {
  content: "🗫";
}

.dds__icon--copy-alt::before {
  content: "🗍";
}

.dds__icon--d-display::before {
  content: "🖵";
}

.dds__icon--data-center::before {
  content: "🏢";
}

.dds__icon--data-compute::before {
  content: "🖭";
}

.dds__icon--device-data-center::before {
  content: "🖪";
}

.dds__icon--device-laptop::before {
  content: "🖴";
}

.dds__icon--device-mobile::before {
  content: "🖁";
}

.dds__icon--device-modular::before {
  content: "💻";
}

.dds__icon--device-monitor::before {
  content: "⎚";
}

.dds__icon--device-server-tower::before {
  content: "🖥";
}

.dds__icon--device-server::before {
  content: "🖶";
}

.dds__icon--dimensions-weight::before {
  content: "📏";
}

.dds__icon--disc-software::before {
  content: "🖸";
}

.dds__icon--doc-add::before {
  content: "🖹";
}

.dds__icon--doc-arrow-left::before {
  content: "🖺";
}

.dds__icon--doc-arrow-right::before {
  content: "🗋";
}

.dds__icon--doc-lines::before {
  content: "🗈";
}

.dds__icon--doc-reports::before {
  content: "🗉";
}

.dds__icon--escalate-tri::before {
  content: "⧋";
}

.dds__icon--eye-view::before {
  content: "👁";
}

.dds__icon--flash-drive::before {
  content: "💽";
}

.dds__icon--folder-add::before {
  content: "🗂";
}

.dds__icon--folder-arrow-right::before {
  content: "🖿";
}

.dds__icon--full-screen::before {
  content: "🗖";
}

.dds__icon--globe-simple::before {
  content: "🌐";
}

.dds__icon--hand-touch::before {
  content: "🖢";
}

.dds__icon--hard-drive::before {
  content: "🖫";
}

.dds__icon--heart-filled::before {
  content: "♥";
}

.dds__icon--help-cir::before {
  content: "⯑";
}

.dds__icon--import-alt::before {
  content: "↥";
}

.dds__icon--ink-toner::before {
  content: "🖨";
}

.dds__icon--keyboard-mouse::before {
  content: "🖦";
}

.dds__icon--laptop-generic::before {
  content: "🖷";
}

.dds__icon--line-dash::before {
  content: "\e9ef";
}

.dds__icon--lock-closed::before {
  content: "🔒";
}

.dds__icon--lock-open::before {
  content: "🔓";
}

.dds__icon--log-in::before {
  content: "⍈";
}

.dds__icon--mail-open::before {
  content: "🖆";
}

.dds__icon--menu-closed::before {
  content: "☰";
}

.dds__icon--microphone-off::before {
  content: "🎤";
}

.dds__icon--minus-minimize::before {
  content: "−";
}

.dds__icon--missing-image::before {
  content: "⛶";
}

.dds__icon--mouse-cord::before {
  content: "🖯";
}

.dds__icon--movie-clapper-play::before {
  content: "🎦";
}

.dds__icon--movie-clapper::before {
  content: "🎬";
}

.dds__icon--music-note::before {
  content: "🎝";
}

.dds__icon--network-vert::before {
  content: "🖧";
}

.dds__icon--paint-brush::before {
  content: "🖌";
}

.dds__icon--paint-palette::before {
  content: "🎨";
}

.dds__icon--paper-clip::before {
  content: "📎";
}

.dds__icon--paper-plane::before {
  content: "➤";
}

.dds__icon--pencil-check::before {
  content: "🖊";
}

.dds__icon--pencil-mark::before {
  content: "🖎";
}

.dds__icon--play::before {
  content: "▿";
}

.dds__icon--play-cir::before {
  content: "⏯";
}

.dds__icon--play-filled::before {
  content: "▶";
}

.dds__icon--pop-up-arrow::before {
  content: "⇱";
}

.dds__icon--popout-window::before {
  content: "⎘";
}

.dds__icon--power-supply::before {
  content: "🔌";
}

.dds__icon--prohibited::before {
  content: "🚫";
}

.dds__icon--performance::before {
  content: "⏲";
}

.dds__icon--recycle-bin::before {
  content: "♻";
}

.dds__icon--redo-move::before {
  content: "⟳";
}

.dds__icon--refresh-spin::before {
  content: "🗘";
}

.dds__icon--remove-cir::before {
  content: "⊝";
}

.dds__icon--remove-sqr::before {
  content: "⊟";
}

.dds__icon--rotate-left::before {
  content: "↺";
}

.dds__icon--rotate-right::before {
  content: "↻";
}

.dds__icon--save-disk::before {
  content: "💾";
}

.dds__icon--search-arrow-left::before {
  content: "🔎";
}

.dds__icon--search-back::before {
  content: "⏮";
}

.dds__icon--search-forward::before {
  content: "⏭";
}

.dds__icon--shield-check::before {
  content: "⛊";
}

.dds__icon--slider-vert::before {
  content: "🎚";
}

.dds__icon--sort-horiz::before {
  content: "⮂";
}

.dds__icon--sort-vert::before {
  content: "⥮";
}

.dds__icon--star-filled::before {
  content: "★";
}

.dds__icon--stopwatch::before {
  content: "⏱";
}

.dds__icon--stop-cir::before {
  content: "⏹";
}

.dds__icon--sync-horiz::before {
  content: "⮔";
}

.dds__icon--thumb-down::before {
  content: "👎";
}

.dds__icon--thumb-up::before {
  content: "👍";
}

.dds__icon--undo-move::before {
  content: "⭮";
}

.dds__icon--user-group::before {
  content: "👪";
}

.dds__icon--user-groups::before {
  content: "👫";
}

.dds__icon--view-column::before {
  content: "▥";
}

.dds__icon--view-grid-alt::before {
  content: "▩";
}

.dds__icon--view-grid::before {
  content: "▤";
}

.dds__icon--weight-bell::before {
  content: "🔔";
}

.dds__icon--wrench-single::before {
  content: "🔧";
}

.dds__icon--wrench-tools::before {
  content: "🛠";
}

.dds__icon--accessibility::before {
  content: "♿";
}

.dds__icon--airplane::before {
  content: "🛪";
}

.dds__icon--assistance::before {
  content: "💁";
}

.dds__icon--bolt::before {
  content: "🗲";
}

.dds__icon--bookmark::before {
  content: "🔖";
}

.dds__icon--brightness::before {
  content: "🔅";
}

.dds__icon--calculator::before {
  content: "🖩";
}

.dds__icon--calendar::before {
  content: "📅";
}

.dds__icon--camera::before {
  content: "📷";
}

.dds__icon--cancelled::before {
  content: "⃠";
}

.dds__icon--cart::before {
  content: "🛒";
}

.dds__icon--check::before {
  content: "✓";
}

.dds__icon--chip::before {
  content: "🧩";
}

.dds__icon--clipboard::before {
  content: "📋";
}

.dds__icon--clock::before {
  content: "🕒";
}

.dds__icon--clone::before {
  content: "🗗";
}

.dds__icon--cloud::before {
  content: "☁";
}

.dds__icon--comment::before {
  content: "🗨";
}

.dds__icon--compare::before {
  content: "⥦";
}

.dds__icon--conversation::before {
  content: "🗪";
}

.dds__icon--copy::before {
  content: "🗇";
}

.dds__icon--cookie::before {
  content: "🍪";
}

.dds__icon--cube::before {
  content: "📦";
}

.dds__icon--currency::before {
  content: "$";
}

.dds__icon--cursor::before {
  content: "☝";
}

.dds__icon--dashboard::before {
  content: "🗠";
}

.dds__icon--datastore::before {
  content: "🖬";
}

.dds__icon--debug::before {
  content: "🐞";
}

.dds__icon--diagnostic::before {
  content: "🗡";
}

.dds__icon--document::before {
  content: "🗏";
}

.dds__icon--ear::before {
  content: "👂";
}

.dds__icon--exp-shipping::before {
  content: "🚚";
}

.dds__icon--export::before {
  content: "📤";
}

.dds__icon--fan::before {
  content: "❋";
}

.dds__icon--filter::before {
  content: "⛛";
}

.dds__icon--fingerprint::before {
  content: "👆";
}

.dds__icon--flag::before {
  content: "⛿";
}

.dds__icon--flame::before {
  content: "🔥";
}

.dds__icon--folder::before {
  content: "🗀";
}

.dds__icon--gift::before {
  content: "🎁";
}

.dds__icon--gear::before {
  content: "⚙";
}

.dds__icon--handle::before {
  content: "⋮";
}

.dds__icon--heart::before {
  content: "♡";
}

.dds__icon--home::before {
  content: "🏡";
}

.dds__icon--inbox::before {
  content: "📥";
}

.dds__icon--image::before {
  content: "🖼";
}

.dds__icon--key::before {
  content: "🔑";
}

.dds__icon--keyboard::before {
  content: "⌨";
}

.dds__icon--lightbulb::before {
  content: "💡";
}

.dds__icon--location::before {
  content: "╍";
}

.dds__icon--mail::before {
  content: "🖂";
}

.dds__icon--mouse::before {
  content: "🖰";
}

.dds__icon--moon::before {
  content: "⏾";
}

.dds__icon--office::before {
  content: "🏣";
}

.dds__icon--overflow::before {
  content: "⋯";
}

.dds__icon--partners::before {
  content: "✋";
}

.dds__icon--pause::before {
  content: "⏸";
}

.dds__icon--pencil::before {
  content: "🖉";
}

.dds__icon--phone::before {
  content: "🕾";
}

.dds__icon--pin::before {
  content: "📌";
}

.dds__icon--printer::before {
  content: "📠";
}

.dds__icon--projector::before {
  content: "📾";
}

.dds__icon--recycle::before {
  content: "♲";
}

.dds__icon--redo::before {
  content: "⮎";
}

.dds__icon--reset::before {
  content: "⟲";
}

.dds__icon--restore::before {
  content: "⭹";
}

.dds__icon--scale::before {
  content: "⤒";
}

.dds__icon--search::before {
  content: "🔍";
}

.dds__icon--share::before {
  content: "↷";
}

.dds__icon--shield::before {
  content: "⛉";
}

.dds__icon--snapshot::before {
  content: "⯐";
}

.dds__icon--snowflake::before {
  content: "❄";
}

.dds__icon--sparkles::before {
  content: "✨";
}

.dds__icon--scissor::before {
  content: "✂";
}

.dds__icon--star::before {
  content: "✩";
}

.dds__icon--stop::before {
  content: "⏹";
}

.dds__icon--swap::before {
  content: "⇆";
}

.dds__icon--tag::before {
  content: "🏷";
}

.dds__icon--trash::before {
  content: "🗑";
}

.dds__icon--tv::before {
  content: "📺";
}

.dds__icon--undo::before {
  content: "⮌";
}

.dds__icon--upload::before {
  content: "⭫";
}

.dds__icon--user::before {
  content: "👩";
}

.dds__icon--warranty::before {
  content: "🗰";
}

.dds__icon--wifi::before {
  content: "📡";
}

.dds__icon--2-in-1::before {
  content: "\e800";
}

.dds__icon--add-cir::before {
  content: "\e801";
}

.dds__icon--alert-check-filled::before {
  content: "\e802";
}

.dds__icon--alert-check-progress::before {
  content: "\e803";
}

.dds__icon--alert-error-filled::before {
  content: "\e804";
}

.dds__icon--alert-info-cir-filled::before {
  content: "\e805";
}

.dds__icon--alert-info-filled::before {
  content: "\e806";
}

.dds__icon--alert-info-sqr::before {
  content: "\e807";
}

.dds__icon--alert-info-sqr-filled::before {
  content: "\e808";
}

.dds__icon--app-window-search::before {
  content: "\e809";
}

.dds__icon--arrange::before {
  content: "\e80a";
}

.dds__icon--arrow-tri-solid-stacked::before {
  content: "\e80b";
}

.dds__icon--audio-card::before {
  content: "\e80c";
}

.dds__icon--audio-speaker-levels::before {
  content: "\e80d";
}

.dds__icon--audio-speaker-off::before {
  content: "\e80e";
}

.dds__icon--barbell::before {
  content: "\e80f";
}

.dds__icon--battery-empty::before {
  content: "\e810";
}

.dds__icon--battery-full::before {
  content: "\e811";
}

.dds__icon--battery-half::before {
  content: "\e812";
}

.dds__icon--battery-horiz-empty::before {
  content: "\e813";
}

.dds__icon--battery-horiz-full::before {
  content: "\e814";
}

.dds__icon--battery-horiz-half::before {
  content: "\e815";
}

.dds__icon--bookmark-filled::before {
  content: "\e817";
}

.dds__icon--calendar-add::before {
  content: "\e818";
}

.dds__icon--calendar-check::before {
  content: "\e819";
}

.dds__icon--calendar-remove::before {
  content: "\e81a";
}

.dds__icon--calendar-search::before {
  content: "\e81b";
}

.dds__icon--card-swipe-left::before {
  content: "\e81c";
}

.dds__icon--card-swipe-right::before {
  content: "\e81d";
}

.dds__icon--charge-back-folder::before {
  content: "\e81e";
}

.dds__icon--charge-back-report::before {
  content: "\e81f";
}

.dds__icon--chat-lines::before {
  content: "\e820";
}

.dds__icon--check-property::before {
  content: "\e821";
}

.dds__icon--clipboard-check::before {
  content: "\e822";
}

.dds__icon--clipboard-edit::before {
  content: "\e823";
}

.dds__icon--clipboard-lines::before {
  content: "\e824";
}

.dds__icon--clipboard-remove::before {
  content: "\e825";
}

.dds__icon--clipboard-search::before {
  content: "\e826";
}

.dds__icon--cloud-document::before {
  content: "\e827";
}

.dds__icon--cloud-restore::before {
  content: "\e828";
}

.dds__icon--cloud-upload::before {
  content: "\e829";
}

.dds__icon--cloud-wireless::before {
  content: "\e82a";
}

.dds__icon--collapse-down::before {
  content: "\e82b";
}

.dds__icon--collapse-up::before {
  content: "\e82c";
}

.dds__icon--column-add::before {
  content: "\e82d";
}

.dds__icon--comment-add::before {
  content: "\e82e";
}

.dds__icon--comment-check::before {
  content: "\e82f";
}

.dds__icon--currency-coins::before {
  content: "\e830";
}

.dds__icon--currency-coins-euros::before {
  content: "\e831";
}

.dds__icon--currency-coins-generic::before {
  content: "\e832";
}

.dds__icon--currency-coins-indian-rupees::before {
  content: "\e833";
}

.dds__icon--currency-coins-pounds::before {
  content: "\e834";
}

.dds__icon--currency-coins-rupees::before {
  content: "\e835";
}

.dds__icon--currency-coins-yen::before {
  content: "\e836";
}

.dds__icon--cursor-clock::before {
  content: "\e837";
}

.dds__icon--data-protection::before {
  content: "\e838";
}

.dds__icon--deploy::before {
  content: "\e839";
}

.dds__icon--device-desktop::before {
  content: "\e83a";
}

.dds__icon--device-laptop-detachable::before {
  content: "\e83b";
}

.dds__icon--device-laptop-lock::before {
  content: "\e83c";
}

.dds__icon--device-nodes::before {
  content: "\e83d";
}

.dds__icon--device-screen-size::before {
  content: "\e83e";
}

.dds__icon--device-storage-array::before {
  content: "\e83f";
}

.dds__icon--device-switch-blade::before {
  content: "\e840";
}

.dds__icon--device-switch-blade-2U::before {
  content: "\e841";
}

.dds__icon--device-tablet::before {
  content: "\e842";
}

.dds__icon--device-tablet-horiz::before {
  content: "\e843";
}

.dds__icon--device-thin-client::before {
  content: "\e844";
}

.dds__icon--disc-arrow-down::before {
  content: "\e845";
}

.dds__icon--disc-arrow-up::before {
  content: "\e846";
}

.dds__icon--disc-check::before {
  content: "\e847";
}

.dds__icon--disc-insert::before {
  content: "\e848";
}

.dds__icon--disc-lock::before {
  content: "\e849";
}

.dds__icon--disc-recovery::before {
  content: "\e84a";
}

.dds__icon--disc-system::before {
  content: "\e84b";
}

.dds__icon--doc-check::before {
  content: "\e84c";
}

.dds__icon--doc-cube::before {
  content: "\e84d";
}

.dds__icon--doc-manual::before {
  content: "\e84e";
}

.dds__icon--doc-search::before {
  content: "\e84f";
}

.dds__icon--doc-secure::before {
  content: "\e850";
}

.dds__icon--doc-settings::before {
  content: "\e851";
}

.dds__icon--doc-support::before {
  content: "\e852";
}

.dds__icon--docs-copy-alt::before {
  content: "\e853";
}

.dds__icon--download::before {
  content: "\e854";
}

.dds__icon--ellipsis::before {
  content: "\e855";
}

.dds__icon--expand::before {
  content: "\e856";
}

.dds__icon--eye-view-off::before {
  content: "\e857";
}

.dds__icon--filter-add::before {
  content: "\e858";
}

.dds__icon--filter-clear::before {
  content: "\e859";
}

.dds__icon--filter-move::before {
  content: "\e85a";
}

.dds__icon--folder-arrow-up::before {
  content: "\e85b";
}

.dds__icon--folder-media::before {
  content: "\e85c";
}

.dds__icon--game-controller::before {
  content: "\e85d";
}

.dds__icon--gaming-desktop::before {
  content: "\e85e";
}

.dds__icon--gear-arrow-up::before {
  content: "\e85f";
}

.dds__icon--gear-wrench::before {
  content: "\e860";
}

.dds__icon--gift-card::before {
  content: "\e861";
}

.dds__icon--globe-location::before {
  content: "\e862";
}

.dds__icon--graphics-card::before {
  content: "\e863";
}

.dds__icon--hand-touch-disabled::before {
  content: "\e864";
}

.dds__icon--hand-touch-screen::before {
  content: "\e865";
}

.dds__icon--hd-generic::before {
  content: "\e866";
}

.dds__icon--headphones::before {
  content: "\e867";
}

.dds__icon--headset::before {
  content: "\e868";
}

.dds__icon--heat::before {
  content: "\e869";
}

.dds__icon--heart-half-filled::before {
  content: "\e86a";
}

.dds__icon--help-sqr::before {
  content: "\e86b";
}

.dds__icon--host-server::before {
  content: "\e86c";
}

.dds__icon--host-server-hex::before {
  content: "\e86d";
}

.dds__icon--host-server-rack::before {
  content: "\e86e";
}

.dds__icon--hyper-converged-infrastructure::before {
  content: "\e86f";
}

.dds__icon--inbox-arrow-down::before {
  content: "\e870";
}

.dds__icon--infrastructure::before {
  content: "\e871";
}

.dds__icon--keypad::before {
  content: "\e872";
}

.dds__icon--lcd::before {
  content: "\e873";
}

.dds__icon--leaf::before {
  content: "\e874";
}

.dds__icon--location-play::before {
  content: "\e875";
}

.dds__icon--log-out::before {
  content: "\e876";
}

.dds__icon--manage-info::before {
  content: "\e877";
}

.dds__icon--management-software::before {
  content: "\e878";
}

.dds__icon--memory::before {
  content: "\e879";
}

.dds__icon--memory-card-reader::before {
  content: "\e87a";
}

.dds__icon--memory-sd-card::before {
  content: "\e87b";
}

.dds__icon--metadata::before {
  content: "\e87c";
}

.dds__icon--microchip::before {
  content: "\e87d";
}

.dds__icon--microphone-on::before {
  content: "\e87e";
}

.dds__icon--migrate::before {
  content: "\e87f";
}

.dds__icon--minimize::before {
  content: "\e880";
}

.dds__icon--network-connected::before {
  content: "\e881";
}

.dds__icon--network-horiz::before {
  content: "\e882";
}

.dds__icon--network-share::before {
  content: "\e883";
}

.dds__icon--network-vert-disable::before {
  content: "\e884";
}

.dds__icon--objects::before {
  content: "\e885";
}

.dds__icon--package-closed::before {
  content: "\e886";
}

.dds__icon--package-open::before {
  content: "\e887";
}

.dds__icon--partnership::before {
  content: "\e888";
}

.dds__icon--password::before {
  content: "\e889";
}

.dds__icon--pause-filled::before {
  content: "\e88a";
}

.dds__icon--pause-sqr::before {
  content: "\e88b";
}

.dds__icon--pencil-remove::before {
  content: "\e88c";
}

.dds__icon--pie-chart::before {
  content: "\e88d";
}

.dds__icon--pie-chart-solid::before {
  content: "\e88e";
}

.dds__icon--play-sqr::before {
  content: "\e88f";
}

.dds__icon--plus-add::before {
  content: "\e890";
}

.dds__icon--pop-up-arrow-corner::before {
  content: "\e891";
}

.dds__icon--popout-double::before {
  content: "\e892";
}

.dds__icon--popout-double-condense::before {
  content: "\e893";
}

.dds__icon--popout-double-condense-vertical::before {
  content: "\e894";
}

.dds__icon--popout-double-vertical::before {
  content: "\e895";
}

.dds__icon--popout-share::before {
  content: "\e896";
}

.dds__icon--port-double::before {
  content: "\e897";
}

.dds__icon--power-off::before {
  content: "\e898";
}

.dds__icon--power-on::before {
  content: "\e899";
}

.dds__icon--power-supply-cord::before {
  content: "\e89a";
}

.dds__icon--power-supply-double::before {
  content: "\e89b";
}

.dds__icon--productivity::before {
  content: "\e89c";
}

.dds__icon--protractor::before {
  content: "\e89d";
}

.dds__icon--pulse::before {
  content: "\e89e";
}

.dds__icon--puzzle::before {
  content: "\e89f";
}

.dds__icon--qos::before {
  content: "\e8a0";
}

.dds__icon--rack::before {
  content: "\e8a1";
}

.dds__icon--receipt::before {
  content: "\e8a2";
}

.dds__icon--renew::before {
  content: "\e8a3";
}

.dds__icon--resolution::before {
  content: "\e8a4";
}

.dds__icon--restore-system::before {
  content: "\e8a5";
}

.dds__icon--rss::before {
  content: "\e8a6";
}

.dds__icon--search-arrow-right::before {
  content: "\e8a7";
}

.dds__icon--server-rack-arrow-right::before {
  content: "\e8a8";
}

.dds__icon--server-rack-search::before {
  content: "\e8a9";
}

.dds__icon--server-rack-support::before {
  content: "\e8aa";
}

.dds__icon--shield-protect::before {
  content: "\e8ab";
}

.dds__icon--shipping::before {
  content: "\e8ac";
}

.dds__icon--skip-forward::before {
  content: "\e8ad";
}

.dds__icon--skip-to-end::before {
  content: "\e8ae";
}

.dds__icon--skip-to-front::before {
  content: "\e8af";
}

.dds__icon--slider-horiz::before {
  content: "\e8b0";
}

.dds__icon--smart-select::before {
  content: "\e8b1";
}

.dds__icon--social-networking::before {
  content: "\e8b2";
}

.dds__icon--sort-az::before {
  content: "\e8b3";
}

.dds__icon--sort-za::before {
  content: "\e8b4";
}

.dds__icon--speaker-double::before {
  content: "\e8b5";
}

.dds__icon--stack::before {
  content: "\e8b6";
}

.dds__icon--star-half-filled::before {
  content: "\e8b7";
}

.dds__icon--start-up::before {
  content: "\e8b8";
}

.dds__icon--suspend::before {
  content: "\e8b9";
}

.dds__icon--sync-vert::before {
  content: "\e8ba";
}

.dds__icon--tag-deal::before {
  content: "\e8bb";
}

.dds__icon--text::before {
  content: "\e8bc";
}

.dds__icon--thumb-down-filled::before {
  content: "\e8bd";
}

.dds__icon--thumb-up-filled::before {
  content: "\e8be";
}

.dds__icon--toolbox::before {
  content: "\e8bf";
}

.dds__icon--touch-pad::before {
  content: "\e8c0";
}

.dds__icon--translate::before {
  content: "\e8c1";
}

.dds__icon--trending-down::before {
  content: "\e8c2";
}

.dds__icon--trending-up::before {
  content: "\e8c3";
}

.dds__icon--unpin::before {
  content: "\e8c4";
}

.dds__icon--usb::before {
  content: "\e8c5";
}

.dds__icon--user-about::before {
  content: "\e8c6";
}

.dds__icon--user-add::before {
  content: "\e8c7";
}

.dds__icon--user-check::before {
  content: "\e8c8";
}

.dds__icon--user-cir::before {
  content: "\e8c9";
}

.dds__icon--user-cir-add::before {
  content: "\e8ca";
}

.dds__icon--user-cir-remove::before {
  content: "\e8cb";
}

.dds__icon--user-contact::before {
  content: "\e8cc";
}

.dds__icon--user-directory::before {
  content: "\e8cd";
}

.dds__icon--user-disable::before {
  content: "\e8ce";
}

.dds__icon--user-group-chat::before {
  content: "\e8cf";
}

.dds__icon--user-group-disable::before {
  content: "\e8d0";
}

.dds__icon--user-groups-disable::before {
  content: "\e8d1";
}

.dds__icon--user-lock::before {
  content: "\e8d2";
}

.dds__icon--view-detailed::before {
  content: "\e8d3";
}

.dds__icon--view-list::before {
  content: "\e8d4";
}

.dds__icon--view-row::before {
  content: "\e8d5";
}

.dds__icon--view-table::before {
  content: "\e8d6";
}

.dds__icon--virtualization::before {
  content: "\e8d7";
}

.dds__icon--volume::before {
  content: "\e8d8";
}

.dds__icon--web-camera::before {
  content: "\e8d9";
}

.dds__icon--web-camera-hd::before {
  content: "\e8da";
}

.dds__icon--wifi-none::before {
  content: "\e8db";
}

.dds__icon--wifi-simple::before {
  content: "\e8dc";
}

.dds__icon--windows-support::before {
  content: "\e8dd";
}

.dds__icon--wrench-cir::before {
  content: "\e8de";
}

.dds__icon--wrench-double::before {
  content: "\e8df";
}

.dds__icon--wrench-manage::before {
  content: "\e8e0";
}

.dds__icon--zoom-in::before {
  content: "\e8e1";
}

.dds__icon--zoom-out::before {
  content: "\e8e2";
}

@layer global, semantic, component, theme;
@layer global {
  :root,
  :host {
    --dds-color-berry-10: #ffebf5;
    --dds-color-berry-20: #ffc0df;
    --dds-color-berry-30: #f69ac6;
    --dds-color-berry-40: #e574aa;
    --dds-color-berry-50: #cb548d;
    --dds-color-berry-60: #ba467d;
    --dds-color-berry-70: #a8396f;
    --dds-color-berry-80: #7f234f;
    --dds-color-berry-90: #511230;
    --dds-color-blue-10: #d9f5fd;
    --dds-color-blue-20: #94dcf7;
    --dds-color-blue-30: #5cc1ee;
    --dds-color-blue-40: #31a2e3;
    --dds-color-blue-50: #1282d6;
    --dds-color-blue-60: #0672cb;
    --dds-color-blue-70: #0063b8;
    --dds-color-blue-80: #00468b;
    --dds-color-blue-90: #002a58;
    --dds-color-gray-10: #f5f6f7;
    --dds-color-gray-20: #f0f0f0;
    --dds-color-gray-30: #e1e1e1;
    --dds-color-gray-40: #d2d2d2;
    --dds-color-gray-50: #b6b6b6;
    --dds-color-gray-60: #7e7e7e;
    --dds-color-gray-70: #6e6e6e;
    --dds-color-gray-80: #636363;
    --dds-color-gray-90: #0e0e0e;
    --dds-color-green-10: #e9f5ce;
    --dds-color-green-20: #c0dd78;
    --dds-color-green-30: #9bc438;
    --dds-color-green-40: #7aa809;
    --dds-color-green-50: #5d8c00;
    --dds-color-green-60: #4f7d00;
    --dds-color-green-70: #436f00;
    --dds-color-green-80: #2c5000;
    --dds-color-green-90: #193100;
    --dds-color-light-blue-10: #daf5fd;
    --dds-color-light-blue-20: #97dcf4;
    --dds-color-light-blue-30: #61c1eb;
    --dds-color-light-blue-40: #36a2e0;
    --dds-color-light-blue-50: #1885c3;
    --dds-color-light-blue-60: #0d76b2;
    --dds-color-light-blue-70: #0468a1;
    --dds-color-light-blue-80: #004a77;
    --dds-color-light-blue-90: #002d4b;
    --dds-color-neutral-black: #000000;
    --dds-color-neutral-black-opacity-15: rgba(0, 0, 0, 0.2);
    --dds-color-neutral-black-opacity-20: rgba(0, 0, 0, 0.2);
    --dds-color-neutral-black-opacity-30: rgba(0, 0, 0, 0.3);
    --dds-color-neutral-black-opacity-50: rgba(0, 0, 0, 0.5);
    --dds-color-neutral-black-opacity-80: rgba(0, 0, 0, 0.8);
    --dds-color-neutral-white: #ffffff;
    --dds-color-neutral-white-opacity-15: rgba(255, 255, 255, 0.2);
    --dds-color-neutral-white-opacity-50: rgba(255, 255, 255, 0.5);
    --dds-color-neutral-white-opacity-80: rgba(255, 255, 255, 0.8);
    --dds-color-orange-10: #ffeed2;
    --dds-color-orange-20: #fec97a;
    --dds-color-orange-30: #f8a433;
    --dds-color-orange-40: #e67f01;
    --dds-color-orange-50: #c96100;
    --dds-color-orange-60: #b85200;
    --dds-color-orange-70: #a64600;
    --dds-color-orange-80: #7d2e00;
    --dds-color-orange-90: #4f1a00;
    --dds-color-purple-10: #fbebff;
    --dds-color-purple-20: #ecc4ff;
    --dds-color-purple-30: #db9eff;
    --dds-color-purple-40: #c47af4;
    --dds-color-purple-50: #a95adc;
    --dds-color-purple-60: #994ccc;
    --dds-color-purple-70: #8a3fba;
    --dds-color-purple-80: #66278f;
    --dds-color-purple-90: #40155c;
    --dds-color-red-10: #ffecee;
    --dds-color-red-20: #ffc3c9;
    --dds-color-red-30: #ff99a1;
    --dds-color-red-40: #fe6873;
    --dds-color-red-50: #e4424d;
    --dds-color-red-60: #d0353f;
    --dds-color-red-70: #bb2a33;
    --dds-color-red-80: #8c161f;
    --dds-color-red-90: #590a0f;
    --dds-color-slate-10: #ebf1f6;
    --dds-color-slate-20: #c5d4e3;
    --dds-color-slate-30: #a4b8cd;
    --dds-color-slate-40: #839db4;
    --dds-color-slate-45: #5c6e7e;
    --dds-color-slate-50: #40586d;
    --dds-color-slate-60: #293b4d;
    --dds-color-slate-70: #1d2c3b;
    --dds-color-slate-80: #141d28;
    --dds-color-slate-90: #0a0e14;
    --dds-color-teal-10: #caf4f7;
    --dds-color-teal-20: #94eaef;
    --dds-color-teal-30: #45d9e3;
    --dds-color-teal-40: #14c1cc;
    --dds-color-teal-50: #0ea0a9;
    --dds-color-teal-60: #0d8e97;
    --dds-color-teal-70: #0b7c84;
    --dds-color-teal-80: #076369;
    --dds-color-teal-90: #044e52;
    --dds-color-transparent: transparent;
    --dds-color-yellow-10: #feefcb;
    --dds-color-yellow-20: #f5cd6f;
    --dds-color-yellow-30: #e6ac28;
    --dds-color-yellow-40: #ce8d00;
    --dds-color-yellow-50: #b36f00;
    --dds-color-yellow-60: #a36100;
    --dds-color-yellow-70: #925400;
    --dds-color-yellow-80: #6d3a00;
    --dds-color-yellow-90: #442200;
    --dds-drop-shadow-blur-0: 0;
    --dds-drop-shadow-blur-1: 0.0625rem;
    --dds-drop-shadow-blur-10: 0.625rem;
    --dds-drop-shadow-blur-16: 1rem;
    --dds-drop-shadow-blur-2: 0.125rem;
    --dds-drop-shadow-blur-32: 2rem;
    --dds-drop-shadow-blur-4: 0.25rem;
    --dds-drop-shadow-blur-50: 3.125rem;
    --dds-drop-shadow-blur-8: 0.5rem;
    --dds-drop-shadow-blur-90: 5.625rem;
    --dds-drop-shadow-offset-0: 0;
    --dds-drop-shadow-offset-1: 0.0625rem;
    --dds-drop-shadow-offset-16: 1rem;
    --dds-drop-shadow-offset-2: 0.125rem;
    --dds-drop-shadow-offset-32: 2rem;
    --dds-drop-shadow-offset-4: 0.25rem;
    --dds-drop-shadow-offset-8: 0.5rem;
    --dds-drop-shadow-offset-negative1: -0.0625rem;
    --dds-drop-shadow-offset-negative16: -1rem;
    --dds-drop-shadow-offset-negative2: -0.125rem;
    --dds-drop-shadow-offset-negative32: -2rem;
    --dds-drop-shadow-offset-negative4: -0.25rem;
    --dds-drop-shadow-offset-negative8: -0.5rem;
    --dds-drop-shadow-spread-0: 0;
    --dds-drop-shadow-spread-2: 0.125rem;
    --dds-drop-shadow-spread-4: 0.25rem;
    --dds-drop-shadow-spread-negative2: -0.125rem;
    --dds-drop-shadow-spread-negative4: -0.25rem;
    --dds-font-family-roboto: Roboto;
    --dds-font-family-roboto-mono: Roboto Mono;
    --dds-font-line-height-12: 0.75rem;
    --dds-font-line-height-14: 0.875rem;
    --dds-font-line-height-16: 1rem;
    --dds-font-line-height-18: 1.125rem;
    --dds-font-line-height-20: 1.25rem;
    --dds-font-line-height-24: 1.5rem;
    --dds-font-line-height-28: 1.75rem;
    --dds-font-line-height-32: 2rem;
    --dds-font-line-height-36: 2.25rem;
    --dds-font-line-height-40: 2.5rem;
    --dds-font-line-height-48: 3rem;
    --dds-font-line-height-56: 3.5rem;
    --dds-font-line-height-64: 4rem;
    --dds-font-line-height-68: 4.25rem;
    --dds-font-line-height-72: 4.5rem;
    --dds-font-line-height-76: 4.75rem;
    --dds-font-line-height-80: 5rem;
    --dds-font-line-height-88: 5.5rem;
    --dds-font-size-10: 0.625rem;
    --dds-font-size-12: 0.75rem;
    --dds-font-size-14: 0.875rem;
    --dds-font-size-16: 1rem;
    --dds-font-size-20: 1.25rem;
    --dds-font-size-24: 1.5rem;
    --dds-font-size-32: 2rem;
    --dds-font-size-40: 2.5rem;
    --dds-font-size-48: 3rem;
    --dds-font-size-56: 3.5rem;
    --dds-font-size-64: 4rem;
    --dds-font-size-72: 4.5rem;
    --dds-font-size-9: 0.5625rem;
    --dds-font-weight-black: 900;
    --dds-font-weight-bold: 700;
    --dds-font-weight-extra-bold: 800;
    --dds-font-weight-extra-light: 200;
    --dds-font-weight-light: 300;
    --dds-font-weight-medium: 500;
    --dds-font-weight-regular: 400;
    --dds-font-weight-semi-bold: 600;
    --dds-font-weight-thin: 100;
    --dds-opacity-10: 0.1;
    --dds-opacity-30: 0.3;
    --dds-opacity-50: 0.5;
    --dds-opacity-80: 0.8;
    --dds-size-0: 0;
    --dds-size-1: 0.0625rem;
    --dds-size-112: 7rem;
    --dds-size-12: 0.75rem;
    --dds-size-120: 7.5rem;
    --dds-size-1200: 75rem;
    --dds-size-128: 8rem;
    --dds-size-14: 0.875rem;
    --dds-size-144: 9rem;
    --dds-size-16: 1rem;
    --dds-size-160: 10rem;
    --dds-size-176: 11rem;
    --dds-size-18: 1.125rem;
    --dds-size-2: 0.125rem;
    --dds-size-20: 1.25rem;
    --dds-size-24: 1.5rem;
    --dds-size-240: 15rem;
    --dds-size-28: 1.75rem;
    --dds-size-280: 17.5rem;
    --dds-size-288: 18rem;
    --dds-size-296: 18.5rem;
    --dds-size-300: 18.75rem;
    --dds-size-32: 2rem;
    --dds-size-320: 20rem;
    --dds-size-36: 2.25rem;
    --dds-size-360: 22.5rem;
    --dds-size-4: 0.25rem;
    --dds-size-40: 2.5rem;
    --dds-size-400: 25rem;
    --dds-size-44: 2.75rem;
    --dds-size-48: 3rem;
    --dds-size-480: 30rem;
    --dds-size-488: 30.5rem;
    --dds-size-496: 31rem;
    --dds-size-52: 3.25rem;
    --dds-size-56: 3.5rem;
    --dds-size-560: 35rem;
    --dds-size-6: 0.375rem;
    --dds-size-60: 3.75rem;
    --dds-size-64: 4rem;
    --dds-size-68: 4.25rem;
    --dds-size-72: 4.5rem;
    --dds-size-76: 4.75rem;
    --dds-size-767: 47.9375rem;
    --dds-size-8: 0.5rem;
    --dds-size-80: 5rem;
    --dds-size-800: 50rem;
    --dds-size-88: 5.5rem;
    --dds-size-920: 57.5rem;
    --dds-size-96: 6rem;
    --dds-size-960: 60rem;
    --dds-size-98: 6.125rem;
    --dds-size-9999: 624.9375rem;
    --dds-ai-color-berry-05: #f9dce9;
    --dds-ai-color-berry-10: #f3b0cd;
    --dds-ai-color-berry-20: #ec84b1;
    --dds-ai-color-berry-30: #e6609b;
    --dds-ai-color-berry-40: #df347f;
    --dds-ai-color-berry-50: #c61f68;
    --dds-ai-color-berry-60: #9f1953;
    --dds-ai-color-berry-70: #73123c;
    --dds-ai-color-berry-80: #4f0c2a;
    --dds-ai-color-berry-90: #2c0717;
    --dds-ai-color-berry-95: #1a040e;
    --dds-ai-color-green-05: #f0faf1;
    --dds-ai-color-green-10: #d1f0d4;
    --dds-ai-color-green-20: #b7e1bb;
    --dds-ai-color-green-30: #8ccf93;
    --dds-ai-color-green-40: #69b471;
    --dds-ai-color-green-50: #52a35a;
    --dds-ai-color-green-60: #44884b;
    --dds-ai-color-green-70: #336638;
    --dds-ai-color-green-80: #224425;
    --dds-ai-color-green-90: #142816;
    --dds-ai-color-green-95: #0a140b;
    --dds-ai-color-purple-05: #e6dcfa;
    --dds-ai-color-purple-10: #c6aff3;
    --dds-ai-color-purple-20: #ad8ced;
    --dds-ai-color-purple-30: #8d60e7;
    --dds-ai-color-purple-40: #6d33e0;
    --dds-ai-color-purple-50: #561fc4;
    --dds-ai-color-purple-60: #46189f;
    --dds-ai-color-purple-70: #321273;
    --dds-ai-color-purple-80: #230c50;
    --dds-ai-color-purple-90: #13072c;
    --dds-ai-color-purple-95: #0c041b;
    --dds-ai-color-red-05: #faf0f0;
    --dds-ai-color-red-10: #efd1d1;
    --dds-ai-color-red-20: #e5b3b3;
    --dds-ai-color-red-30: #d68585;
    --dds-ai-color-red-40: #c65858;
    --dds-ai-color-red-50: #b73e3e;
    --dds-ai-color-red-60: #983434;
    --dds-ai-color-red-70: #722727;
    --dds-ai-color-red-80: #4c1a1a;
    --dds-ai-color-red-90: #2e1010;
    --dds-ai-color-red-95: #170808;
    --dds-ai-color-slate-05: #f0f2fa;
    --dds-ai-color-slate-10: #d1d9f0;
    --dds-ai-color-slate-20: #b7c1e1;
    --dds-ai-color-slate-30: #8c9dcf;
    --dds-ai-color-slate-40: #697cb4;
    --dds-ai-color-slate-50: #5266a3;
    --dds-ai-color-slate-60: #445588;
    --dds-ai-color-slate-70: #334066;
    --dds-ai-color-slate-80: #222a44;
    --dds-ai-color-slate-90: #141928;
    --dds-ai-color-slate-95: #0a0e14;
    --dds-ai-color-yellow-05: #fff9e8;
    --dds-ai-color-yellow-10: #f7e7b6;
    --dds-ai-color-yellow-20: #ebd689;
    --dds-ai-color-yellow-30: #d8bc53;
    --dds-ai-color-yellow-40: #c8a339;
    --dds-ai-color-yellow-50: #b58921;
    --dds-ai-color-yellow-60: #8e6b19;
    --dds-ai-color-yellow-70: #6c5112;
    --dds-ai-color-yellow-80: #47350c;
    --dds-ai-color-yellow-90: #342709;
    --dds-ai-color-yellow-95: #1a1304;
    --dds-motion-duration-02: 0.2s;
    --dds-motion-duration-03: 0.3s;
    --dds-motion-duration-05: 0.5s;
    --dds-motion-easing-ease-out: ease-out;
    --dds-motion-easing-linear: linear;
  }
}
@layer semantic {
  :root,
  :host {
    --dds-border-radius-2xl: var(--dds-size-32);
    --dds-border-radius-lg: var(--dds-size-12);
    --dds-border-radius-md: var(--dds-size-8);
    --dds-border-radius-rounded: var(--dds-size-9999);
    --dds-border-radius-sm: var(--dds-size-4);
    --dds-border-radius-xl: var(--dds-size-16);
    --dds-border-radius-xs: var(--dds-size-2);
    --dds-border-width-lg: var(--dds-size-4);
    --dds-border-width-sm: var(--dds-size-2);
    --dds-border-width-xs: var(--dds-size-1);
    --dds-spacing-2xl: var(--dds-size-32);
    --dds-spacing-3xl: var(--dds-size-40);
    --dds-spacing-4xl: var(--dds-size-48);
    --dds-spacing-5xl: var(--dds-size-64);
    --dds-spacing-6xl: var(--dds-size-80);
    --dds-spacing-7xl: var(--dds-size-96);
    --dds-spacing-lg: var(--dds-size-16);
    --dds-spacing-md: var(--dds-size-12);
    --dds-spacing-sm: var(--dds-size-8);
    --dds-spacing-xl: var(--dds-size-24);
    --dds-spacing-xs: var(--dds-size-4);
    --dds-grid-gutter-comfy-2xl: var(--dds-size-32);
    --dds-grid-gutter-comfy-3xl: var(--dds-size-48);
    --dds-grid-gutter-comfy-4xl: var(--dds-size-56);
    --dds-grid-gutter-comfy-5xl: var(--dds-size-64);
    --dds-grid-gutter-comfy-lg: var(--dds-size-24);
    --dds-grid-gutter-comfy-md: var(--dds-size-24);
    --dds-grid-gutter-comfy-sm: var(--dds-size-24);
    --dds-grid-gutter-comfy-xl: var(--dds-size-24);
    --dds-grid-gutter-comfy-xs: var(--dds-size-24);
    --dds-grid-gutter-compact-2xl: var(--dds-size-16);
    --dds-grid-gutter-compact-3xl: var(--dds-size-24);
    --dds-grid-gutter-compact-4xl: var(--dds-size-32);
    --dds-grid-gutter-compact-5xl: var(--dds-size-40);
    --dds-grid-gutter-compact-lg: var(--dds-size-16);
    --dds-grid-gutter-compact-md: var(--dds-size-16);
    --dds-grid-gutter-compact-sm: var(--dds-size-8);
    --dds-grid-gutter-compact-xl: var(--dds-size-16);
    --dds-grid-gutter-compact-xs: var(--dds-size-8);
    --dds-grid-gutter-regular-2xl: var(--dds-size-24);
    --dds-grid-gutter-regular-3xl: var(--dds-size-32);
    --dds-grid-gutter-regular-4xl: var(--dds-size-40);
    --dds-grid-gutter-regular-5xl: var(--dds-size-48);
    --dds-grid-gutter-regular-lg: var(--dds-size-16);
    --dds-grid-gutter-regular-md: var(--dds-size-16);
    --dds-grid-gutter-regular-sm: var(--dds-size-16);
    --dds-grid-gutter-regular-xl: var(--dds-size-16);
    --dds-grid-gutter-regular-xs: var(--dds-size-16);
    --dds-ai-color-background-gradient-angle: 240deg;
    --dds-ai-color-background-gradient-position-color1: 1%;
    --dds-ai-color-background-gradient-position-color2: 50%;
    --dds-ai-color-background-gradient-position-color3: 98%;
    --dds-typography-body-1-line-height: var(--dds-font-line-height-36);
    --dds-typography-body-1-size: var(--dds-font-size-24);
    --dds-typography-body-1-weight-default: var(--dds-font-weight-regular);
    --dds-typography-body-1-weight-strong: var(--dds-font-weight-semi-bold);
    --dds-typography-body-2-line-height: var(--dds-font-line-height-24);
    --dds-typography-body-2-size: var(--dds-font-size-16);
    --dds-typography-body-2-weight-default: var(--dds-font-weight-regular);
    --dds-typography-body-2-weight-strong: var(--dds-font-weight-semi-bold);
    --dds-typography-body-3-line-height: var(--dds-font-line-height-20);
    --dds-typography-body-3-size: var(--dds-font-size-14);
    --dds-typography-body-3-weight-default: var(--dds-font-weight-regular);
    --dds-typography-body-3-weight-strong: var(--dds-font-weight-semi-bold);
    --dds-typography-body-4-line-height: var(--dds-font-line-height-20);
    --dds-typography-body-4-size: var(--dds-font-size-12);
    --dds-typography-body-4-weight-default: var(--dds-font-weight-regular);
    --dds-typography-body-4-weight-strong: var(--dds-font-weight-semi-bold);
    --dds-typography-body-5-line-height: var(--dds-font-line-height-12);
    --dds-typography-body-5-size: var(--dds-font-size-10);
    --dds-typography-body-5-weight-default: var(--dds-font-weight-regular);
    --dds-typography-body-5-weight-strong: var(--dds-font-weight-semi-bold);
    --dds-typography-body-6-line-height: var(--dds-font-line-height-14);
    --dds-typography-body-6-size: var(--dds-font-size-9);
    --dds-typography-body-6-weight-default: var(--dds-font-weight-regular);
    --dds-typography-body-6-weight-strong: var(--dds-font-weight-semi-bold);
    --dds-typography-caption-line-height: var(--dds-font-line-height-20);
    --dds-typography-caption-size: var(--dds-font-size-12);
    --dds-typography-caption-weight-default: var(--dds-font-weight-regular);
    --dds-typography-caption-weight-strong: var(--dds-font-weight-semi-bold);
    --dds-typography-display-1-line-height-compact: var(--dds-font-line-height-68);
    --dds-typography-display-1-line-height-default: var(--dds-font-line-height-88);
    --dds-typography-display-1-size-compact: var(--dds-font-size-56);
    --dds-typography-display-1-size-default: var(--dds-font-size-72);
    --dds-typography-display-1-weight-compact: var(--dds-font-weight-light);
    --dds-typography-display-1-weight-default: var(--dds-font-weight-light);
    --dds-typography-display-2-line-height-compact: var(--dds-font-line-height-56);
    --dds-typography-display-2-line-height-default: var(--dds-font-line-height-76);
    --dds-typography-display-2-size-compact: var(--dds-font-size-48);
    --dds-typography-display-2-size-default: var(--dds-font-size-64);
    --dds-typography-display-2-weight-compact: var(--dds-font-weight-light);
    --dds-typography-display-2-weight-default: var(--dds-font-weight-light);
    --dds-typography-display-3-line-height-compact: var(--dds-font-line-height-48);
    --dds-typography-display-3-line-height-default: var(--dds-font-line-height-68);
    --dds-typography-display-3-size-compact: var(--dds-font-size-40);
    --dds-typography-display-3-size-default: var(--dds-font-size-56);
    --dds-typography-display-3-weight-compact: var(--dds-font-weight-light);
    --dds-typography-display-3-weight-default: var(--dds-font-weight-light);
    --dds-typography-font-family-base: var(--dds-font-family-roboto);
    --dds-typography-font-family-code: var(--dds-font-family-roboto-mono);
    --dds-typography-heading-1-line-height-compact: var(--dds-font-line-height-48);
    --dds-typography-heading-1-line-height-default: var(--dds-font-line-height-56);
    --dds-typography-heading-1-size-compact: var(--dds-font-size-40);
    --dds-typography-heading-1-size-default: var(--dds-font-size-48);
    --dds-typography-heading-1-weight-compact: var(--dds-font-weight-light);
    --dds-typography-heading-1-weight-default: var(--dds-font-weight-light);
    --dds-typography-heading-2-line-height-compact: var(--dds-font-line-height-40);
    --dds-typography-heading-2-line-height-default: var(--dds-font-line-height-48);
    --dds-typography-heading-2-size-compact: var(--dds-font-size-32);
    --dds-typography-heading-2-size-default: var(--dds-font-size-40);
    --dds-typography-heading-2-weight-compact: var(--dds-font-weight-light);
    --dds-typography-heading-2-weight-default: var(--dds-font-weight-light);
    --dds-typography-heading-3-line-height-compact: var(--dds-font-line-height-32);
    --dds-typography-heading-3-line-height-default: var(--dds-font-line-height-40);
    --dds-typography-heading-3-size-compact: var(--dds-font-size-24);
    --dds-typography-heading-3-size-default: var(--dds-font-size-32);
    --dds-typography-heading-3-weight-compact: var(--dds-font-weight-regular);
    --dds-typography-heading-3-weight-default: var(--dds-font-weight-light);
    --dds-typography-heading-4-line-height-compact: var(--dds-font-line-height-28);
    --dds-typography-heading-4-line-height-default: var(--dds-font-line-height-32);
    --dds-typography-heading-4-size-compact: var(--dds-font-size-20);
    --dds-typography-heading-4-size-default: var(--dds-font-size-24);
    --dds-typography-heading-4-weight-compact: var(--dds-font-weight-regular);
    --dds-typography-heading-4-weight-default: var(--dds-font-weight-regular);
    --dds-typography-heading-5-line-height-compact: var(--dds-font-line-height-24);
    --dds-typography-heading-5-line-height-default: var(--dds-font-line-height-28);
    --dds-typography-heading-5-size-compact: var(--dds-font-size-16);
    --dds-typography-heading-5-size-default: var(--dds-font-size-20);
    --dds-typography-heading-5-weight-compact: var(--dds-font-weight-regular);
    --dds-typography-heading-5-weight-default: var(--dds-font-weight-regular);
    --dds-typography-heading-6-line-height-default: var(--dds-font-line-height-24);
    --dds-typography-heading-6-size-default: var(--dds-font-size-16);
    --dds-typography-heading-6-weight-default: var(--dds-font-weight-medium);
    --dds-typography-subtitle-1-line-height: var(--dds-font-line-height-36);
    --dds-typography-subtitle-1-size: var(--dds-font-size-24);
    --dds-typography-subtitle-1-weight-default: var(--dds-font-weight-regular);
    --dds-typography-subtitle-1-weight-strong: var(--dds-font-weight-bold);
    --dds-typography-subtitle-2-line-height: var(--dds-font-line-height-24);
    --dds-typography-subtitle-2-size: var(--dds-font-size-16);
    --dds-typography-subtitle-2-weight-default: var(--dds-font-weight-medium);
    --dds-typography-subtitle-2-weight-strong: var(--dds-font-weight-bold);
    --dds-font-family-base: var(--dds-font-family-roboto), "Cordia New", "Microsoft Sans Serif", "Utsaah", "Devanagari MT", "Nirmala UI", "Latha", "InaiMathi", "Gautami", "Telugu Sangam MN", "Tunga", "Kannada Sangam MN", "Kartika", "Malayalam Sangam MN", "Shruti", "Nirmala UI", "Gujarati MT", "Gujarati Sangam MN", "Vrinda", "Bangla Sangam MN", "Meiryo UI", "メイリオ", "MS UI Gothic Reg", "Hiragino Kaku Gothic Reg", "ヒラギノ角ゴ Pro W3 Reg", "Microsoft YaHei", "微软雅黑", "Hiragino Sans GB", "Microsoft JhengHei", "微軟正黑體", "Malgun Gothic", "맑은 고딕", "Gulim", "AppleGothic", "Apple LiGothic", "LiHei Pro", "Osaka", "STHeiti", "华文黑体", "STXihei", "华文细黑", "SimHei", "黑体", "Arial Unicode MS", "Arial", "sans-serif";
    --dds-font-family-code: sfmono-regular, menlo, monaco, consolas, Liberation Mono, Courier New, monospace;
  }
  :root,
  :host {
    --dds-color-background-brand-base-hover: var(--dds-color-blue-70);
    --dds-color-background-brand-base-pressed: var(--dds-color-blue-80);
    --dds-color-background-brand-base-rest: var(--dds-color-blue-60);
    --dds-color-background-brand-subtle-hover: var(--dds-color-blue-20);
    --dds-color-background-brand-subtle-pressed: var(--dds-color-blue-30);
    --dds-color-background-brand-subtle-rest: var(--dds-color-blue-10);
    --dds-color-background-error-base-hover: var(--dds-color-red-70);
    --dds-color-background-error-base-pressed: var(--dds-color-red-80);
    --dds-color-background-error-base-rest: var(--dds-color-red-60);
    --dds-color-background-error-subtle-hover: var(--dds-color-red-20);
    --dds-color-background-error-subtle-pressed: var(--dds-color-red-30);
    --dds-color-background-error-subtle-rest: var(--dds-color-red-10);
    --dds-color-background-info-base-hover: var(--dds-color-blue-70);
    --dds-color-background-info-base-pressed: var(--dds-color-blue-80);
    --dds-color-background-info-base-rest: var(--dds-color-blue-60);
    --dds-color-background-info-subtle-hover: var(--dds-color-blue-20);
    --dds-color-background-info-subtle-pressed: var(--dds-color-blue-30);
    --dds-color-background-info-subtle-rest: var(--dds-color-blue-10);
    --dds-color-background-neutral-base-hover: var(--dds-color-slate-70);
    --dds-color-background-neutral-base-pressed: var(--dds-color-slate-80);
    --dds-color-background-neutral-base-rest: var(--dds-color-slate-60);
    --dds-color-background-neutral-ghost-hover: rgba(64, 88, 109, 0.1);
    --dds-color-background-neutral-ghost-pressed: rgba(64, 88, 109, 0.2);
    --dds-color-background-neutral-ghost-rest: transparent;
    --dds-color-background-neutral-subtle-hover: var(--dds-color-slate-20);
    --dds-color-background-neutral-subtle-pressed: var(--dds-color-slate-30);
    --dds-color-background-neutral-subtle-rest: var(--dds-color-slate-10);
    --dds-color-background-success-base-hover: var(--dds-color-green-70);
    --dds-color-background-success-base-pressed: var(--dds-color-green-80);
    --dds-color-background-success-base-rest: var(--dds-color-green-60);
    --dds-color-background-success-subtle-hover: var(--dds-color-green-20);
    --dds-color-background-success-subtle-pressed: var(--dds-color-green-30);
    --dds-color-background-success-subtle-rest: var(--dds-color-green-10);
    --dds-color-background-surface-drop-shadow: rgba(0, 42, 88, 0.08);
    --dds-color-background-surface-inactive: var(--dds-color-gray-30);
    --dds-color-background-surface-inverse: var(--dds-color-slate-70);
    --dds-color-background-surface-neutral: var(--dds-color-neutral-white);
    --dds-color-background-surface-overlay: rgba(14, 14, 14, 0.4);
    --dds-color-background-surface-primary: var(--dds-color-neutral-white);
    --dds-color-background-surface-secondary: var(--dds-color-slate-10);
    --dds-color-background-surface-strong: var(--dds-color-slate-60);
    --dds-color-background-surface-tertiary: var(--dds-color-slate-20);
    --dds-color-background-surface-transparent: transparent;
    --dds-color-background-warning-base-hover: var(--dds-color-yellow-70);
    --dds-color-background-warning-base-pressed: var(--dds-color-yellow-60);
    --dds-color-background-warning-base-rest: var(--dds-color-yellow-80);
    --dds-color-background-warning-subtle-hover: var(--dds-color-yellow-20);
    --dds-color-background-warning-subtle-pressed: var(--dds-color-yellow-30);
    --dds-color-background-warning-subtle-rest: var(--dds-color-yellow-10);
    --dds-color-border-brand-base: var(--dds-color-blue-80);
    --dds-color-border-brand-subtle: var(--dds-color-blue-30);
    --dds-color-border-error-base: var(--dds-color-red-80);
    --dds-color-border-error-subtle: var(--dds-color-red-30);
    --dds-color-border-focus-ring1: var(--dds-color-neutral-white);
    --dds-color-border-focus-ring2: var(--dds-color-blue-80);
    --dds-color-border-inactive-base: var(--dds-color-gray-60);
    --dds-color-border-inactive-subtle: var(--dds-color-gray-30);
    --dds-color-border-info-base: var(--dds-color-blue-80);
    --dds-color-border-info-subtle: var(--dds-color-blue-30);
    --dds-color-border-neutral-base: var(--dds-color-slate-70);
    --dds-color-border-neutral-pale: var(--dds-color-slate-20);
    --dds-color-border-neutral-subtle: var(--dds-color-slate-45);
    --dds-color-border-success-base: var(--dds-color-green-80);
    --dds-color-border-success-subtle: var(--dds-color-green-30);
    --dds-color-border-warning-base: var(--dds-color-yellow-80);
    --dds-color-border-warning-subtle: var(--dds-color-yellow-30);
    --dds-color-text-brand: var(--dds-color-blue-60);
    --dds-color-text-brand-hover: var(--dds-color-blue-80);
    --dds-color-text-brand-pressed: var(--dds-color-blue-90);
    --dds-color-text-brand-rest: var(--dds-color-blue-70);
    --dds-color-text-error-hover: var(--dds-color-red-80);
    --dds-color-text-error-pressed: var(--dds-color-red-90);
    --dds-color-text-error-rest: var(--dds-color-red-70);
    --dds-color-text-inactive: var(--dds-color-gray-50);
    --dds-color-text-info-hover: var(--dds-color-blue-80);
    --dds-color-text-info-pressed: var(--dds-color-blue-90);
    --dds-color-text-info-rest: var(--dds-color-blue-70);
    --dds-color-text-neutral: var(--dds-color-neutral-white);
    --dds-color-text-neutral-hover: var(--dds-color-slate-80);
    --dds-color-text-neutral-pressed: var(--dds-color-slate-90);
    --dds-color-text-neutral-rest: var(--dds-color-slate-70);
    --dds-color-text-primary: var(--dds-color-slate-70);
    --dds-color-text-secondary: var(--dds-color-slate-60);
    --dds-color-text-success-hover: var(--dds-color-green-80);
    --dds-color-text-success-pressed: var(--dds-color-green-90);
    --dds-color-text-success-rest: var(--dds-color-green-70);
    --dds-color-text-tertiary: var(--dds-color-slate-45);
    --dds-color-text-warning-hover: var(--dds-color-yellow-80);
    --dds-color-text-warning-pressed: var(--dds-color-yellow-90);
    --dds-color-text-warning-rest: var(--dds-color-yellow-70);
    --dds-ai-color-background-error-base-hover: var(--dds-ai-color-red-30);
    --dds-ai-color-background-error-base-pressed: var(--dds-ai-color-red-60);
    --dds-ai-color-background-error-base-rest: var(--dds-ai-color-red-50);
    --dds-ai-color-background-gradient-base-hover-color1: var(--dds-ai-color-berry-40);
    --dds-ai-color-background-gradient-base-hover-color2: var(--dds-ai-color-purple-40);
    --dds-ai-color-background-gradient-base-hover-color3: var(--dds-color-blue-40);
    --dds-ai-color-background-gradient-base-inactive-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-background-gradient-base-inactive-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-background-gradient-base-inactive-color3: var(--dds-color-blue-20);
    --dds-ai-color-background-gradient-base-pressed-color1: var(--dds-ai-color-berry-60);
    --dds-ai-color-background-gradient-base-pressed-color2: var(--dds-ai-color-purple-60);
    --dds-ai-color-background-gradient-base-pressed-color3: var(--dds-color-blue-60);
    --dds-ai-color-background-gradient-base-rest-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-background-gradient-base-rest-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-background-gradient-base-rest-color3: var(--dds-color-blue-50);
    --dds-ai-color-background-gradient-subtle-hover-color1: var(--dds-ai-color-berry-05);
    --dds-ai-color-background-gradient-subtle-hover-color2: var(--dds-ai-color-purple-05);
    --dds-ai-color-background-gradient-subtle-hover-color3: var(--dds-color-blue-10);
    --dds-ai-color-background-gradient-subtle-pressed-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-background-gradient-subtle-pressed-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-background-gradient-subtle-pressed-color3: var(--dds-color-blue-20);
    --dds-ai-color-background-neutral-base-hover: var(--dds-ai-color-slate-40);
    --dds-ai-color-background-neutral-base-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-color-background-neutral-base-rest: var(--dds-ai-color-slate-50);
    --dds-ai-color-background-neutral-ghost-hover: rgba(82, 102, 163, 0.1);
    --dds-ai-color-background-neutral-ghost-pressed: rgba(82, 102, 163, 0.2);
    --dds-ai-color-background-neutral-ghost-rest: transparent;
    --dds-ai-color-background-neutral-subtle-hover: var(--dds-ai-color-slate-10);
    --dds-ai-color-background-neutral-subtle-pressed: var(--dds-ai-color-slate-20);
    --dds-ai-color-background-neutral-subtle-rest: var(--dds-ai-color-slate-05);
    --dds-ai-color-background-success-base-hover: var(--dds-ai-color-green-40);
    --dds-ai-color-background-success-base-pressed: var(--dds-ai-color-green-60);
    --dds-ai-color-background-success-base-rest: var(--dds-ai-color-green-50);
    --dds-ai-color-background-surface-inactive: var(--dds-color-gray-30);
    --dds-ai-color-background-surface-primary: var(--dds-ai-color-slate-05);
    --dds-ai-color-background-surface-secondary: var(--dds-ai-color-slate-10);
    --dds-ai-color-background-surface-tertiary: var(--dds-ai-color-slate-20);
    --dds-ai-color-border-error-base: var(--dds-ai-color-red-50);
    --dds-ai-color-border-focus-base-ring1: var(--dds-ai-color-slate-05);
    --dds-ai-color-border-focus-base-ring2: var(--dds-ai-color-purple-40);
    --dds-ai-color-border-focus-neutral: var(--dds-ai-color-slate-60);
    --dds-ai-color-border-focus-neutral-subtle: var(--dds-color-neutral-white);
    --dds-ai-color-border-gradient-base-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-border-gradient-base-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-border-gradient-base-color3: var(--dds-color-blue-50);
    --dds-ai-color-border-gradient-inactive-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-border-gradient-inactive-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-border-gradient-inactive-color3: var(--dds-color-blue-20);
    --dds-ai-color-border-neutral-base: var(--dds-ai-color-slate-20);
    --dds-ai-color-border-neutral-inactive: var(--dds-color-gray-40);
    --dds-ai-color-border-neutral-pale: var(--dds-ai-color-slate-05);
    --dds-ai-color-border-neutral-subtle: var(--dds-ai-color-slate-10);
    --dds-ai-color-border-success-base: var(--dds-ai-color-green-50);
    --dds-ai-color-text-error: var(--dds-ai-color-red-50);
    --dds-ai-color-text-gradient-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-text-gradient-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-text-gradient-color3: var(--dds-color-blue-50);
    --dds-ai-color-text-inactive: var(--dds-color-gray-50);
    --dds-ai-color-text-neutral-hover: var(--dds-ai-color-slate-70);
    --dds-ai-color-text-neutral-pressed: var(--dds-ai-color-slate-80);
    --dds-ai-color-text-neutral-rest: var(--dds-ai-color-slate-60);
    --dds-ai-color-text-neutral-strong-hover: var(--dds-ai-color-slate-90);
    --dds-ai-color-text-neutral-strong-pressed: var(--dds-ai-color-slate-95);
    --dds-ai-color-text-neutral-strong-rest: var(--dds-ai-color-slate-80);
    --dds-ai-color-text-primary: var(--dds-ai-color-slate-80);
    --dds-ai-color-text-secondary: var(--dds-ai-color-slate-60);
    --dds-ai-color-text-success: var(--dds-ai-color-green-50);
    --dds-ai-color-text-tertiary: var(--dds-ai-color-slate-50);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-color-background-brand-base-hover: var(--dds-color-blue-60);
      --dds-color-background-brand-base-pressed: var(--dds-color-blue-70);
      --dds-color-background-brand-base-rest: var(--dds-color-blue-50);
      --dds-color-background-brand-subtle-hover: var(--dds-color-blue-80);
      --dds-color-background-brand-subtle-pressed: var(--dds-color-blue-70);
      --dds-color-background-brand-subtle-rest: var(--dds-color-blue-90);
      --dds-color-background-error-base-hover: var(--dds-color-red-60);
      --dds-color-background-error-base-pressed: var(--dds-color-red-70);
      --dds-color-background-error-base-rest: var(--dds-color-red-50);
      --dds-color-background-error-subtle-hover: var(--dds-color-red-80);
      --dds-color-background-error-subtle-pressed: var(--dds-color-red-70);
      --dds-color-background-error-subtle-rest: var(--dds-color-red-90);
      --dds-color-background-info-base-hover: var(--dds-color-blue-60);
      --dds-color-background-info-base-pressed: var(--dds-color-blue-70);
      --dds-color-background-info-base-rest: var(--dds-color-blue-50);
      --dds-color-background-info-subtle-hover: var(--dds-color-blue-80);
      --dds-color-background-info-subtle-pressed: var(--dds-color-blue-70);
      --dds-color-background-info-subtle-rest: var(--dds-color-blue-90);
      --dds-color-background-neutral-base-hover: var(--dds-color-slate-40);
      --dds-color-background-neutral-base-pressed: var(--dds-color-slate-45);
      --dds-color-background-neutral-base-rest: var(--dds-color-slate-30);
      --dds-color-background-neutral-ghost-hover: rgba(64, 88, 109, 0.2);
      --dds-color-background-neutral-ghost-pressed: rgba(64, 88, 109, 0.3);
      --dds-color-background-neutral-ghost-rest: transparent;
      --dds-color-background-neutral-subtle-hover: var(--dds-color-slate-50);
      --dds-color-background-neutral-subtle-pressed: var(--dds-color-slate-45);
      --dds-color-background-neutral-subtle-rest: var(--dds-color-slate-60);
      --dds-color-background-success-base-hover: var(--dds-color-green-60);
      --dds-color-background-success-base-pressed: var(--dds-color-green-70);
      --dds-color-background-success-base-rest: var(--dds-color-green-50);
      --dds-color-background-success-subtle-hover: var(--dds-color-green-70);
      --dds-color-background-success-subtle-pressed: var(--dds-color-green-60);
      --dds-color-background-success-subtle-rest: var(--dds-color-green-90);
      --dds-color-background-surface-drop-shadow: rgba(0, 0, 0, 0.08);
      --dds-color-background-surface-inactive: var(--dds-color-gray-90);
      --dds-color-background-surface-inverse: var(--dds-color-neutral-white);
      --dds-color-background-surface-neutral: var(--dds-color-slate-80);
      --dds-color-background-surface-overlay: rgba(14, 14, 14, 0.4);
      --dds-color-background-surface-primary: var(--dds-color-slate-80);
      --dds-color-background-surface-secondary: var(--dds-color-slate-70);
      --dds-color-background-surface-strong: var(--dds-color-slate-40);
      --dds-color-background-surface-tertiary: var(--dds-color-slate-60);
      --dds-color-background-surface-transparent: transparent;
      --dds-color-background-warning-base-hover: var(--dds-color-yellow-60);
      --dds-color-background-warning-base-pressed: var(--dds-color-yellow-70);
      --dds-color-background-warning-base-rest: var(--dds-color-yellow-50);
      --dds-color-background-warning-subtle-hover: var(--dds-color-yellow-80);
      --dds-color-background-warning-subtle-pressed: var(--dds-color-yellow-70);
      --dds-color-background-warning-subtle-rest: var(--dds-color-yellow-90);
      --dds-color-border-brand-base: var(--dds-color-blue-40);
      --dds-color-border-brand-subtle: var(--dds-color-blue-40);
      --dds-color-border-error-base: var(--dds-color-red-50);
      --dds-color-border-error-subtle: var(--dds-color-red-40);
      --dds-color-border-focus-ring1: var(--dds-color-slate-90);
      --dds-color-border-focus-ring2: var(--dds-color-blue-20);
      --dds-color-border-inactive-base: var(--dds-color-gray-60);
      --dds-color-border-inactive-subtle: var(--dds-color-gray-30);
      --dds-color-border-info-base: var(--dds-color-blue-40);
      --dds-color-border-info-subtle: var(--dds-color-blue-40);
      --dds-color-border-neutral-base: var(--dds-color-slate-30);
      --dds-color-border-neutral-pale: var(--dds-color-slate-60);
      --dds-color-border-neutral-subtle: var(--dds-color-slate-40);
      --dds-color-border-success-base: var(--dds-color-green-50);
      --dds-color-border-success-subtle: var(--dds-color-green-40);
      --dds-color-border-warning-base: var(--dds-color-yellow-50);
      --dds-color-border-warning-subtle: var(--dds-color-yellow-50);
      --dds-color-text-brand: var(--dds-color-blue-60);
      --dds-color-text-brand-hover: var(--dds-color-blue-20);
      --dds-color-text-brand-pressed: var(--dds-color-blue-10);
      --dds-color-text-brand-rest: var(--dds-color-blue-30);
      --dds-color-text-error-hover: var(--dds-color-red-20);
      --dds-color-text-error-pressed: var(--dds-color-red-10);
      --dds-color-text-error-rest: var(--dds-color-red-30);
      --dds-color-text-inactive: var(--dds-color-gray-60);
      --dds-color-text-info-hover: var(--dds-color-blue-20);
      --dds-color-text-info-pressed: var(--dds-color-blue-10);
      --dds-color-text-info-rest: var(--dds-color-blue-30);
      --dds-color-text-neutral: var(--dds-color-neutral-black);
      --dds-color-text-neutral-hover: var(--dds-color-slate-20);
      --dds-color-text-neutral-pressed: var(--dds-color-slate-10);
      --dds-color-text-neutral-rest: var(--dds-color-slate-30);
      --dds-color-text-primary: var(--dds-color-slate-10);
      --dds-color-text-secondary: var(--dds-color-slate-20);
      --dds-color-text-success-hover: var(--dds-color-green-20);
      --dds-color-text-success-pressed: var(--dds-color-green-10);
      --dds-color-text-success-rest: var(--dds-color-green-30);
      --dds-color-text-tertiary: var(--dds-color-slate-30);
      --dds-color-text-warning-hover: var(--dds-color-yellow-20);
      --dds-color-text-warning-pressed: var(--dds-color-yellow-10);
      --dds-color-text-warning-rest: var(--dds-color-yellow-30);
      --dds-ai-color-background-error-base-hover: var(--dds-ai-color-red-60);
      --dds-ai-color-background-error-base-pressed: var(--dds-ai-color-red-50);
      --dds-ai-color-background-error-base-rest: var(--dds-ai-color-red-70);
      --dds-ai-color-background-gradient-base-hover-color1: var(--dds-ai-color-berry-40);
      --dds-ai-color-background-gradient-base-hover-color2: var(--dds-ai-color-purple-40);
      --dds-ai-color-background-gradient-base-hover-color3: var(--dds-color-blue-40);
      --dds-ai-color-background-gradient-base-inactive-color1: var(--dds-ai-color-berry-20);
      --dds-ai-color-background-gradient-base-inactive-color2: var(--dds-ai-color-purple-20);
      --dds-ai-color-background-gradient-base-inactive-color3: var(--dds-color-blue-20);
      --dds-ai-color-background-gradient-base-pressed-color1: var(--dds-ai-color-berry-60);
      --dds-ai-color-background-gradient-base-pressed-color2: var(--dds-ai-color-purple-60);
      --dds-ai-color-background-gradient-base-pressed-color3: var(--dds-color-blue-60);
      --dds-ai-color-background-gradient-base-rest-color1: var(--dds-ai-color-berry-50);
      --dds-ai-color-background-gradient-base-rest-color2: var(--dds-ai-color-purple-50);
      --dds-ai-color-background-gradient-base-rest-color3: var(--dds-color-blue-50);
      --dds-ai-color-background-gradient-subtle-hover-color1: var(--dds-ai-color-berry-05);
      --dds-ai-color-background-gradient-subtle-hover-color2: var(--dds-ai-color-purple-05);
      --dds-ai-color-background-gradient-subtle-hover-color3: var(--dds-color-blue-10);
      --dds-ai-color-background-gradient-subtle-pressed-color1: var(--dds-ai-color-berry-20);
      --dds-ai-color-background-gradient-subtle-pressed-color2: var(--dds-ai-color-purple-20);
      --dds-ai-color-background-gradient-subtle-pressed-color3: var(--dds-color-blue-20);
      --dds-ai-color-background-neutral-base-hover: var(--dds-ai-color-slate-60);
      --dds-ai-color-background-neutral-base-pressed: var(--dds-ai-color-slate-70);
      --dds-ai-color-background-neutral-base-rest: var(--dds-ai-color-slate-50);
      --dds-ai-color-background-neutral-ghost-hover: rgba(82, 102, 163, 0.2);
      --dds-ai-color-background-neutral-ghost-pressed: rgba(82, 102, 163, 0.3);
      --dds-ai-color-background-neutral-ghost-rest: transparent;
      --dds-ai-color-background-neutral-subtle-hover: var(--dds-ai-color-slate-80);
      --dds-ai-color-background-neutral-subtle-pressed: var(--dds-ai-color-slate-70);
      --dds-ai-color-background-neutral-subtle-rest: var(--dds-ai-color-slate-90);
      --dds-ai-color-background-success-base-hover: var(--dds-ai-color-green-70);
      --dds-ai-color-background-success-base-pressed: var(--dds-ai-color-green-60);
      --dds-ai-color-background-success-base-rest: var(--dds-ai-color-green-80);
      --dds-ai-color-background-surface-inactive: var(--dds-color-gray-30);
      --dds-ai-color-background-surface-primary: var(--dds-ai-color-slate-90);
      --dds-ai-color-background-surface-secondary: var(--dds-ai-color-slate-80);
      --dds-ai-color-background-surface-tertiary: var(--dds-ai-color-slate-70);
      --dds-ai-color-border-error-base: var(--dds-ai-color-red-50);
      --dds-ai-color-border-focus-base-ring1: var(--dds-ai-color-slate-05);
      --dds-ai-color-border-focus-base-ring2: var(--dds-ai-color-purple-40);
      --dds-ai-color-border-focus-neutral: var(--dds-color-neutral-white);
      --dds-ai-color-border-focus-neutral-subtle: var(--dds-color-neutral-white);
      --dds-ai-color-border-gradient-base-color1: var(--dds-ai-color-berry-50);
      --dds-ai-color-border-gradient-base-color2: var(--dds-ai-color-purple-50);
      --dds-ai-color-border-gradient-base-color3: var(--dds-color-blue-50);
      --dds-ai-color-border-gradient-inactive-color1: var(--dds-ai-color-berry-20);
      --dds-ai-color-border-gradient-inactive-color2: var(--dds-ai-color-purple-20);
      --dds-ai-color-border-gradient-inactive-color3: var(--dds-color-blue-20);
      --dds-ai-color-border-neutral-base: var(--dds-ai-color-slate-30);
      --dds-ai-color-border-neutral-inactive: var(--dds-color-gray-40);
      --dds-ai-color-border-neutral-pale: var(--dds-ai-color-slate-10);
      --dds-ai-color-border-neutral-subtle: var(--dds-ai-color-slate-20);
      --dds-ai-color-border-success-base: var(--dds-ai-color-green-50);
      --dds-ai-color-text-error: var(--dds-ai-color-red-40);
      --dds-ai-color-text-gradient-color1: var(--dds-ai-color-berry-50);
      --dds-ai-color-text-gradient-color2: var(--dds-ai-color-purple-50);
      --dds-ai-color-text-gradient-color3: var(--dds-color-blue-50);
      --dds-ai-color-text-inactive: var(--dds-color-gray-50);
      --dds-ai-color-text-neutral-hover: var(--dds-ai-color-slate-10);
      --dds-ai-color-text-neutral-pressed: var(--dds-ai-color-slate-30);
      --dds-ai-color-text-neutral-rest: var(--dds-ai-color-slate-05);
      --dds-ai-color-text-neutral-strong-hover: var(--dds-ai-color-slate-20);
      --dds-ai-color-text-neutral-strong-pressed: var(--dds-ai-color-slate-30);
      --dds-ai-color-text-neutral-strong-rest: var(--dds-ai-color-slate-10);
      --dds-ai-color-text-primary: var(--dds-ai-color-slate-05);
      --dds-ai-color-text-secondary: var(--dds-ai-color-slate-10);
      --dds-ai-color-text-success: var(--dds-ai-color-green-30);
      --dds-ai-color-text-tertiary: var(--dds-ai-color-slate-20);
    }
  }
  .dds--light-mode {
    --dds-color-background-brand-base-hover: var(--dds-color-blue-70);
    --dds-color-background-brand-base-pressed: var(--dds-color-blue-80);
    --dds-color-background-brand-base-rest: var(--dds-color-blue-60);
    --dds-color-background-brand-subtle-hover: var(--dds-color-blue-20);
    --dds-color-background-brand-subtle-pressed: var(--dds-color-blue-30);
    --dds-color-background-brand-subtle-rest: var(--dds-color-blue-10);
    --dds-color-background-error-base-hover: var(--dds-color-red-70);
    --dds-color-background-error-base-pressed: var(--dds-color-red-80);
    --dds-color-background-error-base-rest: var(--dds-color-red-60);
    --dds-color-background-error-subtle-hover: var(--dds-color-red-20);
    --dds-color-background-error-subtle-pressed: var(--dds-color-red-30);
    --dds-color-background-error-subtle-rest: var(--dds-color-red-10);
    --dds-color-background-info-base-hover: var(--dds-color-blue-70);
    --dds-color-background-info-base-pressed: var(--dds-color-blue-80);
    --dds-color-background-info-base-rest: var(--dds-color-blue-60);
    --dds-color-background-info-subtle-hover: var(--dds-color-blue-20);
    --dds-color-background-info-subtle-pressed: var(--dds-color-blue-30);
    --dds-color-background-info-subtle-rest: var(--dds-color-blue-10);
    --dds-color-background-neutral-base-hover: var(--dds-color-slate-70);
    --dds-color-background-neutral-base-pressed: var(--dds-color-slate-80);
    --dds-color-background-neutral-base-rest: var(--dds-color-slate-60);
    --dds-color-background-neutral-ghost-hover: rgba(64, 88, 109, 0.1);
    --dds-color-background-neutral-ghost-pressed: rgba(64, 88, 109, 0.2);
    --dds-color-background-neutral-ghost-rest: transparent;
    --dds-color-background-neutral-subtle-hover: var(--dds-color-slate-20);
    --dds-color-background-neutral-subtle-pressed: var(--dds-color-slate-30);
    --dds-color-background-neutral-subtle-rest: var(--dds-color-slate-10);
    --dds-color-background-success-base-hover: var(--dds-color-green-70);
    --dds-color-background-success-base-pressed: var(--dds-color-green-80);
    --dds-color-background-success-base-rest: var(--dds-color-green-60);
    --dds-color-background-success-subtle-hover: var(--dds-color-green-20);
    --dds-color-background-success-subtle-pressed: var(--dds-color-green-30);
    --dds-color-background-success-subtle-rest: var(--dds-color-green-10);
    --dds-color-background-surface-drop-shadow: rgba(0, 42, 88, 0.08);
    --dds-color-background-surface-inactive: var(--dds-color-gray-30);
    --dds-color-background-surface-inverse: var(--dds-color-slate-70);
    --dds-color-background-surface-neutral: var(--dds-color-neutral-white);
    --dds-color-background-surface-overlay: rgba(14, 14, 14, 0.4);
    --dds-color-background-surface-primary: var(--dds-color-neutral-white);
    --dds-color-background-surface-secondary: var(--dds-color-slate-10);
    --dds-color-background-surface-strong: var(--dds-color-slate-60);
    --dds-color-background-surface-tertiary: var(--dds-color-slate-20);
    --dds-color-background-surface-transparent: transparent;
    --dds-color-background-warning-base-hover: var(--dds-color-yellow-70);
    --dds-color-background-warning-base-pressed: var(--dds-color-yellow-60);
    --dds-color-background-warning-base-rest: var(--dds-color-yellow-80);
    --dds-color-background-warning-subtle-hover: var(--dds-color-yellow-20);
    --dds-color-background-warning-subtle-pressed: var(--dds-color-yellow-30);
    --dds-color-background-warning-subtle-rest: var(--dds-color-yellow-10);
    --dds-color-border-brand-base: var(--dds-color-blue-80);
    --dds-color-border-brand-subtle: var(--dds-color-blue-30);
    --dds-color-border-error-base: var(--dds-color-red-80);
    --dds-color-border-error-subtle: var(--dds-color-red-30);
    --dds-color-border-focus-ring1: var(--dds-color-neutral-white);
    --dds-color-border-focus-ring2: var(--dds-color-blue-80);
    --dds-color-border-inactive-base: var(--dds-color-gray-60);
    --dds-color-border-inactive-subtle: var(--dds-color-gray-30);
    --dds-color-border-info-base: var(--dds-color-blue-80);
    --dds-color-border-info-subtle: var(--dds-color-blue-30);
    --dds-color-border-neutral-base: var(--dds-color-slate-70);
    --dds-color-border-neutral-pale: var(--dds-color-slate-20);
    --dds-color-border-neutral-subtle: var(--dds-color-slate-45);
    --dds-color-border-success-base: var(--dds-color-green-80);
    --dds-color-border-success-subtle: var(--dds-color-green-30);
    --dds-color-border-warning-base: var(--dds-color-yellow-80);
    --dds-color-border-warning-subtle: var(--dds-color-yellow-30);
    --dds-color-text-brand: var(--dds-color-blue-60);
    --dds-color-text-brand-hover: var(--dds-color-blue-80);
    --dds-color-text-brand-pressed: var(--dds-color-blue-90);
    --dds-color-text-brand-rest: var(--dds-color-blue-70);
    --dds-color-text-error-hover: var(--dds-color-red-80);
    --dds-color-text-error-pressed: var(--dds-color-red-90);
    --dds-color-text-error-rest: var(--dds-color-red-70);
    --dds-color-text-inactive: var(--dds-color-gray-50);
    --dds-color-text-info-hover: var(--dds-color-blue-80);
    --dds-color-text-info-pressed: var(--dds-color-blue-90);
    --dds-color-text-info-rest: var(--dds-color-blue-70);
    --dds-color-text-neutral: var(--dds-color-neutral-white);
    --dds-color-text-neutral-hover: var(--dds-color-slate-80);
    --dds-color-text-neutral-pressed: var(--dds-color-slate-90);
    --dds-color-text-neutral-rest: var(--dds-color-slate-70);
    --dds-color-text-primary: var(--dds-color-slate-70);
    --dds-color-text-secondary: var(--dds-color-slate-60);
    --dds-color-text-success-hover: var(--dds-color-green-80);
    --dds-color-text-success-pressed: var(--dds-color-green-90);
    --dds-color-text-success-rest: var(--dds-color-green-70);
    --dds-color-text-tertiary: var(--dds-color-slate-45);
    --dds-color-text-warning-hover: var(--dds-color-yellow-80);
    --dds-color-text-warning-pressed: var(--dds-color-yellow-90);
    --dds-color-text-warning-rest: var(--dds-color-yellow-70);
    --dds-ai-color-background-error-base-hover: var(--dds-ai-color-red-30);
    --dds-ai-color-background-error-base-pressed: var(--dds-ai-color-red-60);
    --dds-ai-color-background-error-base-rest: var(--dds-ai-color-red-50);
    --dds-ai-color-background-gradient-base-hover-color1: var(--dds-ai-color-berry-40);
    --dds-ai-color-background-gradient-base-hover-color2: var(--dds-ai-color-purple-40);
    --dds-ai-color-background-gradient-base-hover-color3: var(--dds-color-blue-40);
    --dds-ai-color-background-gradient-base-inactive-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-background-gradient-base-inactive-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-background-gradient-base-inactive-color3: var(--dds-color-blue-20);
    --dds-ai-color-background-gradient-base-pressed-color1: var(--dds-ai-color-berry-60);
    --dds-ai-color-background-gradient-base-pressed-color2: var(--dds-ai-color-purple-60);
    --dds-ai-color-background-gradient-base-pressed-color3: var(--dds-color-blue-60);
    --dds-ai-color-background-gradient-base-rest-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-background-gradient-base-rest-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-background-gradient-base-rest-color3: var(--dds-color-blue-50);
    --dds-ai-color-background-gradient-subtle-hover-color1: var(--dds-ai-color-berry-05);
    --dds-ai-color-background-gradient-subtle-hover-color2: var(--dds-ai-color-purple-05);
    --dds-ai-color-background-gradient-subtle-hover-color3: var(--dds-color-blue-10);
    --dds-ai-color-background-gradient-subtle-pressed-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-background-gradient-subtle-pressed-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-background-gradient-subtle-pressed-color3: var(--dds-color-blue-20);
    --dds-ai-color-background-neutral-base-hover: var(--dds-ai-color-slate-40);
    --dds-ai-color-background-neutral-base-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-color-background-neutral-base-rest: var(--dds-ai-color-slate-50);
    --dds-ai-color-background-neutral-ghost-hover: rgba(82, 102, 163, 0.1);
    --dds-ai-color-background-neutral-ghost-pressed: rgba(82, 102, 163, 0.2);
    --dds-ai-color-background-neutral-ghost-rest: transparent;
    --dds-ai-color-background-neutral-subtle-hover: var(--dds-ai-color-slate-10);
    --dds-ai-color-background-neutral-subtle-pressed: var(--dds-ai-color-slate-20);
    --dds-ai-color-background-neutral-subtle-rest: var(--dds-ai-color-slate-05);
    --dds-ai-color-background-success-base-hover: var(--dds-ai-color-green-40);
    --dds-ai-color-background-success-base-pressed: var(--dds-ai-color-green-60);
    --dds-ai-color-background-success-base-rest: var(--dds-ai-color-green-50);
    --dds-ai-color-background-surface-inactive: var(--dds-color-gray-30);
    --dds-ai-color-background-surface-primary: var(--dds-ai-color-slate-05);
    --dds-ai-color-background-surface-secondary: var(--dds-ai-color-slate-10);
    --dds-ai-color-background-surface-tertiary: var(--dds-ai-color-slate-20);
    --dds-ai-color-border-error-base: var(--dds-ai-color-red-50);
    --dds-ai-color-border-focus-base-ring1: var(--dds-ai-color-slate-05);
    --dds-ai-color-border-focus-base-ring2: var(--dds-ai-color-purple-40);
    --dds-ai-color-border-focus-neutral: var(--dds-ai-color-slate-60);
    --dds-ai-color-border-focus-neutral-subtle: var(--dds-color-neutral-white);
    --dds-ai-color-border-gradient-base-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-border-gradient-base-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-border-gradient-base-color3: var(--dds-color-blue-50);
    --dds-ai-color-border-gradient-inactive-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-border-gradient-inactive-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-border-gradient-inactive-color3: var(--dds-color-blue-20);
    --dds-ai-color-border-neutral-base: var(--dds-ai-color-slate-20);
    --dds-ai-color-border-neutral-inactive: var(--dds-color-gray-40);
    --dds-ai-color-border-neutral-pale: var(--dds-ai-color-slate-05);
    --dds-ai-color-border-neutral-subtle: var(--dds-ai-color-slate-10);
    --dds-ai-color-border-success-base: var(--dds-ai-color-green-50);
    --dds-ai-color-text-error: var(--dds-ai-color-red-50);
    --dds-ai-color-text-gradient-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-text-gradient-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-text-gradient-color3: var(--dds-color-blue-50);
    --dds-ai-color-text-inactive: var(--dds-color-gray-50);
    --dds-ai-color-text-neutral-hover: var(--dds-ai-color-slate-70);
    --dds-ai-color-text-neutral-pressed: var(--dds-ai-color-slate-80);
    --dds-ai-color-text-neutral-rest: var(--dds-ai-color-slate-60);
    --dds-ai-color-text-neutral-strong-hover: var(--dds-ai-color-slate-90);
    --dds-ai-color-text-neutral-strong-pressed: var(--dds-ai-color-slate-95);
    --dds-ai-color-text-neutral-strong-rest: var(--dds-ai-color-slate-80);
    --dds-ai-color-text-primary: var(--dds-ai-color-slate-80);
    --dds-ai-color-text-secondary: var(--dds-ai-color-slate-60);
    --dds-ai-color-text-success: var(--dds-ai-color-green-50);
    --dds-ai-color-text-tertiary: var(--dds-ai-color-slate-50);
  }
  .dds--dark-mode {
    --dds-color-background-brand-base-hover: var(--dds-color-blue-60);
    --dds-color-background-brand-base-pressed: var(--dds-color-blue-70);
    --dds-color-background-brand-base-rest: var(--dds-color-blue-50);
    --dds-color-background-brand-subtle-hover: var(--dds-color-blue-80);
    --dds-color-background-brand-subtle-pressed: var(--dds-color-blue-70);
    --dds-color-background-brand-subtle-rest: var(--dds-color-blue-90);
    --dds-color-background-error-base-hover: var(--dds-color-red-60);
    --dds-color-background-error-base-pressed: var(--dds-color-red-70);
    --dds-color-background-error-base-rest: var(--dds-color-red-50);
    --dds-color-background-error-subtle-hover: var(--dds-color-red-80);
    --dds-color-background-error-subtle-pressed: var(--dds-color-red-70);
    --dds-color-background-error-subtle-rest: var(--dds-color-red-90);
    --dds-color-background-info-base-hover: var(--dds-color-blue-60);
    --dds-color-background-info-base-pressed: var(--dds-color-blue-70);
    --dds-color-background-info-base-rest: var(--dds-color-blue-50);
    --dds-color-background-info-subtle-hover: var(--dds-color-blue-80);
    --dds-color-background-info-subtle-pressed: var(--dds-color-blue-70);
    --dds-color-background-info-subtle-rest: var(--dds-color-blue-90);
    --dds-color-background-neutral-base-hover: var(--dds-color-slate-40);
    --dds-color-background-neutral-base-pressed: var(--dds-color-slate-45);
    --dds-color-background-neutral-base-rest: var(--dds-color-slate-30);
    --dds-color-background-neutral-ghost-hover: rgba(64, 88, 109, 0.2);
    --dds-color-background-neutral-ghost-pressed: rgba(64, 88, 109, 0.3);
    --dds-color-background-neutral-ghost-rest: transparent;
    --dds-color-background-neutral-subtle-hover: var(--dds-color-slate-50);
    --dds-color-background-neutral-subtle-pressed: var(--dds-color-slate-45);
    --dds-color-background-neutral-subtle-rest: var(--dds-color-slate-60);
    --dds-color-background-success-base-hover: var(--dds-color-green-60);
    --dds-color-background-success-base-pressed: var(--dds-color-green-70);
    --dds-color-background-success-base-rest: var(--dds-color-green-50);
    --dds-color-background-success-subtle-hover: var(--dds-color-green-70);
    --dds-color-background-success-subtle-pressed: var(--dds-color-green-60);
    --dds-color-background-success-subtle-rest: var(--dds-color-green-90);
    --dds-color-background-surface-drop-shadow: rgba(0, 0, 0, 0.08);
    --dds-color-background-surface-inactive: var(--dds-color-gray-90);
    --dds-color-background-surface-inverse: var(--dds-color-neutral-white);
    --dds-color-background-surface-neutral: var(--dds-color-slate-80);
    --dds-color-background-surface-overlay: rgba(14, 14, 14, 0.4);
    --dds-color-background-surface-primary: var(--dds-color-slate-80);
    --dds-color-background-surface-secondary: var(--dds-color-slate-70);
    --dds-color-background-surface-strong: var(--dds-color-slate-40);
    --dds-color-background-surface-tertiary: var(--dds-color-slate-60);
    --dds-color-background-surface-transparent: transparent;
    --dds-color-background-warning-base-hover: var(--dds-color-yellow-60);
    --dds-color-background-warning-base-pressed: var(--dds-color-yellow-70);
    --dds-color-background-warning-base-rest: var(--dds-color-yellow-50);
    --dds-color-background-warning-subtle-hover: var(--dds-color-yellow-80);
    --dds-color-background-warning-subtle-pressed: var(--dds-color-yellow-70);
    --dds-color-background-warning-subtle-rest: var(--dds-color-yellow-90);
    --dds-color-border-brand-base: var(--dds-color-blue-40);
    --dds-color-border-brand-subtle: var(--dds-color-blue-40);
    --dds-color-border-error-base: var(--dds-color-red-50);
    --dds-color-border-error-subtle: var(--dds-color-red-40);
    --dds-color-border-focus-ring1: var(--dds-color-slate-90);
    --dds-color-border-focus-ring2: var(--dds-color-blue-20);
    --dds-color-border-inactive-base: var(--dds-color-gray-60);
    --dds-color-border-inactive-subtle: var(--dds-color-gray-30);
    --dds-color-border-info-base: var(--dds-color-blue-40);
    --dds-color-border-info-subtle: var(--dds-color-blue-40);
    --dds-color-border-neutral-base: var(--dds-color-slate-30);
    --dds-color-border-neutral-pale: var(--dds-color-slate-60);
    --dds-color-border-neutral-subtle: var(--dds-color-slate-40);
    --dds-color-border-success-base: var(--dds-color-green-50);
    --dds-color-border-success-subtle: var(--dds-color-green-40);
    --dds-color-border-warning-base: var(--dds-color-yellow-50);
    --dds-color-border-warning-subtle: var(--dds-color-yellow-50);
    --dds-color-text-brand: var(--dds-color-blue-60);
    --dds-color-text-brand-hover: var(--dds-color-blue-20);
    --dds-color-text-brand-pressed: var(--dds-color-blue-10);
    --dds-color-text-brand-rest: var(--dds-color-blue-30);
    --dds-color-text-error-hover: var(--dds-color-red-20);
    --dds-color-text-error-pressed: var(--dds-color-red-10);
    --dds-color-text-error-rest: var(--dds-color-red-30);
    --dds-color-text-inactive: var(--dds-color-gray-60);
    --dds-color-text-info-hover: var(--dds-color-blue-20);
    --dds-color-text-info-pressed: var(--dds-color-blue-10);
    --dds-color-text-info-rest: var(--dds-color-blue-30);
    --dds-color-text-neutral: var(--dds-color-neutral-black);
    --dds-color-text-neutral-hover: var(--dds-color-slate-20);
    --dds-color-text-neutral-pressed: var(--dds-color-slate-10);
    --dds-color-text-neutral-rest: var(--dds-color-slate-30);
    --dds-color-text-primary: var(--dds-color-slate-10);
    --dds-color-text-secondary: var(--dds-color-slate-20);
    --dds-color-text-success-hover: var(--dds-color-green-20);
    --dds-color-text-success-pressed: var(--dds-color-green-10);
    --dds-color-text-success-rest: var(--dds-color-green-30);
    --dds-color-text-tertiary: var(--dds-color-slate-30);
    --dds-color-text-warning-hover: var(--dds-color-yellow-20);
    --dds-color-text-warning-pressed: var(--dds-color-yellow-10);
    --dds-color-text-warning-rest: var(--dds-color-yellow-30);
    --dds-ai-color-background-error-base-hover: var(--dds-ai-color-red-60);
    --dds-ai-color-background-error-base-pressed: var(--dds-ai-color-red-50);
    --dds-ai-color-background-error-base-rest: var(--dds-ai-color-red-70);
    --dds-ai-color-background-gradient-base-hover-color1: var(--dds-ai-color-berry-40);
    --dds-ai-color-background-gradient-base-hover-color2: var(--dds-ai-color-purple-40);
    --dds-ai-color-background-gradient-base-hover-color3: var(--dds-color-blue-40);
    --dds-ai-color-background-gradient-base-inactive-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-background-gradient-base-inactive-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-background-gradient-base-inactive-color3: var(--dds-color-blue-20);
    --dds-ai-color-background-gradient-base-pressed-color1: var(--dds-ai-color-berry-60);
    --dds-ai-color-background-gradient-base-pressed-color2: var(--dds-ai-color-purple-60);
    --dds-ai-color-background-gradient-base-pressed-color3: var(--dds-color-blue-60);
    --dds-ai-color-background-gradient-base-rest-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-background-gradient-base-rest-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-background-gradient-base-rest-color3: var(--dds-color-blue-50);
    --dds-ai-color-background-gradient-subtle-hover-color1: var(--dds-ai-color-berry-05);
    --dds-ai-color-background-gradient-subtle-hover-color2: var(--dds-ai-color-purple-05);
    --dds-ai-color-background-gradient-subtle-hover-color3: var(--dds-color-blue-10);
    --dds-ai-color-background-gradient-subtle-pressed-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-background-gradient-subtle-pressed-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-background-gradient-subtle-pressed-color3: var(--dds-color-blue-20);
    --dds-ai-color-background-neutral-base-hover: var(--dds-ai-color-slate-60);
    --dds-ai-color-background-neutral-base-pressed: var(--dds-ai-color-slate-70);
    --dds-ai-color-background-neutral-base-rest: var(--dds-ai-color-slate-50);
    --dds-ai-color-background-neutral-ghost-hover: rgba(82, 102, 163, 0.2);
    --dds-ai-color-background-neutral-ghost-pressed: rgba(82, 102, 163, 0.3);
    --dds-ai-color-background-neutral-ghost-rest: transparent;
    --dds-ai-color-background-neutral-subtle-hover: var(--dds-ai-color-slate-80);
    --dds-ai-color-background-neutral-subtle-pressed: var(--dds-ai-color-slate-70);
    --dds-ai-color-background-neutral-subtle-rest: var(--dds-ai-color-slate-90);
    --dds-ai-color-background-success-base-hover: var(--dds-ai-color-green-70);
    --dds-ai-color-background-success-base-pressed: var(--dds-ai-color-green-60);
    --dds-ai-color-background-success-base-rest: var(--dds-ai-color-green-80);
    --dds-ai-color-background-surface-inactive: var(--dds-color-gray-30);
    --dds-ai-color-background-surface-primary: var(--dds-ai-color-slate-90);
    --dds-ai-color-background-surface-secondary: var(--dds-ai-color-slate-80);
    --dds-ai-color-background-surface-tertiary: var(--dds-ai-color-slate-70);
    --dds-ai-color-border-error-base: var(--dds-ai-color-red-50);
    --dds-ai-color-border-focus-base-ring1: var(--dds-ai-color-slate-05);
    --dds-ai-color-border-focus-base-ring2: var(--dds-ai-color-purple-40);
    --dds-ai-color-border-focus-neutral: var(--dds-color-neutral-white);
    --dds-ai-color-border-focus-neutral-subtle: var(--dds-color-neutral-white);
    --dds-ai-color-border-gradient-base-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-border-gradient-base-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-border-gradient-base-color3: var(--dds-color-blue-50);
    --dds-ai-color-border-gradient-inactive-color1: var(--dds-ai-color-berry-20);
    --dds-ai-color-border-gradient-inactive-color2: var(--dds-ai-color-purple-20);
    --dds-ai-color-border-gradient-inactive-color3: var(--dds-color-blue-20);
    --dds-ai-color-border-neutral-base: var(--dds-ai-color-slate-30);
    --dds-ai-color-border-neutral-inactive: var(--dds-color-gray-40);
    --dds-ai-color-border-neutral-pale: var(--dds-ai-color-slate-10);
    --dds-ai-color-border-neutral-subtle: var(--dds-ai-color-slate-20);
    --dds-ai-color-border-success-base: var(--dds-ai-color-green-50);
    --dds-ai-color-text-error: var(--dds-ai-color-red-40);
    --dds-ai-color-text-gradient-color1: var(--dds-ai-color-berry-50);
    --dds-ai-color-text-gradient-color2: var(--dds-ai-color-purple-50);
    --dds-ai-color-text-gradient-color3: var(--dds-color-blue-50);
    --dds-ai-color-text-inactive: var(--dds-color-gray-50);
    --dds-ai-color-text-neutral-hover: var(--dds-ai-color-slate-10);
    --dds-ai-color-text-neutral-pressed: var(--dds-ai-color-slate-30);
    --dds-ai-color-text-neutral-rest: var(--dds-ai-color-slate-05);
    --dds-ai-color-text-neutral-strong-hover: var(--dds-ai-color-slate-20);
    --dds-ai-color-text-neutral-strong-pressed: var(--dds-ai-color-slate-30);
    --dds-ai-color-text-neutral-strong-rest: var(--dds-ai-color-slate-10);
    --dds-ai-color-text-primary: var(--dds-ai-color-slate-05);
    --dds-ai-color-text-secondary: var(--dds-ai-color-slate-10);
    --dds-ai-color-text-success: var(--dds-ai-color-green-30);
    --dds-ai-color-text-tertiary: var(--dds-ai-color-slate-20);
  }
}
/* The font weights match to a particular font. */
/* Each language has specific unicode values. This is to ensure that the correct font is used for the correct language. */
/* Older browsers need woff fonts, the woff2 will take precedence over the woff. */
/*
 The order of the font-face is important.
 If the woff is last for the font-weight Webkit browsers will end up using the woff file over
 the unicode-range version.

 If the woff is first for the font-weight the browser will prefer the unicode-range woff2 version
 over the woff
 */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light.woff") format("woff");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light_l-e.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light_l.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light_c-e.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light_c.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light_g-e.woff2") format("woff2");
  unicode-range: U+1F00-1FFF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light_g.woff2") format("woff2");
  unicode-range: U+0370-03FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Light_v.woff2") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular.woff") format("woff");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular_l-e.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular_l.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular_c-e.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular_c.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular_g-e.woff2") format("woff2");
  unicode-range: U+1F00-1FFF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular_g.woff2") format("woff2");
  unicode-range: U+0370-03FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Regular_v.woff2") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium.woff") format("woff");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium_l-e.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium_l.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium_c-e.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium_c.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium_g-e.woff2") format("woff2");
  unicode-range: U+1F00-1FFF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium_g.woff2") format("woff2");
  unicode-range: U+0370-03FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Medium_v.woff2") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold.woff") format("woff");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold_l-e.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold_l.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold_c-e.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold_c.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold_g-e.woff2") format("woff2");
  unicode-range: U+1F00-1FFF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold_g.woff2") format("woff2");
  unicode-range: U+0370-03FF;
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("//dds.dell.com/fonts/2.137.1/Roboto-Bold_v.woff2") format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
.dds__grid {
  display: grid;
}

.dds__grid--compact {
  gap: var(--dds-grid-gutter-compact-xs);
}
@media (min-width: 768px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-sm);
  }
}
@media (min-width: 1024px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-md);
  }
}
@media (min-width: 1366px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-lg);
  }
}
@media (min-width: 1584px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-xl);
  }
}
@media (min-width: 1920px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-2xl);
  }
}
@media (min-width: 2560px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-3xl);
  }
}
@media (min-width: 3840px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-4xl);
  }
}
@media (min-width: 5120px) {
  .dds__grid--compact {
    gap: var(--dds-grid-gutter-compact-5xl);
  }
}

.dds__grid--regular {
  gap: var(--dds-grid-gutter-regular-xs);
}
@media (min-width: 768px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-sm);
  }
}
@media (min-width: 1024px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-md);
  }
}
@media (min-width: 1366px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-lg);
  }
}
@media (min-width: 1584px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-xl);
  }
}
@media (min-width: 1920px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-2xl);
  }
}
@media (min-width: 2560px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-3xl);
  }
}
@media (min-width: 3840px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-4xl);
  }
}
@media (min-width: 5120px) {
  .dds__grid--regular {
    gap: var(--dds-grid-gutter-regular-5xl);
  }
}

.dds__grid--comfy {
  gap: var(--dds-grid-gutter-comfy-xs);
}
@media (min-width: 768px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-sm);
  }
}
@media (min-width: 1024px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-md);
  }
}
@media (min-width: 1366px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-lg);
  }
}
@media (min-width: 1584px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-xl);
  }
}
@media (min-width: 1920px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-2xl);
  }
}
@media (min-width: 2560px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-3xl);
  }
}
@media (min-width: 3840px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-4xl);
  }
}
@media (min-width: 5120px) {
  .dds__grid--comfy {
    gap: var(--dds-grid-gutter-comfy-5xl);
  }
}

.dds__grid-cols--1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.dds__grid-cols--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dds__grid-cols--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dds__grid-cols--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dds__grid-cols--5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.dds__grid-cols--6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dds__grid-cols--7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.dds__grid-cols--8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.dds__grid-cols--9 {
  grid-template-columns: repeat(9, minmax(0, 1fr));
}

.dds__grid-cols--10 {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}

.dds__grid-cols--11 {
  grid-template-columns: repeat(11, minmax(0, 1fr));
}

.dds__grid-cols--12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.dds__grid-cols--none {
  grid-template-columns: none;
}

.dds__col-span--1 {
  grid-column: span 1/span 1;
}

.dds__col-span--2 {
  grid-column: span 2/span 2;
}

.dds__col-span--3 {
  grid-column: span 3/span 3;
}

.dds__col-span--4 {
  grid-column: span 4/span 4;
}

.dds__col-span--5 {
  grid-column: span 5/span 5;
}

.dds__col-span--6 {
  grid-column: span 6/span 6;
}

.dds__col-span--7 {
  grid-column: span 7/span 7;
}

.dds__col-span--8 {
  grid-column: span 8/span 8;
}

.dds__col-span--9 {
  grid-column: span 9/span 9;
}

.dds__col-span--10 {
  grid-column: span 10/span 10;
}

.dds__col-span--11 {
  grid-column: span 11/span 11;
}

.dds__col-span--12 {
  grid-column: span 12/span 12;
}

.dds__col-span--full {
  grid-column: 1/-1;
}

.dds__col-span--auto {
  grid-column: auto;
}

.dds__col-start--1 {
  grid-column-start: 1;
}

.dds__col-end--1 {
  grid-column-end: 1;
}

.dds__col-start--2 {
  grid-column-start: 2;
}

.dds__col-end--2 {
  grid-column-end: 2;
}

.dds__col-start--3 {
  grid-column-start: 3;
}

.dds__col-end--3 {
  grid-column-end: 3;
}

.dds__col-start--4 {
  grid-column-start: 4;
}

.dds__col-end--4 {
  grid-column-end: 4;
}

.dds__col-start--5 {
  grid-column-start: 5;
}

.dds__col-end--5 {
  grid-column-end: 5;
}

.dds__col-start--6 {
  grid-column-start: 6;
}

.dds__col-end--6 {
  grid-column-end: 6;
}

.dds__col-start--7 {
  grid-column-start: 7;
}

.dds__col-end--7 {
  grid-column-end: 7;
}

.dds__col-start--8 {
  grid-column-start: 8;
}

.dds__col-end--8 {
  grid-column-end: 8;
}

.dds__col-start--9 {
  grid-column-start: 9;
}

.dds__col-end--9 {
  grid-column-end: 9;
}

.dds__col-start--10 {
  grid-column-start: 10;
}

.dds__col-end--10 {
  grid-column-end: 10;
}

.dds__col-start--11 {
  grid-column-start: 11;
}

.dds__col-end--11 {
  grid-column-end: 11;
}

.dds__col-start--12 {
  grid-column-start: 12;
}

.dds__col-end--12 {
  grid-column-end: 12;
}

.dds__col-start--13 {
  grid-column-start: 13;
}

.dds__col-end--13 {
  grid-column-end: 13;
}

.dds__col-start--auto {
  grid-column-start: auto;
}

.dds__col-end--auto {
  grid-column-end: auto;
}

.dds__row-span--1 {
  grid-row: span 1/span 1;
}

.dds__row-span--2 {
  grid-row: span 2/span 2;
}

.dds__row-span--3 {
  grid-row: span 3/span 3;
}

.dds__row-span--4 {
  grid-row: span 4/span 4;
}

.dds__row-span--5 {
  grid-row: span 5/span 5;
}

.dds__row-span--6 {
  grid-row: span 6/span 6;
}

.dds__row-span--full {
  grid-row: 1/-1;
}

.dds__row-span--auto {
  grid-row: auto;
}

@media (min-width: 768px) {
  .sm\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .sm\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .sm\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .sm\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .sm\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .sm\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .sm\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .sm\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .sm\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .sm\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .sm\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .sm\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .sm\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .sm\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .sm\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .sm\:dds__col-span--auto {
    grid-column: auto;
  }
  .sm\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .sm\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .sm\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .sm\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .sm\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .sm\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .sm\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .sm\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .sm\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .sm\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .sm\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .sm\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .sm\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .sm\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .sm\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .sm\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .sm\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .sm\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .sm\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .sm\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .sm\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .sm\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .sm\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .sm\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .sm\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .sm\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .sm\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .sm\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .sm\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .sm\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .sm\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .sm\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .sm\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .sm\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .sm\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .sm\:dds__row-span--auto {
    grid-row: auto;
  }
}
@media (min-width: 1024px) {
  .md\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .md\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .md\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .md\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .md\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .md\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .md\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .md\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .md\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .md\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .md\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .md\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .md\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .md\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .md\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .md\:dds__col-span--auto {
    grid-column: auto;
  }
  .md\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .md\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .md\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .md\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .md\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .md\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .md\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .md\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .md\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .md\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .md\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .md\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .md\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .md\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .md\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .md\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .md\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .md\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .md\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .md\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .md\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .md\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .md\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .md\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .md\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .md\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .md\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .md\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .md\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .md\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .md\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .md\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .md\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .md\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .md\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .md\:dds__row-span--auto {
    grid-row: auto;
  }
}
@media (min-width: 1366px) {
  .lg\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .lg\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .lg\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .lg\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .lg\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .lg\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .lg\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .lg\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .lg\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .lg\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .lg\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .lg\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .lg\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .lg\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .lg\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .lg\:dds__col-span--auto {
    grid-column: auto;
  }
  .lg\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .lg\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .lg\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .lg\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .lg\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .lg\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .lg\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .lg\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .lg\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .lg\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .lg\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .lg\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .lg\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .lg\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .lg\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .lg\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .lg\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .lg\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .lg\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .lg\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .lg\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .lg\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .lg\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .lg\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .lg\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .lg\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .lg\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .lg\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .lg\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .lg\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .lg\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .lg\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .lg\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .lg\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .lg\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .lg\:dds__row-span--auto {
    grid-row: auto;
  }
}
@media (min-width: 1584px) {
  .xl\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .xl\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .xl\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .xl\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .xl\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .xl\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .xl\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .xl\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .xl\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .xl\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .xl\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .xl\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .xl\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .xl\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .xl\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .xl\:dds__col-span--auto {
    grid-column: auto;
  }
  .xl\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .xl\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .xl\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .xl\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .xl\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .xl\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .xl\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .xl\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .xl\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .xl\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .xl\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .xl\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .xl\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .xl\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .xl\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .xl\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .xl\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .xl\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .xl\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .xl\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .xl\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .xl\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .xl\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .xl\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .xl\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .xl\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .xl\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .xl\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .xl\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .xl\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .xl\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .xl\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .xl\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .xl\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .xl\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .xl\:dds__row-span--auto {
    grid-row: auto;
  }
}
@media (min-width: 1920px) {
  .xl2\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .xl2\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .xl2\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .xl2\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .xl2\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .xl2\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .xl2\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .xl2\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .xl2\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .xl2\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .xl2\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .xl2\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .xl2\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .xl2\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .xl2\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .xl2\:dds__col-span--auto {
    grid-column: auto;
  }
  .xl2\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .xl2\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .xl2\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .xl2\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .xl2\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .xl2\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .xl2\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .xl2\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .xl2\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .xl2\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .xl2\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .xl2\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .xl2\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .xl2\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .xl2\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .xl2\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .xl2\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .xl2\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .xl2\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .xl2\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .xl2\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .xl2\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .xl2\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .xl2\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .xl2\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .xl2\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .xl2\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .xl2\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .xl2\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .xl2\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .xl2\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .xl2\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .xl2\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .xl2\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .xl2\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .xl2\:dds__row-span--auto {
    grid-row: auto;
  }
}
@media (min-width: 2560px) {
  .xl3\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .xl3\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .xl3\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .xl3\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .xl3\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .xl3\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .xl3\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .xl3\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .xl3\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .xl3\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .xl3\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .xl3\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .xl3\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .xl3\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .xl3\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .xl3\:dds__col-span--auto {
    grid-column: auto;
  }
  .xl3\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .xl3\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .xl3\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .xl3\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .xl3\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .xl3\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .xl3\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .xl3\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .xl3\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .xl3\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .xl3\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .xl3\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .xl3\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .xl3\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .xl3\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .xl3\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .xl3\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .xl3\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .xl3\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .xl3\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .xl3\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .xl3\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .xl3\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .xl3\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .xl3\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .xl3\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .xl3\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .xl3\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .xl3\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .xl3\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .xl3\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .xl3\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .xl3\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .xl3\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .xl3\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .xl3\:dds__row-span--auto {
    grid-row: auto;
  }
}
@media (min-width: 3840px) {
  .xl4\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .xl4\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .xl4\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .xl4\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .xl4\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .xl4\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .xl4\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .xl4\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .xl4\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .xl4\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .xl4\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .xl4\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .xl4\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .xl4\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .xl4\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .xl4\:dds__col-span--auto {
    grid-column: auto;
  }
  .xl4\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .xl4\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .xl4\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .xl4\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .xl4\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .xl4\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .xl4\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .xl4\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .xl4\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .xl4\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .xl4\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .xl4\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .xl4\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .xl4\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .xl4\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .xl4\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .xl4\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .xl4\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .xl4\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .xl4\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .xl4\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .xl4\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .xl4\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .xl4\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .xl4\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .xl4\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .xl4\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .xl4\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .xl4\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .xl4\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .xl4\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .xl4\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .xl4\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .xl4\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .xl4\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .xl4\:dds__row-span--auto {
    grid-row: auto;
  }
}
@media (min-width: 5120px) {
  .xl5\:dds__grid-cols--1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .xl5\:dds__grid-cols--none {
    grid-template-columns: none;
  }
  .xl5\:dds__col-span--1 {
    grid-column: span 1/span 1;
  }
  .xl5\:dds__col-span--2 {
    grid-column: span 2/span 2;
  }
  .xl5\:dds__col-span--3 {
    grid-column: span 3/span 3;
  }
  .xl5\:dds__col-span--4 {
    grid-column: span 4/span 4;
  }
  .xl5\:dds__col-span--5 {
    grid-column: span 5/span 5;
  }
  .xl5\:dds__col-span--6 {
    grid-column: span 6/span 6;
  }
  .xl5\:dds__col-span--7 {
    grid-column: span 7/span 7;
  }
  .xl5\:dds__col-span--8 {
    grid-column: span 8/span 8;
  }
  .xl5\:dds__col-span--9 {
    grid-column: span 9/span 9;
  }
  .xl5\:dds__col-span--10 {
    grid-column: span 10/span 10;
  }
  .xl5\:dds__col-span--11 {
    grid-column: span 11/span 11;
  }
  .xl5\:dds__col-span--12 {
    grid-column: span 12/span 12;
  }
  .xl5\:dds__col-span--full {
    grid-column: 1/-1;
  }
  .xl5\:dds__col-span--auto {
    grid-column: auto;
  }
  .xl5\:dds__col-start--1 {
    grid-column-start: 1;
  }
  .xl5\:dds__col-end--1 {
    grid-column-end: 1;
  }
  .xl5\:dds__col-start--2 {
    grid-column-start: 2;
  }
  .xl5\:dds__col-end--2 {
    grid-column-end: 2;
  }
  .xl5\:dds__col-start--3 {
    grid-column-start: 3;
  }
  .xl5\:dds__col-end--3 {
    grid-column-end: 3;
  }
  .xl5\:dds__col-start--4 {
    grid-column-start: 4;
  }
  .xl5\:dds__col-end--4 {
    grid-column-end: 4;
  }
  .xl5\:dds__col-start--5 {
    grid-column-start: 5;
  }
  .xl5\:dds__col-end--5 {
    grid-column-end: 5;
  }
  .xl5\:dds__col-start--6 {
    grid-column-start: 6;
  }
  .xl5\:dds__col-end--6 {
    grid-column-end: 6;
  }
  .xl5\:dds__col-start--7 {
    grid-column-start: 7;
  }
  .xl5\:dds__col-end--7 {
    grid-column-end: 7;
  }
  .xl5\:dds__col-start--8 {
    grid-column-start: 8;
  }
  .xl5\:dds__col-end--8 {
    grid-column-end: 8;
  }
  .xl5\:dds__col-start--9 {
    grid-column-start: 9;
  }
  .xl5\:dds__col-end--9 {
    grid-column-end: 9;
  }
  .xl5\:dds__col-start--10 {
    grid-column-start: 10;
  }
  .xl5\:dds__col-end--10 {
    grid-column-end: 10;
  }
  .xl5\:dds__col-start--11 {
    grid-column-start: 11;
  }
  .xl5\:dds__col-end--11 {
    grid-column-end: 11;
  }
  .xl5\:dds__col-start--12 {
    grid-column-start: 12;
  }
  .xl5\:dds__col-end--12 {
    grid-column-end: 12;
  }
  .xl5\:dds__col-start--13 {
    grid-column-start: 13;
  }
  .xl5\:dds__col-end--13 {
    grid-column-end: 13;
  }
  .xl5\:dds__col-start--auto {
    grid-column-start: auto;
  }
  .xl5\:dds__col-end--auto {
    grid-column-end: auto;
  }
  .xl5\:dds__row-span--1 {
    grid-row: span 1/span 1;
  }
  .xl5\:dds__row-span--2 {
    grid-row: span 2/span 2;
  }
  .xl5\:dds__row-span--3 {
    grid-row: span 3/span 3;
  }
  .xl5\:dds__row-span--4 {
    grid-row: span 4/span 4;
  }
  .xl5\:dds__row-span--5 {
    grid-row: span 5/span 5;
  }
  .xl5\:dds__row-span--6 {
    grid-row: span 6/span 6;
  }
  .xl5\:dds__row-span--full {
    grid-row: 1/-1;
  }
  .xl5\:dds__row-span--auto {
    grid-row: auto;
  }
}
.dds__display--1 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-display-1-size-default);
  font-weight: var(--dds-typography-display-1-weight-default);
  line-height: var(--dds-typography-display-1-line-height-default);
}
@media only screen and (min-width: 1366px) {
  .dds__display--1 {
    font-size: var(--dds-typography-display-1-size-compact);
    font-weight: var(--dds-typography-display-1-weight-compact);
    line-height: var(--dds-typography-display-1-line-height-compact);
  }
}

.dds__display--2 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-display-2-size-default);
  font-weight: var(--dds-typography-display-2-weight-default);
  line-height: var(--dds-typography-display-2-line-height-default);
}
@media only screen and (min-width: 1366px) {
  .dds__display--2 {
    font-size: var(--dds-typography-display-2-size-compact);
    font-weight: var(--dds-typography-display-2-weight-compact);
    line-height: var(--dds-typography-display-2-line-height-compact);
  }
}

.dds__display--3 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-display-3-size-default);
  font-weight: var(--dds-typography-display-3-weight-default);
  line-height: var(--dds-typography-display-3-line-height-default);
}
@media only screen and (min-width: 1366px) {
  .dds__display--3 {
    font-size: var(--dds-typography-display-3-size-compact);
    font-weight: var(--dds-typography-display-3-weight-compact);
    line-height: var(--dds-typography-display-3-line-height-compact);
  }
}

.dds__heading--1 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-heading-1-size-default);
  font-weight: var(--dds-typography-heading-1-weight-default);
  line-height: var(--dds-typography-heading-1-line-height-default);
}
@media only screen and (max-width: 1024px) {
  .dds__heading--1 {
    font-size: var(--dds-typography-heading-1-size-compact);
    font-weight: var(--dds-typography-heading-1-weight-compact);
    line-height: var(--dds-typography-heading-1-line-height-compact);
  }
}

.dds__heading--2 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-heading-2-size-default);
  font-weight: var(--dds-typography-heading-2-weight-default);
  line-height: var(--dds-typography-heading-2-line-height-default);
}
@media only screen and (max-width: 1024px) {
  .dds__heading--2 {
    font-size: var(--dds-typography-heading-2-size-compact);
    font-weight: var(--dds-typography-heading-2-weight-compact);
    line-height: var(--dds-typography-heading-2-line-height-compact);
  }
}

.dds__heading--3 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-heading-3-size-default);
  font-weight: var(--dds-typography-heading-3-weight-default);
  line-height: var(--dds-typography-heading-3-line-height-default);
}
@media only screen and (max-width: 1024px) {
  .dds__heading--3 {
    font-size: var(--dds-typography-heading-3-size-compact);
    font-weight: var(--dds-typography-heading-3-weight-compact);
    line-height: var(--dds-typography-heading-3-line-height-compact);
  }
}

.dds__heading--4 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-heading-4-size-default);
  font-weight: var(--dds-typography-heading-4-weight-default);
  line-height: var(--dds-typography-heading-4-line-height-default);
}
@media only screen and (max-width: 1024px) {
  .dds__heading--4 {
    font-size: var(--dds-typography-heading-4-size-compact);
    font-weight: var(--dds-typography-heading-4-weight-compact);
    line-height: var(--dds-typography-heading-4-line-height-compact);
  }
}

.dds__heading--5 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-heading-5-size-default);
  font-weight: var(--dds-typography-heading-5-weight-default);
  line-height: var(--dds-typography-heading-5-line-height-default);
}
@media only screen and (max-width: 1024px) {
  .dds__heading--5 {
    font-size: var(--dds-typography-heading-5-size-compact);
    font-weight: var(--dds-typography-heading-5-weight-compact);
    line-height: var(--dds-typography-heading-5-line-height-compact);
  }
}

.dds__heading--6 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-heading-6-size-default);
  font-weight: var(--dds-typography-heading-6-weight-default);
  line-height: var(--dds-typography-heading-6-line-height-default);
}

.dds__subtitle--1 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-subtitle-1-size);
  font-weight: var(--dds-typography-subtitle-1-weight-default);
  line-height: var(--dds-typography-subtitle-1-line-height);
}

.dds__subtitle--1-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-subtitle-1-size);
  font-weight: var(--dds-typography-subtitle-1-weight-strong);
  line-height: var(--dds-typography-subtitle-1-line-height);
}

.dds__subtitle--2 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-subtitle-2-size);
  font-weight: var(--dds-typography-subtitle-2-weight-default);
  line-height: var(--dds-typography-subtitle-2-line-height);
}

.dds__subtitle--2-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-subtitle-2-size);
  font-weight: var(--dds-typography-subtitle-2-weight-strong);
  line-height: var(--dds-typography-subtitle-2-line-height);
}

.dds__body--1 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-1-size);
  font-weight: var(--dds-typography-body-1-weight-default);
  line-height: var(--dds-typography-body-1-line-height);
}

.dds__body--1-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-1-size);
  font-weight: var(--dds-typography-body-1-weight-strong);
  line-height: var(--dds-typography-body-1-line-height);
}

.dds__body--2 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-2-size);
  font-weight: var(--dds-typography-body-2-weight-default);
  line-height: var(--dds-typography-body-2-line-height);
}

.dds__body--2-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-2-size);
  font-weight: var(--dds-typography-body-2-weight-strong);
  line-height: var(--dds-typography-body-2-line-height);
}

.dds__body--3 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-3-size);
  font-weight: var(--dds-typography-body-3-weight-default);
  line-height: var(--dds-typography-body-3-line-height);
}

.dds__body--3-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-3-size);
  font-weight: var(--dds-typography-body-3-weight-strong);
  line-height: var(--dds-typography-body-3-line-height);
}

.dds__body--4 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-4-size);
  font-weight: var(--dds-typography-body-4-weight-default);
  line-height: var(--dds-typography-body-4-line-height);
}

.dds__body--4-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-4-size);
  font-weight: var(--dds-typography-body-4-weight-strong);
  line-height: var(--dds-typography-body-4-line-height);
}

.dds__body--5 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-5-size);
  font-weight: var(--dds-typography-body-5-weight-default);
  line-height: var(--dds-typography-body-5-line-height);
}

.dds__body--5-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-5-size);
  font-weight: var(--dds-typography-body-5-weight-strong);
  line-height: var(--dds-typography-body-5-line-height);
}

.dds__body--6 {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-6-size);
  font-weight: var(--dds-typography-body-6-weight-default);
  line-height: var(--dds-typography-body-6-line-height);
}

.dds__body--6-strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-body-6-size);
  font-weight: var(--dds-typography-body-6-weight-strong);
  line-height: var(--dds-typography-body-6-line-height);
}

.dds__caption {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-caption-size);
  line-height: var(--dds-typography-caption-line-height);
  font-weight: var(--dds-typography-caption-weight-default);
}

.dds__caption--strong {
  font-family: var(--dds-font-family-base);
  font-size: var(--dds-typography-caption-size);
  line-height: var(--dds-typography-caption-line-height);
  font-weight: var(--dds-typography-caption-weight-strong);
}

@property --dds-ai-gradient-color-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dds-ai-gradient-color-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
@property --dds-ai-gradient-color-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: transparent;
}
.dds__bg--brand-base-hover {
  background: var(--dds-color-background-brand-base-hover);
}

.dds__bg--brand-base-pressed {
  background: var(--dds-color-background-brand-base-pressed);
}

.dds__bg--brand-base-rest {
  background: var(--dds-color-background-brand-base-rest);
}

.dds__bg--brand-subtle-hover {
  background: var(--dds-color-background-brand-subtle-hover);
}

.dds__bg--brand-subtle-pressed {
  background: var(--dds-color-background-brand-subtle-pressed);
}

.dds__bg--brand-subtle-rest {
  background: var(--dds-color-background-brand-subtle-rest);
}

.dds__bg--error-base-hover {
  background: var(--dds-color-background-error-base-hover);
}

.dds__bg--error-base-pressed {
  background: var(--dds-color-background-error-base-pressed);
}

.dds__bg--error-base-rest {
  background: var(--dds-color-background-error-base-rest);
}

.dds__bg--error-subtle-hover {
  background: var(--dds-color-background-error-subtle-hover);
}

.dds__bg--error-subtle-pressed {
  background: var(--dds-color-background-error-subtle-pressed);
}

.dds__bg--error-subtle-rest {
  background: var(--dds-color-background-error-subtle-rest);
}

.dds__bg--info-base-hover {
  background: var(--dds-color-background-info-base-hover);
}

.dds__bg--info-base-pressed {
  background: var(--dds-color-background-info-base-pressed);
}

.dds__bg--info-base-rest {
  background: var(--dds-color-background-info-base-rest);
}

.dds__bg--info-subtle-hover {
  background: var(--dds-color-background-info-subtle-hover);
}

.dds__bg--info-subtle-pressed {
  background: var(--dds-color-background-info-subtle-pressed);
}

.dds__bg--info-subtle-rest {
  background: var(--dds-color-background-info-subtle-rest);
}

.dds__bg--neutral-base-hover {
  background: var(--dds-color-background-neutral-base-hover);
}

.dds__bg--neutral-base-pressed {
  background: var(--dds-color-background-neutral-base-pressed);
}

.dds__bg--neutral-base-rest {
  background: var(--dds-color-background-neutral-base-rest);
}

.dds__bg--neutral-ghost-hover {
  background: var(--dds-color-background-neutral-ghost-hover);
}

.dds__bg--neutral-ghost-pressed {
  background: var(--dds-color-background-neutral-ghost-pressed);
}

.dds__bg--neutral-ghost-rest {
  background: var(--dds-color-background-neutral-ghost-rest);
}

.dds__bg--neutral-subtle-hover {
  background: var(--dds-color-background-neutral-subtle-hover);
}

.dds__bg--neutral-subtle-pressed {
  background: var(--dds-color-background-neutral-subtle-pressed);
}

.dds__bg--neutral-subtle-rest {
  background: var(--dds-color-background-neutral-subtle-rest);
}

.dds__bg--success-base-hover {
  background: var(--dds-color-background-success-base-hover);
}

.dds__bg--success-base-pressed {
  background: var(--dds-color-background-success-base-pressed);
}

.dds__bg--success-base-rest {
  background: var(--dds-color-background-success-base-rest);
}

.dds__bg--success-subtle-hover {
  background: var(--dds-color-background-success-subtle-hover);
}

.dds__bg--success-subtle-pressed {
  background: var(--dds-color-background-success-subtle-pressed);
}

.dds__bg--success-subtle-rest {
  background: var(--dds-color-background-success-subtle-rest);
}

.dds__bg--surface-drop-shadow {
  background: var(--dds-color-background-surface-drop-shadow);
}

.dds__bg--surface-inactive {
  background: var(--dds-color-background-surface-inactive);
}

.dds__bg--surface-inverse {
  background: var(--dds-color-background-surface-inverse);
}

.dds__bg--surface-neutral {
  background: var(--dds-color-background-surface-neutral);
}

.dds__bg--surface-overlay {
  background: var(--dds-color-background-surface-overlay);
}

.dds__bg--surface-primary {
  background: var(--dds-color-background-surface-primary);
}

.dds__bg--surface-secondary {
  background: var(--dds-color-background-surface-secondary);
}

.dds__bg--surface-strong {
  background: var(--dds-color-background-surface-strong);
}

.dds__bg--surface-tertiary {
  background: var(--dds-color-background-surface-tertiary);
}

.dds__bg--surface-transparent {
  background: var(--dds-color-background-surface-transparent);
}

.dds__bg--warning-base-hover {
  background: var(--dds-color-background-warning-base-hover);
}

.dds__bg--warning-base-pressed {
  background: var(--dds-color-background-warning-base-pressed);
}

.dds__bg--warning-base-rest {
  background: var(--dds-color-background-warning-base-rest);
}

.dds__bg--warning-subtle-hover {
  background: var(--dds-color-background-warning-subtle-hover);
}

.dds__bg--warning-subtle-pressed {
  background: var(--dds-color-background-warning-subtle-pressed);
}

.dds__bg--warning-subtle-rest {
  background: var(--dds-color-background-warning-subtle-rest);
}

.dds__ai-bg--surface-inactive {
  background: var(--dds-ai-color-background-surface-inactive);
}

.dds__ai-bg--surface-primary {
  background: var(--dds-ai-color-background-surface-primary);
}

.dds__ai-bg--surface-secondary {
  background: var(--dds-ai-color-background-surface-secondary);
}

.dds__ai-bg--surface-tertiary {
  background: var(--dds-ai-color-background-surface-tertiary);
}

.dds__ai-bg--gradient {
  --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-rest-color1);
  --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-rest-color2);
  --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-rest-color3);
  background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) padding-box;
  transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
}
@media screen and (prefers-reduced-motion: reduce) {
  .dds__ai-bg--gradient {
    transition: none;
  }
}

.dds__radius--2xl {
  border-radius: var(--dds-border-radius-2xl);
}

.dds__radius-t--2xl {
  border-top-left-radius: var(--dds-border-radius-2xl);
  border-top-right-radius: var(--dds-border-radius-2xl);
}

.dds__radius-tl--2xl {
  border-top-left-radius: var(--dds-border-radius-2xl);
}

.dds__radius-tr--2xl {
  border-top-right-radius: var(--dds-border-radius-2xl);
}

.dds__radius-r--2xl {
  border-top-right-radius: var(--dds-border-radius-2xl);
  border-bottom-right-radius: var(--dds-border-radius-2xl);
}

.dds__radius-rt--2xl {
  border-top-right-radius: var(--dds-border-radius-2xl);
}

.dds__radius-rb--2xl {
  border-bottom-right-radius: var(--dds-border-radius-2xl);
}

.dds__radius-b--2xl {
  border-bottom-left-radius: var(--dds-border-radius-2xl);
  border-bottom-right-radius: var(--dds-border-radius-2xl);
}

.dds__radius-br--2xl {
  border-bottom-right-radius: var(--dds-border-radius-2xl);
}

.dds__radius-bl--2xl {
  border-bottom-left-radius: var(--dds-border-radius-2xl);
}

.dds__radius-l--2xl {
  border-top-left-radius: var(--dds-border-radius-2xl);
  border-bottom-left-radius: var(--dds-border-radius-2xl);
}

.dds__radius-lt--2xl {
  border-top-left-radius: var(--dds-border-radius-2xl);
}

.dds__radius-lb--2xl {
  border-bottom-left-radius: var(--dds-border-radius-2xl);
}

.dds__radius--lg {
  border-radius: var(--dds-border-radius-lg);
}

.dds__radius-t--lg {
  border-top-left-radius: var(--dds-border-radius-lg);
  border-top-right-radius: var(--dds-border-radius-lg);
}

.dds__radius-tl--lg {
  border-top-left-radius: var(--dds-border-radius-lg);
}

.dds__radius-tr--lg {
  border-top-right-radius: var(--dds-border-radius-lg);
}

.dds__radius-r--lg {
  border-top-right-radius: var(--dds-border-radius-lg);
  border-bottom-right-radius: var(--dds-border-radius-lg);
}

.dds__radius-rt--lg {
  border-top-right-radius: var(--dds-border-radius-lg);
}

.dds__radius-rb--lg {
  border-bottom-right-radius: var(--dds-border-radius-lg);
}

.dds__radius-b--lg {
  border-bottom-left-radius: var(--dds-border-radius-lg);
  border-bottom-right-radius: var(--dds-border-radius-lg);
}

.dds__radius-br--lg {
  border-bottom-right-radius: var(--dds-border-radius-lg);
}

.dds__radius-bl--lg {
  border-bottom-left-radius: var(--dds-border-radius-lg);
}

.dds__radius-l--lg {
  border-top-left-radius: var(--dds-border-radius-lg);
  border-bottom-left-radius: var(--dds-border-radius-lg);
}

.dds__radius-lt--lg {
  border-top-left-radius: var(--dds-border-radius-lg);
}

.dds__radius-lb--lg {
  border-bottom-left-radius: var(--dds-border-radius-lg);
}

.dds__radius--md {
  border-radius: var(--dds-border-radius-md);
}

.dds__radius-t--md {
  border-top-left-radius: var(--dds-border-radius-md);
  border-top-right-radius: var(--dds-border-radius-md);
}

.dds__radius-tl--md {
  border-top-left-radius: var(--dds-border-radius-md);
}

.dds__radius-tr--md {
  border-top-right-radius: var(--dds-border-radius-md);
}

.dds__radius-r--md {
  border-top-right-radius: var(--dds-border-radius-md);
  border-bottom-right-radius: var(--dds-border-radius-md);
}

.dds__radius-rt--md {
  border-top-right-radius: var(--dds-border-radius-md);
}

.dds__radius-rb--md {
  border-bottom-right-radius: var(--dds-border-radius-md);
}

.dds__radius-b--md {
  border-bottom-left-radius: var(--dds-border-radius-md);
  border-bottom-right-radius: var(--dds-border-radius-md);
}

.dds__radius-br--md {
  border-bottom-right-radius: var(--dds-border-radius-md);
}

.dds__radius-bl--md {
  border-bottom-left-radius: var(--dds-border-radius-md);
}

.dds__radius-l--md {
  border-top-left-radius: var(--dds-border-radius-md);
  border-bottom-left-radius: var(--dds-border-radius-md);
}

.dds__radius-lt--md {
  border-top-left-radius: var(--dds-border-radius-md);
}

.dds__radius-lb--md {
  border-bottom-left-radius: var(--dds-border-radius-md);
}

.dds__radius--rounded {
  border-radius: var(--dds-border-radius-rounded);
}

.dds__radius-t--rounded {
  border-top-left-radius: var(--dds-border-radius-rounded);
  border-top-right-radius: var(--dds-border-radius-rounded);
}

.dds__radius-tl--rounded {
  border-top-left-radius: var(--dds-border-radius-rounded);
}

.dds__radius-tr--rounded {
  border-top-right-radius: var(--dds-border-radius-rounded);
}

.dds__radius-r--rounded {
  border-top-right-radius: var(--dds-border-radius-rounded);
  border-bottom-right-radius: var(--dds-border-radius-rounded);
}

.dds__radius-rt--rounded {
  border-top-right-radius: var(--dds-border-radius-rounded);
}

.dds__radius-rb--rounded {
  border-bottom-right-radius: var(--dds-border-radius-rounded);
}

.dds__radius-b--rounded {
  border-bottom-left-radius: var(--dds-border-radius-rounded);
  border-bottom-right-radius: var(--dds-border-radius-rounded);
}

.dds__radius-br--rounded {
  border-bottom-right-radius: var(--dds-border-radius-rounded);
}

.dds__radius-bl--rounded {
  border-bottom-left-radius: var(--dds-border-radius-rounded);
}

.dds__radius-l--rounded {
  border-top-left-radius: var(--dds-border-radius-rounded);
  border-bottom-left-radius: var(--dds-border-radius-rounded);
}

.dds__radius-lt--rounded {
  border-top-left-radius: var(--dds-border-radius-rounded);
}

.dds__radius-lb--rounded {
  border-bottom-left-radius: var(--dds-border-radius-rounded);
}

.dds__radius--sm {
  border-radius: var(--dds-border-radius-sm);
}

.dds__radius-t--sm {
  border-top-left-radius: var(--dds-border-radius-sm);
  border-top-right-radius: var(--dds-border-radius-sm);
}

.dds__radius-tl--sm {
  border-top-left-radius: var(--dds-border-radius-sm);
}

.dds__radius-tr--sm {
  border-top-right-radius: var(--dds-border-radius-sm);
}

.dds__radius-r--sm {
  border-top-right-radius: var(--dds-border-radius-sm);
  border-bottom-right-radius: var(--dds-border-radius-sm);
}

.dds__radius-rt--sm {
  border-top-right-radius: var(--dds-border-radius-sm);
}

.dds__radius-rb--sm {
  border-bottom-right-radius: var(--dds-border-radius-sm);
}

.dds__radius-b--sm {
  border-bottom-left-radius: var(--dds-border-radius-sm);
  border-bottom-right-radius: var(--dds-border-radius-sm);
}

.dds__radius-br--sm {
  border-bottom-right-radius: var(--dds-border-radius-sm);
}

.dds__radius-bl--sm {
  border-bottom-left-radius: var(--dds-border-radius-sm);
}

.dds__radius-l--sm {
  border-top-left-radius: var(--dds-border-radius-sm);
  border-bottom-left-radius: var(--dds-border-radius-sm);
}

.dds__radius-lt--sm {
  border-top-left-radius: var(--dds-border-radius-sm);
}

.dds__radius-lb--sm {
  border-bottom-left-radius: var(--dds-border-radius-sm);
}

.dds__radius--xl {
  border-radius: var(--dds-border-radius-xl);
}

.dds__radius-t--xl {
  border-top-left-radius: var(--dds-border-radius-xl);
  border-top-right-radius: var(--dds-border-radius-xl);
}

.dds__radius-tl--xl {
  border-top-left-radius: var(--dds-border-radius-xl);
}

.dds__radius-tr--xl {
  border-top-right-radius: var(--dds-border-radius-xl);
}

.dds__radius-r--xl {
  border-top-right-radius: var(--dds-border-radius-xl);
  border-bottom-right-radius: var(--dds-border-radius-xl);
}

.dds__radius-rt--xl {
  border-top-right-radius: var(--dds-border-radius-xl);
}

.dds__radius-rb--xl {
  border-bottom-right-radius: var(--dds-border-radius-xl);
}

.dds__radius-b--xl {
  border-bottom-left-radius: var(--dds-border-radius-xl);
  border-bottom-right-radius: var(--dds-border-radius-xl);
}

.dds__radius-br--xl {
  border-bottom-right-radius: var(--dds-border-radius-xl);
}

.dds__radius-bl--xl {
  border-bottom-left-radius: var(--dds-border-radius-xl);
}

.dds__radius-l--xl {
  border-top-left-radius: var(--dds-border-radius-xl);
  border-bottom-left-radius: var(--dds-border-radius-xl);
}

.dds__radius-lt--xl {
  border-top-left-radius: var(--dds-border-radius-xl);
}

.dds__radius-lb--xl {
  border-bottom-left-radius: var(--dds-border-radius-xl);
}

.dds__radius--xs {
  border-radius: var(--dds-border-radius-xs);
}

.dds__radius-t--xs {
  border-top-left-radius: var(--dds-border-radius-xs);
  border-top-right-radius: var(--dds-border-radius-xs);
}

.dds__radius-tl--xs {
  border-top-left-radius: var(--dds-border-radius-xs);
}

.dds__radius-tr--xs {
  border-top-right-radius: var(--dds-border-radius-xs);
}

.dds__radius-r--xs {
  border-top-right-radius: var(--dds-border-radius-xs);
  border-bottom-right-radius: var(--dds-border-radius-xs);
}

.dds__radius-rt--xs {
  border-top-right-radius: var(--dds-border-radius-xs);
}

.dds__radius-rb--xs {
  border-bottom-right-radius: var(--dds-border-radius-xs);
}

.dds__radius-b--xs {
  border-bottom-left-radius: var(--dds-border-radius-xs);
  border-bottom-right-radius: var(--dds-border-radius-xs);
}

.dds__radius-br--xs {
  border-bottom-right-radius: var(--dds-border-radius-xs);
}

.dds__radius-bl--xs {
  border-bottom-left-radius: var(--dds-border-radius-xs);
}

.dds__radius-l--xs {
  border-top-left-radius: var(--dds-border-radius-xs);
  border-bottom-left-radius: var(--dds-border-radius-xs);
}

.dds__radius-lt--xs {
  border-top-left-radius: var(--dds-border-radius-xs);
}

.dds__radius-lb--xs {
  border-bottom-left-radius: var(--dds-border-radius-xs);
}

.dds__border--lg {
  border-width: var(--dds-border-width-lg);
  border-style: solid;
}

.dds__border-t--lg {
  border-top-width: var(--dds-border-width-lg);
  border-top-style: solid;
}

.dds__border-r--lg {
  border-right-width: var(--dds-border-width-lg);
  border-right-style: solid;
}

.dds__border-b--lg {
  border-bottom-width: var(--dds-border-width-lg);
  border-bottom-style: solid;
}

.dds__border-l--lg {
  border-left-width: var(--dds-border-width-lg);
  border-left-style: solid;
}

.dds__border--sm {
  border-width: var(--dds-border-width-sm);
  border-style: solid;
}

.dds__border-t--sm {
  border-top-width: var(--dds-border-width-sm);
  border-top-style: solid;
}

.dds__border-r--sm {
  border-right-width: var(--dds-border-width-sm);
  border-right-style: solid;
}

.dds__border-b--sm {
  border-bottom-width: var(--dds-border-width-sm);
  border-bottom-style: solid;
}

.dds__border-l--sm {
  border-left-width: var(--dds-border-width-sm);
  border-left-style: solid;
}

.dds__border--xs {
  border-width: var(--dds-border-width-xs);
  border-style: solid;
}

.dds__border-t--xs {
  border-top-width: var(--dds-border-width-xs);
  border-top-style: solid;
}

.dds__border-r--xs {
  border-right-width: var(--dds-border-width-xs);
  border-right-style: solid;
}

.dds__border-b--xs {
  border-bottom-width: var(--dds-border-width-xs);
  border-bottom-style: solid;
}

.dds__border-l--xs {
  border-left-width: var(--dds-border-width-xs);
  border-left-style: solid;
}

.dds__border--none {
  border-width: 0;
  border-style: solid;
}

.dds__border-t--none {
  border-top-width: 0;
  border-top-style: solid;
}

.dds__border-r--none {
  border-right-width: 0;
  border-right-style: solid;
}

.dds__border-b--none {
  border-bottom-width: 0;
  border-bottom-style: solid;
}

.dds__border-l--none {
  border-left-width: 0;
  border-left-style: solid;
}

.dds__border--brand-base {
  border-color: var(--dds-color-border-brand-base);
}

.dds__border-t--brand-base {
  border-top-color: var(--dds-color-border-brand-base);
}

.dds__border-r--brand-base {
  border-right-color: var(--dds-color-border-brand-base);
}

.dds__border-b--brand-base {
  border-bottom-color: var(--dds-color-border-brand-base);
}

.dds__border-l--brand-base {
  border-left-color: var(--dds-color-border-brand-base);
}

.dds__border--brand-subtle {
  border-color: var(--dds-color-border-brand-subtle);
}

.dds__border-t--brand-subtle {
  border-top-color: var(--dds-color-border-brand-subtle);
}

.dds__border-r--brand-subtle {
  border-right-color: var(--dds-color-border-brand-subtle);
}

.dds__border-b--brand-subtle {
  border-bottom-color: var(--dds-color-border-brand-subtle);
}

.dds__border-l--brand-subtle {
  border-left-color: var(--dds-color-border-brand-subtle);
}

.dds__border--error-base {
  border-color: var(--dds-color-border-error-base);
}

.dds__border-t--error-base {
  border-top-color: var(--dds-color-border-error-base);
}

.dds__border-r--error-base {
  border-right-color: var(--dds-color-border-error-base);
}

.dds__border-b--error-base {
  border-bottom-color: var(--dds-color-border-error-base);
}

.dds__border-l--error-base {
  border-left-color: var(--dds-color-border-error-base);
}

.dds__border--error-subtle {
  border-color: var(--dds-color-border-error-subtle);
}

.dds__border-t--error-subtle {
  border-top-color: var(--dds-color-border-error-subtle);
}

.dds__border-r--error-subtle {
  border-right-color: var(--dds-color-border-error-subtle);
}

.dds__border-b--error-subtle {
  border-bottom-color: var(--dds-color-border-error-subtle);
}

.dds__border-l--error-subtle {
  border-left-color: var(--dds-color-border-error-subtle);
}

.dds__border--focus-ring1 {
  border-color: var(--dds-color-border-focus-ring1);
}

.dds__border-t--focus-ring1 {
  border-top-color: var(--dds-color-border-focus-ring1);
}

.dds__border-r--focus-ring1 {
  border-right-color: var(--dds-color-border-focus-ring1);
}

.dds__border-b--focus-ring1 {
  border-bottom-color: var(--dds-color-border-focus-ring1);
}

.dds__border-l--focus-ring1 {
  border-left-color: var(--dds-color-border-focus-ring1);
}

.dds__border--focus-ring2 {
  border-color: var(--dds-color-border-focus-ring2);
}

.dds__border-t--focus-ring2 {
  border-top-color: var(--dds-color-border-focus-ring2);
}

.dds__border-r--focus-ring2 {
  border-right-color: var(--dds-color-border-focus-ring2);
}

.dds__border-b--focus-ring2 {
  border-bottom-color: var(--dds-color-border-focus-ring2);
}

.dds__border-l--focus-ring2 {
  border-left-color: var(--dds-color-border-focus-ring2);
}

.dds__border--inactive-base {
  border-color: var(--dds-color-border-inactive-base);
}

.dds__border-t--inactive-base {
  border-top-color: var(--dds-color-border-inactive-base);
}

.dds__border-r--inactive-base {
  border-right-color: var(--dds-color-border-inactive-base);
}

.dds__border-b--inactive-base {
  border-bottom-color: var(--dds-color-border-inactive-base);
}

.dds__border-l--inactive-base {
  border-left-color: var(--dds-color-border-inactive-base);
}

.dds__border--inactive-subtle {
  border-color: var(--dds-color-border-inactive-subtle);
}

.dds__border-t--inactive-subtle {
  border-top-color: var(--dds-color-border-inactive-subtle);
}

.dds__border-r--inactive-subtle {
  border-right-color: var(--dds-color-border-inactive-subtle);
}

.dds__border-b--inactive-subtle {
  border-bottom-color: var(--dds-color-border-inactive-subtle);
}

.dds__border-l--inactive-subtle {
  border-left-color: var(--dds-color-border-inactive-subtle);
}

.dds__border--info-base {
  border-color: var(--dds-color-border-info-base);
}

.dds__border-t--info-base {
  border-top-color: var(--dds-color-border-info-base);
}

.dds__border-r--info-base {
  border-right-color: var(--dds-color-border-info-base);
}

.dds__border-b--info-base {
  border-bottom-color: var(--dds-color-border-info-base);
}

.dds__border-l--info-base {
  border-left-color: var(--dds-color-border-info-base);
}

.dds__border--info-subtle {
  border-color: var(--dds-color-border-info-subtle);
}

.dds__border-t--info-subtle {
  border-top-color: var(--dds-color-border-info-subtle);
}

.dds__border-r--info-subtle {
  border-right-color: var(--dds-color-border-info-subtle);
}

.dds__border-b--info-subtle {
  border-bottom-color: var(--dds-color-border-info-subtle);
}

.dds__border-l--info-subtle {
  border-left-color: var(--dds-color-border-info-subtle);
}

.dds__border--neutral-base {
  border-color: var(--dds-color-border-neutral-base);
}

.dds__border-t--neutral-base {
  border-top-color: var(--dds-color-border-neutral-base);
}

.dds__border-r--neutral-base {
  border-right-color: var(--dds-color-border-neutral-base);
}

.dds__border-b--neutral-base {
  border-bottom-color: var(--dds-color-border-neutral-base);
}

.dds__border-l--neutral-base {
  border-left-color: var(--dds-color-border-neutral-base);
}

.dds__border--neutral-pale {
  border-color: var(--dds-color-border-neutral-pale);
}

.dds__border-t--neutral-pale {
  border-top-color: var(--dds-color-border-neutral-pale);
}

.dds__border-r--neutral-pale {
  border-right-color: var(--dds-color-border-neutral-pale);
}

.dds__border-b--neutral-pale {
  border-bottom-color: var(--dds-color-border-neutral-pale);
}

.dds__border-l--neutral-pale {
  border-left-color: var(--dds-color-border-neutral-pale);
}

.dds__border--neutral-subtle {
  border-color: var(--dds-color-border-neutral-subtle);
}

.dds__border-t--neutral-subtle {
  border-top-color: var(--dds-color-border-neutral-subtle);
}

.dds__border-r--neutral-subtle {
  border-right-color: var(--dds-color-border-neutral-subtle);
}

.dds__border-b--neutral-subtle {
  border-bottom-color: var(--dds-color-border-neutral-subtle);
}

.dds__border-l--neutral-subtle {
  border-left-color: var(--dds-color-border-neutral-subtle);
}

.dds__border--success-base {
  border-color: var(--dds-color-border-success-base);
}

.dds__border-t--success-base {
  border-top-color: var(--dds-color-border-success-base);
}

.dds__border-r--success-base {
  border-right-color: var(--dds-color-border-success-base);
}

.dds__border-b--success-base {
  border-bottom-color: var(--dds-color-border-success-base);
}

.dds__border-l--success-base {
  border-left-color: var(--dds-color-border-success-base);
}

.dds__border--success-subtle {
  border-color: var(--dds-color-border-success-subtle);
}

.dds__border-t--success-subtle {
  border-top-color: var(--dds-color-border-success-subtle);
}

.dds__border-r--success-subtle {
  border-right-color: var(--dds-color-border-success-subtle);
}

.dds__border-b--success-subtle {
  border-bottom-color: var(--dds-color-border-success-subtle);
}

.dds__border-l--success-subtle {
  border-left-color: var(--dds-color-border-success-subtle);
}

.dds__border--warning-base {
  border-color: var(--dds-color-border-warning-base);
}

.dds__border-t--warning-base {
  border-top-color: var(--dds-color-border-warning-base);
}

.dds__border-r--warning-base {
  border-right-color: var(--dds-color-border-warning-base);
}

.dds__border-b--warning-base {
  border-bottom-color: var(--dds-color-border-warning-base);
}

.dds__border-l--warning-base {
  border-left-color: var(--dds-color-border-warning-base);
}

.dds__border--warning-subtle {
  border-color: var(--dds-color-border-warning-subtle);
}

.dds__border-t--warning-subtle {
  border-top-color: var(--dds-color-border-warning-subtle);
}

.dds__border-r--warning-subtle {
  border-right-color: var(--dds-color-border-warning-subtle);
}

.dds__border-b--warning-subtle {
  border-bottom-color: var(--dds-color-border-warning-subtle);
}

.dds__border-l--warning-subtle {
  border-left-color: var(--dds-color-border-warning-subtle);
}

.dds__ai-border--error-base {
  border-color: var(--dds-ai-color-border-error-base);
}

.dds__ai-border--neutral-base {
  border-color: var(--dds-ai-color-border-neutral-base);
}

.dds__ai-border--neutral-inactive {
  border-color: var(--dds-ai-color-border-neutral-inactive);
}

.dds__ai-border--neutral-pale {
  border-color: var(--dds-ai-color-border-neutral-pale);
}

.dds__ai-border--neutral-subtle {
  border-color: var(--dds-ai-color-border-neutral-subtle);
}

.dds__ai-border--success-base {
  border-color: var(--dds-ai-color-border-success-base);
}

.dds__ai-border--gradient {
  --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-rest-color1);
  --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-rest-color2);
  --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-rest-color3);
  background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
}
@media screen and (prefers-reduced-motion: reduce) {
  .dds__ai-border--gradient {
    transition: none;
  }
}

/*Used for focus state*/
.dds__elevation-left--1 {
  box-shadow: var(--dds-drop-shadow-offset-negative1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-bottom--1 {
  box-shadow: var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-right--1 {
  box-shadow: var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-left--2 {
  box-shadow: var(--dds-drop-shadow-offset-negative2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) 0 var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-bottom--2 {
  box-shadow: var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) 0 var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-right--2 {
  box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) 0 var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-left--3 {
  box-shadow: var(--dds-drop-shadow-offset-negative2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-bottom--3 {
  box-shadow: var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-right--3 {
  box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-left--4 {
  box-shadow: var(--dds-drop-shadow-offset-negative2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-blur-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-negative32) var(--dds-drop-shadow-offset-32) var(--dds-drop-shadow-blur-32) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-bottom--4 {
  box-shadow: var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-blur-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-0) var(--dds-drop-shadow-offset-32) var(--dds-drop-shadow-blur-32) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
}

.dds__elevation-right--4 {
  box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-blur-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-32) var(--dds-drop-shadow-offset-32) var(--dds-drop-shadow-blur-32) 0 var(--dds-color-background-surface-drop-shadow);
}

.dds__m--2xl {
  margin: var(--dds-spacing-2xl);
}

.dds__mt--2xl {
  margin-top: var(--dds-spacing-2xl);
}

.dds__mb--2xl {
  margin-bottom: var(--dds-spacing-2xl);
}

.dds__ml--2xl {
  margin-left: var(--dds-spacing-2xl);
}

.dds__mr--2xl {
  margin-right: var(--dds-spacing-2xl);
}

.dds__mx--2xl {
  margin-inline: var(--dds-spacing-2xl);
}

.dds__my--2xl {
  margin-block: var(--dds-spacing-2xl);
}

.dds__p--2xl {
  padding: var(--dds-spacing-2xl);
}

.dds__pt--2xl {
  padding-top: var(--dds-spacing-2xl);
}

.dds__pb--2xl {
  padding-bottom: var(--dds-spacing-2xl);
}

.dds__pl--2xl {
  padding-left: var(--dds-spacing-2xl);
}

.dds__pr--2xl {
  padding-right: var(--dds-spacing-2xl);
}

.dds__px--2xl {
  padding-inline: var(--dds-spacing-2xl);
}

.dds__py--2xl {
  padding-block: var(--dds-spacing-2xl);
}

.dds__gap--2xl {
  gap: var(--dds-spacing-2xl);
}

.dds__m--3xl {
  margin: var(--dds-spacing-3xl);
}

.dds__mt--3xl {
  margin-top: var(--dds-spacing-3xl);
}

.dds__mb--3xl {
  margin-bottom: var(--dds-spacing-3xl);
}

.dds__ml--3xl {
  margin-left: var(--dds-spacing-3xl);
}

.dds__mr--3xl {
  margin-right: var(--dds-spacing-3xl);
}

.dds__mx--3xl {
  margin-inline: var(--dds-spacing-3xl);
}

.dds__my--3xl {
  margin-block: var(--dds-spacing-3xl);
}

.dds__p--3xl {
  padding: var(--dds-spacing-3xl);
}

.dds__pt--3xl {
  padding-top: var(--dds-spacing-3xl);
}

.dds__pb--3xl {
  padding-bottom: var(--dds-spacing-3xl);
}

.dds__pl--3xl {
  padding-left: var(--dds-spacing-3xl);
}

.dds__pr--3xl {
  padding-right: var(--dds-spacing-3xl);
}

.dds__px--3xl {
  padding-inline: var(--dds-spacing-3xl);
}

.dds__py--3xl {
  padding-block: var(--dds-spacing-3xl);
}

.dds__gap--3xl {
  gap: var(--dds-spacing-3xl);
}

.dds__m--4xl {
  margin: var(--dds-spacing-4xl);
}

.dds__mt--4xl {
  margin-top: var(--dds-spacing-4xl);
}

.dds__mb--4xl {
  margin-bottom: var(--dds-spacing-4xl);
}

.dds__ml--4xl {
  margin-left: var(--dds-spacing-4xl);
}

.dds__mr--4xl {
  margin-right: var(--dds-spacing-4xl);
}

.dds__mx--4xl {
  margin-inline: var(--dds-spacing-4xl);
}

.dds__my--4xl {
  margin-block: var(--dds-spacing-4xl);
}

.dds__p--4xl {
  padding: var(--dds-spacing-4xl);
}

.dds__pt--4xl {
  padding-top: var(--dds-spacing-4xl);
}

.dds__pb--4xl {
  padding-bottom: var(--dds-spacing-4xl);
}

.dds__pl--4xl {
  padding-left: var(--dds-spacing-4xl);
}

.dds__pr--4xl {
  padding-right: var(--dds-spacing-4xl);
}

.dds__px--4xl {
  padding-inline: var(--dds-spacing-4xl);
}

.dds__py--4xl {
  padding-block: var(--dds-spacing-4xl);
}

.dds__gap--4xl {
  gap: var(--dds-spacing-4xl);
}

.dds__m--5xl {
  margin: var(--dds-spacing-5xl);
}

.dds__mt--5xl {
  margin-top: var(--dds-spacing-5xl);
}

.dds__mb--5xl {
  margin-bottom: var(--dds-spacing-5xl);
}

.dds__ml--5xl {
  margin-left: var(--dds-spacing-5xl);
}

.dds__mr--5xl {
  margin-right: var(--dds-spacing-5xl);
}

.dds__mx--5xl {
  margin-inline: var(--dds-spacing-5xl);
}

.dds__my--5xl {
  margin-block: var(--dds-spacing-5xl);
}

.dds__p--5xl {
  padding: var(--dds-spacing-5xl);
}

.dds__pt--5xl {
  padding-top: var(--dds-spacing-5xl);
}

.dds__pb--5xl {
  padding-bottom: var(--dds-spacing-5xl);
}

.dds__pl--5xl {
  padding-left: var(--dds-spacing-5xl);
}

.dds__pr--5xl {
  padding-right: var(--dds-spacing-5xl);
}

.dds__px--5xl {
  padding-inline: var(--dds-spacing-5xl);
}

.dds__py--5xl {
  padding-block: var(--dds-spacing-5xl);
}

.dds__gap--5xl {
  gap: var(--dds-spacing-5xl);
}

.dds__m--6xl {
  margin: var(--dds-spacing-6xl);
}

.dds__mt--6xl {
  margin-top: var(--dds-spacing-6xl);
}

.dds__mb--6xl {
  margin-bottom: var(--dds-spacing-6xl);
}

.dds__ml--6xl {
  margin-left: var(--dds-spacing-6xl);
}

.dds__mr--6xl {
  margin-right: var(--dds-spacing-6xl);
}

.dds__mx--6xl {
  margin-inline: var(--dds-spacing-6xl);
}

.dds__my--6xl {
  margin-block: var(--dds-spacing-6xl);
}

.dds__p--6xl {
  padding: var(--dds-spacing-6xl);
}

.dds__pt--6xl {
  padding-top: var(--dds-spacing-6xl);
}

.dds__pb--6xl {
  padding-bottom: var(--dds-spacing-6xl);
}

.dds__pl--6xl {
  padding-left: var(--dds-spacing-6xl);
}

.dds__pr--6xl {
  padding-right: var(--dds-spacing-6xl);
}

.dds__px--6xl {
  padding-inline: var(--dds-spacing-6xl);
}

.dds__py--6xl {
  padding-block: var(--dds-spacing-6xl);
}

.dds__gap--6xl {
  gap: var(--dds-spacing-6xl);
}

.dds__m--7xl {
  margin: var(--dds-spacing-7xl);
}

.dds__mt--7xl {
  margin-top: var(--dds-spacing-7xl);
}

.dds__mb--7xl {
  margin-bottom: var(--dds-spacing-7xl);
}

.dds__ml--7xl {
  margin-left: var(--dds-spacing-7xl);
}

.dds__mr--7xl {
  margin-right: var(--dds-spacing-7xl);
}

.dds__mx--7xl {
  margin-inline: var(--dds-spacing-7xl);
}

.dds__my--7xl {
  margin-block: var(--dds-spacing-7xl);
}

.dds__p--7xl {
  padding: var(--dds-spacing-7xl);
}

.dds__pt--7xl {
  padding-top: var(--dds-spacing-7xl);
}

.dds__pb--7xl {
  padding-bottom: var(--dds-spacing-7xl);
}

.dds__pl--7xl {
  padding-left: var(--dds-spacing-7xl);
}

.dds__pr--7xl {
  padding-right: var(--dds-spacing-7xl);
}

.dds__px--7xl {
  padding-inline: var(--dds-spacing-7xl);
}

.dds__py--7xl {
  padding-block: var(--dds-spacing-7xl);
}

.dds__gap--7xl {
  gap: var(--dds-spacing-7xl);
}

.dds__m--lg {
  margin: var(--dds-spacing-lg);
}

.dds__mt--lg {
  margin-top: var(--dds-spacing-lg);
}

.dds__mb--lg {
  margin-bottom: var(--dds-spacing-lg);
}

.dds__ml--lg {
  margin-left: var(--dds-spacing-lg);
}

.dds__mr--lg {
  margin-right: var(--dds-spacing-lg);
}

.dds__mx--lg {
  margin-inline: var(--dds-spacing-lg);
}

.dds__my--lg {
  margin-block: var(--dds-spacing-lg);
}

.dds__p--lg {
  padding: var(--dds-spacing-lg);
}

.dds__pt--lg {
  padding-top: var(--dds-spacing-lg);
}

.dds__pb--lg {
  padding-bottom: var(--dds-spacing-lg);
}

.dds__pl--lg {
  padding-left: var(--dds-spacing-lg);
}

.dds__pr--lg {
  padding-right: var(--dds-spacing-lg);
}

.dds__px--lg {
  padding-inline: var(--dds-spacing-lg);
}

.dds__py--lg {
  padding-block: var(--dds-spacing-lg);
}

.dds__gap--lg {
  gap: var(--dds-spacing-lg);
}

.dds__m--md {
  margin: var(--dds-spacing-md);
}

.dds__mt--md {
  margin-top: var(--dds-spacing-md);
}

.dds__mb--md {
  margin-bottom: var(--dds-spacing-md);
}

.dds__ml--md {
  margin-left: var(--dds-spacing-md);
}

.dds__mr--md {
  margin-right: var(--dds-spacing-md);
}

.dds__mx--md {
  margin-inline: var(--dds-spacing-md);
}

.dds__my--md {
  margin-block: var(--dds-spacing-md);
}

.dds__p--md {
  padding: var(--dds-spacing-md);
}

.dds__pt--md {
  padding-top: var(--dds-spacing-md);
}

.dds__pb--md {
  padding-bottom: var(--dds-spacing-md);
}

.dds__pl--md {
  padding-left: var(--dds-spacing-md);
}

.dds__pr--md {
  padding-right: var(--dds-spacing-md);
}

.dds__px--md {
  padding-inline: var(--dds-spacing-md);
}

.dds__py--md {
  padding-block: var(--dds-spacing-md);
}

.dds__gap--md {
  gap: var(--dds-spacing-md);
}

.dds__m--sm {
  margin: var(--dds-spacing-sm);
}

.dds__mt--sm {
  margin-top: var(--dds-spacing-sm);
}

.dds__mb--sm {
  margin-bottom: var(--dds-spacing-sm);
}

.dds__ml--sm {
  margin-left: var(--dds-spacing-sm);
}

.dds__mr--sm {
  margin-right: var(--dds-spacing-sm);
}

.dds__mx--sm {
  margin-inline: var(--dds-spacing-sm);
}

.dds__my--sm {
  margin-block: var(--dds-spacing-sm);
}

.dds__p--sm {
  padding: var(--dds-spacing-sm);
}

.dds__pt--sm {
  padding-top: var(--dds-spacing-sm);
}

.dds__pb--sm {
  padding-bottom: var(--dds-spacing-sm);
}

.dds__pl--sm {
  padding-left: var(--dds-spacing-sm);
}

.dds__pr--sm {
  padding-right: var(--dds-spacing-sm);
}

.dds__px--sm {
  padding-inline: var(--dds-spacing-sm);
}

.dds__py--sm {
  padding-block: var(--dds-spacing-sm);
}

.dds__gap--sm {
  gap: var(--dds-spacing-sm);
}

.dds__m--xl {
  margin: var(--dds-spacing-xl);
}

.dds__mt--xl {
  margin-top: var(--dds-spacing-xl);
}

.dds__mb--xl {
  margin-bottom: var(--dds-spacing-xl);
}

.dds__ml--xl {
  margin-left: var(--dds-spacing-xl);
}

.dds__mr--xl {
  margin-right: var(--dds-spacing-xl);
}

.dds__mx--xl {
  margin-inline: var(--dds-spacing-xl);
}

.dds__my--xl {
  margin-block: var(--dds-spacing-xl);
}

.dds__p--xl {
  padding: var(--dds-spacing-xl);
}

.dds__pt--xl {
  padding-top: var(--dds-spacing-xl);
}

.dds__pb--xl {
  padding-bottom: var(--dds-spacing-xl);
}

.dds__pl--xl {
  padding-left: var(--dds-spacing-xl);
}

.dds__pr--xl {
  padding-right: var(--dds-spacing-xl);
}

.dds__px--xl {
  padding-inline: var(--dds-spacing-xl);
}

.dds__py--xl {
  padding-block: var(--dds-spacing-xl);
}

.dds__gap--xl {
  gap: var(--dds-spacing-xl);
}

.dds__m--xs {
  margin: var(--dds-spacing-xs);
}

.dds__mt--xs {
  margin-top: var(--dds-spacing-xs);
}

.dds__mb--xs {
  margin-bottom: var(--dds-spacing-xs);
}

.dds__ml--xs {
  margin-left: var(--dds-spacing-xs);
}

.dds__mr--xs {
  margin-right: var(--dds-spacing-xs);
}

.dds__mx--xs {
  margin-inline: var(--dds-spacing-xs);
}

.dds__my--xs {
  margin-block: var(--dds-spacing-xs);
}

.dds__p--xs {
  padding: var(--dds-spacing-xs);
}

.dds__pt--xs {
  padding-top: var(--dds-spacing-xs);
}

.dds__pb--xs {
  padding-bottom: var(--dds-spacing-xs);
}

.dds__pl--xs {
  padding-left: var(--dds-spacing-xs);
}

.dds__pr--xs {
  padding-right: var(--dds-spacing-xs);
}

.dds__px--xs {
  padding-inline: var(--dds-spacing-xs);
}

.dds__py--xs {
  padding-block: var(--dds-spacing-xs);
}

.dds__gap--xs {
  gap: var(--dds-spacing-xs);
}

.dds__m--none {
  margin: 0;
}

.dds__mt--none {
  margin-top: 0;
}

.dds__mb--none {
  margin-bottom: 0;
}

.dds__ml--none {
  margin-left: 0;
}

.dds__mr--none {
  margin-right: 0;
}

.dds__mx--none {
  margin-inline: 0;
}

.dds__my--none {
  margin-block: 0;
}

.dds__p--none {
  padding: 0;
}

.dds__pt--none {
  padding-top: 0;
}

.dds__pb--none {
  padding-bottom: 0;
}

.dds__pl--none {
  padding-left: 0;
}

.dds__pr--none {
  padding-right: 0;
}

.dds__px--none {
  padding-inline: 0;
}

.dds__py--none {
  padding-block: 0;
}

.dds__gap--none {
  gap: 0;
}

.dds__color--brand {
  color: var(--dds-color-text-brand);
}

.dds__color--brand-hover {
  color: var(--dds-color-text-brand-hover);
}

.dds__color--brand-pressed {
  color: var(--dds-color-text-brand-pressed);
}

.dds__color--brand-rest {
  color: var(--dds-color-text-brand-rest);
}

.dds__color--error-hover {
  color: var(--dds-color-text-error-hover);
}

.dds__color--error-pressed {
  color: var(--dds-color-text-error-pressed);
}

.dds__color--error-rest {
  color: var(--dds-color-text-error-rest);
}

.dds__color--inactive {
  color: var(--dds-color-text-inactive);
}

.dds__color--info-hover {
  color: var(--dds-color-text-info-hover);
}

.dds__color--info-pressed {
  color: var(--dds-color-text-info-pressed);
}

.dds__color--info-rest {
  color: var(--dds-color-text-info-rest);
}

.dds__color--neutral {
  color: var(--dds-color-text-neutral);
}

.dds__color--neutral-hover {
  color: var(--dds-color-text-neutral-hover);
}

.dds__color--neutral-pressed {
  color: var(--dds-color-text-neutral-pressed);
}

.dds__color--neutral-rest {
  color: var(--dds-color-text-neutral-rest);
}

.dds__color--primary {
  color: var(--dds-color-text-primary);
}

.dds__color--secondary {
  color: var(--dds-color-text-secondary);
}

.dds__color--success-hover {
  color: var(--dds-color-text-success-hover);
}

.dds__color--success-pressed {
  color: var(--dds-color-text-success-pressed);
}

.dds__color--success-rest {
  color: var(--dds-color-text-success-rest);
}

.dds__color--tertiary {
  color: var(--dds-color-text-tertiary);
}

.dds__color--warning-hover {
  color: var(--dds-color-text-warning-hover);
}

.dds__color--warning-pressed {
  color: var(--dds-color-text-warning-pressed);
}

.dds__color--warning-rest {
  color: var(--dds-color-text-warning-rest);
}

.dds__ai-color--error {
  color: var(--dds-ai-color-text-error);
}

.dds__ai-color--inactive {
  color: var(--dds-ai-color-text-inactive);
}

.dds__ai-color--neutral-hover {
  color: var(--dds-ai-color-text-neutral-hover);
}

.dds__ai-color--neutral-pressed {
  color: var(--dds-ai-color-text-neutral-pressed);
}

.dds__ai-color--neutral-rest {
  color: var(--dds-ai-color-text-neutral-rest);
}

.dds__ai-color--neutral-strong-hover {
  color: var(--dds-ai-color-text-neutral-strong-hover);
}

.dds__ai-color--neutral-strong-pressed {
  color: var(--dds-ai-color-text-neutral-strong-pressed);
}

.dds__ai-color--neutral-strong-rest {
  color: var(--dds-ai-color-text-neutral-strong-rest);
}

.dds__ai-color--primary {
  color: var(--dds-ai-color-text-primary);
}

.dds__ai-color--secondary {
  color: var(--dds-ai-color-text-secondary);
}

.dds__ai-color--success {
  color: var(--dds-ai-color-text-success);
}

.dds__ai-color--tertiary {
  color: var(--dds-ai-color-text-tertiary);
}

.dds__ai-color--gradient {
  --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-rest-color1);
  --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-rest-color2);
  --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-rest-color3);
  background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3));
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
}
@media screen and (prefers-reduced-motion: reduce) {
  .dds__ai-color--gradient {
    transition: none;
  }
}

.dds__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.dds__sr-wrapper {
  position: relative;
}

@layer component {
  :root,
  :host {
    --dds-accordion-contentbox-gap: var(--dds-size-16);
    --dds-accordion-contentbox-padding-horizontal: var(--dds-size-24);
    --dds-accordion-contentbox-padding-vertical: var(--dds-size-16);
    --dds-accordion-gap: var(--dds-size-8);
    --dds-accordion-motion-duration: 300ms;
    --dds-accordion-motion-easing: ease-out;
    --dds-accordion-nested-padding-horizontal: var(--dds-size-16);
    --dds-accordion-nested-padding-vertical: var(--dds-size-8);
    --dds-accordion-padding-left: var(--dds-size-12);
    --dds-accordion-padding-right: var(--dds-size-24);
    --dds-accordion-padding-vertical: var(--dds-size-12);
  }
  :root,
  :host {
    --dds-button-gap-lg: var(--dds-size-8);
    --dds-button-gap-md: var(--dds-size-8);
    --dds-button-gap-sm: var(--dds-size-4);
    --dds-button-gap-xs: var(--dds-size-4);
    --dds-button-motion-duration: 300ms;
    --dds-button-motion-easing: ease-out;
    --dds-button-padding-horizontal-lg: var(--dds-size-16);
    --dds-button-padding-horizontal-md: var(--dds-size-16);
    --dds-button-padding-horizontal-sm: var(--dds-size-8);
    --dds-button-padding-horizontal-xs: var(--dds-size-8);
    --dds-button-size-lg: var(--dds-size-48);
    --dds-button-size-md: var(--dds-size-40);
    --dds-button-size-sm: var(--dds-size-32);
    --dds-button-size-xs: var(--dds-size-24);
  }
  :root,
  :host {
    --dds-button-background-ghost-hover: rgba(64, 88, 109, 0.1);
    --dds-button-background-ghost-pressed: rgba(64, 88, 109, 0.2);
    --dds-button-background-ghost-rest: transparent;
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-button-background-ghost-hover: rgba(64, 88, 109, 0.1);
      --dds-button-background-ghost-pressed: rgba(64, 88, 109, 0.2);
      --dds-button-background-ghost-rest: transparent;
    }
  }
  .dds--light-mode {
    --dds-button-background-ghost-hover: rgba(64, 88, 109, 0.1);
    --dds-button-background-ghost-pressed: rgba(64, 88, 109, 0.2);
    --dds-button-background-ghost-rest: transparent;
  }
  .dds--dark-mode {
    --dds-button-background-ghost-hover: rgba(64, 88, 109, 0.1);
    --dds-button-background-ghost-pressed: rgba(64, 88, 109, 0.2);
    --dds-button-background-ghost-rest: transparent;
  }
  :root,
  :host {
    --dds-icon-size-2xl: var(--dds-size-48);
    --dds-icon-size-2xs: var(--dds-size-12);
    --dds-icon-size-lg: var(--dds-size-32);
    --dds-icon-size-md: var(--dds-size-24);
    --dds-icon-size-sm: var(--dds-size-20);
    --dds-icon-size-xl: var(--dds-size-40);
    --dds-icon-size-xs: var(--dds-size-16);
  }
  :root,
  :host {
    --dds-ai-button-border: var(--dds-border-width-sm);
    --dds-ai-button-border-neutral-outline: var(--dds-border-width-sm);
    --dds-ai-button-border-neutral-strong-outline: var(--dds-border-width-sm);
    --dds-ai-button-border-neutral-subtle-outline: var(--dds-border-width-sm);
    --dds-ai-button-motion-duration: 300;
    --dds-ai-button-motion-easing: ease-out;
    --dds-ai-card-border: var(--dds-border-width-sm);
    --dds-ai-card-border-radius: var(--dds-border-radius-xl);
    --dds-ai-card-clickable-motion-duration: 300ms;
    --dds-ai-card-clickable-motion-easing: ease-out;
    --dds-ai-card-padding-lg: var(--dds-size-24);
    --dds-ai-card-padding-md: var(--dds-size-20);
    --dds-ai-toggle-button-border: var(--dds-border-width-sm);
    --dds-ai-toggle-button-motion-duration: 300;
    --dds-ai-toggle-button-motion-easing: ease-out;
  }
  :root,
  :host {
    --dds-ai-button-color-background-gradient-outline-inactive: var(--dds-color-neutral-white-opacity-15);
    --dds-ai-button-color-background-gradient-outline-rest: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-filled-hover: var(--dds-ai-color-slate-40);
    --dds-ai-button-color-background-neutral-filled-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-button-color-background-neutral-filled-rest: var(--dds-ai-color-slate-50);
    --dds-ai-button-color-background-neutral-ghost-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-ghost-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-outline-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-strong-filled-hover: var(--dds-ai-color-slate-70);
    --dds-ai-button-color-background-neutral-strong-filled-pressed: var(--dds-ai-color-slate-90);
    --dds-ai-button-color-background-neutral-strong-filled-rest: var(--dds-ai-color-slate-80);
    --dds-ai-button-color-background-neutral-strong-ghost-hover: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-strong-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
    --dds-ai-button-color-background-neutral-strong-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-strong-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-subtle-filled-hover: var(--dds-color-neutral-white);
    --dds-ai-button-color-background-neutral-subtle-filled-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-subtle-filled-rest: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-subtle-ghost-hover: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-subtle-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
    --dds-ai-button-color-background-neutral-subtle-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-subtle-outline-hover: var(--dds-ai-color-slate-70);
    --dds-ai-button-color-background-neutral-subtle-outline-pressed: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-background-neutral-subtle-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-border-neutral-outline: var(--dds-ai-color-slate-40);
    --dds-ai-button-color-border-neutral-strong-outline: var(--dds-ai-color-slate-90);
    --dds-ai-button-color-border-neutral-subtle-outline: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-gradient-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-gradient-outline: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-ghost: var(--dds-ai-color-slate-50);
    --dds-ai-button-color-text-neutral-outline: var(--dds-ai-color-slate-50);
    --dds-ai-button-color-text-neutral-strong-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-strong-ghost: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-strong-outline: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-subtle-filled: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-subtle-ghost: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-subtle-outline: var(--dds-color-neutral-white);
    --dds-ai-card-clickable-color-background-hover: var(--dds-ai-color-background-neutral-ghost-hover);
    --dds-ai-card-clickable-color-background-inactive: var(--dds-ai-color-background-surface-inactive);
    --dds-ai-card-clickable-color-background-pressed: var(--dds-ai-color-background-neutral-ghost-pressed);
    --dds-ai-card-clickable-color-background-rest: var(--dds-ai-color-background-neutral-ghost-rest);
    --dds-ai-card-color-background-light: var(--dds-color-neutral-white);
    --dds-ai-card-color-background-neutral: rgba(209, 217, 240, 0.5);
    --dds-ai-card-color-border-inactive: var(--dds-color-gray-60);
    --dds-ai-card-color-border-light: var(--dds-ai-color-slate-10);
    --dds-ai-card-color-border-neutral: var(--dds-ai-color-slate-10);
    --dds-ai-toggle-button-color-background-neutral-outline-selected-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-toggle-button-color-background-neutral-selected-hover: var(--dds-ai-color-slate-50);
    --dds-ai-toggle-button-color-background-neutral-selected-rest: var(--dds-ai-color-slate-40);
    --dds-ai-toggle-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-hover: var(--dds-ai-color-slate-80);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-pressed: var(--dds-ai-color-slate-70);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-rest: var(--dds-ai-color-slate-90);
    --dds-ai-toggle-button-color-background-neutral-strong-unselected-rest: var(--dds-color-transparent);
    --dds-ai-toggle-button-color-background-neutral-unselected-hover: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-unselected-pressed: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-unselected-rest: var(--dds-color-transparent);
    --dds-ai-toggle-button-color-border-neutral: var(--dds-ai-color-slate-40);
    --dds-ai-toggle-button-color-border-neutral-strong: var(--dds-ai-color-slate-90);
    --dds-ai-toggle-button-color-text-neutral-selected: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-text-neutral-strong-selected: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-text-neutral-strong-unselected: var(--dds-ai-color-slate-95);
    --dds-ai-toggle-button-color-text-neutral-unselected: var(--dds-ai-color-slate-50);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-ai-button-color-background-gradient-outline-inactive: var(--dds-color-neutral-white-opacity-15);
      --dds-ai-button-color-background-gradient-outline-rest: var(--dds-color-transparent);
      --dds-ai-button-color-background-neutral-filled-hover: var(--dds-ai-color-slate-40);
      --dds-ai-button-color-background-neutral-filled-pressed: var(--dds-ai-color-slate-60);
      --dds-ai-button-color-background-neutral-filled-rest: var(--dds-ai-color-slate-50);
      --dds-ai-button-color-background-neutral-ghost-hover: var(--dds-ai-color-slate-10);
      --dds-ai-button-color-background-neutral-ghost-pressed: var(--dds-ai-color-slate-10);
      --dds-ai-button-color-background-neutral-ghost-rest: var(--dds-color-transparent);
      --dds-ai-button-color-background-neutral-outline-hover: var(--dds-ai-color-slate-05);
      --dds-ai-button-color-background-neutral-outline-pressed: var(--dds-ai-color-slate-10);
      --dds-ai-button-color-background-neutral-outline-rest: var(--dds-color-transparent);
      --dds-ai-button-color-background-neutral-strong-filled-hover: var(--dds-ai-color-slate-70);
      --dds-ai-button-color-background-neutral-strong-filled-pressed: var(--dds-ai-color-slate-90);
      --dds-ai-button-color-background-neutral-strong-filled-rest: var(--dds-ai-color-slate-80);
      --dds-ai-button-color-background-neutral-strong-ghost-hover: var(--dds-color-neutral-white-opacity-50);
      --dds-ai-button-color-background-neutral-strong-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
      --dds-ai-button-color-background-neutral-strong-ghost-rest: var(--dds-color-transparent);
      --dds-ai-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
      --dds-ai-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-10);
      --dds-ai-button-color-background-neutral-strong-outline-rest: var(--dds-color-transparent);
      --dds-ai-button-color-background-neutral-subtle-filled-hover: var(--dds-color-neutral-white);
      --dds-ai-button-color-background-neutral-subtle-filled-pressed: var(--dds-color-slate-10);
      --dds-ai-button-color-background-neutral-subtle-filled-rest: var(--dds-ai-color-slate-05);
      --dds-ai-button-color-background-neutral-subtle-ghost-hover: var(--dds-color-neutral-white-opacity-50);
      --dds-ai-button-color-background-neutral-subtle-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
      --dds-ai-button-color-background-neutral-subtle-ghost-rest: var(--dds-color-transparent);
      --dds-ai-button-color-background-neutral-subtle-outline-hover: var(--dds-ai-color-slate-70);
      --dds-ai-button-color-background-neutral-subtle-outline-pressed: var(--dds-color-slate-90);
      --dds-ai-button-color-background-neutral-subtle-outline-rest: var(--dds-color-transparent);
      --dds-ai-button-color-border-neutral-outline: var(--dds-ai-color-slate-40);
      --dds-ai-button-color-border-neutral-strong-outline: var(--dds-ai-color-slate-90);
      --dds-ai-button-color-border-neutral-subtle-outline: var(--dds-color-neutral-white);
      --dds-ai-button-color-text-gradient-filled: var(--dds-color-neutral-white);
      --dds-ai-button-color-text-gradient-outline: var(--dds-ai-color-slate-05);
      --dds-ai-button-color-text-neutral-filled: var(--dds-color-neutral-white);
      --dds-ai-button-color-text-neutral-ghost: var(--dds-ai-color-slate-10);
      --dds-ai-button-color-text-neutral-outline: var(--dds-ai-color-slate-10);
      --dds-ai-button-color-text-neutral-strong-filled: var(--dds-color-neutral-white);
      --dds-ai-button-color-text-neutral-strong-ghost: var(--dds-ai-color-slate-05);
      --dds-ai-button-color-text-neutral-strong-outline: var(--dds-ai-color-slate-05);
      --dds-ai-button-color-text-neutral-subtle-filled: var(--dds-ai-color-slate-95);
      --dds-ai-button-color-text-neutral-subtle-ghost: var(--dds-color-neutral-white);
      --dds-ai-button-color-text-neutral-subtle-outline: var(--dds-color-neutral-white);
      --dds-ai-card-clickable-color-background-hover: var(--dds-ai-color-background-neutral-ghost-hover);
      --dds-ai-card-clickable-color-background-inactive: var(--dds-ai-color-background-surface-inactive);
      --dds-ai-card-clickable-color-background-pressed: var(--dds-ai-color-background-neutral-ghost-pressed);
      --dds-ai-card-clickable-color-background-rest: var(--dds-ai-color-background-neutral-ghost-rest);
      --dds-ai-card-color-background-light: var(--dds-ai-color-slate-80);
      --dds-ai-card-color-background-neutral: var(--dds-ai-color-slate-70);
      --dds-ai-card-color-border-inactive: var(--dds-color-gray-60);
      --dds-ai-card-color-border-light: var(--dds-ai-color-slate-40);
      --dds-ai-card-color-border-neutral: var(--dds-ai-color-slate-40);
      --dds-ai-toggle-button-color-background-neutral-outline-selected-pressed: var(--dds-ai-color-slate-60);
      --dds-ai-toggle-button-color-background-neutral-selected-hover: var(--dds-ai-color-slate-50);
      --dds-ai-toggle-button-color-background-neutral-selected-rest: var(--dds-ai-color-slate-40);
      --dds-ai-toggle-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
      --dds-ai-toggle-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-05);
      --dds-ai-toggle-button-color-background-neutral-strong-selected-hover: var(--dds-ai-color-slate-80);
      --dds-ai-toggle-button-color-background-neutral-strong-selected-pressed: var(--dds-ai-color-slate-70);
      --dds-ai-toggle-button-color-background-neutral-strong-selected-rest: var(--dds-ai-color-slate-90);
      --dds-ai-toggle-button-color-background-neutral-strong-unselected-rest: var(--dds-color-transparent);
      --dds-ai-toggle-button-color-background-neutral-unselected-hover: var(--dds-ai-color-slate-05);
      --dds-ai-toggle-button-color-background-neutral-unselected-pressed: var(--dds-ai-color-slate-05);
      --dds-ai-toggle-button-color-background-neutral-unselected-rest: var(--dds-color-transparent);
      --dds-ai-toggle-button-color-border-neutral: var(--dds-ai-color-slate-40);
      --dds-ai-toggle-button-color-border-neutral-strong: var(--dds-ai-color-slate-90);
      --dds-ai-toggle-button-color-text-neutral-selected: var(--dds-ai-color-slate-05);
      --dds-ai-toggle-button-color-text-neutral-strong-selected: var(--dds-ai-color-slate-05);
      --dds-ai-toggle-button-color-text-neutral-strong-unselected: var(--dds-ai-color-slate-95);
      --dds-ai-toggle-button-color-text-neutral-unselected: var(--dds-ai-color-slate-50);
    }
  }
  .dds--light-mode {
    --dds-ai-button-color-background-gradient-outline-inactive: var(--dds-color-neutral-white-opacity-15);
    --dds-ai-button-color-background-gradient-outline-rest: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-filled-hover: var(--dds-ai-color-slate-40);
    --dds-ai-button-color-background-neutral-filled-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-button-color-background-neutral-filled-rest: var(--dds-ai-color-slate-50);
    --dds-ai-button-color-background-neutral-ghost-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-ghost-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-outline-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-strong-filled-hover: var(--dds-ai-color-slate-70);
    --dds-ai-button-color-background-neutral-strong-filled-pressed: var(--dds-ai-color-slate-90);
    --dds-ai-button-color-background-neutral-strong-filled-rest: var(--dds-ai-color-slate-80);
    --dds-ai-button-color-background-neutral-strong-ghost-hover: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-strong-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
    --dds-ai-button-color-background-neutral-strong-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-strong-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-subtle-filled-hover: var(--dds-color-neutral-white);
    --dds-ai-button-color-background-neutral-subtle-filled-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-subtle-filled-rest: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-subtle-ghost-hover: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-subtle-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
    --dds-ai-button-color-background-neutral-subtle-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-subtle-outline-hover: var(--dds-ai-color-slate-70);
    --dds-ai-button-color-background-neutral-subtle-outline-pressed: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-background-neutral-subtle-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-border-neutral-outline: var(--dds-ai-color-slate-40);
    --dds-ai-button-color-border-neutral-strong-outline: var(--dds-ai-color-slate-90);
    --dds-ai-button-color-border-neutral-subtle-outline: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-gradient-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-gradient-outline: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-ghost: var(--dds-ai-color-slate-50);
    --dds-ai-button-color-text-neutral-outline: var(--dds-ai-color-slate-50);
    --dds-ai-button-color-text-neutral-strong-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-strong-ghost: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-strong-outline: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-subtle-filled: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-subtle-ghost: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-subtle-outline: var(--dds-color-neutral-white);
    --dds-ai-card-clickable-color-background-hover: var(--dds-ai-color-background-neutral-ghost-hover);
    --dds-ai-card-clickable-color-background-inactive: var(--dds-ai-color-background-surface-inactive);
    --dds-ai-card-clickable-color-background-pressed: var(--dds-ai-color-background-neutral-ghost-pressed);
    --dds-ai-card-clickable-color-background-rest: var(--dds-ai-color-background-neutral-ghost-rest);
    --dds-ai-card-color-background-light: var(--dds-color-neutral-white);
    --dds-ai-card-color-background-neutral: rgba(209, 217, 240, 0.5);
    --dds-ai-card-color-border-inactive: var(--dds-color-gray-60);
    --dds-ai-card-color-border-light: var(--dds-ai-color-slate-10);
    --dds-ai-card-color-border-neutral: var(--dds-ai-color-slate-10);
    --dds-ai-toggle-button-color-background-neutral-outline-selected-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-toggle-button-color-background-neutral-selected-hover: var(--dds-ai-color-slate-50);
    --dds-ai-toggle-button-color-background-neutral-selected-rest: var(--dds-ai-color-slate-40);
    --dds-ai-toggle-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-hover: var(--dds-ai-color-slate-80);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-pressed: var(--dds-ai-color-slate-70);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-rest: var(--dds-ai-color-slate-90);
    --dds-ai-toggle-button-color-background-neutral-strong-unselected-rest: var(--dds-color-transparent);
    --dds-ai-toggle-button-color-background-neutral-unselected-hover: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-unselected-pressed: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-unselected-rest: var(--dds-color-transparent);
    --dds-ai-toggle-button-color-border-neutral: var(--dds-ai-color-slate-40);
    --dds-ai-toggle-button-color-border-neutral-strong: var(--dds-ai-color-slate-90);
    --dds-ai-toggle-button-color-text-neutral-selected: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-text-neutral-strong-selected: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-text-neutral-strong-unselected: var(--dds-ai-color-slate-95);
    --dds-ai-toggle-button-color-text-neutral-unselected: var(--dds-ai-color-slate-50);
  }
  .dds--dark-mode {
    --dds-ai-button-color-background-gradient-outline-inactive: var(--dds-color-neutral-white-opacity-15);
    --dds-ai-button-color-background-gradient-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-filled-hover: var(--dds-ai-color-slate-40);
    --dds-ai-button-color-background-neutral-filled-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-button-color-background-neutral-filled-rest: var(--dds-ai-color-slate-50);
    --dds-ai-button-color-background-neutral-ghost-hover: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-ghost-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-outline-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-strong-filled-hover: var(--dds-ai-color-slate-70);
    --dds-ai-button-color-background-neutral-strong-filled-pressed: var(--dds-ai-color-slate-90);
    --dds-ai-button-color-background-neutral-strong-filled-rest: var(--dds-ai-color-slate-80);
    --dds-ai-button-color-background-neutral-strong-ghost-hover: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-strong-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
    --dds-ai-button-color-background-neutral-strong-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-background-neutral-strong-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-subtle-filled-hover: var(--dds-color-neutral-white);
    --dds-ai-button-color-background-neutral-subtle-filled-pressed: var(--dds-color-slate-10);
    --dds-ai-button-color-background-neutral-subtle-filled-rest: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-background-neutral-subtle-ghost-hover: var(--dds-color-neutral-white-opacity-50);
    --dds-ai-button-color-background-neutral-subtle-ghost-pressed: var(--dds-color-neutral-black-opacity-15);
    --dds-ai-button-color-background-neutral-subtle-ghost-rest: var(--dds-color-transparent);
    --dds-ai-button-color-background-neutral-subtle-outline-hover: var(--dds-ai-color-slate-70);
    --dds-ai-button-color-background-neutral-subtle-outline-pressed: var(--dds-color-slate-90);
    --dds-ai-button-color-background-neutral-subtle-outline-rest: var(--dds-color-transparent);
    --dds-ai-button-color-border-neutral-outline: var(--dds-ai-color-slate-40);
    --dds-ai-button-color-border-neutral-strong-outline: var(--dds-ai-color-slate-90);
    --dds-ai-button-color-border-neutral-subtle-outline: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-gradient-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-gradient-outline: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-text-neutral-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-ghost: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-text-neutral-outline: var(--dds-ai-color-slate-10);
    --dds-ai-button-color-text-neutral-strong-filled: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-strong-ghost: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-text-neutral-strong-outline: var(--dds-ai-color-slate-05);
    --dds-ai-button-color-text-neutral-subtle-filled: var(--dds-ai-color-slate-95);
    --dds-ai-button-color-text-neutral-subtle-ghost: var(--dds-color-neutral-white);
    --dds-ai-button-color-text-neutral-subtle-outline: var(--dds-color-neutral-white);
    --dds-ai-card-clickable-color-background-hover: var(--dds-ai-color-background-neutral-ghost-hover);
    --dds-ai-card-clickable-color-background-inactive: var(--dds-ai-color-background-surface-inactive);
    --dds-ai-card-clickable-color-background-pressed: var(--dds-ai-color-background-neutral-ghost-pressed);
    --dds-ai-card-clickable-color-background-rest: var(--dds-ai-color-background-neutral-ghost-rest);
    --dds-ai-card-color-background-light: var(--dds-ai-color-slate-80);
    --dds-ai-card-color-background-neutral: var(--dds-ai-color-slate-70);
    --dds-ai-card-color-border-inactive: var(--dds-color-gray-60);
    --dds-ai-card-color-border-light: var(--dds-ai-color-slate-40);
    --dds-ai-card-color-border-neutral: var(--dds-ai-color-slate-40);
    --dds-ai-toggle-button-color-background-neutral-outline-selected-pressed: var(--dds-ai-color-slate-60);
    --dds-ai-toggle-button-color-background-neutral-selected-hover: var(--dds-ai-color-slate-50);
    --dds-ai-toggle-button-color-background-neutral-selected-rest: var(--dds-ai-color-slate-40);
    --dds-ai-toggle-button-color-background-neutral-strong-outline-hover: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-strong-outline-pressed: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-hover: var(--dds-ai-color-slate-80);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-pressed: var(--dds-ai-color-slate-70);
    --dds-ai-toggle-button-color-background-neutral-strong-selected-rest: var(--dds-ai-color-slate-90);
    --dds-ai-toggle-button-color-background-neutral-strong-unselected-rest: var(--dds-color-transparent);
    --dds-ai-toggle-button-color-background-neutral-unselected-hover: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-unselected-pressed: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-background-neutral-unselected-rest: var(--dds-color-transparent);
    --dds-ai-toggle-button-color-border-neutral: var(--dds-ai-color-slate-40);
    --dds-ai-toggle-button-color-border-neutral-strong: var(--dds-ai-color-slate-90);
    --dds-ai-toggle-button-color-text-neutral-selected: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-text-neutral-strong-selected: var(--dds-ai-color-slate-05);
    --dds-ai-toggle-button-color-text-neutral-strong-unselected: var(--dds-ai-color-slate-95);
    --dds-ai-toggle-button-color-text-neutral-unselected: var(--dds-ai-color-slate-50);
  }
  .dds__accordion {
    --item-color: var(--dds-color-text-primary);
    --button-background: transparent;
    --button-color: var(--dds-color-text-neutral-rest);
    --icon-color: var(--dds-color-text-neutral-rest);
    --icon-background: transparent;
    --icon-size: var(--dds-button-size-sm);
    --icon-border-radius: var(--dds-border-radius-xs);
    --divider-color: var(--dds-color-background-surface-secondary);
    --expand-animation-type: var(--dds-accordion-motion-easing);
    --expand-animation-time: var(--dds-accordion-motion-duration);
    display: flex;
    flex-direction: column;
    position: relative;
    isolation: isolate;
  }
  .dds__accordion__item {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    color: var(--item-color);
    box-sizing: border-box;
    border-top: var(--dds-border-width-xs) solid var(--divider-color);
  }
  .dds__accordion__item--expanding > .dds__accordion__content-wrapper {
    animation: ddsAccordionExpand var(--expand-animation-time) var(--expand-animation-type) forwards;
  }
  .dds__accordion__item--expanding > .dds__accordion__heading .dds__accordion__heading__icon::after {
    rotate: 180deg;
  }
  .dds__accordion__item--expanded.dds__accordion__item--collapsing > .dds__accordion__content-wrapper {
    animation: ddsAccordionCollapse var(--expand-animation-time) var(--expand-animation-type) forwards;
  }
  .dds__accordion__item--expanded.dds__accordion__item--collapsing > .dds__accordion__heading .dds__accordion__heading__icon::after {
    rotate: 0deg;
  }
  .dds__accordion__item--expanded > .dds__accordion__heading .dds__accordion__heading__icon::after {
    rotate: 180deg;
  }
  .dds__accordion__item--expanded > .dds__accordion__content-wrapper {
    grid-template-rows: 1fr;
  }
  .dds__accordion__heading {
    box-sizing: border-box;
    display: flex;
  }
  .dds__accordion__heading__button {
    border: 0;
    outline: 0;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-strong);
    line-height: var(--dds-typography-body-2-line-height);
    transition: box-shadow var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), border-radius var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__button {
      transition: none;
    }
  }
  .dds__accordion__heading__button {
    flex: 1;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    background: var(--button-background);
    color: var(--button-color);
    padding-block: var(--dds-accordion-padding-vertical);
    padding-inline-start: var(--dds-accordion-padding-left);
    padding-inline-end: calc(var(--dds-accordion-padding-right) + var(--icon-size) + var(--dds-accordion-gap));
  }
  .dds__accordion__heading__button:focus-visible {
    --button-background: var(--dds-color-background-neutral-subtle-hover);
    --button-color: var(--dds-color-text-neutral-hover);
    --icon-color: var(--dds-color-text-neutral-hover);
    --icon-background: var(--dds-button-background-ghost-hover);
    border-radius: var(--dds-border-radius-sm);
    transition: background var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), color var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__button:focus-visible {
      transition: none;
    }
  }
  .dds__accordion__heading__button:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__accordion__heading__button:focus-visible .dds__accordion__heading__icon {
    transition: background var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), fill var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__button:focus-visible .dds__accordion__heading__icon {
      transition: none;
    }
  }
  .dds__accordion__heading__button:focus-visible {
    z-index: 1;
  }
  .dds__accordion__heading__button:hover {
    --button-background: var(--dds-color-background-neutral-subtle-hover);
    --button-color: var(--dds-color-text-neutral-hover);
    --icon-color: var(--dds-color-text-neutral-hover);
    --icon-background: var(--dds-button-background-ghost-hover);
    transition: background var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), color var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__button:hover {
      transition: none;
    }
  }
  .dds__accordion__heading__button:hover .dds__accordion__heading__icon {
    transition: background var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), fill var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), rotate var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__button:hover .dds__accordion__heading__icon {
      transition: none;
    }
  }
  .dds__accordion__heading__button:active {
    --button-background: var(--dds-color-background-neutral-subtle-pressed);
    --button-color: var(--dds-color-text-neutral-pressed);
    --icon-color: var(--dds-color-text-neutral-pressed);
    --icon-background: var(--dds-button-background-ghost-pressed);
    transition: background var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), color var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__button:active {
      transition: none;
    }
  }
  .dds__accordion__heading__button:active .dds__accordion__heading__icon {
    transition: background var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration), fill var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__button:active .dds__accordion__heading__icon {
      transition: none;
    }
  }
  .dds__accordion__heading__button:disabled, .dds__accordion__heading__button:disabled:hover {
    --button-background: transparent;
    --button-color: var(--dds-color-text-inactive);
    --icon-background: transparent;
    --icon-color: var(--dds-color-text-inactive);
    cursor: not-allowed;
  }
  .dds__accordion__heading__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    background: var(--icon-background);
    height: var(--icon-size);
    width: var(--icon-size);
    min-height: var(--icon-size);
    min-width: var(--icon-size);
    inset-inline-end: var(--dds-accordion-padding-right);
    border-radius: var(--icon-border-radius);
  }
  .dds__accordion__heading__icon::after {
    content: "";
    display: block;
    width: var(--dds-icon-size-sm);
    height: var(--dds-icon-size-sm);
    background: var(--icon-color);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNS4yOTMgMjIuNzA3Mkw1LjI5Mjk3IDEyLjcwNzJMNi43MDcxOCAxMS4yOTNMMTYuMDAwMSAyMC41ODU5TDI1LjI5MyAxMS4yOTNMMjYuNzA3MiAxMi43MDcyTDE2LjcwNzIgMjIuNzA3MkMxNi4zMTY3IDIzLjA5NzcgMTUuNjgzNSAyMy4wOTc3IDE1LjI5MyAyMi43MDcyWiIvPjwvc3ZnPg==") center/contain no-repeat;
    transition: rotate var(--dds-accordion-motion-easing) var(--dds-accordion-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__accordion__heading__icon::after {
      transition: none;
    }
  }
  .dds__accordion__content-wrapper {
    display: grid;
    grid-template-rows: 0fr;
  }
  .dds__accordion__content {
    overflow: hidden;
  }
  .dds__accordion__body {
    padding: var(--dds-accordion-contentbox-padding-vertical) var(--dds-accordion-contentbox-padding-horizontal);
  }
  .dds__accordion--nested .dds__accordion__heading__button {
    --button-color: var(--dds-color-text-brand-rest);
    --icon-color: var(--dds-color-text-brand-rest);
  }
  .dds__accordion--nested .dds__accordion__heading__button:hover, .dds__accordion--nested .dds__accordion__heading__button:focus-visible {
    --icon-color: var(--dds-color-text-brand-hover);
  }
  .dds__accordion--nested .dds__accordion__heading__button:active {
    --icon-color: var(--dds-color-text-brand-pressed);
  }
  .dds__accordion--nested .dds__accordion__heading__button:disabled {
    --button-color: var(--dds-color-text-inactive);
    --icon-color: var(--dds-color-text-inactive);
  }
  .dds__accordion.dds__accordion--ai {
    --item-color: var(--dds-ai-color-text-primary);
    --icon-border-radius: var(--dds-border-radius-md);
    --divider-color: var(--dds-ai-color-background-surface-secondary);
  }
  .dds__accordion.dds__accordion--ai .dds__accordion__heading__button {
    --button-color: var(--dds-ai-color-text-neutral-strong-rest);
    --icon-color: var(--dds-ai-button-color-text-neutral-strong-ghost);
    --icon-background: var(--dds-ai-button-color-background-neutral-strong-ghost-rest);
  }
  .dds__accordion.dds__accordion--ai .dds__accordion__heading__button:hover, .dds__accordion.dds__accordion--ai .dds__accordion__heading__button:focus-visible {
    --button-color: var(--dds-ai-color-text-neutral-strong-hover);
    --button-background: var(--dds-ai-color-background-neutral-subtle-hover);
    --icon-background: var(--dds-ai-button-color-background-neutral-strong-ghost-hover);
  }
  .dds__accordion.dds__accordion--ai .dds__accordion__heading__button:focus-visible {
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-ai-color-border-focus-base-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: var(--dds-border-radius-sm);
  }
  .dds__accordion.dds__accordion--ai .dds__accordion__heading__button:active {
    --button-color: var(--dds-ai-color-text-neutral-strong-pressed);
    --button-background: var(--dds-ai-color-background-neutral-subtle-pressed);
    --icon-background: var(--dds-ai-button-color-background-neutral-strong-ghost-pressed);
  }
  .dds__accordion.dds__accordion--ai .dds__accordion__heading__button:disabled {
    --button-color: var(--dds-ai-color-text-inactive);
    --button-background: transparent;
    --icon-color: var(--dds-ai-color-text-inactive);
    --icon-background: transparent;
  }
  .dds__accordion.dds__accordion--nested.dds__accordion--ai {
    --divider-color: var(--dds-ai-color-background-surface-tertiary);
  }
  .dds__accordion.dds__accordion--nested.dds__accordion--ai .dds__accordion__heading__button {
    --button-color: var(--dds-ai-color-text-neutral-rest);
    --icon-color: var(--dds-ai-button-color-text-neutral-ghost);
    --icon-background: var(--dds-ai-button-color-background-neutral-ghost-rest);
  }
  .dds__accordion.dds__accordion--nested.dds__accordion--ai .dds__accordion__heading__button:hover, .dds__accordion.dds__accordion--nested.dds__accordion--ai .dds__accordion__heading__button:focus-visible {
    --button-color: var(--dds-ai-color-text-neutral-hover);
    --button-background: var(--dds-ai-color-background-neutral-subtle-hover);
    --icon-background: var(--dds-ai-button-color-background-neutral-ghost-hover);
  }
  .dds__accordion.dds__accordion--nested.dds__accordion--ai .dds__accordion__heading__button:active {
    --button-color: var(--dds-ai-color-text-neutral-pressed);
    --button-background: var(--dds-ai-color-background-neutral-subtle-pressed);
    --icon-background: var(--dds-ai-button-color-background-neutral-ghost-pressed);
  }
  .dds__accordion.dds__accordion--nested.dds__accordion--ai .dds__accordion__heading__button:disabled {
    --button-color: var(--dds-ai-color-text-inactive);
    --button-background: var(--dds-button-background-ghost-rest);
    --icon-color: var(--dds-ai-color-text-inactive);
    --icon-background: transparent;
  }
  @media (prefers-reduced-motion: reduce) {
    .dds__accordion__item.dds__accordion__item--expanded,
    .dds__accordion__item.dds__accordion__item--expanding,
    .dds__accordion__item.dds__accordion__item--collapsing,
    .dds__accordion__item {
      transition: none;
    }
    .dds__accordion__item.dds__accordion__item--expanded .dds__accordion__heading,
    .dds__accordion__item.dds__accordion__item--expanded .dds__accordion__content-wrapper,
    .dds__accordion__item.dds__accordion__item--expanded .dds__accordion__heading__button,
    .dds__accordion__item.dds__accordion__item--expanded .dds__accordion_heading__icon,
    .dds__accordion__item.dds__accordion__item--expanding .dds__accordion__heading,
    .dds__accordion__item.dds__accordion__item--expanding .dds__accordion__content-wrapper,
    .dds__accordion__item.dds__accordion__item--expanding .dds__accordion__heading__button,
    .dds__accordion__item.dds__accordion__item--expanding .dds__accordion_heading__icon,
    .dds__accordion__item.dds__accordion__item--collapsing .dds__accordion__heading,
    .dds__accordion__item.dds__accordion__item--collapsing .dds__accordion__content-wrapper,
    .dds__accordion__item.dds__accordion__item--collapsing .dds__accordion__heading__button,
    .dds__accordion__item.dds__accordion__item--collapsing .dds__accordion_heading__icon,
    .dds__accordion__item .dds__accordion__heading,
    .dds__accordion__item .dds__accordion__content-wrapper,
    .dds__accordion__item .dds__accordion__heading__button,
    .dds__accordion__item .dds__accordion_heading__icon {
      animation-duration: 0.1s;
      transition: none;
    }
  }
  @keyframes ddsAccordionExpand {
    0% {
      grid-template-rows: 0fr;
    }
    100% {
      grid-template-rows: 1fr;
    }
  }
  @keyframes ddsAccordionCollapse {
    0% {
      grid-template-rows: 1fr;
    }
    100% {
      grid-template-rows: 0fr;
    }
  }
}
@layer component {
  .dds__popup {
    --animation-duration: var(--dds-motion-duration-02);
    --animation-type: var(--dds-motion-easing-ease-out);
    --popup-gap-fallback: var(--dds-spacing-md);
    inset: initial;
  }
  .dds__popup[popover] {
    outline: 0;
    border: 0;
    margin: 0;
    padding: 0;
  }
  .dds__popup[popover]:popover-open {
    position: fixed;
    animation: ddsPopupFadeIn var(--animation-duration) var(--animation-type) forwards;
  }
  @media (prefers-reduced-motion: reduce) {
    .dds__popup[popover]:popover-open {
      animation-duration: 0.1s;
    }
  }
  @keyframes ddsPopupFadeIn {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  .dds__popup.dds__popup--pointer {
    --popup-gap-fallback: var(--dds-spacing-lg);
  }
  .dds__popup--closing[popover]:popover-open {
    animation: ddsPopupFadeOut var(--animation-duration) var(--animation-type) forwards;
  }
  @media (prefers-reduced-motion: reduce) {
    .dds__popup--closing[popover]:popover-open {
      animation-duration: 0.1s;
    }
  }
  @keyframes ddsPopupFadeOut {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  .dds__popup--pointer::after {
    --pointer-size: 11px;
    --pointer-gap: var(--dds-spacing-md);
    content: "";
    position: absolute;
    width: var(--pointer-size);
    height: var(--pointer-size);
    line-height: 0;
    background: inherit;
    transform: rotate(45deg);
    z-index: -1;
  }
  .dds__popup--top-start {
    bottom: calc(anchor(top) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    left: anchor(left);
  }
  .dds__popup--top-start.dds__popup--pointer::after {
    bottom: 0;
    left: var(--pointer-gap);
    translate: 0 50%;
  }
  .dds__popup--top {
    bottom: calc(anchor(top) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    left: anchor(center);
    translate: -50% 0;
  }
  .dds__popup--top.dds__popup--pointer::after {
    bottom: 0;
    left: 50%;
    translate: -50% 50%;
  }
  .dds__popup--top-end {
    bottom: calc(anchor(top) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    right: anchor(right);
  }
  .dds__popup--top-end.dds__popup--pointer::after {
    bottom: 0;
    right: var(--pointer-gap);
    translate: 0% 50%;
  }
  .dds__popup--bottom-start {
    top: calc(anchor(bottom) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    left: anchor(left);
  }
  .dds__popup--bottom-start.dds__popup--pointer::after {
    top: 0;
    left: var(--pointer-gap);
    translate: 0 -50%;
  }
  .dds__popup--bottom {
    top: calc(anchor(bottom) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    left: anchor(center);
    translate: -50% 0;
  }
  .dds__popup--bottom.dds__popup--pointer::after {
    top: 0;
    left: 50%;
    translate: -50% -50%;
  }
  .dds__popup--bottom-end {
    top: calc(anchor(bottom) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    right: anchor(right);
  }
  .dds__popup--bottom-end.dds__popup--pointer::after {
    top: 0;
    right: var(--pointer-gap);
    translate: 0 -50%;
  }
  .dds__popup--left {
    top: anchor(center);
    right: calc(anchor(left) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    translate: 0 -50%;
  }
  .dds__popup--left.dds__popup--pointer::after {
    top: 50%;
    right: 0;
    translate: 50% -50%;
  }
  .dds__popup--left-top {
    top: anchor(top);
    right: calc(anchor(left) + var(--popup-gap-custom, var(--popup-gap-fallback)));
  }
  .dds__popup--left-top.dds__popup--pointer::after {
    top: var(--pointer-gap);
    right: 0;
    translate: 50% 0%;
  }
  .dds__popup--left-bottom {
    bottom: anchor(bottom);
    right: calc(anchor(left) + var(--popup-gap-custom, var(--popup-gap-fallback)));
  }
  .dds__popup--left-bottom.dds__popup--pointer::after {
    bottom: var(--pointer-gap);
    right: 0;
    translate: 50% 0%;
  }
  .dds__popup--right {
    top: anchor(center);
    left: calc(anchor(right) + var(--popup-gap-custom, var(--popup-gap-fallback)));
    translate: 0 -50%;
  }
  .dds__popup--right.dds__popup--pointer::after {
    top: 50%;
    left: 0;
    translate: -50% -50%;
  }
  .dds__popup--right-top {
    top: anchor(top);
    left: calc(anchor(right) + var(--popup-gap-custom, var(--popup-gap-fallback)));
  }
  .dds__popup--right-top.dds__popup--pointer::after {
    top: var(--pointer-gap);
    left: 0;
    translate: -50% 0%;
  }
  .dds__popup--right-bottom {
    bottom: anchor(bottom);
    left: calc(anchor(right) + var(--popup-gap-custom, var(--popup-gap-fallback)));
  }
  .dds__popup--right-bottom.dds__popup--pointer::after {
    bottom: var(--pointer-gap);
    left: 0;
    translate: -50% 0%;
  }
}
@layer component {
  :root,
  :host {
    --dds-action-menu-max-height: var(--dds-size-400);
    --dds-action-menu-max-width: var(--dds-size-320);
    --dds-action-menu-min-width: var(--dds-size-160);
  }
  .dds__action-menu {
    box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) 0 var(--dds-color-background-surface-drop-shadow);
  }
  @supports (scrollbar-width: thin) {
    .dds__action-menu {
      scrollbar-width: thin;
      scrollbar-color: var(--dds-color-background-surface-tertiary) var(--dds-color-background-surface-neutral);
      scrollbar-gutter: auto;
    }
  }
  .dds__action-menu {
    --popup-gap-custom: 0px;
    background: var(--dds-color-background-surface-neutral);
    border-radius: var(--dds-border-radius-xs);
    border: var(--dds-border-width-xs) solid var(--dds-color-border-neutral-pale);
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: var(--dds-action-menu-max-height);
    max-width: var(--dds-action-menu-max-width);
    min-width: var(--dds-action-menu-min-width);
  }
  .dds__action-menu:focus, .dds__action-menu:focus-visible, .dds__action-menu:focus-within {
    outline: 0;
  }
}
@layer component {
  :root,
  :host {
    --dds-badge-gap-lg: var(--dds-size-4);
    --dds-badge-gap-md: var(--dds-size-4);
    --dds-badge-gap-sm: var(--dds-size-2);
    --dds-badge-gap-xs: var(--dds-size-2);
    --dds-badge-padding-horizontal-lg: var(--dds-size-12);
    --dds-badge-padding-horizontal-md: var(--dds-size-8);
    --dds-badge-padding-horizontal-sm: var(--dds-size-4);
    --dds-badge-padding-horizontal-xs: var(--dds-size-4);
    --dds-badge-size-dot: var(--dds-size-12);
    --dds-badge-size-lg: var(--dds-size-32);
    --dds-badge-size-md: var(--dds-size-28);
    --dds-badge-size-micro-dot: var(--dds-size-8);
    --dds-badge-size-sm: var(--dds-size-16);
    --dds-badge-size-xs: var(--dds-size-14);
  }
  .dds__badge {
    --color: var(--dds-color-text-neutral);
    --background: var(--dds-color-background-info-base-rest);
    --border-color: var(--dds-color-background-info-base-rest);
    --height: var(--dds-badge-size-lg);
    --gap: var(--dds-badge-gap-lg);
    --padding-horizontal: var(--dds-badge-padding-horizontal-lg);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-strong);
    line-height: var(--dds-typography-body-3-line-height);
    display: inline-flex;
    text-wrap-mode: nowrap;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    gap: var(--gap);
    padding-inline: var(--padding-horizontal);
    height: var(--height);
    color: var(--color);
    background: var(--background);
    border: var(--dds-border-width-xs) solid var(--border-color);
    border-radius: var(--dds-border-radius-rounded);
  }
  .dds__badge .dds__icon {
    --size: var(--dds-icon-size-sm);
  }
  .dds__badge--md {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-4-size);
    font-weight: var(--dds-typography-body-4-weight-strong);
    line-height: var(--dds-typography-body-4-line-height);
    --padding-horizontal: var(--dds-badge-padding-horizontal-md);
    --gap: var(--dds-badge-gap-md);
    --height: var(--dds-badge-size-md);
  }
  .dds__badge--md .dds__icon {
    --size: var(--dds-icon-size-xs);
  }
  .dds__badge--sm {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-6-size);
    font-weight: var(--dds-typography-body-6-weight-strong);
    line-height: var(--dds-typography-body-6-line-height);
    --padding-horizontal: var(--dds-badge-padding-horizontal-sm);
    --gap: var(--dds-badge-gap-sm);
    --height: var(--dds-badge-size-sm);
  }
  .dds__badge--sm .dds__icon {
    --size: var(--dds-icon-size-2xs);
  }
  .dds__badge--xs {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-6-size);
    font-weight: var(--dds-typography-body-6-weight-strong);
    line-height: var(--dds-typography-body-6-line-height);
    --padding-horizontal: var(--dds-badge-padding-horizontal-xs);
    --gap: var(--dds-badge-gap-xs);
    --height: var(--dds-badge-size-xs);
  }
  .dds__badge--dot {
    --height: var(--dds-badge-size-dot);
    width: var(--height);
    padding: 0;
  }
  .dds__badge--microdot {
    --height: var(--dds-badge-size-micro-dot);
    width: var(--height);
    padding: 0;
  }
  .dds__badge--brand {
    --color: var(--dds-color-text-neutral);
    --background: var(--dds-color-background-brand-base-rest);
    --border-color: var(--dds-color-background-brand-base-rest);
  }
  .dds__badge--success {
    --color: var(--dds-color-text-neutral);
    --background: var(--dds-color-background-success-base-rest);
    --border-color: var(--dds-color-background-success-base-rest);
  }
  .dds__badge--warning {
    --color: var(--dds-color-text-neutral);
    --background: var(--dds-color-background-warning-base-rest);
    --border-color: var(--dds-color-background-warning-base-rest);
  }
  .dds__badge--error {
    --color: var(--dds-color-text-neutral);
    --background: var(--dds-color-background-error-base-rest);
    --border-color: var(--dds-color-background-error-base-rest);
  }
  .dds__badge--neutral {
    --color: var(--dds-color-text-neutral);
    --background: var(--dds-color-background-neutral-base-rest);
    --border-color: var(--dds-color-background-neutral-base-rest);
  }
  .dds__badge--light {
    --color: var(--dds-color-text-brand-rest);
    --background: var(--dds-color-background-brand-subtle-rest);
    --border-color: var(--dds-color-border-brand-subtle);
  }
  .dds__badge--success.dds__badge--light {
    --color: var(--dds-color-text-success-rest);
    --background: var(--dds-color-background-success-subtle-rest);
    --border-color: var(--dds-color-border-success-subtle);
  }
  .dds__badge--brand.dds__badge--light {
    --color: var(--dds-color-text-brand-rest);
    --background: var(--dds-color-background-brand-subtle-rest);
    --border-color: var(--dds-color-border-brand-subtle);
  }
  .dds__badge--warning.dds__badge--light {
    --color: var(--dds-color-text-warning-rest);
    --background: var(--dds-color-background-warning-subtle-rest);
    --border-color: var(--dds-color-border-warning-subtle);
  }
  .dds__badge--error.dds__badge--light {
    --color: var(--dds-color-text-error-rest);
    --background: var(--dds-color-background-error-subtle-rest);
    --border-color: var(--dds-color-border-error-subtle);
  }
  .dds__badge--neutral.dds__badge--light {
    --color: var(--dds-color-text-neutral-rest);
    --background: var(--dds-color-background-neutral-subtle-rest);
    --border-color: var(--dds-color-border-neutral-base);
  }
}
@layer component {
  :root,
  :host {
    --dds-blockquote-gap: var(--dds-size-4);
    --dds-blockquote-padding-horizontal: var(--dds-size-32);
    --dds-blockquote-padding-vertical: var(--dds-size-16);
  }
  .dds__blockquote {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    margin: 0;
    display: block;
    color: var(--dds-color-text-secondary);
    padding-block: var(--dds-blockquote-padding-vertical);
    padding-inline: var(--dds-blockquote-padding-horizontal);
  }
  .dds__blockquote p {
    margin: 0 0 var(--dds-blockquote-gap);
  }
  .dds__blockquote p:last-of-type {
    margin-bottom: 0;
  }
}
@layer component {
  :root,
  :host {
    --dds-breadcrumb-gap: var(--dds-size-12);
    --dds-breadcrumb-home-background-duration: 300ms;
    --dds-breadcrumb-home-motion-duration: 300ms;
    --dds-breadcrumb-home-motion-easing: ease-out;
    --dds-breadcrumb-home-padding: var(--dds-size-4);
  }
  :root,
  :host {
    --dds-breadcrumb-home-background-hover: rgba(64, 88, 109, 0.1);
    --dds-breadcrumb-home-background-pressed: rgba(64, 88, 109, 0.2);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-breadcrumb-home-background-hover: rgba(64, 88, 109, 0.1);
      --dds-breadcrumb-home-background-pressed: rgba(64, 88, 109, 0.2);
    }
  }
  .dds--light-mode {
    --dds-breadcrumb-home-background-hover: rgba(64, 88, 109, 0.1);
    --dds-breadcrumb-home-background-pressed: rgba(64, 88, 109, 0.2);
  }
  .dds--dark-mode {
    --dds-breadcrumb-home-background-hover: rgba(64, 88, 109, 0.1);
    --dds-breadcrumb-home-background-pressed: rgba(64, 88, 109, 0.2);
  }
  .dds__breadcrumb {
    --color: var(--dds-color-text-primary);
    --color-hover: var(--dds-color-background-brand-base-hover);
    --color-focus: var(--dds-color-text-brand);
  }
  .dds__breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .dds__breadcrumb__item {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    display: flex;
    align-items: center;
  }
  .dds__breadcrumb__item:not(:last-of-type)::after {
    content: "/";
    padding-inline: var(--dds-breadcrumb-gap);
    text-align: center;
    color: var(--color);
  }
  .dds__breadcrumb__item--current {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-strong);
    line-height: var(--dds-typography-body-2-line-height);
    color: var(--color);
    pointer-events: none;
  }
  .dds__breadcrumb__item .dds__link {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    transition: color var(--dds-breadcrumb-home-motion-easing) var(--dds-breadcrumb-home-motion-duration), background var(--dds-breadcrumb-home-motion-easing) var(--dds-breadcrumb-home-motion-duration), box-shadow var(--dds-breadcrumb-home-motion-easing) var(--dds-breadcrumb-home-motion-duration), border-color var(--dds-breadcrumb-home-motion-easing) var(--dds-breadcrumb-home-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__breadcrumb__item .dds__link {
      transition: none;
    }
  }
  .dds__breadcrumb__item .dds__link {
    color: var(--color);
    text-decoration: none;
    fill: currentColor;
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__breadcrumb__item .dds__link:hover {
    text-decoration: underline;
    color: var(--color-hover);
  }
  .dds__breadcrumb__item .dds__link:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
    color: var(--color-focus);
    text-decoration: underline;
    outline: none;
  }
  @media screen and (max-width: 480px) {
    .dds__breadcrumb__item {
      display: none;
    }
    .dds__breadcrumb__item:not(:last-of-type)::after {
      content: none;
    }
    .dds__breadcrumb__item::before {
      content: "";
      display: inline-block;
      inline-size: var(--dds-icon-size-2xs);
      aspect-ratio: 1;
      margin-inline-end: var(--dds-size-4);
      mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjI5Mzg3IDE1LjI5M0wxOS4yOTM5IDUuMjkyOTdMMjAuNzA4MSA2LjcwNzE4TDExLjQxNTIgMTYuMDAwMUwyMC43MDgxIDI1LjI5M0wxOS4yOTM5IDI2LjcwNzJMOS4yOTM4NyAxNi43MDcyQzguOTAzMzUgMTYuMzE2NyA4LjkwMzM1IDE1LjY4MzUgOS4yOTM4NyAxNS4yOTNaIi8+PC9zdmc+") center/contain no-repeat;
      background: var(--color);
    }
    .dds__breadcrumb__item:nth-last-of-type(2) {
      display: flex;
    }
  }
}
@layer component {
  .dds__button {
    --border-color: transparent;
    --border-color-inactive: transparent;
    --background: var(--dds-color-background-brand-base-rest);
    --background-hover: var(--dds-color-background-brand-base-hover);
    --background-active: var(--dds-color-background-brand-base-pressed);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --color: var(--dds-color-text-neutral);
    --color-hover: var(--dds-color-text-neutral);
    --color-active: var(--dds-color-text-neutral);
    --color-inactive: var(--dds-color-text-inactive);
    --height: var(--dds-button-size-lg);
    --gap: var(--dds-button-gap-lg);
    --padding-horizontal: var(--dds-button-padding-horizontal-lg);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-strong);
    line-height: var(--dds-typography-body-2-line-height);
    outline: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: var(--height);
    min-height: var(--height);
    gap: var(--gap);
    background: var(--background);
    border: var(--dds-border-width-xs) solid var(--border-color);
    color: var(--color);
    padding-block: 0;
    padding-inline: var(--padding-horizontal);
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__button .dds__icon {
    --size: var(--dds-icon-size-md);
  }
  .dds__button:hover, .dds__button:focus-visible {
    transition: color var(--dds-button-motion-easing) var(--dds-button-motion-duration), background var(--dds-button-motion-easing) var(--dds-button-motion-duration), border-color var(--dds-button-motion-easing) var(--dds-button-motion-duration), box-shadow var(--dds-button-motion-easing) var(--dds-button-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button:hover, .dds__button:focus-visible {
      transition: none;
    }
  }
  .dds__button:hover {
    background: var(--background-hover);
    color: var(--color-hover);
  }
  .dds__button:active {
    background: var(--background-active);
    color: var(--color-active);
  }
  .dds__button:focus-visible {
    background: var(--background-hover);
    color: var(--color-hover);
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__button:disabled {
    background: var(--background-inactive);
    border-color: var(--border-color-inactive);
    color: var(--color-inactive);
    cursor: not-allowed;
  }
  .dds__button.dds__button--outline {
    --background-active: var(--dds-color-background-brand-subtle-pressed);
    --background-hover: var(--dds-color-background-brand-subtle-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-brand-base);
    --border-color-inactive: var(--dds-color-border-inactive-base);
    --color-inactive: var(--dds-color-text-inactive);
    --color-hover: var(--dds-color-text-brand-hover);
    --color-active: var(--dds-color-text-brand-pressed);
    --color: var(--dds-color-text-brand-rest);
  }
  .dds__button.dds__button--minimal {
    --background-active: var(--dds-color-background-brand-subtle-pressed);
    --background-hover: var(--dds-color-background-brand-subtle-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-active: var(--dds-color-text-brand-pressed);
    --color-hover: var(--dds-color-text-brand-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-brand-rest);
  }
  .dds__button.dds__button--ghost {
    --background-active: var(--dds-button-background-ghost-pressed);
    --background-hover: var(--dds-button-background-ghost-hover);
    --background-inactive: var(--dds-button-background-ghost-rest);
    --background: var(--dds-button-background-ghost-rest);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-active: var(--dds-color-text-brand-pressed);
    --color-hover: var(--dds-color-text-brand-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-brand-rest);
  }
  .dds__button.dds__button--destructive {
    --background-active: var(--dds-color-background-error-base-pressed);
    --background-hover: var(--dds-color-background-error-base-hover);
    --background: var(--dds-color-background-error-base-rest);
  }
  .dds__button.dds__button--destructive.dds__button--outline {
    --background-active: var(--dds-color-background-error-subtle-pressed);
    --background-hover: var(--dds-color-background-error-subtle-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-error-base);
    --border-color-inactive: var(--dds-color-border-inactive-base);
    --color-inactive: var(--dds-color-text-inactive);
    --color-hover: var(--dds-color-text-error-hover);
    --color-active: var(--dds-color-text-error-pressed);
    --color: var(--dds-color-text-error-rest);
  }
  .dds__button.dds__button--destructive.dds__button--minimal {
    --background-active: var(--dds-color-background-error-subtle-pressed);
    --background-hover: var(--dds-color-background-error-subtle-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-inactive: var(--dds-color-text-inactive);
    --color-hover: var(--dds-color-text-error-hover);
    --color-active: var(--dds-color-text-error-pressed);
    --color: var(--dds-color-text-error-rest);
  }
  .dds__button.dds__button--destructive.dds__button--ghost {
    --background-active: var(--dds-button-background-ghost-pressed);
    --background-hover: var(--dds-button-background-ghost-hover);
    --background-inactive: var(--dds-button-background-ghost-rest);
    --background: var(--dds-button-background-ghost-rest);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-inactive: var(--dds-color-text-inactive);
    --color-hover: var(--dds-color-text-error-hover);
    --color-active: var(--dds-color-text-error-pressed);
    --color: var(--dds-color-text-error-rest);
  }
  .dds__button.dds__button--success {
    --background: var(--dds-color-background-success-base-rest);
    --background-hover: var(--dds-color-background-success-base-hover);
    --background-active: var(--dds-color-background-success-base-pressed);
  }
  .dds__button.dds__button--success.dds__button--outline {
    --background-active: var(--dds-color-background-success-subtle-pressed);
    --background-hover: var(--dds-color-background-success-subtle-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-success-base);
    --border-color-inactive: var(--dds-color-border-inactive-base);
    --color-active: var(--dds-color-text-success-pressed);
    --color-hover: var(--dds-color-text-success-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-success-rest);
  }
  .dds__button.dds__button--success.dds__button--minimal {
    --background-active: var(--dds-color-background-success-subtle-pressed);
    --background-hover: var(--dds-color-background-success-subtle-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-active: var(--dds-color-text-success-pressed);
    --color-hover: var(--dds-color-text-success-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-success-rest);
  }
  .dds__button.dds__button--success.dds__button--ghost {
    --background-active: var(--dds-button-background-ghost-pressed);
    --background-hover: var(--dds-button-background-ghost-hover);
    --background-inactive: var(--dds-button-background-ghost-rest);
    --background: var(--dds-button-background-ghost-rest);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-active: var(--dds-color-text-success-pressed);
    --color-hover: var(--dds-color-text-success-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-success-rest);
  }
  .dds__button.dds__button--neutral {
    --background: var(--dds-color-background-neutral-base-rest);
    --background-hover: var(--dds-color-background-neutral-base-hover);
    --background-active: var(--dds-color-background-neutral-base-pressed);
  }
  .dds__button.dds__button--neutral.dds__button--outline {
    --background-active: var(--dds-button-background-ghost-pressed);
    --background-hover: var(--dds-button-background-ghost-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-neutral-base);
    --border-color-inactive: var(--dds-color-border-inactive-base);
    --color-active: var(--dds-color-text-neutral-pressed);
    --color-hover: var(--dds-color-text-neutral-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-neutral-rest);
  }
  .dds__button.dds__button--neutral.dds__button--minimal {
    --background-active: var(--dds-color-background-neutral-subtle-pressed);
    --background-hover: var(--dds-color-background-neutral-subtle-hover);
    --background-inactive: var(--dds-color-background-surface-inactive);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-active: var(--dds-color-text-neutral-pressed);
    --color-hover: var(--dds-color-text-neutral-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-neutral-rest);
  }
  .dds__button.dds__button--neutral.dds__button--ghost {
    --background-active: var(--dds-button-background-ghost-pressed);
    --background-hover: var(--dds-button-background-ghost-hover);
    --background-inactive: var(--dds-button-background-ghost-rest);
    --background: var(--dds-button-background-ghost-rest);
    --border-color: transparent;
    --border-color-inactive: transparent;
    --color-active: var(--dds-color-text-neutral-pressed);
    --color-hover: var(--dds-color-text-neutral-hover);
    --color-inactive: var(--dds-color-text-inactive);
    --color: var(--dds-color-text-neutral-rest);
  }
  .dds__button--md {
    --height: var(--dds-button-size-md);
    --gap: var(--dds-button-gap-md);
    --padding-horizontal: var(--dds-button-padding-horizontal-md);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-strong);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__button--sm {
    --height: var(--dds-button-size-sm);
    --gap: var(--dds-button-gap-sm);
    --padding-horizontal: var(--dds-button-padding-horizontal-sm);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-strong);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__button--sm .dds__icon {
    --size: var(--dds-icon-size-sm);
  }
  .dds__button--xs {
    --height: var(--dds-button-size-xs);
    --gap: var(--dds-button-gap-xs);
    --padding-horizontal: var(--dds-button-padding-horizontal-xs);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-strong);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__button--xs .dds__icon {
    --size: var(--dds-icon-size-xs);
  }
  .dds__button--block {
    width: 100%;
  }
  .dds__button--icon-only {
    padding: 0;
    width: var(--height);
    min-width: var(--height);
  }
  .dds__button--icon-only:disabled.dds__button.dds__button--success, .dds__button--icon-only:disabled.dds__button.dds__button--destructive, .dds__button--icon-only:disabled.dds__button.dds__button--neutral {
    --color-inactive: var(--dds-color-text-inactive);
  }
  .dds__button--icon-only:disabled.dds__button.dds__button--success.dds__button--minimal, .dds__button--icon-only:disabled.dds__button.dds__button--destructive.dds__button--minimal, .dds__button--icon-only:disabled.dds__button.dds__button--neutral.dds__button--minimal {
    --background-inactive: var(--dds-color-background-surface-inactive);
  }
  .dds__button.dds__button--ai {
    --border-color: transparent;
    --border-color-inactive: transparent;
    --border-width: var(--dds-ai-button-border);
    --border-style: solid;
    --color: var(--dds-ai-button-color-text-gradient-filled);
    --color-hover: var(--dds-ai-button-color-text-gradient-filled);
    --color-active: var(--dds-ai-button-color-text-gradient-filled);
    --color-inactive: var(--dds-ai-button-color-text-gradient-filled);
    border: var(--border-width) var(--border-style) var(--border-color);
    border-radius: var(--dds-border-radius-md);
    position: relative;
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-rest-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-rest-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-rest-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai {
      transition: none;
    }
  }
  .dds__button.dds__button--ai:hover, .dds__button.dds__button--ai:focus-visible {
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-hover-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-hover-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-hover-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai:hover, .dds__button.dds__button--ai:focus-visible {
      transition: none;
    }
  }
  .dds__button.dds__button--ai:hover, .dds__button.dds__button--ai:focus-visible {
    color: var(--color-hover);
  }
  .dds__button.dds__button--ai:focus-visible {
    box-shadow: none;
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-ai-color-border-focus-base-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: custom;
  }
  .dds__button.dds__button--ai:active {
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-pressed-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-pressed-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-pressed-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai:active {
      transition: none;
    }
  }
  .dds__button.dds__button--ai:active {
    color: var(--color-active);
  }
  .dds__button.dds__button--ai:disabled {
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-inactive-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-inactive-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-inactive-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai:disabled {
      transition: none;
    }
  }
  .dds__button.dds__button--ai:disabled {
    border-color: var(--border-color-inactive);
    color: var(--color-inactive);
  }
  .dds__button.dds__button--ai.dds__button--outline {
    --border-color-inactive: var(--dds-ai-color-border-neutral-inactive);
    --background: var(--dds-ai-button-color-background-gradient-outline-rest);
    --background-inactive: var(--dds-ai-button-color-background-gradient-outline-inactive);
    --color: var(--dds-ai-button-color-text-gradient-outline);
    --color-hover: var(--dds-ai-button-color-text-gradient-outline);
    --color-active: var(--dds-ai-button-color-text-gradient-outline);
    --color-inactive: var(--dds-color-text-inactive);
    --dds-ai-gradient-color-1: var(--background);
    --dds-ai-gradient-color-2: var(--background);
    --dds-ai-gradient-color-3: var(--background);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai.dds__button--outline {
      transition: none;
    }
  }
  .dds__button.dds__button--ai.dds__button--outline:hover, .dds__button.dds__button--ai.dds__button--outline:focus-visible {
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-subtle-hover-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-subtle-hover-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-subtle-hover-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) padding-box;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai.dds__button--outline:hover, .dds__button.dds__button--ai.dds__button--outline:focus-visible {
      transition: none;
    }
  }
  .dds__button.dds__button--ai.dds__button--outline:active {
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-subtle-pressed-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-subtle-pressed-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-subtle-pressed-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) padding-box;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai.dds__button--outline:active {
      transition: none;
    }
  }
  .dds__button.dds__button--ai.dds__button--outline::before {
    content: "";
    position: absolute;
    inset: calc(var(--dds-ai-button-border) * -1);
    border: var(--dds-ai-button-border) solid var(--border-color);
    border-radius: var(--dds-border-radius-md);
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-rest-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-rest-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-rest-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai.dds__button--outline::before {
      transition: none;
    }
  }
  .dds__button.dds__button--ai.dds__button--outline:disabled {
    background: var(--background-inactive);
    color: var(--color-inactive);
  }
  .dds__button.dds__button--ai.dds__button--outline:disabled::before {
    --dds-ai-gradient-color-1: var(--dds-ai-color-background-gradient-base-inactive-color1);
    --dds-ai-gradient-color-2: var(--dds-ai-color-background-gradient-base-inactive-color2);
    --dds-ai-gradient-color-3: var(--dds-ai-color-background-gradient-base-inactive-color3);
    background: linear-gradient(var(--dds-ai-color-background-gradient-angle), var(--dds-ai-gradient-color-1) var(--dds-ai-color-background-gradient-position-color1), var(--dds-ai-gradient-color-2) var(--dds-ai-color-background-gradient-position-color2), var(--dds-ai-gradient-color-3) var(--dds-ai-color-background-gradient-position-color3)) border-box;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude;
    transition: --dds-ai-gradient-color-1 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-2 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), --dds-ai-gradient-color-3 var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai.dds__button--outline:disabled::before {
      transition: none;
    }
  }
  .dds__button.dds__button--ai.dds__button--outline.dds__button--rounded::before {
    border-radius: var(--dds-border-radius-rounded);
  }
  .dds__button.dds__button--ai.dds__button--outline.dds__button--icon-only {
    border: 0;
  }
  .dds__button.dds__button--ai.dds__button--outline.dds__button--icon-only::before {
    inset: 0;
  }
  .dds__button.dds__button--ai.dds__button--neutral,
  .dds__button.dds__button--ai.dds__button--neutral-strong,
  .dds__button.dds__button--ai.dds__button--neutral-subtle {
    background: var(--background);
    transition: color var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), background var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), border-color var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02), box-shadow var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__button.dds__button--ai.dds__button--neutral,
    .dds__button.dds__button--ai.dds__button--neutral-strong,
    .dds__button.dds__button--ai.dds__button--neutral-subtle {
      transition: none;
    }
  }
  .dds__button.dds__button--ai.dds__button--neutral:hover, .dds__button.dds__button--ai.dds__button--neutral:focus-visible,
  .dds__button.dds__button--ai.dds__button--neutral-strong:hover,
  .dds__button.dds__button--ai.dds__button--neutral-strong:focus-visible,
  .dds__button.dds__button--ai.dds__button--neutral-subtle:hover,
  .dds__button.dds__button--ai.dds__button--neutral-subtle:focus-visible {
    background: var(--background-hover);
    color: var(--color-hover);
  }
  .dds__button.dds__button--ai.dds__button--neutral:active,
  .dds__button.dds__button--ai.dds__button--neutral-strong:active,
  .dds__button.dds__button--ai.dds__button--neutral-subtle:active {
    background: var(--background-active);
    color: var(--color-active);
  }
  .dds__button.dds__button--ai.dds__button--neutral:disabled,
  .dds__button.dds__button--ai.dds__button--neutral-strong:disabled,
  .dds__button.dds__button--ai.dds__button--neutral-subtle:disabled {
    background: var(--background-inactive);
    border-color: var(--border-color-inactive);
    color: var(--color-inactive);
  }
  .dds__button.dds__button--ai.dds__button--neutral::before,
  .dds__button.dds__button--ai.dds__button--neutral-strong::before,
  .dds__button.dds__button--ai.dds__button--neutral-subtle::before {
    display: none;
  }
  .dds__button.dds__button--ai.dds__button--neutral.dds__button--icon-only,
  .dds__button.dds__button--ai.dds__button--neutral-strong.dds__button--icon-only,
  .dds__button.dds__button--ai.dds__button--neutral-subtle.dds__button--icon-only {
    border: var(--border-width) var(--border-style) var(--border-color);
  }
  .dds__button.dds__button--ai.dds__button--neutral.dds__button--icon-only:disabled,
  .dds__button.dds__button--ai.dds__button--neutral-strong.dds__button--icon-only:disabled,
  .dds__button.dds__button--ai.dds__button--neutral-subtle.dds__button--icon-only:disabled {
    border-color: var(--border-color-inactive);
  }
  .dds__button.dds__button--ai.dds__button--neutral {
    --background: var(--dds-ai-button-color-background-neutral-filled-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-filled-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-filled-pressed);
    --background-inactive: var(--dds-ai-color-background-surface-inactive);
    --color: var(--dds-ai-button-color-text-neutral-filled);
    --color-hover: var(--dds-ai-button-color-text-neutral-filled);
    --color-active: var(--dds-ai-button-color-text-neutral-filled);
    --color-inactive: var(--dds-color-text-inactive);
  }
  .dds__button.dds__button--ai.dds__button--neutral.dds__button--outline {
    --background: var(--dds-ai-button-color-background-neutral-outline-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-outline-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-outline-pressed);
    --background-inactive: transparent;
    --border-color: var(--dds-ai-button-color-border-neutral-outline);
    --border-color-inactive: var(--dds-ai-color-border-neutral-inactive);
    --color: var(--dds-ai-button-color-text-neutral-outline);
    --color-hover: var(--dds-ai-button-color-text-neutral-outline);
    --color-active: var(--dds-ai-button-color-text-neutral-outline);
    --border-width: var(--dds-ai-button-border-neutral-outline);
  }
  .dds__button.dds__button--ai.dds__button--neutral.dds__button--ghost {
    --background: var(--dds-ai-button-color-background-neutral-ghost-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-ghost-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-ghost-pressed);
    --background-inactive: transparent;
    --color: var(--dds-ai-button-color-text-neutral-ghost);
    --color-hover: var(--dds-ai-button-color-text-neutral-ghost);
    --color-active: var(--dds-ai-button-color-text-neutral-ghost);
  }
  .dds__button.dds__button--ai.dds__button--neutral-strong {
    --background: var(--dds-ai-button-color-background-neutral-strong-filled-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-strong-filled-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-strong-filled-pressed);
    --background-inactive: var(--dds-ai-color-background-surface-inactive);
    --color: var(--dds-ai-button-color-text-neutral-strong-filled);
    --color-hover: var(--dds-ai-button-color-text-neutral-strong-filled);
    --color-active: var(--dds-ai-button-color-text-neutral-strong-filled);
    --color-inactive: var(--dds-color-text-inactive);
  }
  .dds__button.dds__button--ai.dds__button--neutral-strong.dds__button--outline {
    --background: var(--dds-ai-button-color-background-neutral-strong-outline-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-strong-outline-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-strong-outline-pressed);
    --background-inactive: transparent;
    --border-color: var(--dds-ai-button-color-border-neutral-strong-outline);
    --border-color-inactive: var(--dds-ai-color-border-neutral-inactive);
    --color: var(--dds-ai-button-color-text-neutral-strong-outline);
    --color-hover: var(--dds-ai-button-color-text-neutral-strong-outline);
    --color-active: var(--dds-ai-button-color-text-neutral-strong-outline);
    --border-width: var(--dds-ai-button-border-neutral-strong-outline);
  }
  .dds__button.dds__button--ai.dds__button--neutral-strong.dds__button--ghost {
    --background: var(--dds-ai-button-color-background-neutral-strong-ghost-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-strong-ghost-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-strong-ghost-pressed);
    --background-inactive: transparent;
    --color: var(--dds-ai-button-color-text-neutral-strong-ghost);
    --color-hover: var(--dds-ai-button-color-text-neutral-strong-ghost);
    --color-active: var(--dds-ai-button-color-text-neutral-strong-ghost);
  }
  .dds__button.dds__button--ai.dds__button--neutral-subtle {
    --background: var(--dds-ai-button-color-background-neutral-subtle-filled-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-subtle-filled-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-subtle-filled-pressed);
    --background-inactive: var(--dds-ai-color-background-surface-inactive);
    --color: var(--dds-ai-button-color-text-neutral-subtle-filled);
    --color-hover: var(--dds-ai-button-color-text-neutral-subtle-filled);
    --color-active: var(--dds-ai-button-color-text-neutral-subtle-filled);
    --color-inactive: var(--dds-color-text-inactive);
  }
  .dds__button.dds__button--ai.dds__button--neutral-subtle.dds__button--outline {
    --background: var(--dds-ai-button-color-background-neutral-subtle-outline-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-subtle-outline-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-subtle-outline-pressed);
    --background-inactive: transparent;
    --border-color: var(--dds-ai-button-color-border-neutral-subtle-outline);
    --border-color-inactive: var(--dds-ai-color-border-neutral-inactive);
    --color: var(--dds-ai-button-color-text-neutral-subtle-outline);
    --color-hover: var(--dds-ai-button-color-text-neutral-subtle-outline);
    --color-active: var(--dds-ai-button-color-text-neutral-subtle-outline);
    --border-width: var(--dds-ai-button-border-neutral-subtle-outline);
  }
  .dds__button.dds__button--ai.dds__button--neutral-subtle.dds__button--ghost {
    --background: var(--dds-ai-button-color-background-neutral-subtle-ghost-rest);
    --background-hover: var(--dds-ai-button-color-background-neutral-subtle-ghost-hover);
    --background-active: var(--dds-ai-button-color-background-neutral-subtle-ghost-pressed);
    --background-inactive: transparent;
    --color: var(--dds-ai-button-color-text-neutral-subtle-ghost);
    --color-hover: var(--dds-ai-button-color-text-neutral-subtle-ghost);
    --color-active: var(--dds-ai-button-color-text-neutral-subtle-ghost);
  }
  .dds__button.dds__button--ai.dds__button--neutral-subtle.dds__button--ghost:focus-visible {
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-ai-color-border-focus-neutral);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: custom;
  }
  .dds__button.dds__button--ai.dds__button--rounded {
    border-radius: var(--dds-border-radius-rounded);
  }
}
@layer component {
  :root,
  :host {
    --dds-input-gap-lg: var(--dds-size-8);
    --dds-input-gap-sm: var(--dds-size-4);
    --dds-input-height-lg: var(--dds-size-48);
    --dds-input-height-sm: var(--dds-size-32);
    --dds-input-motion-duration: 300ms;
    --dds-input-motion-easing: ease-out;
    --dds-input-padding-horizontal-lg: var(--dds-size-16);
    --dds-input-padding-horizontal-sm: var(--dds-size-8);
    --dds-input-padding-horizontal-xs: var(--dds-size-4);
    --dds-input-padding-vertical-lg: var(--dds-size-12);
    --dds-input-padding-vertical-sm: var(--dds-size-8);
  }
  :root,
  :host {
    --dds-select-item-grouped-padding-horizontal: var(--dds-size-32);
    --dds-select-item-padding-horizontal: var(--dds-size-16);
    --dds-select-max-height: 30rem;
    --dds-select-motion-duration: 300ms;
    --dds-select-motion-easing: ease-out;
  }
  .dds__select {
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-neutral-pale);
    --color: var(--dds-color-text-primary);
    --height: var(--dds-input-height-lg);
    --padding-horizontal: var(--dds-input-padding-horizontal-lg);
    --input-gap: var(--dds-input-gap-lg);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    background: var(--background);
    border-radius: var(--dds-border-radius-xs);
    border: var(--dds-border-width-xs) solid var(--border-color);
    box-sizing: border-box;
    color: var(--color);
    height: var(--height);
    width: 100%;
    padding-inline-start: var(--padding-horizontal);
    padding-inline-end: calc(var(--padding-horizontal) + var(--dds-icon-size-sm) + var(--input-gap));
  }
  .dds__select option,
  .dds__select optgroup {
    color: var(--color);
  }
  .dds__select option[data-placeholder] {
    color: var(--dds-color-text-tertiary);
  }
  .dds__select:has(option[data-placeholder=true]:checked) {
    color: var(--dds-color-text-tertiary);
  }
  .dds__select:hover {
    --border-color: var(--dds-color-border-brand-base);
  }
  .dds__select:focus {
    transition: box-shadow var(--dds-select-motion-easing) var(--dds-select-motion-duration), border-color var(--dds-select-motion-easing) var(--dds-select-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__select:focus {
      transition: none;
    }
  }
  .dds__select:focus-visible {
    outline: none;
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__select:disabled {
    --border-color: var(--dds-color-border-inactive-base);
    --color: var(--dds-color-text-inactive);
    --background: var(--dds-color-background-surface-inactive);
    cursor: not-allowed;
  }
  .dds__select--sm {
    --height: var(--dds-input-height-sm);
    --padding-horizontal: var(--dds-input-padding-horizontal-sm);
    --input-gap: var(--dds-input-gap-sm);
  }
  .dds__select.dds__select--invalid {
    --border-color: var(--dds-color-text-error-rest);
  }
  .dds__select-wrapper {
    --chevron-color: var(--dds-color-text-secondary);
    position: relative;
    width: 100%;
  }
  .dds__select-wrapper .dds__select {
    appearance: none;
  }
  .dds__select-wrapper::after {
    content: "";
    position: absolute;
    inset-block-start: 50%;
    inset-inline-end: var(--dds-input-padding-horizontal-lg);
    width: var(--dds-icon-size-sm);
    aspect-ratio: 1;
    background: var(--chevron-color);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNS4yOTMgMjIuNzA3Mkw1LjI5Mjk3IDEyLjcwNzJMNi43MDcxOCAxMS4yOTNMMTYuMDAwMSAyMC41ODU5TDI1LjI5MyAxMS4yOTNMMjYuNzA3MiAxMi43MDcyTDE2LjcwNzIgMjIuNzA3MkMxNi4zMTY3IDIzLjA5NzcgMTUuNjgzNSAyMy4wOTc3IDE1LjI5MyAyMi43MDcyWiIvPjwvc3ZnPg==") center/contain no-repeat;
    transform: translateY(-50%);
    pointer-events: none;
  }
  .dds__select-wrapper:has(> .dds__select--sm)::after {
    inset-inline-end: var(--dds-input-padding-horizontal-sm);
  }
  .dds__select-wrapper:has(> .dds__select.dds__select--invalid) {
    --chevron-color: var(--dds-color-text-error-rest);
  }
  .dds__select-wrapper:has(> .dds__select:disabled) {
    --chevron-color: var(--dds-color-text-inactive);
  }
}
@layer component {
  :root,
  :host {
    --dds-date-picker-calendar-control-gap: var(--dds-size-8);
    --dds-date-picker-calendar-gap: var(--dds-size-16);
    --dds-date-picker-calendar-padding: var(--dds-size-24);
    --dds-date-picker-date-size: var(--dds-size-32);
    --dds-date-picker-grid-gap-column: var(--dds-size-4);
    --dds-date-picker-grid-gap-row: var(--dds-size-8);
    --dds-date-picker-select-width: var(--dds-size-80);
    --dds-date-picker-width: var(--dds-size-296);
  }
  .dds__calendar {
    box-sizing: border-box;
    display: inline-flex;
    flex-direction: column;
    background: var(--dds-color-background-surface-neutral);
    align-items: center;
  }
  .dds__calendar *,
  .dds__calendar *::before,
  .dds__calendar *::after {
    box-sizing: inherit;
  }
  .dds__calendar__header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    gap: var(--dds-date-picker-calendar-gap);
    margin-bottom: var(--dds-spacing-md);
  }
  .dds__calendar__header-display {
    display: flex;
    gap: var(--dds-date-picker-calendar-control-gap);
  }
  .dds__calendar__header-navigation {
    display: flex;
    gap: var(--dds-spacing-sm);
  }
  .dds__calendar .dds__select.dds__calendar__month-select,
  .dds__calendar .dds__select.dds__calendar__year-select {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: var(--dds-date-picker-select-width);
  }
  .dds__calendar__prev-button::after,
  .dds__calendar__next-button::after {
    content: "";
    display: block;
    width: var(--dds-icon-size-sm);
    height: var(--dds-icon-size-sm);
    background: var(--dds-color-text-brand-rest);
  }
  .dds__calendar__prev-button:disabled::after,
  .dds__calendar__next-button:disabled::after {
    background: var(--dds-color-text-inactive);
  }
  .dds__calendar__prev-button::after {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjI5Mzg3IDE1LjI5M0wxOS4yOTM5IDUuMjkyOTdMMjAuNzA4MSA2LjcwNzE4TDExLjQxNTIgMTYuMDAwMUwyMC43MDgxIDI1LjI5M0wxOS4yOTM5IDI2LjcwNzJMOS4yOTM4NyAxNi43MDcyQzguOTAzMzUgMTYuMzE2NyA4LjkwMzM1IDE1LjY4MzUgOS4yOTM4NyAxNS4yOTNaIi8+PC9zdmc+") center/var(--dds-size-20) no-repeat;
  }
  .dds__calendar__next-button::after {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMC41ODU5IDE2LjAwMDFMMTEuMjkzIDYuNzA3MThMMTIuNzA3MiA1LjI5Mjk3TDIyLjcwNzIgMTUuMjkzQzIzLjA5NzcgMTUuNjgzNSAyMy4wOTc3IDE2LjMxNjcgMjIuNzA3MiAxNi43MDcyTDEyLjcwNzIgMjYuNzA3MkwxMS4yOTMgMjUuMjkzTDIwLjU4NTkgMTYuMDAwMVoiLz48L3N2Zz4=") center/var(--dds-size-20) no-repeat;
  }
  .dds__calendar__body {
    margin-block: var(--dds-spacing-sm);
  }
  .dds__calendar__grid-head .dds__calendar__grid-row,
  .dds__calendar__grid-body .dds__calendar__grid-row {
    display: grid;
    grid-template-columns: repeat(7, var(--dds-date-picker-date-size));
    gap: var(--dds-date-picker-grid-gap-row) var(--dds-date-picker-grid-gap-column);
    justify-items: center;
  }
  .dds__calendar__grid-head,
  .dds__calendar__grid-body .dds__calendar__grid-row {
    margin-bottom: var(--dds-spacing-sm);
  }
  .dds__calendar__week-day {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-4-size);
    font-weight: var(--dds-typography-body-4-weight-strong);
    line-height: var(--dds-typography-body-4-line-height);
    max-width: 100%;
    color: var(--dds-color-text-tertiary);
  }
  .dds__calendar__day {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-strong);
    line-height: var(--dds-typography-body-3-line-height);
    display: flex;
    align-items: center;
    justify-content: center;
    padding-inline: var(--dds-spacing-sm);
    height: var(--dds-date-picker-date-size);
    width: var(--dds-date-picker-date-size);
    color: var(--dds-color-text-primary);
    border: 1px solid transparent;
    border-radius: var(--dds-border-radius-xs);
    background: transparent;
    cursor: pointer;
  }
  .dds__calendar__day:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
    outline: 0;
  }
  .dds__calendar__day:hover {
    background: var(--dds-color-background-brand-subtle-hover);
  }
  .dds__calendar__day:active {
    background: var(--dds-color-background-brand-subtle-pressed);
  }
  .dds__calendar__day.dds__calendar__day:focus-visible {
    background: var(--dds-color-background-brand-subtle-hover);
  }
  .dds__calendar__day.dds__calendar__day--focusable {
    border: var(--dds-border-width-xs) solid var(--dds-color-border-brand-base);
    color: var(--dds-color-text-brand-rest);
  }
  .dds__calendar__day.dds__calendar__day--focusable:active {
    color: var(--dds-color-text-brand-pressed);
  }
  .dds__calendar__day--today {
    position: relative;
    font-weight: var(--dds-font-weight-bold);
    color: var(--dds-color-text-primary);
  }
  .dds__calendar__day--today::before {
    content: "";
    position: absolute;
    width: var(--dds-spacing-xs);
    height: var(--dds-spacing-xs);
    border-radius: var(--dds-spacing-xs);
    bottom: var(--dds-spacing-xs);
    left: 50%;
    transform: translateX(-50%);
    background: var(--dds-color-text-primary);
  }
  .dds__calendar__day--today.dds__calendar__day--focusable::before {
    background: var(--dds-color-text-brand-rest);
  }
  .dds__calendar__day--today.dds__calendar__day--focusable:active::before {
    background: var(--dds-color-text-brand-pressed);
  }
  .dds__calendar__day--out-month {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    color: var(--dds-color-text-tertiary);
  }
  .dds__calendar__day--out-month.dds__calendar__day--today::before {
    background: var(--dds-color-text-tertiary);
  }
  .dds__calendar__day--selected {
    background: var(--dds-color-background-brand-base-rest);
    color: var(--dds-color-text-neutral);
  }
  .dds__calendar__day--selected:hover {
    background: var(--dds-color-background-brand-base-hover);
  }
  .dds__calendar__day--selected:active {
    background: var(--dds-color-background-brand-base-pressed);
  }
  .dds__calendar__day--selected.dds__calendar__day--today::before, .dds__calendar__day--selected.dds__calendar__day--today:hover::before, .dds__calendar__day--selected.dds__calendar__day--today:active::before {
    background: var(--dds-color-text-neutral);
  }
  .dds__calendar__day--selected.dds__calendar__day--focusable {
    color: var(--dds-color-text-neutral);
  }
  .dds__calendar__day--selected.dds__calendar__day--focusable:active {
    color: var(--dds-color-text-neutral);
  }
  .dds__calendar__day--selected.dds__calendar__day--focusable:focus-visible {
    background: var(--dds-color-background-brand-base-hover);
  }
  .dds__calendar__day--selected.dds__calendar__day--focusable:focus-visible::before {
    background: var(--dds-color-text-neutral);
  }
  .dds__calendar__day--inactive {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    color: var(--dds-color-text-inactive);
    cursor: not-allowed;
  }
  .dds__calendar__day--inactive:hover {
    border-color: transparent;
    background: transparent;
  }
  .dds__calendar__day--inactive:active {
    border: var(--dds-border-width-xs) solid var(--dds-color-border-inactive-base);
  }
  .dds__calendar__day--inactive.dds__calendar__day--today {
    font-weight: var(--dds-font-weight-bold);
  }
  .dds__calendar__day--inactive.dds__calendar__day--today::before {
    background: var(--dds-color-text-inactive);
  }
  .dds__calendar__day--inactive.dds__calendar__day--selected {
    border: transparent;
    background: var(--dds-color-background-surface-inactive);
    color: var(--dds-color-text-neutral);
  }
  .dds__calendar__day--inactive.dds__calendar__day--selected.dds__calendar__day--today::before {
    background: var(--dds-color-text-neutral);
  }
  .dds__calendar__day--inactive.dds__calendar__day--focusable {
    border: var(--dds-border-width-xs) solid var(--dds-color-border-inactive-base);
    color: var(--dds-color-text-inactive);
  }
  .dds__calendar__day--inactive.dds__calendar__day--selected.dds__calendar__day--focusable {
    border: transparent;
    background: var(--dds-color-background-surface-inactive);
    color: var(--dds-color-text-neutral);
  }
  .dds__calendar__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
  }
  .dds__button.dds__calendar__today-button {
    margin-inline-end: auto;
  }
  .dds__button.dds__calendar__confirm-button {
    margin-inline-start: var(--dds-spacing-sm);
  }
}
@layer component {
  :root,
  :host {
    --dds-card-border-radius: var(--dds-border-radius-xs);
    --dds-card-border-width: var(--dds-border-width-xs);
    --dds-card-clickable-motion-duration: 300ms;
    --dds-card-clickable-motion-easing: ease-out;
    --dds-card-gap: var(--dds-size-16);
    --dds-card-header-gap: var(--dds-size-8);
    --dds-card-padding: var(--dds-size-24);
  }
  :root,
  :host {
    --dds-card-clickable-color-background-hover: var(--dds-color-background-neutral-ghost-hover);
    --dds-card-clickable-color-background-inactive: var(--dds-color-background-surface-inactive);
    --dds-card-clickable-color-background-pressed: var(--dds-color-background-neutral-ghost-pressed);
    --dds-card-clickable-color-background-rest: var(--dds-color-background-neutral-ghost-rest);
    --dds-card-color-background: var(--dds-color-background-surface-neutral);
    --dds-card-color-border: var(--dds-color-border-neutral-pale);
    --dds-card-color-border-inactive: var(--dds-color-border-inactive-base);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-card-clickable-color-background-hover: var(--dds-color-background-neutral-ghost-hover);
      --dds-card-clickable-color-background-inactive: var(--dds-color-background-surface-inactive);
      --dds-card-clickable-color-background-pressed: var(--dds-color-background-neutral-ghost-pressed);
      --dds-card-clickable-color-background-rest: var(--dds-color-background-neutral-ghost-rest);
      --dds-card-color-background: var(--dds-color-background-surface-neutral);
      --dds-card-color-border: var(--dds-color-border-neutral-pale);
      --dds-card-color-border-inactive: var(--dds-color-border-inactive-base);
    }
  }
  .dds--light-mode {
    --dds-card-clickable-color-background-hover: var(--dds-color-background-neutral-ghost-hover);
    --dds-card-clickable-color-background-inactive: var(--dds-color-background-surface-inactive);
    --dds-card-clickable-color-background-pressed: var(--dds-color-background-neutral-ghost-pressed);
    --dds-card-clickable-color-background-rest: var(--dds-color-background-neutral-ghost-rest);
    --dds-card-color-background: var(--dds-color-background-surface-neutral);
    --dds-card-color-border: var(--dds-color-border-neutral-pale);
    --dds-card-color-border-inactive: var(--dds-color-border-inactive-base);
  }
  .dds--dark-mode {
    --dds-card-clickable-color-background-hover: var(--dds-color-background-neutral-ghost-hover);
    --dds-card-clickable-color-background-inactive: var(--dds-color-background-surface-inactive);
    --dds-card-clickable-color-background-pressed: var(--dds-color-background-neutral-ghost-pressed);
    --dds-card-clickable-color-background-rest: var(--dds-color-background-neutral-ghost-rest);
    --dds-card-color-background: var(--dds-color-background-surface-neutral);
    --dds-card-color-border: var(--dds-color-border-neutral-pale);
    --dds-card-color-border-inactive: var(--dds-color-border-inactive-base);
  }
  @property --dds-clickable-card-gradient-color {
    syntax: "<color>";
    inherits: true;
    initial-value: transparent;
  }
  @property --dds-ai-clickable-card-gradient-color {
    syntax: "<color>";
    inherits: true;
    initial-value: transparent;
  }
  .dds__card {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    color: var(--dds-color-text-primary);
    display: flex;
    flex-direction: column;
    background: var(--dds-card-color-background);
    border-radius: var(--dds-card-border-radius);
    border: var(--dds-card-border-width) solid var(--dds-card-color-border);
  }
  .dds__card--clickable {
    transition: --dds-clickable-card-gradient-color var(--dds-card-clickable-motion-easing) var(--dds-card-clickable-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__card--clickable {
      transition: none;
    }
  }
  .dds__card--clickable {
    --dds-clickable-card-gradient-color: var(--dds-card-clickable-color-background-rest);
    cursor: pointer;
    text-align: inherit;
    text-decoration: none;
    background: linear-gradient(0deg, var(--dds-clickable-card-gradient-color) 0%, var(--dds-clickable-card-gradient-color) 100%), var(--dds-card-color-background);
  }
  .dds__card--clickable:hover, .dds__card--clickable:focus-visible {
    --dds-clickable-card-gradient-color: var(--dds-card-clickable-color-background-hover);
  }
  .dds__card--clickable:active {
    --dds-clickable-card-gradient-color: var(--dds-card-clickable-color-background-pressed);
  }
  .dds__card--clickable:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
    outline: none;
  }
  .dds__card--clickable:disabled, .dds__card--clickable[aria-disabled=true] {
    color: var(--dds-color-text-inactive);
    background: var(--dds-card-clickable-color-background-inactive);
    cursor: not-allowed;
  }
  .dds__card.dds__card--ai {
    --border-color: var(--dds-ai-card-color-border-light);
    --border-color-inactive: var(--dds-ai-card-color-border-inactive);
    background: var(--dds-ai-card-color-background-light);
    border: var(--dds-ai-card-border) solid var(--border-color);
    border-radius: var(--dds-ai-card-border-radius);
  }
  .dds__card.dds__card--ai.dds__card--neutral {
    background: var(--dds-ai-card-color-background-neutral);
    border-color: var(--dds-ai-card-color-border-neutral);
  }
  .dds__card.dds__card--ai.dds__card--clickable {
    transition: --dds-ai-clickable-card-gradient-color var(--dds-ai-card-clickable-motion-easing) var(--dds-ai-card-clickable-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__card.dds__card--ai.dds__card--clickable {
      transition: none;
    }
  }
  .dds__card.dds__card--ai.dds__card--clickable {
    --dds-ai-clickable-card-gradient-color: var(--dds-ai-card-clickable-color-background-rest);
    --solid-background: var(--dds-ai-card-color-background-light);
    background: linear-gradient(0deg, var(--dds-ai-clickable-card-gradient-color) 0%, var(--dds-ai-clickable-card-gradient-color) 100%), var(--solid-background);
  }
  .dds__card.dds__card--ai.dds__card--clickable:hover, .dds__card.dds__card--ai.dds__card--clickable:focus-visible {
    --dds-ai-clickable-card-gradient-color: var(--dds-ai-card-clickable-color-background-hover);
  }
  .dds__card.dds__card--ai.dds__card--clickable:active {
    --dds-ai-clickable-card-gradient-color: var(--dds-ai-card-clickable-color-background-pressed);
  }
  .dds__card.dds__card--ai.dds__card--clickable:focus-visible {
    box-shadow: none;
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-ai-color-border-focus-base-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: custom;
  }
  .dds__card.dds__card--ai.dds__card--clickable:disabled, .dds__card.dds__card--ai.dds__card--clickable[aria-disabled=true] {
    border-color: var(--border-color-inactive);
    color: var(--dds-color-text-inactive);
    background: var(--dds-ai-card-clickable-color-background-inactive);
    cursor: not-allowed;
  }
  .dds__card.dds__card--ai.dds__card--clickable.dds__card--neutral {
    --solid-background: var(--dds-ai-card-color-background-neutral);
    --border-color: var(--dds-ai-card-color-border-neutral);
  }
}
@layer component {
  .dds__icon {
    --size: var(--dds-icon-size-xs);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
    fill: currentColor;
    font-family: "dds-icons";
    width: var(--size);
    height: var(--size);
    font-size: var(--size);
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
  }
  .dds__icon--2xs {
    --size: var(--dds-icon-size-2xs);
  }
  .dds__icon--xs {
    --size: var(--dds-icon-size-xs);
  }
  .dds__icon--sm {
    --size: var(--dds-icon-size-sm);
  }
  .dds__icon--md {
    --size: var(--dds-icon-size-md);
  }
  .dds__icon--lg {
    --size: var(--dds-icon-size-lg);
  }
  .dds__icon--xl {
    --size: var(--dds-icon-size-xl);
  }
  .dds__icon--2xl {
    --size: var(--dds-icon-size-2xl);
  }
}
@layer component {
  :root,
  :host {
    --dds-carousel-button-height: var(--dds-size-40);
    --dds-carousel-button-icon-height: var(--dds-size-12);
    --dds-carousel-button-icon-width-circle: var(--dds-size-12);
    --dds-carousel-button-icon-width-pill: var(--dds-size-32);
    --dds-carousel-button-width-circle: var(--dds-size-40);
    --dds-carousel-button-width-pill: var(--dds-size-56);
    --dds-carousel-gap: var(--dds-size-20);
    --dds-carousel-indicators-gap: var(--dds-size-8);
    --dds-carousel-min-width: var(--dds-size-240);
    --dds-carousel-motion-duration: 300ms;
    --dds-carousel-motion-easing: ease-out;
  }
  :root,
  :host {
    --dds-carousel-button-background: var(--dds-color-neutral-white-opacity-80);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-carousel-button-background: var(--dds-color-neutral-white-opacity-80);
    }
  }
  .dds--light-mode {
    --dds-carousel-button-background: var(--dds-color-neutral-white-opacity-80);
  }
  .dds--dark-mode {
    --dds-carousel-button-background: var(--dds-color-neutral-white-opacity-80);
  }
  .dds__carousel {
    box-sizing: border-box;
    display: block;
    width: 100%;
    position: relative;
  }
  .dds__carousel__container {
    position: relative;
    display: flex;
    align-items: stretch;
  }
  .dds__carousel__block-middle-left,
  .dds__carousel__block-middle-right {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    padding-inline: var(--dds-spacing-md);
  }
  .dds__carousel__floating-middle-left,
  .dds__carousel__floating-middle-right {
    pointer-events: none;
    position: absolute;
    z-index: 1;
    top: 50%;
    transform: translateY(-50%);
    padding-inline: var(--dds-spacing-md);
  }
  .dds__carousel__floating-middle-left {
    left: 0;
  }
  .dds__carousel__floating-middle-right {
    right: 0;
  }
  .dds__carousel__floating-middle-right .dds__button--minimal,
  .dds__carousel__floating-middle-left .dds__button--minimal {
    --background: var(--dds-carousel-button-background) !important;
  }
  .dds__carousel__floating-bottom-center {
    pointer-events: none;
    position: absolute;
    z-index: 1;
    bottom: var(--dds-spacing-md);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: var(--dds-spacing-md);
  }
  .dds__carousel__floating-bottom-left,
  .dds__carousel__floating-bottom-right {
    pointer-events: none;
    position: absolute;
    z-index: 1;
    bottom: var(--dds-spacing-md);
    display: flex;
    align-items: flex-start;
    gap: var(--dds-spacing-md);
  }
  .dds__carousel__floating-bottom-left {
    left: var(--dds-spacing-md);
  }
  .dds__carousel__floating-bottom-right {
    right: var(--dds-spacing-md);
  }
  .dds__carousel__block-bottom {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding-block: var(--dds-spacing-sm);
    padding-inline: var(--dds-spacing-3xl);
  }
  .dds__carousel__block-bottom-left {
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--dds-spacing-md);
  }
  .dds__carousel__block-bottom-center {
    grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--dds-spacing-md);
  }
  .dds__carousel__block-bottom-right {
    grid-column: 3;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--dds-spacing-xs);
  }
  .dds__carousel__block-bottom:has(> :only-child) {
    grid-template-columns: 1fr;
  }
  .dds__carousel__block-bottom:has(> :only-child) .dds__carousel__block-bottom-left,
  .dds__carousel__block-bottom:has(> :only-child) .dds__carousel__block-bottom-center,
  .dds__carousel__block-bottom:has(> :only-child) .dds__carousel__block-bottom-right {
    grid-column: 1;
  }
  .dds__carousel__block-bottom:has(.dds__carousel__block-bottom-left):has(.dds__carousel__block-bottom-right):not(:has(.dds__carousel__block-bottom-center)) {
    grid-template-columns: repeat(2, 1fr);
  }
  .dds__carousel__block-bottom:has(.dds__carousel__block-bottom-left):has(.dds__carousel__block-bottom-right):not(:has(.dds__carousel__block-bottom-center)) .dds__carousel__block-bottom-right {
    grid-column: 2;
  }
  .dds__carousel__block-bottom--no-padding {
    padding-inline: 0;
  }
  .dds__carousel__viewport {
    flex: 1;
    overflow: hidden;
  }
  .dds__carousel__track {
    --track-item-padding: var(--dds-spacing-lg);
    display: flex;
    position: relative;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    min-height: inherit;
    margin-left: calc(var(--track-item-padding) * -1);
  }
  .dds__carousel__item {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    flex: 0 0 100%;
    padding-left: var(--track-item-padding);
    scroll-snap-align: start;
    box-sizing: border-box;
  }
  .dds__button.dds__carousel__arrows__next,
  .dds__button.dds__carousel__arrows__prev {
    pointer-events: initial;
  }
  .dds__button.dds__carousel__arrows__next::before,
  .dds__button.dds__carousel__arrows__prev::before {
    content: "";
    display: inline-block;
    width: var(--dds-icon-size-md);
    height: var(--dds-icon-size-md);
    background: var(--dds-color-text-neutral-rest);
  }
  .dds__button.dds__carousel__arrows__next:disabled::before,
  .dds__button.dds__carousel__arrows__prev:disabled::before {
    background: var(--dds-color-text-inactive);
  }
  .dds__button.dds__carousel__arrows__next::before {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMC41ODU5IDE2LjAwMDFMMTEuMjkzIDYuNzA3MThMMTIuNzA3MiA1LjI5Mjk3TDIyLjcwNzIgMTUuMjkzQzIzLjA5NzcgMTUuNjgzNSAyMy4wOTc3IDE2LjMxNjcgMjIuNzA3MiAxNi43MDcyTDEyLjcwNzIgMjYuNzA3MkwxMS4yOTMgMjUuMjkzTDIwLjU4NTkgMTYuMDAwMVoiLz48L3N2Zz4=") center/var(--dds-icon-size-md) no-repeat;
  }
  .dds__button.dds__carousel__arrows__prev::before {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjI5Mzg3IDE1LjI5M0wxOS4yOTM5IDUuMjkyOTdMMjAuNzA4MSA2LjcwNzE4TDExLjQxNTIgMTYuMDAwMUwyMC43MDgxIDI1LjI5M0wxOS4yOTM5IDI2LjcwNzJMOS4yOTM4NyAxNi43MDcyQzguOTAzMzUgMTYuMzE2NyA4LjkwMzM1IDE1LjY4MzUgOS4yOTM4NyAxNS4yOTNaIi8+PC9zdmc+") center/var(--dds-icon-size-md) no-repeat;
  }
  .dds__carousel__indicators {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    gap: var(--dds-carousel-indicators-gap);
  }
  .dds__carousel__floating-bottom-center .dds__carousel__indicators, .dds__carousel__floating-bottom-left .dds__carousel__indicators, .dds__carousel__floating-bottom-right .dds__carousel__indicators {
    background: var(--dds-carousel-button-background);
    border-radius: var(--dds-border-radius-sm);
  }
  .dds__carousel__indicators__button {
    pointer-events: initial;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    height: var(--dds-carousel-button-height);
    width: var(--dds-carousel-button-width-circle);
  }
  .dds__carousel__indicators__button::before {
    --dot-background: var(--dds-color-background-neutral-base-rest);
    content: "";
    display: inline-block;
    width: var(--dds-carousel-button-icon-width-circle);
    height: var(--dds-carousel-button-icon-height);
    background: var(--dot-background);
    border-radius: var(--dds-border-radius-rounded);
    transition: all var(--dds-carousel-motion-easing) var(--dds-carousel-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__carousel__indicators__button::before {
      transition: none;
    }
  }
  .dds__carousel__indicators__button:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
    outline: 0;
  }
  .dds__carousel__indicators__button--active::before {
    --dot-background: var(--dds-color-background-neutral-base-rest);
    width: var(--dds-carousel-button-icon-width-pill);
  }
}
@layer component {
  :root,
  :host {
    --dds-checkbox-motion-duration: 100ms;
    --dds-checkbox-motion-easing: ease-out;
    --dds-checkbox-size-lg: var(--dds-size-20);
    --dds-checkbox-size-sm: var(--dds-size-16);
  }
  .dds__checkbox {
    --size: var(--dds-checkbox-size-lg);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-neutral-base);
    --icon-size: var(--dds-icon-size-2xs);
    --icon-color: var(--dds-color-text-neutral);
    --icon: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxMiAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgNkw0IDlMMTEgMSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==");
    appearance: none;
    margin: 0;
    outline: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    height: var(--size);
    width: var(--size);
    border: var(--dds-border-width-xs) solid var(--border-color);
    border-radius: var(--dds-border-radius-xs);
    background: var(--background);
  }
  .dds__checkbox:hover, .dds__checkbox:focus-visible {
    transition: border-color var(--dds-checkbox-motion-easing) var(--dds-checkbox-motion-duration), background var(--dds-checkbox-motion-easing) var(--dds-checkbox-motion-duration), box-shadow var(--dds-checkbox-motion-easing) var(--dds-checkbox-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__checkbox:hover, .dds__checkbox:focus-visible {
      transition: none;
    }
  }
  .dds__checkbox::after {
    content: "";
    display: none;
    width: var(--size);
    height: var(--size);
    mask: var(--icon) center/var(--icon-size) no-repeat;
    background: var(--icon-color);
  }
  .dds__checkbox:hover, .dds__checkbox:focus-visible {
    --border-color: var(--dds-color-border-neutral-base);
    --background: var(--dds-color-background-neutral-subtle-hover);
  }
  .dds__checkbox:active {
    --background: var(--dds-color-background-neutral-subtle-pressed);
  }
  .dds__checkbox:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__checkbox:checked, .dds__checkbox:indeterminate {
    --background: var(--dds-color-background-brand-base-rest);
    --border-color: var(--dds-color-background-brand-base-rest);
  }
  .dds__checkbox:checked:hover, .dds__checkbox:checked:focus-visible, .dds__checkbox:indeterminate:hover, .dds__checkbox:indeterminate:focus-visible {
    --background: var(--dds-color-background-brand-base-hover);
  }
  .dds__checkbox:checked:active, .dds__checkbox:indeterminate:active {
    --background: var(--dds-color-background-brand-base-pressed);
  }
  .dds__checkbox:checked::after, .dds__checkbox:indeterminate::after {
    display: inline-flex;
  }
  .dds__checkbox:indeterminate::after {
    --icon: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGxpbmUgeDE9IjYiIHkxPSIxNiIgeDI9IjI2IiB5Mj0iMTYiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiAvPgo8L3N2Zz4=");
  }
  .dds__checkbox:disabled {
    --background: var(--dds-color-background-surface-inactive);
    --border-color: var(--dds-color-border-inactive-base);
    cursor: not-allowed;
  }
  .dds__checkbox:disabled::after {
    --icon-color: var(--dds-color-text-inactive);
  }
  .dds__checkbox:disabled:hover {
    --background: var(--dds-color-background-surface-inactive);
  }
  .dds__checkbox--sm {
    --size: var(--dds-checkbox-size-sm);
    --icon-size: var(--dds-spacing-sm);
  }
  .dds__checkbox.dds__checkbox--invalid {
    --border-color: var(--dds-color-border-error-base);
  }
  .dds__checkbox.dds__checkbox--invalid:hover {
    --background: var(--dds-color-background-error-subtle-hover);
  }
  .dds__checkbox.dds__checkbox--invalid:active {
    --background: var(--dds-color-background-error-subtle-pressed);
  }
  .dds__checkbox.dds__checkbox--invalid:focus-visible {
    --background: var(--dds-color-background-error-subtle-hover);
  }
  .dds__checkbox.dds__checkbox--invalid:checked, .dds__checkbox.dds__checkbox--invalid:indeterminate {
    --background: var(--dds-color-background-error-base-rest);
    --border-color: transparent;
  }
  .dds__checkbox.dds__checkbox--invalid:checked:focus-visible, .dds__checkbox.dds__checkbox--invalid:checked:hover, .dds__checkbox.dds__checkbox--invalid:indeterminate:focus-visible, .dds__checkbox.dds__checkbox--invalid:indeterminate:hover {
    --background: var(--dds-color-background-error-base-hover);
  }
  .dds__checkbox.dds__checkbox--invalid:checked:active, .dds__checkbox.dds__checkbox--invalid:indeterminate:active {
    --background: var(--dds-color-background-error-base-pressed);
  }
  .dds__checkbox.dds__checkbox--invalid:disabled {
    --background: var(--dds-color-background-surface-inactive);
    --border-color: var(--dds-color-border-inactive-base);
    cursor: not-allowed;
  }
  .dds__checkbox.dds__checkbox--invalid:disabled::after {
    --icon-color: var(--dds-color-text-inactive);
  }
  .dds__checkbox.dds__checkbox--invalid:disabled:hover {
    --background: var(--dds-color-background-surface-inactive);
  }
}
@layer component {
  .dds__cite {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    color: var(--dds-color-text-secondary);
  }
}
@layer component {
  .dds__text-input,
  .dds__input-group {
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-neutral-pale);
    --color: var(--dds-color-text-primary);
    --height: var(--dds-input-height-lg);
    --padding-horizontal: var(--dds-input-padding-horizontal-lg);
    --radius: var(--dds-border-radius-xs);
    appearance: none;
    outline: var(--dds-border-radius-sm) solid transparent;
    outline-offset: var(--dds-border-radius-sm);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    background: var(--background);
    border-radius: var(--radius);
    border: var(--dds-border-width-xs) solid var(--border-color);
    box-sizing: border-box;
    color: var(--color);
    height: var(--height);
    width: 100%;
    padding-inline: var(--padding-horizontal);
  }
  .dds__text-input:hover, .dds__text-input:focus {
    --border-color: var(--dds-color-border-brand-base);
    transition: border-color var(--dds-input-motion-easing) var(--dds-input-motion-duration), background var(--dds-input-motion-easing) var(--dds-input-motion-duration), outline-color var(--dds-input-motion-easing) var(--dds-input-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__text-input:hover, .dds__text-input:focus {
      transition: none;
    }
  }
  .dds__text-input:focus {
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-color-border-focus-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__text-input:disabled {
    --border-color: var(--dds-color-border-inactive-base);
    --color: var(--dds-color-text-inactive);
    --background: var(--dds-color-background-surface-inactive);
    cursor: not-allowed;
  }
  .dds__text-input:read-only:not(:disabled) {
    --border-color: var(--dds-color-border-neutral-pale);
    --color: var(--dds-color-text-primary);
    --background: var(--dds-color-background-surface-primary);
  }
  .dds__text-input::placeholder {
    color: var(--dds-color-text-tertiary);
  }
  .dds__text-input[type=password]::-ms-reveal, .dds__text-input[type=password]::-ms-clear {
    display: none;
  }
  .dds__text-input--sm {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    --padding-horizontal: var(--dds-input-padding-horizontal-sm);
    --height: var(--dds-input-height-sm);
  }
  .dds__text-input.dds__text-input--invalid,
  .dds__text-input.dds__text-input--invalid:read-only {
    --border-color: var(--dds-color-text-error-rest);
  }
  .dds__text-input--ai {
    --border-color: var(--dds-ai-color-border-neutral-pale);
    --background: var(--dds-color-background-surface-neutral);
    --color: var(--dds-ai-color-text-primary);
    --radius: var(--dds-border-radius-md);
  }
  .dds__text-input--ai::placeholder {
    color: var(--dds-ai-color-text-tertiary);
  }
  .dds__text-input--ai:hover {
    --border-color: var(--dds-ai-color-border-neutral-base);
  }
  .dds__text-input--ai:focus {
    --border-color: var(--dds-ai-color-border-neutral-base);
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-ai-color-border-focus-base-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: var(--dds-border-radius-md);
  }
  .dds__text-input--ai:disabled {
    --border-color: var(--dds-ai-color-border-neutral-inactive);
    --background: var(--dds-color-background-surface-inactive);
  }
  .dds__text-input--ai:disabled::placeholder {
    color: var(--dds-ai-color-text-inactive);
  }
  .dds__text-input--ai:read-only:not(:disabled) {
    --border-color: var(--dds-ai-color-border-neutral-pale);
    --background: var(--dds-color-background-surface-neutral);
  }
  .dds__text-input--ai.dds__text-input--invalid,
  .dds__text-input--ai.dds__text-input--invalid:read-only {
    --border-color: var(--dds-ai-color-border-error-base);
  }
  .dds__input-group {
    --gap: var(--dds-input-gap-lg);
    align-items: center;
    cursor: text;
    display: inline-flex;
    gap: var(--gap);
    vertical-align: middle;
  }
  .dds__input-group:hover, .dds__input-group:has(.dds__text-input:focus) {
    --border-color: var(--dds-color-border-brand-base);
    transition: border-color var(--dds-input-motion-easing) var(--dds-input-motion-duration), background var(--dds-input-motion-easing) var(--dds-input-motion-duration), outline-color var(--dds-input-motion-easing) var(--dds-input-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__input-group:hover, .dds__input-group:has(.dds__text-input:focus) {
      transition: none;
    }
  }
  .dds__input-group:has(.dds__text-input:focus) {
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-color-border-focus-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__input-group:has(.dds__text-input:read-only) {
    --border-color: var(--dds-color-border-neutral-pale);
    --color: var(--dds-color-text-primary);
    cursor: default;
  }
  .dds__input-group:has(.dds__text-input:read-only) .dds__input-addon {
    pointer-events: none;
  }
  .dds__input-group:has(.dds__text-input:disabled) {
    --border-color: var(--dds-color-border-inactive-base);
    --color: var(--dds-color-text-inactive);
    --background: var(--dds-color-background-surface-inactive);
    cursor: not-allowed;
  }
  .dds__input-group:has(.dds__text-input:disabled) .dds__input-addon {
    pointer-events: none;
    color: var(--color);
  }
  .dds__input-group:has(.dds__text-input.dds__text-input--invalid) {
    --border-color: var(--dds-color-text-error-rest);
  }
  .dds__input-group:has(.dds__text-input--sm) {
    --padding-horizontal: var(--dds-input-padding-horizontal-sm);
    --height: var(--dds-input-height-sm);
    --gap: var(--dds-input-gap-sm);
  }
  .dds__input-group .dds__text-input {
    border: 0;
    padding: 0;
    display: flex;
    width: 100%;
    border-radius: 0;
    height: fit-content;
    outline: 0;
    outline-width: 0;
  }
  .dds__input-group .dds__text-input:focus {
    border: 0;
    box-shadow: none;
    transition: none;
  }
  .dds__input-addon {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    color: var(--dds-color-text-secondary);
    display: inline-flex;
    align-self: center;
    gap: var(--dds-input-gap-sm);
    user-select: none;
  }
  .dds__input-group--ai {
    --border-color: var(--dds-ai-color-border-neutral-pale);
    --radius: var(--dds-border-radius-md);
  }
  .dds__input-group--ai:hover {
    --border-color: var(--dds-ai-color-border-neutral-base);
  }
  .dds__input-group--ai:has(.dds__text-input:focus) {
    --border-color: var(--dds-ai-color-border-neutral-base);
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-ai-color-border-focus-base-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: var(--dds-border-radius-md);
  }
  .dds__input-group--ai:has(.dds__text-input:read-only) {
    --border-color: var(--dds-ai-color-border-neutral-pale);
  }
  .dds__input-group--ai:has(.dds__text-input:disabled) {
    --border-color: var(--dds-ai-color-border-neutral-inactive);
    --background: var(--dds-color-background-surface-inactive);
  }
  .dds__input-group--ai:has(.dds__text-input.dds__text-input--invalid) {
    --border-color: var(--dds-ai-color-border-error-base);
  }
}
@layer component {
  .dds__date-picker {
    display: inline-flex;
    box-sizing: border-box;
    width: 100%;
  }
  .dds__date-picker *,
  .dds__date-picker *::before,
  .dds__date-picker *::after {
    box-sizing: inherit;
  }
  .dds__date-picker__calendar-button::before {
    content: "";
    display: block;
    width: var(--dds-icon-size-xs);
    height: var(--dds-icon-size-xs);
    background: var(--dds-color-background-brand-base-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yOCA1LjAwMDA1QzI4IDQuNDQ3NzcgMjcuNTUyMyA0LjAwMDA1IDI3IDQuMDAwMDVIMjIuMDAwNFYySDIwLjAwMDRWNC4wMDAwNUgxMi4wMDAxVjJIMTAuMDAwMVY0LjAwMDA1SDVDNC40NTUzMyA0LjAwMDA1IDQgNC40NTUzOCA0IDUuMDAwMDVWMjdDNCAyNy41NTIzIDQuNDQ3NzIgMjggNSAyOEgyN0MyNy41NTIzIDI4IDI4IDI3LjU1MjMgMjggMjdWNS4wMDAwNVpNMjAuMDAwNCA2LjAwMDA1SDEyLjAwMDFWOEgxMC4wMDAxVjYuMDAwMDVINlYxMC4wMDAySDI2VjYuMDAwMDVIMjIuMDAwNFY4SDIwLjAwMDRWNi4wMDAwNVpNMjYgMTIuMDAwMkg2VjI2SDI2VjEyLjAwMDJaIi8+PC9zdmc+") center/var(--dds-icon-size-xs) no-repeat;
  }
  .dds__date-picker__calendar-button:is(:disabled, [aria-disabled=true], [readonly], [aria-readonly=true])::before {
    background: var(--dds-color-text-inactive);
  }
  .dds__date-picker__calendar-button.dds__button--xs {
    padding-inline: var(--dds-spacing-xs);
  }
  .dds__date-picker__calendar-container {
    box-shadow: var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
    --popup-gap-custom: var(--dds-spacing-xs);
  }
  .dds__calendar {
    align-items: center;
    background: var(--dds-color-background-surface-primary);
    border-radius: var(--dds-border-radius-xs);
    padding: var(--dds-date-picker-calendar-padding);
    overflow-x: hidden;
    overflow-y: auto;
  }
  .dds__calendar:focus, .dds__calendar:focus-visible, .dds__calendar:focus-within {
    outline: 0;
  }
  .dds__calendar[popover]:popover-open {
    display: inherit;
  }
}
@layer component {
  :root,
  :host {
    --dds-divider-thick: var(--dds-size-4);
    --dds-divider-thin: var(--dds-size-1);
  }
  .dds__divider {
    --stroke: var(--dds-divider-thick);
    margin: 0;
    display: block;
    background: var(--dds-color-background-surface-secondary);
    height: var(--stroke);
    border: 0;
  }
  .dds__divider--vertical {
    display: inline-block;
    vertical-align: middle;
    width: var(--stroke);
    height: unset;
    min-height: 1em;
  }
  .dds__divider--thin {
    --stroke: var(--dds-divider-thin);
  }
}
@layer component {
  :root,
  :host {
    --dds-drawer-gap: var(--dds-size-24);
    --dds-drawer-padding-bottom: var(--dds-size-32);
    --dds-drawer-padding-horizontal: var(--dds-size-24);
    --dds-drawer-padding-top: var(--dds-size-16);
    --dds-drawer-width-lg: var(--dds-size-1200);
    --dds-drawer-width-md: var(--dds-size-920);
    --dds-drawer-width-sm: var(--dds-size-560);
    --dds-drawer-width-xs: var(--dds-size-320);
  }
  @keyframes ddsDrawerSlideIn {
    from {
      transform: translateX(100%);
    }
    to {
      transform: translateX(0);
    }
  }
  @keyframes ddsDrawerSlideOut {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(100%);
    }
  }
  @keyframes ddsDrawerBackdropOpen {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  @keyframes ddsDrawerBackdropClose {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  .dds__drawer {
    --current-width: var(--dds-drawer-width-lg);
    border: 0;
    padding: 0;
    max-width: none;
    max-height: none;
    background: transparent;
    outline: none;
    overflow: visible;
  }
  .dds__drawer::backdrop {
    background: var(--dds-color-background-surface-overlay);
  }
  .dds__drawer[open]::backdrop {
    animation: ddsDrawerBackdropOpen var(--dds-motion-duration-03) ease-out forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__drawer[open]::backdrop {
      animation: none;
    }
  }
  .dds__drawer[open] .dds__drawer__container {
    animation: ddsDrawerSlideIn var(--dds-motion-duration-03) ease-out forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__drawer[open] .dds__drawer__container {
      animation: none;
    }
  }
  .dds__drawer.dds__drawer--closing::backdrop {
    animation: ddsDrawerBackdropClose var(--dds-motion-duration-03) ease-in forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__drawer.dds__drawer--closing::backdrop {
      animation: none;
    }
  }
  .dds__drawer.dds__drawer--closing .dds__drawer__container {
    animation: ddsDrawerSlideOut var(--dds-motion-duration-03) ease-in forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__drawer.dds__drawer--closing .dds__drawer__container {
      animation: none;
    }
  }
  .dds__drawer__container {
    position: fixed;
    inset-block: 0;
    inset-inline-end: 0;
    display: flex;
    flex-direction: column;
    container-type: inline-size;
    background: var(--dds-color-background-surface-neutral);
    max-inline-size: 90%;
    inline-size: var(--current-width);
    min-inline-size: var(--dds-drawer-width-xs);
    gap: var(--dds-drawer-gap);
    padding: var(--dds-drawer-padding-top) var(--dds-drawer-padding-horizontal) var(--dds-drawer-padding-bottom);
    color: var(--dds-color-text-primary);
    box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
  }
  .dds__drawer--md {
    --current-width: var(--dds-drawer-width-md);
  }
  .dds__drawer--sm {
    --current-width: var(--dds-drawer-width-sm);
  }
  .dds__drawer--xs {
    --current-width: var(--dds-drawer-width-xs);
  }
  .dds__drawer__header {
    flex: 0 0 auto;
  }
  .dds__drawer__close::before {
    content: "";
    display: inline-block;
    inline-size: var(--dds-icon-size-sm);
    margin-inline-end: var(--dds-spacing-xs);
    aspect-ratio: 1;
    background: currentColor;
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjI5Mzg3IDE1LjI5M0wxOS4yOTM5IDUuMjkyOTdMMjAuNzA4MSA2LjcwNzE4TDExLjQxNTIgMTYuMDAwMUwyMC43MDgxIDI1LjI5M0wxOS4yOTM5IDI2LjcwNzJMOS4yOTM4NyAxNi43MDcyQzguOTAzMzUgMTYuMzE2NyA4LjkwMzM1IDE1LjY4MzUgOS4yOTM4NyAxNS4yOTNaIi8+PC9zdmc+") center/contain no-repeat;
  }
  .dds__drawer__body {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    flex: 1 1 auto;
    overflow: auto;
  }
  @supports (scrollbar-width: thin) {
    .dds__drawer__body {
      scrollbar-width: thin;
      scrollbar-color: var(--dds-color-background-surface-tertiary) var(--dds-color-background-surface-neutral);
      scrollbar-gutter: auto;
    }
  }
  .dds__drawer__body:focus {
    outline: 0;
  }
  .dds__drawer__footer {
    display: flex;
    flex: 0 0 auto;
  }
  @media screen and (max-inline-size: 768px) {
    .dds__drawer__container {
      max-inline-size: 100%;
      inline-size: 100%;
      min-inline-size: 0;
    }
  }
}
@layer component {
  :root,
  :host {
    --dds-menu-gap: var(--dds-size-4);
    --dds-menu-item-active-border-width: var(--dds-size-4);
    --dds-menu-item-gap: var(--dds-size-8);
    --dds-menu-item-indent: var(--dds-size-36);
    --dds-menu-item-line-size-lg: var(--dds-size-24);
    --dds-menu-item-line-size-md: var(--dds-size-20);
    --dds-menu-item-line-size-sm: var(--dds-size-20);
    --dds-menu-item-padding-lg: var(--dds-size-12);
    --dds-menu-item-padding-md: var(--dds-size-8);
    --dds-menu-item-padding-sm: var(--dds-size-8);
    --dds-menu-motion-duration: 300ms;
    --dds-menu-motion-easing: ease-out;
    --dds-menu-padding: var(--dds-size-4);
  }
  :root,
  :host {
    --dds-menu-item-active-border-color: var(--dds-color-blue-50);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-menu-item-active-border-color: var(--dds-color-blue-50);
    }
  }
  .dds--light-mode {
    --dds-menu-item-active-border-color: var(--dds-color-blue-50);
  }
  .dds--dark-mode {
    --dds-menu-item-active-border-color: var(--dds-color-blue-50);
  }
  .dds__menu {
    --item-padding: var(--dds-menu-item-padding-lg);
    --item-gap: var(--dds-menu-item-gap);
    --item-background: transparent;
    --item-background-hover: var(--dds-color-background-neutral-subtle-hover);
    --item-background-active: var(--dds-color-background-neutral-subtle-pressed);
    --item-background-inactive: transparent;
    --item-color: var(--dds-color-text-neutral-rest);
    --item-color-hover: var(--dds-color-text-neutral-hover);
    --item-color-active: var(--dds-color-text-neutral-pressed);
    --item-color-inactive: var(--dds-color-text-inactive);
    --checkbox-margin-block: calc(
        var(--dds-menu-item-line-size-lg) - var(--dds-checkbox-size-sm)
    );
    --checkbox-background-color: var(--dds-color-background-surface-neutral);
    --checkbox-border-color: var(--dds-color-border-neutral-base);
    --checkbox-icon-color: var(--dds-color-text-neutral);
    display: flex;
    flex-direction: column;
    gap: var(--dds-menu-gap);
    padding: var(--dds-menu-padding);
    color: var(--dds-color-text-primary);
    background: transparent;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
  }
  .dds__menu .dds__icon {
    --size: var(--dds-icon-size-sm);
  }
  .dds__menu:focus {
    outline: none;
  }
  .dds__menu--md {
    --item-padding: var(--dds-menu-item-padding-md);
    --checkbox-margin-block: calc(
        var(--dds-menu-item-line-size-md) - var(--dds-checkbox-size-sm)
    );
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__menu--md .dds__menu-item,
  .dds__menu--md .dds__menu-group__label--collapsible {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__menu--md .dds__menu-group__label--display {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-strong);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__menu--sm {
    --item-padding: var(--dds-menu-item-padding-sm);
    --checkbox-margin-block: calc(
        var(--dds-menu-item-line-size-sm) - var(--dds-checkbox-size-sm)
    );
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-4-size);
    font-weight: var(--dds-typography-body-4-weight-default);
    line-height: var(--dds-typography-body-4-line-height);
  }
  .dds__menu--sm .dds__menu-item,
  .dds__menu--sm .dds__menu-group__label--collapsible {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-4-size);
    font-weight: var(--dds-typography-body-4-weight-default);
    line-height: var(--dds-typography-body-4-line-height);
  }
  .dds__menu--sm .dds__menu-group__label--display {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-4-size);
    font-weight: var(--dds-typography-body-4-weight-strong);
    line-height: var(--dds-typography-body-4-line-height);
  }
  .dds__menu--sm .dds__icon {
    --size: var(--dds-icon-size-xs);
  }
  .dds__menu-item,
  .dds__menu-group__label--collapsible {
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    border: 0;
    width: 100%;
    display: flex;
    align-items: flex-start;
    padding-inline: var(--item-padding);
    padding-block: var(--item-padding);
    gap: var(--item-gap);
    color: var(--item-color);
    background: var(--item-background);
    border-radius: var(--dds-border-radius-xs);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
  }
  .dds__menu-item:hover, .dds__menu-item:focus-visible,
  .dds__menu-group__label--collapsible:hover,
  .dds__menu-group__label--collapsible:focus-visible {
    transition: background var(--dds-menu-motion-easing) var(--dds-menu-motion-duration), box-shadow var(--dds-menu-motion-easing) var(--dds-menu-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__menu-item:hover, .dds__menu-item:focus-visible,
    .dds__menu-group__label--collapsible:hover,
    .dds__menu-group__label--collapsible:focus-visible {
      transition: none;
    }
  }
  .dds__menu-item:hover,
  .dds__menu-group__label--collapsible:hover {
    --item-color: var(--item-color-hover);
    --item-background: var(--item-background-hover);
  }
  .dds__menu-item:active,
  .dds__menu-group__label--collapsible:active {
    --item-color: var(--item-color-active);
    --item-background: var(--item-background-active);
  }
  .dds__menu-item:focus-visible,
  .dds__menu-group__label--collapsible:focus-visible {
    outline: 0;
    border-radius: var(--dds-border-radius-xs);
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
    --item-color: var(--item-color-hover);
    --item-background: var(--item-background-hover);
  }
  .dds__menu-item:disabled,
  .dds__menu-group__label--collapsible:disabled {
    --item-color: var(--item-color-inactive);
    --item-background: var(--item-background-inactive);
    cursor: not-allowed;
  }
  .dds__menu-item--destructive {
    --item-background: semantic-color(--dds-color-background-error-subtle-rest);
    --item-background-hover: var(--dds-color-background-error-subtle-hover);
    --item-background-active: var(--dds-color-background-error-subtle-pressed);
    --item-background-inactive: transparent;
    --item-color: var(--dds-color-text-error-rest);
    --item-color-hover: var(--dds-color-text-error-hover);
    --item-color-active: var(--dds-color-text-error-pressed);
    --item-color-inactive: var(--dds-color-border-inactive-base);
  }
  .dds__menu-item--check-selection.dds__menu-item--selected:has(::after) {
    padding-inline-end: calc(var(--item-padding) * 3);
  }
  .dds__menu-item--check-selection.dds__menu-item--selected::after {
    content: "";
    position: absolute;
    width: var(--dds-icon-size-sm);
    height: var(--dds-icon-size-sm);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTYuMjkyOTcgMTcuNzA3N0wxMi4yOTMgMjMuNzA3N0MxMi42ODM1IDI0LjA5ODIgMTMuMzE2NyAyNC4wOTgyIDEzLjcwNzIgMjMuNzA3N0wyNi43MDcyIDEwLjcwNzdMMjUuMjkzIDkuMjkzNDZMMTMuMDAwMSAyMS41ODYzTDcuNzA3MTggMTYuMjkzNEw2LjI5Mjk3IDE3LjcwNzdaIi8+PC9zdmc+") center/var(--dds-icon-size-sm) no-repeat;
    background: var(--dds-color-text-neutral-rest);
    inset-inline-end: var(--item-padding);
  }
  .dds__menu-group,
  .dds__menu-group__content {
    display: flex;
    flex-direction: column;
    gap: var(--dds-menu-gap);
  }
  .dds__menu-group__content--collapsed {
    display: none;
  }
  .dds__menu-group__content--collapsible .dds__menu-item,
  .dds__menu-group__content--collapsible .dds__menu-group__label--collapsible {
    padding-inline-start: calc(1 * var(--dds-menu-item-indent));
  }
  .dds__menu-group__content--collapsible .dds__menu-group__content--collapsible .dds__menu-item,
  .dds__menu-group__content--collapsible .dds__menu-group__content--collapsible .dds__menu-group__label--collapsible {
    padding-inline-start: calc(2 * var(--dds-menu-item-indent));
  }
  .dds__menu-group__label--display {
    display: flex;
    align-items: center;
    gap: var(--item-gap);
    padding-inline: var(--item-padding);
    padding-block: var(--item-padding);
    color: var(--dds-color-text-primary);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-strong);
    line-height: var(--dds-typography-body-2-line-height);
  }
  .dds__menu-group__label--collapsible {
    padding-inline-end: calc(var(--item-padding) * 2 + var(--dds-icon-size-sm));
  }
  .dds__menu-group__label--collapsible::after {
    content: "";
    position: absolute;
    width: var(--dds-icon-size-sm);
    height: var(--dds-icon-size-sm);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNS4yOTMgMjIuNzA3Mkw1LjI5Mjk3IDEyLjcwNzJMNi43MDcxOCAxMS4yOTNMMTYuMDAwMSAyMC41ODU5TDI1LjI5MyAxMS4yOTNMMjYuNzA3MiAxMi43MDcyTDE2LjcwNzIgMjIuNzA3MkMxNi4zMTY3IDIzLjA5NzcgMTUuNjgzNSAyMy4wOTc3IDE1LjI5MyAyMi43MDcyWiIvPjwvc3ZnPg==") center/var(--dds-icon-size-sm) no-repeat;
    background: var(--dds-color-text-neutral-rest);
    inset-inline-end: var(--item-padding);
    transform: rotate(180deg);
  }
  .dds__menu-group__label--collapsed::after {
    transform: rotate(0deg);
  }
  .dds__menu-item--checkbox-selection::before {
    content: "";
    position: relative;
    box-sizing: border-box;
    flex-shrink: 0;
    width: var(--dds-checkbox-size-sm);
    height: var(--dds-checkbox-size-sm);
    border: var(--dds-border-width-xs) solid var(--checkbox-border-color);
    border-radius: var(--dds-border-radius-xs);
    background: var(--checkbox-background-color);
    margin-block: calc(var(--checkbox-margin-block) / 2);
  }
  .dds__menu-item--checkbox-selection.dds__menu-item--selected::before {
    --checkbox-icon-color: var(--dds-color-background-brand-base-rest);
    --checkbox-border-color: var(--dds-color-background-brand-base-rest);
    background: var(--checkbox-icon-color) url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAxMiAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgNkw0IDlMMTEgMSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==") center/0.5rem no-repeat;
    border-color: var(--checkbox-icon-color);
  }
  .dds__menu-item--checkbox-selection.dds__menu-item--mixed::before {
    --checkbox-icon-color: var(--dds-color-background-brand-base-rest);
    --checkbox-border-color: var(--dds-color-background-brand-base-rest);
    background: var(--checkbox-icon-color) url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGxpbmUgeDE9IjYiIHkxPSIxNiIgeDI9IjI2IiB5Mj0iMTYiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiAvPgo8L3N2Zz4=") center/0.5rem no-repeat;
    border-color: var(--checkbox-icon-color);
  }
  .dds__menu-item--checkbox-selection.dds__menu-item--selected::after {
    display: none;
  }
  .dds__menu-item--checkbox-selection:disabled::before {
    --checkbox-background-color: var(--dds-color-background-surface-inactive);
    --checkbox-border-color: var(--dds-color-background-surface-inactive);
    --checkbox-icon-color: var(--dds-color-text-inactive);
  }
}
@layer component {
  :root,
  :host {
    --dds-tag-gap-lg: var(--dds-size-8);
    --dds-tag-gap-md: var(--dds-size-4);
    --dds-tag-gap-sm: var(--dds-size-4);
    --dds-tag-height-lg: var(--dds-size-40);
    --dds-tag-height-md: var(--dds-size-32);
    --dds-tag-height-sm: var(--dds-size-24);
    --dds-tag-motion-duration: 300ms;
    --dds-tag-motion-easing: ease-out;
    --dds-tag-padding-horizontal-lg: var(--dds-size-12);
    --dds-tag-padding-horizontal-md: var(--dds-size-8);
    --dds-tag-padding-horizontal-sm: var(--dds-size-4);
    --dds-tag-padding-vertical-lg: var(--dds-size-8);
    --dds-tag-padding-vertical-md: var(--dds-size-4);
    --dds-tag-padding-vertical-sm: var(--dds-size-2);
  }
  .dds__tag {
    --background: var(--dds-color-background-brand-subtle-rest);
    --border-color: var(--dds-color-border-brand-subtle);
    --color: var(--dds-color-text-brand-rest);
    --dismiss-icon-color: var(--dds-color-text-brand-rest);
    --background-hover: var(--dds-color-background-brand-subtle-hover);
    --color-hover: var(--dds-color-text-brand-hover);
    --background-active: var(--dds-color-background-brand-subtle-pressed);
    --color-active: var(--dds-color-text-brand-pressed);
    --height: var(--dds-tag-height-lg);
    --dismiss-icon-size: var(--dds-icon-size-md);
    --gap: var(--dds-tag-gap-lg);
    --padding-horizontal: var(--dds-tag-padding-horizontal-lg);
    --padding-vertical: var(--dds-tag-padding-vertical-lg);
    text-decoration: none;
    outline: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    box-sizing: border-box;
    height: var(--height);
    min-height: var(--height);
    border: var(--dds-border-width-xs) solid var(--border-color);
    border-radius: var(--dds-border-radius-xs);
    background: var(--background);
    color: var(--color);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    padding: var(--padding-vertical) var(--padding-horizontal);
    gap: var(--gap);
    white-space: nowrap;
  }
  .dds__tag .dds__icon {
    --size: var(--dds-icon-size-md);
  }
  .dds__tag--dismissible {
    padding-inline: var(--padding-horizontal) 0;
  }
  .dds__tag--dismissible .dds__tag__content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    gap: var(--gap);
  }
  .dds__tag__dismiss-icon {
    display: inline-flex;
    min-width: var(--dismiss-icon-size);
    height: var(--dismiss-icon-size);
    background: var(--dismiss-icon-color);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjkyOTcgOC43MDcxOEwxNC41ODU4IDE2TDcuMjkzMSAyMy4yOTI4TDguNzA3MzIgMjQuNzA3TDE2IDE3LjQxNDJMMjMuMjkzIDI0LjcwNzJMMjQuNzA3MiAyMy4yOTNMMTcuNDE0MiAxNkwyNC43MDcgOC43MDcxOEwyMy4yOTI4IDcuMjkyOTdMMTYgMTQuNTg1OEw4LjcwNzE4IDcuMjkyOTdMNy4yOTI5NyA4LjcwNzE4WiIvPjwvc3ZnPg==") alpha center/contain no-repeat;
  }
  button.dds__tag:not(.dds__tag--dismissible),
  a.dds__tag:not(.dds__tag--dismissible) {
    cursor: pointer;
  }
  button.dds__tag:not(.dds__tag--dismissible):hover, button.dds__tag:not(.dds__tag--dismissible):focus-visible,
  a.dds__tag:not(.dds__tag--dismissible):hover,
  a.dds__tag:not(.dds__tag--dismissible):focus-visible {
    transition: color var(--dds-tag-motion-easing) var(--dds-tag-motion-duration), background var(--dds-tag-motion-easing) var(--dds-tag-motion-duration), border-color var(--dds-tag-motion-easing) var(--dds-tag-motion-duration), box-shadow var(--dds-tag-motion-easing) var(--dds-tag-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    button.dds__tag:not(.dds__tag--dismissible):hover, button.dds__tag:not(.dds__tag--dismissible):focus-visible,
    a.dds__tag:not(.dds__tag--dismissible):hover,
    a.dds__tag:not(.dds__tag--dismissible):focus-visible {
      transition: none;
    }
  }
  button.dds__tag:not(.dds__tag--dismissible):hover,
  a.dds__tag:not(.dds__tag--dismissible):hover {
    background: var(--background-hover);
    color: var(--color-hover);
  }
  button.dds__tag:not(.dds__tag--dismissible):active,
  a.dds__tag:not(.dds__tag--dismissible):active {
    background: var(--background-active);
    color: var(--color-active);
  }
  button.dds__tag:not(.dds__tag--dismissible):focus-visible,
  a.dds__tag:not(.dds__tag--dismissible):focus-visible {
    background: var(--background-hover);
    color: var(--color-hover);
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
  }
  button.dds__tag:not(.dds__tag--dismissible):disabled, button.dds__tag:not(.dds__tag--dismissible)[aria-disabled=true],
  a.dds__tag:not(.dds__tag--dismissible):disabled,
  a.dds__tag:not(.dds__tag--dismissible)[aria-disabled=true] {
    background: var(--dds-color-background-surface-inactive);
    border-color: var(--dds-color-border-inactive-base);
    color: var(--dds-color-text-inactive);
    cursor: not-allowed;
  }
  .dds__tag--md {
    --height: var(--dds-tag-height-md);
    --gap: var(--dds-tag-gap-md);
    --padding-horizontal: var(--dds-tag-padding-horizontal-md);
    --padding-vertical: var(--dds-tag-padding-vertical-md);
    --dismiss-icon-size: var(--dds-icon-size-sm);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__tag--md .dds__icon {
    --size: var(--dds-icon-size-sm);
  }
  .dds__tag--sm {
    --height: var(--dds-tag-height-sm);
    --gap: var(--dds-tag-gap-sm);
    --padding-horizontal: var(--dds-tag-padding-horizontal-sm);
    --padding-vertical: var(--dds-tag-padding-vertical-sm);
    --dismiss-icon-size: var(--dds-icon-size-xs);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-4-size);
    font-weight: var(--dds-typography-body-4-weight-default);
    line-height: var(--dds-typography-body-4-line-height);
  }
  .dds__tag--sm .dds__icon {
    --size: var(--dds-icon-size-xs);
  }
  .dds__tag--success {
    --background: var(--dds-color-background-success-subtle-rest);
    --border-color: var(--dds-color-border-success-subtle);
    --color: var(--dds-color-text-success-rest);
    --background-hover: var(--dds-color-background-success-subtle-hover);
    --color-hover: var(--dds-color-text-success-hover);
    --background-active: var(--dds-color-background-success-subtle-pressed);
    --color-active: var(--dds-color-text-success-pressed);
    --dismiss-icon-color: var(--dds-color-text-success-rest);
  }
  .dds__tag--warning {
    --background: var(--dds-color-background-warning-subtle-rest);
    --border-color: var(--dds-color-border-warning-subtle);
    --color: var(--dds-color-text-warning-rest);
    --background-hover: var(--dds-color-background-warning-subtle-hover);
    --color-hover: var(--dds-color-text-warning-hover);
    --background-active: var(--dds-color-background-warning-subtle-pressed);
    --color-active: var(--dds-color-text-warning-pressed);
    --dismiss-icon-color: var(--dds-color-text-warning-rest);
  }
  .dds__tag--error {
    --background: var(--dds-color-background-error-subtle-rest);
    --border-color: var(--dds-color-border-error-subtle);
    --color: var(--dds-color-text-error-rest);
    --background-hover: var(--dds-color-background-error-subtle-hover);
    --color-hover: var(--dds-color-text-error-hover);
    --background-active: var(--dds-color-background-error-subtle-pressed);
    --color-active: var(--dds-color-text-error-pressed);
    --dismiss-icon-color: var(--dds-color-text-error-rest);
  }
  .dds__tag--neutral {
    --background: var(--dds-color-background-neutral-subtle-rest);
    --border-color: var(--dds-color-border-neutral-subtle);
    --color: var(--dds-color-text-neutral-rest);
    --background-hover: var(--dds-color-background-neutral-subtle-hover);
    --color-hover: var(--dds-color-text-neutral-hover);
    --background-active: var(--dds-color-background-neutral-subtle-pressed);
    --color-active: var(--dds-color-text-neutral-pressed);
    --dismiss-icon-color: var(--dds-color-text-neutral-rest);
  }
  .dds__tag--inactive {
    --dismiss-icon-color: var(--dds-color-text-inactive);
  }
}
@layer component {
  :root,
  :host {
    --dds-dropdown-max-height: var(--dds-size-360);
    --dds-dropdown-motion-duration: 300ms;
    --dds-dropdown-motion-easing: ease-out;
  }
  .dds__dropdown {
    --chevron-icon-size: var(--dds-icon-size-sm);
    --chevron-icon-color: var(--dds-color-text-neutral-rest);
    display: inline-flex;
    box-sizing: border-box;
    width: 100%;
  }
  .dds__dropdown--sm {
    --chevron-icon-size: var(--dds-icon-size-xs);
  }
  .dds__dropdown:has(.dds__text-input:disabled) {
    --chevron-icon-color: var(--dds-color-text-inactive);
  }
  .dds__dropdown__chevron-icon::before {
    content: "";
    display: block;
    width: var(--chevron-icon-size);
    height: var(--chevron-icon-size);
    background: var(--chevron-icon-color);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNS4yOTMgMjIuNzA3Mkw1LjI5Mjk3IDEyLjcwNzJMNi43MDcxOCAxMS4yOTNMMTYuMDAwMSAyMC41ODU5TDI1LjI5MyAxMS4yOTNMMjYuNzA3MiAxMi43MDcyTDE2LjcwNzIgMjIuNzA3MkMxNi4zMTY3IDIzLjA5NzcgMTUuNjgzNSAyMy4wOTc3IDE1LjI5MyAyMi43MDcyWiIvPjwvc3ZnPg==") center/var(--chevron-icon-size) no-repeat;
    cursor: pointer;
  }
  .dds__dropdown__pop-up {
    --checkbox-size: var(--dds-checkbox-size-lg);
    --checkbox-background: var(--dds-color-background-surface-neutral);
    --checkbox-border-color: var(--dds-color-border-neutral-base);
    --checkbox-icon-color: var(--dds-color-background-brand-base-rest);
    --no-items-container-padding: var(--dds-menu-item-padding-lg);
    --popup-gap-custom: var(--dds-spacing-xs);
    box-shadow: var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
  }
  @supports (scrollbar-width: thin) {
    .dds__dropdown__pop-up {
      scrollbar-width: thin;
      scrollbar-color: var(--dds-color-background-surface-tertiary) var(--dds-color-background-surface-neutral);
      scrollbar-gutter: auto;
    }
  }
  .dds__dropdown__pop-up {
    box-sizing: border-box;
    background: var(--dds-color-background-surface-neutral);
    border-radius: var(--dds-border-radius-xs);
    overflow-x: hidden;
    overflow-y: auto;
    max-height: var(--dds-dropdown-max-height);
    border: var(--dds-border-width-xs) solid var(--dds-color-border-neutral-pale);
  }
  .dds__dropdown__pop-up:focus, .dds__dropdown__pop-up:focus-visible, .dds__dropdown__pop-up:focus-within {
    outline: 0;
  }
  .dds__dropdown.dds__input-group.dds__dropdown--multi-select.dds__dropdown--has-selected-options {
    padding-inline-start: var(--dds-input-padding-horizontal-xs);
  }
  .dds__dropdown__pop-up--sm {
    --checkbox-size: var(--dds-checkbox-size-sm);
    --no-items-container-padding: var(--dds-menu-item-padding-sm);
  }
  .dds__dropdown__no-items-container {
    display: flex;
    justify-content: center;
    padding: var(--no-items-container-padding);
    color: var(--dds-color-text-secondary);
  }
  .dds__dropdown__option {
    text-align: start;
  }
}
@layer component {
  .dds__fieldset {
    border: 0;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 0;
    margin: 0;
    gap: var(--dds-spacing-xs);
  }
  .dds__fieldset .dds__legend {
    float: inline-start;
  }
}
@layer component {
  :root,
  :host {
    --dds-loading-color-background-gradient-angle1: 0;
    --dds-loading-color-background-gradient-angle2: 90deg;
    --dds-loading-color-background-gradient-angle3: 360deg;
    --dds-loading-size-lg: var(--dds-size-64);
    --dds-loading-size-md: var(--dds-size-32);
    --dds-loading-size-sm: var(--dds-size-16);
    --dds-loading-size-xl: var(--dds-size-80);
  }
  .dds__loading-indicator {
    --size: var(--dds-loading-size-xl);
    height: fit-content;
    width: fit-content;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .dds__loading-indicator__spinner {
    width: var(--size);
    height: var(--size);
    border-radius: var(--dds-border-radius-rounded);
    box-sizing: border-box;
    background: conic-gradient(from 0deg, var(--dds-color-background-brand-base-rest) 0deg 90deg, var(--dds-color-background-surface-secondary) 90deg 360deg);
    mask: radial-gradient(farthest-side, transparent 80%, var(--dds-color-background-brand-base-rest) calc(80% + 1px), var(--dds-color-background-brand-base-rest) calc(100% - 1px), transparent 100%);
    animation: ddsLoadingIndicatorSpin 0.92s infinite linear;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__loading-indicator__spinner {
      animation-duration: 0.1s;
    }
  }
  .dds__loading-indicator--lg {
    --size: var(--dds-loading-size-lg);
  }
  .dds__loading-indicator--md {
    --size: var(--dds-loading-size-md);
  }
  .dds__loading-indicator--sm {
    --size: var(--dds-loading-size-sm);
  }
  .dds__loading-indicator--ai .dds__loading-indicator__spinner {
    background: conic-gradient(from 0deg, var(--dds-ai-color-background-gradient-base-rest-color1) 0deg, var(--dds-ai-color-background-gradient-base-rest-color2) 135deg, var(--dds-ai-color-background-gradient-base-rest-color3) 270deg, transparent 270deg 360deg);
  }
  @keyframes ddsLoadingIndicatorSpin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
}
@layer component {
  :root,
  :host {
    --dds-file-input-file-gap: var(--dds-size-8);
    --dds-file-input-file-padding-horizontal: var(--dds-size-12);
    --dds-file-input-file-padding-min-width: var(--dds-size-320);
    --dds-file-input-file-padding-vertical: var(--dds-size-8);
    --dds-file-input-list-gap: var(--dds-size-4);
  }
  .dds__file-input {
    display: block;
  }
  .dds__file-input input[type=file] {
    display: none;
  }
  .dds__file-input__list {
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0;
    margin-top: var(--dds-spacing-sm);
    gap: var(--dds-file-input-list-gap);
  }
  .dds__file-input__list:empty {
    margin: 0;
  }
  .dds__file-input--sm .dds__file-input__item {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__file-input__item {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    box-sizing: border-box;
    min-width: var(--dds-file-input-file-padding-min-width);
    display: flex;
    align-items: center;
    gap: var(--dds-file-input-file-gap);
    background: var(--dds-color-background-surface-neutral);
    padding: var(--dds-file-input-file-padding-vertical) var(--dds-file-input-file-padding-horizontal);
    border: var(--dds-border-width-xs) solid var(--dds-color-border-neutral-pale);
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__file-input__item__info {
    display: flex;
    flex-direction: column;
    gap: var(--dds-file-input-file-gap);
    flex: 1;
    min-width: 0;
  }
  .dds__file-input__item__remove::before {
    content: "";
    display: flex;
    flex-shrink: 0;
    width: var(--dds-icon-size-xs);
    height: var(--dds-icon-size-xs);
    justify-content: center;
    align-items: center;
    background: var(--dds-color-text-neutral-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjkyOTcgOC43MDcxOEwxNC41ODU4IDE2TDcuMjkzMSAyMy4yOTI4TDguNzA3MzIgMjQuNzA3TDE2IDE3LjQxNDJMMjMuMjkzIDI0LjcwNzJMMjQuNzA3MiAyMy4yOTNMMTcuNDE0MiAxNkwyNC43MDcgOC43MDcxOEwyMy4yOTI4IDcuMjkyOTdMMTYgMTQuNTg1OEw4LjcwNzE4IDcuMjkyOTdMNy4yOTI5NyA4LjcwNzE4WiIvPjwvc3ZnPg==") center/contain no-repeat;
  }
  .dds__file-input__item__file {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: var(--dds-file-input-file-gap);
    min-width: 0;
  }
  .dds__file-input__item__file-name {
    color: var(--dds-color-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
  }
  .dds__file-input__item__file-name:hover {
    overflow: visible;
  }
  .dds__file-input__item__file-size {
    color: var(--dds-color-text-tertiary);
    white-space: nowrap;
    min-width: 0;
  }
  .dds__file-input__item__status {
    display: flex;
    color: var(--dds-color-text-secondary);
    gap: var(--dds-spacing-xs);
    align-items: center;
  }
  .dds__file-input__item__status:empty {
    display: none;
  }
  .dds__file-input__item__status strong {
    color: var(--dds-color-text-primary);
  }
  .dds__file-input__item__status-icon {
    line-height: 0;
  }
  .dds__file-input__item__status-icon::before {
    content: "";
    display: inline-block;
    width: var(--dds-icon-size-xs);
    aspect-ratio: 1/1;
  }
  .dds__file-input__item--error {
    background: var(--dds-color-background-error-subtle-rest);
    border: transparent;
  }
  .dds__file-input__item--error .dds__file-input__item__status-icon::before {
    background: var(--dds-color-text-error-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNi43MDcxIDIuMjkyODlDMTYuMzE2NiAxLjkwMjM3IDE1LjY4MzQgMS45MDIzNyAxNS4yOTI5IDIuMjkyODlMMi4yOTI4OSAxNS4yOTI5QzEuOTAyMzcgMTUuNjgzNCAxLjkwMjM3IDE2LjMxNjYgMi4yOTI4OSAxNi43MDcxTDE1LjI5MjkgMjkuNzA3MUMxNS42ODM0IDMwLjA5NzYgMTYuMzE2NiAzMC4wOTc2IDE2LjcwNzEgMjkuNzA3MUwyOS43MDcxIDE2LjcwNzFDMzAuMDk3NiAxNi4zMTY2IDMwLjA5NzYgMTUuNjgzNCAyOS43MDcxIDE1LjI5MjlMMTYuNzA3MSAyLjI5Mjg5Wk0xNC43NTAzIDE3LjAwMDJWOS4wMDAxOEgxNy4yNTAzVjE3LjAwMDJIMTQuNzUwM1pNMTQuNzUwMyAyMy4wMDAyVjIwLjAwMDJIMTcuMjUwM1YyMy4wMDAySDE0Ljc1MDNaIi8+PC9zdmc+") center/contain no-repeat;
  }
  .dds__file-input__item--success {
    background: var(--dds-color-background-success-subtle-rest);
    border: transparent;
  }
  .dds__file-input__item--success .dds__file-input__item__status-icon::before {
    background: var(--dds-color-text-success-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zMCAxNkMzMCAyMy43MzIgMjMuNzMyIDMwIDE2IDMwQzguMjY4MDEgMzAgMiAyMy43MzIgMiAxNkMyIDguMjY4MDEgOC4yNjgwMSAyIDE2IDJDMjMuNzMyIDIgMzAgOC4yNjgwMSAzMCAxNlpNMjMuNzQxMyAxMi44ODQ0TDE1LjE3MDEgMjEuNDU1OEMxNC42ODIgMjEuOTQzOSAxMy44OTA1IDIxLjk0NCAxMy40MDI0IDIxLjQ1NThMOS4xMTYzOCAxNy4xNzAxTDEwLjg4NDEgMTUuNDAyM0wxNC4yODYyIDE4LjgwNDJMMjEuOTczNSAxMS4xMTY2TDIzLjc0MTMgMTIuODg0NFoiLz48L3N2Zz4=") center/contain no-repeat;
  }
  .dds__file-input__item--loading {
    background: var(--dds-color-background-surface-neutral);
    border: transparent;
  }
}
@layer component {
  .dds__footnote {
    padding: 0 var(--dds-spacing-lg);
    color: var(--dds-color-text-primary);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
  }
}
@layer component {
  .dds__form-field {
    display: flex;
    flex-direction: column;
    gap: var(--dds-spacing-xs);
  }
}
@layer component {
  :root,
  :host {
    --dds-helper-text-gap: var(--dds-size-4);
  }
  .dds__helper-text {
    --color: var(--dds-color-text-tertiary);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    display: inline-flex;
    align-items: center;
    color: var(--color);
    gap: var(--dds-helper-text-gap);
  }
  .dds__helper-text--sm {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-4-size);
    font-weight: var(--dds-typography-body-4-weight-default);
    line-height: var(--dds-typography-body-4-line-height);
  }
  .dds__helper-text--success {
    --color: var(--dds-color-text-success-rest);
  }
  .dds__helper-text--error {
    --color: var(--dds-color-text-error-rest);
  }
  .dds__helper-text--inactive {
    --color: var(--dds-color-text-inactive);
  }
  .dds__helper-text--ai {
    --color: var(--dds-ai-color-text-tertiary);
  }
  .dds__helper-text--ai.dds__helper-text--error {
    --color: var(--dds-ai-color-text-error);
  }
  .dds__helper-text--ai.dds__helper-text--success {
    --color: var(--dds-ai-color-text-success);
  }
  .dds__helper-text--ai.dds__helper-text--inactive {
    --color: var(--dds-ai-color-text-inactive);
  }
}
@layer component {
  .dds__label {
    --color: var(--dds-color-text-primary);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    display: inline-flex;
    gap: var(--dds-spacing-xs);
    color: var(--color);
  }
  .dds__label:has(.dds__checkbox),
  .dds__label:has(.dds__radio-button) {
    gap: var(--dds-spacing-sm);
  }
  .dds__label--sm {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__label--secondary {
    --color: var(--dds-color-text-secondary);
  }
  .dds__label--invalid {
    --color: var(--dds-color-text-error-rest);
  }
  .dds__label--required-indicator::after {
    content: "*";
    color: var(--dds-color-text-error-rest);
  }
  .dds__label--ai {
    --color: var(--dds-ai-color-text-primary);
  }
  .dds__label--ai.dds__label--secondary {
    --color: var(--dds-ai-color-text-tertiary);
  }
  .dds__label--ai.dds__label--invalid {
    --color: var(--dds-color-text-error-rest);
  }
}
@layer component {
  .dds__legend {
    padding: 0;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    color: var(--dds-color-text-primary);
    display: inline-flex;
    gap: var(--dds-spacing-sm);
  }
  .dds__legend--sm {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__legend--required-indicator::after {
    content: "*";
    color: var(--dds-color-text-error-rest);
  }
}
@layer component {
  :root,
  :host {
    --dds-link-gap: var(--dds-size-4);
    --dds-link-motion-duration: 100ms;
    --dds-link-motion-easing: ease-out;
  }
  :root,
  :host {
    --dds-link-active: var(--dds-color-blue-90);
    --dds-link-hover: var(--dds-color-blue-80);
    --dds-link-neutral-active: var(--dds-color-slate-90);
    --dds-link-neutral-hover: var(--dds-color-slate-80);
    --dds-link-neutral-rest: var(--dds-color-slate-70);
    --dds-link-rest: var(--dds-color-blue-70);
    --dds-link-visited-active: var(--dds-color-purple-90);
    --dds-link-visited-hover: var(--dds-color-purple-80);
    --dds-link-visited-rest: var(--dds-color-purple-70);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-link-active: var(--dds-color-blue-40);
      --dds-link-hover: var(--dds-color-blue-30);
      --dds-link-neutral-active: var(--dds-color-slate-30);
      --dds-link-neutral-hover: var(--dds-color-slate-20);
      --dds-link-neutral-rest: var(--dds-color-slate-10);
      --dds-link-rest: var(--dds-color-blue-20);
      --dds-link-visited-active: var(--dds-color-purple-40);
      --dds-link-visited-hover: var(--dds-color-purple-30);
      --dds-link-visited-rest: var(--dds-color-purple-20);
    }
  }
  .dds--light-mode {
    --dds-link-active: var(--dds-color-blue-90);
    --dds-link-hover: var(--dds-color-blue-80);
    --dds-link-neutral-active: var(--dds-color-slate-90);
    --dds-link-neutral-hover: var(--dds-color-slate-80);
    --dds-link-neutral-rest: var(--dds-color-slate-70);
    --dds-link-rest: var(--dds-color-blue-70);
    --dds-link-visited-active: var(--dds-color-purple-90);
    --dds-link-visited-hover: var(--dds-color-purple-80);
    --dds-link-visited-rest: var(--dds-color-purple-70);
  }
  .dds--dark-mode {
    --dds-link-active: var(--dds-color-blue-40);
    --dds-link-hover: var(--dds-color-blue-30);
    --dds-link-neutral-active: var(--dds-color-slate-30);
    --dds-link-neutral-hover: var(--dds-color-slate-20);
    --dds-link-neutral-rest: var(--dds-color-slate-10);
    --dds-link-rest: var(--dds-color-blue-20);
    --dds-link-visited-active: var(--dds-color-purple-40);
    --dds-link-visited-hover: var(--dds-color-purple-30);
    --dds-link-visited-rest: var(--dds-color-purple-20);
  }
  .dds__link {
    --text-decoration: underline;
    --color-rest: var(--dds-link-rest);
    --color-hover: var(--dds-link-hover);
    --color-active: var(--dds-link-active);
    --color-visited-rest: var(--dds-link-visited-rest);
    --color-visited-hover: var(--dds-link-visited-hover);
    --color-visited-active: var(--dds-link-visited-active);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    display: inline-flex;
    align-items: baseline;
    gap: var(--dds-link-gap);
    text-decoration: var(--text-decoration);
    color: var(--color-rest);
  }
  .dds__link:hover, .dds__link:visited:hover, .dds__link:focus-visible {
    transition: color var(--dds-link-motion-easing) var(--dds-link-motion-duration), box-shadow var(--dds-link-motion-easing) var(--dds-link-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__link:hover, .dds__link:visited:hover, .dds__link:focus-visible {
      transition: none;
    }
  }
  .dds__link:hover {
    text-decoration: underline;
    color: var(--color-hover);
  }
  .dds__link:active {
    text-decoration: underline;
    color: var(--color-active);
  }
  .dds__link:visited {
    color: var(--color-visited-rest);
  }
  .dds__link:visited:hover {
    color: var(--color-visited-hover);
  }
  .dds__link:visited:active {
    color: var(--color-visited-active);
  }
  .dds__link:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
    outline: none;
  }
  .dds__link--standalone {
    --text-decoration: none;
  }
  .dds__link--color-neutral {
    --color-rest: var(--dds-link-neutral-rest);
    --color-hover: var(--dds-link-neutral-hover);
    --color-active: var(--dds-link-neutral-active);
    --color-visited-rest: var(--dds-link-neutral-rest);
    --color-visited-hover: var(--dds-link-neutral-hover);
    --color-visited-active: var(--dds-link-neutral-active);
  }
}
@layer component {
  .dds__list {
    --gap: var(--dds-spacing-sm);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    display: flex;
    flex-direction: column;
    margin: 0;
    gap: var(--gap);
    padding-inline: var(--gap);
    color: var(--dds-color-text-primary);
  }
  .dds__list li {
    margin-inline-start: 1em;
  }
  .dds__list--lg {
    --gap: var(--dds-spacing-lg);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-1-size);
    font-weight: var(--dds-typography-body-1-weight-default);
    line-height: var(--dds-typography-body-1-line-height);
  }
}
@layer component {
  :root,
  :host {
    --dds-message-bar-gap: var(--dds-size-16);
    --dds-message-bar-min-height: var(--dds-size-40);
    --dds-message-bar-padding: var(--dds-size-8);
    --dds-message-bar-timer-height: var(--dds-size-2);
  }
  .dds__message-bar {
    --background: var(--dds-color-background-info-subtle-rest);
    --dismiss-background: transparent;
    --dismiss-background-hover: var(--dds-color-background-info-subtle-hover);
    --dismiss-background-active: var(--dds-color-background-info-subtle-pressed);
    --timer-background: var(--dds-color-background-info-base-rest);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    display: flex;
    background: var(--background);
    color: var(--dds-color-text-secondary);
    padding: var(--dds-message-bar-padding);
    gap: var(--dds-message-bar-gap);
    min-height: var(--dds-message-bar-min-height);
    border-radius: var(--dds-border-radius-xs);
    position: relative;
    box-sizing: border-box;
  }
  .dds__message-bar--global {
    box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) 0 var(--dds-color-background-surface-drop-shadow);
  }
  .dds__message-bar--success {
    --background: var(--dds-color-background-success-subtle-rest);
    --dismiss-background-hover: var(--dds-color-background-success-subtle-hover);
    --dismiss-background-active: var(--dds-color-background-success-subtle-pressed);
    --timer-background: var(--dds-color-background-success-base-rest);
  }
  .dds__message-bar--warning {
    --background: var(--dds-color-background-warning-subtle-rest);
    --dismiss-background-hover: var(--dds-color-background-warning-subtle-hover);
    --dismiss-background-active: var(--dds-color-background-warning-subtle-pressed);
    --timer-background: var(--dds-color-background-warning-base-rest);
  }
  .dds__message-bar--error {
    --background: var(--dds-color-background-error-subtle-rest);
    --dismiss-background-hover: var(--dds-color-background-error-subtle-hover);
    --dismiss-background-active: var(--dds-color-background-error-subtle-pressed);
    --timer-background: var(--dds-color-background-error-base-rest);
  }
  .dds__message-bar__content {
    display: flex;
    flex: 1;
    box-sizing: border-box;
    align-items: center;
    gap: var(--dds-spacing-sm);
  }
  .dds__message-bar__dismiss {
    border: 0;
    background: var(--dismiss-background);
    cursor: pointer;
    appearance: none;
    align-self: flex-start;
    align-items: center;
    display: flex;
    justify-content: center;
    border-radius: var(--dds-border-radius-xs);
    width: var(--dds-icon-size-md);
    height: var(--dds-icon-size-md);
  }
  .dds__message-bar__dismiss:hover, .dds__message-bar__dismiss:focus-visible {
    --dismiss-background: var(--dismiss-background-hover);
    transition: background var(--dds-motion-easing-ease-out) var(--dds-motion-duration-02);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__message-bar__dismiss:hover, .dds__message-bar__dismiss:focus-visible {
      transition: none;
    }
  }
  .dds__message-bar__dismiss:active {
    --dismiss-background: var(--dismiss-background-active);
  }
  .dds__message-bar__dismiss:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
    outline: none;
    z-index: 0;
  }
  .dds__message-bar__dismiss-icon {
    width: var(--dds-icon-size-xs);
    height: var(--dds-icon-size-xs);
    background: var(--dds-color-text-secondary);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjkyOTcgOC43MDcxOEwxNC41ODU4IDE2TDcuMjkzMSAyMy4yOTI4TDguNzA3MzIgMjQuNzA3TDE2IDE3LjQxNDJMMjMuMjkzIDI0LjcwNzJMMjQuNzA3MiAyMy4yOTNMMTcuNDE0MiAxNkwyNC43MDcgOC43MDcxOEwyMy4yOTI4IDcuMjkyOTdMMTYgMTQuNTg1OEw4LjcwNzE4IDcuMjkyOTdMNy4yOTI5NyA4LjcwNzE4WiIvPjwvc3ZnPg==") center/contain no-repeat;
  }
  .dds__message-bar__timer {
    height: var(--dds-message-bar-timer-height);
    position: absolute;
    background: var(--timer-background);
    bottom: 0;
    left: 0;
    right: 0;
    transform-origin: left;
  }
  [dir=rtl] .dds__message-bar__timer {
    transform-origin: right;
  }
  .dds__message-bar__timer {
    animation: ddsMessageBarTimerAnimation 2s linear;
  }
  .dds__message-bar__timer--paused {
    animation-play-state: paused;
  }
  .dds__message-bar:has(.dds__message-bar__timer):hover .dds__message-bar__timer, .dds__message-bar:has(.dds__message-bar__timer):focus-within .dds__message-bar__timer {
    animation-play-state: paused;
  }
  @keyframes ddsMessageBarTimerAnimation {
    0% {
      transform: scaleX(0);
    }
    100% {
      transform: scaleX(1);
    }
  }
}
@layer component {
  :root,
  :host {
    --dds-modal-desktop-max-width: var(--dds-size-800);
    --dds-modal-desktop-min-width: var(--dds-size-496);
    --dds-modal-gap: var(--dds-size-24);
    --dds-modal-header-gap: var(--dds-size-16);
    --dds-modal-mobile-max-width: var(--dds-size-496);
    --dds-modal-mobile-min-width: var(--dds-size-300);
    --dds-modal-padding: var(--dds-size-24);
  }
  @keyframes ddsModalOpen {
    from {
      opacity: 0;
      transform: scale(0.95);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }
  @keyframes ddsModalClose {
    from {
      opacity: 1;
      transform: scale(1);
    }
    to {
      opacity: 0;
      transform: scale(0.95);
    }
  }
  @keyframes ddsModalBackdropOpen {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }
  @keyframes ddsModalBackdropClose {
    from {
      opacity: 1;
    }
    to {
      opacity: 0;
    }
  }
  .dds__modal {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    border: 0;
    padding: 0;
    max-width: none;
    max-height: none;
    color: var(--dds-color-text-primary);
    background: transparent;
    outline: none;
    overflow: visible;
  }
  .dds__modal::backdrop {
    background: var(--dds-color-background-surface-overlay);
  }
  .dds__modal[open]::backdrop {
    animation: ddsModalBackdropOpen var(--dds-motion-duration-03) ease forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__modal[open]::backdrop {
      animation-duration: 0.1s;
    }
  }
  .dds__modal[open] .dds__modal__container {
    animation: ddsModalOpen var(--dds-motion-duration-03) ease forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__modal[open] .dds__modal__container {
      animation-duration: 0.1s;
    }
  }
  .dds__modal.dds__modal--closing::backdrop {
    animation: ddsModalBackdropClose var(--dds-motion-duration-03) ease forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__modal.dds__modal--closing::backdrop {
      animation-duration: 0.1s;
    }
  }
  .dds__modal.dds__modal--closing .dds__modal__container {
    animation: ddsModalClose var(--dds-motion-duration-03) ease forwards;
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__modal.dds__modal--closing .dds__modal__container {
      animation-duration: 0.1s;
    }
  }
  .dds__modal__container {
    position: relative;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background: var(--dds-color-background-surface-neutral);
    min-inline-size: var(--dds-modal-mobile-min-width);
    inline-size: 80dvw;
    max-inline-size: var(--dds-modal-mobile-max-width);
    max-block-size: 80dvh;
    padding: var(--dds-modal-padding);
    row-gap: var(--dds-modal-gap);
    box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
  }
  .dds__modal__container:not(:has(.dds__modal__header)) {
    padding-block-start: calc(var(--dds-modal-padding) + var(--dds-button-size-sm) + var(--dds-modal-gap));
  }
  @media screen and (min-width: 1024px) {
    .dds__modal__container {
      min-inline-size: var(--dds-modal-desktop-min-width);
      max-inline-size: var(--dds-modal-desktop-max-width);
    }
  }
  .dds__modal__close {
    position: absolute;
    top: var(--dds-modal-padding);
    right: var(--dds-modal-padding);
  }
  .dds__modal__close::before {
    content: "";
    display: inline-block;
    width: var(--dds-icon-size-sm);
    height: var(--dds-icon-size-sm);
    background: var(--dds-color-text-neutral-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjkyOTcgOC43MDcxOEwxNC41ODU4IDE2TDcuMjkzMSAyMy4yOTI4TDguNzA3MzIgMjQuNzA3TDE2IDE3LjQxNDJMMjMuMjkzIDI0LjcwNzJMMjQuNzA3MiAyMy4yOTNMMTcuNDE0MiAxNkwyNC43MDcgOC43MDcxOEwyMy4yOTI4IDcuMjkyOTdMMTYgMTQuNTg1OEw4LjcwNzE4IDcuMjkyOTdMNy4yOTI5NyA4LjcwNzE4WiIvPjwvc3ZnPg==") center/contain no-repeat;
  }
  .dds__modal__header {
    flex: 1 0 var(--dds-button-size-sm);
    margin-inline-end: calc(var(--dds-button-size-sm) + var(--dds-modal-header-gap));
  }
  .dds__modal__body {
    overflow: auto;
  }
  @supports (scrollbar-width: thin) {
    .dds__modal__body {
      scrollbar-width: thin;
      scrollbar-color: var(--dds-color-background-surface-tertiary) var(--dds-color-background-surface-neutral);
      scrollbar-gutter: auto;
    }
  }
  .dds__modal__body:focus {
    outline: 0;
  }
  .dds__modal__footer {
    display: flex;
  }
}
body.dds__modal--prevent-scroll {
  overflow: hidden;
}

@layer component {
  :root,
  :host {
    --dds-notification-gap: var(--dds-size-8);
    --dds-notification-header-gap: var(--dds-size-16);
    --dds-notification-max-width: var(--dds-size-400);
    --dds-notification-min-width: var(--dds-size-300);
    --dds-notification-motion-duration: 800ms;
    --dds-notification-motion-easing: ease-out;
    --dds-notification-padding: var(--dds-size-24);
  }
  .dds__notification-container {
    position: fixed;
    bottom: var(--dds-spacing-xl);
    right: var(--dds-spacing-xl);
    z-index: 1100;
    display: flex;
    flex-direction: column;
    gap: var(--dds-spacing-xl);
  }
  .dds__notification {
    --motion-duration: var(--dds-notification-motion-duration);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    box-sizing: content-box;
    color: var(--dds-color-text-primary);
    background: var(--dds-color-background-surface-neutral);
    border-radius: var(--dds-border-radius-xs);
    border: var(--dds-border-width-xs) solid var(--dds-color-border-neutral-pale);
    min-width: var(--dds-notification-min-width);
    max-width: var(--dds-notification-max-width);
    padding: var(--dds-notification-padding);
    gap: var(--dds-notification-gap);
    animation: ddsNotificationSlideIn var(--motion-duration) var(--dds-notification-motion-easing) forwards;
    box-shadow: var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-offset-4) var(--dds-drop-shadow-blur-4) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-offset-8) var(--dds-drop-shadow-blur-8) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-offset-16) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
  }
  .dds__notification:has(.dds__notification__dismiss-button):not(:has(.dds__notification__header)) {
    padding-block-start: calc(var(--dds-notification-padding) + var(--dds-button-size-sm) + var(--dds-notification-gap));
  }
  .dds__notification--dismissing {
    animation: ddsNotificationSlideOut var(--motion-duration) var(--dds-notification-motion-easing) forwards;
  }
  .dds__notification__header {
    flex: 1 0 var(--dds-button-size-sm);
    margin-inline-end: calc(var(--dds-button-size-sm) + var(--dds-notification-header-gap));
  }
  .dds__notification__body {
    width: 100%;
  }
  .dds__button.dds__notification__dismiss-button {
    position: absolute;
    top: var(--dds-notification-padding);
    right: var(--dds-notification-padding);
  }
  .dds__button.dds__notification__dismiss-button::before {
    content: "";
    display: inline-block;
    width: var(--dds-icon-size-sm);
    aspect-ratio: 1/1;
    background: var(--dds-color-text-neutral-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjkyOTcgOC43MDcxOEwxNC41ODU4IDE2TDcuMjkzMSAyMy4yOTI4TDguNzA3MzIgMjQuNzA3TDE2IDE3LjQxNDJMMjMuMjkzIDI0LjcwNzJMMjQuNzA3MiAyMy4yOTNMMTcuNDE0MiAxNkwyNC43MDcgOC43MDcxOEwyMy4yOTI4IDcuMjkyOTdMMTYgMTQuNTg1OEw4LjcwNzE4IDcuMjkyOTdMNy4yOTI5NyA4LjcwNzE4WiIvPjwvc3ZnPg==") center/contain no-repeat;
  }
  @keyframes ddsNotificationSlideIn {
    from {
      transform: translateX(calc(100% + var(--dds-notification-padding)));
    }
    to {
      transform: translateX(0);
    }
  }
  @keyframes ddsNotificationSlideOut {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(100% + var(--dds-notification-padding)));
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .dds__notification {
      --motion-duration: 0.1s;
    }
  }
}
@layer component {
  .dds__overlay {
    background: var(--dds-color-background-surface-overlay);
  }
  .dds__overlay--blur {
    backdrop-filter: blur(var(--dds-spacing-4xl));
  }
}
@layer component {
  :root,
  :host {
    --dds-pagination-desktop-height: var(--dds-size-72);
    --dds-pagination-desktop-padding: var(--dds-size-24);
    --dds-pagination-desktop-width: var(--dds-size-960);
    --dds-pagination-gap-counter: var(--dds-size-16);
    --dds-pagination-gap-navigation: var(--dds-size-12);
    --dds-pagination-gap-page: var(--dds-size-8);
    --dds-pagination-mobile-height: var(--dds-size-56);
    --dds-pagination-mobile-padding: var(--dds-size-16);
    --dds-pagination-mobile-width: var(--dds-size-320);
    --dds-pagination-pages-input-width: var(--dds-size-40);
    --dds-pagination-pages-select-width: var(--dds-size-60);
    --dds-pagination-tablet-height: var(--dds-size-64);
    --dds-pagination-tablet-padding: var(--dds-size-16);
    --dds-pagination-tablet-width: var(--dds-size-480);
  }
  .dds__pagination {
    container-type: inline-size;
    container-name: pagination;
    display: flex;
    width: 100%;
    border-radius: var(--dds-border-radius-xs);
    background: var(--dds-color-background-surface-neutral);
    color: var(--dds-color-text-secondary);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
  }
  .dds__pagination__container {
    flex: 1;
    display: flex;
    align-items: center;
    height: var(--dds-pagination-mobile-height);
    padding: 0 var(--dds-pagination-mobile-padding);
    justify-content: center;
  }
  @container pagination (width > 480px) {
    .dds__pagination__container {
      height: var(--dds-pagination-tablet-height);
      padding: 0 var(--dds-pagination-tablet-padding);
      justify-content: space-between;
    }
  }
  @container pagination (width > 768px) {
    .dds__pagination__container {
      height: var(--dds-pagination-desktop-height);
      padding: 0 var(--dds-pagination-desktop-padding);
      justify-content: space-between;
    }
  }
  .dds__pagination .dds__select-wrapper {
    width: var(--dds-pagination-pages-select-width);
  }
  .dds__pagination__select-label {
    display: none;
  }
  @container pagination (width > 768px) {
    .dds__pagination__select-label {
      display: flex;
    }
  }
  .dds__pagination__input {
    width: var(--dds-pagination-pages-input-width);
    text-align: center;
    /* stylelint-disable property-no-vendor-prefix */
    -moz-appearance: textfield;
    appearance: textfield;
  }
  .dds__pagination__input::-webkit-outer-spin-button, .dds__pagination__input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  .dds__pagination__input {
    /* stylelint-enable */
  }
  .dds__pagination__summary {
    display: none;
    gap: var(--dds-pagination-gap-counter);
  }
  @container pagination (width > 480px) {
    .dds__pagination__summary {
      display: flex;
      align-items: center;
    }
  }
  .dds__pagination__range {
    display: flex;
    gap: 1ch;
  }
  .dds__pagination__range-total {
    display: none;
  }
  @container pagination (width > 768px) {
    .dds__pagination__range-total {
      display: flex;
    }
  }
  .dds__pagination__nav {
    display: flex;
    align-items: center;
    gap: var(--dds-pagination-gap-navigation);
  }
  .dds__pagination__nav-label {
    display: none;
  }
  @container pagination (width > 768px) {
    .dds__pagination__nav-label {
      display: flex;
    }
  }
  .dds__pagination__nav-control {
    display: flex;
    align-items: center;
    white-space: nowrap;
    gap: var(--dds-pagination-gap-page);
  }
  .dds__pagination__nav-first::after,
  .dds__pagination__nav-last::after,
  .dds__pagination__nav-next::after {
    content: "";
    display: block;
    width: var(--dds-size-16);
    aspect-ratio: 1/1;
    background: var(--dds-color-background-brand-base-rest);
  }
  .dds__pagination__nav-first:disabled::after,
  .dds__pagination__nav-last:disabled::after,
  .dds__pagination__nav-next:disabled::after {
    background: var(--dds-color-text-inactive);
  }
  .dds__pagination__nav-prev::before {
    content: "";
    display: block;
    width: var(--dds-size-16);
    aspect-ratio: 1/1;
    background: var(--dds-color-background-brand-base-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMi42NjY3IDYuMjk3ODhDMjIuNjY2NyA1LjQ5MTgxIDIxLjYxNjYgNS4wMzY1IDIwLjk0NzcgNS41NTI1M0w4LjM3MTMzIDE1LjI1NDhDNy44NzYyMiAxNS42MzY4IDcuODc2MjIgMTYuMzYzNSA4LjM3MTMzIDE2Ljc0NTVMMjAuOTQ3NyAyNi40NDc4QzIxLjYxNjYgMjYuOTYzOCAyMi42NjY3IDI2LjUwODUgMjIuNjY2NyAyNS43MDI0TDIyLjY2NjcgNi4yOTc4OFpNMjAuNTcwNiAyMy42MzFMMTAuNjc5MyAxNi4wMDAxTDIwLjU3MDYgOC4zNjkzNkwyMC41NzA2IDIzLjYzMVoiLz48L3N2Zz4=") center/var(--dds-size-16) no-repeat;
  }
  .dds__pagination__nav-prev:disabled::before {
    background: var(--dds-color-text-inactive);
  }
  .dds__pagination__nav-first::after {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMi4zNzQzIDI2LjQzOTFMMTEuMjM3NyAxNy45Njc5VjI2LjY1MzhIOS4zMzMwMVY1LjMyMDU2SDExLjIzNzdWMTQuMDA2NkwyMi4zNzQzIDUuNTg2NDNDMjIuNjQ2NiA1LjM1MTc3IDIzLjA1NjMgNS4yODE1NyAyMy40MTIxIDUuNDA4NTdDMjMuNzY4IDUuNTM1NTcgMjQgNS44MzQ3NiAyNCA2LjE2NjYyVjI1Ljg1ODlDMjQgMjYuMTkwOCAyMy43NjggMjYuNDg5OSAyMy40MTIxIDI2LjYxNjlDMjMuMDU2MyAyNi43NDM5IDIyLjY0NjYgMjYuNjczNyAyMi4zNzQzIDI2LjQzOTFaTTExLjYzMjUgMTUuOTg3MkwyMi4wOTUzIDIzLjg3OFY4LjE0NzUxTDExLjYzMjUgMTUuOTg3MloiLz48L3N2Zz4=") center/var(--dds-size-16) no-repeat;
  }
  .dds__pagination__nav-next::after {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMS4wNTIgNS41NTI1M0MxMC4zODMxIDUuMDM2NSA5LjMzMzAxIDUuNDkxODEgOS4zMzMwMSA2LjI5Nzg4VjI1LjcwMjRDOS4zMzMwMSAyNi41MDg1IDEwLjM4MzEgMjYuOTYzOCAxMS4wNTIgMjYuNDQ3OEwyMy42MjgzIDE2Ljc0NTVDMjQuMTIzNSAxNi4zNjM1IDI0LjEyMzUgMTUuNjM2OCAyMy42MjgzIDE1LjI1NDhMMTEuMDUyIDUuNTUyNTNaTTExLjQyOTEgMjMuNjMxTDExLjQyOTEgOC4zNjkzNkwyMS4zMjAzIDE2LjAwMDFMMTEuNDI5MSAyMy42MzFaIi8+PC9zdmc+") center/var(--dds-size-16) no-repeat;
  }
  .dds__pagination__nav-last::after {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMC45NTg4IDI2LjQ1MThMMjIuMDk1MyAxNy45ODA2VjI2LjY2NjVIMjRWNS4zMzMyNUgyMi4wOTUzVjE0LjAxOTNMMTAuOTU4OCA1LjU5OTEzQzEwLjY4NjQgNS4zNjQ0NiAxMC4yNzY4IDUuMjk0MjYgOS45MjA5MiA1LjQyMTI2QzkuNTY1MDQgNS41NDgyNiA5LjMzMzAxIDUuODQ3NDUgOS4zMzMwMSA2LjE3OTMyVjI1Ljg3MTZDOS4zMzMwMSAyNi4yMDM0IDkuNTY1MDQgMjYuNTAyNiA5LjkyMDkyIDI2LjYyOTZDMTAuMjc2OCAyNi43NTY2IDEwLjY4NjQgMjYuNjg2NCAxMC45NTg4IDI2LjQ1MThaTTIxLjcwMDUgMTUuOTk5OUwxMS4yMzc3IDIzLjg5MDdWOC4xNjAyMUwyMS43MDA1IDE1Ljk5OTlaIi8+PC9zdmc+") center/var(--dds-size-16) no-repeat;
  }
}
@layer component {
  :root,
  :host {
    --dds-popover-gap: var(--dds-size-8);
    --dds-popover-header-gap: var(--dds-size-16);
    --dds-popover-padding: var(--dds-size-16);
    --dds-popover-width-lg: var(--dds-size-800);
    --dds-popover-width-md: var(--dds-size-488);
    --dds-popover-width-sm: var(--dds-size-288);
  }
  .dds__popover {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    box-shadow: var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
    background: var(--dds-color-background-surface-neutral);
    box-sizing: border-box;
    max-inline-size: var(--dds-popover-width-sm);
    overflow: visible;
  }
  .dds__popover.dds__popup--pointer::after {
    box-shadow: var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
  }
  .dds__popover *,
  .dds__popover *::before,
  .dds__popover *::after {
    box-sizing: inherit;
  }
  .dds__popover--md {
    max-inline-size: var(--dds-popover-width-md);
  }
  .dds__popover--lg {
    max-inline-size: var(--dds-popover-width-lg);
  }
  @media screen and (max-width: 832px) {
    .dds__popover--lg {
      max-inline-size: var(--dds-popover-width-md);
    }
  }
  @media screen and (max-width: 520px) {
    .dds__popover--lg,
    .dds__popover--md {
      max-inline-size: var(--dds-popover-width-sm);
    }
  }
  @media screen and (max-width: 320px) {
    .dds__popover,
    .dds__popover--lg,
    .dds__popover--md {
      max-inline-size: calc(100% - var(--dds-spacing-lg));
    }
  }
  .dds__popover__container {
    background: var(--dds-color-background-surface-neutral);
    border-radius: var(--dds-border-radius-xs);
    color: var(--dds-color-text-primary);
    display: flex;
    flex-flow: column wrap;
    gap: var(--dds-popover-gap);
    padding: var(--dds-popover-padding);
    position: relative;
    z-index: 1;
  }
  .dds__popover:not(:has(.dds__popover__header)) .dds__popover__container {
    padding-block-start: calc(var(--dds-popover-padding) + var(--dds-button-size-xs) + var(--dds-popover-gap));
  }
  .dds__popover__close {
    position: absolute;
    inset-block-start: var(--dds-popover-padding);
    inset-inline-end: var(--dds-popover-padding);
  }
  .dds__popover__close::after {
    content: "";
    display: block;
    inline-size: var(--dds-icon-size-xs);
    block-size: var(--dds-icon-size-xs);
    background: var(--dds-color-text-neutral-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcuMjkyOTcgOC43MDcxOEwxNC41ODU4IDE2TDcuMjkzMSAyMy4yOTI4TDguNzA3MzIgMjQuNzA3TDE2IDE3LjQxNDJMMjMuMjkzIDI0LjcwNzJMMjQuNzA3MiAyMy4yOTNMMTcuNDE0MiAxNkwyNC43MDcgOC43MDcxOEwyMy4yOTI4IDcuMjkyOTdMMTYgMTQuNTg1OEw4LjcwNzE4IDcuMjkyOTdMNy4yOTI5NyA4LjcwNzE4WiIvPjwvc3ZnPg==") center/var(--dds-icon-size-xs) no-repeat;
  }
  .dds__popover__header {
    flex: 1 0 var(--dds-button-size-xs);
    margin-inline-end: calc(var(--dds-popover-header-gap) + var(--dds-button-size-xs));
  }
  .dds__popover__body {
    display: flex;
    flex-flow: column nowrap;
    gap: var(--dds-popover-gap);
  }
}
@layer component {
  :root,
  :host {
    --dds-progress-bar-height-lg: var(--dds-size-16);
    --dds-progress-bar-height-md: var(--dds-size-8);
    --dds-progress-bar-height-sm: var(--dds-size-4);
  }
  .dds__progress-bar {
    --background: var(--dds-color-background-surface-secondary);
    --fill: var(--dds-color-background-brand-base-rest);
    --height: var(--dds-progress-bar-height-lg);
    inline-size: 100%;
    block-size: var(--height);
    appearance: none;
    border-width: 0;
    background: var(--background);
    border-radius: var(--dds-border-radius-xs);
    overflow: hidden;
  }
  .dds__progress-bar::-webkit-progress-bar {
    background: var(--background);
    border-radius: 0;
  }
  .dds__progress-bar::-webkit-progress-value {
    background: var(--fill);
    border-radius: 0;
    transition: width var(--dds-motion-easing-ease-out) var(--dds-motion-duration-03);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__progress-bar::-webkit-progress-value {
      transition: none;
    }
  }
  .dds__progress-bar::-moz-progress-bar {
    background: var(--fill);
    border-radius: 0;
    transition: width var(--dds-motion-easing-ease-out) var(--dds-motion-duration-03);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__progress-bar::-moz-progress-bar {
      transition: none;
    }
  }
  .dds__progress-bar:indeterminate {
    position: relative;
  }
  .dds__progress-bar:indeterminate::-webkit-progress-bar {
    background: transparent;
  }
  .dds__progress-bar:indeterminate::-moz-progress-bar {
    background: transparent;
    opacity: 0;
    width: 0;
  }
  .dds__progress-bar:indeterminate::-webkit-progress-value {
    background: transparent;
    opacity: 0;
    width: 0;
  }
  .dds__progress-bar:indeterminate {
    background: linear-gradient(90deg, var(--background) 0%, var(--background) 35%, var(--fill) 35%, var(--fill) 65%, var(--background) 65%, var(--background) 100%);
    background-size: 200% 100%;
    background-position: 100% 0;
    animation: progress-bar-indeterminate 3s linear infinite;
  }
  @media (prefers-reduced-motion: reduce) {
    .dds__progress-bar:indeterminate {
      animation: none;
    }
  }
  .dds__progress-bar.dds__progress-bar--md {
    --height: var(--dds-progress-bar-height-md);
  }
  .dds__progress-bar.dds__progress-bar--sm {
    --height: var(--dds-progress-bar-height-sm);
  }
  .dds__progress-bar.dds__progress-bar--success {
    --fill: var(--dds-color-background-success-base-rest);
  }
  .dds__progress-bar.dds__progress-bar--error {
    --fill: var(--dds-color-background-error-base-rest);
  }
  .dds__progress-bar.dds__progress-bar--ai {
    --background: var(--dds-ai-color-background-surface-secondary);
    --fill: var(--dds-ai-color-background-neutral-base-rest);
  }
  .dds__progress-bar.dds__progress-bar--ai.dds__progress-bar--success {
    --fill: var(--dds-ai-color-background-success-base-rest);
  }
  .dds__progress-bar.dds__progress-bar--ai.dds__progress-bar--error {
    --fill: var(--dds-ai-color-background-error-base-rest);
  }
  @keyframes progress-bar-indeterminate {
    0% {
      background-position: 100% 0;
    }
    100% {
      background-position: -100% 0;
    }
  }
}
@layer component {
  :root,
  :host {
    --dds-progress-tracker-content-gap: var(--dds-size-4);
    --dds-progress-tracker-content-padding: var(--dds-size-12);
    --dds-progress-tracker-frame-size-lg: var(--dds-size-32);
    --dds-progress-tracker-frame-size-sm: var(--dds-size-24);
    --dds-progress-tracker-height-lg: var(--dds-size-28);
    --dds-progress-tracker-height-sm: var(--dds-size-24);
    --dds-progress-tracker-line-thickness: var(--dds-size-4);
    --dds-progress-tracker-step-gap: var(--dds-size-8);
    --dds-progress-tracker-step-horizontal-min-width-lg: var(--dds-size-80);
    --dds-progress-tracker-step-horizontal-min-width-sm: var(--dds-size-68);
  }
  .dds__progress-tracker {
    --icon-size: var(--dds-icon-size-md);
    --icon-background: var(--dds-color-text-secondary);
    --step-height: var(--dds-progress-tracker-height-sm);
    --step-line-color: var(--dds-color-background-surface-tertiary);
    --step-min-size: var(--dds-progress-tracker-step-horizontal-min-width-sm);
    --step-circle-diameter: 1.3125rem;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    display: flex;
    align-items: flex-start;
    inline-size: 100%;
  }
  .dds__progress-tracker--lg {
    --icon-size: var(--dds-icon-size-lg);
    --step-height: var(--dds-progress-tracker-height-lg);
    --step-min-size: var(--dds-progress-tracker-step-horizontal-min-width-lg);
    --step-circle-diameter: 1.75rem;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
  }
  .dds__progress-tracker__step {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    flex: 1;
    gap: var(--dds-progress-tracker-step-gap);
    min-inline-size: var(--step-min-size);
  }
  .dds__progress-tracker__step-status {
    position: relative;
    display: flex;
    align-items: center;
    align-self: stretch;
    block-size: var(--step-height);
  }
  .dds__progress-tracker__step-status::after {
    content: "";
    position: absolute;
    inset-inline-start: var(--icon-size);
    inset-block-start: 50%;
    translate: 0 -50%;
    block-size: var(--dds-progress-tracker-line-thickness);
    inline-size: calc(100% - var(--icon-size));
    background: var(--step-line-color);
  }
  .dds__progress-tracker__step-status .dds__progress-tracker__step-status-icon {
    display: inline-flex;
    place-content: center;
    inline-size: var(--icon-size);
    block-size: var(--icon-size);
    aspect-ratio: 1/1;
    background: var(--icon-background);
  }
  .dds__progress-tracker__step-status--in-progress .dds__progress-tracker__step-status-icon {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE0LjE3MjcgMi4xMTgyOUMxNC43NzEyIDIuMDQwMjIgMTUuMjg1MSAxLjk5OTQ1IDE2LjAwMDQgMi4wMDAwMUMyMy43NDQyIDIuMDA2MDEgMzAuMDAwMyA4LjI2OTM1IDMwLjAwMDMgMTZDMzAuMDAwMyAyMy43MzEyIDIzLjczMjMgMjkuOTk0IDE2LjAwMDQgMzBDMTUuMjg1MSAzMC4wMDA2IDE0Ljc3MTIgMjkuOTU5OCAxNC4xNzI3IDI5Ljg4MTdMMTQuNDMxNCAyNy44OTg1QzE0Ljk0NDQgMjcuOTY1NCAxNS4zODY0IDI4LjAwMDYgMTYuMDAwNCAyOEMyMi42Mjc4IDI3Ljk5NCAyOC4wMDAzIDIyLjUzNTEgMjguMDAwMyAxNkMyOC4wMDAzIDkuNDkyMyAyMi42NDA0IDQuMDA2MDEgMTYuMDAwNCA0LjAwMDAxQzE1LjM4NjQgMy45OTk0NSAxNC45NDQ0IDQuMDM0NTggMTQuNDMxNCA0LjEwMTQ4TDE0LjE3MjcgMi4xMTgyOVoiLz48cGF0aCBkPSJNNy40NzY0OCA0Ljg5MjlDOC40Mzk1MyA0LjE1MjgzIDkuNTAxOTkgMy41MzQ5MyAxMC42NDA3IDMuMDYyNzNMMTEuNDA2OCA0LjkxMDE4QzEwLjQzMTggNS4zMTQ1MSA5LjUyMTE5IDUuODQzOTQgOC42OTUxMyA2LjQ3ODczTDcuNDc2NDggNC44OTI5WiIvPjxwYXRoIGQ9Ik0zLjA2MjcyIDEwLjY0MDdDMy41MzQ5MiA5LjUwMiA0LjE1MjgyIDguNDM5NTQgNC44OTI4OSA3LjQ3NjQ5TDYuNDc4NzMgOC42OTUxNEM1Ljg0MzkzIDkuNTIxMiA1LjMxNDUgMTAuNDMxOCA0LjkxMDE3IDExLjQwNjhMMy4wNjI3MiAxMC42NDA3WiIvPjxwYXRoIGQ9Ik0yIDE2QzIgMTUuMzgxMiAyLjA0MDIxIDE0Ljc3MTIgMi4xMTgyOCAxNC4xNzI3TDQuMTAxNDggMTQuNDMxNEM0LjAzNDU3IDE0Ljk0NDQgNCAxNS40Njc5IDQgMTZDNCAxNi41MzIxIDQuMDM0NTcgMTcuMDU1NiA0LjEwMTQ4IDE3LjU2ODZMMi4xMTgyOCAxNy44MjczQzIuMDQwMjEgMTcuMjI4OCAyIDE2LjYxODggMiAxNloiLz48cGF0aCBkPSJNNC44OTI4OSAyNC41MjM1QzQuMTUyODIgMjMuNTYwNSAzLjUzNDkzIDIyLjQ5OCAzLjA2MjcyIDIxLjM1OTNMNC45MTAxNyAyMC41OTMyQzUuMzE0NSAyMS41NjgyIDUuODQzOTQgMjIuNDc4OCA2LjQ3ODczIDIzLjMwNDlMNC44OTI4OSAyNC41MjM1WiIvPjxwYXRoIGQ9Ik0xMC42NDA3IDI4LjkzNzNDOS41MDIgMjguNDY1MSA4LjQzOTUzIDI3Ljg0NzIgNy40NzY0OCAyNy4xMDcxTDguNjk1MTMgMjUuNTIxM0M5LjUyMTE5IDI2LjE1NjEgMTAuNDMxOCAyNi42ODU1IDExLjQwNjggMjcuMDg5OEwxMC42NDA3IDI4LjkzNzNaIi8+PHBhdGggZD0iTTE0Ljk5MzMgMjEuMjc5MUwyMy41NjQ1IDEyLjcwNzZMMjIuMTUwMyAxMS4yOTM1TDE0LjI4NjIgMTkuMTU3OEwxMC43MDczIDE1LjU3OTFMOS4yOTMxNSAxNi45OTM0TDEzLjU3OTEgMjEuMjc5MUMxMy45Njk3IDIxLjY2OTYgMTQuNjAyOCAyMS42Njk2IDE0Ljk5MzMgMjEuMjc5MVoiLz48L3N2Zz4=") alpha center/contain no-repeat;
  }
  .dds__progress-tracker__step-status--completed {
    --step-line-color: var(--dds-color-background-brand-base-rest);
    --icon-background: var(--dds-color-text-brand);
  }
  .dds__progress-tracker__step-status--completed .dds__progress-tracker__step-status-icon {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zMCAxNkMzMCAyMy43MzIgMjMuNzMyIDMwIDE2IDMwQzguMjY4MDEgMzAgMiAyMy43MzIgMiAxNkMyIDguMjY4MDEgOC4yNjgwMSAyIDE2IDJDMjMuNzMyIDIgMzAgOC4yNjgwMSAzMCAxNlpNMjMuNzQxMyAxMi44ODQ0TDE1LjE3MDEgMjEuNDU1OEMxNC42ODIgMjEuOTQzOSAxMy44OTA1IDIxLjk0NCAxMy40MDI0IDIxLjQ1NThMOS4xMTYzOCAxNy4xNzAxTDEwLjg4NDEgMTUuNDAyM0wxNC4yODYyIDE4LjgwNDJMMjEuOTczNSAxMS4xMTY2TDIzLjc0MTMgMTIuODg0NFoiLz48L3N2Zz4=") alpha center/contain no-repeat;
  }
  .dds__progress-tracker__step-status--error {
    --step-line-color: var(--dds-color-background-surface-tertiary);
    --icon-background: var(--dds-color-text-error-rest);
  }
  .dds__progress-tracker__step-status--error .dds__progress-tracker__step-status-icon {
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNi43MDcxIDIuMjkyODlDMTYuMzE2NiAxLjkwMjM3IDE1LjY4MzQgMS45MDIzNyAxNS4yOTI5IDIuMjkyODlMMi4yOTI4OSAxNS4yOTI5QzEuOTAyMzcgMTUuNjgzNCAxLjkwMjM3IDE2LjMxNjYgMi4yOTI4OSAxNi43MDcxTDE1LjI5MjkgMjkuNzA3MUMxNS42ODM0IDMwLjA5NzYgMTYuMzE2NiAzMC4wOTc2IDE2LjcwNzEgMjkuNzA3MUwyOS43MDcxIDE2LjcwNzFDMzAuMDk3NiAxNi4zMTY2IDMwLjA5NzYgMTUuNjgzNCAyOS43MDcxIDE1LjI5MjlMMTYuNzA3MSAyLjI5Mjg5Wk0xNC43NTAzIDE3LjAwMDJWOS4wMDAxOEgxNy4yNTAzVjE3LjAwMDJIMTQuNzUwM1pNMTQuNzUwMyAyMy4wMDAyVjIwLjAwMDJIMTcuMjUwM1YyMy4wMDAySDE0Ljc1MDNaIi8+PC9zdmc+") alpha center/contain no-repeat;
  }
  .dds__progress-tracker__step-status--active .dds__progress-tracker__step-status-icon,
  .dds__progress-tracker__step-status--inactive .dds__progress-tracker__step-status-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    mask: unset;
    border: unset;
    background: transparent;
  }
  .dds__progress-tracker__step-status--active .dds__progress-tracker__step-status-icon::before,
  .dds__progress-tracker__step-status--inactive .dds__progress-tracker__step-status-icon::before {
    content: "";
    box-sizing: border-box;
    inline-size: var(--step-circle-diameter);
    block-size: var(--step-circle-diameter);
    aspect-ratio: 1/1;
    border-radius: var(--dds-border-radius-rounded);
    border: var(--dds-border-width-sm) solid currentColor;
    background: var(--icon-background);
  }
  .dds__progress-tracker__step-status--active {
    --step-line-color: var(--dds-color-background-surface-tertiary);
    --icon-background: var(--dds-color-background-surface-neutral);
  }
  .dds__progress-tracker__step-status--active .dds__progress-tracker__step-status-icon::before {
    border-color: var(--dds-color-border-brand-base);
  }
  .dds__progress-tracker__step-status--inactive {
    --step-line-color: var(--dds-color-background-surface-inactive);
    --icon-background: var(--dds-color-background-surface-inactive);
  }
  .dds__progress-tracker__step-status--inactive .dds__progress-tracker__step-status-icon::before {
    border-color: var(--dds-color-border-inactive-base);
  }
  .dds__progress-tracker__step-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    padding-inline-end: var(--dds-progress-tracker-content-padding);
    gap: var(--dds-progress-tracker-content-gap);
  }
  .dds__progress-tracker--vertical {
    flex-direction: column;
    justify-content: center;
    block-size: 100%;
  }
  .dds__progress-tracker--vertical .dds__progress-tracker__step {
    min-inline-size: unset;
    flex-direction: row;
    flex: auto;
  }
  .dds__progress-tracker--vertical .dds__progress-tracker__step-status {
    block-size: unset;
    inline-size: var(--icon-size);
    flex-direction: column;
  }
  .dds__progress-tracker--vertical .dds__progress-tracker__step-status::after {
    inset-inline-start: 50%;
    inset-block-start: var(--icon-size);
    translate: -50% 0;
    inline-size: var(--dds-progress-tracker-line-thickness);
    block-size: calc(100% - var(--icon-size));
  }
  .dds__progress-tracker--vertical .dds__progress-tracker__step-content {
    flex: 1 0 0;
    padding-inline-end: 0;
    padding-block-end: var(--dds-progress-tracker-content-padding);
  }
}
@layer component {
  :root,
  :host {
    --dds-radio-button-check-duration: 100ms;
    --dds-radio-button-check-easing: ease-out;
    --dds-radio-button-check-size: var(--dds-size-8);
    --dds-radio-button-motion-duration: 100ms;
    --dds-radio-button-motion-easing: ease-out;
    --dds-radio-button-size-duration: 100ms;
    --dds-radio-button-size-easing: ease-out;
    --dds-radio-button-size-lg: var(--dds-size-20);
    --dds-radio-button-size-sm: var(--dds-size-16);
  }
  .dds__radio-button {
    --size: var(--dds-radio-button-size-lg);
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-neutral-base);
    --checked-background: var(--dds-color-border-neutral-base);
    --checked-border: var(--dds-color-background-info-base-rest);
    --dot-color: var(--dds-color-background-surface-neutral);
    appearance: none;
    margin: 0;
    outline: 0;
    display: inline-grid;
    cursor: pointer;
    height: var(--size);
    width: var(--size);
    min-height: var(--size);
    min-width: var(--size);
    border: var(--dds-border-width-xs) solid var(--border-color);
    border-radius: var(--dds-border-radius-rounded);
    background: var(--background);
    place-items: center;
    box-sizing: border-box;
  }
  .dds__radio-button:hover, .dds__radio-button:focus-visible {
    transition: border-color var(--dds-radio-button-motion-easing) var(--dds-radio-button-motion-duration), background var(--dds-radio-button-motion-easing) var(--dds-radio-button-motion-duration), box-shadow var(--dds-radio-button-motion-easing) var(--dds-radio-button-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__radio-button:hover, .dds__radio-button:focus-visible {
      transition: none;
    }
  }
  .dds__radio-button::after {
    content: "";
    width: calc(var(--size) / 2);
    height: calc(var(--size) / 2);
    border-radius: var(--dds-border-radius-rounded);
    background: var(--dot-color);
    opacity: 0;
    transform: scale(1);
    transition: opacity var(--dds-radio-button-motion-easing) var(--dds-radio-button-motion-duration), transform var(--dds-radio-button-motion-easing) var(--dds-radio-button-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__radio-button::after {
      transition: none;
    }
  }
  .dds__radio-button:hover {
    --border-color: var(--dds-color-border-neutral-base);
    --background: var(--dds-color-background-neutral-subtle-hover);
    border-radius: var(--dds-border-radius-rounded);
  }
  .dds__radio-button:active {
    --background: var(--dds-color-background-neutral-subtle-pressed);
    border-radius: var(--dds-border-radius-rounded);
  }
  .dds__radio-button:focus-visible {
    --border-color: var(--dds-color-border-neutral-base);
    --background: var(--dds-color-background-neutral-subtle-hover);
    border-radius: var(--dds-border-radius-rounded);
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-rounded);
  }
  .dds__radio-button:checked {
    --background: var(--dds-color-background-brand-base-rest);
    --border-color: var(--dds-color-background-brand-base-rest);
  }
  .dds__radio-button:checked::after {
    opacity: 1;
    transform: scale(1);
  }
  .dds__radio-button:disabled {
    --background: var(--dds-color-background-surface-inactive);
    --border-color: var(--dds-color-border-inactive-base);
    cursor: not-allowed;
  }
  .dds__radio-button:disabled::after {
    --icon-color: var(--dds-color-text-inactive);
  }
  .dds__radio-button:checked:disabled {
    --border-color: transparent;
  }
  .dds__radio-button--sm {
    --size: var(--dds-radio-button-size-sm);
  }
}
@layer component {
  :root,
  :host {
    --dds-side-navigation-border: var(--dds-size-1);
    --dds-side-navigation-collapsed-width: var(--dds-size-56);
    --dds-side-navigation-expanded-width: var(--dds-size-280);
    --dds-side-navigation-motion-duration: 300ms;
    --dds-side-navigation-motion-easing: ease-out;
    --dds-side-navigation-padding: var(--dds-size-8);
  }
  .dds__sidenav {
    box-sizing: content-box;
    display: flex;
    flex-direction: column;
    background: var(--dds-color-background-surface-neutral);
    width: var(--dds-side-navigation-expanded-width);
    height: 100%;
    border-right: var(--dds-side-navigation-border) solid var(--dds-color-border-neutral-pale);
    transition: width var(--dds-side-navigation-motion-easing) var(--dds-side-navigation-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__sidenav {
      transition: none;
    }
  }
  .dds__sidenav__menu {
    padding: 0.25rem;
    overflow-y: auto;
    overflow-x: hidden;
  }
  @supports (scrollbar-width: thin) {
    .dds__sidenav__menu {
      scrollbar-width: thin;
      scrollbar-color: var(--dds-color-background-surface-tertiary) var(--dds-color-background-surface-neutral);
      scrollbar-gutter: auto;
    }
  }
  .dds__sidenav__footer {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    margin-top: auto;
    padding: 0.25rem;
  }
  .dds__sidenav__collapse-button::after {
    content: "";
    display: block;
    width: var(--dds-icon-size-sm);
    height: var(--dds-icon-size-sm);
    background: var(--dds-color-background-brand-base-rest);
    mask: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMzIgMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05LjI5Mzg3IDE1LjI5M0wxOS4yOTM5IDUuMjkyOTdMMjAuNzA4MSA2LjcwNzE4TDExLjQxNTIgMTYuMDAwMUwyMC43MDgxIDI1LjI5M0wxOS4yOTM5IDI2LjcwNzJMOS4yOTM4NyAxNi43MDcyQzguOTAzMzUgMTYuMzE2NyA4LjkwMzM1IDE1LjY4MzUgOS4yOTM4NyAxNS4yOTNaIi8+PC9zdmc+") center/var(--dds-icon-size-sm) no-repeat;
  }
  .dds__sidenav__item,
  .dds__sidenav__group {
    flex-shrink: 0;
  }
  .dds__sidenav__item .dds__icon,
  .dds__sidenav__group .dds__icon {
    font-size: var(--dds-icon-size-sm);
    width: var(--dds-icon-size-sm);
    height: var(--dds-icon-size-sm);
    margin: 0.125rem;
  }
  .dds__sidenav__item,
  .dds__sidenav__group-label {
    overflow: hidden;
  }
  .dds__sidenav__group-label {
    text-align: left;
  }
  .dds__sidenav__item-content {
    display: inline-flex;
    align-items: flex-start;
  }
  .dds__sidenav__item--active {
    background: var(--dds-color-background-neutral-subtle-rest);
  }
  .dds__sidenav__item--active::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block: 0;
    width: 0.25rem;
    background: var(--dds-color-background-brand-base-rest);
  }
  .dds__sidenav__item--active:hover, .dds__sidenav__item--active:focus-visible {
    background: var(--dds-color-background-neutral-subtle-hover);
  }
  .dds__sidenav__item--active:active {
    background: var(--dds-color-background-neutral-subtle-pressed);
  }
  .dds__sidenav--collapsed {
    width: var(--dds-side-navigation-collapsed-width);
  }
  .dds__sidenav--collapsed .dds__sidenav__item,
  .dds__sidenav--collapsed .dds__sidenav__group-label {
    max-width: 3rem;
    padding-inline: 0;
    justify-content: center;
    overflow: hidden;
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:not(:has(> .dds__sidenav__group-label > .dds__icon:first-child)),
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__item:not(:has(> .dds__icon:first-child)) {
    display: none;
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__item:has(> .dds__icon:first-child) {
    gap: 0;
    /* stylelint-disable-next-line selector-max-compound-selectors */
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__item:has(> .dds__icon:first-child) > *:not(.dds__icon:first-child) {
    display: none;
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:has(> .dds__sidenav__group-label > .dds__icon:first-child) {
    /* stylelint-disable-next-line selector-max-compound-selectors */
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:has(> .dds__sidenav__group-label > .dds__icon:first-child) > .dds__sidenav__group-label {
    gap: 0;
    /* stylelint-disable-next-line selector-max-compound-selectors */
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:has(> .dds__sidenav__group-label > .dds__icon:first-child) > .dds__sidenav__group-label > *:not(.dds__icon:first-child) {
    display: none;
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:has(> .dds__sidenav__group-label > .dds__icon:first-child) > .dds__sidenav__group-label {
    /* stylelint-disable-next-line selector-max-compound-selectors */
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:has(> .dds__sidenav__group-label > .dds__icon:first-child) > .dds__sidenav__group-label::after {
    display: none;
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:has(> .dds__sidenav__group-label > .dds__icon:first-child) {
    /* stylelint-disable-next-line selector-max-compound-selectors */
  }
  .dds__sidenav--collapsed .dds__sidenav__menu > .dds__sidenav__group:has(> .dds__sidenav__group-label > .dds__icon:first-child) > .dds__sidenav__group-content {
    display: none;
  }
  .dds__sidenav--is-expanding .dds__sidenav__item,
  .dds__sidenav--is-expanding .dds__sidenav__group-label {
    width: calc(var(--dds-side-navigation-expanded-width) - 0.25rem - 0.25rem);
  }
  .dds__sidenav--collapsed .dds__sidenav__collapse-button::after {
    transform: rotate(180deg);
  }
}
@layer component {
  :root,
  :host {
    --dds-switch-handle-size-lg: var(--dds-size-20);
    --dds-switch-handle-size-sm: var(--dds-size-16);
    --dds-switch-motion-duration: 100ms;
    --dds-switch-motion-easing: ease-out;
    --dds-switch-track-height-lg: var(--dds-size-24);
    --dds-switch-track-height-sm: var(--dds-size-20);
    --dds-switch-track-width-lg: var(--dds-size-40);
    --dds-switch-track-width-sm: var(--dds-size-32);
  }
  :root,
  :host {
    --dds-switch-track-active: var(--dds-color-slate-50);
    --dds-switch-track-hover: var(--dds-color-slate-40);
    --dds-switch-track-rest: var(--dds-color-slate-30);
  }
  @media screen and (prefers-color-scheme: dark) {
    :root,
    :host {
      --dds-switch-track-active: var(--dds-color-slate-50);
      --dds-switch-track-hover: var(--dds-color-slate-40);
      --dds-switch-track-rest: var(--dds-color-slate-30);
    }
  }
  .dds--light-mode {
    --dds-switch-track-active: var(--dds-color-slate-50);
    --dds-switch-track-hover: var(--dds-color-slate-40);
    --dds-switch-track-rest: var(--dds-color-slate-30);
  }
  .dds--dark-mode {
    --dds-switch-track-active: var(--dds-color-slate-50);
    --dds-switch-track-hover: var(--dds-color-slate-40);
    --dds-switch-track-rest: var(--dds-color-slate-30);
  }
  .dds__switch {
    --track-width: var(--dds-switch-track-width-lg);
    --track-height: var(--dds-switch-track-height-lg);
    --handle-size: var(--dds-switch-handle-size-lg);
    --handle-offset: calc((var(--track-height) - var(--handle-size)) / 2);
    appearance: none;
    margin: 0;
    outline: 0;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    inline-size: var(--track-width);
    block-size: var(--track-height);
    border-radius: calc(var(--track-height) / 2);
    background: var(--dds-switch-track-rest);
    cursor: pointer;
    transition: background var(--dds-switch-motion-easing) var(--dds-switch-motion-duration), box-shadow var(--dds-switch-motion-easing) var(--dds-switch-motion-duration), transform var(--dds-switch-motion-easing) var(--dds-switch-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__switch {
      transition: none;
    }
  }
  .dds__switch::before {
    content: "";
    position: absolute;
    inset-inline-start: var(--handle-offset);
    inset-block-start: 50%;
    box-sizing: border-box;
    inline-size: var(--handle-size);
    block-size: var(--handle-size);
    border-radius: 50%;
    background: var(--dds-color-background-surface-neutral);
    transform: translate(0, -50%);
    border: 1px solid var(--dds-color-border-neutral-base);
    transition: transform var(--dds-switch-motion-easing) var(--dds-switch-motion-duration), background var(--dds-switch-motion-easing) var(--dds-switch-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__switch::before {
      transition: none;
    }
  }
  .dds__switch:hover {
    background: var(--dds-switch-track-hover);
  }
  .dds__switch:active {
    background: var(--dds-switch-track-active);
  }
  .dds__switch:checked {
    background: var(--dds-color-background-brand-base-rest);
  }
  .dds__switch:checked::before {
    border: 0;
    transform: translate(calc(var(--track-width) - var(--handle-size) - var(--handle-offset) * 2), -50%);
  }
  .dds__switch:checked:active:not(:disabled) {
    background: var(--dds-color-background-brand-base-pressed);
  }
  .dds__switch:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-rounded);
  }
  .dds__switch:disabled {
    cursor: not-allowed;
    background: var(--dds-color-background-surface-inactive);
  }
  .dds__switch:disabled::before {
    background: var(--dds-color-background-surface-inactive);
    border: 1px solid var(--dds-color-border-inactive-base);
  }
  .dds__switch--sm {
    --track-width: var(--dds-switch-track-width-sm);
    --track-height: var(--dds-switch-track-height-sm);
    --handle-size: var(--dds-switch-handle-size-sm);
  }
}
@layer component {
  :root,
  :host {
    --dds-table-cell-height-lg: var(--dds-size-68);
    --dds-table-cell-height-md: var(--dds-size-52);
    --dds-table-cell-height-sm: var(--dds-size-36);
    --dds-table-cell-padding-horizontal: var(--dds-size-16);
    --dds-table-cell-padding-vertical-lg: var(--dds-size-24);
    --dds-table-cell-padding-vertical-md: var(--dds-size-16);
    --dds-table-cell-padding-vertical-sm: var(--dds-size-8);
    --dds-table-filter-height: var(--dds-size-48);
    --dds-table-filter-padding: var(--dds-size-8);
    --dds-table-header-gap: var(--dds-size-8);
    --dds-table-header-height-lg: var(--dds-size-88);
    --dds-table-header-height-md: var(--dds-size-72);
    --dds-table-header-height-sm: var(--dds-size-56);
    --dds-table-header-padding-horizontal: var(--dds-size-16);
    --dds-table-header-padding-vertical-lg: var(--dds-size-32);
    --dds-table-header-padding-vertical-md: var(--dds-size-24);
    --dds-table-header-padding-vertical-sm: var(--dds-size-16);
    --dds-table-toolbar-padding: var(--dds-size-16);
  }
  .dds__table {
    width: 100%;
    color: var(--dds-color-text-primary);
  }
  .dds__table__grid {
    display: grid;
    overflow-x: auto;
    background: var(--dds-color-background-surface-neutral);
  }
  .dds__table__head, .dds__table__body {
    display: contents;
  }
  .dds__table__row {
    display: contents;
  }
  .dds__table__cell {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    display: flex;
    align-items: start;
    padding-inline: var(--dds-table-cell-padding-horizontal);
    padding-block: var(--dds-table-cell-padding-vertical-md);
    background: var(--dds-color-background-surface-neutral);
    border-right: var(--dds-border-width-xs) solid var(--dds-color-border-neutral-pale);
    border-bottom: var(--dds-border-width-xs) solid var(--dds-color-border-neutral-pale);
  }
  .dds__table__cell:last-child {
    border-right: 0;
  }
  .dds__table__cell--head {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    padding-inline: var(--dds-table-header-padding-horizontal);
    padding-block: var(--dds-table-header-padding-vertical-md);
  }
  .dds__table--alternate-rows {
    /* stylelint-disable-next-line selector-max-compound-selectors */
  }
  .dds__table--alternate-rows .dds__table__body .dds__table__row:nth-of-type(odd) .dds__table__cell {
    background: var(--dds-color-background-surface-secondary);
  }
  .dds__table--sm .dds__table__cell {
    padding-block: var(--dds-table-cell-padding-vertical-sm);
  }
  .dds__table--sm .dds__table__cell--head {
    padding-block: var(--dds-table-header-padding-vertical-sm);
  }
  .dds__table--lg .dds__table__cell {
    padding-block: var(--dds-table-cell-padding-vertical-lg);
  }
  .dds__table--lg .dds__table__cell--head {
    padding-block: var(--dds-table-header-padding-vertical-lg);
  }
  .dds__table__empty {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    display: flex;
    align-items: center;
    justify-content: center;
    padding-inline: var(--dds-table-cell-padding-horizontal);
    padding-block: var(--dds-table-cell-padding-vertical-md);
    background: var(--dds-color-background-surface-neutral);
    border-bottom: var(--dds-border-width-xs) solid var(--dds-color-border-neutral-pale);
  }
}
@layer component {
  :root,
  :host {
    --dds-tab-content-box-padding: var(--dds-size-40);
    --dds-tab-divider-size: var(--dds-size-2);
    --dds-tab-gap: var(--dds-size-8);
    --dds-tab-max-width: var(--dds-size-320);
    --dds-tab-min-width: var(--dds-size-98);
    --dds-tab-motion-duration: 300ms;
    --dds-tab-motion-easing: ease-out;
    --dds-tab-padding-horizontal: var(--dds-size-32);
    --dds-tab-padding-vertical: var(--dds-size-16);
    --dds-tab-slot-padding-vertical: var(--dds-size-16);
    --dds-tab-stacked-content-box-padding: var(--dds-size-20);
    --dds-tab-stacked-gap: var(--dds-size-8);
    --dds-tab-stacked-max-width: var(--dds-size-767);
    --dds-tab-stacked-min-width: var(--dds-size-320);
    --dds-tab-stacked-padding-horizontal: var(--dds-size-16);
  }
  .dds__tabs {
    --tab-background-color: transparent;
    --tab-background-color-hover: var(--dds-color-background-neutral-subtle-hover);
    --tab-border-color: var(--dds-color-background-surface-tertiary);
    --contained-gutter-width: var(--dds-spacing-xs);
    --focus-ring-width: var(--dds-size-4);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
  }
  .dds__tabs__header {
    display: flex;
    align-items: flex-end;
    box-sizing: border-box;
    position: relative;
    padding: var(--dds-spacing-xs);
    overflow-x: auto;
    overflow-y: hidden;
  }
  @supports (scrollbar-width: thin) {
    .dds__tabs__header {
      scrollbar-width: thin;
      scrollbar-color: var(--dds-color-background-surface-tertiary) var(--dds-color-background-surface-neutral);
      scrollbar-gutter: auto;
    }
  }
  .dds__tabs__header::after {
    content: "";
    position: relative;
    inset-block-start: 0;
    inset-inline-start: 0;
    width: 100%;
    height: var(--dds-tab-divider-size);
    background: var(--dds-color-background-surface-tertiary);
  }
  .dds__tabs__tab {
    outline: 0;
    border: 0;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    white-space: nowrap;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    height: 100%;
    max-width: var(--dds-tab-max-width);
    min-width: var(--dds-tab-min-width);
    flex: 0 0 auto;
    border-block-end: var(--dds-tab-divider-size) solid var(--tab-border-color);
    padding-inline: var(--dds-tab-padding-horizontal);
    padding-block: var(--dds-tab-padding-vertical);
    gap: var(--dds-tab-gap);
    color: var(--dds-color-text-primary);
    background: var(--tab-background-color);
    transition: color var(--dds-tab-motion-easing) var(--dds-tab-motion-duration), border-color var(--dds-tab-motion-easing) var(--dds-tab-motion-duration), background var(--dds-tab-motion-easing) var(--dds-tab-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__tabs__tab {
      transition: none;
    }
  }
  .dds__tabs__tab:hover, .dds__tabs__tab:focus-visible {
    background: var(--tab-background-color-hover);
    --tab-border-color: var(--dds-color-background-neutral-base-hover);
  }
  .dds__tabs__tab:focus-visible {
    box-shadow: 0 0 0 var(--dds-drop-shadow-spread-2) var(--dds-color-border-focus-ring1), 0 0 0 var(--dds-size-4) var(--dds-color-border-focus-ring2);
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__tabs__tab:active {
    --tab-background-color-hover: var(--dds-color-background-neutral-subtle-pressed);
  }
  .dds__tabs__tab.dds__tabs__tab--active {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-strong);
    line-height: var(--dds-typography-body-2-line-height);
    --tab-border-color: var(--dds-color-background-brand-base-rest);
  }
  .dds__tabs__tab__content {
    display: flex;
    align-items: center;
    gap: var(--dds-tab-gap);
  }
  .dds__tabs__body {
    width: 100%;
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
  }
  .dds__tabs__panel {
    display: none;
    padding: var(--dds-tab-content-box-padding);
  }
  .dds__tabs__panel.dds__tabs__panel--active {
    display: block;
  }
  .dds__tabs--vertical {
    grid-template-rows: 1fr;
    grid-template-columns: auto 1fr;
  }
  .dds__tabs--vertical .dds__tabs__header {
    flex-direction: column;
    flex-shrink: 0;
    overflow-y: auto;
  }
  .dds__tabs--vertical .dds__tabs__header::after {
    width: var(--dds-tab-divider-size);
    height: 100%;
  }
  .dds__tabs--vertical .dds__tabs__tab {
    height: auto;
    width: 100%;
    justify-content: flex-end;
    border-block-end: 0;
    border-inline-end: var(--dds-tab-divider-size) solid var(--tab-border-color);
  }
  .dds__tabs--vertical .dds__tabs__panel {
    padding-block: 0;
    padding-inline: var(--dds-tab-content-box-padding);
  }
  .dds__tabs--contained .dds__tabs__header::before {
    content: "";
    position: absolute;
    inset-block-end: 0;
    inset-inline-start: 0;
    width: 100%;
    height: var(--contained-gutter-width);
    background: var(--dds-color-background-surface-neutral);
  }
  .dds__tabs--contained .dds__tabs__header:has(.dds__tabs__tab ~ .dds__tabs__tab)::after {
    inset-inline-start: var(--focus-ring-width);
  }
  .dds__tabs--contained .dds__tabs__tab {
    border-block-start: var(--dds-tab-divider-size) solid transparent;
  }
  .dds__tabs--contained .dds__tabs__tab:first-of-type::before, .dds__tabs--contained .dds__tabs__tab:last-of-type::before {
    content: "";
    position: absolute;
    box-sizing: content-box;
    inset-block-end: calc(-1 * var(--dds-tab-divider-size));
    height: 100%;
    background: transparent;
    border-block-start: var(--dds-tab-divider-size) solid transparent;
    border-block-end: var(--dds-tab-divider-size) solid var(--tab-border-color);
    transition: color var(--dds-tab-motion-easing) var(--dds-tab-motion-duration), border-color var(--dds-tab-motion-easing) var(--dds-tab-motion-duration), background var(--dds-tab-motion-easing) var(--dds-tab-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__tabs--contained .dds__tabs__tab:first-of-type::before, .dds__tabs--contained .dds__tabs__tab:last-of-type::before {
      transition: none;
    }
  }
  .dds__tabs--contained .dds__tabs__tab:first-of-type:hover::before, .dds__tabs--contained .dds__tabs__tab:last-of-type:hover::before {
    background: var(--tab-background-color-hover);
  }
  .dds__tabs--contained .dds__tabs__tab:first-of-type:focus-visible::before, .dds__tabs--contained .dds__tabs__tab:last-of-type:focus-visible::before {
    background: transparent;
    border-color: transparent;
  }
  .dds__tabs--contained .dds__tabs__tab:first-of-type::before {
    inset-inline-start: calc(-1 * var(--contained-gutter-width));
    width: var(--contained-gutter-width);
  }
  .dds__tabs--contained .dds__tabs__tab:first-of-type::after {
    margin-inline-start: 0;
  }
  .dds__tabs--contained .dds__tabs__tab:last-of-type::before {
    inset-inline-end: calc(-1 * var(--focus-ring-width));
    width: var(--focus-ring-width);
  }
  .dds__tabs--contained .dds__tabs__tab:last-of-type::after {
    width: 100%;
    margin-inline-end: var(--focus-ring-width);
  }
  .dds__tabs--contained .dds__tabs__tab::after {
    content: "";
    position: absolute;
    inset-block-end: calc((var(--dds-tab-divider-size) + var(--contained-gutter-width)) * -1);
    inset-inline-start: 0;
    width: calc(100% + var(--focus-ring-width));
    height: var(--contained-gutter-width);
    margin-inline-start: var(--focus-ring-width);
    background: var(--dds-color-background-surface-neutral);
  }
  .dds__tabs--contained .dds__tabs__tab:focus-visible::after {
    background: transparent;
  }
  .dds__tabs--contained .dds__tabs__tab.dds__tabs__tab--active {
    --tab-background-color: var(--dds-color-background-surface-neutral);
    border-block-end-color: transparent;
    border-block-start-color: var(--tab-border-color);
  }
  .dds__tabs--contained .dds__tabs__tab.dds__tabs__tab--active:first-of-type::before, .dds__tabs--contained .dds__tabs__tab.dds__tabs__tab--active:last-of-type::before {
    background: var(--dds-color-background-surface-neutral);
    border-block-start: var(--dds-tab-divider-size) solid var(--tab-border-color);
    border-block-end: var(--dds-tab-divider-size) solid transparent;
  }
  .dds__tabs--contained .dds__tabs__tab.dds__tabs__tab--active:first-of-type:hover::before, .dds__tabs--contained .dds__tabs__tab.dds__tabs__tab--active:last-of-type:hover::before {
    background: var(--tab-background-color-hover);
  }
  .dds__tabs--contained .dds__tabs__tab.dds__tabs__tab--active:first-of-type:focus-visible::before, .dds__tabs--contained .dds__tabs__tab.dds__tabs__tab--active:last-of-type:focus-visible::before {
    background: transparent;
    border-color: transparent;
  }
  .dds__tabs--contained .dds__tabs__body {
    background: var(--dds-color-background-surface-neutral);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__header::before {
    inset-block-start: 0;
    inset-block-end: auto;
    inset-inline-start: auto;
    inset-inline-end: 0;
    width: var(--contained-gutter-width);
    height: 100%;
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__header:has(.dds__tabs__tab ~ .dds__tabs__tab)::after {
    inset-inline-start: auto;
    inset-block-start: var(--focus-ring-width);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab {
    border-block-start: 0;
    border-inline-start: var(--dds-tab-divider-size) solid transparent;
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab:first-of-type::before, .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab:last-of-type::before {
    inset-block-end: auto;
    inset-inline-start: auto;
    inset-inline-end: calc(-1 * var(--dds-tab-divider-size));
    width: 100%;
    border-block-start: 0;
    border-block-end: 0;
    border-inline-start: var(--dds-tab-divider-size) solid transparent;
    border-inline-end: var(--dds-tab-divider-size) solid var(--tab-border-color);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab:first-of-type::before {
    inset-block-start: calc(-1 * var(--contained-gutter-width));
    height: var(--contained-gutter-width);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab:first-of-type::after {
    margin-inline-start: var(--focus-ring-width);
    margin-block-start: 0;
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab:last-of-type::before {
    inset-block-end: calc(-1 * var(--focus-ring-width));
    height: var(--focus-ring-width);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab:last-of-type::after {
    margin-inline-end: 0;
    height: 100%;
    margin-block-end: var(--focus-ring-width);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab::after {
    inset-block-start: 0;
    inset-block-end: auto;
    inset-inline-start: auto;
    inset-inline-end: calc((var(--dds-tab-divider-size) + var(--contained-gutter-width)) * -1);
    width: var(--contained-gutter-width);
    height: calc(100% + var(--focus-ring-width));
    margin-inline-start: 0;
    margin-block-start: var(--focus-ring-width);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab.dds__tabs__tab--active {
    border-block-end: 0;
    border-block-start-color: transparent;
    border-inline-end-color: transparent;
    border-inline-start-color: var(--tab-border-color);
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab.dds__tabs__tab--active:first-of-type::before, .dds__tabs--contained.dds__tabs--vertical .dds__tabs__tab.dds__tabs__tab--active:last-of-type::before {
    border-block-start: 0;
    border-block-end: 0;
    border-inline-start: var(--dds-tab-divider-size) solid var(--tab-border-color);
    border-inline-end: var(--dds-tab-divider-size) solid transparent;
  }
  .dds__tabs--contained.dds__tabs--vertical .dds__tabs__panel {
    padding: var(--dds-tab-content-box-padding);
  }
}
@layer component {
  :root,
  :host {
    --dds-text-area-min-height-lg: var(--dds-size-98);
    --dds-text-area-min-height-sm: var(--dds-size-76);
    --dds-text-area-min-width: var(--dds-size-120);
    --dds-text-area-motion-duration: 300ms;
    --dds-text-area-motion-easing: ease-out;
  }
  .dds__text-area {
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-color-border-neutral-subtle);
    --border-radius: var(--dds-border-radius-xs);
    --color: var(--dds-color-text-primary);
    --placeholder-color: var(--dds-color-text-tertiary);
    --min-height: var(--dds-text-area-min-height-lg);
    --padding-horizontal: var(--dds-input-padding-horizontal-lg);
    --padding-vertical: var(--dds-input-padding-vertical-lg);
    outline: var(--dds-border-radius-sm) solid transparent;
    outline-offset: var(--dds-border-radius-sm);
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-2-size);
    font-weight: var(--dds-typography-body-2-weight-default);
    line-height: var(--dds-typography-body-2-line-height);
    background: var(--background);
    border-radius: var(--border-radius);
    border: var(--dds-border-width-xs) solid var(--border-color);
    box-sizing: border-box;
    color: var(--color);
    min-height: var(--min-height);
    width: 100%;
    padding-inline: var(--padding-horizontal);
    padding-block: var(--padding-vertical);
  }
  .dds__text-area:hover, .dds__text-area:focus {
    --border-color: var(--dds-color-text-brand);
    transition: border-color var(--dds-text-area-motion-easing) var(--dds-text-area-motion-duration), background var(--dds-text-area-motion-easing) var(--dds-text-area-motion-duration), outline-color var(--dds-text-area-motion-easing) var(--dds-text-area-motion-duration);
  }
  @media screen and (prefers-reduced-motion: reduce) {
    .dds__text-area:hover, .dds__text-area:focus {
      transition: none;
    }
  }
  .dds__text-area:focus {
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-color-border-focus-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: var(--dds-border-radius-xs);
  }
  .dds__text-area:read-only {
    --border-color: var(--dds-color-border-neutral-subtle);
    --color: var(--dds-color-text-primary);
    --background: var(--dds-color-background-surface-primary);
  }
  .dds__text-area:disabled {
    --border-color: var(--dds-color-border-inactive-base);
    --color: var(--dds-color-text-inactive);
    --background: var(--dds-color-background-surface-inactive);
    cursor: not-allowed;
  }
  .dds__text-area::placeholder {
    color: var(--placeholder-color);
  }
  .dds__text-area--sm {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    --min-height: var(--dds-text-area-min-height-sm);
    --padding-horizontal: var(--dds-input-padding-horizontal-sm);
    --padding-vertical: var(--dds-input-padding-vertical-sm);
  }
  .dds__text-area--invalid,
  .dds__text-area--invalid:read-only {
    --border-color: var(--dds-color-text-error-rest);
  }
  .dds__text-area--ai {
    --background: var(--dds-color-background-surface-neutral);
    --border-color: var(--dds-ai-color-border-neutral-subtle);
    --border-radius: var(--dds-border-radius-md);
    --color: var(--dds-ai-color-text-primary);
    --placeholder-color: var(--dds-ai-color-text-tertiary);
  }
  .dds__text-area--ai:hover, .dds__text-area--ai:focus-visible {
    --border-color: var(--dds-color-border-brand-base);
  }
  .dds__text-area--ai:focus-visible {
    outline: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2)) solid var(--dds-ai-color-border-focus-base-ring2);
    outline-offset: calc(var(--dds-size-4) - var(--dds-drop-shadow-spread-2));
    border-radius: var(--dds-border-radius-md);
  }
  .dds__text-area--ai:read-only {
    --color: var(--dds-ai-color-text-primary);
    --background: var(--dds-color-background-surface-secondary);
  }
  .dds__text-area--ai:disabled {
    --border-color: var(--dds-ai-color-border-neutral-inactive);
    --color: var(--dds-ai-color-text-inactive);
    --background: var(--dds-ai-color-background-surface-inactive);
  }
  .dds__text-area--ai::placeholder {
    color: var(--placeholder-color);
  }
  .dds__text-area--ai.dds__text-area--invalid {
    --border-color: var(--dds-ai-color-border-error-base);
  }
}
@layer component {
  :root,
  :host {
    --dds-tooltip-gap: var(--dds-size-8);
    --dds-tooltip-internal-max-width: var(--dds-size-176);
    --dds-tooltip-max-width: var(--dds-size-240);
    --dds-tooltip-padding: var(--dds-size-16);
  }
  .dds__tooltip *,
  .dds__tooltip *::before,
  .dds__tooltip *::after {
    box-sizing: inherit;
  }
  .dds__tooltip {
    font-family: var(--dds-font-family-base);
    font-size: var(--dds-typography-body-3-size);
    font-weight: var(--dds-typography-body-3-weight-default);
    line-height: var(--dds-typography-body-3-line-height);
    box-shadow: var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
    background: var(--dds-color-background-surface-neutral);
    box-sizing: border-box;
    max-width: var(--dds-tooltip-max-width);
    overflow: visible;
  }
  .dds__tooltip.dds__popup--pointer::after {
    box-shadow: var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-offset-1) var(--dds-drop-shadow-blur-1) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow), var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-offset-2) var(--dds-drop-shadow-blur-2) var(--dds-drop-shadow-spread-0) var(--dds-color-background-surface-drop-shadow);
  }
  .dds__tooltip__container {
    background: var(--dds-color-background-surface-neutral);
    border-radius: var(--dds-border-radius-xs);
    color: var(--dds-color-text-primary);
    display: flex;
    flex-flow: column nowrap;
    gap: var(--dds-tooltip-gap);
    padding: var(--dds-tooltip-padding);
    position: relative;
    z-index: 1;
  }
}