/* Create Game page only. Keep selectors scoped under .nobench-page-create-game. */
body.nobench-page-create-game {
    --nb-active-page-css: "create-game";
}

body.nobench-page-create-game .nobench-create-game-shell .nobench-slot-empty,
body.nobench-page-create-game .nobench-create-venue-preview-empty {
    min-height: var(--nb-control-h) !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 16px !important;
    border: 1px solid var(--nb-border-strong) !important;
    border-radius: var(--nb-radius-control) !important;
    background: var(--nb-field-bg) !important;
    color: var(--nb-muted) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
}

body.nobench-page-create-game .nobench-create-game-shell #nobench-available-time-slot-grid .nobench-slot-empty {
    background: var(--nb-field-disabled-bg) !important;
    background-color: var(--nb-field-disabled-bg) !important;
    color: var(--nb-faint) !important;
    -webkit-text-fill-color: var(--nb-faint) !important;
    font-weight: 400 !important;
}

body.nobench-page-create-game .nobench-create-game-shell .nobench-create-date-control.is-empty input[type="date"]:disabled {
    background: var(--nb-field-disabled-bg) !important;
    background-color: var(--nb-field-disabled-bg) !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    caret-color: transparent !important;
    font-weight: 400 !important;
}

body.nobench-page-create-game .nobench-create-game-shell .nobench-create-date-control.is-empty .nobench-date-filter-label {
    font-weight: 400 !important;
}

body.nobench-page-create-game .nobench-create-venue-preview.is-empty,
body.nobench-page-create-game .nobench-create-venue-preview-empty {
    display: none !important;
}

body.nobench-page-create-game .nobench-create-venue-preview:not(.is-empty) {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
}

body.nobench-page-create-game .nobench-create-venue-preview:not(.is-empty) .nobench-create-venue-card {
    width: 100% !important;
    max-width: 100% !important;
}

body.nobench-page-create-game .nobench-visibility-option span {
    min-height: var(--nb-control-h) !important;
    border-radius: var(--nb-radius-pill) !important;
    background: var(--nb-card-inner) !important;
    border: 1px solid var(--nb-border-strong) !important;
    color: var(--nb-text) !important;
    font-size: 14px !important;
    font-weight: 850 !important;
}

body.nobench-page-create-game .nobench-visibility-option input:checked + span {
    background: var(--nb-primary-bg) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

body.nobench-page-create-game .nobench-create-game-shell,
body.nobench-page-create-game .nobench-create-game-form {
    gap: var(--nb-page-card-gap) !important;
}

body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-hero {
    margin-bottom: 0 !important;
}

body.nobench-page-create-game .nobench-create-game-shell :where(
    .nobench-page-hero,
    .nobench-create-step,
    .nobench-create-review,
    .nobench-create-venue-card,
    .nobench-create-venue-map,
    .nobench-private-invites,
    .nobench-invite-avatar-trigger,
    .nobench-create-placeholder,
    .nobench-slot-empty
) {
    border-radius: var(--nb-radius-card) !important;
}

body.nobench-page-create-game .nobench-create-game-shell :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
    select,
    textarea,
    button,
    .nobench-button,
    .nobench-time-slot-option,
    .nobench-visibility-option span
) {
    border-radius: var(--nb-radius-control) !important;
}

.nobench-create-game-form {
    display: grid !important;
    gap: var(--nb-page-card-gap) !important;
}

body.nobench-page-create-game .nobench-create-game-form {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    padding: 0 !important;
}

.nobench-create-game-form > .nobench-create-step,
.nobench-create-game-form > .nobench-create-review,
.nobench-create-game-form > .nobench-create-game-submit {
    margin: 0 !important;
}

body.nobench-page-create-game .nobench-create-game-form > .nobench-create-step,
body.nobench-page-create-game .nobench-create-game-form > .nobench-create-review,
body.nobench-page-create-game .nobench-create-game-form > .nobench-create-game-submit {
    background: rgba(255, 255, 255, 0.07) !important;
    border: 1px solid rgba(215, 231, 255, 0.16) !important;
    box-shadow: none !important;
    color: #f4f7ff !important;
}

body.nobench-page-create-game .nobench-create-game-form > .nobench-create-step.is-locked,
body.nobench-page-create-game .nobench-create-game-form > .nobench-create-review.is-locked {
    background: rgba(255, 255, 255, 0.055) !important;
    border-color: rgba(215, 231, 255, 0.13) !important;
    opacity: 1 !important;
}

body.nobench-page-create-game .nobench-create-step h3,
body.nobench-page-create-game .nobench-create-review h3,
body.nobench-page-create-game .nobench-create-step label,
body.nobench-page-create-game .nobench-create-review strong {
    color: #f7f9ff !important;
}

body.nobench-page-create-game .nobench-create-step p,
body.nobench-page-create-game .nobench-create-step small,
body.nobench-page-create-game .nobench-create-review p,
body.nobench-page-create-game .nobench-create-review small,
body.nobench-page-create-game .nobench-create-review-summary small {
    color: rgba(216, 226, 242, 0.74) !important;
}

body.nobench-page-create-game .nobench-create-step-head > span,
body.nobench-page-create-game .nobench-create-step-icon,
body.nobench-page-create-game .nobench-create-review-icon {
    background: rgba(98, 221, 255, 0.10) !important;
    border-color: rgba(98, 221, 255, 0.22) !important;
    color: #b7efff !important;
}

body.nobench-page-create-game .nobench-create-review-summary,
body.nobench-page-create-game .nobench-create-review-summary div,
body.nobench-page-create-game .nobench-create-venue-preview-empty,
body.nobench-page-create-game .nobench-slot-empty {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(215, 231, 255, 0.15) !important;
    color: #f4f7ff !important;
    box-shadow: none !important;
}

body.nobench-page-create-game .nobench-create-venue-preview {
    background: transparent !important;
}

body.nobench-page-create-game .nobench-create-venue-preview-empty {
    min-height: 42px !important;
    padding: 10px 16px !important;
    display: flex !important;
    align-items: center !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
}

body.nobench-page-create-game .nobench-slot-empty,
#nobench-available-time-slot-grid .nobench-slot-empty {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-height: var(--nb-control-h) !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    border: 1px solid var(--nb-border-strong) !important;
    border-radius: var(--nb-radius-control) !important;
    background: var(--nb-field-bg) !important;
    color: rgba(216, 226, 242, 0.74) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    box-sizing: border-box !important;
}

body.nobench-page-create-game .nobench-create-venue-card,
body.nobench-page-create-game .nobench-create-venue-map {
    background: rgba(18, 26, 42, 0.44) !important;
    border-color: var(--nb-create-card-border, rgba(215, 231, 255, 0.16)) !important;
    color: #f4f7ff !important;
    box-shadow: none !important;
}

body.nobench-page-create-game .nobench-create-venue-card > div:last-child,
body.nobench-page-create-game .nobench-create-venue-map-empty {
    min-height: 124px !important;
    background: rgba(7, 12, 24, 0.42) !important;
    border-top: 1px solid rgba(215, 231, 255, 0.10) !important;
    color: rgba(216, 226, 242, 0.78) !important;
    box-sizing: border-box !important;
}

body.nobench-page-create-game .nobench-create-venue-card h4 {
    color: #f7f9ff !important;
}

body.nobench-page-create-game .nobench-create-venue-card p {
    color: rgba(216, 226, 242, 0.76) !important;
}

body.nobench-page-create-game .nobench-create-venue-map a {
    background: rgba(98, 221, 255, 0.14) !important;
    border: 1px solid rgba(98, 221, 255, 0.30) !important;
    color: #b7efff !important;
}

/* Create Game invite modal and review footer polish */
body.nobench-page-create-game .nobench-create-game-shell {
    position: relative !important;
    isolation: isolate !important;
    --nb-create-card-surface: linear-gradient(135deg, rgba(18, 26, 42, 0.44), rgba(20, 21, 39, 0.44));
    --nb-create-card-border: rgba(215, 231, 255, 0.16);
}

body.nobench-page-create-game .nobench-create-game-shell::before {
    content: "" !important;
    position: fixed !important;
    inset: 54px 0 28px !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(180deg, rgba(3, 7, 16, 0.72), rgba(3, 7, 16, 0.84)),
        linear-gradient(90deg, rgba(5, 9, 20, 0.70), rgba(24, 19, 47, 0.66)),
        url("../images/create-game-bg.png") center center / cover no-repeat !important;
}

body.nobench-page-create-game .nobench-create-game-shell > * {
    position: relative !important;
    z-index: 1 !important;
}

body.nobench-page-create-game .nobench-create-game-shell .nobench-page-hero,
body.nobench-page-create-game .nobench-create-game-shell .nobench-create-step,
body.nobench-page-create-game .nobench-create-game-shell .nobench-create-step.is-locked,
body.nobench-page-create-game .nobench-create-game-shell .nobench-create-review,
body.nobench-page-create-game .nobench-create-game-shell .nobench-create-review.is-locked {
    background: var(--nb-create-card-surface) !important;
    background-color: transparent !important;
    background-image: var(--nb-create-card-surface) !important;
    border-color: var(--nb-create-card-border) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    backdrop-filter: blur(1.5px) saturate(118%) !important;
}

body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-hero,
body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-form > .nobench-create-step,
body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-form > .nobench-create-review {
    background: var(--nb-create-card-surface) !important;
    background-color: transparent !important;
    background-image: var(--nb-create-card-surface) !important;
    border: 1px solid var(--nb-create-card-border) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    backdrop-filter: blur(1.5px) saturate(118%) !important;
}

body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-hero::before,
body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-hero::after,
body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-form > .nobench-create-step::before,
body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-form > .nobench-create-step::after,
body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-form > .nobench-create-review::before,
body.nobench-page-create-game .nobench-create-game-shell > .nobench-create-game-form > .nobench-create-review::after {
    content: none !important;
    display: none !important;
}

body.nobench-page-create-game .nobench-create-review {
    grid-template-columns: minmax(260px, 1fr) minmax(320px, 420px) auto !important;
    align-items: center !important;
    gap: var(--nb-card-pad) !important;
    overflow: hidden !important;
}

body.nobench-page-create-game .nobench-create-review > div:first-child {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
}

body.nobench-page-create-game .nobench-create-review > div:first-child p {
    max-width: 520px !important;
}

body.nobench-page-create-game .nobench-create-review-head h3 {
    margin: 0 !important;
}

body.nobench-page-create-game .nobench-create-review-head p {
    margin: 4px 0 0 !important;
}

body.nobench-page-create-game .nobench-create-review-summary {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 8px !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.nobench-page-create-game .nobench-create-review-summary div {
    min-width: 0 !important;
    padding: 10px 12px !important;
    background: rgba(255, 255, 255, 0.075) !important;
    background-color: rgba(255, 255, 255, 0.075) !important;
    border: 1px solid rgba(215, 231, 255, 0.16) !important;
    border-radius: var(--nb-radius-control) !important;
}

body.nobench-page-create-game .nobench-create-review-summary small {
    grid-column: 1 / -1 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
}

body.nobench-page-create-game .nobench-create-review > button {
    white-space: nowrap !important;
    justify-self: end !important;
}

body.nobench-page-create-game .nobench-create-date-control {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

body.nobench-page-create-game .nobench-create-game-form .nobench-create-date-control input[type="date"] {
    width: 100% !important;
    min-height: 44px !important;
    padding: 0 48px 0 16px !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    caret-color: transparent !important;
    cursor: pointer !important;
}

body.nobench-page-create-game .nobench-create-game-form .nobench-create-date-control input[type="date"]:focus {
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}

body.nobench-page-create-game .nobench-create-game-form .nobench-create-date-control input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0 !important;
    cursor: pointer !important;
}

body.nobench-page-create-game .nobench-create-date-control .nobench-date-filter-label {
    position: absolute !important;
    left: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: rgba(216, 226, 242, 0.74) !important;
    pointer-events: none !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

body.nobench-page-create-game .nobench-create-date-control:not(.is-empty) .nobench-date-filter-label {
    color: #f7f9ff !important;
}

body.nobench-page-create-game .nobench-create-date-control::after {
    content: "" !important;
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    width: 8px !important;
    height: 8px !important;
    border-right: 2px solid rgba(216, 226, 242, 0.78) !important;
    border-bottom: 2px solid rgba(216, 226, 242, 0.78) !important;
    transform: translateY(-68%) rotate(45deg) !important;
    pointer-events: none !important;
}

body.nobench-page-create-game .nobench-private-invites-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
}

body.nobench-page-create-game .nobench-invite-summary,
body.nobench-page-create-game .nobench-invite-avatar-trigger {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(215, 231, 255, 0.14) !important;
    border-radius: 8px !important;
    background: rgba(2, 6, 14, 0.34) !important;
    color: rgba(216, 226, 242, 0.78) !important;
    width: 100% !important;
    min-height: 54px !important;
    box-shadow: none !important;
    text-align: left !important;
}

body.nobench-page-create-game .nobench-invite-avatar-trigger:hover {
    border-color: rgba(98, 221, 255, 0.34) !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

body.nobench-page-create-game .nobench-invite-avatar-stack {
    display: flex !important;
    align-items: center !important;
    min-width: 118px !important;
}

body.nobench-page-create-game .nobench-invite-avatar,
body.nobench-page-create-game .nobench-invite-empty-avatar {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    border: 2px solid rgba(2, 6, 14, 0.86) !important;
    background: rgba(255, 255, 255, 0.10) !important;
    color: #62ddff !important;
    font-weight: 800 !important;
    overflow: hidden !important;
}

body.nobench-page-create-game .nobench-invite-avatar:not(:first-child),
body.nobench-page-create-game .nobench-invite-empty-avatar:not(:first-child) {
    margin-left: -10px !important;
}

body.nobench-page-create-game .nobench-invite-empty-avatar {
    border-style: dashed !important;
    border-color: rgba(215, 231, 255, 0.24) !important;
    background: rgba(255, 255, 255, 0.055) !important;
}

body.nobench-page-create-game .nobench-invite-empty-avatar::before {
    content: "" !important;
    width: 14px !important;
    height: 14px !important;
    border-radius: 999px !important;
    background: rgba(216, 226, 242, 0.24) !important;
}

body.nobench-page-create-game .nobench-invite-empty-avatar.is-filled {
    border-style: solid !important;
    border-color: rgba(98, 221, 255, 0.38) !important;
    background: rgba(2, 6, 14, 0.46) !important;
}

body.nobench-page-create-game .nobench-invite-empty-avatar.is-filled::before {
    content: none !important;
}

body.nobench-page-create-game .nobench-invite-avatar img,
body.nobench-page-create-game .nobench-invite-empty-avatar.is-filled img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: inherit !important;
}

body.nobench-page-create-game .nobench-invite-avatar[hidden],
body.nobench-page-create-game .nobench-invite-empty-avatar[hidden] {
    display: none !important;
}

body.nobench-page-create-game .nobench-invite-friend-card[hidden] {
    display: none !important;
}

body.nobench-page-create-game .nobench-invite-friend-card {
    display: grid !important;
    grid-template-columns: auto 44px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px !important;
    cursor: pointer !important;
}

body.nobench-page-create-game .nobench-invite-friend-card span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.nobench-page-create-game .nobench-invite-friend-card:has(input:checked) {
    background: rgba(37, 99, 235, 0.18) !important;
    border-color: rgba(98, 221, 255, 0.42) !important;
}

body.nobench-page-create-game .nobench-invite-friend-card input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-content: center !important;
    border: 1px solid rgba(215, 231, 255, 0.34) !important;
    border-radius: 5px !important;
    background: rgba(2, 6, 14, 0.46) !important;
    box-shadow: none !important;
    outline: 0 !important;
}

body.nobench-page-create-game .nobench-invite-friend-card input[type="checkbox"]::after {
    content: "" !important;
    width: 8px !important;
    height: 4px !important;
    border-left: 2px solid #ffffff !important;
    border-bottom: 2px solid #ffffff !important;
    transform: rotate(-45deg) scale(0) !important;
    transform-origin: center !important;
}

body.nobench-page-create-game .nobench-invite-friend-card input[type="checkbox"]:checked {
    background: var(--nb-button-primary-bg) !important;
    border-color: transparent !important;
}

body.nobench-page-create-game .nobench-invite-friend-card input[type="checkbox"]:checked::after {
    transform: rotate(-45deg) scale(1) !important;
}

body.nobench-page-create-game .nobench-invite-modal[hidden] {
    display: none !important;
}

body.nobench-page-create-game .nobench-invite-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 10050 !important;
    min-height: 100dvh !important;
    width: 100vw !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    transform: none !important;
}

body.nobench-page-create-game .nobench-invite-modal-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(2, 6, 14, 0.76) !important;
    backdrop-filter: blur(6px) !important;
}

body.nobench-page-create-game .nobench-invite-modal-panel {
    position: relative !important;
    z-index: 1 !important;
    width: min(620px, calc(100vw - 32px)) !important;
    max-height: min(82dvh, 720px) !important;
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto !important;
    gap: 16px !important;
    padding: var(--nb-card-pad) !important;
    border: 1px solid var(--nb-border-strong) !important;
    border-radius: var(--nb-radius-card) !important;
    background: var(--nb-card-surface) !important;
    color: var(--nb-text) !important;
    box-shadow: none !important;
    backdrop-filter: blur(18px) saturate(118%) !important;
}

body.nobench-page-create-game .nobench-invite-modal-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 16px !important;
}

body.nobench-page-create-game .nobench-invite-modal-head h3,
body.nobench-page-create-game .nobench-invite-modal-head p {
    margin: 0 !important;
}

body.nobench-page-create-game .nobench-invite-modal-head p {
    margin-top: 6px !important;
    color: rgba(216, 226, 242, 0.76) !important;
}

body.nobench-page-create-game .nobench-invite-picker {
    position: relative !important;
    display: block !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-toggle {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    text-align: left !important;
    cursor: pointer !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-toggle:disabled {
    cursor: not-allowed !important;
    opacity: 0.68 !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-caret {
    width: 8px !important;
    height: 8px !important;
    border-right: 2px solid rgba(216, 226, 242, 0.78) !important;
    border-bottom: 2px solid rgba(216, 226, 242, 0.78) !important;
    transform: rotate(45deg) !important;
    flex: 0 0 auto !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-menu[hidden] {
    display: none !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-menu {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    z-index: 3 !important;
    max-height: 260px !important;
    overflow: auto !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 8px !important;
    border: 1px solid var(--nb-border-strong) !important;
    border-radius: var(--nb-radius-card) !important;
    background: var(--nb-card-surface) !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-option {
    width: 100% !important;
    min-height: 52px !important;
    padding: 8px 10px !important;
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    border: 1px solid rgba(215, 231, 255, 0.12) !important;
    border-radius: var(--nb-radius-control) !important;
    background: rgba(255, 255, 255, 0.055) !important;
    color: var(--nb-text) !important;
    -webkit-text-fill-color: var(--nb-text) !important;
    font: inherit !important;
    font-weight: 800 !important;
    text-align: left !important;
    cursor: pointer !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-option:hover {
    background: rgba(37, 99, 235, 0.18) !important;
    border-color: rgba(98, 221, 255, 0.34) !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-option img {
    width: 40px !important;
    height: 40px !important;
    border-radius: 999px !important;
    object-fit: cover !important;
}

body.nobench-page-create-game .nobench-invite-dropdown-option span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.nobench-page-create-game .nobench-invite-modal .nobench-invite-friend-grid {
    display: grid !important;
    overflow: auto !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding-right: 4px !important;
    min-height: 64px !important;
}

body.nobench-page-create-game .nobench-invite-modal-actions {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

body.nobench-page-create-game .nobench-invite-modal-open,
body.nobench-page-create-game .nobench-invite-modal-close,
body.nobench-page-create-game .nobench-invite-clear {
    min-height: 40px !important;
}

body.nobench-page-create-game .nobench-invite-clear {
    background: linear-gradient(135deg, #dc2626, #ef4444) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

body.nobench-page-create-game .nobench-invite-clear:hover {
    background: linear-gradient(135deg, #b91c1c, #dc2626) !important;
    color: #ffffff !important;
}

@media (max-width: 1100px) {
    body.nobench-page-create-game .nobench-create-review {
        grid-template-columns: 1fr !important;
    }

    body.nobench-page-create-game .nobench-create-review > button {
        justify-self: stretch !important;
    }
}

@media (max-width: 640px) {
    body.nobench-page-create-game .nobench-create-game-shell::before {
        inset: 68px 0 30px !important;
        background:
            linear-gradient(180deg, rgba(3, 7, 16, 0.78), rgba(3, 7, 16, 0.88)),
            linear-gradient(90deg, rgba(5, 9, 20, 0.76), rgba(24, 19, 47, 0.72)),
            url("../images/create-game-bg.png") center center / cover no-repeat !important;
    }

    body.nobench-page-create-game .nobench-private-invites-head,
    body.nobench-page-create-game .nobench-invite-modal-head,
    body.nobench-page-create-game .nobench-invite-picker,
    body.nobench-page-create-game .nobench-invite-modal-actions {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    body.nobench-page-create-game .nobench-invite-picker {
        width: 100% !important;
    }

    body.nobench-page-create-game .nobench-invite-modal {
        padding: 12px !important;
    }
}