.ct-card {
    background: var(--ct-bg-1);
    border: 1px solid var(--ct-border);
    border-radius: var(--ct-radius-md);
    box-shadow: var(--ct-shadow-sm);
}

.ct-card-compact {
    background: var(--ct-bg-1);
    border: 1px solid var(--ct-border);
    border-radius: var(--ct-radius-sm);
}

:where(.page-shell, .page-shell-sm, .page-shell-md, .page-shell-lg) h1,
.ct-page-title {
    margin: 0;
    font-size: var(--ct-type-h1);
    line-height: 1.14;
    letter-spacing: -0.012em;
    font-weight: 700;
}

:where(.page-shell, .page-shell-sm, .page-shell-md, .page-shell-lg) h2,
.ct-section-title {
    margin: 0;
    font-size: var(--ct-type-h2);
    line-height: 1.2;
    letter-spacing: -0.01em;
    font-weight: 650;
}

:where(.page-shell, .page-shell-sm, .page-shell-md, .page-shell-lg) h3 {
    margin: 0;
    font-size: var(--ct-type-h3);
    line-height: 1.26;
    font-weight: 650;
}

:where(.page-shell, .page-shell-sm, .page-shell-md, .page-shell-lg) h4 {
    margin: 0;
    font-size: var(--ct-type-h4);
    line-height: 1.3;
    font-weight: 600;
}

:where(.page-shell, .page-shell-sm, .page-shell-md, .page-shell-lg) h5 {
    margin: 0;
    font-size: var(--ct-type-h5);
    line-height: 1.35;
    font-weight: 600;
}

:where(.page-shell, .page-shell-sm, .page-shell-md, .page-shell-lg) p {
    line-height: 1.45;
}

.ct-rhythm {
    --ct-rhythm-space: var(--ct-space-4);
}

.ct-rhythm > * + * {
    margin-top: var(--ct-rhythm-space);
}

.ct-rhythm > .linebreak + *,
.ct-rhythm > * + .linebreak {
    margin-top: var(--ct-space-3);
}

.ct-rhythm-tight {
    --ct-rhythm-space: var(--ct-space-3);
}

.ct-rhythm-loose {
    --ct-rhythm-space: var(--ct-space-5);
}

.ct-input-group .form-control,
.ct-input-group .form-select {
    background: var(--ct-bg-1);
    border-color: var(--ct-border);
    color: var(--ct-text);
}

.ct-input-group .form-control::placeholder {
    color: var(--ct-text-muted);
}

.ct-input-group .form-floating > label {
    color: var(--ct-text-muted);
}

.ct-btn-primary,
.btn.ct-btn-primary {
    background: var(--ct-primary);
    border-color: var(--ct-primary);
    color: #f5fff9;
}

.ct-btn-primary:hover,
.btn.ct-btn-primary:hover {
    background: var(--ct-primary-strong);
    border-color: var(--ct-primary-strong);
    color: #fff;
}

.ct-btn-secondary,
.btn.ct-btn-secondary {
    background: var(--ct-surface-2);
    border-color: var(--ct-border);
    color: var(--ct-text);
}

.ct-btn-secondary:hover,
.btn.ct-btn-secondary:hover {
    background: #343b44;
    border-color: #48515d;
    color: var(--ct-text);
}

.ct-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 10px;
}

.ct-pager-link {
    text-decoration: none;
    font-weight: 600;
}

.ct-pager-link.disabled {
    color: var(--ct-text-muted) !important;
    pointer-events: none;
}

.ct-empty-state {
    text-align: center;
    color: var(--ct-text-muted);
    padding: 30px 10px;
}

.ct-tabbar {
    background: var(--ct-bg-1);
    border: 1px solid var(--ct-border);
    border-radius: var(--ct-radius-md) var(--ct-radius-md) 0 0;
    overflow: hidden;
}

.ct-tabbar .nav-link {
    color: var(--ct-text-muted) !important;
    border-radius: 0;
}

.ct-tabbar .nav-link.active {
    color: var(--ct-text) !important;
    background: transparent;
    border-bottom-color: var(--ct-primary) !important;
}

.ct-stat {
    text-align: center;
}

.ct-stat-label {
    color: var(--ct-text-muted);
    margin: 0;
    font-size: 0.92rem;
}

.ct-stat-value {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 600;
}

.ct-chip {
    border: 1px solid var(--ct-border);
    background: var(--ct-bg-1);
    color: var(--ct-text-muted);
    border-radius: 999px;
    font-size: 0.8rem;
    padding: 2px 10px;
}

.place-card {
    background: var(--ct-bg-1);
    min-height: 220px;
    transition: transform 0.2s ease;
    width: 150px;
    border-radius: var(--ct-radius-sm);
    border: 1px solid var(--ct-border);
    box-shadow: var(--ct-shadow-sm);
}

.place-card:hover {
    transform: translateY(-3px);
}

.place-card h5 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.place-card .votePercentageBackground {
    background-color: #343a44;
    z-index: 1;
    height: 10px;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    border: 1px solid #23282f;
    margin-top: 3px;
}

.place-card .votePercentageFill {
    background-color: #6e7887;
    height: 10px;
}

.place-card .segment {
    background-color: #242933;
    height: 10px;
    width: 2px;
    position: absolute;
    top: 0;
    z-index: 3;
}

.item-card {
    background: var(--ct-bg-1);
    border: 1px solid var(--ct-border);
    border-radius: var(--ct-radius-sm);
    box-shadow: var(--ct-shadow-sm);
    min-height: 100%;
}

.item-card:hover {
    border-color: #4a5563;
}

.category-list a {
    background-color: var(--ct-bg-1);
    color: var(--ct-text-muted);
    padding: 8px;
    transition: 0.15s;
    box-shadow: var(--ct-shadow-sm);
    margin-top: 6px;
    margin-bottom: 6px;
    text-decoration: none;
    width: 100%;
    display: block;
    border-left: 0 solid transparent;
    border-radius: var(--ct-radius-sm);
}

.category-list a:hover {
    border-left: 5px solid var(--ct-text-muted);
    color: var(--ct-text);
}

.category-list a.selected {
    border-left: 5px solid var(--ct-text);
    color: var(--ct-text);
}

.ct-search-form {
    min-width: 250px;
    max-width: 500px;
}

.ct-search-form-wide {
    min-width: 300px;
}

.ct-search-floating {
    width: 52%;
}

.ct-search-btn {
    min-width: 50px;
}

.ct-aspect-square {
    aspect-ratio: 1/1;
}

.ct-aspect-video {
    aspect-ratio: 16/9;
}

.ct-text-11 {
    font-size: 11px;
}

.ct-text-12 {
    font-size: 12px;
}

.ct-text-13 {
    font-size: 13px;
}

.ct-text-14 {
    font-size: 14px;
}

.ct-text-15 {
    font-size: 15px;
}

.ct-text-17 {
    font-size: 17px;
}

.ct-text-25 {
    font-size: 25px;
}

.ct-overflow-hidden {
    overflow: hidden;
}

.ct-overflow-y-auto {
    overflow-y: auto;
}

.ct-overflow-y-hidden {
    overflow-y: hidden;
}

.ct-market-link {
    text-decoration: none !important;
    color: inherit;
}

.ct-market-text-tickets {
    color: rgb(224, 224, 60) !important;
    font-size: small;
    font-weight: 600;
}

.ct-market-text-robux {
    color: rgb(26, 212, 103) !important;
    font-size: small;
    font-weight: 600;
}

.ct-market-text-limited {
    color: rgb(255,255,255) !important;
    background-color: rgb(9, 136, 62);
    width: fit-content;
    padding-left: 10px;
    font-size: 10px;
    border-top-right-radius: 5px;
    margin: 0;
}

.ct-market-text-limitedu {
    color: rgb(0,0,0) !important;
    background-color: rgb(245, 245, 52);
    padding-right: 3px;
    font-weight: 800;
    border-top-right-radius: 5px;
    padding-left: 3px;
}

.ct-market-text-remaining {
    color: rgb(197, 21, 21) !important;
    font-size: 10px;
    font-weight: 600;
}

.ct-market-image {
    aspect-ratio: 1/1;
}

.ct-market-limited-tag {
    bottom: -1px;
    left: 0;
}

.ct-market-offsale-tag {
    top: 0;
    right: 0;
    border-bottom-left-radius: 10px;
    padding: 5px;
}

.ct-market-serial-tag {
    top: 5px;
    left: 5px;
    aspect-ratio: 1/1;
    font-size: 12px;
}

.ct-market-name {
    font-size: 12px;
}
