.neat-outline {
 --grand-components: #f0f2f5;
 --rural-outline: 20px;
 --rural-ivy: #e7e9ee;
 --rural-ring: 0 1px 2px rgba(12, 14, 18, .05), 0 12px 28px -18px rgba(12, 14, 18, .26);
 grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
 --snap-fleet: 0 2px 6px rgba(12, 14, 18, .06), 0 26px 54px -26px rgba(12, 14, 18, .38);
 --lite-link: cubic-bezier(.22, .61, .36, 1);
 --slim-atlas: #ffffff;
 width: 100%;
 gap: 22px;
 --back-badge: #f6f7f9;
 --modern-nav: var(--full-modules, #d6001c);
 --west-page: #5b6270;
 padding: 0;
 display: grid;
 align-items: stretch;
 list-style: none;
 max-width: 100%;
 --west-creek: #8d94a1;
 --high-jade: #0c0e12;
 margin: 0
}

.neat-outline > *:empty,
.neat-outline > br,
.neat-outline > p:empty {
 display: none
}

.neat-outline > .low-mesh {
 container-type: inline-size;
 min-width: 0;
 display: flex
}

.neat-outline > .low-mesh > * {
 width: 100%
}

.upper-silver {
 transition: border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease;
 border: 1px solid var(--rural-ivy);
 border-radius: var(--rural-outline);
 flex-direction: column;
 overflow: hidden;
 width: 100%;
 min-width: 0;
 display: flex;
 background: var(--slim-atlas)
}

.upper-silver:hover {
 transform: translateY(-2px);
 border-color: #d3d7df;
 box-shadow: var(--snap-fleet)
}

.custom-coral {
 display: block;
 background: #eef0f3;
 position: relative;
 overflow: hidden
}

.prime-fog {
 overflow-x: auto;
 -ms-overflow-style: none;
 scroll-snap-type: x mandatory;
 display: flex;
 scrollbar-width: none
}

.prime-fog::-webkit-scrollbar {
 display: none
}

.civic-scroll {
 scroll-snap-align: center;
 aspect-ratio: 16 / 10;
 background: #eef0f3;
 position: relative;
 flex: 0 0 100%
}

.civic-scroll img {
 transition: transform 500ms cubic-bezier(.2, .7, .3, 1);
 display: block;
 object-fit: cover;
 width: 100%;
 height: 100%;
 inset: 0;
 position: absolute
}

.upper-silver:hover .civic-scroll img {
 transform: scale(1.035)
}

.smart-sun {
 position: absolute;
 font-size: 42px;
 inset: 0;
 color: #b9bfc9;
 place-items: center;
 display: grid
}

.solar-oak {
 max-width: calc(100% - 100px);
 letter-spacing: .09em;
 backdrop-filter: blur(6px);
 gap: 6px;
 align-items: center;
 top: 12px;
 left: 12px;
 padding: 6px 10px;
 color: #ffffff;
 position: absolute;
 text-transform: uppercase;
 text-overflow: ellipsis;
 border-radius: 999px;
 z-index: 3;
 overflow: hidden;
 display: inline-flex;
 font-size: 10px;
 font-weight: 800;
 line-height: 1;
 white-space: nowrap;
 background: rgba(12, 14, 18, .82)
}

.modern-door {
 font-size: 10px;
 font-weight: 800;
 line-height: 1;
 position: absolute;
 border-radius: 999px;
 z-index: 3;
 top: 12px;
 right: 12px;
 white-space: nowrap;
 background: rgba(255, 255, 255, .92);
 letter-spacing: .08em;
 color: var(--high-jade);
 text-transform: uppercase;
 padding: 6px 10px
}

.noble-shell {
 color: #ffffff;
 top: 12px;
 right: 12px;
 white-space: nowrap;
 background: var(--modern-nav);
 text-transform: uppercase;
 position: absolute;
 font-size: 10px;
 font-weight: 800;
 line-height: 1;
 gap: 5px;
 align-items: center;
 letter-spacing: .08em;
 padding: 6px 10px;
 display: inline-flex;
 border-radius: 999px;
 z-index: 3
}

.rural-index {
 left: 0;
 right: 0;
 bottom: 10px;
 gap: 6px;
 display: flex;
 z-index: 3;
 justify-content: center;
 position: absolute
}

.high-ribbon {
 cursor: pointer;
 width: 6px;
 box-shadow: 0 0 0 1px rgba(12, 14, 18, .18);
 transition: width 200ms ease, background 200ms ease;
 height: 6px;
 border: 0;
 border-radius: 999px;
 padding: 0;
 background: rgba(255, 255, 255, .55)
}

.south-coat-river.high-ribbon {
 width: 18px;
 background: #ffffff
}

.high-loop {
 min-width: 0;
 gap: 14px;
 display: flex;
 padding: 16px 16px 16px;
 flex-direction: column;
 flex: 1 1 auto
}

.light-coral {
 display: flex;
 gap: 12px;
 align-items: baseline;
 justify-content: space-between;
 min-width: 0
}

.upper-fog {
 -webkit-line-clamp: 2;
 margin: 0;
 display: -webkit-box;
 overflow-wrap: anywhere;
 color: var(--high-jade);
 overflow: hidden;
 letter-spacing: -.015em;
 min-width: 0;
 min-height: calc(2 * 1.2em);
 -webkit-box-orient: vertical;
 font-size: 19px;
 font-weight: 800;
 line-height: 1.2
}

.urban-extras {
 display: grid;
 margin: 0;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 border-top: 1px solid var(--grand-components);
 border-bottom: 1px solid var(--grand-components)
}

.solid-lake {
 padding: 10px 8px;
 border-left: 1px solid var(--grand-components);
 min-width: 0
}

.solid-lake:first-child {
 padding-left: 0;
 border-left: 0
}

.solid-lake dt {
 overflow: hidden;
 margin: 0 0 3px;
 white-space: nowrap;
 text-transform: uppercase;
 text-overflow: ellipsis;
 color: var(--west-creek);
 font-size: 9.5px;
 font-weight: bold;
 letter-spacing: .1em
}

.solid-lake dd {
 -webkit-line-clamp: 2;
 -webkit-box-orient: vertical;
 color: var(--high-jade);
 overflow-wrap: anywhere;
 font-size: 13px;
 font-weight: bold;
 line-height: 1.2;
 margin: 0;
 display: -webkit-box;
 overflow: hidden
}

.calm-ash {
 padding: 12px 14px;
 background: var(--back-badge);
 align-items: flex-end;
 justify-content: space-between;
 display: flex;
 min-width: 0;
 border-radius: 12px;
 gap: 12px
}

.swift-sketch {
 min-width: 0
}

.inner-matrix {
 text-align: right
}

.smart-blocks {
 margin-bottom: 3px;
 display: block;
 text-transform: uppercase;
 white-space: nowrap;
 color: var(--west-creek);
 letter-spacing: .11em;
 font-size: 9.5px;
 font-weight: 800
}

.cool-hue {
 display: block;
 color: var(--high-jade);
 letter-spacing: -.02em;
 white-space: nowrap;
 font-size: 25px;
 font-weight: 900;
 line-height: 1;
 font-variant-numeric: tabular-nums
}

.lower-reset {
 color: var(--west-page);
 font-size: 15px;
 font-weight: 800;
 line-height: 1;
 font-variant-numeric: tabular-nums;
 white-space: nowrap;
 display: block
}

.south-palette {
 margin-bottom: 2px;
 display: block;
 color: var(--west-creek);
 text-decoration: line-through;
 font-size: 12px;
 font-weight: bold;
 white-space: nowrap
}

.active-token {
 gap: 6px 14px;
 margin: -4px 0 0;
 flex-wrap: wrap;
 min-width: 0;
 display: flex
}

.active-token button {
 padding: 0;
 align-items: center;
 border: 0;
 border-bottom: 1px solid #0000;
 cursor: pointer;
 color: var(--west-page);
 gap: 5px;
 font-size: 12px;
 font-weight: bold;
 line-height: 1.3;
 background: none;
 display: inline-flex
}

.active-token button:hover {
 border-bottom-color: currentcolor;
 color: var(--high-jade)
}

.upper-silver.prime-page {
 cursor: pointer
}

.upper-silver.light-brook.prime-page {
 border-color: var(--high-jade);
 box-shadow: 0 0 0 2px var(--high-jade) inset
}

.base-chat {
 color: var(--west-page);
 font-size: 12px;
 font-weight: 600;
 margin: -4px 0 0;
 gap: 6px;
 align-items: center;
 display: flex;
 min-width: 0
}

.base-chat i {
 font-size: 14px;
 color: var(--west-creek)
}

.half-orchard {
 margin-top: auto;
 grid-template-columns: minmax(0, 1fr);
 display: grid;
 gap: 8px
}

.lunar-atlas {
 transition: background 180ms var(--lite-link, ease), color 180ms var(--lite-link, ease), border-color 180ms var(--lite-link, ease), transform 180ms var(--lite-link, ease), box-shadow 180ms var(--lite-link, ease);
 min-height: 48px;
 min-width: 0;
 font-size: 14px;
 font-weight: bold;
 align-items: center;
 justify-content: center;
 border: 1px solid #0000;
 border-radius: 13px;
 position: relative;
 display: inline-flex;
 cursor: pointer;
 padding: 0 16px;
 letter-spacing: -.006em;
 text-decoration: none;
 gap: 9px
}

.lunar-atlas i {
 transition: transform 180ms var(--lite-link, ease)
}

.lunar-atlas:active {
 transform: translateY(0) scale(.98)
}

.lunar-atlas:focus-visible {
 outline: 2px solid var(--modern-nav);
 outline-offset: 2px
}

.lunar-atlas span {
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis
}

.back-garden {
 color: #ffffff;
 background: var(--high-jade)
}

.back-garden:hover {
 background: var(--modern-nav);
 color: #ffffff
}

.front-fog {
 gap: 9px;
 display: grid;
 grid-template-columns: 1fr 1fr
}

.half-grove {
 color: var(--high-jade);
 background: var(--back-badge);
 border-color: var(--rural-ivy)
}

.half-grove i {
 color: var(--modern-nav)
}

.half-grove:hover {
 border-color: var(--high-jade);
 box-shadow: 0 14px 26px -18px rgba(12, 14, 18, .55);
 color: var(--high-jade);
 background: var(--slim-atlas)
}

.rural-track {
 color: #ffffff;
 background: #128c7e;
 background: linear-gradient(135deg, #25d366 0%, #128c7e 100%);
 border-color: #128c7e
}

.rural-track i,
.rural-track span {
 color: #ffffff
}

.rural-track:hover {
 border-color: #075e54;
 color: #ffffff;
 box-shadow: 0 14px 26px -16px rgba(18, 140, 126, .72);
 background: #128c7e;
 background: linear-gradient(135deg, #1ebe5a 0%, #075e54 100%)
}

.rural-track:hover i {
 color: #ffffff
}

.back-valley {
 border-bottom: 1px solid #0000;
 flex: 0 0 auto;
 text-decoration: none;
 color: var(--west-page);
 gap: 4px;
 align-items: center;
 display: inline-flex;
 font-size: 12px;
 font-weight: bold;
 line-height: 1.2;
 white-space: nowrap
}

.back-valley:hover {
 border-bottom-color: currentcolor;
 color: var(--high-jade)
}

@container (max-width: 360px) {
 .urban-extras {
  grid-template-columns: repeat(2, minmax(0, 1fr))
 }

 .solid-lake:nth-child(odd) {
  padding-left: 0;
  border-left: 0
 }

 .solid-lake:nth-child(n + 3) {
  border-top: 1px solid var(--grand-components)
 }

 .cool-hue {
  font-size: 22px
 }

 .upper-fog {
  font-size: 18px
 }

 .high-loop {
  padding: 14px;
  gap: 12px
 }

}

.modern-port {
 position: relative
}

.modern-port .civic-scroll {
 aspect-ratio: 4 / 3
}

.modern-port .calm-catalog {
 z-index: 2;
 height: 84%;
 pointer-events: none;
 background: linear-gradient(180deg, rgba(6, 8, 12, .90) 0%, rgba(6, 8, 12, .82) 22%, rgba(6, 8, 12, .68) 36%, rgba(6, 8, 12, .34) 52%, rgba(6, 8, 12, .08) 72%, rgba(6, 8, 12, 0) 100%);
 inset: 0 0 auto;
 position: absolute
}

.modern-port .solar-oak,
.modern-port .modern-door {
 pointer-events: none
}

.modern-port .rural-style {
 backdrop-filter: none;
 background: var(--modern-nav)
}

.modern-port .modern-door {
 background: rgba(255, 255, 255, .20);
 color: #ffffff;
 backdrop-filter: blur(6px);
 border: 1px solid rgba(255, 255, 255, .38)
}

.modern-port .mono-nav {
 pointer-events: none;
 position: absolute;
 top: 46px;
 left: 15px;
 right: 15px;
 z-index: 3
}

.modern-port .upper-fog {
 text-shadow: 0 1px 14px rgba(0, 0, 0, .5);
 margin: 0 0 9px;
 font-size: 20px;
 color: #ffffff;
 min-height: 0
}

.modern-port .lite-garden {
 display: flex;
 gap: 6px 12px;
 list-style: none;
 margin: 0;
 padding: 0;
 flex-wrap: wrap
}

.modern-port .lite-garden li {
 min-width: 0;
 display: inline-flex;
 font-size: 11.5px;
 font-weight: bold;
 line-height: 1.2;
 align-items: center;
 text-shadow: 0 1px 10px rgba(0, 0, 0, .55);
 gap: 5px;
 color: rgba(255, 255, 255, .94)
}

.modern-port .lite-garden i {
 opacity: .82;
 flex: 0 0 auto;
 font-size: 13px
}

.modern-port .lite-garden span {
 overflow: hidden;
 white-space: nowrap;
 max-width: 13ch;
 text-overflow: ellipsis
}

.modern-port .rural-index {
 z-index: 4
}

.modern-port .high-loop {
 gap: 12px;
 padding: 15px 16px 16px
}

.modern-port .final-stone {
 align-items: baseline;
 padding: 2px 0 4px;
 grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
 grid-template-rows: auto auto;
 text-align: center;
 column-gap: 14px;
 display: grid
}

.modern-port .prime-header {
 grid-template-columns: minmax(0, 1fr)
}

.modern-port .neat-teal {
 grid-area: 1 / 1
}

.modern-port .lean-token {
 grid-area: 2 / 1
}

.modern-port .lite-rain {
 grid-area: 1 / 3
}

.modern-port .wild-forest {
 grid-area: 2 / 3
}

.modern-port .safe-forms {
 grid-area: 1 / 2 / 3 / 3;
 justify-self: center;
 align-self: stretch;
 width: 1px;
 background: var(--rural-ivy)
}

.modern-port .smart-blocks {
 margin-bottom: 5px
}

.modern-port .cool-hue {
 font-size: 27px;
 color: var(--modern-nav)
}

.modern-port .bold-leaf {
 display: block;
 letter-spacing: -.015em;
 font-size: 20px;
 font-weight: 800;
 line-height: 1;
 font-variant-numeric: tabular-nums;
 color: var(--high-jade);
 white-space: nowrap
}

.modern-port .rural-hue {
 gap: 6px;
 min-width: 0;
 align-items: center;
 justify-content: center;
 background: var(--back-badge);
 border: 1px solid var(--rural-ivy);
 border-radius: 10px;
 display: flex;
 margin: 0;
 box-sizing: border-box;
 white-space: nowrap;
 padding: 9px 12px;
 color: var(--west-page);
 width: 100%;
 font-size: 12px;
 font-weight: bold;
 line-height: 1.2
}

.modern-port .rural-hue i {
 font-size: 14px;
 color: var(--west-creek)
}

.modern-port .back-valley {
 margin-top: -2px;
 position: relative;
 font-size: 12px;
 z-index: 3;
 align-self: center
}

.modern-port .half-orchard {
 z-index: 3;
 position: relative
}

.modern-port .back-garden {
 min-height: 48px;
 background: var(--modern-nav);
 color: #ffffff
}

.modern-port .back-garden:hover {
 background: var(--high-jade)
}

.modern-port .vivid-knot {
 font-size: 0;
 position: absolute;
 inset: 0;
 border-radius: inherit;
 z-index: 2
}

@container (max-width: 360px) {
 .modern-port .upper-fog {
  font-size: 18px
 }

 .modern-port .lite-garden {
  gap: 5px 9px
 }

 .modern-port .lite-garden li {
  font-size: 11px
 }

 .modern-port .cool-hue {
  font-size: 24px
 }

 .modern-port .bold-leaf {
  font-size: 18px
 }

 .modern-port .rural-hue {
  font-size: 11.5px;
  padding: 7px 10px
 }

}

.smart-creek,
.front-fog.outer-ruby {
 grid-template-columns: minmax(0, 1fr)
}

.front-fog.outer-ruby > .lunar-atlas {
 width: 100%
}

.wild-motion {
 box-shadow: 0 22px 44px -30px rgba(12, 14, 18, .55);
 --rural-outline: 22px
}

.wild-motion:hover {
 box-shadow: 0 30px 60px -26px rgba(12, 14, 18, .5);
 transform: translateY(-4px)
}

.wild-motion .final-stone {
 background: var(--back-badge);
 border: 1px solid var(--rural-ivy);
 border-radius: 14px;
 padding: 12px 14px
}

@supports (background: color-mix(in srgb, red 10%, white)) {
 .wild-motion .final-stone {
  border-color: color-mix(in srgb, var(--modern-nav) 22%, #0000);
  background: linear-gradient(180deg, color-mix(in srgb, var(--modern-nav) 8%, #ffffff), #ffffff)
 }

}

.wild-motion .smart-blocks {
 color: var(--west-page)
}

.wild-motion .rural-hue {
 border-style: dashed
}

.wild-motion .rural-style {
 border-radius: 0 0 14px 0;
 top: 0;
 left: 0;
 padding: 8px 16px 8px 12px;
 letter-spacing: .1em;
 box-shadow: 0 8px 18px -10px rgba(12, 14, 18, .8)
}

.live-tint {
 gap: 16px;
 grid-template-columns: repeat(auto-fill, minmax(min(100%, 430px), 1fr))
}

.mono-glass {
 --rural-outline: 12px;
 box-shadow: none
}

.mono-glass:hover {
 box-shadow: 0 10px 26px -20px rgba(12, 14, 18, .45);
 transform: none;
 border-color: var(--modern-nav)
}

.mono-glass .civic-scroll {
 aspect-ratio: 16 / 11
}

.mono-glass .rural-style {
 top: 10px;
 left: 10px;
 border-radius: 7px;
 padding: 5px 9px;
 font-size: 9.5px;
 letter-spacing: .07em
}

.mono-glass .high-loop {
 gap: 11px;
 padding: 14px 15px 15px
}

.mono-glass .light-coral {
 gap: 10px;
 align-items: center
}

.mono-glass .upper-fog {
 text-overflow: ellipsis;
 text-shadow: none;
 margin: 0;
 overflow: hidden;
 font-size: 17px;
 white-space: nowrap;
 color: var(--high-jade)
}

.mono-glass .modern-door {
 backdrop-filter: none;
 color: var(--west-page);
 background: var(--back-badge);
 font-size: 9.5px;
 padding: 4px 8px;
 position: static;
 border: 1px solid var(--rural-ivy);
 border-radius: 6px;
 flex: 0 0 auto
}

.mono-glass .lite-garden {
 flex-wrap: wrap;
 display: flex;
 list-style: none;
 margin: -2px 0 0;
 gap: 6px;
 padding: 0
}

.mono-glass .lite-garden li {
 font-size: 11px;
 font-weight: bold;
 line-height: 1.15;
 align-items: center;
 gap: 5px;
 padding: 5px 9px;
 background: var(--back-badge);
 display: inline-flex;
 border: 1px solid var(--grand-components);
 border-radius: 7px;
 min-width: 0;
 color: var(--west-page)
}

.mono-glass .lite-garden i {
 flex: 0 0 auto;
 color: var(--west-creek);
 font-size: 12px
}

.mono-glass .lite-garden span {
 text-overflow: ellipsis;
 max-width: 11ch;
 white-space: nowrap;
 overflow: hidden
}

.mono-glass .final-stone {
 grid-template-columns: auto 1px auto;
 border-left: 3px solid var(--modern-nav);
 border-radius: 0 10px 10px 0;
 padding: 10px 12px 10px 14px;
 text-align: left;
 justify-content: start;
 background: var(--back-badge);
 column-gap: 16px
}

.mono-glass .cool-hue {
 font-size: 23px
}

.mono-glass .bold-leaf {
 font-size: 17px
}

.mono-glass .rural-hue {
 background: none;
 border: 0;
 justify-content: flex-start;
 padding: 0;
 font-size: 11.5px
}

.mono-glass .back-valley {
 align-self: flex-end
}

@container (min-width: 400px) {
 .mono-glass {
  align-items: stretch;
  flex-direction: row
 }

 .mono-glass .custom-coral {
  align-self: stretch;
  flex: 0 0 40%
 }

 .mono-glass .prime-fog {
  height: 100%
 }

 .mono-glass .civic-scroll {
  min-height: 220px;
  aspect-ratio: auto;
  height: 100%
 }

 .mono-glass .high-loop {
  flex: 1 1 auto
 }

}

.modern-port .civic-scroll {
 aspect-ratio: 16 / 11
}

.modern-port .rural-style,
.wild-motion .rural-style {
 top: 14px;
 left: 14px;
 font-size: 9.5px;
 letter-spacing: .11em;
 box-shadow: 0 10px 22px -12px rgba(12, 14, 18, .9);
 padding: 6px 11px;
 border-radius: 9px
}

.modern-port .modern-door {
 backdrop-filter: blur(8px);
 letter-spacing: .1em;
 background: rgba(255, 255, 255, .15);
 top: 14px;
 right: 14px;
 border-radius: 9px;
 border: 1px solid rgba(255, 255, 255, .30);
 padding: 6px 11px
}

.wild-motion {
 transition: border-color 200ms var(--lite-link), box-shadow 200ms var(--lite-link), transform 200ms var(--lite-link);
 box-shadow: var(--rural-ring);
 --rural-outline: 24px
}

.wild-motion:hover {
 border-color: color-mix(in srgb, var(--modern-nav) 34%, var(--rural-ivy));
 box-shadow: var(--snap-fleet);
 transform: translateY(-5px)
}

.wild-motion .civic-scroll {
 aspect-ratio: 4 / 3
}

.wild-motion:hover .civic-scroll img {
 transform: scale(1.06)
}

.wild-motion .calm-catalog {
 inset: 0;
 height: auto;
 background: linear-gradient(180deg, rgba(6, 8, 12, .52) 0%, rgba(6, 8, 12, .14) 14%, rgba(6, 8, 12, 0) 30%), linear-gradient(0deg, rgba(6, 8, 12, .95) 0%, rgba(6, 8, 12, .88) 20%, rgba(6, 8, 12, .62) 42%, rgba(6, 8, 12, .22) 64%, rgba(6, 8, 12, 0) 86%)
}

.wild-motion .mono-nav {
 top: auto;
 bottom: 14px;
 left: 14px;
 right: 14px
}

.wild-motion .upper-fog {
 letter-spacing: -.034em;
 font-size: 23px;
 font-weight: 800;
 line-height: 1.12;
 margin: 0 0 11px;
 padding-inline: 2px;
 text-shadow: 0 1px 14px rgba(0, 0, 0, .7)
}

.wild-motion .final-stone {
 text-align: left;
 box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .95);
 backdrop-filter: blur(16px) saturate(150%);
 -webkit-backdrop-filter: blur(16px) saturate(150%);
 border: 1px solid rgba(255, 255, 255, .24);
 border-radius: 15px;
 column-gap: 12px;
 padding: 10px 14px 11px;
 background: rgba(9, 12, 17, .62)
}

.wild-motion .safe-forms {
 background: rgba(255, 255, 255, .22)
}

.wild-motion .smart-blocks {
 font-size: 9px;
 margin-bottom: 5px;
 color: rgba(255, 255, 255, .60);
 letter-spacing: .15em
}

.wild-motion .cool-hue {
 font-size: 25px;
 font-weight: 900;
 letter-spacing: -.036em;
 color: #ffffff;
 color: color-mix(in srgb, var(--modern-nav) 64%, #ffffff);
 text-shadow: 0 1px 10px rgba(0, 0, 0, .5)
}

.wild-motion .bold-leaf {
 letter-spacing: -.026em;
 font-size: 18px;
 text-shadow: 0 1px 10px rgba(0, 0, 0, .5);
 color: rgba(255, 255, 255, .88)
}

.wild-motion .high-loop {
 gap: 12px;
 padding: 15px 16px 16px
}

.wild-motion .lite-garden {
 gap: 7px;
 margin: 0
}

.wild-motion .lite-garden li {
 font-size: 11px;
 font-weight: 600;
 line-height: 1.2;
 background: var(--back-badge);
 text-shadow: none;
 padding: 5px 10px;
 color: var(--west-page);
 border: 1px solid var(--rural-ivy);
 border-radius: 9px
}

.wild-motion .lite-garden i {
 opacity: 1;
 font-size: 12px;
 color: var(--west-creek)
}

.wild-motion .lite-garden span {
 max-width: 12ch
}

.wild-motion .rural-hue {
 color: var(--west-page);
 background: none;
 padding: 10px 2px 0;
 border: 0;
 border-top: 1px dashed var(--rural-ivy);
 border-radius: 0;
 justify-content: flex-start;
 font-size: 11.5px
}

.wild-motion .rural-hue i {
 color: var(--modern-nav)
}

.mono-glass {
 transition: border-color 200ms var(--lite-link), box-shadow 200ms var(--lite-link), transform 200ms var(--lite-link);
 --rural-outline: 16px;
 box-shadow: var(--rural-ring)
}

.mono-glass:hover {
 border-color: color-mix(in srgb, var(--modern-nav) 36%, var(--rural-ivy));
 box-shadow: var(--snap-fleet);
 transform: translateY(-4px)
}

.mono-glass .civic-scroll {
 aspect-ratio: 16 / 10
}

.mono-glass:hover .civic-scroll img {
 transform: scale(1.05)
}

@container (min-width: 400px) {
 .mono-glass {
  flex-direction: column
 }

 .mono-glass .custom-coral {
  flex: 0 0 auto;
  align-self: auto
 }

 .mono-glass .prime-fog {
  height: auto
 }

 .mono-glass .civic-scroll {
  height: auto;
  aspect-ratio: 16 / 10;
  min-height: 0
 }

 .mono-glass .high-loop {
  flex: 1 1 auto
 }

}

.mono-glass .rural-style {
 padding: 5px 10px;
 font-size: 9px;
 letter-spacing: .09em;
 border-radius: 8px;
 top: 11px;
 left: 11px
}

.mono-glass .high-loop {
 padding: 14px 15px 15px;
 gap: 11px
}

.mono-glass .upper-fog {
 letter-spacing: -.028em;
 font-size: 17px
}

.mono-glass .modern-door {
 position: static;
 border-radius: 7px;
 border-color: var(--rural-ivy);
 font-size: 9px;
 color: var(--west-page);
 backdrop-filter: none;
 padding: 4px 8px;
 letter-spacing: .09em;
 background: var(--back-badge)
}

.mono-glass .lite-garden {
 gap: 6px
}

.mono-glass .lite-garden li {
 font-size: 10.5px;
 border-radius: 8px;
 padding: 5px 9px
}

.mono-glass .final-stone {
 text-align: left;
 background: var(--modern-nav);
 box-shadow: none;
 border: 0;
 border-radius: 0;
 column-gap: 14px;
 grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
 justify-content: stretch;
 padding: 11px 15px 12px;
 margin-inline: -15px
}

.mono-glass .safe-forms {
 background: rgba(255, 255, 255, .30)
}

.mono-glass .smart-blocks {
 color: rgba(255, 255, 255, .74);
 letter-spacing: .15em;
 font-size: 9px;
 margin-bottom: 4px
}

.mono-glass .cool-hue {
 color: #ffffff;
 font-size: 22px;
 font-weight: 900;
 letter-spacing: -.034em
}

.mono-glass .bold-leaf {
 color: rgba(255, 255, 255, .92);
 font-size: 16px;
 letter-spacing: -.024em
}

.mono-glass .rural-hue {
 border: 0;
 justify-content: flex-start;
 background: none;
 font-size: 11px;
 padding: 0
}

.mono-glass .rural-hue i {
 color: var(--modern-nav)
}

.modern-port .half-orchard {
 gap: 9px
}

.modern-port .back-garden {
 font-size: 14.5px;
 font-weight: 800;
 min-height: 50px;
 box-shadow: 0 1px 2px color-mix(in srgb, var(--modern-nav) 26%, #0000), 0 12px 24px -14px color-mix(in srgb, var(--modern-nav) 70%, #0000);
 border-radius: 14px
}

.modern-port .back-garden:hover {
 background: color-mix(in srgb, var(--modern-nav) 74%, var(--high-jade));
 box-shadow: 0 2px 5px color-mix(in srgb, var(--modern-nav) 24%, #0000), 0 20px 34px -16px color-mix(in srgb, var(--modern-nav) 76%, #0000)
}

.lunar-atlas:hover {
 transform: translateY(-3px)
}

.lunar-atlas:active {
 transform: translateY(0) scale(.98)
}

.lunar-atlas:hover i:last-child:not(:first-child) {
 transform: translateX(5px)
}

.modern-port .back-valley {
 color: var(--west-page);
 border-bottom: 0;
 font-size: 12px;
 font-weight: bold;
 margin-top: 0;
 align-self: flex-end
}

.modern-port .back-valley i {
 transition: transform 180ms var(--lite-link)
}

.modern-port .back-valley:hover {
 color: var(--modern-nav);
 border-bottom-color: #0000
}

.modern-port .back-valley:hover i {
 transform: translateX(5px)
}

.modern-port .back-valley:focus-visible {
 outline: 2px solid var(--modern-nav);
 outline-offset: 3px
}

@container (max-width: 340px) {
 .wild-motion .upper-fog {
  font-size: 19px
 }

 .wild-motion .cool-hue {
  font-size: 25px
 }

 .wild-motion .bold-leaf {
  font-size: 17px
 }

 .modern-port .back-garden {
  min-height: 46px;
  font-size: 13.5px
 }

}

@media (prefers-reduced-motion: reduce) {
 .upper-silver,
 .wild-motion,
 .mono-glass,
 .civic-scroll img,
 .lunar-atlas,
 .lunar-atlas i,
 .modern-port .back-valley i,
 .high-ribbon {
  transition-duration: .01ms
 }

 .upper-silver:hover,
 .wild-motion:hover,
 .mono-glass:hover,
 .wild-motion:hover .civic-scroll img,
 .mono-glass:hover .civic-scroll img,
 .lunar-atlas:hover,
 .lunar-atlas:active,
 .lunar-atlas:hover i:last-child:not(:first-child),
 .modern-port .back-valley:hover i {
  transform: none
 }

}
