/*!********************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/@wordpress/scripts/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/@wordpress/scripts/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./scss/style.scss ***!
\********************************************************************************************************************************************************************************************************************************************************************************************************/
/* $container-max-widths: (
sm: 540px,
md: 720px,
lg: 960px,
xl: 1200px,
xxl: 1400px,
); */
/* CSS Variable */
:root {
--font-opensans: 'OpenSans', san-serif;
--clr-white: #ffffff;
--clr-light: rgba(247, 245, 241, 0.5);
--clr-black: #000000;
--clr-dark: #2e2e2e;
--clr-base: #000000;
--clr-brand: #d56036;
--clr-secondary: #6b8a7a;
--clr-gold: #9c7963;
--clr-gold-light: #cdbcb1;
--clr-white-rgb: 255, 255, 255;
--clr-light-rgb: 250, 244, 237;
--clr-black-rgb: 0, 0, 0;
--clr-dark-rgb: 46, 46, 46;
--clr-base-rgb: 255, 255, 255;
--clr-brand-rgb: 1, 48, 48;
--clr-secondary-rgb: 107, 138, 122;
--clr-gold-rgb: 156, 121, 99;
--clr-gold-light-rgb: 205, 188, 177;
--bs-body-font-weight: 400;
--bs-warning: var(--clr-gold);
--bs-warning-rgb: var(--clr-gold-rgb);
--bs-dark-rgb: var(--clr-dark-rgb);
--bs-body-color-rgb: var(--clr-base-rgb);
--bs-body-line-height: 1.8;
--bs-border-radius: 1rem;
--bs-border-radius-sm: 0.5rem;
--bs-border-radius-lg: 1.5rem;
--bs-border-radius-xl: 2rem;
--bs-border-radius-xxl: 4rem;
--bs-accordion-new-btn-active-icon: url('data:image/svg+xml,');
--bs-accordion-new-btn-icon: url('data:image/svg+xml,');
--arrow-right-white: url('data:image/svg+xml,');
--arrow-right-primary: url('data:image/svg+xml,');
--list-arrow-right-white: url('data:image/svg+xml,');
--list-arrow-right-primary: url('data:image/svg+xml,');
--play-icon: url('data:image/svg+xml,');
--check-icon: url('data:image/svg+xml,');
--arrow-icon: url('data:image/svg+xml,');
--list-arrow: url('data:image/svg+xml,');
--slick-btn-size: 30px;
--bs-navbar-toggler-icon-bg-white: url('data:image/svg+xml,');
}
.lh-1 {
line-height: 1;
}
.lh-14 {
line-height: 1.4;
}
.lh-18 {
line-height: 1.8;
}
.ls-1 {
letter-spacing: 1px;
}
.ls-4 {
letter-spacing: 3.5px;
}
.isolate {
isolation: isolate;
}
.balance-text {
text-wrap: balance; /* Apply (proposed) CSS style */
}
@font-face {
font-family: 'Dollar Fix';
src: local('Arial'), local('Helvetica Neue'), local('Helvetica');
unicode-range: U+0024;
}
@font-face {
font-family: 'Inter 28pt';
src:
url(fonts/Inter28pt-Bold.815e0d54.woff2) format('woff2'),
url(fonts/Inter28pt-Bold.db90cefd.woff) format('woff');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'FONTSPRING DEMO - Roc Grotesk Bold';
src:
url(fonts/RocGrotesk-Bold.09f1fa7c.woff2) format('woff2'),
url(fonts/RocGrotesk-Bold.024ee991.woff) format('woff');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Space Grotesk';
src:
url(fonts/roc_grotesk_regular-webfont.ef6a4dec.woff2) format('woff2'),
url(fonts/roc_grotesk_regular-webfont.2b96cc74.woff) format('woff');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Clash Display';
src:
url(fonts/ClashDisplay-Medium.ec4817a4.woff2?v=2) format('woff2'),
url(fonts/ClashDisplay-Medium.a925d0dc.woff?v=2) format('woff');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Clash Display Bold';
src:
url(fonts/ClashDisplay-Bold.7603c008.woff2?v=2) format('woff2'),
url(fonts/ClashDisplay-Bold.928009d5.woff?v=2) format('woff');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Clash Display Semi Bold';
src:
url(fonts/ClashDisplay-Semibold.a7771301.woff2?v=2) format('woff2'),
url(fonts/ClashDisplay-Semibold.af6042c5.woff?v=2) format('woff');
font-weight: 600;
font-style: normal;
font-display: swap;
}
.ff-clash-display-semi-bold {
font-family: 'Clash Display Semi Bold';
}
.ff-roc-grotesk {
font-family: 'Space Grotesk' !important;
}
.ff-roc-grotesk-bold {
font-family: 'FONTSPRING DEMO - Roc Grotesk Bold' !important;
}
.ff-clash-display {
font-family: 'Clash Display' !important;
}
.ff-clash-display-bold {
font-family: 'Clash Display Bold' !important;
}
.ff-inter-bold {
font-family: 'Inter 28pt';
}
.ff-opensans {
font-family: var(--font-opensans);
}
.fw-300 {
font-weight: 300;
}
.fw-500 {
font-weight: 500;
}
.fw-700 {
font-weight: 700;
}
.fs-18 {
font-size: 1.125rem;
}
.fs-20 {
font-size: 1.25rem;
}
.fs-24 {
font-size: 1.5rem;
}
.fs-base {
font-size: 1rem;
}
.fs-small {
font-size: 0.875rem;
}
.fs-smaller {
font-size: 0.75rem;
}
.fs-smallest {
font-size: 0.625rem;
}
.text-underline {
text-decoration: underline;
}
.btn {
--bs-btn-border-radius: 0;
border: 0.778458px solid rgba(147, 51, 234, 0.25098);
--bs-btn-font-size: 0.75rem;
font-family: 'Clash Display';
text-transform: uppercase;
color: #fff;
flex-direction: row;
justify-content: center;
gap: 40px;
--bs-btn-padding-y: 0.6rem;
--bs-btn-padding-x: 1.4rem;
border-radius: 999px; /* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;
}
.btn.ff-roc-grotesk-bold {
font-family: 'FONTSPRING DEMO - Roc Grotesk Bold' !important;
}
.btn-secondary {
--bs-btn-color: var(--clr-white);
--bs-btn-active-color: var(--clr-white);
--bs-btn-hover-color: var(--clr-white);
}
.btn-outline-secondary {
--bs-btn-active-color: var(--clr-white);
--bs-btn-hover-color: var(--clr-white);
}
.btn-lg,
.btn-group-lg > .btn {
text-transform: uppercase;
font-family: 'Clash Display Bold';
}
@media screen and (min-width: 991px) {
.btn-lg,
.btn-group-lg > .btn {
--bs-btn-padding-y: 0.8rem;
--bs-btn-padding-x: 1.9rem;
--bs-btn-font-size: 1.2rem;
}
}
.btn-primary {
--bs-btn-color: var(--clr-white);
background: linear-gradient(
236.19deg,
rgba(124, 58, 237, 0.376471) 4.95%,
rgba(76, 29, 149, 0.12549) 86.85%
);
}
.btn-outlne-primary {
border: 1px solid var(--clr-secondary);
}
.btn-white {
background-color: #fff;
color: #000;
}
.btn-white:hover {
background-color: rgba(255, 255, 255, 0.9176470588);
color: rgba(0, 0, 0, 0.8823529412);
}
.nf-before-form-content {
display: none;
}
.nf-field-container .wpforms-field-container,
.wpforms-container-full .wpforms-field-container {
--wpforms-field-size-input-height: 50px;
}
.nf-field-container .wpforms-field-container input[type='text'],
.nf-field-container .wpforms-field-container input[type='email'],
.nf-field-container .wpforms-field-container input[type='number'],
.nf-field-container .wpforms-field-container textarea,
.wpforms-container-full .wpforms-field-container input[type='text'],
.wpforms-container-full .wpforms-field-container input[type='email'],
.wpforms-container-full .wpforms-field-container input[type='number'],
.wpforms-container-full .wpforms-field-container textarea {
padding: 0.5rem 1rem;
border: 1px solid rgba(var(--clr-white-rgb), 0.03);
background-color: rgba(var(--clr-white-rgb), 0.03);
color: var(--clr-white);
box-shadow: none;
transition: all 0.3s ease-in-out;
}
.nf-field-container .wpforms-field-container input[type='text']:focus,
.nf-field-container .wpforms-field-container input[type='text']:focus:invalid,
.nf-field-container .wpforms-field-container input[type='text']:active,
.nf-field-container .wpforms-field-container input[type='email']:focus,
.nf-field-container .wpforms-field-container input[type='email']:focus:invalid,
.nf-field-container .wpforms-field-container input[type='email']:active,
.nf-field-container .wpforms-field-container input[type='number']:focus,
.nf-field-container .wpforms-field-container input[type='number']:focus:invalid,
.nf-field-container .wpforms-field-container input[type='number']:active,
.nf-field-container .wpforms-field-container textarea:focus,
.nf-field-container .wpforms-field-container textarea:focus:invalid,
.nf-field-container .wpforms-field-container textarea:active,
.wpforms-container-full .wpforms-field-container input[type='text']:focus,
.wpforms-container-full
.wpforms-field-container
input[type='text']:focus:invalid,
.wpforms-container-full .wpforms-field-container input[type='text']:active,
.wpforms-container-full .wpforms-field-container input[type='email']:focus,
.wpforms-container-full
.wpforms-field-container
input[type='email']:focus:invalid,
.wpforms-container-full .wpforms-field-container input[type='email']:active,
.wpforms-container-full .wpforms-field-container input[type='number']:focus,
.wpforms-container-full
.wpforms-field-container
input[type='number']:focus:invalid,
.wpforms-container-full .wpforms-field-container input[type='number']:active,
.wpforms-container-full .wpforms-field-container textarea:focus,
.wpforms-container-full .wpforms-field-container textarea:focus:invalid,
.wpforms-container-full .wpforms-field-container textarea:active {
border: 1px solid #777;
box-shadow: none;
outline: none;
color: var(--clr-white);
}
.nf-field-container .wpforms-field-container .textbox-wrap:not(.submit-wrap),
.nf-field-container .wpforms-field-container .email-wrap,
.nf-field-container .wpforms-field-container .wpforms-field,
.wpforms-container-full
.wpforms-field-container
.textbox-wrap:not(.submit-wrap),
.wpforms-container-full .wpforms-field-container .email-wrap,
.wpforms-container-full .wpforms-field-container .wpforms-field {
position: relative;
}
.nf-field-container
.wpforms-field-container
.textbox-wrap:not(.submit-wrap)
input,
.nf-field-container
.wpforms-field-container
.textbox-wrap:not(.submit-wrap)
textarea,
.nf-field-container .wpforms-field-container .email-wrap input,
.nf-field-container .wpforms-field-container .email-wrap textarea,
.nf-field-container .wpforms-field-container .wpforms-field input,
.nf-field-container .wpforms-field-container .wpforms-field textarea,
.wpforms-container-full
.wpforms-field-container
.textbox-wrap:not(.submit-wrap)
input,
.wpforms-container-full
.wpforms-field-container
.textbox-wrap:not(.submit-wrap)
textarea,
.wpforms-container-full .wpforms-field-container .email-wrap input,
.wpforms-container-full .wpforms-field-container .email-wrap textarea,
.wpforms-container-full .wpforms-field-container .wpforms-field input,
.wpforms-container-full .wpforms-field-container .wpforms-field textarea {
padding: 0.5rem 1rem 0.5rem 2.5rem;
}
.nf-field-container
.wpforms-field-container
.textbox-wrap:not(.submit-wrap)::before,
.nf-field-container .wpforms-field-container .email-wrap::before,
.nf-field-container .wpforms-field-container .wpforms-field::before,
.wpforms-container-full
.wpforms-field-container
.textbox-wrap:not(.submit-wrap)::before,
.wpforms-container-full .wpforms-field-container .email-wrap::before,
.wpforms-container-full .wpforms-field-container .wpforms-field::before {
content: '';
position: absolute;
z-index: 1;
left: 12px;
top: 30px;
width: 1.125rem;
height: 1.125rem;
/* border-radius: 50%; */
background-color: #e6e6e6;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
background-color: transparent;
}
.nf-field-container div.wpforms-submit-container input[type='submit'],
.nf-field-container
div.wpforms-submit-container
button[type='submit']:not(:hover):not(:active),
.nf-field-container div.wpforms-submit-container button[type='submit'],
.wpforms-container-full div.wpforms-submit-container input[type='submit'],
.wpforms-container-full
div.wpforms-submit-container
button[type='submit']:not(:hover):not(:active),
.wpforms-container-full div.wpforms-submit-container button[type='submit'] {
background-color: var(--clr-brand);
color: var(--clr-white);
border-radius: 0;
padding: 1rem 2rem;
height: auto;
text-transform: uppercase;
}
.nf-field-container div.wpforms-submit-container input[type='submit']:hover,
.nf-field-container div.wpforms-submit-container input[type='submit']:focus,
.nf-field-container
div.wpforms-submit-container
button[type='submit']:not(:hover):not(:active):hover,
.nf-field-container
div.wpforms-submit-container
button[type='submit']:not(:hover):not(:active):focus,
.nf-field-container div.wpforms-submit-container button[type='submit']:hover,
.nf-field-container div.wpforms-submit-container button[type='submit']:focus,
.wpforms-container-full div.wpforms-submit-container input[type='submit']:hover,
.wpforms-container-full div.wpforms-submit-container input[type='submit']:focus,
.wpforms-container-full
div.wpforms-submit-container
button[type='submit']:not(:hover):not(:active):hover,
.wpforms-container-full
div.wpforms-submit-container
button[type='submit']:not(:hover):not(:active):focus,
.wpforms-container-full
div.wpforms-submit-container
button[type='submit']:hover,
.wpforms-container-full
div.wpforms-submit-container
button[type='submit']:focus {
background-color: var(--clr-brand);
}
.contact-us-section {
--height: 25rem;
}
.contact-us-section .slick-img-slider-single-wrapper,
.contact-us-section .slick-img-slider-single,
.contact-us-section .slick-img-slider-single img {
height: var(--height);
}
div.wpforms-container-full:not(:empty) {
margin: 0 !important;
}
.wpforms-container-full .wpforms-field-container .wpforms-field textarea {
padding-top: 1rem;
}
.wpforms-container-full .wpforms-field-container .wpforms-field textarea:focus {
color: var(--clr-white) !important;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
color: var(--clr-white);
opacity: 1;
}
input::placeholder,
textarea::placeholder {
color: var(--clr-white);
opacity: 1;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
/* Chrome/Opera/Safari */
color: var(--clr-white) !important;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
/* Firefox 19+ */
color: var(--clr-white) !important;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
/* IE 10+ */
color: var(--clr-white) !important;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
/* Firefox 18- */
color: var(--clr-white) !important;
}
.wpforms-container-full
.wpforms-field-container
.wpforms-field.form-name::before {
background-image: url('data:image/svg+xml,');
}
.wpforms-container-full
.wpforms-field-container
.wpforms-field.form-email::before {
background-image: url('data:image/svg+xml,');
}
.wpforms-container-full
.wpforms-field-container
.wpforms-field.form-phone::before {
background-image: url('data:image/svg+xml,');
}
.wpforms-container-full
.wpforms-field-container
.wpforms-field.form-message::before {
background-image: url('data:image/svg+xml,');
}
.text-faqs .accordion-item {
--bs-accordion-border-radius: 0;
--bs-accordion-inner-border-radius: 0;
--bs-accordion-btn-focus-box-shadow: none;
--bs-accordion-bg: var(--clr-secondary);
--bs-accordion-color: var(--clr-white);
--bs-accordion-active-bg: var(--clr-secondary);
--bs-accordion-active-color: var(--clr-white);
--bs-accordion-border-width: 0;
--bs-accordion-icon-size: 3.5rem;
margin-bottom: 1.5rem;
border: 1px solid var(--clr-secondary);
}
.text-faqs .accordion-item:not(:first-of-type) {
border: 1px solid var(--clr-secondary);
}
.text-faqs .accordion-button {
position: relative;
isolation: isolate;
padding-right: var(--bs-accordion-icon-size);
transition: font-size 0.3s ease-in-out;
}
.text-faqs .accordion-button::before {
content: '';
position: absolute;
top: 0;
right: 0;
width: var(--bs-accordion-icon-size);
height: 100%;
background-color: var(--clr-secondary);
z-index: -1;
}
.text-faqs .accordion-button::after {
position: absolute;
top: 42%;
right: 8px;
translate: -50%;
}
.text-faqs .accordion-button:not(.collapsed) {
font-size: 30px;
font-weight: 700;
}
.text-faqs .accordion-button:not(.collapsed)::before {
background-color: var(--clr-white);
height: var(--bs-accordion-icon-size);
}
.text-faqs .accordion-button:not(.collapsed)::after {
top: 14px;
right: 8px;
}
.text-faqs .accordion-collapse.show {
background-color: var(--clr-secondary);
color: var(--clr-white);
}
.text-faqs .accordion-body {
padding-top: 0;
}
.slick-dots {
position: absolute;
bottom: 1rem;
right: 1.5rem;
display: flex;
gap: 0.5rem;
list-style: none;
}
.slick-dots li {
background-color: var(--clr-white);
height: 2px;
width: 1rem;
cursor: pointer;
opacity: 0.75;
transition: all 0.3s ease;
}
.slick-dots li.slick-active {
opacity: 1;
}
.slick-dots button {
opacity: 0;
display: none;
}
.slick-prev,
.slick-next {
background-color: transparent;
border: none;
background-image: var(--arrow-right-white);
background-repeat: no-repeat;
background-position: center;
background-size: var(--slick-btn-size);
position: absolute;
top: 50%;
width: var(--slick-btn-size);
height: var(--slick-btn-size);
padding: 0;
transform: translate(0, -50%);
scale: 1;
cursor: pointer;
outline: none;
color: transparent;
z-index: 2;
overflow: hidden;
--border-offset: calc(var(--slick-btn-size) + 1rem);
transition: all 0.3s ease;
margin-top: 0;
}
.slick-prev:not(.slick-disabled):hover,
.slick-prev:not(.slick-disabled):focus,
.slick-next:not(.slick-disabled):hover,
.slick-next:not(.slick-disabled):focus {
opacity: 1;
scale: 1.2;
margin-top: 4px;
}
.slick-prev {
right: calc(var(--border-offset) + var(--slick-btn-size));
transform: rotate(-180deg) translate(0, 50%);
}
.slick-next {
right: var(--slick-btn-size);
}
.slick-disabled {
opacity: 0.4;
}
.slick-arrows-light .slick-prev,
.slick-arrows-light .slick-next {
background-image: var(--arrow-right-white);
}
.slick-arrows-dark .slick-prev,
.slick-arrows-dark .slick-next {
background-image: var(--arrow-right-primary);
}
.slick-img-slider-single-wrapper {
--min-slider-height: 20rem;
min-height: var(--min-slider-height);
}
.slick-img-slider-single,
.slick-img-slider-style {
position: absolute;
min-height: var(--min-slider-height);
}
.slick-img-slider-single img,
.slick-img-slider-style img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.slick-img-slider-single img:not(:first-child),
.slick-img-slider-style img:not(:first-child) {
display: none;
}
.slick-img-slider-single .slick-list,
.slick-img-slider-single .slick-track,
.slick-img-slider-single .slick-slide > div,
.slick-img-slider-style .slick-list,
.slick-img-slider-style .slick-track,
.slick-img-slider-style .slick-slide > div {
height: 100%;
}
.slick-img-slider-single .slick-prev,
.slick-img-slider-single .slick-next,
.slick-img-slider-style .slick-prev,
.slick-img-slider-style .slick-next {
top: 10%;
}
.slick-img-slider-single .slick-prev:not(.slick-disabled):hover,
.slick-img-slider-single .slick-prev:not(.slick-disabled):focus,
.slick-img-slider-single .slick-next:not(.slick-disabled):hover,
.slick-img-slider-single .slick-next:not(.slick-disabled):focus,
.slick-img-slider-style .slick-prev:not(.slick-disabled):hover,
.slick-img-slider-style .slick-prev:not(.slick-disabled):focus,
.slick-img-slider-style .slick-next:not(.slick-disabled):hover,
.slick-img-slider-style .slick-next:not(.slick-disabled):focus {
opacity: 1;
}
.slick-img-slider-style {
height: 100%;
width: 100%;
min-height: 20rem;
}
.slick-img-slider-style img {
height: 100%;
}
.slick-img-slider-single {
width: 100%;
height: 0;
}
.slick-img-slider-single.slick-initialized {
height: auto;
}
.slick-testimonial-style {
--slick-btn-size: 1.5rem;
--bottom-offset: -2rem;
}
.slick-testimonial-style .slick-prev,
.slick-testimonial-style .slick-next {
top: auto;
bottom: var(--bottom-offset);
}
@media screen and (min-width: 992px) {
.slick-testimonial-style {
--slick-btn-size: 2.5rem;
--bottom-offset: 0;
}
}
.admin-bar .site-header {
top: 0;
}
.page-template-template-sell-to-us .site-header,
.page-template-template-sell-list .site-header,
.page-template-template-lookup-coin .site-header,
.page-template-template-lookup-result .site-header,
.page-template-template-coin-catalog .site-header,
.page-template-template-sign-in .site-header,
.page-template-template-traderbea-id .site-header {
background-color: transparent !important;
}
.site-header {
border-bottom: 1px solid rgba(124, 58, 237, 0.188235);
position: relative;
top: 0;
left: 0;
width: 100%;
background-color: rgb(13, 5, 31) !important;
z-index: 999;
}
@media screen and (max-width: 991px) {
.site-header .navbar-collapse {
background-color: #fff;
}
.site-header .navbar-collapse a {
font-size: 0.75rem;
font-family: 'Clash Display';
color: #000;
}
.site-header .navbar-collapse a.active {
color: #000;
}
}
.site-header .mailto {
width: 22px;
height: 22px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.site-header .navbar {
--bs-navbar-toggler-border-color: transparent;
--bs-navbar-padding-y: 0;
--bs-navbar-toggler-padding-y: 0.5rem;
display: flex;
justify-content: end;
}
.site-header .navbar .nav-item .active {
font-family: 'Clash Display Bold' !important;
background: linear-gradient(
140.4deg,
#fbe67b 23.48%,
#fcfbe7 44.22%,
#f7d14e 74.77%,
#d4a041 93.57%
);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}
.navbar-ivm {
text-align: center;
}
.navbar-ivm > .nav-item {
letter-spacing: 1px;
}
.menu-main-menu-container {
width: 100%;
}
.header-logo-wrapper {
--logo-wrapper-width: 160px;
--logo-width: 80px;
width: var(--logo-wrapper-width);
}
.custom-logo-link {
display: block;
}
.custom-logo-link img {
display: block;
width: var(--logo-width);
height: auto;
-o-object-fit: contain;
object-fit: contain;
}
.navbar-ivm {
--bs-nav-link-font-weight: 300;
--bs-nav-link-padding-y: 1rem;
--bs-navbar-nav-link-padding-x: 1rem;
--arrow-left-offset: 4%;
}
.navbar-ivm > .nav-item > a {
--bs-nav-link-color: var(--clr-white);
--bs-nav-link-hover-color: var(--clr-white);
--bs-navbar-active-color: var(--clr-white);
line-height: 1;
}
.navbar-ivm .dropdown-menu {
--bs-dropdown-bg: var(--clr-brand);
--bs-dropdown-border-radius: 0;
--bs-dropdown-item-padding-y: 1rem;
--bs-dropdown-padding-x: 0;
--bs-dropdown-padding-y: 0;
--bs-dropdown-min-width: 20rem;
--bs-dropdown-item-padding-x: 1.75rem;
--bs-dropdown-link-hover-bg: var(--clr-brand-dark);
--bs-dropdown-link-hover-color: var(--clr-danger);
--bs-dropdown-link-color: var(--clr-white);
--bs-dropdown-spacer: 0.75rem;
border-top: 0;
padding-top: 1.5rem;
}
.navbar-ivm .dropdown-menu h5 {
margin-bottom: 1rem;
font-weight: 700;
font-size: 2rem;
}
.navbar-ivm .dropdown-menu ul {
padding: 0;
list-style: none;
}
.navbar-ivm .dropdown-menu li {
margin-bottom: 0.25rem;
}
.navbar-ivm .dropdown-menu::before {
content: '';
position: absolute;
top: -6px;
left: var(--arrow-left-offset);
width: 15px;
height: 15px;
background-color: var(--bs-secondary);
rotate: 45deg;
}
.navbar-ivm .dropdown-item {
line-height: 1;
}
.navbar-ivm .dropdown-item.active,
.navbar-ivm .dropdown-item:active,
.navbar-ivm .dropdown-item.hover,
.navbar-ivm .dropdown-item:hover {
color: var(--clr-white);
background-color: var(--clr-brand-dark);
}
.navbar-ivm .dropdown-toggle::after {
border: none;
background-image: url('data:image/svg+xml,');
width: 16px;
height: 16px;
background-size: 12px;
background-repeat: no-repeat;
background-position: center;
vertical-align: top;
}
@media screen and (max-width: 991px) {
.navbar-ivm .dropdown-toggle::after {
background-image: url('data:image/svg+xml,');
}
}
.navbar-ivm .navbar-expand-md .navbar-nav .nav-link {
padding-left: 1rem;
}
@media screen and (max-width: 991px) {
.navbar-nav .dropdown-menu,
.navbar-nav .nav-link {
position: relative;
}
.navbar-hb .dropdown-toggle.show::before {
left: 5%;
}
.site-header .ocean-nav-menu .navbar-collapse {
padding: 0.5rem 1rem;
border-radius: 1rem;
}
}
@media screen and (min-width: 991px) {
.navbar-ivm {
--bs-nav-link-padding-y: 1.5rem;
}
}
@media screen and (min-width: 1100px) {
.navbar-ivm {
--arrow-left-offset: 15%;
--bs-navbar-nav-link-padding-x: 1.125rem;
--bs-nav-link-font-weight: 400;
}
}
@media screen and (min-width: 1200px) {
.navbar-ivm {
--bs-navbar-nav-link-padding-x: 1.75rem;
}
.header-logo-wrapper {
--logo-wrapper-width: 260px;
--logo-width: 100%;
}
}
@media screen and (min-width: 1200px) {
.header-menu-main #menu-main-menu > li {
display: flex;
align-items: center;
justify-content: center;
}
.header-menu-main #menu-main-menu > li .dropdown-menu {
border-radius: 20px;
}
.header-menu-main .navbar-ivm > .nav-item > a {
padding-bottom: 0.7rem;
padding-top: 0.7rem;
padding-left: 1rem;
padding-right: 1rem;
text-transform: uppercase;
display: flex;
align-items: center;
}
.header-menu-main .menu-main-menu-container #menu-main-menu li a.nav-link {
font-size: 0.75rem;
font-family: 'Clash Display';
}
.header-menu-main .navbar-nav {
justify-content: center;
}
.navbar-ivm .dropdown-menu {
background: linear-gradient(
313.08deg,
#ddbd58 -24.74%,
rgba(67, 73, 54, 0) 46.01%
),
#434936;
}
.nav-item .dropdown-menu[data-bs-popper] {
margin-top: 0;
}
}
@media screen and (max-width: 1200px) {
.navbar-ivm .dropdown-menu::before {
display: none;
}
}
.inner-hero:after {
background: linear-gradient(
178.6deg,
rgba(13, 5, 32, 0) 62.35%,
#0d0520 95.89%
);
content: '';
position: absolute;
width: 100%;
height: 20rem;
z-index: 333;
bottom: 0;
top: auto;
}
@media screen and (min-width: 1200px) {
.inner-hero {
min-height: 33rem;
}
}
.header-search {
position: relative;
display: inline-block;
z-index: 9999;
}
.header-search form {
display: flex;
align-items: center;
position: relative;
}
.header-search .search-icon {
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
background: transparent;
color: #fff;
border: none;
cursor: pointer;
}
/* Hidden search box */
.header-search .search-input {
position: absolute;
top: calc(100% + 0px);
right: 0;
width: 250px;
box-sizing: border-box;
padding: 12px 15px;
background: #fff;
color: #222;
border: 1px solid #ddd;
border-radius: 3px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
font-size: 14px;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition:
opacity 0.25s ease,
visibility 0.25s ease;
z-index: 99999;
}
/* Show below the icon on hover */
.header-search:hover .search-input,
.header-search:focus-within .search-input {
opacity: 1;
visibility: visible;
pointer-events: auto;
}
.header-search .search-input:focus {
outline: none;
border-color: #aaa;
}
.navbar-toggler-icon {
background-image: var(--bs-navbar-toggler-icon-bg-white);
}
footer {
margin-top: -3rem;
}
@media screen and (min-width: 991px) {
footer > div {
border-radius: 45px 45px 0 0;
}
}
footer .logo-bottom-txt {
font-size: 0.88rem;
}
footer h5 {
font-size: 0.88rem;
letter-spacing: 3px;
}
footer #menu-quick li {
margin-bottom: 0.6rem;
}
footer #menu-quick li a {
font-size: 0.88rem;
color: rgb(226, 212, 240);
opacity: 0.5;
}
footer #menu-quick li a:hover {
opacity: 1;
}
footer .social-icons a {
width: auto;
background: #1a0a2e;
color: rgb(218, 183, 253);
border: 1px solid rgba(124, 58, 237, 0.188235);
}
footer .social-icons a:hover {
background: #1a0a2e;
color: #fff;
}
footer .bottom-footer {
border-top: rgba(124, 58, 237, 0.12549) 1px solid;
}
footer .bottom-footer a {
font-family: 'FONTSPRING DEMO - Roc Grotesk Bold';
}
footer .bottom-footer .revealize a {
color: rgb(226, 212, 240);
font-family: 'Space Grotesk';
opacity: 0.5;
}
footer .bottom-footer .revealize a:hover {
opacity: 1;
}
.testimonial-author-img {
--avatar-size: 70px;
width: var(--avatar-size);
height: var(--avatar-size);
-o-object-fit: cover;
object-fit: cover;
border-radius: 50%;
border: 2px solid var(--clr-secondary);
}
.text-warning-subtle {
color: var(--clr-gold-light);
}
body {
font-family: 'Space Grotesk';
}
.fs-20 {
font-size: 20px;
}
.lh-xs {
line-height: 0.9;
}
.text-light-purple {
color: rgba(226, 212, 240, 0.7058823529);
}
.fs-32 {
font-size: 32px;
}
.text-purple {
color: rgb(192, 132, 252);
}
.card-glow {
position: absolute;
left: 0;
-o-object-fit: contain;
object-fit: contain;
width: 30rem;
height: 30rem;
top: 0;
}
.text-purple-gradient {
background: linear-gradient(90deg, #ffffff 0%, #c084fc 100%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}
.pb-10 {
padding-bottom: 8rem !important;
}
.pt-8 {
padding-top: 6rem !important;
}
.fs-12 {
font-size: 12px !important;
}
.fs-14 {
font-size: 14px;
}
@media screen and (min-width: 991px) {
.fs-100 {
font-size: 100px;
}
}
.text-golden {
/* STORY */
font-family: 'Clash Display Semi Bold';
font-style: normal;
font-weight: 500;
/* or 62px */ /* leading-trim and text-edge are draft CSS properties. Read more: https://drafts.csswg.org/css-inline-3/#leading-trim */
leading-trim: both;
text-edge: cap; /* Gradient/Gold3 */
background: linear-gradient(
180.4deg,
#fbe67b 23.48%,
#fcfbe7 44.22%,
#f7d14e 74.77%,
#d4a041 93.57%
);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
}
.fs-24 {
font-size: 24px;
}
@media screen and (min-width: 991px) {
.mt-lg-10 {
margin-top: 8rem;
}
}
@media screen and (min-width: 991px) {
.py-lg-8 {
padding-bottom: 6rem;
padding-top: 6rem;
}
}
.z-9 {
z-index: 999;
}
.py-10 {
padding-bottom: 8rem;
padding-top: 8rem;
}
@media screen and (min-width: 991px) {
.py-lg-10 {
padding-bottom: 8rem !important;
padding-top: 8rem !important;
}
}
.btn-purple {
background-color: rgb(124, 58, 237);
}
.btn-purple:hover {
background-color: rgba(124, 58, 237, 0.945);
}
.text-gold {
color: rgb(247, 209, 78);
}
.bg-dark {
background-color: rgb(10, 3, 24) !important;
}
.bg-primary {
background-color: rgb(13, 5, 31) !important;
}
.bg-primary-dark {
background-color: rgb(18, 7, 31) !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: 'Clash Display Bold';
}
.section-title {
text-transform: uppercase;
font-size: 35px;
font-family: 'Clash Display';
line-height: 0.9;
}
@media screen and (min-width: 991px) {
.section-title {
font-size: 72px;
}
}
.section-title span {
display: block;
}
.br-2 {
border-radius: 32px;
}
.bg-blur {
background: rgba(255, 255, 255, 0.09);
}
.text-light {
color: rgba(226, 212, 240, 0.699) !important;
}
.border-warning-subtle {
border-color: var(--clr-gold-light) !important;
}
.bg-img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.pt-10 {
padding-top: 8rem;
}
.fs-32 {
font-size: 32px;
}
@media screen and (min-width: 991px) {
.fs-54 {
font-size: 54px;
}
}
@media screen and (min-width: 991px) {
.fs-120 {
font-size: 120px;
}
}
.mx-h-20 {
max-height: 20rem;
}
.inner-hero {
position: relative;
}
.breakword {
overflow-wrap: break-word;
}
.inner-hero .col-lg-7 {
container-type: inline-size;
}
.inner-hero h1.breakword {
overflow-wrap: normal;
word-break: normal;
}
@media screen and (min-width: 991px) {
.inner-hero h1.fs-120 {
font-size: min(112px, 15.5cqi);
}
}
.inner-hero-media-bg {
position: absolute;
inset: 0;
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover;
z-index: -1;
}
.hero-overlay {
position: absolute;
inset: 0;
background: linear-gradient(
270deg,
rgba(0, 0, 0, 0) 0%,
rgba(0, 0, 0, 0.6) 116.46%
),
linear-gradient(
0deg,
rgba(17, 29, 22, 0.3) 0%,
rgba(17, 29, 22, 0.3) 100%
);
z-index: 0;
}
.error-section {
position: relative;
min-height: 100vh;
}
.error-section .error-bg,
.error-section::before {
position: absolute;
inset: 0;
top: 0;
}
.error-section .error-bg {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
z-index: -1;
}
.error-section::before {
content: '';
z-index: 0;
background: linear-gradient(
242deg,
rgba(0, 0, 0, 0.02) 6.46%,
rgba(0, 0, 0, 0.8) 99.65%
),
linear-gradient(
247deg,
rgba(0, 0, 0, 0.27) 100%,
rgba(0, 0, 0, 0.74) 60.12%,
rgba(0, 0, 0, 0.83) 0%
);
}
@media screen and (min-width: 991px) {
.bg-img-lg-absolute {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.mx-h-lg-0 {
max-height: none;
}
}
.bg_overlay {
display: flex;
align-items: center;
justify-content: center;
position: relative;
isolation: isolate;
}
.bg_overlay .bg_img,
.bg_overlay .bg_content {
width: 100%;
height: 100%;
}
.bg_overlay .bg_content {
position: relative;
z-index: 1;
}
.bg_overlay .bg_img {
position: absolute;
inset: 0;
-o-object-fit: cover;
object-fit: cover;
z-index: -1;
}
.bg_overlay::before {
content: '';
position: absolute;
inset: 0;
z-index: 1;
background: linear-gradient(
133.2deg,
#000000 1.93%,
rgba(0, 0, 0, 0) 49.36%
),
linear-gradient(150deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.bg_overlay.overlay-darker::before {
background: linear-gradient(
228.23deg,
rgba(0, 0, 0, 0) 8.08%,
rgba(0, 0, 0, 0.81) 66.95%
);
}
.intro-section-title {
position: relative;
}
.intro-section-title::before {
content: '';
position: absolute;
top: 0;
left: 0;
height: 2px;
width: 50%;
background-color: #e6e6e6;
border-radius: 4px;
}
.check-list,
.arrow-list {
--top-adjust: 50%;
list-style: none;
padding: 0;
margin: 0;
}
.check-list li,
.arrow-list li {
position: relative;
padding-left: 1.25rem;
}
.check-list li::before,
.arrow-list li::before {
content: '';
position: absolute;
left: 0;
top: var(--top-adjust);
transform: translateY(-50%);
width: 14px;
height: 14px;
background-image: var(--check-icon);
background-repeat: no-repeat;
background-position: center;
}
.check-list li::before {
background-image: var(--check-icon);
}
.arrow-list li::before {
background-image: var(--arrow-icon);
}
.list-col-2 {
-moz-column-count: 2;
column-count: 2;
}
.fs-11 {
font-size: 11px;
}
.fs-60 {
font-size: 60px;
}
.border-r-1 {
border-radius: 1rem !important;
}
.left-0 {
left: 0;
}
@media screen and (min-width: 991px) {
.fs-72 {
font-size: 72px;
}
}
.text-purple-light {
color: rgb(185, 168, 202);
}
.searchresult.search {
flex: 1;
display: flex;
align-items: center;
gap: 10px;
background: rgba(255, 255, 255, 0.96);
border-radius: 999px;
padding: 0 8px 0 16px;
height: 44px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
/* Filters */
/* Panel */
/* Empty / default state */
}
.searchresult.search .search:focus-within {
outline: 2px solid var(--gold-2);
outline-offset: 2px;
}
.searchresult.search .search svg {
width: 18px;
height: 18px;
stroke: var(--muted);
fill: none;
stroke-width: 2;
flex: none;
}
.searchresult.search .search input {
flex: 1;
min-width: 0;
border: 0;
background: transparent;
outline: 0;
font: 400 14px inherit;
color: var(--ink);
}
.searchresult.search .search button {
border: 0;
cursor: pointer;
background: var(--purple);
color: #fff;
height: 32px;
padding: 0 16px;
border-radius: 999px;
font: 700 10px/1 inherit;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.searchresult.search main {
max-width: 880px;
margin: 0 auto;
padding: 8px 16px 60px;
}
.searchresult.search .chips {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 16px;
}
.searchresult.search .chip {
border: 1px solid rgba(255, 255, 255, 0.18);
background: rgba(60, 40, 120, 0.55);
color: #fff;
padding: 8px 14px;
border-radius: 999px;
cursor: pointer;
font: 700 10px/1 inherit;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.searchresult.search .chip[aria-pressed='true'] {
background: var(--purple);
border-color: var(--purple);
}
.searchresult.search .chip:focus-visible {
outline: 2px solid #fff;
outline-offset: 2px;
}
.searchresult.search .panel {
background: #fff;
border-radius: 14px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
overflow: hidden;
}
.searchresult.search .panel-head {
padding: 16px 20px;
border-bottom: 1px solid var(--line);
font-size: 12px;
font-weight: 700;
}
.searchresult.search .panel-head span {
color: var(--muted);
font-weight: 400;
}
.searchresult.search .result {
display: grid;
grid-template-columns: 1fr auto;
gap: 4px 16px;
padding: 14px 20px;
border-bottom: 1px solid var(--line);
text-decoration: none;
color: inherit;
}
.searchresult.search .result:last-child {
border-bottom: 0;
}
.searchresult.search .result:hover {
background: var(--panel);
}
.searchresult.search .result .title {
font-size: 13px;
font-weight: 700;
}
.searchresult.search .result .meta {
font-size: 10px;
color: var(--muted);
}
.searchresult.search .result .price {
grid-row: 1 / span 2;
grid-column: 2;
align-self: center;
font-weight: 700;
font-size: 14px;
}
.searchresult.search .tag {
display: inline-block;
margin-right: 6px;
padding: 2px 6px;
border-radius: 4px;
background: var(--panel);
color: var(--purple-dark);
font-size: 8px;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.searchresult.search mark {
background: var(--gold-1);
color: inherit;
border-radius: 2px;
}
.searchresult.search .empty {
padding: 36px 20px;
text-align: center;
}
.searchresult.search .empty h2 {
margin: 0 0 6px;
font-size: 16px;
}
.searchresult.search .empty p {
margin: 0 auto 16px;
max-width: 340px;
font-size: 12px;
line-height: 1.5;
color: var(--muted);
}
.searchresult.search .examples {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
}
.searchresult.search .examples button {
border: 1px solid var(--line);
background: #fff;
color: var(--ink);
padding: 8px 12px;
border-radius: 999px;
cursor: pointer;
font: 400 11px inherit;
}
.searchresult.search .examples button:hover {
background: var(--panel);
}
:root {
--book-now-height: 90px;
}
.booking-form {
margin-top: -4rem;
position: relative;
z-index: 2;
border-radius: 2rem;
overflow: hidden;
}
.booking-form select {
border: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.check-availability-wrapper {
background: rgba(0, 0, 0, 0.3);
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
}
.check-availability-wrapper button {
background-color: transparent;
border: none;
}
@media screen and (min-width: 768px) {
.border-r-md-1 {
border-right: 1px solid #f1f1f1;
}
}
@media screen and (min-width: 992px) {
.home-dine {
--margin-top: -5rem;
}
.border-r-lg-1 {
border-right: 1px solid #f1f1f1;
}
}
@media screen and (min-width: 1400px) {
.home-dine {
--margin-top: -10rem;
}
}
@media screen and (max-width: 767px) {
.booking-form {
margin-bottom: -6rem;
}
}
@media screen and (min-width: 992px) {
.home-block-1 .abs-img {
width: 58%;
}
}
.home-block-2 .page-intro-leaf {
max-width: 9rem;
}
/* Check availability */
.home .box.box-1 {
background: rgba(0, 0, 0, 0.1);
-webkit-backdrop-filter: blur(50px);
backdrop-filter: blur(50px);
}
.home .box.box-2,
.home .box.box-3,
.home .box.box-4 {
background: rgba(0, 0, 0, 0.1);
-webkit-backdrop-filter: blur(50px);
backdrop-filter: blur(50px);
border-left: 1px solid rgba(0, 0, 0, 0.4784313725);
}
.home .ui-button:focus,
.home .ui-button:hover,
.home .ui-state-focus,
.home .ui-state-hover,
.home .ui-widget-content .ui-state-focus,
.home .ui-widget-content .ui-state-hover,
.home .ui-widget-header .ui-state-focus,
.home .ui-widget-header .ui-state-hover,
.home .ui-button.ui-state-active:hover,
.home .ui-button:active,
.home .ui-state-active,
.home .ui-widget-content .ui-state-active,
.home .ui-widget-header .ui-state-active,
.home a.ui-button:active {
border: 1px solid var(--bs-primary);
background: var(--bs-primary);
}
.home .ui-datepicker .ui-widget-header {
border: 1px solid var(--bs-primary);
background: var(--bs-primary);
}
.hm-book-now {
position: absolute;
isolation: isolate;
overflow: hidden;
bottom: 0;
width: 100%;
}
.hm-book-now .box-5 {
background: var(--bs-primary) !important;
}
.hm-book-now .availability-guest-selector select {
outline: none;
background-color: transparent;
font-size: 23px;
font-weight: 700;
color: #b79d72;
border: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: url('data:image/svg+xml,')
95%/17% no-repeat;
padding: 0 2rem;
background-size: 18px;
}
.hm-book-now label span span {
color: #b79d72;
}
.hm-book-now .hm-book-now-bg {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100vh;
-o-object-fit: cover;
object-fit: cover;
z-index: -1;
}
.hm-book-now .availability-month {
font-size: 14px;
display: block;
}
.hm-book-now .availability-day {
font-size: 24px;
font-weight: 700;
}
.hm-book-now .availability-date-selector {
display: flex;
flex-direction: column;
gap: 0;
line-height: 1;
text-align: center;
padding-right: 0.5rem;
}
.hm-book-now .box {
--clr-background: transparent;
background-color: var(--clr-background);
min-height: var(--book-now-height);
-webkit-backdrop-filter: blur(9px);
backdrop-filter: blur(9px);
transition: all 0.3s ease;
}
.hm-book-now .box-1 {
--clr-background: #f9faf1;
}
.hm-book-now .box-2,
.hm-book-now .box-3,
.hm-book-now .box-4 {
--clr-background: #f9faf1;
}
.hm-book-now .box-5 {
--clr-background: var(--bs-secondary);
}
.hm-book-now .box-5:hover,
.hm-book-now .box-5:focus {
--clr-background: var(--clr-brand);
}
.select-wrapper {
height: 100%;
}
.select-wrapper select {
background-color: transparent;
font-size: 24px;
font-weight: 700;
color: var(--bs-primary);
border: none;
}
.datepicker-wrapper {
height: 100%;
position: relative;
}
.datepicker-wrapper::after {
content: '';
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
background: url('data:image/svg+xml,');
background-position: center;
background-repeat: no-repeat;
background-size: contain;
width: 1.2rem;
height: 1.2rem;
display: block;
}
@media screen and (min-width: 991px) {
:root {
--book-now-height: 90px;
}
}
.object-top {
-o-object-position: top;
object-position: top;
}
.home-slider.slider-section {
position: relative;
}
.home-slider.slider-section .slide {
height: 250px;
}
.home-slider.slider-section .slide:before {
display: none;
}
.home-slider.slider-section .slide:after {
display: none;
}
@media screen and (max-width: 991px) {
.home-slider.slider-section .slick-custom-nav-container {
display: none !important;
}
}
.home-slider.slider-section .slick-custom-nav-container .rounded-circle {
border: 0;
}
.home-slider.slider-section .slick-custom-nav-container .inner.rounded-circle {
width: 35px;
height: 35px;
background-color: #939b73;
}
.home-slider.slider-section .custom_nav-prev {
position: absolute;
top: 50%;
bottom: auto;
left: -1rem;
z-index: 9;
transform: translate(-20%, -60%);
}
.home-slider.slider-section .custom_nav-next {
position: absolute;
top: 50%;
bottom: auto;
right: -1rem;
z-index: 9;
transform: translate(20%, -60%);
}
@media screen and (min-width: 991px) {
.home-slider.slider-section .slide {
height: 450px;
}
.home-slider.slider-section .slick-custom-nav-container .rounded-circle {
border: 1px solid rgba(147, 155, 115, 0.6078431373) !important;
display: block;
}
}
@media screen and (min-width: 991px) {
.position-lg-absolute {
position: absolute;
}
}
.fw-700 {
font-weight: 700;
}
@media (min-width: 990px) {
.home1-back-img {
margin-top: -6rem;
}
}
.counter.stats {
width: 100%;
background: var(--bg);
gap: 24px;
}
@media (min-width: 990px) {
.counter .stat {
padding-right: 28px;
padding-left: 45px;
border-left: 1px solid var(--divider);
}
}
.counter .stat:first-child {
border-left: 0;
}
.counter .value {
font-family: 'Clash Display Bold' !important;
font-weight: 800;
font-size: clamp(32px, 5vw, 56px);
line-height: 1;
letter-spacing: -0.02em;
color: #fff;
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
.counter .meta {
display: flex;
font-family: 'Clash Display';
align-items: center;
gap: 14px;
margin-top: 8px;
font-size: 12px;
letter-spacing: 0.04em;
text-transform: uppercase;
color: rgb(192, 132, 252);
}
@media (max-width: 991px) {
.counter .meta {
justify-content: center;
}
}
.counter .stars {
background: linear-gradient(
135.34deg,
#8c421d 15.43%,
#fbe67b 38.47%,
#fcfbe7 53.36%,
#f7d14e 69.97%,
#d4a041 86.26%
);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
font-size: 13px;
letter-spacing: 1px;
@media (max-width: 991px) {
width: 100%;
display: block;
}
}
@media (max-width: 720px) {
.counter.stats {
grid-template-columns: 1fr 1fr;
padding: 28px 20px;
gap: 28px 16px;
}
.counter .stat {
padding: 0;
border-left: 0;
}
}
.about .img-wrap img {
max-height: 55rem;
-o-object-position: top;
object-position: top;
}
.about p em,
.about p b,
.about p strong {
color: #fff;
}
.referal-link p {
margin-bottom: 0;
}
.header-inner {
min-height: 40vh;
}
.header-inner-logo {
width: 90%;
max-width: 25rem;
}
.header-inner {
--fs-h1: 2.5rem;
}
.header-inner h1 {
font-size: var(--fs-h1);
}
.header-curve-logo {
--logo-width: 8rem;
position: absolute;
width: var(--logo-width);
bottom: -1px;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
@media screen and (min-width: 576px) {
.header-inner {
--fs-h1: 4rem;
}
}
@media screen and (min-width: 768px) {
.header-inner {
min-height: 30rem;
}
.header-curve-logo {
--logo-width: 12rem;
}
}
@media screen and (min-width: 992px) {
.header-inner {
--fs-h1: 6rem;
}
.hero-section .header-curve-logo {
bottom: 80px;
}
}
@media screen and (min-width: 1400px) {
.header-inner {
--fs-h1: 120px;
}
}
.page-template-template-about .icon-tile svg {
width: 45px;
height: 45px;
}
.about .three-blocks {
border-radius: 3rem 3rem 0 0;
}
.privacy ul,
.terms ul {
list-style-position: inside;
}
.privacy a,
.terms a {
background: linear-gradient(
140.4deg,
#fbe67b 23.48%,
#fcfbe7 44.22%,
#f7d14e 74.77%,
#d4a041 93.57%
);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}
@media screen and (min-width: 992px) {
.privacy,
.terms {
padding-top: 10rem;
}
}
.privacy h2,
.privacy h3,
.privacy h4,
.privacy h5,
.terms h2,
.terms h3,
.terms h4,
.terms h5 {
color: #fff;
text-transform: uppercase;
font-family: 'Clash Display Bold';
font-size: 24px;
}
.privacy p,
.privacy li,
.terms p,
.terms li {
color: rgb(226, 212, 240);
font-size: 18px;
font-family: 'Space Grotesk';
}
.cooking-book .story-img img {
max-height: 50rem;
}
.cta-section {
padding: 90px 0 70px;
border-bottom: 2px solid #7c3aed;
}
.cta-card {
position: relative;
border-radius: 28px;
background: rgb(45, 31, 94);
box-shadow: 0 0 0 1px rgba(167, 139, 250, 0.16);
padding: 2rem 2rem;
}
/* coin slab: separate image, overflows the card top-left */
.slab-wrap {
position: relative;
min-height: 130px;
}
.slab {
left: 0;
margin-top: -3rem;
filter: drop-shadow(0 18px 24px rgba(0, 0, 0, 0.55));
}
.slab img {
display: block;
width: 100%;
height: auto;
position: relative;
z-index: 1;
transform: scale(1.5);
}
/* CSS stand-in shown until images/coin-slab.png exists */
.slab-fallback {
position: absolute;
inset: 0;
aspect-ratio: 0.62;
border-radius: 10px;
background: linear-gradient(180deg, #f3deaa 0 24%, #3a1d78 24% 100%);
box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.35);
}
.slab-fallback::after {
content: '';
position: absolute;
left: 22%;
right: 22%;
top: 38%;
aspect-ratio: 1;
border-radius: 50%;
background: radial-gradient(
circle at 35% 30%,
#fff1b8,
#d9a441 55%,
#8a5f1c
);
box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.25);
}
.slab:not(:has(img)) {
aspect-ratio: 0.62;
}
.eyebrow {
line-height: 1;
font-weight: 400;
font-size: clamp(1rem, 1.8vw, 1.15rem);
text-transform: uppercase;
color: #fff;
margin: 0 0 0.25rem;
}
.headline {
font-weight: 400;
font-size: clamp(1.5rem, 3.4vw, 2rem);
line-height: 1.05;
text-transform: uppercase;
margin: 0 0 1rem;
background: linear-gradient(180deg, #fff3b0, #e0a92f);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.cta-text {
font-weight: 400;
font-size: 14px;
line-height: 1.6;
color: rgb(155, 143, 192);
margin: 0;
}
.logo-label {
font-size: 12px;
font-weight: 500;
letter-spacing: 0.06em;
text-transform: uppercase;
color: #fff;
margin: 0 0 0.3rem 0rem;
}
.wn-logo {
align-items: center;
gap: 0.55rem;
}
.wn-logo svg {
width: 100%;
height: 34px;
flex: none;
}
.wn-logo span {
font-family: 'Unbounded', sans-serif;
font-weight: 800;
font-size: 1.6rem;
letter-spacing: -0.04em;
color: #fffdf0;
line-height: 1;
}
.btn-follow {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.45rem;
white-space: nowrap;
padding: 0.85rem 1.35rem;
border: 0;
border-radius: 999px;
background: #fff;
color: #120626;
font-size: 0.62rem;
font-weight: 800;
text-transform: uppercase;
text-decoration: none;
transition:
transform 0.2s,
box-shadow 0.2s;
}
.btn-follow svg {
flex: none;
display: block;
}
.btn-follow:hover {
color: #120626;
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(255, 255, 255, 0.18);
}
.btn-follow:focus-visible {
outline: 2px solid #f5c96a;
outline-offset: 3px;
}
@media (max-width: 767px) {
.cta-card {
text-align: center;
}
.slab-wrap {
min-height: 150px;
margin-top: -4.5rem;
}
.slab {
margin: auto;
width: 140px;
}
.cta-text {
margin-inline: auto;
}
.logo-label {
margin-left: 0;
}
}
@media (prefers-reduced-motion: reduce) {
.btn-follow {
transition: none;
}
}
/* Move this block into your theme stylesheet if you prefer */
.bc-archive {
--bc-bg: #12062b;
--bc-card-a: #2b1359;
--bc-card-b: #1a0b3b;
--bc-line: rgba(167, 139, 250, 0.18);
--bc-muted: #bfb0e0;
--bc-gold: rgba(247, 209, 78, 1);
color: #fff;
padding: 56px 0 72px;
font-family: 'Clash Display', 'Unbounded', Arial, sans-serif;
}
.bc-wrap {
margin-inline: auto;
}
.bc-head {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
gap: 20px;
margin-bottom: 28px;
}
.bc-title {
margin: 0;
font-weight: 700;
font-size: clamp(1.9rem, 4.5vw, 3rem);
line-height: 0.95;
text-transform: uppercase;
}
.bc-title span {
display: block;
background: linear-gradient(180deg, #fff3b0, #e0a92f);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.bc-tools {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
}
.bc-search {
position: relative;
}
.bc-search input {
width: 260px;
max-width: 100%;
height: 42px;
padding: 0 44px 0 18px;
border-radius: 999px;
background: #160d2e;
border: 1px solid rgba(255, 255, 255, 0.17);
color: #fff;
box-shadow: 0 0 0 1px var(--bc-line);
font: inherit;
font-size: 0.85rem;
}
.bc-search input::-moz-placeholder {
color: var(--bc-muted);
}
.bc-search input::placeholder {
color: var(--bc-muted);
}
.bc-search input:focus,
.bc-sort select:focus {
outline: 2px solid var(--bc-gold);
outline-offset: 2px;
}
.bc-search button {
position: absolute;
right: 6px;
top: 50%;
transform: translateY(-50%);
width: 30px;
height: 30px;
border: 0;
border-radius: 50%;
background: transparent;
color: #fff;
cursor: pointer;
display: grid;
place-items: center;
}
.bc-sort select {
height: 42px;
padding: 0 36px 0 18px;
border: 0;
border-radius: 999px;
border: 0;
color: #fff;
box-shadow: 0 0 0 1px var(--bc-line);
font: inherit;
font-size: 0.85rem;
cursor: pointer;
background-color: #160d2e;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding-right: 40px;
background-image: url('data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2712%27 height=%2712%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23ffffff%27 stroke-width=%273%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27m6 9 6 6 6-6%27/%3E%3C/svg%3E') !important;
background-repeat: no-repeat;
background-position: right 12px center; /* smaller number = arrow further right */
}
.bc-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
}
.bc-card {
position: relative;
display: flex;
flex-direction: column;
padding: 12px;
border-radius: 16px;
background: linear-gradient(180deg, var(--bc-card-a), var(--bc-card-b));
box-shadow: 0 0 0 1px var(--bc-line);
transition:
transform 0.25s,
box-shadow 0.25s;
}
.bc-card:hover {
transform: translateY(-5px);
box-shadow:
0 0 0 1px rgba(167, 139, 250, 0.45),
0 16px 36px rgba(0, 0, 0, 0.4);
}
.bc-thumb {
height: 300px;
border-radius: 10px;
overflow: hidden;
display: grid;
place-items: center;
}
.bc-thumb img {
width: 100%;
height: 100%;
max-height: 300px;
-o-object-fit: contain;
object-fit: contain;
}
.bc-body {
display: flex;
flex-direction: column;
flex: 1;
padding: 16px 6px 4px;
}
.bc-name {
margin: 0 0 8px;
font-size: 22px;
font-weight: 700;
line-height: 1.15;
text-transform: uppercase;
}
.bc-name a {
color: #fff;
text-decoration: none;
}
.bc-name a:focus-visible {
outline: 2px solid #fff;
outline-offset: 3px;
}
.bc-date {
margin: 0;
font-size: 16px;
color: rgb(255, 255, 255);
opacity: 0.7;
}
.bc-foot {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: auto;
}
.bc-badge {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 0.6rem;
color: var(--bc-gold);
}
.bc-arrow {
width: 36px;
height: 36px;
border: 1px solid var(--bc-gold);
border-radius: 12px;
color: var(--bc-gold);
display: grid;
place-items: center;
transition:
background 0.2s,
color 0.2s;
}
.bc-card:hover .bc-arrow {
background: var(--bc-gold);
color: #2b1359;
}
.bc-empty {
padding: 48px 0;
text-align: center;
color: var(--bc-muted);
}
.bc-empty a {
color: var(--bc-gold);
}
.bc-pagination {
margin-top: 36px;
display: flex;
justify-content: center;
}
.bc-pagination .page-numbers {
display: inline-grid;
place-items: center;
min-width: 34px;
height: 34px;
margin: 0 3px;
padding: 0 10px;
border-radius: 9px;
background: #241046;
color: #fff;
text-decoration: none;
font-size: 0.78rem;
box-shadow: 0 0 0 1px var(--bc-line);
}
.bc-pagination .page-numbers.current {
background: #7c3aed;
}
.bc-pagination a.page-numbers:hover {
background: #3b1d72;
}
.bc-arrow::after {
content: '';
position: absolute;
inset: 0;
} /* whole card clickable, no Bootstrap needed */
.bc-results {
transition: opacity 0.2s;
}
.bc-results.is-loading {
opacity: 0.45;
pointer-events: none;
}
@media (max-width: 900px) {
.bc-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 560px) {
.bc-grid {
grid-template-columns: 1fr;
}
.bc-search input {
width: 100%;
}
.bc-search,
.bc-tools {
width: 100%;
}
}
@media (prefers-reduced-motion: reduce) {
.bc-card,
.bc-arrow {
transition: none;
}
}
.ec-wrap {
/* Move this block into your theme stylesheet if you prefer */
/* whole card clickable */
}
@media (min-width: 991px) {
.ec-wrap {
margin-top: -5rem;
z-index: 99;
position: relative;
}
}
.ec-wrap .ec-archive {
--ec-bg: #12062b;
--ec-card-a: #2b1359;
--ec-card-b: #1a0b3b;
--ec-line: rgba(167, 139, 250, 0.18);
--ec-muted: #bfb0e0;
--ec-gold: #f5c96a;
background: var(--ec-bg);
color: #fff;
padding: 48px 0 72px;
font-family: 'Clash Display', 'Unbounded', Arial, sans-serif;
}
.ec-wrap .ec-wrap {
width: min(1040px, 100% - 40px);
margin-inline: auto;
}
.ec-wrap .ec-toolbar {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 14px;
margin-bottom: 26px;
}
.ec-wrap .ec-pills {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.ec-wrap .ec-pill {
display: inline-block;
padding: 14px 22px;
border-radius: 999px;
background: #1b0d3b;
color: #fff;
text-decoration: none;
font-size: 14px;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
box-shadow: 0 0 0 1px var(--ec-line);
font-family: 'Clash Display';
transition: background 0.2s;
}
.ec-wrap .ec-pill:hover {
background: #2e1665;
color: #fff;
}
.ec-wrap .ec-pill.is-active {
background: #7c3aed;
box-shadow: none;
}
.ec-wrap .ec-pill:focus-visible {
outline: 2px solid var(--ec-gold);
outline-offset: 2px;
}
.ec-wrap .ec-search {
position: relative;
}
.ec-wrap .ec-search input {
width: 280px;
max-width: 100%;
height: 58px;
padding: 0 48px 0 20px;
border: 0;
border-radius: 999px;
background: #1b0d3b;
color: #fff;
box-shadow: 0 0 0 1px var(--ec-line);
font: inherit;
font-size: 14px;
}
.ec-wrap .ec-search input::-moz-placeholder {
color: var(--ec-muted);
}
.ec-wrap .ec-search input::placeholder {
color: var(--ec-muted);
}
.ec-wrap .ec-search input:focus {
outline: 2px solid var(--ec-gold);
outline-offset: 2px;
}
.ec-wrap .ec-search button {
position: absolute;
right: 6px;
top: 50%;
transform: translateY(-50%);
width: 28px;
height: 28px;
border: 0;
border-radius: 50%;
background: transparent;
color: #fff;
cursor: pointer;
display: grid;
place-items: center;
}
.ec-wrap .ec-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}
.ec-wrap .ec-card {
position: relative;
display: flex;
flex-direction: column;
padding: 10px;
border-radius: 14px;
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.188235) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
box-shadow: 0 0 0 1px var(--ec-line);
transition:
transform 0.25s,
box-shadow 0.25s;
}
.ec-wrap .ec-card:hover {
transform: translateY(-5px);
box-shadow:
0 0 0 1px rgba(167, 139, 250, 0.45),
0 16px 36px rgba(0, 0, 0, 0.4);
}
.ec-wrap .ec-thumb {
aspect-ratio: 1;
border-radius: 10px;
overflow: hidden;
display: grid;
place-items: center;
}
.ec-wrap .ec-thumb img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.ec-wrap .ec-body {
display: flex;
flex-direction: column;
flex: 1;
padding: 16px 6px 4px;
}
.ec-wrap .ec-name {
margin: 0 0 8px;
font-size: 16px;
font-weight: 800;
line-height: 1.15;
text-transform: uppercase;
}
.ec-wrap .ec-name a {
color: #fff;
text-decoration: none;
}
.ec-wrap .ec-name a:focus-visible {
outline: 2px solid #fff;
outline-offset: 3px;
}
.ec-wrap .ec-date {
margin: 0;
font-size: 0.6rem;
color: var(--ec-muted);
}
.ec-wrap .ec-foot {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: auto;
padding-top: 18px;
}
.ec-wrap .ec-badge {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 0.55rem;
color: var(--ec-gold);
}
.ec-wrap .ec-arrow {
width: 36px;
height: 36px;
border: 1px solid var(--ec-gold);
border-radius: 7px;
color: var(--ec-gold);
display: grid;
place-items: center;
transition:
background 0.2s,
color 0.2s;
}
.ec-wrap .ec-arrow::after {
content: '';
position: absolute;
inset: 0;
}
.ec-wrap .ec-card:hover .ec-arrow {
background: var(--ec-gold);
color: #2b1359;
}
.ec-wrap .ec-results {
transition: opacity 0.2s;
}
.ec-wrap .ec-results.is-loading {
opacity: 0.45;
pointer-events: none;
}
.ec-wrap .ec-empty {
padding: 48px 0;
text-align: center;
color: var(--ec-muted);
}
.ec-wrap .ec-empty a {
color: var(--ec-gold);
}
.ec-wrap .ec-pagination {
margin-top: 36px;
display: flex;
justify-content: center;
}
.ec-wrap .ec-pagination .page-numbers {
display: inline-grid;
place-items: center;
min-width: 34px;
height: 34px;
margin: 0 3px;
padding: 0 10px;
border-radius: 9px;
background: #241046;
color: #fff;
text-decoration: none;
font-size: 0.78rem;
box-shadow: 0 0 0 1px var(--ec-line);
}
.ec-wrap .ec-pagination .page-numbers.current {
background: #7c3aed;
}
.ec-wrap .ec-pagination a.page-numbers:hover {
background: #3b1d72;
}
@media (max-width: 900px) {
.ec-wrap .ec-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 560px) {
.ec-wrap .ec-grid {
grid-template-columns: 1fr;
}
.ec-wrap .ec-search,
.ec-wrap .ec-search input {
width: 100%;
}
}
@media (prefers-reduced-motion: reduce) {
.ec-wrap .ec-card,
.ec-wrap .ec-arrow,
.ec-wrap .ec-pill,
.ec-wrap .ec-results {
transition: none;
}
}
.banner-img {
max-height: 40rem;
}
.home .site-header {
position: absolute;
background-color: transparent !important;
}
.right-top-coin {
position: absolute;
right: 10%;
z-index: 9;
top: 10%;
}
.center-coin {
position: absolute;
right: 40%;
z-index: 9;
top: 50%;
}
.bottom-rightmost-coin {
position: absolute;
right: 10%;
z-index: 9;
bottom: 20%;
}
.bottom-right-coin {
position: absolute;
right: 40%;
z-index: 9;
bottom: 20%;
}
.top-center-coin {
position: absolute;
left: 40%;
top: 15%;
z-index: 9;
}
.left-coin,
.bottom-coin {
position: absolute;
z-index: 9;
}
.left-coin {
position: absolute;
left: 0;
top: 25%;
}
.bottom-coin {
bottom: 20%;
left: 25%;
}
.theme-page {
position: relative;
overflow: hidden;
color: #fff;
background: #080313;
}
/* =========================
VIDEO BACKGROUND
========================= */
.epic-bg-video {
position: fixed;
inset: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
z-index: 0;
}
.epic-bg-overlay {
position: fixed;
inset: 0;
background: linear-gradient(
180deg,
rgba(8, 2, 30, 0.38) 0%,
rgba(20, 5, 43, 0.58) 55%,
rgba(5, 2, 15, 0.82) 100%
);
z-index: 1;
}
/* =========================
CONTENT
========================= */
.theme-content {
position: relative;
z-index: 2;
margin: 0 auto;
padding: 55px 0 35px;
}
/* =========================
HEADING
========================= */
.epic-heading {
text-align: center;
margin-bottom: 25px;
}
.epic-heading h1 {
margin: 0;
line-height: 0.95;
font-weight: 900;
letter-spacing: -2px;
}
.yellow-heading {
background: linear-gradient(90deg, #f2bf33 0%, #ffe066 50%, #d9a626 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}
.epic-heading > span {
display: block;
margin-top: 5px;
letter-spacing: 2px;
text-transform: uppercase;
opacity: 0.55;
}
.epic-heading h2 {
font-weight: 500;
}
.epic-heading p {
margin: 0 auto;
line-height: 1.5;
color: rgba(255, 255, 255, 0.6);
}
/* =========================
FORM CONTAINER
========================= */
.epic-form {
width: 100%;
padding: 35px;
border-radius: 17px;
border: 1px solid rgba(124, 58, 237, 0.188235);
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.188235) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
box-shadow:
0 15px 50px rgba(0, 0, 0, 0.35),
inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
/* =========================
FORM SECTION
========================= */
.epic-form-section {
padding: 3px 0 10px;
}
.epic-form-section label {
display: block;
font-family: 'Clash Display Bold' !important;
margin-bottom: 7px;
font-size: 24px;
font-weight: 700;
}
.epic-input-row {
display: flex;
gap: 8px;
}
.epic-input-row input {
flex: 1;
min-width: 0;
padding: 0 14px;
border: 1px solid rgba(255, 255, 255, 0.16);
-webkit-backdrop-filter: blur(54.8269px);
backdrop-filter: blur(54.8269px);
border-radius: 20px;
outline: none;
background: rgba(255, 255, 255, 0.07);
color: #fff;
font-size: 0.85rem;
font-family: 'Space Grotesk' !important;
}
.epic-input-row input:focus {
border-color: rgba(213, 151, 255, 0.4);
background: rgba(255, 255, 255, 0.1);
}
.epic-input-row input::-moz-placeholder {
color: rgba(255, 255, 255, 0.3);
opacity: 0.3;
}
.epic-input-row input::placeholder {
color: rgba(255, 255, 255, 0.3);
opacity: 0.3;
}
/* =========================
BUTTON
========================= */
.epic-btn {
flex-shrink: 0;
padding: 8px 18px;
border: 0;
border-radius: 40px;
background: linear-gradient(135deg, #6e2da0, #43146d);
font-family: 'Clash Display Bold' !important;
color: #fff;
font-size: 20px;
font-weight: 800;
text-transform: uppercase;
cursor: pointer;
transition:
transform 0.2s ease,
background 0.2s ease,
box-shadow 0.2s ease;
}
.epic-btn:hover {
transform: translateY(-1px);
background: linear-gradient(135deg, #8141b5, #55207d);
box-shadow: 0 5px 20px rgba(89, 25, 130, 0.35);
}
/* =========================
MULTIPLE CERTIFICATES
========================= */
.epic-multiple {
margin-top: 40px;
}
.epic-multiple h3,
.epic-form-section h3 {
margin: 0 0 5px;
font-size: 24px;
font-weight: 700;
}
.epic-multiple p,
.epic-form-section p {
margin: 0 0 8px;
font-size: 16px;
line-height: 1.5;
color: rgba(255, 255, 255, 0.55);
}
.epic-multiple textarea {
display: block;
width: 100%;
min-height: 180px;
resize: vertical;
padding: 12px;
border: 1px solid rgba(255, 255, 255, 0.16);
-webkit-backdrop-filter: blur(54.8269px);
backdrop-filter: blur(54.8269px);
border-radius: 8px;
outline: none;
background: rgba(255, 255, 255, 0.055);
color: #fff;
font-family: 'Space Grotesk' !important;
font-size: 14px;
}
.epic-multiple textarea::-moz-placeholder {
color: rgba(255, 255, 255, 0.193) !important;
}
.epic-multiple textarea::placeholder {
color: rgba(255, 255, 255, 0.193) !important;
}
/* =========================
HELP LINK
========================= */
.epic-help {
display: inline-block;
font-family: 'Space Grotesk' !important;
margin-top: 8px;
color: rgb(192, 132, 252);
font-size: 16px;
text-decoration: none;
}
.epic-help:hover {
color: #fff;
}
.cert-help {
margin-top: 14px;
}
.cert-help summary {
cursor: pointer;
font-family: 'Space Grotesk' !important;
color: rgb(192, 132, 252);
font-size: 16px;
font-weight: 500;
}
.cert-help summary:hover {
color: #fff;
}
.cert-help ul {
list-style: none;
margin: 16px 0 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 20px;
}
.cert-help p {
margin: 0 0 8px;
color: rgba(255, 255, 255, 0.82);
font-size: 14px;
line-height: 1.5;
}
.cert-help strong {
color: #fff;
}
.cert-help img {
display: block;
width: 100%;
max-width: 28rem;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, 0.16);
}
/* =========================
NO CERT
========================= */
.epic-form-section {
padding: 30px;
border-radius: 14px;
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.188235) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
}
/* =========================
LOGIN TEXT
========================= */
.epic-login-text {
margin-top: 28px;
text-align: center;
font-family: 'Space Grotesk' !important;
font-size: 18px;
color: rgba(255, 255, 255, 0.5);
}
.epic-login-text a {
color: rgb(192, 132, 252);
text-decoration: underline;
}
/* =========================
FOOTER
========================= */
.epic-footer {
position: relative;
z-index: 2;
margin-top: 35px;
background: rgba(5, 1, 17, 0.94);
border-radius: 35px 35px 0 0;
}
.epic-footer-inner {
width: min(100% - 50px, 1000px);
margin: 0 auto;
padding: 38px 0 25px;
display: grid;
grid-template-columns: 2fr 1fr 1fr 1fr;
gap: 35px;
}
.epic-footer-brand {
font-size: 10px;
}
.epic-logo {
margin-bottom: 10px;
color: #e9b92c;
font-size: 24px;
font-weight: 800;
}
.epic-footer-brand p {
max-width: 200px;
margin: 0 0 30px;
color: rgba(255, 255, 255, 0.45);
font-size: 8px;
line-height: 1.5;
}
.epic-footer-brand small {
color: rgba(255, 255, 255, 0.3);
font-size: 7px;
}
.epic-footer-column {
display: flex;
flex-direction: column;
gap: 8px;
}
.epic-footer-column h4 {
margin: 0 0 7px;
font-size: 8px;
}
.epic-footer-column a {
color: rgba(255, 255, 255, 0.45);
font-size: 8px;
text-decoration: none;
}
.epic-footer-column a:hover {
color: #fff;
}
/* =========================
FOOTER BOTTOM
========================= */
.epic-footer-bottom {
width: min(100% - 50px, 1000px);
margin: 0 auto;
padding: 15px 0 20px;
border-top: 1px solid rgba(255, 255, 255, 0.05);
display: flex;
align-items: center;
justify-content: space-between;
}
.epic-social {
display: flex;
gap: 7px;
}
.epic-social a {
padding: 5px 11px;
border-radius: 15px;
background: rgba(92, 33, 122, 0.35);
color: rgba(255, 255, 255, 0.7);
font-size: 7px;
text-decoration: none;
}
.epic-footer-bottom > span {
color: rgba(255, 255, 255, 0.3);
font-size: 7px;
}
/* =========================
MOBILE
========================= */
@media (max-width: 600px) {
.theme-content {
width: min(100% - 24px, 650px);
padding-top: 40px;
}
.sell-list .theme-content {
padding-top: 20px;
}
.epic-heading h1 {
font-size: 44px;
}
.epic-input-row {
flex-direction: column;
}
.epic-input-row input {
width: 100%;
height: 48px;
min-height: 48px;
}
.epic-btn {
width: 100%;
min-height: 48px;
font-size: 16px;
line-height: 1.2;
}
.epic-footer-inner {
grid-template-columns: 1fr 1fr;
gap: 30px 20px;
}
.epic-footer-brand {
grid-column: 1/-1;
}
.epic-footer-bottom {
flex-direction: column;
gap: 15px;
}
.epic-social {
flex-wrap: wrap;
justify-content: center;
}
}
@media (min-width: 991px) {
.max-width-wrap {
max-width: 1016px;
margin: auto;
}
}
.chase-page {
/* =========================================
SINGLE CHASE
========================================= */
/* =========================================
HEADER
========================================= */
/* =========================================
STATS
========================================= */
/* =========================================
REDEMPTION LOOKUP
========================================= */
/* =========================================
SECTIONS
========================================= */
/* =========================================
BASE COINS
========================================= */
/* =========================================
CERTIFIED TABLE
========================================= */
/* =========================================
CONTENT
========================================= */
/* =========================================
RESPONSIVE
========================================= */
}
.chase-page .single-chase {
color: #ffffff;
}
.chase-page .chase-container {
width: min(1200px, 100% - 40px);
margin: 0 auto;
}
.chase-page .chase-header {
padding-bottom: 70px;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.chase-page .chase-label,
.chase-page .section-eyebrow,
.chase-page .lookup-label {
display: block;
font-size: 12px;
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
color: #c7a8ff;
margin-bottom: 15px;
}
.chase-page .chase-header h1 {
margin: 0;
font-size: clamp(45px, 7vw, 90px);
line-height: 0.95;
font-weight: 700;
letter-spacing: -3px;
}
.chase-page .chase-date {
margin-top: 20px;
color: rgba(255, 255, 255, 0.6);
font-size: 15px;
}
.chase-page .chase-description {
max-width: 700px;
margin-top: 30px;
font-size: 18px;
line-height: 1.7;
color: rgba(255, 255, 255, 0.7);
}
.chase-page .chase-stats {
display: grid;
grid-template-columns: repeat(3, 1fr);
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
background: #1a1035;
border: 1px solid #372157;
border-radius: 20px;
}
.chase-page .chase-stat {
padding: 45px 35px;
}
.chase-page .chase-stat:first-child > div {
padding-left: 0;
}
.chase-page .chase-stat:last-child > div {
border-right: 0;
}
.chase-page .stat-number {
display: block;
font-size: 48px;
line-height: 1;
font-weight: 700;
margin-bottom: 12px;
}
.chase-page .stat-label {
font-size: 11px;
letter-spacing: 2px;
color: rgb(155, 143, 192);
}
.chase-page .redemption-lookup {
margin: 70px 0;
padding: 45px 50px;
background: #21113f;
border: 1px solid #372157;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 40px;
}
.chase-page .lookup-content h2 {
margin: 0 0 10px;
font-size: 30px;
}
.chase-page .lookup-content p {
margin: 0;
color: rgba(255, 255, 255, 0.6);
}
.chase-page .lookup-button {
display: inline-flex;
align-items: center;
gap: 18px;
padding: 16px 24px;
background: #ffffff;
color: #171020;
text-decoration: none;
font-size: 12px;
font-weight: 700;
letter-spacing: 1px;
white-space: nowrap;
transition: 0.25s ease;
}
.chase-page .lookup-button:hover {
background: #c7a8ff;
color: #171020;
}
.chase-page .lookup-button span {
font-size: 18px;
}
.chase-page .chase-section {
margin-top: 100px;
}
.chase-page .section-heading {
display: flex;
align-items: flex-start;
gap: 30px;
margin-bottom: 40px;
}
.chase-page .section-heading > span {
font-size: 13px;
color: #c7a8ff;
padding-top: 8px;
}
.chase-page .section-heading h2 {
margin: 0;
font-size: 38px;
line-height: 1;
}
.chase-page .base-coins-list {
border-top: 1px solid rgba(255, 255, 255, 0.15);
}
.chase-page .base-coin-row {
display: grid;
grid-template-columns: 80px 1fr 100px;
align-items: center;
min-height: 75px;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.chase-page .coin-number {
color: #c7a8ff;
font-size: 12px;
}
.chase-page .coin-description {
font-size: 16px;
}
.chase-page .coin-quantity {
text-align: right;
color: rgba(255, 255, 255, 0.55);
font-size: 14px;
}
.chase-page .certified-table {
border: 1px solid #372157;
border-radius: 20px;
}
.chase-page .certified-table-header,
.chase-page .certified-table-row {
display: grid;
grid-template-columns: 180px 160px 1fr 110px;
gap: 20px;
align-items: center;
}
.chase-page .certified-table-header {
min-height: 55px;
border-radius: 20px 20px 0 0;
font-size: 10px;
background-color: #21113f;
font-weight: 700;
letter-spacing: 1.5px;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.chase-page .certified-table-row {
min-height: 75px;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.chase-page .cert-number {
font-weight: 700;
}
.chase-page .cert-service {
color: #c7a8ff;
font-size: 13px;
}
.chase-page .cert-description {
color: rgba(255, 255, 255, 0.7);
}
.chase-page .cert-lookup a {
color: #ffffff;
text-decoration: none;
font-size: 11px;
font-weight: 700;
letter-spacing: 1px;
}
.chase-page .cert-lookup a:hover {
color: #c7a8ff;
}
.chase-page .chase-content {
margin-top: 100px;
max-width: 800px;
color: rgba(255, 255, 255, 0.7);
line-height: 1.7;
}
.chase-page .chase-content h2,
.chase-page .chase-content h3 {
color: #ffffff;
}
@media (max-width: 768px) {
.chase-page {
/* Stats */
/* Lookup */
/* Sections */
/* Base coins */
/* Certified table */
}
.chase-page .single-chase {
padding: 60px 0 80px;
}
.chase-page .chase-container {
width: min(100% - 30px, 1200px);
}
.chase-page .chase-header {
padding-bottom: 45px;
}
.chase-page .chase-header h1 {
font-size: 48px;
letter-spacing: -2px;
}
.chase-page .chase-stats {
grid-template-columns: 1fr;
}
.chase-page .chase-stat,
.chase-page .chase-stat:first-child {
padding: 25px 0;
border-right: 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.chase-page .chase-stat:last-child {
border-bottom: 0;
}
.chase-page .stat-number {
font-size: 38px;
}
.chase-page .redemption-lookup {
margin: 50px 0;
padding: 30px;
flex-direction: column;
align-items: flex-start;
}
.chase-page .lookup-content h2 {
font-size: 25px;
}
.chase-page .chase-section {
margin-top: 70px;
}
.chase-page .section-heading h2 {
font-size: 30px;
}
.chase-page .base-coin-row {
grid-template-columns: 50px 1fr 70px;
}
.chase-page .certified-table-header {
display: none;
}
.chase-page .certified-table-row {
display: block;
padding: 25px 0;
}
.chase-page .certified-table-row > div {
display: flex;
justify-content: space-between;
gap: 20px;
padding: 7px 0;
}
.chase-page .certified-table-row > div::before {
content: attr(data-label);
flex-shrink: 0;
color: rgba(255, 255, 255, 0.4);
font-size: 10px;
font-weight: 700;
letter-spacing: 1px;
}
.chase-page .cert-description {
text-align: right;
}
.chase-page .cert-lookup {
text-align: right;
}
}
.single-hero .single-hero-img {
max-height: 30rem;
border-radius: 2rem;
border: 1px solid #372157;
padding: 0.5rem;
}
.livenow {
background: rgb(124, 58, 237);
border-radius: 25px;
}
.past-drops-section {
/* Past Drops */
/* Featured card */
/* Artwork (CSS stand-in for the photo) */
/* Archive header */
/* Mobile */
}
.past-drops-section .drops {
padding-top: 48px;
padding-bottom: 56px;
}
.past-drops-section .head {
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
margin-bottom: 28px;
}
.past-drops-section .head .btn {
flex-shrink: 0;
padding: 0.7rem 1.8rem;
font-size: 14px;
letter-spacing: 0.04em;
}
.past-drops-section .pill {
display: inline-flex;
align-items: center;
background: var(--pill);
color: #fff;
border: 0;
border-radius: 999px;
padding: 12px 22px;
font-stretch: 120%;
text-transform: uppercase;
letter-spacing: 0.02em;
text-decoration: none;
cursor: pointer;
}
.past-drops-section .pill:hover {
background: #2c1255;
}
.past-drops-section .pill:focus-visible,
.past-drops-section input:focus-visible,
.past-drops-section select:focus-visible {
outline: 2px solid var(--gold);
outline-offset: 2px;
}
.past-drops-section .card {
display: grid;
grid-template-columns: 1fr 1.05fr;
gap: 40px;
align-items: center;
padding: 30px;
border-radius: 32px;
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.188235) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
border: 1px solid rgba(124, 58, 237, 0.188235);
}
.past-drops-section .drops:has(.past-drop-card) {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
}
.past-drops-section .drops:has(.past-drop-card) .head {
grid-column: 1 / -1;
margin-bottom: 4px;
}
.past-drops-section .card.past-drop-card {
grid-template-columns: 132px minmax(0, 1fr);
gap: 16px;
align-items: center;
padding: 14px;
border-radius: 20px;
}
.past-drops-section .past-drop-media {
width: 132px;
height: 132px;
border-radius: 14px;
overflow: hidden;
background: #12081f;
}
.past-drops-section .past-drop-media img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.past-drops-section .past-drop-card h3 {
margin: 8px 0 6px;
font-size: 18px;
line-height: 1.15;
}
.past-drops-section .past-drop-card .stats {
margin: 0 0 12px;
}
.past-drops-section .past-drop-card .stat b {
font-size: 20px;
}
.bertchase .story-img {
border-radius: 20px;
overflow: hidden;
}
.bertchase .story-img img {
border-radius: 20px;
display: block;
}
.past-drops-section .badge {
display: inline-block;
background: #7c3aed;
box-shadow: 0px 2px 8px rgba(124, 58, 237, 0.501961);
border-radius: 6px;
padding: 5px 10px 3px 10px;
font-size: 12px;
font-family: 'Space Grotesk' !important;
text-transform: uppercase;
}
.past-drops-section .pub {
font-size: 12px;
margin-left: 10px;
}
.past-drops-section h3 {
margin: 18px 0 12px;
font-size: clamp(24px, 3vw, 30px);
font-weight: 800;
text-transform: uppercase;
letter-spacing: -0.01em;
}
.past-drops-section .desc {
font-size: 16px;
line-height: 1.3;
font-family: 'Space Grotesk' !important;
margin: 0 0 24px;
font-stretch: 100%;
}
.past-drops-section .stats {
display: flex;
gap: 20px;
margin-bottom: 26px;
}
.past-drops-section .stat {
padding-right: 20px;
border-right: 1px solid rgba(255, 255, 255, 0.1333333333);
}
.past-drops-section .stat:last-child {
border: 0;
}
.past-drops-section .stat b {
display: block;
font-weight: 800;
}
.past-drops-section .stat span {
font-weight: 700;
text-transform: uppercase;
color: #a78bfa;
}
.past-drops-section .art {
position: relative;
aspect-ratio: 1.28;
border-radius: 22px;
overflow: hidden;
background: radial-gradient(
circle at 20% 15%,
#e9ddc5 0 10%,
transparent 30%
),
radial-gradient(circle at 85% 20%, #c9b48a 0 12%, transparent 32%),
radial-gradient(circle at 50% 100%, #b08a4a 0 38%, transparent 40%),
linear-gradient(135deg, #d8cdb6, #8f7a55);
}
.past-drops-section .coin {
position: absolute;
border-radius: 50%;
box-shadow:
inset -4px -4px 8px rgba(0, 0, 0, 0.4),
0 6px 12px rgba(0, 0, 0, 0.3333333333);
}
.past-drops-section .c1 {
width: 22%;
aspect-ratio: 1;
left: -3%;
top: 14%;
border: 6px solid #8b6b2e;
background: radial-gradient(
rgba(191, 227, 240, 0.6666666667),
rgba(106, 141, 154, 0.3333333333)
);
}
.past-drops-section .c2 {
width: 20%;
aspect-ratio: 1;
right: -2%;
top: 6%;
border: 6px solid #6b5a3a;
background: radial-gradient(#efe6cf, #b9a577);
}
.past-drops-section .c3 {
width: 7%;
aspect-ratio: 1;
left: 6%;
bottom: 22%;
background: #5f9a3b;
}
.past-drops-section .c4 {
width: 6%;
aspect-ratio: 1;
right: 22%;
top: 32%;
background: #d83a3a;
}
.past-drops-section .c5 {
width: 9%;
aspect-ratio: 1;
right: 6%;
bottom: 16%;
background: #e8b923;
border-radius: 30%;
}
.past-drops-section .logo {
position: absolute;
inset: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
line-height: 0.82;
transform: rotate(-3deg);
}
.past-drops-section .logo i {
font-style: normal;
font-weight: 900;
font-stretch: 90%;
color: var(--gold);
text-shadow:
0 3px 0 #8a4a00,
2px 2px 0 #5a2a00;
-webkit-text-stroke: 2px #5a2a00;
paint-order: stroke fill;
}
.past-drops-section .o {
font-size: clamp(28px, 5vw, 60px);
}
.past-drops-section .b {
font-size: clamp(46px, 8vw, 100px);
position: relative;
}
.past-drops-section .b::before {
content: '';
position: absolute;
left: -8%;
right: -8%;
top: -6%;
height: 34%;
background: #c3262b;
transform: skewY(-4deg);
z-index: -1;
border-radius: 4px;
}
.past-drops-section .ch {
font-size: clamp(46px, 8vw, 100px);
}
.past-drops-section .archive {
padding-top: 32px;
padding-bottom: 80px;
border-top: 1px solid rgba(255, 255, 255, 0.0509803922);
}
.past-drops-section .archive .head {
align-items: flex-end;
}
.past-drops-section h2.big {
font-size: clamp(34px, 5vw, 56px);
line-height: 0.95;
}
.past-drops-section h2.big em {
display: block;
font-style: normal;
color: var(--gold);
}
.past-drops-section .tools {
display: flex;
gap: 12px;
}
.past-drops-section input,
.past-drops-section select {
background: var(--pill);
border: 1px solid rgba(255, 255, 255, 0.0784313725);
border-radius: 999px;
color: #fff;
padding: 11px 18px;
font-stretch: 100%;
}
.past-drops-section input {
width: clamp(140px, 22vw, 170px);
}
@media (max-width: 760px) {
.past-drops-section .drops:has(.past-drop-card) {
grid-template-columns: 1fr;
}
.past-drops-section .card {
grid-template-columns: 1fr;
gap: 8px;
}
.past-drops-section .info {
padding: 16px 12px 8px;
}
.past-drops-section .desc,
.past-drops-section .badge,
.past-drops-section .pub,
.past-drops-section .stat span {
font-size: 12px;
}
.past-drops-section .desc {
font-size: 13px;
}
.past-drops-section .stat b {
font-size: 17px;
}
.past-drops-section .head {
flex-wrap: wrap;
}
.past-drops-section .archive .head {
align-items: flex-start;
flex-direction: column;
}
.past-drops-section .tools {
width: 100%;
}
.past-drops-section input {
flex: 1;
}
}
.upc-scanner a {
color: rgba(250, 230, 16, 0.588);
text-decoration: underline;
}
.upc-scanner .section-title .text-golden {
font-family: 'Clash Display' !important;
}
.leaderboards {
/* Tabs */
/* Leaderboard panel */
/* Badges */
}
.leaderboards .board {
margin: 0 auto;
padding: 40px 16px 64px;
}
.leaderboards .tabs {
display: flex;
justify-content: center;
gap: 8px;
flex-wrap: wrap;
}
.leaderboards .tab {
border: 0;
border-radius: 999px;
background: rgb(33, 16, 57);
color: rgb(185, 168, 202);
padding: 9px 16px;
font-size: 16px;
font-stretch: 115%;
cursor: pointer;
font-family: 'Clash Display' !important;
}
.leaderboards .tab:hover {
color: #fff;
}
.leaderboards .tab.is-active {
background: rgb(124, 58, 237);
color: #fff;
}
.leaderboards .tab:focus-visible {
outline: 2px solid var(--gold);
outline-offset: 2px;
}
.leaderboards .note {
margin: 16px 0 14px;
text-align: center;
font-size: 16px;
color: rgb(185, 168, 202);
font-stretch: 100%;
}
.leaderboards .rows {
list-style: none;
margin: 0;
padding: 0;
border-radius: 24px;
overflow: hidden;
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.12549) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
border: 1px solid rgba(124, 58, 237, 0.188235);
}
.leaderboards .user-img {
border: rgb(195, 198, 212) 1px solid;
border-radius: 50%;
height: 50px;
padding: 0;
overflow: hidden;
}
.leaderboards .yellow-border {
border-color: rgb(247, 209, 78);
}
.leaderboards .purple-border {
border-color: rgb(192, 132, 252);
}
.leaderboards .row {
display: grid;
grid-template-columns: 28px 50px 1fr auto;
align-items: center;
gap: 10px;
padding: 20px 30px 20px 30px;
border-top: 1px solid var(--line);
}
.leaderboards .row:first-child {
border-top: 0;
background: rgba(124, 58, 237, 0.0705882);
}
.leaderboards .rank {
font-size: 24px;
font-weight: 800;
text-align: center;
color: rgb(142, 122, 165);
}
.leaderboards .row:nth-child(1) .rank {
color: rgb(247, 209, 78);
}
.leaderboards .row:nth-child(1) .user-img {
border-color: rgb(247, 209, 78);
}
.leaderboards .av {
width: 30px;
height: 30px;
border-radius: 50%;
border: 2px solid #6d5bd0;
background: radial-gradient(
circle at 35% 30%,
#8fb4ff,
#4b3aa8 60%,
#1a0f4a
);
position: relative;
}
.leaderboards .av::after {
content: '';
position: absolute;
inset: 8px;
background: #cfe1ff;
clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
opacity: 0.9;
}
.leaderboards .row:nth-child(1) .av {
border-color: var(--gold);
}
.leaderboards .row:nth-child(3) .av {
border-color: var(--bronze);
}
.leaderboards .who b {
display: block;
font-size: 22px;
font-weight: 800;
line-height: 1;
font-family: 'Clash Display' !important;
color: #fff;
}
.leaderboards .who span {
display: block;
margin-top: 3px;
font-size: 14px;
color: #7c6c9a;
font-weight: 600;
}
.leaderboards .val {
text-align: right;
}
.leaderboards .val b {
display: block;
font-size: 30px;
font-family: 'Clash Display Bold' !important;
line-height: 1;
color: #fff;
}
.leaderboards .row:nth-child(1) .val b {
color: rgb(247, 209, 78);
}
.leaderboards .val span {
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
color: #7c6c9a;
}
.leaderboards .earn {
margin-top: 20px;
padding: 20px 18px 24px;
border-radius: 20px;
background: #150925;
border: 1px solid var(--line);
}
.leaderboards .earn h3 {
margin: 0 0 16px 6px;
font-weight: 800;
}
.leaderboards .badges {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 8px 52px;
}
@media (min-width: 991px) {
.leaderboards .badges {
grid-template-columns: 1fr 1fr;
}
}
.leaderboards .bd {
display: flex;
align-items: center;
gap: 8px;
}
.leaderboards .bd > .desc {
padding: 1rem;
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.12549) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
border: 1px solid rgba(124, 58, 237, 0.188235);
border-radius: 20px;
width: 100%;
}
.leaderboards .bd b {
display: block;
font-size: 20px;
color: #fff;
font-weight: 800;
line-height: 1;
margin-bottom: 0.5rem;
}
.leaderboards .bd span {
display: block;
margin-top: 3px;
margin-bottom: 0;
font-size: 14px;
color: rgb(185, 168, 202);
font-stretch: 100%;
line-height: 1;
}
.leaderboards .ico {
flex: none;
width: 24px;
height: 24px;
border-radius: 50%;
border: 2px solid;
position: relative;
background: #1d0b36;
}
.leaderboards .ico::after {
content: '';
position: absolute;
inset: 5px;
background: #9fb8ff;
clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.leaderboards .t-member {
border-color: #a99bd9;
}
.leaderboards .t-bronze {
border-color: var(--bronze);
}
.leaderboards .t-silver {
border-color: #c9d3e6;
}
.leaderboards .t-gold {
border-color: var(--gold);
}
@media (max-width: 480px) {
.leaderboards .badges {
grid-template-columns: 1fr;
}
.leaderboards .row {
padding: 12px 14px 12px 10px;
}
}
.leaderboards .bottom-text {
border-top: rgba(124, 58, 237, 0.19) 1px solid;
}
.gallery .card {
/* Special Core coin */
box-sizing: border-box; /* Auto layout */
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 16px 8px 20px;
gap: 16px;
height: 356px;
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.188235) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
border: 1px solid rgba(124, 58, 237, 0.188235);
border-radius: 32px; /* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;
}
.gallery .card .img-wrap {
height: 14rem;
margin-bottom: 1rem;
}
.collections .tabs {
display: flex;
gap: 8px;
margin-bottom: 28px;
}
.collections .tab {
border: 0;
border-radius: 999px;
background: rgb(33, 16, 57);
color: rgb(185, 168, 202);
padding: 11px 22px;
cursor: pointer;
}
.collections .tab:hover {
color: #fff;
}
.collections .tab.is-active {
background: rgb(124, 58, 237);
color: #fff;
}
.collections .tab:focus-visible {
outline: 2px solid var(--gold);
outline-offset: 2px;
}
.collections .grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 16px;
}
.collections .cc {
padding: 18px 18px 22px;
border-radius: 22px;
min-height: 146px;
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.188235) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
border: 1px solid rgba(124, 58, 237, 0.188235);
}
.collections .cc-head {
display: flex;
align-items: center;
gap: 10px;
padding-bottom: 14px;
border-bottom: rgba(124, 58, 237, 0.19) 1px solid;
}
.collections .av {
flex: none;
width: 45px;
height: 45px;
border-radius: 50%;
border: 2px solid #6d5bd0;
position: relative;
background: radial-gradient(
circle at 35% 30%,
#8fb4ff,
#4b3aa8 60%,
#1a0f4a
);
}
.collections .av::after {
position: absolute;
inset: 6px;
background: #cfe1ff;
opacity: 0.9;
clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.collections .who {
flex: 1;
min-width: 0;
}
.collections .who b {
display: block;
font-size: 16px;
font-weight: 800;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 1;
}
.collections .who span {
display: block;
margin-top: 0px;
font-size: 13px;
color: rgb(185, 168, 202);
font-weight: 600;
}
.collections .count {
font-size: 13px;
color: rgb(185, 168, 202);
font-weight: 600;
white-space: nowrap;
}
.collections .count b {
color: #fff;
font-weight: 800;
font-size: 13px;
}
.collections .coins {
list-style: none;
margin: 14px 0 0;
padding: 0;
display: grid;
gap: 9px;
}
.collections .coins li {
display: flex;
align-items: center;
gap: 8px;
min-width: 0;
}
.collections .coin {
flex: none;
width: 20px;
height: 20px;
border-radius: 50%;
box-shadow: inset -1px -1px 2px rgba(0, 0, 0, 0.3333333333);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.collections .coins span {
font-size: 14px;
font-weight: 700;
color: rgb(185, 168, 202);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-stretch: 100%;
}
@media (max-width: 860px) {
.collections .grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 560px) {
.collections .grid {
grid-template-columns: 1fr;
}
.collections .who b {
font-size: 13px;
}
.collections .who span,
.collections .count,
.collections .count b {
font-size: 9px;
}
.collections .coins span {
font-size: 11px;
}
.collections .coin {
width: 14px;
height: 14px;
}
}
.lookup-result {
/* Title + meta */
/* Offer badge */
/* Actions */
/* Another cert */
}
.lookup-result .lookup {
margin: 0 auto;
}
.lookup-result .back {
display: inline-block;
margin: 0 0 16px 4px;
font-size: 16px;
font-weight: 600;
text-decoration: none;
font-stretch: 100%;
}
.lookup-result .back:hover {
text-decoration: underline;
}
.lookup-result .panel {
padding: 26px 26px 22px;
border-radius: 26px;
border: 1px solid var(--line);
color: #fff;
}
.lookup-result .top {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 24px;
padding-bottom: 30px;
border-bottom: 1px solid var(--line);
}
.lookup-result h1 {
margin: 0 0 20px;
max-width: 26ch;
line-height: 1.2;
font-weight: 800;
letter-spacing: -0.01em;
color: #fff;
}
.lookup-result .meta {
display: grid;
grid-template-columns: 76px 1fr;
gap: 10px 0;
margin: 0;
font-size: 16px;
}
.lookup-result .meta dt {
color: rgba(226, 212, 240, 0.72);
font-weight: 500;
}
.lookup-result .meta dd {
margin: 0;
font-weight: 800;
color: #fff;
}
.lookup-result .meta dd:last-of-type {
color: #fff;
}
.lookup-result .offer {
height: 9rem;
/* max-height: 100%; */
flex-direction: column;
align-items: center;
width: 260px;
padding: 14px 14px 12px;
border-radius: 18px;
color: #1a1200;
background: linear-gradient(
140.4deg,
#fbe67b 23.48%,
#fcfbe7 44.22%,
#f7d14e 74.77%,
#d4a041 93.57%
);
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4);
}
.lookup-result .offer-label {
font-size: 12px;
color: rgb(0, 0, 0);
font-weight: 800;
text-transform: uppercase;
font-family: 'Clash Display Bold' !important;
}
.lookup-result .offer-price {
margin: 8px 0 6px;
font-size: 38px;
font-weight: 900;
font-stretch: 100%;
letter-spacing: -0.02em;
line-height: 1;
}
.lookup-result .offer-note {
font-size: 13px;
font-weight: 500;
font-stretch: 100%;
}
.lookup-result .actions {
display: flex;
align-items: center;
flex-wrap: nowrap;
gap: 16px;
padding: 26px 0;
border-top: 1px rgba(124, 58, 237, 0.13) solid;
border-bottom: 1px rgba(124, 58, 237, 0.13) solid;
}
.lookup-result .actions form,
.lookup-result .actions .btn-added {
display: flex;
margin: 0;
width: auto;
flex: 0 0 auto;
order: 1;
}
.lookup-result .actions .btn-ghost {
flex: 0 0 auto;
order: 2;
}
.lookup-result .btn {
border: 0;
border-radius: 999px;
padding: 12px 18px;
font-size: 15px;
font-weight: 700;
font-stretch: 100%;
text-transform: none;
color: #fff;
cursor: pointer;
transition: background 0.15s;
}
.lookup-result .btn-added {
border: 1px solid rgb(167, 139, 250);
color: rgb(196, 181, 253);
background: transparent;
cursor: default;
}
.lookup-result .btn-ghost {
background: transparent;
border: 1px solid rgba(255, 255, 255, 0.1882352941);
}
.lookup-result .btn-purple {
background-color: rgb(124, 58, 237);
}
.lookup-result .btn-ghost:hover {
background: rgba(255, 255, 255, 0.062745098);
}
.lookup-result .btn-dark {
background: #3a1a73;
}
.lookup-result .btn-dark:hover {
background: #4b2399;
}
.lookup-result .actions .link {
margin-left: 8px;
flex: 0 0 auto;
white-space: nowrap;
font-size: 15px;
font-weight: 700;
color: rgb(218, 183, 253);
text-decoration: none;
}
.lookup-result .link:hover {
text-decoration: underline;
}
.lookup-result .btn:focus-visible,
.lookup-result .link:focus-visible,
.lookup-result .back:focus-visible,
.lookup-result input:focus-visible {
outline: 2px solid #f5d76e;
outline-offset: 2px;
}
.lookup-result .another {
padding: 24px 0 18px;
}
.lookup-result .another label {
display: block;
margin-bottom: 12px;
font-weight: 800;
color: #fff;
}
.lookup-result .error {
margin: 10px 0 0 6px;
font-size: 8px;
color: #ff8f8f;
}
.lookup-result .fine {
margin: 0;
font-size: 13px;
line-height: 1.5;
color: rgba(226, 212, 240, 0.78);
font-stretch: 100%;
}
@media (max-width: 620px) {
.lookup-result .top {
flex-direction: column-reverse;
}
.lookup-result .offer {
width: 100%;
max-width: 220px;
}
.lookup-result .meta {
font-size: 12px;
}
.lookup-result .back,
.lookup-result .link,
.lookup-result .fine,
.lookup-result .error {
font-size: 11px;
}
.lookup-result .actions {
flex-wrap: wrap;
}
.lookup-result .another label {
font-size: 12px;
}
.lookup-result input {
font-size: 12px;
}
.lookup-result .row {
flex-direction: column;
}
}
.theme-input {
padding: 0.8rem 20px;
width: 100%;
min-width: 0;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.16);
background: rgba(255, 255, 255, 0.0509803922);
color: #fff !important;
font-stretch: 100%;
}
.theme-input::-webkit-input-placeholder,
.theme-input::-moz-placeholder,
.theme-input::placeholder {
color: rgba(226, 212, 240, 0.7) !important;
opacity: 1;
}
.theme-input {
transition:
border-color 0.2s ease,
background-color 0.2s ease,
box-shadow 0.2s ease;
}
.theme-input:hover:not(:focus):not([readonly]):not(:disabled) {
border-color: rgba(192, 132, 252, 0.35);
}
.theme-input:focus,
.theme-input:focus-visible {
outline: none;
border-color: rgba(192, 132, 252, 0.85);
background: rgba(124, 58, 237, 0.12);
box-shadow:
0 0 0 4px rgba(124, 58, 237, 0.22),
0 8px 24px rgba(76, 29, 149, 0.35);
}
.sell-list-address {
/* Nav */
/* Layout */
/* Form */
/* Preview result */
}
.sell-list-address nav {
position: relative;
display: flex;
align-items: center;
gap: 28px;
flex-wrap: wrap;
padding: 14px 5vw;
border-bottom: 1px dashed var(--line);
background: rgba(8, 4, 28, 0.55);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
font:
700 9px/1 Syne,
sans-serif;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.sell-list-address nav .logo {
margin-right: auto;
font:
800 17px/1 Syne,
sans-serif;
text-transform: none;
letter-spacing: 0;
color: var(--gold);
}
.sell-list-address nav a {
color: var(--text);
text-decoration: none;
opacity: 0.85;
}
.sell-list-address nav a.on {
color: var(--gold);
opacity: 1;
}
.sell-list-address nav a.cta {
background: var(--btn);
border: 1px solid var(--line);
border-radius: 99px;
padding: 8px 14px;
}
.sell-list-address main {
position: relative;
max-width: 820px;
margin: 0 auto;
padding: 56px 20px 80px;
}
.sell-list-address h1 {
margin: 0 0 8px;
font:
800 clamp(30px, 5vw, 42px) / 1.05 Syne,
sans-serif;
letter-spacing: -0.01em;
}
.sell-list-address .lede {
margin: 0 0 28px;
color: var(--muted);
}
.sell-list-address .card {
margin-bottom: 20px;
padding: 26px;
border: 1px solid var(--line);
border-radius: 18px;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
}
.sell-list-address h2 {
margin: 0 0 4px;
}
.sell-list-address .hint {
margin: 0 0 14px;
color: var(--muted);
font-size: 11px;
}
.sell-list-address label {
display: block;
margin: 0 0 5px;
color: var(--muted);
font-size: 10px;
font-weight: 600;
}
.sell-list-address textarea,
.sell-list-address input {
width: 100%;
padding: 11px 14px;
border: 1px solid var(--line);
border-radius: 12px;
color: var(--text);
}
.sell-list-address textarea {
min-height: 110px;
resize: vertical;
font-family: ui-monospace, Menlo, monospace;
}
.sell-list-address ::-moz-placeholder {
color: rgba(255, 255, 255, 0.35);
}
.sell-list-address ::placeholder {
color: rgba(255, 255, 255, 0.35);
}
.sell-list-address :focus-visible {
outline: 2px solid var(--gold);
outline-offset: 2px;
}
.sell-list-address button {
margin-top: 16px;
padding: 10px 18px;
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 99px;
color: var(--text);
font:
700 10px Syne,
sans-serif;
letter-spacing: 0.05em;
text-transform: uppercase;
cursor: pointer;
}
.sell-list-address button:hover {
background: #3a1c8a;
}
.sell-list-address .grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 14px 18px;
}
.sell-list-address .three {
display: grid;
grid-template-columns: 2fr 1fr 1fr;
gap: 14px 18px;
margin-top: 14px;
}
.sell-list-address .row {
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
margin-top: 22px;
padding-top: 16px;
border-top: 1px solid var(--line);
}
.sell-list-address .row small {
display: block;
color: var(--muted);
font-size: 10px;
}
.sell-list-address .row b {
font-weight: 700;
}
.sell-list-address .price {
font:
800 32px/1 Syne,
sans-serif;
color: var(--gold);
white-space: nowrap;
}
@media (max-width: 620px) {
.sell-list-address .grid,
.sell-list-address .three {
grid-template-columns: 1fr;
}
.sell-list-address nav {
gap: 14px;
}
.sell-list-address .card {
padding: 20px;
}
}
.sell-request-submit {
/* Success banner */
/* Buttons */
/* Slip */
}
.sell-request-submit .banner {
margin: auto;
padding: 3rem 3rem;
text-align: center;
border-radius: 14px;
background: linear-gradient(
140.4deg,
#fbe67b 23.48%,
#fcfbe7 44.22%,
#f7d14e 74.77%,
#d4a041 93.57%
);
border: 1px solid rgba(124, 58, 237, 0.188235);
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
}
@media (min-width: 991px) {
.sell-request-submit .banner {
width: 70%;
padding: 3rem 7rem;
}
}
.sell-request-submit .banner .badge {
width: 52px;
height: 52px;
margin: -2px auto 6px;
border-radius: 50%;
background: rgb(0, 0, 0);
display: grid;
place-items: center;
}
.sell-request-submit .banner .badge svg {
width: 26px;
height: 26px;
fill: linear-gradient(
140.4deg,
#fbe67b 23.48%,
#fcfbe7 44.22%,
#f7d14e 74.77%,
#d4a041 93.57%
);
}
.sell-request-submit .banner h1 {
margin: 0 0 6px;
font-size: 24px;
font-weight: 700;
letter-spacing: -0.02em;
color: rgb(0, 0, 0);
}
.sell-request-submit .banner p {
margin: 0;
font-size: 10px;
line-height: 1.4;
color: rgb(0, 0, 0);
}
.sell-request-submit .actions {
display: flex;
justify-content: center;
gap: 10px;
margin: 50px 0;
}
.sell-request-submit .btn {
border: 0;
cursor: pointer;
padding: 10px 16px;
border-radius: 999px;
font: 700 9px/1 inherit;
letter-spacing: 0.06em;
text-transform: uppercase;
color: #fff;
}
.sell-request-submit .btn.primary {
background: var(--purple);
}
.sell-request-submit .btn.secondary {
background: rgba(60, 40, 120, 0.7);
border: 1px solid rgba(255, 255, 255, 0.12);
}
.sell-request-submit .btn:focus-visible {
outline: 2px solid #fff;
outline-offset: 2px;
}
.sell-request-submit .slip {
max-width: 860px;
margin: 0 auto;
background: #fff;
border-radius: 22px;
padding: 36px 40px 28px;
box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
color: #130820;
}
.sell-request-submit .head {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 24px;
padding-bottom: 22px;
border-bottom: 1px solid #ece7f4;
}
.sell-request-submit .head h2 {
margin: 0;
font-size: 22px;
color: #130820;
font-weight: 700;
letter-spacing: -0.02em;
font-family: 'Clash Display Bold' !important;
}
.sell-request-submit .head .sub {
margin: 6px 0 0;
font-size: 14px;
color: #6d657f;
}
.sell-request-submit .conf {
text-align: right;
}
.sell-request-submit .conf small {
display: block;
font-size: 12px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #8a829b;
}
.sell-request-submit .conf strong {
display: block;
margin-top: 2px;
font-size: 36px;
font-weight: 700;
line-height: 1;
color: #7c3aed;
font-family: 'Clash Display Bold' !important;
letter-spacing: 0.01em;
}
.sell-request-submit .conf span {
display: block;
margin-top: 4px;
font-size: 13px;
color: #6d657f;
}
.sell-request-submit .barcode {
margin: 22px auto 8px;
width: min(420px, 70%);
text-align: center;
}
.sell-request-submit .barcode .bars {
height: 42px;
border-radius: 4px;
background: repeating-linear-gradient(
90deg,
#130820 0 2px,
transparent 2px 4px,
#130820 4px 5px,
transparent 5px 8px,
#130820 8px 11px,
transparent 11px 13px
);
}
.sell-request-submit .barcode span {
display: block;
margin-top: 6px;
font-size: 12px;
color: #8a829b;
letter-spacing: 0.16em;
}
.sell-request-submit hr {
border: 0;
border-top: 1px solid #ece7f4;
margin: 18px 0 22px;
}
.sell-request-submit .addresses {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 14px;
}
.sell-request-submit .address-card {
padding: 16px 18px;
border-radius: 14px;
background: #f7f5fb;
font-size: 14px;
line-height: 1.45;
color: #5c546e;
}
.sell-request-submit .address-card span {
display: block;
}
.sell-request-submit .label {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #8a829b;
margin-bottom: 8px;
font-family: 'Clash Display Bold' !important;
}
.sell-request-submit .addresses b {
display: block;
margin-bottom: 4px;
font-weight: 700;
font-size: 16px;
color: #130820;
}
.sell-request-submit .payment {
margin: 14px 0 22px;
padding: 16px 18px;
border-radius: 14px;
background: linear-gradient(180deg, #f8f4ff 0%, #f3eefe 100%);
border: 1px solid #eadffb;
font-size: 15px;
color: #3d3550;
}
.sell-request-submit .payment b {
color: #130820;
}
.sell-request-submit .payment p {
margin: 0;
}
.sell-request-submit .payment .pay-line {
font-size: 16px;
color: #130820;
}
.sell-request-submit .payment .note {
margin-top: 6px;
font-size: 13px;
color: #6d657f;
}
.sell-request-submit table {
width: 100%;
border-collapse: collapse;
font-size: 14px;
}
.sell-request-submit th {
text-align: left;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #8a829b;
padding: 0 0 10px;
border-bottom: 1px solid #ece7f4;
}
.sell-request-submit td {
padding: 12px 0;
border-bottom: 1px solid #f1edf6;
color: #130820;
font-size: 14px;
}
.sell-request-submit th:last-child,
.sell-request-submit td:last-child {
text-align: right;
}
.sell-request-submit td.item {
font-weight: 700;
color: #130820;
}
.sell-request-submit .totals {
display: flex;
justify-content: space-between;
align-items: baseline;
font-size: 14px;
padding: 12px 0 0;
color: #6d657f;
}
.sell-request-submit .totals.total {
margin-top: 8px;
padding-top: 12px;
border-top: 1px solid #ece7f4;
color: #130820;
font-weight: 700;
font-size: 18px;
font-family: 'Clash Display Bold' !important;
}
.sell-request-submit .totals.total span:last-child {
font-size: 22px;
color: #7c3aed;
}
.sell-request-submit .fine {
margin-top: 18px;
padding-top: 14px;
border-top: 1px solid #f1edf6;
font-size: 13px;
line-height: 1.55;
color: #6d657f;
}
.sell-request-submit .fine p {
margin: 0;
}
.sell-request-submit .fine p + p {
margin-top: 4px;
}
@media (max-width: 720px) {
.sell-request-submit .slip {
padding: 24px 18px;
}
.sell-request-submit .head,
.sell-request-submit .addresses {
grid-template-columns: 1fr;
display: grid;
}
.sell-request-submit .conf {
text-align: left;
}
}
.sell-request-submit .slip-edit-modal {
width: min(860px, calc(100% - 32px));
max-height: calc(100vh - 48px);
padding: 0;
border: none;
outline: none;
background: transparent;
overflow: visible;
}
.sell-request-submit .slip-edit-modal:focus,
.sell-request-submit .slip-edit-modal:focus-visible {
outline: none;
}
.sell-request-submit .slip-edit-modal::backdrop {
background: rgba(8, 2, 18, 0.78);
}
.sell-request-submit .slip-edit {
position: relative;
margin: 0;
padding: 28px 22px 22px;
border-radius: 17px;
background: #fff;
color: #130820;
}
.sell-request-submit .slip-edit-close {
position: absolute;
top: 12px;
right: 12px;
width: 36px;
height: 36px;
border: 0;
border-radius: 999px;
background: #f3eefe;
color: #6d28d9;
font-size: 22px;
line-height: 1;
cursor: pointer;
}
.sell-request-submit .slip-edit h2 {
margin: 0 0 6px;
font-size: 22px;
}
.sell-request-submit .slip-edit > p {
margin: 0 0 16px;
color: #6d657f;
}
.sell-request-submit .slip-edit-note {
margin: 0 0 14px;
color: #047857;
font-weight: 700;
}
.sell-request-submit .slip-saved-banner {
max-width: 860px;
margin: 0 auto 16px;
padding: 12px 16px;
border-radius: 12px;
background: #fff;
}
.sell-request-submit .slip-edit-note.is-error {
color: #be123c;
}
.sell-request-submit .slip-adjust-row {
display: grid;
grid-template-columns: minmax(0, 1.4fr) 140px 120px auto;
gap: 10px;
align-items: end;
margin-bottom: 10px;
}
.sell-request-submit .slip-adjust-row label,
.sell-request-submit .sign-field {
display: flex;
flex-direction: column;
gap: 4px;
font-size: 12px;
font-weight: 700;
color: #6d657f;
}
.sell-request-submit .slip-adjust-row input {
height: 42px;
padding: 0 12px;
border: 1px solid #eadffb;
border-radius: 12px;
background: #fff;
color: #130820;
font-size: 14px;
}
.sell-request-submit .sign-picker {
position: relative;
}
.sell-request-submit .sign-picker-trigger {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
width: 100%;
height: 42px;
padding: 0 12px;
border: 1px solid #eadffb;
border-radius: 12px;
background: #fff;
color: #130820;
font-size: 14px;
font-weight: 700;
cursor: pointer;
}
.sell-request-submit .sign-picker.is-open .sign-picker-trigger,
.sell-request-submit .sign-picker-trigger:hover {
border-color: #c4b5fd;
}
.sell-request-submit .sign-picker-chevron {
width: 12px;
height: 8px;
flex: 0 0 auto;
transition: transform 0.15s ease;
}
.sell-request-submit .sign-picker.is-open .sign-picker-chevron {
transform: rotate(180deg);
}
.sell-request-submit .sign-picker-menu {
position: absolute;
z-index: 20;
top: calc(100% + 6px);
left: 0;
right: 0;
margin: 0;
padding: 6px;
list-style: none;
border: 1px solid #eadffb;
border-radius: 12px;
background: #fff;
box-shadow: 0 14px 30px rgba(19, 8, 32, 0.12);
}
.sell-request-submit .sign-picker-menu[hidden] {
display: none;
}
.sell-request-submit .sign-picker-menu button {
display: flex;
align-items: center;
gap: 8px;
width: 100%;
padding: 8px 10px;
border: 0;
border-radius: 8px;
background: transparent;
color: #130820;
font-size: 14px;
font-weight: 700;
text-align: left;
cursor: pointer;
}
.sell-request-submit .sign-picker-menu button::before {
content: "";
width: 8px;
height: 8px;
border-radius: 50%;
background: #e11d48;
flex: 0 0 auto;
}
.sell-request-submit .sign-picker-menu button[data-value="plus"]::before {
background: #059669;
}
.sell-request-submit .sign-picker-menu button:hover,
.sell-request-submit .sign-picker-menu button[aria-selected="true"] {
background: #f3eefe;
}
.sell-request-submit .slip-adjust-remove {
height: 42px;
padding: 0 12px;
border: 0;
border-radius: 12px;
background: #f3eefe;
color: #6d28d9;
font-weight: 700;
cursor: pointer;
}
.sell-request-submit .slip-edit-actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 8px;
}
.sell-list .preview-actions .btn-edit {
display: inline-flex;
align-items: center;
justify-content: center;
height: 42px;
padding: 0 16px;
border: 1px solid rgba(167, 139, 250, 0.55);
border-radius: 999px;
background: transparent;
color: #fff;
font-weight: 800;
text-decoration: none;
}
.sell-list .preview-actions .btn-edit:hover {
background: rgba(124, 58, 237, 0.35);
color: #fff;
}
@media (max-width: 720px) {
.sell-request-submit .slip-adjust-row {
grid-template-columns: 1fr;
}
}
@media print {
.sell-request-submit .banner,
.sell-request-submit .actions,
.sell-request-submit .slip-edit,
.sell-request-submit .slip-edit-modal,
.sell-request-submit .slip-saved-banner {
display: none;
}
.sell-request-submit .slip {
box-shadow: none;
}
}
.lookup-error {
margin: 0 0 16px;
color: #ff8f8f;
font-weight: 700;
}
.epic-multiple .cert-limit-error {
display: block;
margin: 12px 0 0;
padding: 12px 14px;
border: 1px solid rgba(255, 143, 143, 0.7);
border-radius: 12px;
background: rgba(180, 40, 40, 0.55);
color: #ffe4e4;
font-size: 16px;
font-weight: 800;
}
.epic-multiple .cert-limit-error[hidden] {
display: none;
}
.lookup-result .purple-flag,
.coin-catalog .purple-flag {
display: inline-block;
margin-left: 8px;
padding: 2px 10px;
border-radius: 999px;
background: #7c3aed;
color: #fff;
font-size: 13px;
font-weight: 800;
letter-spacing: 0.04em;
text-transform: uppercase;
vertical-align: middle;
}
.lookup-result .added-note,
.lookup-result .offer-note-copy,
.coin-catalog .offer-note-copy {
color: rgba(226, 212, 240, 0.8);
}
.lookup-result .match-list {
list-style: none;
margin: 18px 0 8px;
padding: 0;
}
.lookup-result .match-list li {
display: flex;
justify-content: space-between;
gap: 16px;
align-items: center;
padding: 14px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.lookup-result .match-list a {
color: #fff;
text-decoration: none;
}
.lookup-result .match-title,
.lookup-result .match-cert {
display: block;
}
.lookup-result .match-cert {
color: rgba(226, 212, 240, 0.7);
font-size: 14px;
}
.lookup-result .match-price {
color: #f7d14e;
font-weight: 800;
white-space: nowrap;
}
body.page-template-template-sell-list {
background: #080313;
}
.sell-list,
.sell-list h1,
.sell-list h2 {
color: #fff;
}
.sell-list .max-width-wrap {
max-width: none;
width: 100%;
}
.sell-list .theme-content {
padding-top: 0;
}
.sell-list .dash {
display: grid;
grid-template-columns: 220px minmax(0, 1fr);
gap: 18px;
align-items: start;
margin-top: 0;
}
.sell-list .preview-icon {
position: relative;
order: 2;
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
padding: 0;
border: 1px solid rgba(147, 51, 234, 0.45);
border-radius: 999px;
background: linear-gradient(
236.19deg,
rgba(124, 58, 237, 0.38) 4.95%,
rgba(76, 29, 149, 0.13) 86.85%
);
color: #fff;
cursor: pointer;
}
.sell-list .preview-icon svg {
width: 18px;
height: 18px;
}
.sell-list .preview-icon .icon-close,
.sell-list.is-preview .preview-icon .icon-open {
display: none;
}
.sell-list.is-preview .preview-icon .icon-close {
display: block;
}
.sell-list .preview-tip {
position: absolute;
left: 50%;
bottom: calc(100% + 8px);
z-index: 5;
transform: translateX(-50%);
padding: 6px 10px;
border: 1px solid rgba(167, 139, 250, 0.5);
border-radius: 8px;
background: #1a0a2e;
color: #fff;
font-size: 12px;
font-weight: 700;
white-space: nowrap;
opacity: 0;
visibility: hidden;
pointer-events: none;
}
.sell-list .preview-icon:hover .preview-tip,
.sell-list .preview-icon:focus-visible .preview-tip {
opacity: 1;
visibility: visible;
}
.sell-list.is-preview .preview-tip.tip-open,
.sell-list:not(.is-preview) .preview-tip.tip-close {
display: none;
}
.sell-list.is-preview .dash-lead,
.sell-list.is-preview .dash-nav,
.sell-list.is-preview .dash-tabs,
.sell-list.is-preview .catalog-note {
display: none;
}
.sell-list.is-preview .dash {
grid-template-columns: minmax(0, 1fr);
margin-top: 0;
}
.sell-list.is-preview .container,
.sell-list.is-preview .max-width-wrap {
max-width: none;
width: 100%;
}
.sell-list .dash-nav {
display: flex;
flex-direction: column;
gap: 8px;
padding: 12px;
border-radius: 17px;
border: 1px solid rgba(124, 58, 237, 0.19);
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.19) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
}
.sell-list .dash-nav a {
display: block;
padding: 12px 14px;
border-radius: 12px;
color: rgba(226, 212, 240, 0.86);
font-weight: 700;
text-decoration: none;
}
.sell-list .dash-nav a.on,
.sell-list .dash-nav a:hover {
background: rgba(124, 58, 237, 0.4);
color: #fff;
}
.sell-list .dash.is-tabs {
grid-template-columns: minmax(0, 1fr);
}
.sell-list .dash-main.is-loading {
opacity: 0.45;
pointer-events: none;
}
.sell-list .dash-tabs {
display: inline-flex;
gap: 4px;
width: fit-content;
margin: 0;
padding: 4px;
border: 1px solid rgba(167, 139, 250, 0.35);
border-radius: 999px;
background: rgba(26, 10, 46, 0.72);
}
.sell-list .dash-tabs a {
display: inline-flex;
align-items: center;
justify-content: center;
height: 42px;
padding: 0 18px;
border-radius: 999px;
color: rgba(226, 212, 240, 0.86);
font-weight: 700;
text-decoration: none;
white-space: nowrap;
}
.sell-list .dash-tabs a.on,
.sell-list .dash-tabs a:hover {
background: linear-gradient(
236.19deg,
rgba(124, 58, 237, 0.85) 4.95%,
rgba(76, 29, 149, 0.72) 86.85%
);
color: #fff;
}
.sell-list .chase-admin-tools {
display: flex;
flex-wrap: wrap;
gap: 8px;
align-items: center;
margin: 18px 0 20px;
}
.sell-list .chase-admin-tools form {
margin: 0;
}
.sell-list .chase-admin-tools .btn,
.sell-list .chase-admin-tools a.btn {
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
height: 42px;
margin: 0;
padding: 0 18px;
border: 0;
border-radius: 999px;
background: linear-gradient(236deg, #7c3aed 5%, #5b21b6 90%);
color: #fff;
font-size: 13px;
font-weight: 700;
letter-spacing: 0.04em;
line-height: 1;
text-decoration: none;
order: 0;
}
.sell-list .chase-admin-tools .btn:hover,
.sell-list .chase-admin-tools a.btn:hover {
background: linear-gradient(236deg, #8b5cf6 5%, #6d28d9 90%);
color: #fff;
}
.sell-list .chase-manage {
display: grid;
grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
gap: 16px;
align-items: start;
}
.sell-list .chase-manage-list,
.sell-list .chase-edit,
.sell-list .chase-edit-empty {
padding: 14px;
border: 1px solid rgba(167, 139, 250, 0.28);
border-radius: 18px;
background: rgba(12, 4, 24, 0.45);
}
.sell-list .chase-search {
align-items: center;
}
.sell-list .chase-search input {
height: 42px;
}
.sell-list .chase-search .btn {
height: 42px;
padding: 0 16px;
flex: 0 0 auto;
}
.sell-list .chase-manage-list .catalog-count {
margin: 12px 2px 8px;
}
.sell-list .chase-manage-list ul {
list-style: none;
margin: 0;
padding: 0 0 8px;
max-height: 560px;
overflow: auto;
}
.sell-list .chase-manage-list a {
display: grid;
grid-template-columns: 48px minmax(0, 1fr);
gap: 10px;
align-items: center;
margin-bottom: 6px;
padding: 8px;
border: 1px solid transparent;
border-radius: 12px;
color: #fff;
text-decoration: none;
}
.sell-list .chase-manage-list a.on,
.sell-list .chase-manage-list a:hover {
border-color: rgba(167, 139, 250, 0.55);
background: rgba(124, 58, 237, 0.28);
color: #fff;
}
.sell-list .chase-manage-list img,
.sell-list .chase-thumb-empty {
width: 48px;
height: 48px;
border-radius: 10px;
object-fit: cover;
background: #12081f;
}
.sell-list .chase-manage-list strong,
.sell-list .chase-manage-list small {
display: block;
}
.sell-list .chase-manage-list strong {
font-size: 14px;
line-height: 1.25;
}
.sell-list .chase-manage-list small {
margin-top: 3px;
color: rgba(226, 212, 240, 0.7);
font-size: 12px;
}
.sell-list .chase-edit {
display: flex;
flex-direction: column;
gap: 14px;
}
.sell-list .chase-edit h3 {
margin: 0;
color: #fff;
font-size: 20px;
line-height: 1.2;
}
.sell-list .chase-fields {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px 14px;
}
.sell-list .chase-edit label {
display: flex;
flex-direction: column;
gap: 6px;
margin: 0;
color: rgba(226, 212, 240, 0.78);
font-size: 12px;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.sell-list .chase-edit .chase-wide {
grid-column: 1 / -1;
}
.sell-list .chase-edit .chase-picker {
position: relative;
width: 100%;
text-transform: none;
letter-spacing: 0;
font-weight: 500;
}
.sell-list .chase-edit .chase-picker-native {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
overflow: hidden;
clip: rect(0 0 0 0);
pointer-events: none;
}
.sell-list .chase-edit .chase-picker-trigger {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
height: 46px;
margin: 0;
padding: 0 14px;
border: 1px solid rgba(255, 255, 255, 0.16);
border-radius: 12px;
background: #160828;
color: #fff;
font-size: 15px;
font-weight: 500;
letter-spacing: 0;
line-height: 1;
text-transform: none;
cursor: pointer;
}
.sell-list .chase-edit .chase-picker-trigger:hover,
.sell-list .chase-edit .chase-picker.is-open .chase-picker-trigger {
border-color: rgba(167, 139, 250, 0.75);
}
.sell-list .chase-edit .chase-picker-chevron {
width: 12px;
height: 8px;
flex: 0 0 auto;
transition: transform 0.15s ease;
}
.sell-list .chase-edit .chase-picker.is-open .chase-picker-chevron {
transform: rotate(180deg);
}
.sell-list .chase-edit .chase-picker-menu {
position: absolute;
z-index: 30;
top: calc(100% + 6px);
left: 0;
right: 0;
margin: 0;
padding: 6px;
list-style: none;
border: 1px solid rgba(167, 139, 250, 0.35);
border-radius: 14px;
background: #241038;
box-shadow: 0 18px 40px rgba(8, 2, 20, 0.55);
}
.sell-list .chase-edit .chase-picker-menu[hidden] {
display: none;
}
.sell-list .chase-edit .chase-picker-menu li {
margin: 0;
padding: 0;
}
.sell-list .chase-edit .chase-picker-menu button {
display: block;
width: 100%;
margin: 0;
padding: 10px 12px;
border: 0;
border-radius: 10px;
background: transparent;
color: #fff;
font-size: 15px;
font-weight: 500;
letter-spacing: 0;
line-height: 1.2;
text-align: left;
text-transform: none;
cursor: pointer;
}
.sell-list .chase-edit .chase-picker-menu button:hover,
.sell-list .chase-edit .chase-picker-menu button[aria-selected="true"] {
background: rgba(124, 58, 237, 0.4);
}
.sell-list .chase-edit .theme-input,
.sell-list .chase-edit select.theme-input {
height: 46px;
min-height: 46px;
padding: 0 14px;
border-radius: 12px;
background: #160828;
color-scheme: dark;
font-size: 15px;
text-transform: none;
letter-spacing: 0;
font-weight: 500;
}
.sell-list .chase-edit textarea.theme-input {
height: auto;
min-height: 110px;
padding: 12px 14px;
border-radius: 12px;
resize: vertical;
}
.sell-list .chase-admin .theme-input,
.sell-list .chase-admin textarea.theme-input,
.sell-list .chase-admin .chase-picker-trigger {
outline: none;
}
.sell-list .chase-admin .theme-input:focus,
.sell-list .chase-admin .theme-input:focus-visible,
.sell-list .chase-admin textarea.theme-input:focus,
.sell-list .chase-admin textarea.theme-input:focus-visible,
.sell-list .chase-admin .chase-picker-trigger:focus,
.sell-list .chase-admin .chase-picker-trigger:focus-visible,
.sell-list .chase-admin .chase-picker.is-open .chase-picker-trigger {
outline: none;
border-color: rgba(196, 181, 253, 0.9);
box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.35);
}
.sell-list .chase-edit .chase-live {
flex-direction: row;
align-items: center;
gap: 10px;
width: fit-content;
text-transform: none;
letter-spacing: 0;
font-size: 14px;
color: #fff;
}
.sell-list .chase-check {
position: relative;
cursor: pointer;
}
.sell-list .chase-check input {
position: absolute;
width: 1px;
height: 1px;
margin: 0;
opacity: 0;
}
.sell-list .chase-check-box {
display: inline-grid;
place-items: center;
width: 20px;
height: 20px;
flex: 0 0 auto;
border: 1.5px solid rgba(196, 181, 253, 0.8);
border-radius: 6px;
background: rgba(255, 255, 255, 0.06);
box-shadow: inset 0 0 0 1px rgba(18, 4, 32, 0.35);
}
.sell-list .chase-check input:checked + .chase-check-box {
border-color: #f3e8ff;
background: linear-gradient(180deg, #d8b4fe 0%, #7c3aed 100%);
}
.sell-list .chase-check input:checked + .chase-check-box::after {
content: '';
width: 5px;
height: 9px;
border: solid #fff;
border-width: 0 2px 2px 0;
transform: rotate(45deg) translate(-1px, -1px);
}
.sell-list .chase-check input:focus-visible + .chase-check-box {
outline: 2px solid #f7d14e;
outline-offset: 2px;
}
.sell-list .chase-image-row {
display: flex;
align-items: flex-end;
gap: 16px;
}
.sell-list .chase-image-row > div {
min-width: 0;
}
.sell-list .chase-image-label {
display: block;
margin-bottom: 6px;
color: rgba(226, 212, 240, 0.78);
font-size: 12px;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.sell-list .chase-edit .file-pick {
display: inline-flex;
flex-direction: row;
align-items: center;
width: auto;
min-width: 260px;
max-width: 100%;
text-transform: none;
letter-spacing: 0;
font-weight: 500;
}
.sell-list .chase-edit .file-pick-name {
text-transform: none;
letter-spacing: 0;
}
.sell-list .chase-edit .file-pick-input {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
}
.sell-list .chase-edit-image {
width: 84px;
height: 84px;
flex: 0 0 auto;
object-fit: cover;
border-radius: 12px;
}
.sell-list .chase-edit-actions {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin-top: 2px;
padding-top: 14px;
border-top: 1px solid rgba(167, 139, 250, 0.22);
}
.sell-list .chase-edit-actions .btn,
.sell-list .chase-edit-actions a.btn {
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
height: 42px;
margin: 0;
padding: 0 18px;
border-width: 1px;
font-size: 13px;
line-height: 1;
text-decoration: none;
vertical-align: middle;
}
.sell-list .chase-edit-empty {
margin: 0;
}
.sell-list .chase-editor {
display: flex;
flex-direction: column;
gap: 16px;
min-width: 0;
}
.sell-list .chase-editor.is-loading,
.sell-list .chase-edit-empty.is-loading {
opacity: 0.45;
pointer-events: none;
}
.sell-list .chase-checklist {
padding: 14px;
border: 1px solid rgba(167, 139, 250, 0.28);
border-radius: 18px;
background: rgba(12, 4, 24, 0.45);
}
.sell-list .chase-checklist-head {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px 12px;
margin-bottom: 12px;
}
.sell-list .chase-checklist-head h3,
.sell-list .chase-checklist-head p {
margin: 0;
}
.sell-list .chase-checklist-head h3 {
color: #fff;
font-size: 18px;
line-height: 1.2;
}
.sell-list .chase-checklist-head p {
color: rgba(226, 212, 240, 0.7);
font-size: 13px;
}
.sell-list .chase-checklist-head .theme-input {
flex: 1 1 180px;
height: 42px;
min-height: 42px;
margin: 0;
padding: 0 14px;
border-radius: 12px;
background: #160828;
color: #fff;
font-size: 14px;
}
.sell-list .chase-checklist-head .btn,
.sell-list .chase-sheet-page .chase-checklist-head .btn {
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
height: 42px;
margin: 0;
padding: 0 18px;
border-width: 1px;
font-size: 13px;
line-height: 1;
text-decoration: none;
order: 0;
}
.sell-list .chase-checklist-head a.btn-primary,
.sell-list .chase-checklist-head button.btn-primary {
border: 0;
background: linear-gradient(236deg, #7c3aed 5%, #5b21b6 90%);
color: #fff;
cursor: pointer;
}
.sell-list .chase-sheet-dialog {
width: min(980px, calc(100vw - 32px));
max-height: calc(100vh - 32px);
margin: auto;
padding: 0;
border: 1px solid rgba(167, 139, 250, 0.45);
border-radius: 18px;
background: #160828;
color: #fff;
}
.sell-list .chase-sheet-dialog::backdrop {
background: rgba(8, 2, 18, 0.72);
}
.sell-list .chase-sheet-dialog-card {
display: flex;
flex-direction: column;
gap: 14px;
max-height: calc(100vh - 32px);
padding: 18px;
}
.sell-list .chase-sheet-dialog .chase-checklist-head {
margin-bottom: 0;
}
.sell-list .chase-sheet-dialog .chase-checklist-head h3 {
margin: 0;
color: #fff;
font-size: 20px;
}
.sell-list .chase-sheet-dialog .chase-sheet-scroll {
max-height: min(62vh, 640px);
min-height: 240px;
}
.sell-list .chase-sheet-dialog .text-light {
margin: 0;
}
.sell-list .chase-sheet-page {
display: flex;
flex-direction: column;
gap: 14px;
}
.sell-list .chase-sheet-back {
width: fit-content;
color: #c4b5fd;
font-size: 14px;
font-weight: 700;
text-decoration: none;
}
.sell-list .chase-sheet-back:hover {
color: #fff;
}
.sell-list .chase-sheet-page .chase-checklist-head {
margin-bottom: 0;
}
.sell-list .chase-sheet-page .chase-checklist-head h2 {
margin: 0;
color: #fff;
line-height: 1.2;
}
.sell-list .chase-sheet-page .chase-sheet-scroll {
max-height: calc(100vh - 280px);
min-height: 360px;
}
.sell-list .chase-sheet-scroll {
max-height: 480px;
overflow: auto;
border: 1px solid rgba(167, 139, 250, 0.22);
border-radius: 12px;
background: #12061f;
}
.sell-list .chase-checklist table,
.sell-list .chase-sheet-page table,
.sell-list .chase-sheet-dialog table {
width: 100%;
border-collapse: collapse;
color: #fff;
font-size: 14px;
}
.sell-list .chase-checklist th,
.sell-list .chase-checklist td,
.sell-list .chase-sheet-page th,
.sell-list .chase-sheet-page td,
.sell-list .chase-sheet-dialog th,
.sell-list .chase-sheet-dialog td {
padding: 10px 12px;
border-bottom: 1px solid rgba(167, 139, 250, 0.16);
text-align: left;
vertical-align: top;
}
.sell-list .chase-checklist th,
.sell-list .chase-sheet-page th,
.sell-list .chase-sheet-dialog th {
position: sticky;
top: 0;
background: #1c0b33;
color: rgba(226, 212, 240, 0.78);
font-size: 11px;
font-weight: 700;
letter-spacing: 0.05em;
text-transform: uppercase;
}
.sell-list .chase-checklist td:first-child,
.sell-list .chase-sheet-page td:first-child,
.sell-list .chase-sheet-dialog td:first-child {
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
.sell-list .chase-checklist td:nth-child(2),
.sell-list .chase-sheet-page td:nth-child(2),
.sell-list .chase-sheet-dialog td:nth-child(2) {
width: 88px;
color: #c4b5fd;
}
.sell-list .chase-sheet-none td {
color: rgba(226, 212, 240, 0.7);
}
.sell-list .chase-csv {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: 14px;
}
.sell-list .chase-csv-row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
}
.sell-list .chase-csv .file-pick {
display: inline-flex;
flex-direction: row;
align-items: center;
width: auto;
min-width: 260px;
max-width: 100%;
margin: 0;
text-transform: none;
letter-spacing: 0;
font-weight: 500;
}
.sell-list .chase-csv .file-pick-input {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
}
.sell-list .chase-csv .btn {
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
height: 42px;
margin: 0;
padding: 0 18px;
border: 0;
border-radius: 999px;
background: linear-gradient(236deg, #7c3aed 5%, #5b21b6 90%);
color: #fff;
font-size: 13px;
font-weight: 700;
letter-spacing: 0.04em;
line-height: 1;
order: 0;
}
.sell-list .chase-csv-add {
display: flex;
flex-direction: row;
align-items: center;
gap: 10px;
width: fit-content;
margin: 0;
color: #fff;
font-size: 14px;
font-weight: 500;
letter-spacing: 0;
text-transform: none;
}
.sell-list .chase-csv .text-light {
margin: 0;
font-size: 13px;
}
.sell-list .request-board {
display: grid;
grid-template-columns: minmax(340px, 400px) minmax(0, 1fr);
gap: 16px;
align-items: start;
}
.sell-list .request-list,
.sell-list .request-preview {
padding: 22px;
border-radius: 17px;
border: 1px solid rgba(124, 58, 237, 0.19);
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.19) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
}
.sell-list .request-list .catalog-search-head {
margin-top: 14px;
}
.sell-list .request-list .epic-input-row {
flex-direction: row;
flex-wrap: nowrap;
align-items: stretch;
}
.sell-list .request-list .epic-input-row input,
.sell-list .request-list .epic-input-row .btn {
height: 46px;
box-sizing: border-box;
}
.sell-list .request-search-field {
position: relative;
flex: 1 1 auto;
min-width: 0;
}
.sell-list .request-list .epic-input-row input {
width: 100%;
min-width: 0;
padding-top: 0;
padding-bottom: 0;
padding-right: 44px;
}
.sell-list .request-search-field input::-webkit-search-cancel-button,
.sell-list .request-search-field input::-webkit-search-decoration {
-webkit-appearance: none;
appearance: none;
}
.sell-list .request-list .epic-input-row .btn {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 16px;
}
.sell-list .date-toggle {
position: absolute;
top: 50%;
right: 8px;
z-index: 2;
display: inline-flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
padding: 0;
border: 0;
border-radius: 999px;
background: transparent;
color: rgba(226, 212, 240, 0.9);
transform: translateY(-50%);
cursor: pointer;
}
.sell-list .date-toggle svg {
width: 16px;
height: 16px;
}
.sell-list .date-toggle:hover,
.sell-list .date-toggle:focus-visible,
.sell-list .date-toggle[aria-expanded='true'],
.sell-list .date-toggle.is-active {
color: #fff;
background: rgba(124, 58, 237, 0.55);
}
.sell-list .date-tip {
position: absolute;
right: 0;
bottom: calc(100% + 8px);
z-index: 5;
padding: 6px 10px;
border: 1px solid rgba(167, 139, 250, 0.5);
border-radius: 8px;
background: #1a0a2e;
color: #fff;
font-family: 'Space Grotesk', sans-serif;
font-size: 12px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0;
text-transform: none;
white-space: nowrap;
opacity: 0;
visibility: hidden;
pointer-events: none;
}
.sell-list .date-toggle:hover .date-tip,
.sell-list .date-toggle:focus-visible .date-tip {
opacity: 1;
visibility: visible;
}
.sell-list .date-toggle[aria-expanded='true'] .date-tip {
display: none;
}
.sell-list .request-dates {
position: absolute;
top: calc(100% + 8px);
left: 0;
right: 0;
z-index: 20;
display: none;
grid-template-columns: minmax(0, 1fr);
gap: 10px;
width: auto;
max-width: 100%;
margin: 0;
padding: 12px;
border: 1px solid rgba(167, 139, 250, 0.45);
border-radius: 14px;
background: #1a0a2e;
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
box-sizing: border-box;
}
.sell-list .request-dates.is-open {
display: grid;
}
.sell-list .request-dates label {
display: flex;
flex-direction: column;
gap: 6px;
min-width: 0;
margin: 0;
color: rgba(226, 212, 240, 0.8);
font-size: 12px;
font-weight: 700;
}
.sell-list .request-dates input {
width: 100%;
min-width: 0;
max-width: 100%;
height: 42px;
box-sizing: border-box;
color-scheme: dark;
}
.sell-list .request-dates input::-webkit-calendar-picker-indicator {
filter: invert(1);
opacity: 0.75;
}
.sell-list .request-list .catalog-pages {
margin-top: 14px;
}
.sell-list #request-results.is-loading {
opacity: 0.45;
pointer-events: none;
}
.sell-list .request-list ul {
list-style: none;
margin: 12px 0 0;
padding: 0;
}
.sell-list .request-list a {
display: grid;
grid-template-columns: 1fr auto;
gap: 2px 12px;
margin-top: 8px;
padding: 12px;
border-radius: 12px;
color: #fff;
text-decoration: none;
background: rgba(255, 255, 255, 0.04);
}
.sell-list .request-list .request-idline {
display: flex;
align-items: center;
gap: 8px;
min-width: 0;
}
.sell-list .request-status {
display: inline-flex;
align-items: center;
margin: 0;
padding: 2px 8px;
border-radius: 999px;
background: rgba(124, 58, 237, 0.45);
color: #fff;
font-size: 11px;
font-style: normal;
font-weight: 800;
letter-spacing: 0.02em;
white-space: nowrap;
}
.sell-list .request-status.is-package_received {
background: rgba(52, 211, 153, 0.18);
color: #6ee7b7;
}
.sell-list .request-status.is-check_sent {
background: rgba(247, 209, 78, 0.18);
color: #f7d14e;
}
.sell-list .request-list a span {
grid-column: 1;
color: rgba(226, 212, 240, 0.72);
font-size: 13px;
}
.sell-list .request-list .request-idline,
.sell-list .request-list .request-idline strong {
color: #fff;
font-size: 15px;
}
.sell-list .request-list a b {
grid-row: 1 / span 2;
grid-column: 2;
align-self: center;
color: #f7d14e;
}
.sell-list .request-list a.on,
.sell-list .request-list a:hover {
background: rgba(124, 58, 237, 0.35);
}
.sell-list .request-preview header {
position: relative;
z-index: 2;
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 16px;
}
.sell-list .preview-actions {
display: flex;
align-items: flex-end;
gap: 12px;
}
.sell-list .preview-actions .btn,
.sell-list .preview-actions .request-status {
height: 42px;
box-sizing: border-box;
}
.sell-list .preview-actions .btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 16px;
}
.sell-list .preview-actions .request-status {
padding: 0 14px;
}
.sell-list .request-status-field {
position: relative;
display: flex;
flex-direction: column;
gap: 6px;
margin: 0;
color: rgba(226, 212, 240, 0.8);
font-size: 12px;
font-weight: 700;
}
.sell-list .request-status-field select,
.sell-list .request-status-filter select {
height: 42px;
padding: 0 42px 0 16px;
border: 1px solid rgba(167, 139, 250, 0.55);
border-radius: 999px;
background-color: rgba(124, 58, 237, 0.4);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 16px center;
background-size: 12px 8px;
color: #fff;
font-weight: 800;
appearance: none;
cursor: pointer;
}
.sell-list .request-status-field.is-busy select {
background-image: none;
}
.sell-list .request-status-field.is-busy::after {
content: '';
position: absolute;
right: 18px;
bottom: 13px;
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.35);
border-top-color: #fff;
border-radius: 50%;
animation: tb-spin 0.7s linear infinite;
}
@keyframes tb-spin {
to {
transform: rotate(360deg);
}
}
.sell-list .po-modal.is-error .po-modal-card {
border-color: rgba(255, 143, 143, 0.55);
background: radial-gradient(
120% 80% at 50% 0%,
rgba(255, 120, 120, 0.16),
transparent 55%
),
linear-gradient(180deg, rgba(76, 29, 149, 0.45), rgba(26, 10, 46, 0.2)),
#1a0a2e;
}
.sell-list .po-modal.is-error .po-mark {
background: linear-gradient(140deg, #ffb4b4, #e11d48 70%);
color: #fff;
box-shadow: 0 10px 28px rgba(225, 29, 72, 0.35);
}
.sell-list .status-picker {
position: relative;
z-index: 5;
}
.sell-list .request-status-field .status-picker-native {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
white-space: nowrap;
appearance: none;
pointer-events: none;
}
.sell-list .status-picker-trigger {
display: inline-flex;
align-items: center;
justify-content: space-between;
gap: 12px;
min-width: 168px;
height: 42px;
padding: 0 14px 0 16px;
border: 1px solid rgba(167, 139, 250, 0.55);
border-radius: 999px;
background: rgba(124, 58, 237, 0.4);
color: #fff;
font-weight: 800;
cursor: pointer;
}
.sell-list .status-picker-trigger:hover,
.sell-list .status-picker.is-open .status-picker-trigger {
border-color: rgba(196, 181, 253, 0.9);
background: rgba(124, 58, 237, 0.55);
}
.sell-list .status-picker-chevron {
width: 12px;
height: 8px;
flex: 0 0 auto;
transition: transform 0.15s ease;
}
.sell-list .status-picker.is-open .status-picker-chevron {
transform: rotate(180deg);
}
.sell-list .status-picker.is-package_received .status-picker-trigger {
border-color: rgba(52, 211, 153, 0.75);
background: rgba(52, 211, 153, 0.16);
color: #6ee7b7;
}
.sell-list .status-picker.is-check_sent .status-picker-trigger {
border-color: rgba(247, 209, 78, 0.75);
background: rgba(247, 209, 78, 0.16);
color: #f7d14e;
}
.sell-list .status-picker.is-busy .status-picker-trigger {
cursor: progress;
}
.sell-list .status-picker.is-busy .status-picker-chevron {
visibility: hidden;
}
.sell-list .status-picker.is-busy::after {
content: '';
position: absolute;
right: 16px;
top: 13px;
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.35);
border-top-color: #fff;
border-radius: 50%;
animation: tb-spin 0.7s linear infinite;
}
.sell-list .request-preview .status-picker-menu {
position: absolute;
z-index: 30;
top: calc(100% + 8px);
right: 0;
width: max-content;
min-width: 220px;
margin: 0;
padding: 6px;
list-style: none;
border: 1px solid rgba(167, 139, 250, 0.35);
border-radius: 16px;
background: #241038;
box-shadow: 0 18px 40px rgba(8, 2, 20, 0.55);
}
.sell-list .request-preview .status-picker-menu li {
display: block;
margin: 0;
padding: 0;
border: 0;
background: transparent;
}
.sell-list .status-picker-menu[hidden] {
display: none;
}
.sell-list .status-picker-menu button {
display: flex;
align-items: center;
gap: 10px;
width: 100%;
padding: 10px 12px;
border: 0;
border-radius: 12px;
background: transparent;
color: #fff;
font-weight: 700;
text-align: left;
white-space: nowrap;
cursor: pointer;
}
.sell-list .status-picker-menu button::before {
content: '';
width: 8px;
height: 8px;
border-radius: 50%;
background: #c4b5fd;
flex: 0 0 auto;
}
.sell-list .status-picker-menu button[data-value="package_received"]::before {
background: #6ee7b7;
}
.sell-list .status-picker-menu button[data-value="check_sent"]::before {
background: #f7d14e;
}
.sell-list .status-picker-menu button:hover,
.sell-list .status-picker-menu button[aria-selected="true"] {
background: rgba(124, 58, 237, 0.4);
}
.sell-list .request-status-field select.is-package_received {
border-color: rgba(52, 211, 153, 0.75);
background-color: rgba(52, 211, 153, 0.16);
color: #6ee7b7;
}
.sell-list .request-status-field select.is-check_sent {
border-color: rgba(247, 209, 78, 0.75);
background-color: rgba(247, 209, 78, 0.16);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23f7d14e' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
color: #f7d14e;
}
.sell-list .request-status-filter {
display: flex;
flex-direction: column;
gap: 6px;
margin: 12px 0 0;
color: rgba(226, 212, 240, 0.8);
font-size: 12px;
font-weight: 700;
}
.sell-list .request-status-filter select {
width: 100%;
}
.sell-list .request-preview .eyebrow {
margin: 0;
color: rgba(226, 212, 240, 0.7);
font-size: 12px;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.sell-list .request-preview h2 {
margin: 2px 0;
}
.sell-list .request-preview header p {
margin: 0;
color: rgba(226, 212, 240, 0.75);
}
.sell-list .request-preview .note {
color: rgba(226, 212, 240, 0.75);
}
.sell-list .request-preview ul:not(.status-picker-menu) {
list-style: none;
margin: 16px 0 0;
padding: 0;
}
.sell-list .request-preview ul:not(.status-picker-menu) > li {
display: grid;
grid-template-columns: 140px 1fr auto;
gap: 12px;
padding: 10px 0;
border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.sell-list .request-preview li b {
color: #f7d14e;
}
@media (max-width: 900px) {
.sell-list .dash,
.sell-list .request-board {
grid-template-columns: 1fr;
}
.sell-list .dash-nav {
flex-direction: row;
}
.sell-list .request-preview ul:not(.status-picker-menu) > li {
grid-template-columns: 1fr;
}
}
.sell-list a.link {
color: rgb(218, 183, 253);
font-weight: 700;
text-decoration: underline;
}
.sell-list a.link:hover {
color: #fff;
}
.sell-list .check-card {
margin-top: 22px;
padding: 28px 28px 22px;
border-radius: 17px;
border: 1px solid rgba(124, 58, 237, 0.19);
background: linear-gradient(
270deg,
rgba(147, 51, 234, 0.19) 0%,
rgba(76, 29, 149, 0) 100%
),
#1a0a2e;
color: #fff;
box-shadow: 0 15px 50px rgba(0, 0, 0, 0.35);
}
.sell-list .check-card h2 {
margin: 0 0 18px;
color: #fff;
font-size: 22px;
font-weight: 800;
}
.sell-list .check-error {
margin: 0 0 14px;
color: #ffb4b4;
font-weight: 700;
}
.sell-list .check-grid,
.sell-list .check-three {
display: grid;
gap: 14px 18px;
}
.sell-list .check-grid {
grid-template-columns: 1fr 1fr;
}
.sell-list .check-three {
grid-template-columns: 1.5fr 0.7fr 0.8fr;
margin-top: 14px;
}
.sell-list .check-card label,
.sell-list .check-card legend {
display: block;
margin: 0 0 6px;
color: rgba(226, 212, 240, 0.86);
font-size: 14px;
font-weight: 700;
}
.sell-list .check-input {
width: 100%;
padding: 12px 14px;
border: 1px solid rgba(255, 255, 255, 0.16);
border-radius: 12px;
background: rgba(255, 255, 255, 0.06);
color: #fff;
font: inherit;
}
.sell-list .check-input::placeholder {
color: rgba(226, 212, 240, 0.55);
}
.sell-list .check-input {
transition:
border-color 0.2s ease,
background-color 0.2s ease,
box-shadow 0.2s ease;
}
.sell-list .check-input:hover:not(:focus):not([readonly]) {
border-color: rgba(192, 132, 252, 0.35);
}
.sell-list .check-input:focus,
.sell-list .check-input:focus-visible {
outline: none;
border-color: rgba(192, 132, 252, 0.85);
background: rgba(124, 58, 237, 0.12);
box-shadow:
0 0 0 4px rgba(124, 58, 237, 0.22),
0 8px 24px rgba(76, 29, 149, 0.35);
}
.sell-list .check-input[readonly] {
color: rgba(255, 255, 255, 0.75);
cursor: default;
}
.sell-list .check-input[readonly]:focus {
border-color: rgba(255, 255, 255, 0.16);
background: rgba(255, 255, 255, 0.06);
box-shadow: none;
}
.sell-list .check-shipping {
display: grid;
gap: 10px;
margin: 22px 0 0;
padding: 0;
border: 0;
}
.sell-list .check-shipping legend {
margin-bottom: 4px;
}
.sell-list .check-card label.check-choice {
position: relative;
display: flex;
flex-direction: row;
align-items: center;
gap: 12px;
margin: 0;
padding: 12px 14px;
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 14px;
background: rgba(255, 255, 255, 0.04);
cursor: pointer;
transition:
border-color 0.15s,
background 0.15s;
}
.sell-list .check-choice:hover {
border-color: rgba(196, 181, 253, 0.55);
background: rgba(124, 58, 237, 0.12);
}
.sell-list .check-choice:has(input:checked) {
border-color: #c4b5fd;
background: rgba(124, 58, 237, 0.28);
}
.sell-list .check-choice:has(input:focus-visible) {
outline: 2px solid #f5d76e;
outline-offset: 2px;
}
.sell-list .check-choice input {
position: absolute;
width: 1px;
height: 1px;
margin: 0;
opacity: 0;
}
.sell-list .check-mark {
width: 18px;
height: 18px;
flex: 0 0 auto;
border: 2px solid rgba(226, 212, 240, 0.7);
border-radius: 50%;
display: grid;
place-items: center;
}
.sell-list .check-mark::after {
content: '';
width: 8px;
height: 8px;
border-radius: 50%;
background: transparent;
}
.sell-list .check-choice:has(input:checked) .check-mark {
border-color: #e9d5ff;
}
.sell-list .check-choice:has(input:checked) .check-mark::after {
background: #e9d5ff;
}
.sell-list .check-copy {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.sell-list .check-title {
color: #fff;
font-weight: 700;
}
.sell-list .check-detail {
color: rgba(226, 212, 240, 0.72);
font-size: 13px;
}
.sell-list .check-price {
margin-left: auto;
color: #f7d14e;
font-weight: 800;
white-space: nowrap;
}
.sell-list .check-summary {
margin-top: 18px;
padding: 14px 16px;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 12px;
background: rgba(255, 255, 255, 0.05);
}
.sell-list .check-summary p {
display: flex;
justify-content: space-between;
gap: 16px;
margin: 0;
}
.sell-list .check-summary p[hidden] {
display: none;
}
.sell-list .check-due {
margin-top: 10px !important;
padding-top: 10px;
border-top: 1px solid rgba(255, 255, 255, 0.12);
font-weight: 800;
}
.sell-list .check-due strong {
color: #f7d14e;
font-size: 20px;
}
.sell-list .check-notes {
margin: 16px 0 0;
padding-left: 18px;
color: rgba(226, 212, 240, 0.9);
font-size: 14px;
font-weight: 700;
}
.sell-list .check-notes li + li {
margin-top: 6px;
}
.sell-list .check-submit {
width: 100%;
margin-top: 18px;
padding: 14px 18px;
border: 0;
border-radius: 12px;
background: #7c3aed;
color: #fff;
font-size: 16px;
font-weight: 800;
cursor: pointer;
}
.sell-list .check-submit:hover {
background: #6d28d9;
}
.sell-list .check-lock {
margin: 12px 0 0;
color: rgba(226, 212, 240, 0.9);
font-size: 13px;
font-weight: 700;
text-align: center;
}
@media (max-width: 720px) {
.sell-list .check-grid,
.sell-list .check-three {
grid-template-columns: 1fr;
}
}
.sell-list .offer-list,
.sell-list #offers {
scroll-margin-top: 24px;
}
.sell-list .offer-list {
margin-top: 8px;
}
.sell-list .offer-row {
display: flex;
justify-content: space-between;
gap: 16px;
padding: 14px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.sell-list .offer-row small,
.sell-list .offer-row b {
display: block;
}
.sell-list .offer-row small {
color: rgba(226, 212, 240, 0.78);
}
.sell-list .offer-row b {
color: #fff;
}
.sell-list .offer-row-side {
text-align: right;
}
.sell-list .offer-price {
color: #f7d14e;
font-weight: 800;
white-space: nowrap;
}
.sell-list .offer-missing {
color: #ffb4b4;
}
.sell-list .offer-remove {
border: 0;
padding: 0;
background: transparent;
color: #dab7fd;
font-weight: 700;
cursor: pointer;
}
.sell-list .catalog-search-head {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 16px;
margin-bottom: 8px;
}
.sell-list .catalog-search-head label {
margin: 0;
}
.sell-list .catalog-count {
margin: 0;
color: rgba(226, 212, 240, 0.85);
font-weight: 700;
white-space: nowrap;
}
.sell-list #catalog-results.is-loading {
opacity: 0.45;
pointer-events: none;
}
.sell-list .dash-main,
.sell-list .coin-catalog,
.sell-list #catalog-results {
min-width: 0;
max-width: 100%;
}
.sell-list .sheet-wrap {
width: 100%;
max-width: 100%;
margin-top: 12px;
overflow-x: auto;
overflow-y: hidden;
border: 1px solid rgba(255, 255, 255, 0.22);
border-radius: 6px;
background: rgba(8, 2, 18, 0.35);
}
.sell-list .catalog-tools {
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: center;
margin: 16px 0 8px;
}
.sell-list .catalog-import {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
}
.sell-list .catalog-import .file-pick-input {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
}
.sell-list .file-pick {
display: flex;
align-items: center;
gap: 12px;
min-width: 280px;
max-width: 440px;
margin: 0;
padding: 5px 16px 5px 5px;
border: 1px solid rgba(167, 139, 250, 0.45);
border-radius: 999px;
background: rgba(255, 255, 255, 0.06);
cursor: pointer;
}
.sell-list .file-pick:hover,
.sell-list .file-pick:focus-within {
border-color: rgba(247, 209, 78, 0.7);
background: rgba(255, 255, 255, 0.1);
}
.sell-list .file-pick-btn {
display: inline-flex;
align-items: center;
padding: 8px 16px;
border-radius: 999px;
border: 1px solid rgba(196, 181, 253, 0.4);
background: linear-gradient(
236deg,
rgba(124, 58, 237, 0.85) 5%,
rgba(76, 29, 149, 0.55) 90%
);
color: #fff;
font-family: 'Clash Display', sans-serif;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
white-space: nowrap;
}
.sell-list .file-pick-name {
min-width: 0;
overflow: hidden;
color: rgba(226, 212, 240, 0.72);
font-size: 14px;
text-overflow: ellipsis;
white-space: nowrap;
}
.sell-list .file-pick.has-file .file-pick-name {
color: #fff;
font-weight: 700;
}
.sell-list .catalog-note {
margin: 0 0 14px;
color: rgba(226, 212, 240, 0.8);
font-size: 14px;
}
.sell-list .catalog-toolbar {
display: flex;
align-items: center;
gap: 10px;
margin: 0 0 12px;
}
.sell-list .catalog-toolbar .catalog-selected {
flex: 0 0 auto;
margin: 0;
color: #f7d14e;
font-weight: 800;
white-space: nowrap;
}
.sell-list .catalog-toolbar > .btn {
order: 0;
flex: 0 0 auto;
height: 46px;
padding: 0 16px;
}
.sell-list .catalog-toolbar #catalog-search {
flex: 1 1 auto;
min-width: 0;
margin: 0;
}
.sell-list .catalog-toolbar .epic-input-row {
flex-wrap: nowrap;
align-items: stretch;
margin: 0;
}
.sell-list .catalog-toolbar .epic-input-row input,
.sell-list .catalog-toolbar .epic-input-row .btn {
height: 46px;
box-sizing: border-box;
}
.sell-list .catalog-toolbar .epic-input-row input {
flex: 1 1 auto;
width: auto;
min-width: 0;
padding-top: 0;
padding-bottom: 0;
}
.sell-list .catalog-toolbar .epic-input-row .btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 16px;
}
.sell-list .catalog-match {
margin: 0 0 14px;
padding: 14px;
border: 1px solid rgba(167, 139, 250, 0.35);
border-radius: 16px;
background: rgba(255, 255, 255, 0.04);
}
.sell-list .catalog-match[hidden] {
display: none;
}
.sell-list .match-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 10px;
}
.sell-list .match-grid label {
display: flex;
flex-direction: column;
gap: 6px;
margin: 0;
color: rgba(226, 212, 240, 0.85);
font-size: 12px;
font-weight: 700;
}
.sell-list .match-line {
display: flex;
align-items: stretch;
gap: 8px;
min-width: 0;
}
.sell-list .match-line input,
.sell-list .match-line .btn {
height: 46px;
box-sizing: border-box;
}
.sell-list .match-line input {
flex: 1 1 auto;
width: auto;
min-width: 0;
padding-top: 0;
padding-bottom: 0;
}
.sell-list .match-line .btn {
order: 0;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 14px;
}
.sell-list .match-actions {
display: flex;
justify-content: flex-end;
margin-top: 12px;
}
.sell-list .match-actions .btn {
height: 42px;
padding: 0 16px;
}
.sell-list .match-chips {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 12px 0 0;
padding: 0;
list-style: none;
}
.sell-list .match-chips:empty {
display: none;
}
.sell-list .match-chips li {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 4px 4px 4px 12px;
border-radius: 999px;
background: rgba(124, 58, 237, 0.4);
color: #fff;
font-size: 13px;
font-weight: 700;
}
.sell-list .match-chips button {
width: 22px;
height: 22px;
border: 0;
border-radius: 50%;
background: rgba(255, 255, 255, 0.16);
color: #fff;
line-height: 1;
cursor: pointer;
}
.sell-list .sheet .sheet-check-cell {
width: 44px;
padding-left: 8px;
padding-right: 8px;
text-align: center;
}
.sell-list .sheet-check {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
margin: 0;
cursor: pointer;
}
.sell-list .sheet-check input {
position: absolute;
width: 1px;
height: 1px;
margin: 0;
opacity: 0;
}
.sell-list .sheet-check span {
display: inline-grid;
place-items: center;
width: 18px;
height: 18px;
border: 1.5px solid rgba(226, 212, 240, 0.75);
border-radius: 6px;
background: rgba(255, 255, 255, 0.06);
box-shadow: inset 0 0 0 1px rgba(18, 4, 32, 0.35);
}
.sell-list .sheet-check input:checked + span,
.sell-list .sheet-check input:indeterminate + span {
border-color: #f3e8ff;
background: linear-gradient(180deg, #d8b4fe 0%, #7c3aed 100%);
}
.sell-list .sheet-check input:checked + span::after {
content: '';
width: 5px;
height: 9px;
border: solid #fff;
border-width: 0 2px 2px 0;
transform: rotate(45deg) translate(-1px, -1px);
}
.sell-list .sheet-check input:indeterminate + span::after {
content: '';
width: 8px;
height: 2px;
border-radius: 2px;
background: #fff;
}
.sell-list .sheet-check input:focus-visible + span {
outline: 2px solid #f7d14e;
outline-offset: 2px;
}
.sell-list .sheet tbody tr.is-checked {
background: rgba(124, 58, 237, 0.28);
}
.sell-list .po-modal {
width: min(440px, calc(100% - 32px));
padding: 0;
border: 0;
background: transparent;
color: #fff;
}
.sell-list .po-modal::backdrop {
background: rgba(8, 2, 18, 0.78);
}
.sell-list .po-modal-card {
padding: 32px 28px 26px;
border: 1px solid rgba(247, 209, 78, 0.45);
border-radius: 22px;
background: radial-gradient(
120% 80% at 50% 0%,
rgba(247, 209, 78, 0.16),
transparent 55%
),
linear-gradient(180deg, rgba(76, 29, 149, 0.45), rgba(26, 10, 46, 0.2)),
#1a0a2e;
box-shadow: 0 24px 80px rgba(0, 0, 0, 0.5);
text-align: center;
}
.sell-list .po-mark {
display: grid;
place-items: center;
width: 64px;
height: 64px;
margin: 0 auto 16px;
border-radius: 50%;
background: linear-gradient(140deg, #fbe67b, #f7d14e 60%, #d4a041);
color: #1a1200;
box-shadow: 0 10px 28px rgba(247, 209, 78, 0.35);
}
.sell-list .po-mark svg {
width: 30px;
height: 30px;
}
.sell-list .po-modal-card h2 {
margin: 0 0 8px;
color: #fff;
font-size: 28px;
}
.sell-list .po-modal-card p {
margin: 0;
color: rgba(226, 212, 240, 0.86);
font-size: 16px;
line-height: 1.45;
}
.sell-list .po-id {
margin-top: 16px !important;
color: rgba(226, 212, 240, 0.75) !important;
font-size: 13px !important;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.sell-list .po-id strong {
display: block;
margin-top: 6px;
color: #f7d14e;
font-size: 20px;
letter-spacing: 0;
text-transform: none;
}
.sell-list .po-modal-card .btn {
width: 100%;
margin-top: 22px;
}
.sell-list .bulk-modal {
position: fixed;
inset: 0;
z-index: 80;
display: grid;
place-items: center;
padding: 24px;
background: rgba(8, 2, 18, 0.72);
}
.sell-list .bulk-modal[hidden] {
display: none;
}
.sell-list .bulk-modal-card {
width: min(640px, 100%);
padding: 22px;
border: 1px solid rgba(167, 139, 250, 0.45);
border-radius: 18px;
background: linear-gradient(
180deg,
rgba(76, 29, 149, 0.35),
rgba(26, 10, 46, 0.2)
),
#1a0a2e;
color: #fff;
box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
}
.sell-list .bulk-modal-card h3 {
margin: 0 0 6px;
font-size: 22px;
}
.sell-list #catalog-bulk-count {
margin: 0 0 8px;
color: #f7d14e;
font-weight: 800;
}
.sell-list .bulk-hint {
margin: 0 0 14px;
color: rgba(226, 212, 240, 0.8);
font-size: 14px;
}
.sell-list .bulk-fields {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
}
.sell-list .bulk-fields label {
display: flex;
flex-direction: column;
gap: 6px;
margin: 0;
color: rgba(226, 212, 240, 0.85);
font-size: 12px;
font-weight: 700;
}
.sell-list .bulk-fields .bulk-wide {
grid-column: 1 / -1;
}
.sell-list .bulk-fields input {
height: 42px;
padding-top: 0;
padding-bottom: 0;
}
.sell-list .bulk-error {
margin: 12px 0 0;
color: #ffb4b4;
font-weight: 700;
}
.sell-list .bulk-actions {
display: flex;
justify-content: flex-end;
gap: 10px;
margin-top: 16px;
}
.sell-list .bulk-actions .btn {
height: 42px;
padding: 0 16px;
}
.sell-list .import-notice {
margin: 12px 0 0;
padding: 10px 12px;
border-radius: 10px;
background: rgba(124, 58, 237, 0.35);
color: #fff;
font-weight: 700;
}
.sell-list .import-notice.is-error {
background: rgba(180, 40, 40, 0.45);
}
.sell-list .sheet {
width: 100%;
border-collapse: collapse;
color: #fff;
font-size: 13px;
line-height: 1.35;
}
.sell-list .sheet th,
.sell-list .sheet td {
padding: 7px 10px;
border: 1px solid rgba(255, 255, 255, 0.16);
text-align: left;
vertical-align: middle;
white-space: nowrap;
}
.sell-list .sheet th {
background: #3a1768;
color: #f6edff;
font-size: 12px;
font-weight: 800;
letter-spacing: 0.03em;
}
.sell-list .sheet tbody tr:nth-child(even) {
background: rgba(255, 255, 255, 0.045);
}
.sell-list .sheet td.title {
width: 99%;
}
.sell-list .sheet .is-blank {
color: rgba(226, 212, 240, 0.45);
}
.sell-list .sheet th.is-hidden,
.sell-list .sheet td.is-hidden {
display: none !important;
}
.sell-list .sheet .cell-input,
.sell-list .sheet .sheet-save,
.sell-list .sheet .sheet-cancel {
display: none;
}
.sell-list .sheet tr.is-editing .cell-text,
.sell-list .sheet tr.is-editing .sheet-edit {
display: none;
}
.sell-list .sheet tr.is-editing .cell-input {
display: block;
}
.sell-list .sheet tr.is-editing .sheet-save,
.sell-list .sheet tr.is-editing .sheet-cancel {
display: inline-flex;
}
.sell-list .sheet .col-edit,
.sell-list .sheet td.sheet-actions,
.sell-list .sheet th:last-child {
width: 44px;
padding-left: 4px;
padding-right: 4px;
text-align: center;
}
.sell-list .sheet .cell-input {
width: 100%;
box-sizing: border-box;
margin: 0;
padding: 4px 6px;
border: 1px solid #c4b5fd;
border-radius: 4px;
background: #fff;
color: #1a0a2e;
font: inherit;
}
.sell-list .sheet td.num .cell-input {
text-align: right;
}
.sell-list .sheet-edit,
.sell-list .sheet-save,
.sell-list .sheet-cancel {
display: inline-flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
border: 0;
padding: 0;
background: transparent;
color: #dab7fd;
cursor: pointer;
}
.sell-list .sheet-edit svg,
.sell-list .sheet-save svg,
.sell-list .sheet-cancel svg {
width: 16px;
height: 16px;
}
.sell-list .sheet-save {
color: #f7d14e;
}
.sell-list .sheet-cancel {
margin-left: 2px;
}
.sell-list .sheet-msg {
display: block;
margin-top: 6px;
color: #ffb4b4;
font-size: 12px;
font-weight: 700;
}
.sell-list .sheet th.num,
.sell-list .sheet td.num {
text-align: right;
font-variant-numeric: tabular-nums;
}
.sell-list .sheet a {
color: #fff;
font-weight: 700;
text-decoration: underline;
text-underline-offset: 2px;
}
.coin-catalog .catalog-list {
list-style: none;
margin: 8px 0 0;
padding: 0;
}
.coin-catalog .catalog-list li {
display: flex;
justify-content: space-between;
gap: 16px;
align-items: center;
padding: 14px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.coin-catalog .catalog-list a {
color: #fff;
text-decoration: none;
}
.coin-catalog .catalog-title,
.coin-catalog .catalog-meta {
display: block;
}
.coin-catalog .catalog-meta {
color: rgba(226, 212, 240, 0.7);
font-size: 14px;
}
.coin-catalog .catalog-price {
color: #f7d14e;
font-weight: 800;
white-space: nowrap;
}
.coin-catalog .catalog-pages {
display: flex;
gap: 16px;
margin-top: 18px;
}
.coin-catalog .catalog-pages a {
color: #dab7fd;
font-weight: 700;
text-decoration: none;
}
.sell-list .catalog-pages {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px 16px;
}
.sell-list .catalog-page-links {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
}
.sell-list .catalog-pages a,
.sell-list .catalog-pages .on {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 36px;
height: 36px;
padding: 0 12px;
border: 1px solid rgba(167, 139, 250, 0.45);
border-radius: 999px;
color: #fff;
font-weight: 700;
text-decoration: none;
}
.sell-list .catalog-pages a:hover {
border-color: rgba(247, 209, 78, 0.75);
color: #fff;
}
.sell-list .catalog-pages .on {
background: rgba(124, 58, 237, 0.9);
border-color: transparent;
}
.sell-list .catalog-ellipsis {
color: rgba(226, 212, 240, 0.75);
font-weight: 700;
}
.sell-list .catalog-page-of {
display: flex;
align-items: center;
gap: 16px;
margin: 0 0 0 auto;
color: rgba(226, 212, 240, 0.85);
font-weight: 700;
white-space: nowrap;
}
.sell-list .offer-total {
display: flex;
justify-content: space-between;
margin: 16px 0 0;
color: #fff;
font-size: 1.25rem;
font-weight: 800;
}
.account-form {
display: flex;
flex-direction: column;
gap: 8px;
}
.account-form .account-input {
width: 100%;
margin-bottom: 8px;
padding: 0.85rem 1.1rem;
border: 1px solid rgba(255, 255, 255, 0.16);
border-radius: 20px;
background: rgba(255, 255, 255, 0.07);
color: #fff;
outline: none;
transition:
border-color 0.2s,
box-shadow 0.2s,
background 0.2s;
}
.tb-auth .account-input:focus,
.tb-auth .account-input:focus-visible,
.tb-auth .account-input:focus:invalid {
outline: none;
border-color: #f5c96a;
background: rgba(245, 201, 106, 0.08);
box-shadow:
0 0 0 3px rgba(245, 201, 106, 0.22),
0 0 24px rgba(245, 201, 106, 0.2);
}
.account-form .account-remember {
display: flex;
align-items: center;
gap: 8px;
margin: 4px 0 12px;
font-size: 16px;
font-weight: 500;
}
.account-form .epic-btn {
align-self: flex-start;
}
.account-switch {
margin-top: 16px;
}
.account-switch a {
color: #dab7fd;
font-weight: 700;
}
.tb-auth {
width: min(520px, calc(100% - 32px));
padding: 0;
border: 0;
background: transparent;
color: #fff;
}
.tb-auth::backdrop {
background: rgba(8, 2, 20, 0.78);
}
.tb-auth .epic-form {
position: relative;
}
.tb-auth h2 {
margin: 0 0 8px;
font-size: 32px;
}
.tb-auth-close {
position: absolute;
top: 16px;
right: 16px;
border: 0;
background: transparent;
color: #fff;
font-size: 28px;
line-height: 1;
cursor: pointer;
}
.tb-auth-code-field {
display: flex;
flex-direction: column;
align-items: flex-end;
}
.tb-auth-code-field .tb-auth-code {
width: 100%;
margin-bottom: 6px;
}
.tb-auth-code {
letter-spacing: 0.4em;
text-align: center;
font-size: 24px;
}
.tb-auth-code-field .tb-auth-link {
text-align: right;
}
.tb-auth-link {
border: 0;
padding: 0;
background: transparent;
color: #dab7fd;
font-weight: 700;
cursor: pointer;
text-align: left;
}
@media (max-width: 720px) {
.epic-form,
.epic-form-section,
.sell-list .check-card,
.sell-list .request-list,
.sell-list .request-preview,
.lookup-result .panel {
padding: 18px;
}
.epic-form .epic-form-section,
.lookup-result .lookup.epic-form .panel,
.sell-list .lookup.epic-form .panel {
padding: 0;
border: 0;
background: none;
box-shadow: none;
}
.epic-form-section label,
.epic-multiple h3,
.epic-form-section h3,
.sell-list .lookup h2 {
font-size: 20px;
line-height: 1.25;
}
.epic-heading h2 {
font-size: 28px;
line-height: 1.15;
}
.epic-multiple textarea,
.sell-list textarea.theme-input {
min-height: 140px;
}
.sell-list input.theme-input,
.sell-list .request-dates input,
.sell-list .bulk-fields input,
.sell-list .match-line input,
.sell-list .catalog-toolbar .epic-input-row input {
height: 46px;
min-height: 46px;
}
.sell-list .lookup .panel .another .btn {
min-height: 48px;
}
.sell-list .lookup .panel .another .btn,
.lookup-result .actions .btn,
.lookup-result .actions form,
.lookup-result .actions .btn-added,
.account-form .epic-btn,
.tb-auth .epic-btn {
width: 100%;
}
.lookup-result .top {
gap: 16px;
}
.lookup-result h1 {
max-width: none;
font-size: 24px;
}
.lookup-result .offer {
width: 100%;
max-width: none;
height: auto;
}
.lookup-result .actions {
flex-direction: column;
align-items: stretch;
}
.lookup-result .actions .link {
margin-left: 0;
text-align: center;
}
.sell-list .dash-tabs {
display: grid;
grid-template-columns: 1fr 1fr;
width: 100%;
border-radius: 18px;
}
.sell-list .dash-tabs a {
min-width: 0;
height: auto;
min-height: 42px;
padding: 8px 10px;
font-size: 14px;
line-height: 1.15;
text-align: center;
white-space: normal;
}
.sell-list .chase-manage,
.sell-list .chase-fields {
grid-template-columns: 1fr;
}
.sell-list .request-list .epic-input-row,
.sell-list .coin-catalog .epic-input-row,
.sell-list .chase-search {
flex-direction: column;
align-items: stretch;
}
.sell-list .coin-catalog .epic-input-row .btn,
.sell-list .chase-search .btn,
.sell-list .chase-search input {
width: 100%;
}
.sell-list .request-list a > span:not(.request-idline) {
grid-column: 1 / -1;
}
.sell-list .request-list a b {
grid-row: 1;
}
.sell-list .request-list a span {
min-width: 0;
overflow-wrap: anywhere;
}
.sell-list .request-search-field,
.sell-list .request-list .epic-input-row .btn,
.sell-list .request-status-field select,
.sell-list .status-picker-trigger,
.sell-list .preview-actions .btn {
width: 100%;
}
.sell-list .request-preview header,
.sell-list .preview-actions {
flex-direction: column;
align-items: stretch;
width: 100%;
}
.sell-list .offer-row {
flex-direction: column;
align-items: flex-start;
gap: 8px;
}
.sell-list .offer-row-side {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
text-align: left;
}
.sell-list .catalog-tools,
.sell-list .catalog-import {
flex-direction: column;
align-items: stretch;
width: 100%;
}
.sell-list .catalog-tools > .btn,
.sell-list .catalog-import > .btn {
width: 100%;
}
.sell-list .catalog-tools .preview-icon {
align-self: flex-start;
}
.sell-list .catalog-toolbar {
flex-wrap: wrap;
}
.sell-list .catalog-toolbar #catalog-search,
.sell-list .catalog-selected,
.sell-list .catalog-toolbar > .btn,
.sell-list .match-actions .btn {
flex: 1 1 100%;
width: 100%;
}
.sell-list .catalog-toolbar .epic-input-row .btn {
width: 100%;
flex: 1 1 auto;
}
.sell-list .match-line .btn {
width: auto;
flex: 0 0 auto;
}
.sell-list .chase-image-row {
flex-direction: column;
align-items: stretch;
}
.sell-list .chase-edit .file-pick,
.sell-list .chase-csv .file-pick,
.sell-list .file-pick {
width: 100%;
min-width: 0;
max-width: none;
}
.sell-list .file-pick-name {
flex: 1 1 auto;
overflow: visible;
white-space: normal;
text-overflow: clip;
}
.sell-list .chase-edit,
.sell-list .chase-manage-list,
.sell-list .chase-sheet-scroll,
.sell-list .chase-checklist {
min-width: 0;
max-width: 100%;
}
}
@media (max-width: 991px) {
.sell-list.py-10 {
padding-top: 1.25rem;
padding-bottom: 2.5rem;
}
.sell-list .sheet-wrap {
overflow: visible;
border: 0;
background: transparent;
}
.sell-list .sheet,
.sell-list .sheet tbody,
.sell-list .sheet tr {
display: block;
width: auto;
}
.sell-list .sheet colgroup {
display: none;
}
.sell-list .sheet thead {
display: block;
}
.sell-list .sheet thead tr {
display: flex;
align-items: center;
gap: 8px;
margin: 0 0 10px;
padding: 0;
border: 0;
background: none;
}
.sell-list .sheet thead th {
display: none;
border: 0;
background: none;
}
.sell-list .sheet thead th.sheet-check-cell {
display: flex;
align-items: center;
gap: 8px;
padding: 0;
}
.sell-list .sheet thead th.sheet-check-cell::after {
content: 'Select page';
color: rgba(226, 212, 240, 0.85);
font-size: 13px;
font-weight: 700;
}
.sell-list .sheet tbody tr {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 8px 10px;
margin: 0 0 10px;
padding: 12px;
border: 1px solid rgba(255, 255, 255, 0.16);
border-radius: 14px;
background: rgba(255, 255, 255, 0.04);
}
.sell-list .sheet td,
.sell-list .sheet td.title,
.sell-list .sheet td.sheet-actions {
display: block;
width: auto;
border: 0;
padding: 0;
white-space: normal;
text-align: left;
}
.sell-list .sheet td.sheet-check-cell {
grid-column: 1;
grid-row: 1;
}
.sell-list .sheet td[data-field='cert_number'] {
grid-column: 2;
grid-row: 1;
align-self: center;
font-weight: 800;
}
.sell-list .sheet td.sheet-actions {
grid-column: 3;
grid-row: 1;
}
.sell-list .sheet td.title {
grid-column: 1 / -1;
grid-row: 2;
font-weight: 700;
}
.sell-list .sheet td[data-field='season'],
.sell-list .sheet td[data-field='cost'],
.sell-list .sheet td[data-field='retail'],
.sell-list .sheet td[data-field='sell_to_us'],
.sell-list .sheet td[data-field='purple'],
.sell-list .sheet td[data-field='master_sort'] {
grid-column: 1 / -1;
display: flex;
justify-content: space-between;
gap: 12px;
}
.sell-list .sheet td[data-field='season']::before {
content: 'Season';
}
.sell-list .sheet td[data-field='cost']::before {
content: 'Cost';
}
.sell-list .sheet td[data-field='retail']::before {
content: 'Retail';
}
.sell-list .sheet td[data-field='sell_to_us']::before {
content: 'Sell to us';
}
.sell-list .sheet td[data-field='purple']::before {
content: 'Purple';
}
.sell-list .sheet td[data-field='master_sort']::before {
content: 'Master sort';
}
.sell-list .sheet td[data-field]::before {
color: rgba(226, 212, 240, 0.7);
font-size: 12px;
font-weight: 700;
}
.sell-list .sheet tr.is-editing td[data-field] {
display: block;
}
.sell-list .sheet tr.is-editing td[data-field]::before {
display: block;
margin-bottom: 4px;
}
}
@media (max-width: 720px) {
.sell-list .bulk-fields {
grid-template-columns: 1fr;
}
.sell-list .match-grid {
grid-template-columns: 1fr;
}
.sell-list .catalog-pages {
flex-wrap: wrap;
}
.sell-list .catalog-page-of {
margin-left: 0;
}
}
.contact-page {
position: relative;
overflow: hidden;
}
@media screen and (min-width: 992px) {
.contact-page {
padding-top: 10rem;
}
}
.contact-page__intro {
max-width: 42rem;
margin-bottom: 2.5rem;
}
.contact-page__intro p {
max-width: 38rem;
line-height: 1.5;
}
.contact-card,
.contact-network,
.contact-social {
border: 1px solid rgba(124, 58, 237, 0.22);
border-radius: 18px;
background: linear-gradient(270deg, rgba(147, 51, 234, 0.2) 0%, rgba(76, 29, 149, 0) 100%), #1a0a2e;
}
.contact-card {
display: flex;
flex-direction: column;
height: 100%;
padding: 1.5rem 1.35rem 1.35rem;
}
.contact-card h2 {
margin: 0 0 0.5rem;
color: #fff;
font-family: "Clash Display", sans-serif;
font-size: 1.35rem;
font-weight: 700;
line-height: 1.15;
text-transform: uppercase;
}
.contact-card p {
flex: 1;
margin: 0;
color: #d7c8ef;
line-height: 1.45;
}
.contact-card a,
.contact-social a,
.contact-back a,
.contact-network__go {
color: #f5c96a;
font-weight: 700;
text-decoration: none;
}
.contact-card a {
display: inline-block;
margin-top: 1.25rem;
overflow-wrap: anywhere;
}
.contact-card a:hover,
.contact-social a:hover,
.contact-back a:hover,
.contact-network:hover .contact-network__go {
color: #fff;
}
.contact-social {
margin: 2rem 0 0;
padding: 1.25rem 1.5rem;
color: #d7c8ef;
}
.contact-back {
margin: 1.5rem 0 0;
}
.contact-network {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
height: 100%;
padding: 1.15rem 1.25rem;
color: inherit;
text-decoration: none;
}
.contact-network strong {
display: block;
color: #fff;
font-size: 1.05rem;
}
.contact-network span span {
display: block;
margin-top: 0.2rem;
color: #d7c8ef;
font-size: 0.95rem;
}
.contact-network.is-soon {
opacity: 0.72;
}
.contact-network__go {
flex-shrink: 0;
}
/*# sourceMappingURL=style-index.css.map*/
@media (max-width: 560px) {
.bc-thumb {
height: 260px;
}
.bc-thumb img {
max-height: 260px;
}
}
@media (max-width: 1200px) {
.bc-grid {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 900px) {
.bc-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 560px) {
.bc-grid {
grid-template-columns: 1fr;
}
}
/* Dashboard / sell list: less space between the header and the tabs. */
@media (min-width: 992px) {
.sell-list.py-10 {
padding-top: 2rem;
}
}
/* Sign-in popup: loading state on buttons while the request runs. */
.tb-auth .is-loading {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
cursor: progress;
opacity: 0.9;
}
.tb-auth .is-loading:hover {
transform: none;
}
.tb-spinner {
width: 18px;
height: 18px;
flex: none;
border-radius: 50%;
border: 2.5px solid rgba(255, 255, 255, 0.3);
border-top-color: #fff;
animation: tb-spin 0.7s linear infinite;
}
.tb-auth .tb-auth-link.is-loading .tb-spinner {
width: 13px;
height: 13px;
border-width: 2px;
border-color: rgba(192, 132, 252, 0.35);
border-top-color: currentColor;
}
@keyframes tb-spin {
to {
transform: rotate(360deg);
}
}
@media (prefers-reduced-motion: reduce) {
.tb-spinner {
animation-duration: 1.6s;
}
}
/* Bert Chase checklist: no Lookup column. */
.chase-page .certified-table-header.no-lookup,
.chase-page .certified-table-row.no-lookup {
grid-template-columns: 180px 160px 1fr;
}
/* =========================
Mobile menu (hamburger panel)
========================= */
@media (max-width: 991px) {
.site-header .navbar-collapse.d-lg-none {
margin: 8px 0 12px;
padding: 10px 18px 18px;
border-radius: 20px;
border: 1px solid rgba(124, 58, 237, 0.3);
background-color: #1a0a2e;
background-image:
radial-gradient(circle at 100% 0%, rgba(147, 51, 234, 0.28), rgba(147, 51, 234, 0) 55%),
linear-gradient(160deg, #2a1150 0%, #1a0a2e 55%, #12071f 100%);
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55);
}
.site-header .navbar-collapse.d-lg-none .navbar-ivm {
padding: 0 !important;
}
.site-header .navbar-collapse.d-lg-none .navbar-ivm > .nav-item {
border-bottom: 1px solid rgba(124, 58, 237, 0.2);
}
.site-header .navbar-collapse.d-lg-none .navbar-ivm > .nav-item > a {
display: flex;
align-items: center;
justify-content: space-between;
padding: 15px 4px;
color: #fff;
font-family: 'Clash Display';
font-size: 15px;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
transition: color 0.2s ease;
}
.site-header .navbar-collapse.d-lg-none .navbar-ivm > .nav-item > a:hover,
.site-header .navbar-collapse.d-lg-none .navbar-ivm > .nav-item > a.active,
.site-header .navbar-collapse.d-lg-none .navbar-ivm > .nav-item > a.show {
color: #f7d14e;
}
/* Chevron on Community: white, turns when open */
.site-header .navbar-collapse.d-lg-none .dropdown-toggle::after {
filter: brightness(0) invert(1);
transition: transform 0.2s ease;
}
.site-header .navbar-collapse.d-lg-none .dropdown-toggle.show::after {
filter: none;
transform: rotate(180deg);
}
/* Community submenu: inline, indented, no white box */
.site-header .navbar-collapse.d-lg-none .dropdown-menu {
position: static;
float: none;
margin: 0 0 12px;
padding: 6px;
min-width: 0;
border: 0;
border-radius: 14px;
background: rgba(0, 0, 0, 0.22);
box-shadow: none;
}
.site-header .navbar-collapse.d-lg-none .dropdown-menu::before,
.site-header .navbar-collapse.d-lg-none .dropdown-menu h5 {
display: none;
}
.site-header .navbar-collapse.d-lg-none .dropdown-menu ul {
list-style: none;
margin: 0;
padding: 0;
}
.site-header .navbar-collapse.d-lg-none .dropdown-menu .dropdown-item {
padding: 11px 14px;
border-radius: 10px;
color: #d7c8ef;
font-size: 13px;
letter-spacing: 0.05em;
white-space: normal;
background: transparent;
}
.site-header .navbar-collapse.d-lg-none .dropdown-menu .dropdown-item:hover,
.site-header .navbar-collapse.d-lg-none .dropdown-menu .dropdown-item.active {
color: #f7d14e;
background: rgba(124, 58, 237, 0.2);
}
/* Account buttons: full width, side by side */
.site-header .navbar-collapse.d-lg-none > .d-flex {
display: grid !important;
grid-template-columns: 1fr 1fr;
gap: 10px !important;
padding: 18px 0 0 !important;
}
.site-header .navbar-collapse.d-lg-none > .d-flex .btn {
width: 100%;
margin: 0;
padding: 13px 10px;
font-size: 12px;
text-align: center;
white-space: nowrap;
}
.site-header .navbar-collapse.d-lg-none > .d-flex .btn-outline-primary {
color: #fff;
background: transparent;
border: 1px solid rgba(192, 132, 252, 0.45);
}
.site-header .navbar-collapse.d-lg-none > .d-flex .btn-primary {
color: #1a0a2e;
border: 0;
background: linear-gradient(135deg, #fbe67b 0%, #f7d14e 55%, #d4a041 100%);
}
}
@media (max-width: 360px) {
.site-header .navbar-collapse.d-lg-none > .d-flex {
grid-template-columns: 1fr;
}
}
/* Home hero (mobile): with two quick-link cards, the last one spans the full width
and uses the same row layout as the Whatnot card. */
@media (max-width: 992px) {
.hero .side .side-card:last-child:not(:first-child),
.inner-hero .side .side-card:last-child:not(:first-child) {
width: 100%;
float: none;
clear: both;
flex-direction: row;
align-items: center;
min-height: auto;
}
.hero .side .side-card:last-child:not(:first-child) .side-arrow,
.inner-hero .side .side-card:last-child:not(:first-child) .side-arrow {
flex: 1;
text-align: right;
background: transparent !important;
}
.hero .side .side-card:last-child:not(:first-child) .side-label,
.inner-hero .side .side-card:last-child:not(:first-child) .side-label {
margin-top: 0;
margin-left: 1rem;
}
}
/* Whatnot shows on phones: two per row, tighter cards. */
@media (max-width: 575px) {
.whatsnot #shows .show-card {
padding: 7px;
border-radius: 12px;
}
.whatsnot #shows .card-body {
padding: 10px 2px 4px !important;
}
.whatsnot #shows .show-title {
font-size: 15px;
line-height: 1.1;
overflow-wrap: anywhere;
}
.whatsnot #shows .show-time {
font-size: 0.6rem;
}
.whatsnot #shows .show-meta {
padding-top: 10px !important;
font-size: 0.78rem;
}
}
/* Referral card (home, phones): keep it off the screen edges and pad the inside. */
@media (max-width: 991px) {
.referal-link .container > .row.bg-blur {
margin-left: 0;
margin-right: 0;
padding-left: 12px;
padding-right: 12px;
}
}