.mobile-bloc-builder {
    position: fixed;
    left: 0;
    right: 0;
    top: var(--mobile-app-header-height, calc(env(safe-area-inset-top, 0px) + 116px));
    /* Floor-anchored so the panel fully occludes the tab underneath it.
       Stopping short of the bottom leaves a strip where the Moments feed
       shows through beneath the nav. Nav clearance lives in __body's padding. */
    bottom: 0;
    z-index: 9000;
    display: none;
    background:
        radial-gradient(circle at 50% -12%, color-mix(in srgb, var(--primary-color, var(--accent-color)) 9%, transparent), transparent 29%),
        var(--bg-primary);
    background-size: auto;
    color: var(--text-primary, var(--text-color));
    overflow: hidden;
}
.mobile-bloc-builder.is-open {
    display: flex;
    flex-direction: column;
}
.mobile-bloc-builder.is-home-embedded .mobile-bloc-builder__top {
    display: none;
}
.mobile-bloc-builder.is-home-embedded .mobile-bloc-builder__body {
    padding: 10px 0 14px;
}
.mobile-bloc-builder.is-home-embedded .mobile-bloc-builder__bottom {
    display: none !important;
}
.mobile-bloc-builder__top {
    flex: 0 0 auto;
    padding: calc(13px + env(safe-area-inset-top, 0px)) 70px 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    min-height: calc(54px + env(safe-area-inset-top, 0px));
    border-bottom: 1px solid color-mix(in srgb, var(--text-color) 6%, transparent);
    background: color-mix(in srgb, var(--bg-primary) 94%, transparent);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}
.mobile-bloc-builder__icon-btn {
    width: auto;
    height: auto;
    min-width: 40px;
    min-height: 32px;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    outline: 0;
    color: var(--text-primary, var(--text-color));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
    cursor: pointer;
    position: absolute;
    top: calc(12px + env(safe-area-inset-top, 0px));
    z-index: 2;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
}
.mobile-bloc-builder__back-btn {
    gap: 7px;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: 0.02em;
}
.mobile-bloc-builder__back-btn span {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    font: inherit;
}
.mobile-bloc-builder__icon-btn i {
    color: currentColor !important;
    -webkit-text-fill-color: currentColor !important;
    background: transparent !important;
    box-shadow: none !important;
    pointer-events: none;
}
.mobile-bloc-builder__icon-btn::before,
.mobile-bloc-builder__icon-btn::after {
    display: none !important;
    content: none !important;
}
.mobile-bloc-builder__icon-btn:active {
    opacity: 0.62;
    transform: scale(0.96);
}
.mobile-bloc-builder__icon-btn:first-child {
    left: 16px;
}
.mobile-bloc-builder__icon-btn:last-child {
    right: 16px;
}
.mobile-bloc-builder__top-center {
    min-width: 0;
    width: 100%;
    padding: 0 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
}
.mobile-bloc-builder__prefs-btn,
.mobile-bloc-builder__prefs-btn i {
    color: var(--text-primary, var(--text-color)) !important;
    -webkit-text-fill-color: var(--text-primary, var(--text-color)) !important;
    background: transparent !important;
    box-shadow: none !important;
}
.mobile-bloc-builder__kicker {
    order: 2;
    margin-top: 6px;
    color: var(--text-secondary);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    text-align: center;
}
.mobile-bloc-builder__title {
    order: 1;
    margin-top: 0;
    font-size: 14px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-bloc-builder__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 18px 88px;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body {
    padding: 14px 16px 22px;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__body {
    padding: 8px 16px 92px;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__top {
    padding-top: calc(18px + env(safe-area-inset-top, 0px));
    padding-bottom: 4px;
    min-height: calc(58px + env(safe-area-inset-top, 0px));
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__icon-btn {
    top: calc(16px + env(safe-area-inset-top, 0px));
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__title {
    font-size: 16px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__kicker {
    display: none;
}
.mobile-bloc-builder.is-settings-mode {
    background: #ffffff;
}
.mobile-bloc-builder.is-settings-mode .mobile-bloc-builder__top,
.mobile-bloc-builder.is-settings-mode .mobile-bloc-builder__body,
.mobile-bloc-builder.is-settings-mode .mobile-bloc-builder__list {
    background: #ffffff;
}
.mobile-bloc-builder.is-settings-mode .mobile-bloc-builder__prefs-btn {
    display: none !important;
}
.mobile-bloc-builder.is-settings-mode .mobile-bloc-builder__summary {
    border-bottom-color: rgba(17, 17, 17, 0.08);
}
.mobile-bloc-builder__summary {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    padding: 8px 0 15px;
    border-bottom: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__summary {
    display: none;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary {
    align-items: center;
    padding: 4px 0 10px;
    gap: 12px;
    border-bottom-color: transparent;
}
.mobile-bloc-builder__summary-title {
    font-size: 31px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: 0;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary-title {
    display: -webkit-box;
    font-size: clamp(20px, 6vw, 27px);
    line-height: 1.02;
    max-width: 100%;
    overflow: hidden;
    overflow-wrap: anywhere;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary-meta {
    margin-top: 6px;
    font-size: 10px;
    letter-spacing: 0.14em;
}
.mobile-bloc-builder__summary-meta {
    margin-top: 8px;
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.mobile-bloc-builder__pill {
    border: 1px solid color-mix(in srgb, var(--text-color) 14%, transparent);
    background: transparent;
    color: var(--text-primary, var(--text-color));
    border-radius: 999px;
    min-height: 38px;
    padding: 0 16px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__pill {
    min-height: 34px;
    padding: 0 13px;
    font-size: 10px;
    letter-spacing: 0.12em;
    color: var(--text-primary, var(--text-color));
    background: color-mix(in srgb, var(--text-color) 5%, transparent);
}
.mobile-bloc-builder__search {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 46px;
    min-height: 46px;
    margin: 0 0 12px;
    padding: 0 14px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--text-color) 5%, transparent);
    border: 1px solid color-mix(in srgb, var(--text-color) 8%, transparent);
    color: var(--text-secondary);
    flex: 0 0 auto;
}
.mobile-bloc-builder__search:focus-within {
    border-color: color-mix(in srgb, var(--primary-color, var(--accent-color)) 36%, transparent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color, var(--accent-color)) 10%, transparent);
}
.mobile-bloc-builder__search[hidden] {
    display: none !important;
}
.mobile-bloc-builder__search input {
    min-width: 0;
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-primary, var(--text-color));
    font: inherit;
    font-size: 16px;
    font-weight: 750;
    line-height: 1.2;
    appearance: none;
    -webkit-appearance: none;
}
.mobile-bloc-builder__search input::placeholder {
    color: var(--text-secondary);
}
.mobile-bloc-builder__list {
    display: flex;
    flex-direction: column;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__list {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 0;
    align-items: stretch;
    padding-top: 0;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__list {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 18px;
    padding: 2px 4px 118px;
    min-height: 120px;
}
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.mobile-bloc-builder__detail-hero {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 10px;
    border: 1px solid color-mix(in srgb, var(--text-color) 8%, transparent);
    border-radius: 20px;
    background:
        radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--primary-color, var(--accent-color)) 10%, transparent), transparent 42%),
        color-mix(in srgb, var(--surface-color, var(--bg-primary)) 76%, transparent);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text-color) 5%, transparent);
}
.mobile-bloc-builder__detail-preview {
    width: 88px;
    height: 88px;
    border-radius: 19px;
    overflow: hidden;
    position: relative;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--primary-color, var(--accent-color)) 20%, transparent), transparent 48%),
        color-mix(in srgb, var(--surface-color, var(--bg-primary)) 84%, var(--text-color) 8%);
    color: var(--text-secondary);
    font-size: 26px;
}
.mobile-bloc-builder__detail-preview img,
.mobile-bloc-builder__detail-preview video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.mobile-bloc-builder__detail-actions {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 7px;
}
.mobile-bloc-builder__field {
    min-width: 0;
    display: grid;
    gap: 5px;
}
.mobile-bloc-builder__field span {
    color: var(--text-secondary);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.mobile-bloc-builder__name-input,
.mobile-bloc-builder__privacy-input {
    width: 100%;
    min-height: 38px;
    padding: 0 11px;
    border: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
    border-radius: 13px;
    background: color-mix(in srgb, var(--bg-primary) 82%, transparent);
    color: var(--text-primary, var(--text-color));
    font-size: 14px;
    font-weight: 900;
    outline: 0;
}
.mobile-bloc-builder__privacy-input {
    appearance: none;
    -webkit-appearance: none;
    background:
        linear-gradient(45deg, transparent 50%, var(--text-secondary) 50%) right 13px center / 6px 6px no-repeat,
        linear-gradient(135deg, var(--text-secondary) 50%, transparent 50%) right 8px center / 6px 6px no-repeat,
        color-mix(in srgb, var(--bg-primary) 82%, transparent);
}
.mobile-bloc-builder__name-input:focus,
.mobile-bloc-builder__privacy-input:focus {
    border-color: color-mix(in srgb, var(--primary-color, var(--accent-color)) 55%, transparent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color, var(--accent-color)) 12%, transparent);
}
.mobile-bloc-builder__edit-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
}
.mobile-bloc-builder__image-btn,
.mobile-bloc-builder__save-name-btn {
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-color) 6%, transparent);
    color: var(--text-primary, var(--text-color));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
}
.mobile-bloc-builder__save-name-btn {
    background: color-mix(in srgb, var(--primary-color, var(--accent-color)) 18%, transparent);
    border-color: color-mix(in srgb, var(--primary-color, var(--accent-color)) 34%, transparent);
}
.mobile-bloc-builder__image-btn:disabled,
.mobile-bloc-builder__save-name-btn:disabled {
    opacity: 0.62;
}
.mobile-bloc-builder__row {
    width: 100%;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
    background: transparent;
    color: var(--text-primary, var(--text-color));
    display: grid;
    grid-template-columns: 34px 54px minmax(0, 1fr) 62px;
    align-items: center;
    gap: 13px;
    padding: 18px 0;
    text-align: left;
    cursor: pointer;
}
.mobile-bloc-builder__row--bloc {
    grid-template-columns: 52px minmax(0, 1fr) 42px;
    gap: 14px;
    min-height: 82px;
    padding: 14px 0;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc {
    min-height: 92px;
    height: auto;
    aspect-ratio: auto;
    padding: 10px 18px;
    border: 0;
    border-bottom: 1px solid rgba(17, 17, 17, 0.08);
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) 34px;
    grid-template-rows: none;
    align-items: center;
    gap: 12px;
    overflow: hidden;
    position: relative;
    isolation: isolate;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc {
    display: grid !important;
    width: 100% !important;
    min-height: 216px;
    height: auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    border: 1px solid color-mix(in srgb, var(--text-color) 12%, transparent);
    border-radius: 24px;
    padding: 10px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--text-color) 5%, transparent), color-mix(in srgb, var(--text-color) 2%, transparent)),
        color-mix(in srgb, var(--surface-color, var(--bg-primary)) 88%, transparent);
    box-shadow:
        0 18px 38px color-mix(in srgb, #000 24%, transparent),
        inset 0 1px 0 color-mix(in srgb, var(--text-color) 7%, transparent);
    overflow: hidden;
    color: var(--text-primary, var(--text-color));
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc:active {
    transform: scale(0.985);
}
.mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-index {
    display: none;
}
.mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb {
    width: 52px;
    height: 52px;
    border-radius: 16px;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb {
    grid-column: 1;
    width: 76px;
    height: 72px;
    border-radius: 15px;
    background: rgba(17, 17, 17, 0.05);
    font-size: 24px;
    color: rgba(17, 17, 17, 0.52);
    position: relative;
    z-index: 0;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb {
    grid-row: 1;
    grid-column: 1;
    display: grid !important;
    place-items: center;
    width: 100% !important;
    min-height: 180px;
    aspect-ratio: 16 / 10;
    height: auto;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text-color) 12%, transparent);
    opacity: 1 !important;
    visibility: visible !important;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(1.02) contrast(1.02);
}
.mobile-bloc-builder__bloc-shade {
    display: none;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__bloc-shade {
    display: none;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__bloc-shade {
    background:
        linear-gradient(180deg, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.12) 100%);
}
.mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy {
    max-width: 100%;
    overflow: hidden;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy {
    grid-column: 2;
    position: relative;
    z-index: 2;
    padding: 0;
    gap: 6px;
    color: #111111;
    -webkit-text-fill-color: #111111;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy {
    display: flex !important;
    padding: 12px 4px 2px;
    color: var(--text-primary, var(--text-color));
    -webkit-text-fill-color: var(--text-primary, var(--text-color));
    opacity: 1 !important;
    visibility: visible !important;
}
.mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title {
    display: -webkit-box;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 17px;
    line-height: 1.08;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title {
    font-size: 17px;
    line-height: 1.08;
    font-weight: 760;
    letter-spacing: 0;
    -webkit-line-clamp: 2;
    text-shadow: none;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title {
    font-size: 24px;
    line-height: 1.02;
    text-shadow: none;
}
.mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta {
    display: block;
    max-width: 100%;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta {
    display: flex;
    align-items: center;
    gap: 7px;
    max-width: 100%;
    color: rgba(17, 17, 17, 0.54);
    -webkit-text-fill-color: rgba(17, 17, 17, 0.54);
    font-size: 10px;
    letter-spacing: 0.02em;
    text-transform: none;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta {
    color: var(--text-secondary, rgba(255,255,255,0.62));
    -webkit-text-fill-color: var(--text-secondary, rgba(255,255,255,0.62));
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta span + span::before {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 999px;
    display: inline-block;
    margin-right: 7px;
    vertical-align: middle;
    background: rgba(255,255,255,0.42);
}
.mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions {
    width: 42px;
    justify-content: flex-end;
    gap: 10px;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions {
    position: static;
    grid-column: 3;
    z-index: 3;
    width: auto;
    gap: 0;
}
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions {
    top: 12px;
    right: 12px;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions > .fa-chevron-right {
    display: none;
}
.mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn {
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
    color: var(--text-secondary);
    font-size: 13px;
}
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn {
    width: 31px;
    height: 31px;
    border-radius: 999px;
    background: rgba(17, 17, 17, 0.05);
    color: #111111;
    -webkit-text-fill-color: #111111;
    border: 1px solid rgba(17, 17, 17, 0.08);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    font-size: 12px;
}
.mobile-bloc-builder__row--byte {
    grid-template-columns: 26px 62px minmax(0, 1fr) 78px;
    gap: 12px;
    align-items: center;
    min-height: 94px;
    padding: 0 12px 12px;
    border: 1px solid color-mix(in srgb, var(--text-color) 9%, transparent);
    border-radius: 22px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--text-color) 5%, transparent), color-mix(in srgb, var(--text-color) 2%, transparent)),
        color-mix(in srgb, var(--surface-color, var(--bg-primary)) 70%, transparent);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--text-color) 5%, transparent);
    overflow: hidden;
}
.mobile-bloc-builder__row--byte .mobile-bloc-builder__row-index {
    align-self: center;
    color: color-mix(in srgb, var(--text-secondary) 76%, transparent);
    letter-spacing: 0.06em;
}
.mobile-bloc-builder__row--byte .mobile-bloc-builder__row-thumb {
    width: 62px;
    height: 62px;
    border-radius: 16px;
}
.mobile-bloc-builder__row--byte .mobile-bloc-builder__row-copy {
    min-width: 0;
    overflow: hidden;
}
.mobile-bloc-builder__row--byte .mobile-bloc-builder__row-title {
    display: -webkit-box;
    white-space: normal;
    overflow: hidden;
    overflow-wrap: anywhere;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 15px;
    line-height: 1.12;
}
.mobile-bloc-builder__row--byte .mobile-bloc-builder__row-meta {
    display: block;
    max-width: 100%;
    margin-top: 2px;
}
.mobile-bloc-builder__row--byte .mobile-bloc-builder__row-actions {
    display: grid;
    grid-template-columns: repeat(2, 34px);
    gap: 6px;
    justify-content: end;
    align-items: center;
    width: 74px;
}
.mobile-bloc-builder__row-index {
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.12em;
}
.mobile-bloc-builder__row-thumb {
    width: 54px;
    height: 54px;
    border-radius: 17px;
    overflow: hidden;
    background: color-mix(in srgb, var(--surface-color, var(--bg-primary)) 88%, var(--text-color) 8%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    font-size: 16px;
}
.mobile-bloc-builder__row-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.mobile-bloc-builder__row-thumb video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.mobile-bloc-builder__row-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.mobile-bloc-builder__row-title {
    font-size: 16px;
    font-weight: 900;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-bloc-builder__row-meta {
    margin-top: 0;
    color: var(--text-secondary);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-bloc-builder__more-btn {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text-primary, var(--text-color));
    background: color-mix(in srgb, var(--text-color) 8%, transparent);
    font-size: 12px;
    flex: 0 0 auto;
    cursor: pointer;
    pointer-events: auto;
}
.mobile-bloc-builder__row-actions {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.mobile-bloc-builder__bloc-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    color: var(--text-secondary);
}
.mobile-bloc-builder__bloc-actions > i {
    font-size: 12px;
}
.mobile-bloc-builder__move-btn {
    width: 34px;
    height: 32px;
    border: 1px solid color-mix(in srgb, var(--text-color) 8%, transparent);
    border-radius: 11px;
    background: color-mix(in srgb, var(--text-color) 5%, transparent);
    color: var(--text-secondary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.mobile-bloc-builder__move-btn:disabled {
    opacity: 0.25;
}
.mobile-bloc-builder__edit-btn {
    width: 34px;
    height: 32px;
    border: 1px solid color-mix(in srgb, var(--text-color) 8%, transparent);
    border-radius: 11px;
    background: color-mix(in srgb, var(--text-color) 5%, transparent);
    color: var(--text-primary, var(--text-color));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 13px;
}
.mobile-bloc-builder__delete-btn {
    width: 34px;
    height: 32px;
    border: 1px solid color-mix(in srgb, #ef4444 18%, transparent);
    border-radius: 11px;
    background: color-mix(in srgb, #ef4444 10%, transparent);
    color: color-mix(in srgb, #ef4444 82%, var(--text-primary, var(--text-color)));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 13px;
}
.mobile-bloc-builder__settings-group {
    padding: 18px 0 6px;
    border-bottom: 1px solid color-mix(in srgb, var(--text-color) 10%, transparent);
}
.mobile-bloc-builder__settings-label {
    color: var(--text-secondary);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.mobile-bloc-builder__settings-row {
    min-height: 62px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 12px 0;
    border-top: 1px solid color-mix(in srgb, var(--text-color) 8%, transparent);
    color: var(--text-primary, var(--text-color));
    cursor: pointer;
}
.mobile-bloc-builder.is-settings-mode .mobile-bloc-builder__settings-row {
    background: #ffffff;
}
.mobile-bloc-builder__settings-title,
.mobile-bloc-builder__settings-meta {
    display: block;
}
.mobile-bloc-builder__settings-title {
    font-size: 15px;
    font-weight: 850;
    line-height: 1.2;
}
.mobile-bloc-builder__settings-meta {
    margin-top: 4px;
    color: var(--text-secondary);
    font-size: 12px;
    line-height: 1.3;
}
.mobile-bloc-builder__settings-row input {
    flex: 0 0 auto;
    accent-color: var(--primary-color, var(--accent-color));
}
.mobile-bloc-builder__empty {
    grid-column: 1 / -1;
    min-height: 42vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: min(100%, 320px);
    margin: 0 auto;
    padding: 44px 22px;
    text-align: center;
    color: var(--text-primary, var(--text-color));
}
.mobile-bloc-builder__empty-title {
    max-width: 300px;
    font-size: 27px;
    line-height: 1.08;
    font-weight: 950;
    letter-spacing: 0;
}
.mobile-bloc-builder__empty-copy {
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.4;
    max-width: 260px;
}
.mobile-bloc-builder__bottom {
    position: static;
    left: 0;
    right: 0;
    bottom: auto;
    padding: 8px 18px 14px;
    background: #ffffff;
    display: none;
    gap: 10px;
    z-index: 1;
}
.mobile-bloc-builder.is-open .mobile-bloc-builder__bottom {
    display: flex;
}
.mobile-bloc-builder__primary {
    min-height: 52px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 950;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
}
.mobile-bloc-builder__primary {
    flex: 1 1 auto;
    border: 1px solid rgba(17, 17, 17, 0.12);
    background: #111111;
    color: #ffffff;
}

/* Premium Blocs tab list */
.mobile-bloc-builder.is-list-mode,
html body .mobile-bloc-builder.is-list-mode {
    background: #ffffff !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body {
    padding: 6px 0 calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    background: #ffffff !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__list,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__list,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__list,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc {
    width: 100% !important;
    min-height: 112px !important;
    height: auto !important;
    aspect-ratio: auto !important;
    display: grid !important;
    grid-template-columns: 84px minmax(0, 1fr) 36px !important;
    grid-template-rows: none !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 14px 28px 14px 22px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
    overflow: hidden !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    transform: none !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc:active,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc:active {
    background: rgba(17, 17, 17, 0.035) !important;
    transform: none !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 84px !important;
    height: 84px !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    display: grid !important;
    place-items: center !important;
    background: #f4f4f4 !important;
    box-shadow: inset 0 0 0 1px rgba(17, 17, 17, 0.06) !important;
    color: rgba(17, 17, 17, 0.42) !important;
    font-size: 22px !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb img,
.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb video,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb img,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    filter: saturate(1.03) contrast(1.02) !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__bloc-shade,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__bloc-shade,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__bloc-shade,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__bloc-shade {
    display: none !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    display: grid !important;
    gap: 8px !important;
    padding: 0 !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title {
    display: -webkit-box !important;
    max-width: 100% !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    font-size: 20px !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    text-shadow: none !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    max-width: 100% !important;
    color: rgba(17, 17, 17, 0.56) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.56) !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta span,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta span + span::before,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta span + span::before {
    content: "" !important;
    display: inline-block !important;
    width: 4px !important;
    height: 4px !important;
    margin-right: 7px !important;
    border-radius: 999px !important;
    vertical-align: middle !important;
    background: rgba(17, 17, 17, 0.24) !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions,
.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions,
html body .mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    position: static !important;
    width: 36px !important;
    display: grid !important;
    place-items: center !important;
    gap: 0 !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions > .fa-chevron-right,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions > .fa-chevron-right {
    display: none !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn:active,
html body .mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn:active {
    background: rgba(17, 17, 17, 0.06) !important;
}

/* Premium Bloc detail/editor */
.mobile-bloc-builder.is-detail-mode,
html body .mobile-bloc-builder.is-detail-mode {
    background: #ffffff !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__body,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__body {
    padding: 0 0 calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    background: #ffffff !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 64px !important;
    padding: 10px 24px !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    background: #ffffff !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary-title,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary-title {
    display: none !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary-meta,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary-meta {
    margin-top: 0 !important;
    color: rgba(17, 17, 17, 0.62) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.62) !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
    font-weight: 780 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__pill,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__pill {
    min-height: 38px !important;
    padding: 0 16px !important;
    border: 1px solid rgba(17, 17, 17, 0.12) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: rgba(17, 17, 17, 0.86) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.86) !important;
    box-shadow: 0 10px 24px rgba(17, 17, 17, 0.06) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: 0.14em !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__list,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__list {
    gap: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-hero,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-hero {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    align-items: start !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 14px 28px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-preview,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-preview {
    width: 92px !important;
    height: 92px !important;
    border-radius: 20px !important;
    background: #f4f4f4 !important;
    box-shadow: inset 0 0 0 1px rgba(17, 17, 17, 0.06) !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-actions,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-actions {
    display: grid !important;
    justify-items: center !important;
    gap: 8px !important;
    width: min(100%, 312px) !important;
    max-width: 312px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-title,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-title {
    display: none !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__field,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__field {
    gap: 6px !important;
    width: 100% !important;
    justify-items: center !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__field span,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__field span {
    color: rgba(17, 17, 17, 0.52) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.52) !important;
    font-size: 10px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: 0.12em !important;
    text-align: center !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__name-input,
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__name-input,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input {
    width: 100% !important;
    min-height: 42px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(17, 17, 17, 0.10) !important;
    border-radius: 15px !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    caret-color: #111111 !important;
    font-size: 18px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    color-scheme: light !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input {
    padding-right: 42px !important;
    background:
        linear-gradient(45deg, transparent 50%, rgba(17,17,17,0.62) 50%) right 20px center / 7px 7px no-repeat,
        linear-gradient(135deg, rgba(17,17,17,0.62) 50%, transparent 50%) right 15px center / 7px 7px no-repeat,
        #ffffff !important;
    background-color: #ffffff !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input {
    appearance: none !important;
    -webkit-appearance: none !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__name-input:focus,
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input:focus,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__name-input:focus,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input:focus {
    border-color: rgba(17, 17, 17, 0.22) !important;
    box-shadow: 0 0 0 3px rgba(17, 17, 17, 0.04) !important;
    -webkit-box-shadow: 0 0 0 3px rgba(17, 17, 17, 0.04) !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__edit-row,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__edit-row {
    display: grid !important;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr) !important;
    gap: 8px !important;
    width: 100% !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__image-btn,
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__save-name-btn,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__image-btn,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__save-name-btn {
    flex: 1 1 0 !important;
    min-height: 38px !important;
    justify-content: center !important;
    text-align: center !important;
    border: 1px solid rgba(17, 17, 17, 0.12) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: rgba(17, 17, 17, 0.84) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.84) !important;
    box-shadow: 0 8px 18px rgba(17, 17, 17, 0.04) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.12em !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__image-btn span,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__image-btn span {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte {
    display: grid !important;
    grid-template-columns: 34px 76px minmax(0, 1fr) 76px !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 104px !important;
    padding: 14px 22px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-thumb,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-thumb {
    width: 76px !important;
    height: 76px !important;
    border-radius: 18px !important;
    background: #f4f4f4 !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-title,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-title {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    font-size: 17px !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-meta,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-meta {
    color: rgba(17, 17, 17, 0.52) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.52) !important;
    font-size: 11px !important;
    font-weight: 760 !important;
    letter-spacing: 0.04em !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-actions,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-actions {
    display: grid !important;
    grid-template-columns: repeat(2, 34px) !important;
    gap: 7px !important;
    width: 76px !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__edit-btn,
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__delete-btn,
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__move-btn,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__edit-btn,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__delete-btn,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__move-btn {
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgba(17, 17, 17, 0.09) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: rgba(17, 17, 17, 0.72) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.72) !important;
    box-shadow: 0 6px 14px rgba(17, 17, 17, 0.04) !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__delete-btn,
html body .mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__delete-btn {
    border-color: rgba(239, 68, 68, 0.14) !important;
    color: rgba(160, 42, 42, 0.82) !important;
    -webkit-text-fill-color: rgba(160, 42, 42, 0.82) !important;
}

/* Final Blocs list lock: one premium vertical row list, never 2-column cards. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__list,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__list {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    background: #ffffff !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc {
    width: 100% !important;
    min-height: 108px !important;
    height: auto !important;
    aspect-ratio: auto !important;
    display: grid !important;
    grid-template-columns: 84px minmax(0, 1fr) 36px !important;
    grid-template-rows: none !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 13px 24px 13px 22px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    overflow: hidden !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 84px !important;
    height: 84px !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 18px !important;
    background: #f4f4f4 !important;
    box-shadow: inset 0 0 0 1px rgba(17, 17, 17, 0.06) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__bloc-shade,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__bloc-shade {
    display: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: grid !important;
    gap: 8px !important;
    padding: 0 !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title {
    font-size: 20px !important;
    line-height: 1.08 !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    text-shadow: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta {
    color: rgba(17, 17, 17, 0.56) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.56) !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    position: static !important;
    width: 36px !important;
    display: grid !important;
    place-items: center !important;
}

/* Blocs list header: app title centered, total below, controls pinned to edges. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__top {
    min-height: calc(70px + env(safe-area-inset-top, 0px)) !important;
    padding: calc(18px + env(safe-area-inset-top, 0px)) 64px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    box-shadow: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__top-center {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    padding: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__title {
    order: 1 !important;
    margin: 0 !important;
    max-width: 100% !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
    font-weight: 860 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-align: center !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__kicker {
    order: 2 !important;
    margin: 0 !important;
    color: rgba(17, 17, 17, 0.54) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.54) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    text-align: center !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__library-btn {
    left: 18px !important;
    right: auto !important;
    top: calc(22px + env(safe-area-inset-top, 0px)) !important;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: 22px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__prefs-btn {
    left: auto !important;
    right: 18px !important;
    top: calc(22px + env(safe-area-inset-top, 0px)) !important;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: 22px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__owner-spacer {
    display: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn {
    display: inline-flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 999px !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
    border: 1px solid rgba(17, 17, 17, 0.09) !important;
    box-shadow: 0 8px 18px rgba(17, 17, 17, 0.05) !important;
    color: rgba(17, 17, 17, 0.74) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.74) !important;
    font-size: 13px !important;
}

/* Bloc detail/editor cleanup: no overlapping gear, no black name field. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__top {
    min-height: calc(70px + env(safe-area-inset-top, 0px)) !important;
    padding: calc(18px + env(safe-area-inset-top, 0px)) 64px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    box-shadow: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__top-center {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    pointer-events: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__title {
    margin: 0 !important;
    max-width: 100% !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    font-size: 18px !important;
    line-height: 1.05 !important;
    font-weight: 860 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    text-align: center !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__kicker,
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__owner-spacer {
    display: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__library-btn {
    left: 18px !important;
    right: auto !important;
    top: calc(22px + env(safe-area-inset-top, 0px)) !important;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: 22px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__prefs-btn {
    left: auto !important;
    right: 18px !important;
    top: calc(22px + env(safe-area-inset-top, 0px)) !important;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: 22px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    min-height: 62px !important;
    padding: 12px 22px !important;
    background: #ffffff !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary-title {
    display: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-hero {
    padding: 18px 22px 20px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.07) !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-actions {
    width: min(100%, 310px) !important;
    max-width: 310px !important;
    margin: 0 auto !important;
    justify-items: center !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__name-input,
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input {
    width: 100% !important;
    min-height: 44px !important;
    border: 1px solid rgba(17, 17, 17, 0.12) !important;
    border-radius: 16px !important;
    background-color: #ffffff !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    box-shadow: none !important;
    font-size: 20px !important;
    font-weight: 840 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    color-scheme: light !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__name-input {
    background-image: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__privacy-input {
    text-align: left !important;
    padding: 0 46px 0 18px !important;
    background:
        linear-gradient(45deg, transparent 50%, rgba(17,17,17,0.62) 50%) right 22px center / 7px 7px no-repeat,
        linear-gradient(135deg, rgba(17,17,17,0.62) 50%, transparent 50%) right 17px center / 7px 7px no-repeat,
        #ffffff !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__image-btn span::before {
    content: "Change ";
}

/* Seasons library */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode {
    background: #f6f7f5 !important;
    bottom: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__bottom {
    display: none !important;
    padding: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__top {
    min-height: calc(66px + env(safe-area-inset-top, 0px)) !important;
    padding: calc(15px + env(safe-area-inset-top, 0px)) 58px 11px !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.08) !important;
    background: rgba(255, 255, 255, 0.96) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__title {
    font-size: 20px !important;
    line-height: 1.05 !important;
    font-weight: 860 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__kicker {
    margin-top: 4px !important;
    font-size: 10px !important;
    letter-spacing: 0.12em !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body {
    padding: 12px 0 0 !important;
    background: #f6f7f5 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__list,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__list {
    gap: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc {
    width: 100% !important;
    min-height: 108px !important;
    height: auto !important;
    display: grid !important;
    grid-template-columns: 112px minmax(0, 1fr) 34px !important;
    grid-template-rows: 1fr !important;
    align-items: center !important;
    gap: 13px !important;
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.08) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc.is-current {
    min-height: 248px !important;
    grid-template-columns: minmax(0, 1fr) 38px !important;
    grid-template-rows: 164px auto !important;
    gap: 0 !important;
    margin: 0 16px 16px !important;
    width: calc(100% - 32px) !important;
    padding: 0 !important;
    border: 1px solid rgba(17, 17, 17, 0.10) !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(17, 17, 17, 0.10) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 112px !important;
    height: 78px !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    border-radius: 6px !important;
    background: #e8eae7 !important;
    box-shadow: inset 0 0 0 1px rgba(17, 17, 17, 0.07) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-thumb {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    height: 164px !important;
    border-radius: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb img,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb video {
    object-position: center 38% !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__current-label {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 5px;
    background: rgba(8, 10, 11, 0.82);
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: grid !important;
    gap: 7px !important;
    padding: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-copy {
    grid-column: 1 !important;
    grid-row: 2 !important;
    align-self: stretch !important;
    justify-content: center !important;
    padding: 15px 8px 15px 16px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title {
    font-size: 17px !important;
    line-height: 1.08 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-title {
    font-size: 23px !important;
    line-height: 1.02 !important;
    -webkit-line-clamp: 2 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: rgba(17, 17, 17, 0.56) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.56) !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 760 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row-meta .mobile-bloc-builder__visibility::before {
    display: none !important;
    content: none !important;
}

.mobile-bloc-builder__visibility {
    display: inline-grid !important;
    width: 24px;
    height: 24px;
    place-items: center;
    overflow: visible !important;
    border: 1px solid rgba(17, 17, 17, 0.09);
    border-radius: 50%;
    background: rgba(17, 17, 17, 0.04);
    color: rgba(17, 17, 17, 0.62);
    -webkit-text-fill-color: rgba(17, 17, 17, 0.62);
    font-size: 9px;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    position: static !important;
    width: 34px !important;
    display: grid !important;
    place-items: center !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__bloc-actions {
    grid-column: 2 !important;
    grid-row: 2 !important;
    align-self: center !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions > .fa-chevron-right {
    display: block !important;
    color: rgba(17, 17, 17, 0.36) !important;
    -webkit-text-fill-color: rgba(17, 17, 17, 0.36) !important;
    font-size: 12px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn {
    display: grid !important;
    visibility: visible !important;
    pointer-events: auto !important;
    width: 30px !important;
    height: 30px !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: rgba(17, 17, 17, 0.05) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc:has(.mobile-bloc-builder__more-btn) .mobile-bloc-builder__bloc-actions > .fa-chevron-right {
    display: none !important;
}

/* Premium Seasons library ------------------------------------------------- */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode {
    background:
        radial-gradient(circle at 12% -8%, rgba(17, 17, 17, 0.055), transparent 34%),
        #f7f7f5 !important;
}

/* The panel is anchored below the app header, which already absorbs the status
   bar. Adding safe-area-inset-top here double-counts it and produces a tall
   gray band above the title. Flat white, no inset, no tinted fill. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__top {
    min-height: 0 !important;
    padding: 13px 60px 12px !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.08) !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__title {
    font-size: 15px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    letter-spacing: 0.055em !important;
}

/* The gear now lives in the body toolbar as a labelled pill, so it must not
   keep the fixed circular dimensions it had while absolutely positioned in
   the title bar — those clip the "Settings" label to a 34px box. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__prefs-btn {
    position: static !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 7px 13px !important;
    border: 1px solid rgba(17, 17, 17, 0.1) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    font-size: 12px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body {
    padding: 16px 15px 112px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__list,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: 178px !important;
    min-height: 178px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.82) !important;
    border-radius: 22px !important;
    background: #171719 !important;
    box-shadow:
        0 16px 34px rgba(17, 17, 17, 0.13),
        0 2px 7px rgba(17, 17, 17, 0.07) !important;
    isolation: isolate !important;
    text-align: left !important;
    transform: translateZ(0);
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc:active {
    transform: scale(0.985) !important;
    box-shadow: 0 8px 20px rgba(17, 17, 17, 0.12) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-index {
    display: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-thumb {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
    background: #252528 !important;
    z-index: -2 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb img,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transform: scale(1.015);
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-shade {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(90deg, rgba(5, 5, 7, 0.82) 0%, rgba(5, 5, 7, 0.34) 56%, rgba(5, 5, 7, 0.04) 100%),
        linear-gradient(0deg, rgba(5, 5, 7, 0.78) 0%, transparent 62%) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-copy {
    position: absolute !important;
    left: 18px !important;
    right: 58px !important;
    bottom: 17px !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    color: #fff !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-title {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-size: 23px !important;
    line-height: 1 !important;
    font-weight: 920 !important;
    letter-spacing: -0.025em !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.34) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-meta {
    gap: 8px !important;
    color: rgba(255, 255, 255, 0.78) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.78) !important;
    font-size: 11px !important;
    font-weight: 760 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__visibility {
    width: 22px !important;
    height: 22px !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    background: rgba(255, 255, 255, 0.13) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__current-label {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    z-index: 3 !important;
    padding: 7px 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 999px !important;
    background: rgba(8, 8, 10, 0.48) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    font-size: 9px !important;
    font-weight: 900 !important;
    letter-spacing: 0.11em !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__bloc-actions {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 4 !important;
    display: grid !important;
    width: 38px !important;
    height: 38px !important;
    place-items: center !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__row--bloc .mobile-bloc-builder__more-btn {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    background: rgba(8, 8, 10, 0.42) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 7px 20px rgba(0, 0, 0, 0.16) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-read-only .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions > .fa-chevron-right {
    display: grid !important;
    width: 36px !important;
    height: 36px !important;
    place-items: center !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 50% !important;
    background: rgba(8, 8, 10, 0.38) !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Resolve legacy low-count/current-card rules against the premium system. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list.mobile-bloc-builder__list > button.mobile-bloc-builder__row.mobile-bloc-builder__row--bloc,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list.mobile-bloc-builder__list > button.mobile-bloc-builder__row.mobile-bloc-builder__row--bloc.is-current {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 178px !important;
    min-height: 178px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 22px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-thumb,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-thumb {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    border-radius: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-copy,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-copy {
    position: absolute !important;
    inset: auto 58px 17px 18px !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    transform: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-title,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-title {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-size: 23px !important;
    line-height: 1 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-meta {
    color: rgba(255, 255, 255, 0.8) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.8) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc .mobile-bloc-builder__row-meta > span,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__row-meta > span {
    color: rgba(255, 255, 255, 0.82) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.82) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc .mobile-bloc-builder__bloc-actions,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current .mobile-bloc-builder__bloc-actions {
    position: absolute !important;
    inset: 14px 14px auto auto !important;
    width: 38px !important;
    height: 38px !important;
    transform: none !important;
}

/* ==========================================================================
   Seasons redesign — clean white surface, tightened header, add-season tile.
   Appended last so it wins over the layered legacy blocks above.
   ========================================================================== */

html body #mobile-bloc-builder.mobile-bloc-builder,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode {
    background: #ffffff !important;
    background-image: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__body,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body {
    background: #ffffff !important;
}

/* The panel sits under the app header, so this internal bar only needs to
   carry the season count + settings — not a second tall header block. */
html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__top {
    padding: 14px 62px 12px !important;
    min-height: 0 !important;
    background: #ffffff !important;
    border-bottom: 1px solid rgba(17, 17, 17, 0.08) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__icon-btn {
    top: 50% !important;
    transform: translateY(-50%) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body {
    padding: 14px 16px calc(var(--mobile-bottom-nav-height, calc(58px + env(safe-area-inset-bottom, 0px))) + 16px) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__list,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count .mobile-bloc-builder__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 0 !important;
    background: transparent !important;
}

/* Add-season tile: dashed affordance that reads as an action, not a record. */
html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row--new {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    width: 100% !important;
    min-height: 74px !important;
    margin: 0 !important;
    padding: 16px 18px !important;
    border: 1.5px dashed rgba(17, 17, 17, 0.18) !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    text-align: left !important;
    cursor: pointer !important;
    transition: border-color 0.18s ease, background 0.18s ease !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row--new:active {
    border-color: rgba(17, 17, 17, 0.34) !important;
    background: rgba(17, 17, 17, 0.02) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row-new-icon {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    background: rgba(17, 17, 17, 0.05) !important;
    color: #111111 !important;
    font-size: 15px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row--new .mobile-bloc-builder__row-copy {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    min-width: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row--new .mobile-bloc-builder__row-title {
    color: #111111 !important;
    font-size: 15px !important;
    font-weight: 750 !important;
    letter-spacing: -0.01em !important;
}

/* The base __row-meta is an uppercase 800-weight micro-label; this tile wants
   plain sentence-case helper copy instead. */
html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row--new .mobile-bloc-builder__row-meta,
html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row--new .mobile-bloc-builder__row-meta > span {
    color: rgba(17, 17, 17, 0.5) !important;
    font-size: 12.5px !important;
    font-weight: 550 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* Empty state sits above the tile rather than centering in dead space. */
html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__empty {
    min-height: 0 !important;
    padding: 4px 2px 14px !important;
    background: transparent !important;
    text-align: left !important;
}

/* --- Seasons: page rhythm ------------------------------------------------
   The list previously hugged the top with everything else empty. Give the
   current-season card poster proportions and let the surface breathe. */

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__body {
    padding: 18px 16px calc(var(--mobile-bottom-nav-height, calc(58px + env(safe-area-inset-bottom, 0px))) + 20px) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode #mobile-bloc-builder-list,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list {
    gap: 14px !important;
}

/* Current season reads as a poster, not a list row. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current,
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode.is-low-bloc-count #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc.is-current {
    min-height: 232px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(17, 17, 17, 0.13) !important;
}

/* Subsequent seasons stay compact so the current one leads. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode #mobile-bloc-builder-list > .mobile-bloc-builder__row--bloc:not(.is-current) {
    min-height: 96px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
}

/* --- Seasons: settings moved out of the title bar ------------------------
   The gear used to float absolutely in the top bar, offset by a duplicated
   status-bar inset. It now sits in the body as a labelled control above the
   list, next to the content it configures. */

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__toolbar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 0 0 10px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__prefs-btn {
    position: static !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 7px 13px !important;
    border: 1px solid rgba(17, 17, 17, 0.1) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    color: rgba(17, 17, 17, 0.68) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__prefs-btn i {
    font-size: 12px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__prefs-btn:active {
    background: rgba(17, 17, 17, 0.03) !important;
    border-color: rgba(17, 17, 17, 0.2) !important;
}

/* Title is now just the season count, so the bar needs no side gutters. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-list-mode .mobile-bloc-builder__top {
    padding: 13px 18px 12px !important;
}

/* ============================================================
   Season builder rebuild. The form was stacked labels with an
   explicit Save; name now autosaves on blur, access is a
   segmented control, and the thumbnail is tapped directly.
   Order is set by dragging rather than by four buttons a row.
   ============================================================ */

/* The screen title repeated what the nav already said. */
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__top {
    padding-top: 8px !important;
    padding-bottom: 4px !important;
}

.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__title {
    display: none !important;
}

/* Name is the field, not a label plus a field. */
.mobile-bloc-builder__detail-actions .mobile-bloc-builder__name-input {
    min-height: 42px;
    font-size: 17px;
    font-weight: 820;
    letter-spacing: -0.01em;
}

.mobile-bloc-builder__access {
    display: inline-flex;
    align-self: flex-start;
    padding: 3px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-color) 7%, transparent);
}

.mobile-bloc-builder__access-option {
    min-height: 28px;
    padding: 0 14px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 780;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease;
}

.mobile-bloc-builder__access-option.is-active {
    background: var(--bg-primary, #ffffff);
    color: var(--text-primary, var(--text-color));
    box-shadow: 0 1px 3px color-mix(in srgb, var(--text-color) 12%, transparent);
}

/* The thumbnail is the control — no separate "change" button. */
.mobile-bloc-builder__detail-preview {
    padding: 0;
    border: 0;
    cursor: pointer;
}

.mobile-bloc-builder__detail-preview-edit {
    position: absolute;
    right: 5px;
    bottom: 5px;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: color-mix(in srgb, #000000 62%, transparent);
    color: #ffffff;
    font-size: 10px;
}

/* Drag handle replaces the index and the two arrows. */
.mobile-bloc-builder__row-handle {
    display: grid;
    place-items: center;
    width: 28px;
    color: color-mix(in srgb, var(--text-color) 32%, transparent);
    font-size: 14px;
    cursor: grab;
    touch-action: none;
}

.mobile-bloc-builder__row--byte.is-dragging {
    opacity: 0.92;
    border-radius: 14px;
    background: color-mix(in srgb, var(--bg-primary) 96%, transparent);
    box-shadow: 0 10px 26px color-mix(in srgb, var(--text-color) 18%, transparent);
}

.mobile-bloc-builder__row--byte.is-dragging .mobile-bloc-builder__row-handle {
    cursor: grabbing;
    color: var(--text-primary, var(--text-color));
}

/* One overflow control where four buttons used to sit. */
.mobile-bloc-builder__row--byte .mobile-bloc-builder__row-actions {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
}

.mobile-bloc-builder__row-menu-btn {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: color-mix(in srgb, var(--text-color) 46%, transparent);
    font-size: 15px;
    cursor: pointer;
}

.mobile-bloc-builder__row-menu-btn:active {
    background: color-mix(in srgb, var(--text-color) 8%, transparent);
}

/* The floating Add button was covering the last row. */
.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__list {
    padding-bottom: 96px;
}

/* Byte options sheet — the destination for the row's overflow control. */
.mobile-bloc-builder__sheet-scrim {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: flex-end;
    background: rgba(6, 8, 7, 0.42);
    animation: mobileBlocBuilderScrimIn 160ms ease;
}

@keyframes mobileBlocBuilderScrimIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.mobile-bloc-builder__sheet {
    width: 100%;
    padding: 8px 14px calc(18px + env(safe-area-inset-bottom, 0px));
    border-radius: 22px 22px 0 0;
    background: var(--bg-primary, #ffffff);
    animation: mobileBlocBuilderSheetIn 200ms cubic-bezier(0.32, 0.72, 0, 1);
}

@keyframes mobileBlocBuilderSheetIn {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

.mobile-bloc-builder__sheet-handle {
    width: 38px;
    height: 4px;
    margin: 0 auto 12px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-color) 16%, transparent);
}

.mobile-bloc-builder__sheet-title {
    padding: 0 4px 10px;
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mobile-bloc-builder__sheet button {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: var(--text-primary, var(--text-color));
    font-size: 15px;
    font-weight: 640;
    text-align: left;
    cursor: pointer;
}

.mobile-bloc-builder__sheet button:active {
    background: color-mix(in srgb, var(--text-color) 7%, transparent);
}

.mobile-bloc-builder__sheet button.is-destructive {
    color: #d8442c;
}

.mobile-bloc-builder__sheet button.is-cancel {
    justify-content: center;
    margin-top: 6px;
    background: color-mix(in srgb, var(--text-color) 6%, transparent);
    font-weight: 760;
}

/* The hero was forced to one column by an earlier detail-mode rule, which is why
   the thumbnail, name and access stacked and centred. Two columns, left aligned:
   the thumbnail is the control, the name and access sit beside it. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-hero {
    grid-template-columns: 76px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 14px 18px 16px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-preview {
    width: 76px !important;
    height: 76px !important;
    border-radius: 17px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__detail-actions {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    justify-items: start !important;
    align-items: flex-start !important;
    gap: 9px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__name-input {
    min-height: 40px !important;
    padding: 0 12px !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    text-align: left !important;
}

/* The two options were overlapping; each takes its own half of the track. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__access {
    display: inline-flex !important;
    gap: 2px !important;
    width: auto !important;
    padding: 3px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__access-option {
    flex: 0 0 auto !important;
    min-width: 74px !important;
    text-align: center !important;
}

/* Clear the floating Add button and the bottom nav beneath it. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__list {
    padding-bottom: 150px !important;
}

/* The top bar still reserved room for the title it no longer shows, which pushed
   the whole panel down. With the title gone the bar only carries the back
   control, so it collapses to that. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__top {
    min-height: 0 !important;
    padding: 6px 62px 6px !important;
    border-bottom: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__top-center {
    min-height: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__kicker {
    display: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary {
    padding-top: 8px !important;
    padding-bottom: 10px !important;
}

/* The body reserved 18px at the bottom, but the floating Add button and the app
   nav sit above that, so the last rows were unreachable behind them. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__body {
    padding-bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important;
}

/* Add moves beside Preview. A floating bar that covers the rows you are trying
   to reorder is worse than a pill in the row that already holds the actions. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__summary {
    grid-template-columns: minmax(0, 1fr) auto !important;
}

.mobile-bloc-builder__summary-actions {
    display: flex;
    align-items: center;
    gap: 7px;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__pill--primary {
    border-color: transparent !important;
    background: #111111 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__pill--primary[hidden] {
    display: none !important;
}

/* The floating bar is gone in detail mode, so the list only clears the app nav. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__body {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-detail-mode .mobile-bloc-builder__bottom {
    display: none !important;
}

/* Pick-up feel: the lifted row scales up and casts a shadow so it reads as being
   held above the list, while the rows it displaces slide rather than jump. The
   dragged row itself has no transition — it must track the finger exactly. */
.mobile-bloc-builder__list.is-reordering .mobile-bloc-builder__row--byte {
    transition: transform 180ms cubic-bezier(0.2, 0, 0, 1);
    will-change: transform;
}

.mobile-bloc-builder__list.is-reordering .mobile-bloc-builder__row--byte.is-dragging {
    transition: none;
}

html body #mobile-bloc-builder.mobile-bloc-builder .mobile-bloc-builder__row--byte.is-dragging {
    position: relative;
    z-index: 5;
    border-radius: 16px;
    background: #ffffff;
    box-shadow:
        0 2px 6px rgba(17, 17, 17, 0.08),
        0 16px 34px rgba(17, 17, 17, 0.18);
    transform-origin: center;
    opacity: 0.98;
}

/* The list should not scroll or select text while a row is being carried. */
.mobile-bloc-builder__list.is-reordering {
    touch-action: none;
    user-select: none;
    -webkit-user-select: none;
}

.mobile-bloc-builder__row--byte.is-dragging .mobile-bloc-builder__row-handle {
    color: #111111;
}

/* =========================================================================
   SEASONS — grid surface
   =========================================================================
   Replaces the stacked full-width slabs. The previous list had four competing
   layers (.is-list-mode, .is-low-bloc-count, an !important block, and an
   html-body-id block) each restyling the same .__row--bloc, so every change
   needed more specificity than the last. Rather than add a fifth layer, the
   new design renders different elements (.mobile-season-card) under
   .is-season-grid, so it composes instead of fighting.

   Colors come from the app's theme tokens (--text-primary / --background-color
   / --accent-color) the way the header and bottom nav do. The old list
   hardcoded #111111 and rgba(17,17,17,...), which is why it ignored dark mode.
   ------------------------------------------------------------------------- */

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-grid .mobile-bloc-builder__body {
    padding: 14px 16px calc(var(--mobile-bottom-nav-height, calc(58px + env(safe-area-inset-bottom, 0px))) + 24px) !important;
    background: var(--background-color, #ffffff) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-grid,
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-grid.is-list-mode {
    background: var(--background-color, #ffffff) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-grid #mobile-bloc-builder-list,
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-grid.is-low-bloc-count #mobile-bloc-builder-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
}

.mobile-bloc-builder.is-season-grid .mobile-season-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

/* --- card shell --------------------------------------------------------- */

.mobile-bloc-builder.is-season-grid .mobile-season-card {
    position: relative;
    isolation: isolate;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 18px;
    overflow: hidden;
    background: color-mix(in srgb, var(--text-primary, #111111) 6%, var(--background-color, #ffffff));
    box-shadow:
        0 1px 2px color-mix(in srgb, var(--text-primary, #111111) 8%, transparent),
        0 10px 26px color-mix(in srgb, var(--text-primary, #111111) 10%, transparent);
    text-align: left;
    cursor: pointer;
    aspect-ratio: 1 / 1;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card.is-hero {
    aspect-ratio: 16 / 11;
    border-radius: 22px;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card:active {
    transform: scale(0.982);
}

/* --- artwork ------------------------------------------------------------ */

.mobile-bloc-builder.is-season-grid .mobile-season-card__art {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
}

/* The media is positioned rather than laid out as a grid item: as a grid child
   under place-items:center it took its intrinsic height (a 448px image inside a
   246px card), which overflowed and left a grey band above the photo.
   Absolute + inset:0 pins it to the card so object-fit:cover can do its job.
   The grid centering stays for the monogram, which is a real grid child. */
.mobile-bloc-builder.is-season-grid .mobile-season-card__art img,
.mobile-bloc-builder.is-season-grid .mobile-season-card__art video {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: none;
    max-height: none;
    min-height: 0;
    object-fit: cover;
    /* Photos put the subject high in frame, so bias the crop upward to keep
       faces in shot. */
    object-position: center 34%;
    display: block;
}

/* Imported social graphics carry their own headline text and lose words when
   cropped off-centre, so they keep a centred crop. Tagged in
   renderMobileBlocBuilderThumb(). */
.mobile-bloc-builder.is-season-grid .mobile-season-card__art img[data-season-fit="graphic"],
.mobile-bloc-builder.is-season-grid .mobile-season-card__art video[data-season-fit="graphic"] {
    object-position: center center;
}

/* A season with no usable poster gets an accent-tinted monogram tile. It used
   to render as a black rectangle with an invisible icon. The ground stays dark
   so the same white title/meta treatment works on art and artless cards alike —
   one text style, no per-card contrast branching. */
.mobile-bloc-builder.is-season-grid .mobile-season-card.is-artless .mobile-season-card__art {
    background:
        radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--accent-color, #4f46e5) 62%, transparent), transparent 64%),
        linear-gradient(155deg,
            color-mix(in srgb, var(--accent-color, #4f46e5) 42%, #14161c),
            #14161c 78%);
}

/* The photo scrim would double up on the already-dark monogram ground. */
.mobile-bloc-builder.is-season-grid .mobile-season-card.is-artless .mobile-season-card__art::after {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.42) 100%);
}

.mobile-bloc-builder.is-season-grid .mobile-season-card__monogram {
    font-size: 62px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.03em;
    color: color-mix(in srgb, var(--text-primary, #111111) 26%, transparent);
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary, #111111) 26%, transparent);
    transform: translateY(-8%);
}

.mobile-bloc-builder.is-season-grid .mobile-season-card.is-hero .mobile-season-card__monogram {
    font-size: 96px;
}

/* Scrim: guarantees the title stays legible over any photo. The old slab had
   .__bloc-shade set to display:none, which is why light photos ate the text. */
.mobile-bloc-builder.is-season-grid .mobile-season-card__art::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.32) 0%,
        rgba(0, 0, 0, 0.06) 30%,
        rgba(0, 0, 0, 0.46) 62%,
        rgba(0, 0, 0, 0.88) 100%);
}

.mobile-bloc-builder.is-season-grid .mobile-bloc-builder__bloc-shade {
    display: none !important;
}

/* --- copy --------------------------------------------------------------- */

.mobile-bloc-builder.is-season-grid .mobile-season-card__copy {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 5px;
    height: 100%;
    justify-content: flex-end;
    padding: 12px;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card.is-hero .mobile-season-card__copy {
    padding: 18px;
    gap: 7px;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    overflow-wrap: anywhere;
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
    font-size: 16px;
    font-weight: 750;
    line-height: 1.12;
    letter-spacing: -0.015em;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.4);
}

.mobile-bloc-builder.is-season-grid .mobile-season-card.is-hero .mobile-season-card__title {
    font-size: 27px;
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -0.025em;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, 0.82);
    -webkit-text-fill-color: rgba(255, 255, 255, 0.82);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.36);
}

.mobile-bloc-builder.is-season-grid .mobile-season-card.is-hero .mobile-season-card__meta {
    font-size: 13px;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card__visibility {
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
    font-size: 8px;
}

/* --- badge + overflow --------------------------------------------------- */

.mobile-bloc-builder.is-season-grid .mobile-season-card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(10px) saturate(1.4);
    -webkit-backdrop-filter: blur(10px) saturate(1.4);
    color: #111111;
    -webkit-text-fill-color: #111111;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* 34px hit target with a backing plate — it used to be a bare glyph on a photo. */
.mobile-bloc-builder.is-season-grid .mobile-season-card__more {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.42);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: #ffffff;
    -webkit-text-fill-color: #ffffff;
    font-size: 12px;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card__more:active {
    background: rgba(0, 0, 0, 0.62);
}

/* --- new season tile ---------------------------------------------------- */

.mobile-bloc-builder.is-season-grid .mobile-season-card--new {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px;
    border: 1px dashed color-mix(in srgb, var(--text-primary, #111111) 22%, transparent);
    background: color-mix(in srgb, var(--text-primary, #111111) 3%, var(--background-color, #ffffff));
    box-shadow: none;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card--new .mobile-season-card__new-icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: color-mix(in srgb, var(--accent-color, #4f46e5) 16%, transparent);
    color: var(--accent-color, #4f46e5);
    -webkit-text-fill-color: var(--accent-color, #4f46e5);
    font-size: 14px;
    margin-top: auto;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card--new .mobile-season-card__copy {
    height: auto;
    padding: 0;
    gap: 2px;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card--new .mobile-season-card__title {
    color: var(--text-primary, #111111);
    -webkit-text-fill-color: var(--text-primary, #111111);
    font-size: 14.5px;
    font-weight: 700;
    text-shadow: none;
}

.mobile-bloc-builder.is-season-grid .mobile-season-card--new .mobile-season-card__meta {
    color: color-mix(in srgb, var(--text-primary, #111111) 52%, transparent);
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary, #111111) 52%, transparent);
    font-size: 11.5px;
    font-weight: 500;
    text-shadow: none;
}

/* --- header "New season" control ----------------------------------------
   Sits in the top bar's right-hand owner slot, beside the season count, so
   adding a season doesn't mean scrolling past every existing one — and the
   grid's last row never strands an odd tile next to a dashed placeholder. */

/* Pinned rather than laid out in the flex row: the top bar centres its title
   with symmetric padding, so an in-flow button of a different width than the
   opposite spacer shifts the title off-centre. */
.mobile-bloc-builder .mobile-season-add-btn {
    position: absolute;
    right: 16px;
    /* Centred on the bar's content box, which already carries the safe-area
       padding. Earlier versions added the inset a second time (via a margin, then
       an explicit top) and double-counted it, so on a notched phone the button
       dropped below the header and sat on top of the first season card.
       anchor to the bar's own bottom padding edge instead: no inset arithmetic
       here at all, so it lands on the title's line whatever the inset is. */
    top: auto;
    bottom: 4px;
    transform: none;
    z-index: 4;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--text-primary, #111111) 12%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-primary, #111111) 5%, var(--background-color, #ffffff));
    color: var(--text-primary, #111111);
    -webkit-text-fill-color: var(--text-primary, #111111);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.16s ease, transform 0.16s ease;
}

.mobile-bloc-builder .mobile-season-add-btn:active {
    background: color-mix(in srgb, var(--text-primary, #111111) 11%, var(--background-color, #ffffff));
    transform: scale(0.94);
}

.mobile-bloc-builder .mobile-season-add-btn[hidden] {
    display: none !important;
}

/* Only the season list offers "new season"; detail and settings do not. This
   keeps the three render paths from each having to reset the button. */
.mobile-bloc-builder:not(.is-list-mode) .mobile-season-add-btn {
    display: none !important;
}

/* The button is absolutely positioned, so the reserved spacers stay as-is and
   the title keeps its centred position. */

/* --- showcase mode: few seasons -----------------------------------------
   Under ~5 seasons the 2-up grid reads as leftovers — small tiles beside a
   large hero, with half the screen empty. Every season gets the hero's
   full-width poster treatment instead, so a young app looks intentional
   rather than sparse. Set by renderMobileBlocBuilderList(). */

.mobile-bloc-builder.is-season-grid.is-season-showcase .mobile-season-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.mobile-bloc-builder.is-season-grid.is-season-showcase .mobile-season-card {
    aspect-ratio: 16 / 11;
    border-radius: 22px;
}

/* Type scales up to match the larger card. */
.mobile-bloc-builder.is-season-grid.is-season-showcase .mobile-season-card__copy {
    padding: 18px;
    gap: 7px;
}

.mobile-bloc-builder.is-season-grid.is-season-showcase .mobile-season-card__title {
    font-size: 27px;
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -0.025em;
}

.mobile-bloc-builder.is-season-grid.is-season-showcase .mobile-season-card__meta {
    font-size: 13px;
}

.mobile-bloc-builder.is-season-grid.is-season-showcase .mobile-season-card__monogram {
    font-size: 96px;
}

/* The new-season tile keeps its compact proportions — it is a control, not a
   season, and a full-bleed dashed box would read as a broken card. */
.mobile-bloc-builder.is-season-grid.is-season-showcase .mobile-season-card--new {
    aspect-ratio: auto;
    min-height: 96px;
}

/* =========================================================================
   SEASONS — detail (inside a season)
   =========================================================================
   The rows previously carried their own left offsets — the section header sat
   at 16px, the season thumb at 34, the drag handle at 38 and the byte thumb at
   84 — so nothing shared a vertical edge. The copy column was also squeezed to
   ~92px beside a 76px action block, which truncated titles like "Offers on the
   table thus far for Elite Class…" after four words.

   Everything below hangs off one column definition, so the handle, artwork,
   text and overflow button line up down the page.
   ------------------------------------------------------------------------- */

.mobile-bloc-builder.is-season-detail {
    /* handle | artwork | copy (flex) | overflow */
    --season-row-gutter: 16px;
    --season-handle-col: 22px;
    --season-thumb-col: 64px;
    --season-action-col: 36px;
    --season-col-gap: 12px;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__body {
    padding: 12px var(--season-row-gutter)
             calc(var(--mobile-bottom-nav-height, calc(58px + env(safe-area-inset-bottom, 0px))) + 20px) !important;
    background: var(--background-color, #ffffff) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 0 !important;
}

/* --- summary row (count + actions) -------------------------------------- */

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__summary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

/* "9 BYTES • PUBLIC" wrapped onto two lines and pushed the buttons out of
   line; it holds one line now and truncates instead. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__summary-title {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: color-mix(in srgb, var(--text-primary, #111111) 52%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary, #111111) 52%, transparent) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__summary-actions {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__pill {
    min-height: 34px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    white-space: nowrap !important;
}

/* --- season header (artwork + name + privacy) --------------------------- */

/* Shares the row grid so the season artwork sits directly above the byte
   artwork rather than 50px to its left. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__detail-hero {
    display: grid !important;
    /* Leading empty column matches the rows' drag-handle track, so the season
       artwork sits directly above the byte artwork instead of 34px to its left. */
    grid-template-columns:
        var(--season-handle-col)
        var(--season-thumb-col)
        minmax(0, 1fr) !important;
    align-items: center !important;
    gap: var(--season-col-gap) !important;
    margin: 0 0 6px !important;
    padding: 0 0 14px !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--text-primary, #111111) 9%, transparent) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__detail-preview {
    grid-column: 2 !important;
    width: var(--season-thumb-col) !important;
    height: var(--season-thumb-col) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__detail-actions {
    grid-column: 3 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__name-input {
    width: 100% !important;
    min-height: 40px !important;
    padding: 8px 12px !important;
    border: 1px solid color-mix(in srgb, var(--text-primary, #111111) 12%, transparent) !important;
    border-radius: 11px !important;
    background: var(--background-color, #ffffff) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
}

/* --- byte rows ---------------------------------------------------------- */

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte {
    display: grid !important;
    grid-template-columns:
        var(--season-handle-col)
        var(--season-thumb-col)
        minmax(0, 1fr)
        var(--season-action-col) !important;
    align-items: center !important;
    gap: var(--season-col-gap) !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 10px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid color-mix(in srgb, var(--text-primary, #111111) 8%, transparent) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte:last-child {
    border-bottom: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-handle,
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-index {
    grid-column: 1 !important;
    justify-self: center !important;
    width: auto !important;
    margin: 0 !important;
    color: color-mix(in srgb, var(--text-primary, #111111) 30%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary, #111111) 30%, transparent) !important;
    font-size: 14px !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-thumb {
    grid-column: 2 !important;
    width: var(--season-thumb-col) !important;
    height: var(--season-thumb-col) !important;
    min-height: 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: color-mix(in srgb, var(--text-primary, #111111) 6%, transparent) !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-thumb img,
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-thumb video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* minmax(0, 1fr) lets this column actually shrink; without it the title's
   intrinsic width kept the column wide and the text clipped instead. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-copy {
    grid-column: 3 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    padding: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-title {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    overflow-wrap: anywhere !important;
    max-width: 100% !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.24 !important;
    letter-spacing: -0.01em !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-meta {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    color: color-mix(in srgb, var(--text-primary, #111111) 46%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary, #111111) 46%, transparent) !important;
}

/* Right-aligned in its own column instead of floating in a 76px block. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-actions {
    grid-column: 4 !important;
    justify-self: end !important;
    width: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__row--byte .mobile-bloc-builder__row-menu-btn {
    display: grid !important;
    place-items: center !important;
    width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--text-primary, #111111) 5%, transparent) !important;
    color: color-mix(in srgb, var(--text-primary, #111111) 62%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary, #111111) 62%, transparent) !important;
    box-shadow: none !important;
    font-size: 13px !important;
}

/* Guest season header: the name input and privacy toggle are owner-only, so
   without these the header was a thumbnail beside empty space and the screen
   never said which season you were in. Intentionally plain — placeholder for
   the guest season design. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__detail-name {
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: -0.02em !important;
    color: var(--text-primary, #111111) !important;
    -webkit-text-fill-color: var(--text-primary, #111111) !important;
    overflow-wrap: anywhere !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-detail .mobile-bloc-builder__detail-sub {
    margin-top: 3px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    color: color-mix(in srgb, var(--text-primary, #111111) 48%, transparent) !important;
    -webkit-text-fill-color: color-mix(in srgb, var(--text-primary, #111111) 48%, transparent) !important;
}

/* =========================================================================
   SEASONS — guest detail (a guest opened a season)
   =========================================================================
   The read-only screen used to be the builder with its controls removed: a
   64px thumbnail row per byte, each printing the same imported caption, under
   a header that repeated the season name. Nothing about it told a guest what
   the season was.

   This replaces that surface entirely. The panel's own chrome is hidden and
   the layout runs edge to edge: a full-bleed cover carrying the title, then
   each byte as a chapter card. Scoped under .is-season-guest so it wins over
   the is-season-detail rules above without unpicking their !important layers.
   ------------------------------------------------------------------------- */

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-guest {
    --season-guest-gutter: 20px;
    background: #ffffff !important;
}

/* The hero runs under the status bar, so the panel drops the padding the
   builder body applies and each block below re-applies its own. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-guest .mobile-bloc-builder__body {
    padding: 0 0 calc(var(--mobile-bottom-nav-height, calc(58px + env(safe-area-inset-bottom, 0px))) + 24px) !important;
    background: #ffffff !important;
}

/* The guest screen names itself in the hero; the panel's title bar and summary
   row would only repeat it above the cover. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-guest .mobile-bloc-builder__summary,
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-guest .mobile-bloc-builder__search {
    display: none !important;
}

/* For a guest the bar holds nothing — the title is blank and the prefs and
   "new season" controls are owner-only — so it rendered as a 12px sliver of
   white between the app header and the cover. The app header above already
   carries the hamburger and login; the hero starts directly beneath it. */
html body #mobile-bloc-builder.mobile-bloc-builder.is-season-guest .mobile-bloc-builder__top {
    display: none !important;
}

html body #mobile-bloc-builder.mobile-bloc-builder.is-season-guest .mobile-bloc-builder__list {
    display: block !important;
    gap: 0 !important;
    padding: 0 !important;
}

/* --- hero ---------------------------------------------------------------- */

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__hero {
    position: relative;
    display: block;
    height: min(72vh, 452px);
    background: #1a1a20 !important;
    overflow: hidden;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__cover,
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__cover img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__monogram {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font-size: 132px !important;
    font-weight: 900 !important;
    letter-spacing: -0.04em;
    color: rgba(255, 255, 255, 0.14) !important;
}

/* Three stops rather than a linear fade: the title sits low, so the gradient
   stays clear across the artwork and only turns solid under the copy. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(12, 12, 18, 0.10) 30%,
        rgba(12, 12, 18, 0.62) 62%,
        rgba(12, 12, 18, 0.94) 100%) !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__cap {
    position: absolute;
    inset: auto 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 0 22px 26px;
}

/* Floats over the artwork rather than sitting in a bar, so the cover keeps its
   full height. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__back {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    z-index: 3 !important;
    width: 38px !important;
    height: 38px !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 13px !important;
    background: rgba(255, 255, 255, 0.16) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: 15px !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__back:active {
    background: rgba(255, 255, 255, 0.28) !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__eyebrow {
    display: flex;
    align-items: center;
    gap: 8px;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__pill {
    padding: 5px 10px;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.16) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Season names are short ("April 2026"), so they carry the screen at display
   size. clamp keeps a longer name from overflowing the cover. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__title {
    margin: 0;
    font-size: clamp(38px, 15vw, 58px) !important;
    line-height: 0.92;
    font-weight: 900 !important;
    letter-spacing: -0.035em;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    overflow-wrap: anywhere;
}

/* The imported caption, shown once for the whole season. Clamped because an
   Instagram caption runs long and the hero is a fixed height. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__lede {
    max-width: 290px;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.78) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.78) !important;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__byline {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-top: 2px;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__who {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__avatar {
    width: 30px;
    height: 30px;
    flex: none;
    border-radius: 50% !important;
    overflow: hidden;
    box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.4);
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__name {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rule {
    width: 1px;
    height: 16px;
    flex: none;
    background: rgba(255, 255, 255, 0.28) !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__count {
    font-size: 12.5px !important;
    font-weight: 600 !important;
    white-space: nowrap;
    color: rgba(255, 255, 255, 0.64) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.64) !important;
}

/* --- follow + share ------------------------------------------------------ */

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__acts {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px var(--season-guest-gutter) 24px;
}

/* Mirrors .bytes-tv-mobile-hero-rail: four evenly spaced icon buttons over a
   hairline, count then label. Bytes TV sits on a dark stage and this screen is
   white, so the ink is inverted -- the geometry and type are the same. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__engagement {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
    padding-top: 10px;
    border-top: 1px solid rgba(20, 20, 30, 0.09);
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn {
    min-width: 0;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 4px;
    padding: 0;
    border: 0 !important;
    background: transparent !important;
    font: inherit;
    text-transform: uppercase;
    cursor: pointer;
    color: #16161c !important;
    -webkit-text-fill-color: #16161c !important;
    /* A global `button, .btn` rule drops a drop shadow on every button, which
       painted a raised white plate behind each rail action. These are bare
       icons on the page, not raised controls. */
    box-shadow: none !important;
    border-radius: 0 !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn:active {
    opacity: 0.6;
}

/* The panel's own focus styling drew a plate behind the tapped button, which
   read as a control stuck in its pressed state. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn:focus,
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn:focus-visible {
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-icon {
    flex: 0 0 auto;
    font-size: 20px !important;
    font-weight: 760 !important;
    line-height: 1;
    color: #16161c !important;
    -webkit-text-fill-color: #16161c !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-icon.fa-comment {
    font-size: 18px !important;
}

/* BlocTap is the one action with an on state, the way it is on Bytes TV. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn.is-active .mobile-season-guest__rail-icon {
    color: #6c5ce7 !important;
    -webkit-text-fill-color: #6c5ce7 !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn strong {
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.02em;
    color: #16161c !important;
    -webkit-text-fill-color: #16161c !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn strong[hidden] {
    display: none !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__rail-btn span:not(.mobile-season-guest__rail-icon) {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em;
    white-space: nowrap;
    color: rgba(22, 22, 28, 0.54) !important;
    -webkit-text-fill-color: rgba(22, 22, 28, 0.54) !important;
}

/* --- chapters ------------------------------------------------------------ */

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__sect {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 22px 14px;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__sect-l {
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.16em;
    color: #9a9aa2 !important;
    -webkit-text-fill-color: #9a9aa2 !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__sect-r {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em;
    color: #c2c2ca !important;
    -webkit-text-fill-color: #c2c2ca !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__chapters {
    display: flex;
    flex-direction: column;
    gap: 26px;
    padding: 0 var(--season-guest-gutter) 40px;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__ch {
    display: flex;
    flex-direction: column;
    gap: 11px;
    cursor: pointer;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__ch:active {
    opacity: 0.86;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__art {
    position: relative;
    border-radius: 20px !important;
    overflow: hidden;
    background: #dedee4 !important;
    aspect-ratio: 4 / 3;
}

/* The opening chapter runs taller — it sets the pace for the scroll the way
   the hero does for the screen. */
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__ch:first-child .mobile-season-guest__art {
    aspect-ratio: 4 / 5;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__art img,
html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__art video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__ph {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__num {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 5px 9px;
    border-radius: 8px !important;
    background: rgba(12, 12, 18, 0.5) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.1em;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__dur {
    position: absolute;
    inset: auto 12px 12px auto;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 6px 11px 6px 9px;
    border-radius: 10px !important;
    background: rgba(12, 12, 18, 0.5) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__meta {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 0 2px;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__line {
    display: flex;
    align-items: center;
    gap: 8px;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__date {
    font-size: 11.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em;
    color: #a2a2aa !important;
    -webkit-text-fill-color: #a2a2aa !important;
}

html body #mobile-bloc-builder.is-season-guest .mobile-season-guest__ch-title {
    margin: 0;
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em;
    line-height: 1.18;
    color: #16161c !important;
    -webkit-text-fill-color: #16161c !important;
}