.prime-layout,
.free-cards,
.fresh-index,
.royal-gallery,
.soft-fleet {
 --base-route: #0d1714;
 --pure-menu: #18231f;
 --snap-sketch: rgba(255, 255, 255, .42);
 --warm-peak: #e7f6ee;
 --deep-valley: #0a6b36;
 --common-coat: #ffffff;
 --urban-dock: rgba(255, 255, 255, .16);
 --smart-outline: #12a150;
 --bright-config: #1f2d28;
 --metro-type: #235034;
 --flat-oak: rgba(255, 255, 255, .64);
 --compact-brick: #0d8442;
 --wild-chain: #101815;
 --native-frame: rgba(255, 255, 255, .10);
 --calm-footer: #1b3a2a
}

.bright-trail {
 width: 1px;
 border: 0;
 position: absolute;
 margin: -1px;
 white-space: nowrap;
 height: 1px;
 overflow: hidden;
 clip: rect(0, 0, 0, 0);
 padding: 0
}

.high-moss {
 padding-inline: var(--rapid-quay);
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 8px
}

@media (max-width: 600px) {
 .high-moss {
  padding-inline: var(--swift-site)
 }

}

.high-moss:before {
 display: none
}

.prime-layout .compact-pond {
 justify-self: start;
 grid-column: 1
}

.prime-layout .static-nav {
 gap: 10px;
 justify-self: end;
 grid-column: 2
}

.wide-stream {
 align-items: center;
 color: inherit;
 text-decoration: none;
 padding: 4px 6px 4px 2px;
 border-radius: 10px;
 gap: 9px;
 display: inline-flex
}

.wide-stream > i {
 flex: 0 0 auto;
 font-size: 14px;
 color: var(--smart-outline)
}

.tiny-layer {
 line-height: 1.15;
 display: block
}

.tiny-layer b {
 display: block;
 white-space: nowrap;
 letter-spacing: -.01em;
 font-size: 14.5px;
 font-weight: 800
}

.tiny-layer small {
 font-size: 10.5px;
 font-weight: 600;
 margin-top: 1px;
 opacity: .6;
 display: block;
 white-space: nowrap
}

.wide-stream:hover {
 background: rgba(18, 161, 80, .08)
}

.high-analytics > i {
 color: #25d366;
 font-size: 16px
}

.high-analytics:hover {
 background: rgba(37, 211, 102, .1)
}

.prime-layout .pure-creek {
 border-radius: 10px;
 border-color: var(--smart-outline);
 background: var(--smart-outline);
 padding: 0 18px;
 min-height: 40px;
 color: #ffffff;
 box-shadow: none;
 font-size: 13px;
 font-weight: bold
}

.prime-layout .pure-creek:hover:not(:disabled) {
 color: #ffffff;
 border-color: var(--compact-brick);
 background: var(--compact-brick)
}

.quick-mirror {
 display: none
}

.prime-layout .compact-pond {
 overflow: visible;
 min-width: 0;
 max-width: 100%
}

.prime-layout .static-nav {
 flex-wrap: nowrap;
 min-width: 0
}

@media (max-width: 700px) {
 .wide-stream {
  width: 38px;
  padding: 0;
  background: var(--compact-storm, #f1f5f9);
  height: 38px;
  border: 0;
  border-radius: var(--warm-pulse, 999px);
  gap: 0;
  justify-content: center
 }

 .tiny-layer {
  display: none
 }

 .wide-stream > i {
  font-size: 15px
 }

}

@media (max-width: 520px) {
 .prime-layout .round-pond {
  display: block
 }

 .main-moss {
  display: none
 }

 .quick-mirror {
  display: inline
 }

 .prime-layout .pure-creek {
  font-size: 12.5px;
  padding: 0 13px
 }

 .prime-layout .static-nav {
  gap: 6px
 }

}

.fresh-index {
 display: none
}

.rapid-sage {
 line-height: 1.3;
 padding-block: 18px 0
}

.noble-field {
 display: none
}

.south-plaza {
 overflow: hidden;
 display: block;
 min-height: clamp(220px, 26vw, 320px);
 position: relative;
 background-color: #0a1210;
 background-image: linear-gradient(96deg, rgba(6, 13, 10, .92) 0%, rgba(6, 13, 10, .72) 40%, rgba(6, 13, 10, .28) 100%), url("../assets/images/hero/bg-1376.webp");
 background-size: cover;
 background-position: center, 38% 52%;
 background-repeat: no-repeat;
 padding: 36px 40px 32px;
 border-radius: 16px
}

.tiny-elm {
 margin: 0;
 letter-spacing: -.025em;
 color: #ffffff;
 font-size: clamp(28px, 3.4vw, 44px);
 font-weight: 800;
 line-height: 1.08
}

.lite-knot {
 color: rgba(255, 255, 255, .85);
 max-width: 42ch;
 margin: 12px 0 0;
 font-size: clamp(14px, 1.4vw, 17px);
 font-weight: normal;
 line-height: 1.45
}

.compact-nav {
 list-style: none;
 padding: 0;
 margin: 22px 0 0;
 gap: 14px;
 display: flex
}

.compact-nav li {
 align-items: center;
 min-width: 0;
 flex: 0 1 auto;
 display: flex;
 font-size: 13px;
 font-weight: bold;
 line-height: 1.22;
 color: rgba(255, 255, 255, .93);
 gap: 8px
}

.compact-nav i {
 flex: 0 0 auto;
 display: grid;
 font-size: 12px;
 background: rgba(255, 255, 255, .95);
 width: 28px;
 place-items: center;
 color: #0a6b36;
 height: 28px;
 border-radius: 999px
}

.static-token {
 overflow: hidden;
 border-radius: 16px;
 line-height: 0;
 transition: transform 200ms ease, box-shadow 200ms ease;
 display: block;
 background: var(--wild-chain)
}

.static-token img {
 height: auto;
 display: block;
 width: 100%
}

.static-token:hover {
 box-shadow: 0 18px 38px -20px rgba(0, 0, 0, .55);
 transform: translateY(-2px)
}

.static-token:focus-visible {
 outline: 2px solid var(--smart-outline);
 outline-offset: 2px
}

.free-cards {
 --urban-kit: 300px
}

.free-cards {
 padding-inline: var(--rapid-quay)
}

@media (max-width: 600px) {
 .free-cards {
  padding-inline: var(--swift-site)
 }

}

.free-cards .metro-lens {
 padding: 14px 16px;
 border: 1px solid var(--custom-view);
 border-radius: 16px;
 background: var(--native-cliff)
}

.free-cards .snap-elements {
 left: 32px;
 top: 34px;
 bottom: 34px
}

.free-cards .snap-elements:after {
 background: var(--smart-outline)
}

.free-cards .classic-reset.royal-pier .upper-net {
 background: var(--smart-outline);
 color: #ffffff;
 border-color: var(--smart-outline)
}

.free-cards .royal-pier.long-port .upper-net {
 border-color: var(--smart-outline);
 background: var(--warm-peak);
 color: var(--deep-valley)
}

.free-cards .royal-pier.classic-reset .main-oak {
 color: var(--round-screen)
}

@media (min-width: 861px) {
 .free-cards .main-oak {
  text-overflow: ellipsis;
  max-width: none;
  overflow-wrap: normal;
  white-space: nowrap;
  overflow: hidden
 }

}

.free-cards .neat-layout {
 font-size: 14.5px;
 font-weight: 800;
 text-transform: none;
 color: var(--round-screen);
 letter-spacing: 0
}

.free-cards .low-dew:last-child {
 border-bottom: 0
}

.free-cards .quick-scope {
 color: var(--compact-brick);
 text-decoration: underline
}

.free-cards .quick-scope:hover {
 color: var(--deep-valley)
}

.free-cards .modern-dock {
 color: var(--round-screen)
}

.free-cards .open-fleet {
 display: grid;
 grid-template-columns: 26px minmax(0, 1fr);
 align-items: start;
 column-gap: 12px
}

.free-cards .tiny-pulse {
 margin-top: 2px;
 justify-self: center;
 color: var(--round-screen);
 font-size: 15px
}

.free-cards .mono-comet {
 min-width: 0
}

.free-cards .open-fleet .vivid-index {
 margin-bottom: 2px;
 font-size: 12px;
 font-weight: 600;
 color: var(--half-focus);
 text-transform: none;
 letter-spacing: 0
}

.free-cards .open-fleet .fluid-chrome {
 color: var(--round-screen);
 font-size: 13.5px;
 font-weight: bold
}

.free-cards .civic-atlas {
 gap: 16px;
 display: flex;
 margin-bottom: 16px;
 flex-wrap: wrap;
 align-items: flex-end;
 justify-content: space-between
}

.free-cards .quick-lake {
 min-width: 0
}

.free-cards .civic-atlas .native-elm {
 margin-bottom: 4px
}

.free-cards .civic-atlas .pure-forest {
 margin: 0
}

.metro-slope {
 flex: 0 1 320px;
 min-width: 220px;
 position: relative
}

.metro-slope input {
 font: inherit;
 font-size: 13.5px;
 background: var(--native-cliff);
 box-sizing: border-box;
 height: 44px;
 padding: 0 40px 0 14px;
 color: var(--round-screen);
 width: 100%;
 outline: none;
 border: 1px solid var(--custom-view);
 border-radius: 12px;
 transition: border-color 180ms ease, box-shadow 180ms ease
}

.metro-slope input::placeholder {
 color: var(--half-focus)
}

.metro-slope input:focus {
 box-shadow: 0 0 0 3px rgba(18, 161, 80, .14);
 border-color: var(--smart-outline)
}

.urban-shell {
 color: var(--half-focus);
 position: absolute;
 right: 14px;
 top: 50%;
 font-size: 14px;
 pointer-events: none;
 transform: translateY(-50%)
}

.free-cards .flat-mobile {
 grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
 display: grid;
 margin: 16px 0 20px;
 gap: 10px
}

.free-cards .flat-mobile .grand-lane {
 padding: 12px 16px;
 margin: 0;
 font-size: 13.5px
}

.free-cards .round-window {
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 10px;
 margin-bottom: 14px;
 display: grid
}

.free-cards .bright-mark {
 width: 40px;
 display: grid;
 transition: border-color 180ms ease, color 180ms ease;
 place-items: center;
 flex: 0 0 auto;
 border: 1px solid var(--custom-view);
 border-radius: 999px;
 background: var(--native-cliff);
 font-size: 13px;
 color: var(--deep-oak);
 height: 40px;
 cursor: pointer
}

.free-cards .bright-mark:hover {
 color: var(--smart-outline);
 border-color: var(--smart-outline)
}

.free-cards .bright-mark[hidden] {
 display: none
}

.free-cards .lunar-brick.final-skin {
 padding-bottom: 2px;
 display: flex;
 flex-wrap: nowrap;
 scrollbar-width: none;
 overflow-x: auto;
 margin-bottom: 0;
 gap: 10px
}

.free-cards .final-skin.lunar-brick::-webkit-scrollbar {
 display: none
}

.free-cards .final-skin .core-sun {
 display: grid;
 padding: 8px 16px 8px 13px;
 gap: 10px;
 align-items: center;
 flex: 0 0 auto;
 min-height: 56px;
 text-align: left;
 border-radius: 12px;
 white-space: nowrap;
 grid-template-columns: 22px minmax(0, 1fr)
}

.free-cards .final-skin .core-sun i {
 transition: color 180ms ease;
 justify-self: center;
 color: var(--half-focus);
 font-size: 16px
}

.free-cards .final-skin .core-sun b {
 display: block;
 font-size: 13px;
 font-weight: bold;
 line-height: 1.2
}

.free-cards .final-skin .core-sun span {
 transition: color 180ms ease;
 font-size: 11px;
 line-height: 1.2;
 margin-top: 2px;
 display: block;
 color: var(--half-focus)
}

.free-cards .final-skin .classic-reset.core-sun {
 background: var(--round-screen);
 border-color: var(--round-screen);
 color: #ffffff
}

.free-cards .final-skin .classic-reset.core-sun i,
.free-cards .final-skin .classic-reset.core-sun span {
 color: rgba(255, 255, 255, .66)
}

.high-door {
 align-items: center;
 justify-content: flex-end;
 margin-bottom: 16px;
 display: flex;
 gap: 10px
}

.high-door label {
 font-size: 12px;
 font-weight: 600;
 color: var(--deep-oak)
}

.high-door select {
 -webkit-appearance: none;
 appearance: none;
 border: 1px solid var(--custom-view);
 border-radius: 10px;
 font: inherit;
 font-size: 13px;
 font-weight: 600;
 outline: none;
 cursor: pointer;
 background: var(--native-cliff);
 background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238d94a1' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
 background-repeat: no-repeat;
 background-position: right 11px center;
 background-size: 15px;
 padding: 0 34px 0 12px;
 color: var(--round-screen);
 height: 38px
}

.high-door select:focus {
 border-color: var(--smart-outline)
}

.noble-forms {
 background: var(--sharp-window);
 border: 1px dashed var(--custom-view);
 border-radius: 16px;
 grid-column: 1 / -1;
 padding: 42px 20px;
 text-align: center
}

.noble-forms i {
 color: var(--half-focus);
 font-size: 26px
}

.noble-forms b {
 font-size: 15px;
 color: var(--round-screen);
 margin: 10px 0 4px;
 display: block
}

.noble-forms span {
 color: var(--deep-oak);
 font-size: 13px
}

.free-cards .neat-outline {
 gap: 14px;
 grid-template-columns: repeat(auto-fill, minmax(min(100%, 224px), 1fr))
}

.free-cards .upper-silver {
 background: var(--base-route);
 border-color: var(--native-frame);
 border-radius: 14px
}

.free-cards .upper-silver:hover {
 border-color: var(--urban-dock);
 box-shadow: 0 20px 44px -24px rgba(0, 0, 0, .65)
}

.free-cards .light-brook.prime-page.upper-silver {
 border-color: var(--smart-outline);
 box-shadow: 0 0 0 2px var(--smart-outline) inset
}

.free-cards .custom-coral {
 background: var(--pure-menu)
}

.free-cards .civic-scroll {
 aspect-ratio: 16 / 10;
 background: var(--pure-menu)
}

.free-cards .smart-sun {
 color: rgba(255, 255, 255, .22)
}

.free-cards .custom-coral:after {
 content: "";
 inset: 0;
 position: absolute;
 pointer-events: none;
 z-index: 2;
 background: linear-gradient(94deg, rgba(6, 13, 10, .93) 0%, rgba(6, 13, 10, .80) 34%, rgba(6, 13, 10, .42) 56%, rgba(6, 13, 10, .06) 78%, rgba(6, 13, 10, 0) 100%), linear-gradient(180deg, rgba(6, 13, 10, .34) 0%, rgba(6, 13, 10, 0) 30%, rgba(6, 13, 10, 0) 62%, rgba(6, 13, 10, .48) 100%)
}

.free-cards .light-coral {
 pointer-events: none;
 left: 13px;
 right: auto;
 bottom: 34px;
 max-width: 58%;
 z-index: 3;
 position: absolute;
 display: block
}

.free-cards .solar-oak {
 padding: 4px 9px;
 top: 10px;
 left: 10px;
 background: var(--smart-outline);
 font-size: 9px;
 font-weight: 800;
 backdrop-filter: none;
 letter-spacing: .06em;
 border-radius: 6px
}

.free-cards .noble-shell {
 border-radius: 6px;
 color: #1a1205;
 padding: 4px 9px;
 font-size: 9px;
 background: #f59e0b;
 top: 38px;
 right: auto;
 left: 10px;
 letter-spacing: .06em
}

.free-cards .final-coat {
 transition: background 180ms ease, color 180ms ease, transform 180ms ease;
 z-index: 4;
 height: 28px;
 background: rgba(8, 14, 11, .58);
 backdrop-filter: blur(6px);
 position: absolute;
 place-items: center;
 font-size: 12.5px;
 top: 10px;
 right: 10px;
 border: 0;
 border-radius: 999px;
 cursor: pointer;
 color: #ffffff;
 display: grid;
 width: 28px;
 padding: 0
}

.free-cards .final-coat:hover {
 background: rgba(8, 14, 11, .82);
 transform: scale(1.08)
}

.free-cards .dark-snow.final-coat {
 color: #ff6b6b
}

.free-cards .base-basil {
 z-index: 4;
 color: #ffffff;
 transition: background 180ms ease, transform 180ms ease;
 height: 28px;
 width: 28px;
 text-decoration: none;
 top: 10px;
 right: 44px;
 position: absolute;
 background: #25d366;
 border-radius: 999px;
 font-size: 14px;
 place-items: center;
 display: grid
}

.free-cards .base-basil:hover {
 transform: scale(1.08);
 background: #1fb855;
 color: #ffffff
}

.free-cards .custom-coral {
 cursor: zoom-in
}

.free-cards .lower-dew {
 transition: background 180ms ease, transform 180ms ease;
 cursor: zoom-in;
 position: absolute;
 gap: 5px;
 display: inline-flex;
 padding: 4px 8px;
 border: 0;
 border-radius: 7px;
 align-items: center;
 color: #ffffff;
 background: rgba(8, 14, 11, .66);
 font: inherit;
 font-size: 10px;
 font-weight: bold;
 line-height: 1.35;
 font-variant-numeric: tabular-nums;
 backdrop-filter: blur(6px);
 right: 10px;
 bottom: 10px;
 z-index: 4
}

.free-cards .lower-dew i {
 font-size: 9px;
 opacity: .85
}

.free-cards .lower-dew:hover {
 transform: translateY(-1px);
 background: rgba(8, 14, 11, .88)
}

.free-cards .rural-index {
 opacity: 0;
 justify-content: flex-start;
 transition: opacity 180ms ease;
 bottom: 10px;
 left: 10px;
 right: auto
}

.free-cards .upper-silver:hover .rural-index,
.free-cards .upper-silver:focus-within .rural-index {
 opacity: 1
}

@media (hover: none) {
 .free-cards .rural-index {
  opacity: 1
 }

}

.free-cards .tiny-birch {
 font-size: 12px;
 top: 50%;
 place-items: center;
 cursor: pointer;
 backdrop-filter: blur(6px);
 position: absolute;
 color: #ffffff;
 height: 32px;
 opacity: 0;
 z-index: 4;
 display: grid;
 border: 0;
 border-radius: 50%;
 margin-top: -16px;
 padding: 0;
 transition: opacity 180ms ease, background 180ms ease;
 background: rgba(8, 14, 11, .66);
 width: 32px
}

.free-cards .inner-rain {
 left: 10px
}

.free-cards .metro-silver {
 right: 10px
}

.free-cards .upper-silver:hover .tiny-birch,
.free-cards .tiny-birch:focus-visible {
 opacity: 1
}

.free-cards .tiny-birch:hover {
 background: rgba(8, 14, 11, .88)
}

@media (hover: none) {
 .free-cards .tiny-birch {
  display: none
 }

}

.free-cards .upper-fog {
 margin: 0;
 text-shadow: 0 1px 14px rgba(0, 0, 0, .5);
 color: #ffffff;
 display: -webkit-box;
 letter-spacing: -.02em;
 font-size: 18px;
 font-weight: 800;
 line-height: 1.12;
 -webkit-line-clamp: 2;
 min-height: 0;
 -webkit-box-orient: vertical;
 overflow: hidden
}

.free-cards .back-plaza {
 margin: 6px 0 0;
 display: -webkit-box;
 text-shadow: 0 1px 12px rgba(0, 0, 0, .45);
 -webkit-box-orient: vertical;
 font-size: 11.5px;
 line-height: 1.35;
 overflow: hidden;
 -webkit-line-clamp: 2;
 min-height: 0;
 color: rgba(255, 255, 255, .82)
}

.free-cards .high-loop {
 gap: 10px;
 padding: 12px
}

.free-cards .urban-extras {
 border: 0;
 border-radius: 9px;
 overflow: hidden;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 background: #ffffff
}

.free-cards .solid-lake {
 padding: 8px 3px;
 flex-wrap: wrap;
 gap: 2px 5px;
 display: flex;
 border-left: 1px solid #e6e9ee;
 align-items: center;
 justify-content: center;
 text-align: center
}

.free-cards .solid-lake:first-child {
 border-left: 0
}

.free-cards .solid-lake dt {
 letter-spacing: 0;
 flex: 0 0 auto;
 margin: 0;
 color: #111827;
 font-size: 11px;
 line-height: 1
}

.free-cards .solid-lake dd {
 margin: 0;
 overflow-wrap: normal;
 color: #111827;
 display: block;
 font-size: 9.5px;
 font-weight: bold;
 line-height: 1.25;
 overflow: visible
}

.free-cards .calm-ash {
 gap: 0;
 align-items: center;
 padding: 9px 11px;
 display: grid;
 grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
 background: var(--calm-footer);
 border-radius: 9px
}

.free-cards .calm-ash:before {
 grid-column: 2;
 align-self: stretch;
 background: rgba(255, 255, 255, .13);
 content: "";
 width: 1px
}

.free-cards .swift-sketch {
 grid-column: 1;
 grid-row: 1
}

.free-cards .inner-matrix {
 padding-left: 10px;
 grid-column: 3;
 grid-row: 1
}

.free-cards .smart-blocks {
 letter-spacing: 0;
 text-transform: none;
 font-size: 10px;
 font-weight: 600;
 color: var(--flat-oak);
 margin-bottom: 2px
}

.free-cards .cool-hue {
 color: var(--common-coat);
 font-size: 20px;
 font-weight: 800;
 letter-spacing: -.02em
}

.free-cards .south-palette {
 font-size: 10.5px;
 color: var(--snap-sketch)
}

.free-cards .quick-dune {
 gap: 6px;
 color: var(--common-coat);
 font-size: 10px;
 font-weight: 600;
 line-height: 1.25;
 text-align: right;
 align-items: center;
 justify-content: flex-end;
 display: flex
}

.free-cards .quick-dune i {
 font-size: 12px;
 flex: 0 0 auto;
 color: #ffffff
}

.free-cards .active-token {
 gap: 8px;
 grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
 display: grid;
 margin: 0
}

.free-cards .active-token button {
 justify-content: center;
 padding: 8px 6px;
 color: var(--common-coat);
 font-size: 10.5px;
 font-weight: 600;
 border: 0;
 border-radius: 8px;
 background: var(--calm-footer)
}

.free-cards .active-token button:hover {
 color: #ffffff;
 background: var(--metro-type)
}

.free-cards .active-token button i {
 font-size: 11px
}

.free-cards .back-garden {
 font-size: 12.5px;
 font-weight: bold;
 background: var(--smart-outline);
 color: #ffffff;
 min-height: 40px;
 border-radius: 8px
}

.free-cards .back-garden:hover {
 color: #ffffff;
 background: var(--compact-brick)
}

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

 .free-cards .solid-lake:nth-child(odd) {
  border-left: 1px solid #e6e9ee
 }

 .free-cards .solid-lake:first-child {
  border-left: 0
 }

 .free-cards .solid-lake:nth-child(n + 3) {
  border-top: 0
 }

}

@container (min-width: 300px) {
 .free-cards .high-loop {
  padding: 14px;
  gap: 11px
 }

 .free-cards .upper-fog {
  font-size: 20px
 }

 .free-cards .back-plaza {
  font-size: 12px
 }

 .free-cards .solid-lake {
  gap: 6px;
  padding: 9px 6px
 }

 .free-cards .solid-lake dd {
  font-size: 11px
 }

 .free-cards .cool-hue {
  font-size: 23px
 }

 .free-cards .smart-blocks,
 .free-cards .quick-dune {
  font-size: 11px
 }

 .free-cards .active-token button {
  font-size: 11.5px
 }

 .free-cards .back-garden {
  font-size: 13.5px;
  min-height: 44px
 }

}

@container (min-width: 420px) {
 .free-cards .upper-fog {
  font-size: 22px
 }

 .free-cards .back-plaza {
  font-size: 12.5px
 }

 .free-cards .solid-lake dd {
  font-size: 12px
 }

 .free-cards .cool-hue {
  font-size: 26px
 }

}

.free-cards .back-root {
 border-color: var(--smart-outline);
 box-shadow: none;
 background: var(--smart-outline);
 color: #ffffff
}

.free-cards .back-root:hover:not(:disabled) {
 border-color: var(--compact-brick);
 color: #ffffff;
 background: var(--compact-brick)
}

.free-cards .back-root:disabled,
.free-cards .back-root[disabled] {
 border-color: var(--custom-view);
 color: var(--half-focus);
 background: var(--custom-view)
}

.free-cards .west-config {
 box-shadow: none;
 background: var(--smart-outline)
}

.free-cards .west-config:hover {
 background: var(--compact-brick);
 box-shadow: none
}

.free-cards .quick-token {
 font-weight: 800;
 color: var(--smart-outline);
 margin-inline-start: 2px
}

.free-cards .lower-fleet:focus,
.free-cards .inner-runtime:focus,
.free-cards .lower-fleet:focus-visible {
 border-color: var(--smart-outline);
 box-shadow: 0 0 0 3px rgba(18, 161, 80, .14)
}

.free-cards .west-olive {
 background: var(--sharp-window);
 border-radius: 12px;
 border-color: var(--custom-view)
}

.free-cards .active-footer {
 color: #ffffff;
 padding: 5px 9px;
 font-size: 10px;
 font-weight: 800;
 line-height: 1.2;
 letter-spacing: .06em;
 background: var(--smart-outline);
 border-radius: 7px;
 white-space: nowrap
}

:root {
 --static-grid: 0px;
 --royal-gold: 90px;
 --classic-blocks: cubic-bezier(.22, .61, .36, 1)
}

body {
 padding-bottom: calc(var(--royal-gold) + var(--static-grid) + 16px)
}

.royal-gallery {
 position: fixed;
 border-top: 1px solid var(--custom-view, #e7e9ee);
 padding-bottom: env(safe-area-inset-bottom, 0px);
 left: 0;
 right: 0;
 bottom: 0;
 z-index: 960;
 background: #ffffff;
 box-shadow: 0 -8px 24px rgba(12, 14, 18, .08)
}

.free-cards #bright-chrome {
 bottom: var(--royal-gold)
}

.prime-hero {
 flex-wrap: nowrap;
 gap: 22px;
 overflow-x: auto;
 -webkit-overflow-scrolling: touch;
 padding-block: 24px;
 display: flex;
 overscroll-behavior-x: contain;
 align-items: flex-start;
 scrollbar-width: none
}

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

.north-mesh {
 align-items: center;
 min-width: 0;
 flex: 1 1 0;
 grid-template-columns: 40px minmax(0, 1fr);
 gap: 12px;
 display: grid
}

.north-mesh > i {
 background: #f6f7f9;
 width: 40px;
 font-size: 16px;
 display: grid;
 color: #5b6270;
 border-radius: 999px;
 place-items: center;
 height: 40px
}

.back-engine {
 font-size: 21px;
 font-weight: 800;
 line-height: 40px;
 color: var(--full-modules, #d6001c);
 justify-self: center;
 letter-spacing: -.03em
}

.north-mesh b {
 color: #0c0e12;
 display: block;
 font-size: 13px;
 font-weight: bold;
 line-height: 1.25
}

.north-mesh div span {
 margin-top: 1px;
 display: block;
 font-size: 11.5px;
 line-height: 1.25;
 color: #8d94a1
}

[data-theme="dark"] .free-cards {
 --deep-oak: #a8b0bd;
 --round-screen: #f3f5f7;
 --half-focus: #7d8593;
 --sharp-window: #1b2129;
 --native-cliff: #151a20;
 --custom-view: #2a3138;
 --base-reset: #222831
}

[data-theme="dark"] .free-cards .upper-silver {
 border-color: rgba(255, 255, 255, .13);
 background: #10201b
}

[data-theme="dark"] .free-cards .custom-coral,
[data-theme="dark"] .free-cards .civic-scroll {
 background: #1f2c28
}

[data-theme="dark"] .free-cards .royal-pier.long-port .upper-net {
 color: #4ed48c;
 background: rgba(18, 161, 80, .18)
}

[data-theme="dark"] .free-cards .classic-reset.core-sun {
 color: #ffffff;
 border-color: var(--smart-outline);
 background: var(--smart-outline)
}

[data-theme="dark"] .free-cards .classic-reset.core-sun .lower-rain,
[data-theme="dark"] .free-cards .core-sun.classic-reset .soft-utils {
 color: rgba(255, 255, 255, .8)
}

[data-theme="dark"] .free-cards .final-skin .core-sun.classic-reset i,
[data-theme="dark"] .free-cards .final-skin .classic-reset.core-sun span {
 color: rgba(255, 255, 255, .72)
}

[data-theme="dark"] .free-cards .open-slope.core-sun.classic-reset {
 color: var(--round-screen);
 background: rgba(18, 161, 80, .14);
 border-color: var(--smart-outline);
 box-shadow: 0 0 0 1px var(--smart-outline) inset
}

[data-theme="dark"] .free-cards .core-sun.classic-reset.open-slope i {
 color: #4ed48c
}

[data-theme="dark"] .royal-gallery {
 background: #12171d;
 border-top-color: #2a3138
}

[data-theme="dark"] .north-mesh > i {
 color: #a8b0bd;
 background: #1b2129
}

[data-theme="dark"] .north-mesh b {
 color: #f3f5f7
}

[data-theme="dark"] .north-mesh div span {
 color: #7d8593
}

[data-theme="dark"] .free-cards .metro-lens {
 border-color: #2a3138;
 background: #151a20
}

[data-theme="dark"] .free-cards .tiny-pulse {
 color: var(--deep-oak)
}

[data-theme="dark"] .free-cards .bright-mark {
 border-color: #2a3138;
 color: #a8b0bd;
 background: #151a20
}

@media (max-width: 1024px) {
 .prime-hero {
  gap: 16px
 }

 .north-mesh {
  flex: 0 0 auto
 }

}

@media (max-width: 860px) {
 .rapid-sage {
  padding-block: 12px 0
 }

 .south-plaza {
  min-height: 0;
  background-image: linear-gradient(96deg, rgba(6, 13, 10, .92) 0%, rgba(6, 13, 10, .78) 44%, rgba(6, 13, 10, .40) 100%), url("../assets/images/hero/bg-800.webp");
  background-size: cover;
  background-position: center, 38% 52%;
  background-repeat: no-repeat;
  padding: 16px 16px 15px;
  border-radius: 14px
 }

 .tiny-elm {
  font-size: clamp(23px, 6.6vw, 36px)
 }

 .lite-knot {
  margin: 9px 0 0;
  max-width: 32ch;
  font-size: clamp(12.5px, 3.2vw, 16px)
 }

 .compact-nav {
  margin: 15px 0 0;
  gap: 10px
 }

 .compact-nav li {
  gap: 7px;
  flex: 1 1 0;
  font-size: clamp(9.5px, 2.5vw, 12px)
 }

 .compact-nav i {
  width: 26px;
  font-size: 11px;
  height: 26px
 }

 .prime-hero {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow-x: visible;
  gap: 12px
 }

 .north-mesh {
  gap: 9px;
  grid-template-columns: 34px minmax(0, 1fr)
 }

 .north-mesh > i {
  height: 34px;
  font-size: 14px;
  width: 34px
 }

 .back-engine {
  font-size: 18px;
  line-height: 34px
 }

 .north-mesh b {
  font-size: 12px
 }

 .north-mesh div span {
  font-size: 10.5px
 }

 .free-cards .civic-atlas {
  align-items: stretch
 }

 .metro-slope {
  flex: 1 1 100%
 }

 .free-cards .neat-outline {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr))
 }

 .static-token {
  display: none
 }

 .free-cards .metro-lens {
  border-radius: 14px;
  padding: 12px 10px
 }

 .free-cards .snap-elements {
  left: 20px;
  right: 20px;
  top: 29px;
  bottom: auto
 }

}

@media (max-width: 600px) {
 .prime-hero {
  gap: 8px;
  padding-block: 11px
 }

 .north-mesh {
  text-align: center;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  justify-items: center
 }

 .north-mesh > i {
  font-size: 12px;
  width: 28px;
  height: 28px
 }

 .back-engine {
  font-size: 15px;
  line-height: 28px
 }

 .north-mesh b {
  font-size: 9.5px;
  line-height: 1.25
 }

 .north-mesh div span {
  display: none
 }

 .high-door {
  justify-content: space-between
 }

 .free-cards .neat-outline {
  grid-template-columns: minmax(0, 1fr)
 }

}

.full-mesh,
.simple-extras,
.fluid-rain {
 display: none!important
}

.soft-fleet {
 z-index: 970;
 transform: translateY(-50%);
 left: 0;
 top: 50%;
 position: fixed
}

.wild-gallery {
 gap: 7px;
 color: #ffffff;
 width: 36px;
 border: 0;
 border-radius: 0 13px 13px 0;
 transition: width 180ms ease, box-shadow 180ms ease;
 background: linear-gradient(180deg, var(--smart-outline) 0%, var(--deep-valley) 100%);
 justify-items: center;
 box-shadow: 0 10px 26px rgba(10, 107, 54, .32);
 padding: 15px 0 16px;
 cursor: pointer;
 display: grid
}

.wild-gallery:hover {
 box-shadow: 0 14px 30px rgba(10, 107, 54, .42)
}

.wild-gallery i {
 font-size: 15px
}

.wild-gallery span {
 writing-mode: vertical-rl;
 font-size: 10px;
 font-weight: 800;
 letter-spacing: .16em;
 text-orientation: mixed
}

.bold-link {
 width: min(294px, calc(100vw - 66px));
 position: absolute;
 transform: translateY(-50%);
 animation: weightEmber 180ms ease;
 padding: 12px;
 left: calc(100% + 10px);
 top: 50%;
 border: 1px solid var(--custom-view, #e7e9ee);
 border-radius: 16px;
 box-shadow: 0 24px 60px rgba(12, 14, 18, .22);
 background: var(--native-cliff, #ffffff)
}

.bold-link[hidden] {
 display: none
}

.round-band {
 gap: 10px;
 padding: 2px 2px 10px 6px;
 display: flex;
 align-items: center;
 justify-content: space-between
}

.round-band strong {
 font-size: 13px;
 font-weight: 800;
 color: var(--round-screen, #0c0e12)
}

.deep-kit {
 width: 26px;
 height: 26px;
 font-size: 12px;
 border: 0;
 border-radius: 8px;
 background: var(--sharp-window, #f4f6f8);
 cursor: pointer;
 color: var(--deep-oak, #5b6270);
 place-items: center;
 display: grid
}

.local-reveal {
 cursor: pointer;
 display: grid;
 transition: background 160ms ease;
 padding: 9px 8px;
 align-items: center;
 background: #0000;
 border: 0;
 border-radius: 12px;
 text-align: left;
 text-decoration: none;
 gap: 10px;
 width: 100%;
 grid-template-columns: 34px minmax(0, 1fr) 12px
}

.local-reveal:hover {
 background: var(--sharp-window, #f4f6f8)
}

.grand-engine {
 color: #ffffff;
 font-size: 15px;
 width: 34px;
 height: 34px;
 border-radius: 999px;
 display: grid;
 place-items: center
}

.plain-ivy {
 background: #25d366
}

.cool-type {
 background: var(--full-modules, #d6001c);
 font-size: 14px
}

.quick-reset {
 background: var(--smart-outline);
 font-size: 13px
}

.grand-tag {
 min-width: 0
}

.grand-tag b {
 display: block;
 font-size: 12.5px;
 font-weight: bold;
 line-height: 1.25;
 color: var(--round-screen, #0c0e12)
}

.grand-tag small {
 display: block;
 color: var(--half-focus, #8d94a1);
 font-size: 11px;
 line-height: 1.3
}

.rural-field {
 font-size: 11px;
 color: var(--half-focus, #b6bcc6)
}

.simple-extras {
 left: 52px;
 bottom: calc(14vh + var(--royal-gold))!important
}

[data-theme="dark"] .bold-link {
 border-color: #2a3138;
 background: #151a20
}

[data-theme="dark"] .round-band strong,
[data-theme="dark"] .grand-tag b {
 color: #f3f5f7
}

[data-theme="dark"] .grand-tag small {
 color: #7d8593
}

[data-theme="dark"] .deep-kit {
 background: #1b2129;
 color: #a8b0bd
}

[data-theme="dark"] .local-reveal:hover {
 background: #1b2129
}

@media (max-width: 860px) {
 .wild-gallery {
  width: 34px;
  padding: 13px 0 14px
 }

 .bold-link {
  left: calc(100% + 8px);
  width: min(280px, calc(100vw - 56px))
 }

 .free-cards #bright-chrome .bold-yard {
  display: inline
 }

 .free-cards #bright-chrome #polar-basil {
  padding-inline: 16px;
  flex: 0 0 auto
 }

 .free-cards #bright-chrome.outer-ruby {
  box-shadow: none;
  border-top: 0;
  background: none;
  pointer-events: none;
  padding: 4px 14px calc(4px + env(safe-area-inset-bottom, 0px))
 }

 .free-cards #bright-chrome.outer-ruby #polar-basil {
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(12, 14, 18, .28);
  border: 0;
  background: #0c0e12;
  pointer-events: auto
 }

 .free-cards #bright-chrome.outer-ruby #polar-basil i,
 .free-cards #bright-chrome.outer-ruby #polar-basil .bold-yard {
  color: #ffffff
 }

}

body.deep-grid {
 position: fixed;
 left: 0;
 right: 0;
 overflow: hidden;
 width: 100%
}

.round-print {
 opacity: 0;
 background: rgba(4, 8, 6, .95);
 position: fixed;
 transition: opacity 180ms ease;
 display: grid;
 grid-template-columns: 1fr;
 grid-template-rows: 1fr;
 inset: 0;
 z-index: 4000
}

.live-jade.round-print {
 opacity: 1
}

.round-print[hidden] {
 display: none
}

.east-orchard {
 display: flex;
 overflow-x: auto;
 overflow-y: hidden;
 -ms-overflow-style: none;
 grid-area: 1 / 1;
 scroll-snap-type: x mandatory;
 overscroll-behavior: contain;
 scrollbar-width: none
}

.east-orchard::-webkit-scrollbar {
 display: none
}

.low-flame {
 align-items: center;
 justify-content: center;
 scroll-snap-align: center;
 flex: 0 0 100%;
 display: flex;
 padding: 56px 12px calc(16px + env(safe-area-inset-bottom, 0px));
 margin: 0
}

.metro-web.round-print .low-flame {
 padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px))
}

.low-flame img {
 border-radius: 10px;
 height: auto;
 object-fit: contain;
 max-width: 100%;
 max-height: 100%;
 width: auto
}

.core-dune {
 gap: 10px;
 grid-area: 1 / 1;
 display: flex;
 align-self: start;
 align-items: center;
 background: linear-gradient(180deg, rgba(4, 8, 6, .85), rgba(4, 8, 6, 0));
 padding: 10px 12px;
 z-index: 2
}

.ultra-chain {
 flex: 1 1 auto;
 color: rgba(255, 255, 255, .78);
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 font-size: 13px;
 font-weight: 600
}

.civic-scope {
 font-size: 12px;
 font-weight: bold;
 font-variant-numeric: tabular-nums;
 color: rgba(255, 255, 255, .72);
 flex: 0 0 auto
}

.solar-tide,
.high-route {
 align-items: center;
 justify-content: center;
 display: inline-flex;
 backdrop-filter: blur(8px);
 color: #ffffff;
 transition: background 180ms ease, transform 180ms ease;
 cursor: pointer;
 border: 1px solid rgba(255, 255, 255, .16);
 border-radius: 999px;
 background: rgba(255, 255, 255, .1)
}

.solar-tide {
 flex: 0 0 auto;
 font-size: 16px;
 width: 38px;
 height: 38px
}

.solar-tide:hover,
.high-route:hover {
 background: rgba(255, 255, 255, .2)
}

.high-route {
 width: 44px;
 font-size: 15px;
 align-self: center;
 height: 44px;
 z-index: 2;
 grid-area: 1 / 1
}

.sharp-grove {
 margin-left: 12px;
 justify-self: start
}

.grand-slope {
 justify-self: end;
 margin-right: 12px
}

.round-print:not(.metro-web) .high-route {
 display: none
}

.grand-garden {
 grid-area: 1 / 1;
 padding: 10px 12px calc(12px + env(safe-area-inset-bottom, 0px));
 display: flex;
 scrollbar-width: none;
 align-self: end;
 justify-content: center;
 gap: 8px;
 overflow-x: auto;
 z-index: 2
}

.grand-garden::-webkit-scrollbar {
 display: none
}

.grand-garden:empty {
 display: none
}

.grand-garden button {
 background: none;
 width: 62px;
 transition: opacity 180ms ease, border-color 180ms ease;
 padding: 0;
 height: 42px;
 opacity: .5;
 border: 2px solid #0000;
 border-radius: 8px;
 flex: 0 0 auto;
 cursor: pointer
}

.grand-garden button.dark-snow {
 opacity: 1;
 border-color: var(--smart-outline, #16a34a)
}

.grand-garden button img {
 object-fit: cover;
 width: 100%;
 display: block;
 border-radius: 6px;
 height: 100%
}

@media (max-width: 700px) {
 .high-route {
  display: none!important
 }

 .grand-garden button {
  height: 36px;
  width: 52px
 }

 .low-flame {
  padding-inline: 6px
 }

}

#front-cliff .bold-tint {
 position: relative;
 overflow: hidden;
 max-width: 460px;
 border-radius: 22px
}

.free-lane {
 color: #ffffff;
 place-content: center;
 border: 1px solid rgba(255, 255, 255, .26);
 border-radius: 50%;
 font-size: 13px;
 cursor: pointer;
 transition: background 180ms ease;
 z-index: 3;
 height: 32px;
 display: grid;
 background: rgba(255, 255, 255, .14);
 width: 32px;
 position: absolute;
 top: 13px;
 right: 13px
}

.free-lane:hover {
 background: rgba(255, 255, 255, .28)
}

.micro-elm {
 padding: 19px 58px 19px 20px;
 color: #ffffff;
 background: radial-gradient(120% 140% at 100% 0%, rgba(255, 255, 255, .16), #0000 60%), linear-gradient(135deg, var(--smart-outline, #12a150), var(--deep-valley, #0a6b36));
 gap: 13px;
 display: flex;
 align-items: center
}

.lunar-signal {
 font-size: 19px;
 display: grid;
 background: rgba(255, 255, 255, .18);
 border-radius: 13px;
 border: 1px solid rgba(255, 255, 255, .26);
 width: 44px;
 height: 44px;
 place-content: center;
 flex: 0 0 auto
}

.noble-deck {
 min-width: 0
}

.light-menu {
 color: #ffffff;
 margin: 0;
 letter-spacing: -.015em;
 font-size: 18px;
 font-weight: 800
}

.solid-amber {
 font-size: 12.5px;
 line-height: 1.35;
 margin: 3px 0 0;
 color: rgba(255, 255, 255, .82)
}

#front-cliff .plain-slider {
 padding: 17px 20px 19px
}

.front-layout {
 font-size: 12.5px;
 line-height: 1.5;
 color: var(--deep-oak, #475569);
 margin: 0 0 14px
}

.mono-tide {
 overflow: hidden;
 border: 1px solid var(--custom-view, #e5e7eb);
 border-radius: 12px
}

.mono-tide .rich-gate {
 padding: 11px 13px;
 font-size: 13.5px;
 grid-template-columns: minmax(96px, 38%) minmax(0, 1fr);
 background: none;
 display: grid;
 align-items: center;
 gap: 10px;
 border-bottom: 1px solid var(--custom-view, #e5e7eb)
}

.mono-tide .rich-gate:last-child {
 border-bottom: 0
}

.mono-tide .true-orchard {
 text-transform: uppercase;
 font-size: 11px;
 font-weight: 800;
 color: var(--half-focus, #94a3b8);
 letter-spacing: .05em
}

.mono-tide .compact-fleet {
 font-size: 15px;
 font-weight: 800;
 word-break: break-word;
 color: var(--round-screen, #0f172a)
}

.mini-engine {
 align-items: center;
 padding: 12px 13px;
 border: 1px solid rgba(18, 161, 80, .26);
 border-radius: 12px;
 gap: 10px;
 margin-top: 12px;
 background: var(--warm-peak, #e7f6ee);
 grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
 display: grid
}

.final-ring {
 text-align: center;
 min-width: 0
}

.final-ring span {
 text-transform: uppercase;
 opacity: .72;
 letter-spacing: .06em;
 font-size: 10px;
 font-weight: 800;
 display: block;
 color: var(--deep-valley, #0a6b36)
}

.final-ring strong {
 margin-top: 2px;
 display: block;
 font-size: 15px;
 font-weight: 800;
 font-variant-numeric: tabular-nums;
 letter-spacing: .02em;
 color: var(--deep-valley, #0a6b36)
}

.front-basil {
 display: grid;
 background: var(--smart-outline, #12a150);
 color: #ffffff;
 width: 24px;
 font-size: 10px;
 place-content: center;
 border-radius: 50%;
 height: 24px
}

#front-cliff .open-flame {
 padding: 14px 20px calc(14px + env(safe-area-inset-bottom, 0px));
 gap: 10px
}

#front-cliff .open-flame .back-root {
 flex: 1 1 auto;
 background: var(--smart-outline, #12a150);
 box-shadow: 0 6px 18px rgba(18, 161, 80, .26);
 justify-content: center;
 border-color: var(--smart-outline, #12a150)
}

#front-cliff .open-flame .back-root:hover {
 border-color: var(--compact-brick, #0d8442);
 background: var(--compact-brick, #0d8442)
}

@media (max-width: 600px) {
 #front-cliff .bold-tint {
  border-radius: 20px 20px 0 0
 }

 .micro-elm {
  padding: 17px 54px 17px 17px
 }

 .light-menu {
  font-size: 16.5px
 }

 .lunar-signal {
  height: 40px;
  width: 40px;
  font-size: 17px
 }

 #front-cliff .plain-slider {
  padding: 15px 17px 17px
 }

 #front-cliff .open-flame {
  padding-inline: 17px
 }

 #front-cliff .open-flame .mono-peak {
  width: 100%;
  flex: 0 0 auto;
  justify-content: center
 }

 .final-ring strong {
  font-size: 14px
 }

}

.solar-ash {
 position: relative;
 border-radius: 22px;
 max-width: 460px;
 max-height: min(90vh, calc(100dvh - 2rem));
 overflow: hidden;
 height: auto
}

.smart-quay {
 background: rgba(255, 255, 255, .14);
 cursor: pointer;
 position: absolute;
 z-index: 3;
 border: 1px solid rgba(255, 255, 255, .26);
 border-radius: 50%;
 transition: background 180ms ease;
 top: 13px;
 right: 13px;
 display: grid;
 color: #ffffff;
 width: 32px;
 font-size: 13px;
 height: 32px;
 place-content: center
}

.smart-quay:hover {
 background: rgba(255, 255, 255, .28)
}

.core-tide {
 color: #ffffff;
 align-items: center;
 display: flex;
 padding: 19px 58px 19px 20px;
 gap: 13px
}

.lite-window .core-tide {
 background: radial-gradient(120% 140% at 100% 0%, rgba(255, 255, 255, .16), #0000 60%), linear-gradient(135deg, var(--smart-outline, #12a150), var(--deep-valley, #0a6b36))
}

.wild-olive .core-tide {
 background: radial-gradient(120% 140% at 100% 0%, rgba(18, 161, 80, .30), #0000 62%), linear-gradient(135deg, var(--metro-type, #235034), var(--wild-chain, #101815))
}

.east-moss {
 height: 44px;
 place-content: center;
 font-size: 19px;
 flex: 0 0 auto;
 border-radius: 13px;
 border: 1px solid rgba(255, 255, 255, .26);
 width: 44px;
 display: grid;
 background: rgba(255, 255, 255, .18)
}

.wide-arch {
 min-width: 0
}

.native-silver {
 font-size: 18px;
 font-weight: 800;
 color: #ffffff;
 margin: 0;
 letter-spacing: -.015em
}

.mono-birch {
 font-size: 12.5px;
 line-height: 1.35;
 margin: 3px 0 0;
 color: rgba(255, 255, 255, .82)
}

.solar-ash .plain-slider {
 flex: 0 1 auto;
 padding: 17px 20px 19px
}

.lite-kit {
 color: var(--deep-oak, #475569);
 margin: 0 0 14px;
 font-size: 12.5px;
 line-height: 1.55
}

.lite-kit strong {
 color: var(--round-screen, #0f172a);
 font-weight: 800
}

.lite-kit em {
 font-style: normal;
 font-weight: 800;
 color: var(--deep-valley, #0a6b36)
}

.true-tower {
 margin: 0;
 list-style: none;
 overflow: hidden;
 padding: 0;
 border: 1px solid var(--custom-view, #e5e7eb);
 border-radius: 12px
}

.global-gallery {
 padding: 12px 13px;
 align-items: flex-start;
 display: flex;
 gap: 12px;
 border-bottom: 1px solid var(--custom-view, #e5e7eb)
}

.global-gallery:last-child {
 border-bottom: 0
}

.high-vector {
 place-content: center;
 flex: 0 0 auto;
 height: 32px;
 width: 32px;
 background: var(--warm-peak, #e7f6ee);
 border-radius: 10px;
 display: grid;
 color: var(--deep-valley, #0a6b36);
 font-size: 14px
}

.noble-chat {
 font-size: 12.5px;
 line-height: 1.5;
 flex: 1;
 min-width: 0;
 color: var(--deep-oak, #475569)
}

.noble-chat strong {
 margin-bottom: 1px;
 font-size: 13.5px;
 font-weight: 800;
 color: var(--round-screen, #0f172a);
 display: block
}

.safe-flame {
 display: flex;
 color: var(--deep-oak, #475569);
 align-items: flex-start;
 gap: 10px;
 margin-top: 12px;
 padding: 12px 13px;
 border: 1px solid var(--custom-view, #e5e7eb);
 border-radius: 12px;
 font-size: 12.5px;
 line-height: 1.5
}

.safe-flame i {
 font-size: 15px;
 flex: 0 0 auto;
 margin-top: 1px
}

.active-mesh {
 color: #991b1b;
 border-color: #fecaca;
 background: #fef2f2
}

.active-mesh strong {
 color: #7f1d1d;
 font-weight: 800
}

.rapid-gold {
 background: var(--warm-peak, #e7f6ee);
 border: 1px solid rgba(18, 161, 80, .26);
 border-radius: 12px;
 margin-top: 12px;
 padding: 13px 14px;
 gap: 12px;
 display: flex;
 align-items: center
}

.rapid-gold[hidden] {
 display: none
}

.urban-screen {
 display: grid;
 flex: 0 0 auto;
 border-radius: 11px;
 height: 36px;
 color: #ffffff;
 place-content: center;
 background: var(--smart-outline, #12a150);
 width: 36px;
 font-size: 15px
}

.shared-pixel {
 min-width: 0
}

.snap-config {
 color: var(--deep-valley, #0a6b36);
 opacity: .72;
 font-size: 10px;
 font-weight: 800;
 letter-spacing: .06em;
 display: block;
 text-transform: uppercase
}

.royal-net {
 color: var(--deep-valley, #0a6b36);
 display: block;
 letter-spacing: -.01em;
 font-size: 19px;
 font-weight: 800;
 font-variant-numeric: tabular-nums
}

.lower-catalog {
 margin-top: 1px;
 display: block;
 opacity: .8;
 font-size: 11.5px;
 line-height: 1.35;
 color: var(--deep-valley, #0a6b36)
}

.solar-ash .open-flame {
 flex-shrink: 0;
 gap: 10px;
 padding: 14px 20px calc(14px + env(safe-area-inset-bottom, 0px))
}

.solar-ash .open-flame .back-root {
 box-shadow: 0 6px 18px rgba(18, 161, 80, .26);
 border-color: var(--smart-outline, #12a150);
 background: var(--smart-outline, #12a150);
 justify-content: center;
 flex: 1 1 auto
}

.solar-ash .open-flame .back-root:hover {
 border-color: var(--compact-brick, #0d8442);
 background: var(--compact-brick, #0d8442)
}

@media (max-width: 600px) {
 #true-reef.deep-type,
 #local-lake.deep-type {
  align-items: flex-end;
  padding: 0
 }

 .solar-ash {
  width: 100%;
  max-width: 100%;
  max-height: 92dvh;
  border-radius: 20px 20px 0 0
 }

 .core-tide {
  padding: 17px 54px 17px 17px
 }

 .native-silver {
  font-size: 16.5px
 }

 .east-moss {
  font-size: 17px;
  height: 40px;
  width: 40px
 }

 .solar-ash .plain-slider {
  padding: 15px 17px 17px
 }

 .solar-ash .open-flame {
  padding-inline: 17px
 }

 .solar-ash .open-flame .mono-peak {
  width: 100%;
  justify-content: center;
  flex: 0 0 auto
 }

 .royal-net {
  font-size: 18px
 }

}

.free-cards .west-scope {
 box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
 padding: 14px 15px 13px;
 border: 1px solid var(--custom-view);
 border-radius: 14px;
 background: var(--native-cliff, #ffffff)
}

.free-cards .wild-vector.west-scope {
 background: var(--warm-peak, #e7f6ee);
 border-color: rgba(18, 161, 80, .40)
}

.common-shade {
 display: grid;
 gap: 12px;
 grid-template-columns: auto minmax(0, 1fr) auto;
 align-items: center
}

.free-runtime {
 background: linear-gradient(160deg, #1f2d28, #0e1512);
 position: relative;
 color: #ffffff;
 display: grid;
 width: 46px;
 height: 46px;
 overflow: hidden;
 font-size: 18px;
 border-radius: 12px;
 place-content: center
}

.north-menu {
 position: absolute;
 inset: 0;
 animation: weightShape 1700ms ease-in-out infinite;
 transform: translateY(-110%);
 background: linear-gradient(180deg, #0000 0%, rgba(58, 208, 127, .55) 50%, #0000 100%)
}

.prime-forest {
 letter-spacing: -.01em;
 color: var(--round-screen);
 font-size: 14.5px;
 font-weight: 800
}

.urban-menu {
 margin-top: 2px;
 font-size: 12.5px;
 line-height: 1.35;
 color: var(--deep-oak)
}

.royal-coat {
 color: var(--deep-valley, #0a6b36);
 font-size: 19px;
 font-weight: 800;
 font-variant-numeric: tabular-nums;
 white-space: nowrap
}

.royal-coat small {
 font-size: 11px;
 font-weight: bold;
 opacity: .6
}

.grand-arch {
 overflow: hidden;
 background: var(--base-reset, #e9eeec);
 height: 5px;
 border-radius: 99px;
 margin-top: 12px;
 position: relative
}

.grand-arch > span {
 transition: width 200ms linear;
 background: linear-gradient(90deg, var(--smart-outline, #12a150), #3ad07f);
 height: 100%;
 width: 0;
 display: block;
 border-radius: 99px
}

.grand-arch:after {
 transform: translateX(-100%);
 background: linear-gradient(90deg, #0000, rgba(255, 255, 255, .55), #0000);
 animation: ridgeAmber 1500ms ease-in-out infinite;
 inset: 0;
 content: "";
 position: absolute
}

.free-cards .wild-vector.west-scope .grand-arch:after {
 opacity: 0;
 animation: none
}

.shared-harbour {
 margin: 11px 0 0;
 padding: 0;
 display: grid;
 list-style: none;
 gap: 1px
}

.shared-harbour li {
 padding: 5px 7px;
 transition: color 250ms ease, background 250ms ease;
 border-radius: 8px;
 align-items: center;
 grid-template-columns: 20px minmax(0, 1fr);
 gap: 9px;
 display: grid;
 font-size: 12.5px;
 line-height: 1.3;
 color: var(--half-focus)
}

.shared-harbour li:before {
 margin-inline: 2px;
 border-radius: 50%;
 border: 2px solid var(--custom-view);
 width: 15px;
 content: "";
 box-sizing: border-box;
 height: 15px
}

.shared-harbour li.classic-reset {
 font-weight: 600;
 color: var(--round-screen);
 background: var(--sharp-window, #f5f7f6)
}

.shared-harbour li.classic-reset:before {
 animation: seedViolet 700ms linear infinite;
 border-color: var(--smart-outline, #12a150);
 border-top-color: #0000
}

.shared-harbour li.long-port {
 color: var(--deep-oak)
}

.shared-harbour li.long-port:before {
 color: #ffffff;
 animation: seed-span 300ms cubic-bezier(.2, .9, .3, 1) both;
 border-color: var(--smart-outline, #12a150);
 font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
 font-weight: 900;
 font-size: 7.5px;
 place-content: center;
 display: grid;
 background: var(--smart-outline, #12a150);
 content: "\f00c"
}

.safe-arch {
 gap: 6px;
 color: var(--half-focus);
 display: flex;
 align-items: center;
 font-size: 11.5px;
 margin: 10px 0 0
}

@media (max-width: 420px) {
 .common-shade {
  gap: 10px
 }

 .free-runtime {
  font-size: 16px;
  height: 40px;
  width: 40px
 }

 .royal-coat {
  font-size: 17px
 }

 .prime-forest {
  font-size: 13.5px
 }

}

[data-theme="dark"] .free-cards .wild-vector.west-scope {
 background: rgba(18, 161, 80, .12)
}

[data-theme="dark"] .free-cards .royal-coat {
 color: #4ed48c
}

[data-theme="dark"] .grand-arch:after {
 background: linear-gradient(90deg, #0000, rgba(255, 255, 255, .22), #0000)
}

#free-catalog .full-surface {
 border-radius: 22px;
 overflow: hidden;
 position: relative;
 max-width: 430px
}

#free-catalog .plain-slider {
 padding: 0
}

.modern-reset {
 color: #ffffff;
 cursor: pointer;
 height: 36px;
 position: absolute;
 border: 1px solid rgba(255, 255, 255, .24);
 border-radius: 50%;
 width: 36px;
 transition: background 180ms ease, transform 180ms ease;
 top: 12px;
 right: 12px;
 backdrop-filter: blur(6px);
 -webkit-backdrop-filter: blur(6px);
 z-index: 3;
 display: grid;
 place-content: center;
 background: rgba(10, 15, 13, .42);
 font-size: 14px
}

.modern-reset:hover {
 background: rgba(10, 15, 13, .74);
 transform: scale(1.05)
}

.early-mirror {
 background: var(--base-route, #0d1714);
 aspect-ratio: 16 / 10;
 position: relative;
 overflow: hidden
}

.early-mirror > img {
 display: block;
 object-fit: cover;
 width: 100%;
 height: 100%
}

.early-mirror:after {
 position: absolute;
 inset: 0;
 content: "";
 background: linear-gradient(180deg, rgba(8, 12, 10, .52) 0%, rgba(8, 12, 10, 0) 32%, rgba(8, 12, 10, .10) 52%, rgba(8, 12, 10, .80) 100%)
}

.modern-fern {
 position: absolute;
 place-content: center;
 inset: 0;
 color: rgba(255, 255, 255, .22);
 display: grid;
 font-size: 42px
}

.mono-cards {
 top: 13px;
 left: 14px;
 align-items: flex-start;
 z-index: 2;
 position: absolute;
 display: flex;
 gap: 6px;
 flex-direction: column
}

.soft-map,
.main-app {
 font-size: 10.5px;
 font-weight: 800;
 line-height: 1;
 letter-spacing: .06em;
 text-transform: uppercase;
 padding: 5px 11px;
 border-radius: 99px
}

.soft-map {
 color: #101815;
 background: rgba(255, 255, 255, .92)
}

.main-app {
 color: #ffffff;
 background: var(--smart-outline, #12a150)
}

.noble-screen {
 z-index: 2;
 left: 16px;
 right: 16px;
 bottom: 13px;
 position: absolute
}

.warm-outline {
 color: #ffffff;
 font-size: 21px;
 font-weight: 800;
 line-height: 1.18;
 text-shadow: 0 2px 14px rgba(0, 0, 0, .45);
 margin: 0;
 letter-spacing: -.02em
}

.vivid-trail {
 margin: 5px 0 0;
 color: rgba(255, 255, 255, .80);
 font-size: 13px;
 font-weight: 500;
 line-height: 1.35;
 text-shadow: 0 1px 10px rgba(0, 0, 0, .45)
}

.back-helpers {
 padding: 17px 19px 5px
}

.light-screen {
 display: flex;
 gap: 12px;
 align-items: flex-end;
 justify-content: space-between
}

.south-boot {
 text-transform: uppercase;
 display: block;
 letter-spacing: .07em;
 margin-bottom: 2px;
 color: var(--half-focus, #94a3b8);
 font-size: 10.5px;
 font-weight: 800
}

.urban-web {
 font-size: 30px;
 font-weight: 800;
 line-height: 1.05;
 letter-spacing: -.03em;
 display: block;
 color: var(--round-screen, #0f172a)
}

.flat-atlas {
 color: var(--half-focus, #94a3b8);
 text-decoration: line-through;
 display: inline-block;
 font-size: 12.5px;
 font-weight: 600;
 margin-top: 3px
}

.rural-chrome {
 display: grid;
 padding: 8px 13px;
 background: var(--warm-peak, #e7f6ee);
 border-radius: 12px;
 gap: 1px;
 text-align: center;
 flex: 0 0 auto
}

.rural-chrome span {
 text-transform: uppercase;
 letter-spacing: .07em;
 color: var(--deep-valley, #0a6b36);
 font-size: 10px;
 font-weight: 800;
 opacity: .78
}

.rural-chrome strong {
 font-size: 15px;
 font-weight: 800;
 color: var(--deep-valley, #0a6b36)
}

.smooth-strip {
 gap: 6px;
 color: var(--deep-valley, #0a6b36);
 font-size: 12.5px;
 font-weight: bold;
 display: flex;
 margin: 10px 0 0;
 align-items: center
}

.cool-boot {
 border: 1px solid #e6e9ee;
 border-radius: 10px;
 margin: 14px 0 0;
 display: grid;
 overflow: hidden;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 background: #ffffff
}

.cool-boot .solid-lake {
 border-left: 1px solid #e6e9ee;
 display: flex;
 min-width: 0;
 text-align: center;
 gap: 3px 6px;
 padding: 9px 4px;
 flex-wrap: wrap;
 align-items: center;
 justify-content: center
}

.cool-boot .solid-lake:first-child {
 border-left: 0
}

.cool-boot .solid-lake dt {
 color: #111827;
 flex: 0 0 auto;
 font-size: 11.5px;
 line-height: 1;
 margin: 0
}

.cool-boot .solid-lake dd {
 margin: 0;
 overflow-wrap: normal;
 font-size: 11px;
 font-weight: bold;
 line-height: 1.25;
 color: #111827
}

.fresh-footer {
 padding: 11px 13px;
 display: flex;
 margin-top: 14px;
 border: 1px solid #fde9b8;
 border-left: 3px solid #e0a409;
 border-radius: 10px;
 align-items: flex-start;
 background: #fffaf0;
 gap: 11px
}

.fresh-footer > i {
 color: #b45309;
 font-size: 16px;
 margin-top: 1px
}

.fresh-footer strong {
 color: #7c4a05;
 font-size: 13.5px;
 font-weight: 800;
 display: block
}

.fresh-footer span {
 margin-top: 2px;
 font-size: 11.5px;
 line-height: 1.4;
 display: block;
 color: #8a6224
}

.high-stream {
 margin-top: 16px
}

.east-glass {
 color: var(--round-screen, #0f172a);
 display: block;
 font-size: 12.5px;
 font-weight: 800;
 margin-bottom: 8px
}

.lite-stamp {
 display: grid;
 background: #f1f4f3;
 padding: 4px;
 grid-auto-flow: column;
 grid-auto-columns: 1fr;
 gap: 4px;
 border-radius: 12px
}

.fluid-snow {
 font-size: 13.5px;
 font-weight: bold;
 font-family: inherit;
 color: var(--deep-oak, #475569);
 border: 0;
 border-radius: 9px;
 cursor: pointer;
 background: #0000;
 transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease;
 padding: 10px 8px
}

.fluid-snow:hover {
 color: var(--round-screen, #0f172a)
}

.classic-reset.fluid-snow {
 color: var(--deep-valley, #0a6b36);
 box-shadow: 0 1px 3px rgba(15, 23, 42, .12), 0 0 0 1px rgba(18, 161, 80, .30);
 background: #ffffff
}

#free-catalog .open-flame {
 background: #ffffff;
 gap: 10px;
 border-top: 1px solid var(--custom-view, #e5e7eb);
 padding: 14px 19px calc(14px + env(safe-area-inset-bottom, 0px))
}

#free-catalog .open-flame .back-root {
 box-shadow: 0 6px 18px rgba(18, 161, 80, .28);
 border-color: var(--smart-outline, #12a150);
 flex: 1 1 auto;
 justify-content: center;
 background: var(--smart-outline, #12a150)
}

#free-catalog .open-flame .back-root:hover {
 background: var(--compact-brick, #0d8442);
 border-color: var(--compact-brick, #0d8442)
}

#free-catalog .open-flame .crisp-insights {
 flex: 0 0 auto
}

@media (max-width: 560px) {
 #free-catalog.deep-type {
  align-items: flex-end;
  padding: 0
 }

 #free-catalog .full-surface {
  width: 100%;
  max-width: 100%;
  max-height: 94dvh;
  border-radius: 20px 20px 0 0
 }

 .early-mirror {
  aspect-ratio: 16 / 9
 }

 .warm-outline {
  font-size: 19px
 }

 .urban-web {
  font-size: 27px
 }

 #free-catalog .open-flame {
  flex-direction: column-reverse
 }

 #free-catalog .open-flame .mono-peak {
  justify-content: center;
  flex: 0 0 auto;
  width: 100%
 }

}

@media (prefers-reduced-motion: reduce) {
 .free-cards .snap-elements:after {
  transition: none
 }

 .bold-link {
  animation: none
 }

 .round-print {
  transition: none
 }

 .modern-reset {
  transition: none
 }

}

.prime-layout {
 box-shadow: 0 12px 30px -28px rgba(12, 14, 18, .75);
 background: color-mix(in srgb, var(--low-link) 84%, #0000)
}

.prime-layout .lower-creek {
 letter-spacing: -.045em;
 font-size: 30px
}

.prime-layout .east-pine {
 min-width: 0;
 white-space: normal;
 max-width: none;
 overflow: visible;
 border-left-width: 1px;
 padding-left: 12px
}

.prime-layout .east-pine strong {
 white-space: nowrap;
 letter-spacing: -.015em;
 text-overflow: unset;
 overflow: visible
}

.prime-layout .round-pond {
 font-size: 10px;
 font-weight: 600;
 line-height: 1.25;
 display: block;
 overflow: visible;
 white-space: normal;
 overflow-wrap: break-word;
 text-transform: uppercase;
 letter-spacing: .04em;
 margin-top: 1px;
 max-width: 100%
}

.prime-layout .pure-creek {
 min-height: 42px;
 border-radius: 12px;
 box-shadow: 0 1px 2px rgba(18, 161, 80, .26), 0 10px 22px -14px rgba(18, 161, 80, .8)
}

.prime-layout .pure-creek:hover:not(:disabled) {
 box-shadow: 0 2px 4px rgba(18, 161, 80, .24), 0 18px 30px -16px rgba(18, 161, 80, .85)
}

.rapid-sage {
 padding-block: 22px 0
}

.south-plaza {
 border-radius: 22px;
 box-shadow: 0 2px 6px rgba(8, 14, 11, .10), 0 30px 62px -36px rgba(8, 14, 11, .6)
}

.free-cards .metro-lens {
 padding: 16px;
 box-shadow: 0 1px 2px rgba(12, 14, 18, .04), 0 16px 32px -26px rgba(12, 14, 18, .5);
 border-radius: 18px
}

.free-cards .upper-net {
 font-size: 13.5px;
 border-radius: 11px;
 border-width: 1.5px;
 transition: background 200ms var(--classic-blocks), border-color 200ms var(--classic-blocks), color 200ms var(--classic-blocks), box-shadow 200ms var(--classic-blocks)
}

.free-cards .classic-reset.royal-pier .upper-net {
 box-shadow: 0 0 0 4px color-mix(in srgb, var(--smart-outline) 16%, #0000)
}

.free-cards .main-oak {
 letter-spacing: -.012em;
 font-size: 13px;
 font-weight: bold
}

.free-cards .classic-reset.royal-pier .main-oak {
 color: var(--round-screen)
}

.free-cards .long-insights {
 box-shadow: 0 1px 2px rgba(12, 14, 18, .04), 0 16px 32px -26px rgba(12, 14, 18, .5);
 border-radius: 18px;
 overflow: hidden
}

.free-cards .full-chain {
 background: var(--sharp-window);
 padding: 15px 16px 14px;
 border-bottom: 1px solid var(--custom-view)
}

.free-cards .low-dew {
 padding: 13px 16px
}

.free-cards .open-fleet .vivid-index {
 font-size: 11.5px;
 letter-spacing: .01em
}

.free-cards .open-fleet .fluid-chrome {
 letter-spacing: -.014em;
 font-size: 14px
}

.free-cards .back-ribbon {
 box-shadow: 0 1px 2px rgba(12, 14, 18, .04), 0 18px 38px -30px rgba(12, 14, 18, .55);
 border-radius: 20px
}

.free-cards .local-knot {
 padding: 30px 28px
}

.free-cards .native-elm {
 margin-bottom: 8px;
 font-size: 24px;
 line-height: 1.14;
 letter-spacing: -.032em
}

.free-cards .pure-forest {
 margin-bottom: 22px;
 font-size: 14.5px;
 line-height: 1.62
}

.free-cards .west-olive {
 padding: 14px 16px;
 gap: 13px;
 border-radius: 14px;
 border-left: 3px solid var(--smart-outline)
}

.free-cards .native-matrix li:before {
 background: var(--smart-outline)
}

.free-cards .core-sun {
 border-radius: 13px;
 border-width: 1px;
 letter-spacing: -.01em;
 transition: border-color 180ms var(--classic-blocks), background 180ms var(--classic-blocks), color 180ms var(--classic-blocks), transform 180ms var(--classic-blocks), box-shadow 180ms var(--classic-blocks)
}

.free-cards .core-sun:hover {
 background: var(--sharp-window);
 border-color: color-mix(in srgb, var(--smart-outline) 45%, var(--custom-view))
}

.free-cards .core-sun:active {
 transform: scale(.99)
}

.free-cards .classic-reset.core-sun {
 box-shadow: 0 1px 2px rgba(12, 14, 18, .12), 0 12px 24px -18px rgba(12, 14, 18, .7)
}

.free-cards .core-sun:focus-visible {
 outline: 2px solid var(--smart-outline);
 outline-offset: 2px
}

.free-cards .lower-fleet,
.free-cards .inner-runtime,
.free-cards .solid-mirror {
 transition: border-color 180ms var(--classic-blocks), box-shadow 180ms var(--classic-blocks), background-color 180ms var(--classic-blocks);
 background-color: var(--sharp-window);
 border-radius: 13px;
 border-width: 1px
}

.free-cards .lower-fleet:focus,
.free-cards .inner-runtime:focus,
.free-cards .solid-mirror:focus {
 background-color: var(--native-cliff)
}

.free-cards .west-config {
 border-radius: 11px
}

.prime-layout .mono-peak,
.free-cards .mono-peak,
.base-port .mono-peak {
 border-radius: 13px;
 letter-spacing: -.01em;
 transition: background 180ms var(--classic-blocks), border-color 180ms var(--classic-blocks), color 180ms var(--classic-blocks), transform 180ms var(--classic-blocks), box-shadow 180ms var(--classic-blocks)
}

.prime-layout .round-bronze,
.base-port .round-bronze {
 border-radius: var(--warm-pulse)
}

.prime-layout .mono-peak i,
.free-cards .mono-peak i,
.base-port .mono-peak i {
 transition: transform 180ms var(--classic-blocks)
}

.prime-layout .mono-peak:not(:disabled):hover i:last-child:not(:first-child),
.free-cards .mono-peak:not(:disabled):hover i:last-child:not(:first-child),
.base-port .mono-peak:not(:disabled):hover i:last-child:not(:first-child) {
 transform: translateX(5px)
}

.free-cards .mono-peak:not(:disabled):hover i:first-child:not(:last-child),
.base-port .mono-peak:not(:disabled):hover i:first-child:not(:last-child) {
 transform: scale(1.08)
}

.prime-layout .mono-peak:not(:disabled):hover,
.free-cards .mono-peak:not(:disabled):hover,
.base-port .mono-peak:not(:disabled):hover {
 transform: translateY(-3px)
}

.prime-layout .mono-peak:not(:disabled):active,
.free-cards .mono-peak:not(:disabled):active,
.base-port .mono-peak:not(:disabled):active {
 transform: translateY(0) scale(.98)
}

.prime-layout .mono-peak:focus-visible,
.free-cards .mono-peak:focus-visible,
.base-port .mono-peak:focus-visible {
 outline: 2px solid var(--smart-outline);
 outline-offset: 3px
}

.free-cards .back-root {
 box-shadow: 0 1px 2px rgba(18, 161, 80, .26), 0 12px 26px -16px rgba(18, 161, 80, .8)
}

.free-cards .back-root:hover:not(:disabled) {
 box-shadow: 0 2px 5px rgba(18, 161, 80, .24), 0 20px 34px -18px rgba(18, 161, 80, .9)
}

.free-cards .back-root:disabled,
.free-cards .back-root[disabled] {
 box-shadow: none
}

.free-cards .back-root:before {
 content: "";
 position: absolute;
 background: linear-gradient(104deg, #0000 36%, rgba(255, 255, 255, .26) 50%, #0000 64%);
 transition: transform 280ms var(--classic-blocks);
 pointer-events: none;
 transform: translateX(-100%);
 inset: 0
}

.free-cards .back-root:hover:not(:disabled):before {
 transform: translateX(100%)
}

.free-cards .back-root:disabled:before,
.free-cards .back-root[disabled]:before {
 display: none
}

.free-cards .urban-mint {
 animation: ridgeWave 2600ms ease-in-out infinite
}

.free-cards .upper-silver {
 background: var(--native-cliff);
 box-shadow: 0 1px 2px rgba(12, 14, 18, .04), 0 14px 30px -24px rgba(12, 14, 18, .5);
 border-color: var(--custom-view);
 border-radius: 18px
}

.free-cards .upper-silver:hover,
.free-cards .upper-silver.prime-page:hover {
 border-color: color-mix(in srgb, var(--smart-outline) 42%, var(--custom-view));
 box-shadow: 0 2px 6px rgba(12, 14, 18, .05), 0 24px 46px -26px rgba(18, 161, 80, .5)
}

.free-cards .custom-coral,
.free-cards .civic-scroll {
 background: var(--base-reset)
}

.free-cards .smart-sun {
 color: var(--half-focus)
}

.free-cards .custom-coral:after {
 background: linear-gradient(0deg, rgba(6, 13, 10, .93) 0%, rgba(6, 13, 10, .80) 20%, rgba(6, 13, 10, .44) 44%, rgba(6, 13, 10, .10) 68%, rgba(6, 13, 10, 0) 88%), linear-gradient(180deg, rgba(6, 13, 10, .32) 0%, rgba(6, 13, 10, 0) 26%)
}

.free-cards .light-coral {
 max-width: none;
 left: 13px;
 right: 13px
}

.free-cards .urban-extras {
 border: 1px solid var(--custom-view);
 border-radius: 11px;
 background: var(--sharp-window)
}

.free-cards .solid-lake {
 border-left-color: var(--custom-view)
}

.free-cards .solid-lake dt {
 color: var(--deep-oak)
}

.free-cards .solid-lake dd {
 color: var(--round-screen)
}

@container (max-width: 360px) {
 .free-cards .solid-lake:nth-child(odd) {
  border-left-color: var(--custom-view)
 }

}

.free-cards .calm-ash {
 box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--smart-outline) 22%, #0000);
 border-radius: 13px;
 background: var(--warm-peak)
}

.free-cards .calm-ash:before {
 background: color-mix(in srgb, var(--smart-outline) 24%, #0000)
}

.free-cards .smart-blocks {
 opacity: .76;
 color: var(--deep-valley)
}

.free-cards .cool-hue {
 letter-spacing: -.032em;
 color: var(--deep-valley)
}

.free-cards .south-palette {
 color: var(--half-focus)
}

.free-cards .quick-dune {
 color: var(--deep-valley)
}

.free-cards .quick-dune i {
 color: var(--smart-outline)
}

.free-cards .upper-silver .active-token button {
 text-decoration-color: var(--custom-view);
 color: var(--deep-oak)
}

.free-cards .upper-silver .active-token button:hover {
 background: none;
 color: var(--deep-valley);
 text-decoration-color: currentcolor
}

.free-cards .light-brook.prime-page.upper-silver {
 background: color-mix(in srgb, var(--smart-outline) 5%, var(--native-cliff))
}

.royal-gallery {
 box-shadow: 0 -12px 32px -26px rgba(12, 14, 18, .6)
}

.north-mesh > i {
 border-radius: 12px
}

.north-mesh b {
 letter-spacing: -.012em
}

@media (max-width: 860px) {
 .south-plaza {
  border-radius: 18px
 }

 .free-cards .metro-lens {
  border-radius: 15px;
  padding: 12px 10px
 }

 .free-cards .long-insights {
  border-radius: 16px
 }

 .free-cards .native-elm {
  font-size: 20px;
  letter-spacing: -.028em
 }

 .free-cards .local-knot {
  padding: 24px 20px
 }

 .free-cards .pure-forest {
  margin-bottom: 18px;
  font-size: 14px
 }

}

@media (max-width: 600px) {
 .south-plaza {
  border-radius: 16px
 }

 .free-cards .back-ribbon {
  border-radius: 18px
 }

 .free-cards .local-knot {
  padding: 24px
 }

 .free-cards .native-elm {
  font-size: 19px
 }

 .free-cards .west-olive {
  border-radius: 12px;
  padding: 12px 13px
 }

}

@media (prefers-reduced-motion: reduce) {
 .prime-layout .mono-peak,
 .free-cards .mono-peak,
 .base-port .mono-peak,
 .prime-layout .mono-peak i,
 .free-cards .mono-peak i,
 .base-port .mono-peak i,
 .free-cards .back-root:before,
 .free-cards .core-sun,
 .free-cards .upper-net,
 .free-cards .lower-fleet,
 .free-cards .inner-runtime,
 .free-cards .solid-mirror,
 .static-token {
  transition-duration: .01ms
 }

 .prime-layout .mono-peak:not(:disabled):hover,
 .free-cards .mono-peak:not(:disabled):hover,
 .base-port .mono-peak:not(:disabled):hover,
 .prime-layout .mono-peak:not(:disabled):active,
 .free-cards .mono-peak:not(:disabled):active,
 .base-port .mono-peak:not(:disabled):active,
 .prime-layout .mono-peak:not(:disabled):hover i:last-child:not(:first-child),
 .free-cards .mono-peak:not(:disabled):hover i:last-child:not(:first-child),
 .base-port .mono-peak:not(:disabled):hover i:last-child:not(:first-child),
 .free-cards .mono-peak:not(:disabled):hover i:first-child:not(:last-child),
 .base-port .mono-peak:not(:disabled):hover i:first-child:not(:last-child),
 .free-cards .core-sun:active,
 .static-token:hover {
  transform: none
 }

 .free-cards .back-root:hover:not(:disabled):before {
  transform: translateX(-100%)
 }

 .free-cards .urban-mint {
  animation: none
 }

}

@keyframes weightEmber {
 from {
  opacity: 0;
  transform: translateY(-50%) translateX(-8px)
 }

 to {
  opacity: 1;
  transform: translateY(-50%) translateX(0)
 }

}

@keyframes weightShape {
 to {
  transform: translateY(110%)
 }

}

@keyframes ridgeAmber {
 to {
  transform: translateX(100%)
 }

}

@keyframes seedViolet {
 to {
  transform: rotate(360deg)
 }

}

@keyframes seed-span {
 to {
  opacity: 1;
  transform: scale(1)
 }

 from {
  opacity: 0;
  transform: scale(.4)
 }

}

@keyframes ridgeWave {
 from,
 to {
  box-shadow: 0 1px 2px rgba(18, 161, 80, .26), 0 12px 26px -16px rgba(18, 161, 80, .8), 0 0 0 0 rgba(18, 161, 80, .22)
 }

 50% {
  box-shadow: 0 1px 2px rgba(18, 161, 80, .26), 0 12px 26px -16px rgba(18, 161, 80, .85), 0 0 0 7px rgba(18, 161, 80, 0)
 }

}