.creator-page {
                max-width: 720px;
                margin: 24px auto 46px;
                padding: 0 20px;
                color: var(--text)
            }

            .creator-page h1,
            .creator-page h2,
            .creator-page h3,
            .creator-page p,
            .creator-dialog h2,
            .creator-dialog h3,
            .creator-dialog p {
                margin: 0
            }

            .creator-svg {
                width: 21px;
                height: 21px;
                fill: none;
                stroke: currentColor;
                stroke-width: 1.7;
                stroke-linecap: round;
                stroke-linejoin: round;
                flex-shrink: 0
            }

            .creator-heading {
                display: flex;
                align-items: center;
                justify-content: space-between;
                height: 58px;
                margin-bottom: 12px
            }

            .creator-heading h1 {
                font-size: 17px;
                font-weight: 600
            }

            .creator-heading>span {
                width: 36px
            }

            .creator-back,
            .creator-close {
                width: 36px;
                height: 36px;
                border: 0;
                border-radius: 50%;
                display: grid;
                place-items: center;
                background: transparent;
                color: var(--text)
            }

            .creator-back:hover,
            .creator-close:hover {
                background: #ffffff0a
            }

            .creator-hero {
                position: relative;
                overflow: hidden;
                padding: 30px 27px;
                border: 1px solid #b96f8e28;
                border-radius: 16px;
                background: radial-gradient(ellipse at 100% 0, #91425860, transparent 80%), var(--surface)
            }

            .creator-pill {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                font-size: 10px;
                line-height: 1.7;
                color: #e5a5bc;
                background: #ffffff07;
                padding: 5px 8px;
                border-radius: 5px;
                border: 1px solid #ffffff0c
            }

            .creator-pill svg {
                width: 13px;
                height: 13px
            }

            .creator-hero h2 {
                font-size: 32px;
                line-height: 1.55;
                letter-spacing: .5px;
                margin: 21px 0 15px;
                position: relative;
                z-index: 1
            }

            .creator-hero h2 em {
                font-style: normal;
                color: var(--gold-light)
            }

            .creator-hero>p {
                font-size: 13px;
                line-height: 1.95;
                color: #aaa69e;
                position: relative;
                z-index: 1;
                max-width: 540px
            }

            .creator-art {
                position: absolute;
                right: 12px;
                top: 64px;
                transform: rotate(-15deg);
                color: #df93b017;
                pointer-events: none
            }

            .creator-art svg {
                width: 110px;
                height: 110px;
                stroke-width: 1.2
            }

            .creator-section {
                margin-top: 30px
            }

            .creator-section>h2 {
                font-size: 18px;
                font-weight: 600;
                margin-bottom: 17px
            }

            .creator-role {
                display: flex;
                gap: 14px;
                padding: 17px 0;
                border-bottom: 1px solid #ffffff07
            }

            .creator-role>span {
                width: 42px;
                height: 42px;
                display: grid;
                place-items: center;
                flex-shrink: 0;
                border-radius: 11px;
                background: #d4b58512;
                color: var(--gold)
            }

            .creator-role h3 {
                font-size: 14px;
                font-weight: 500;
                margin: 1px 0 7px
            }

            .creator-role p {
                font-size: 12px;
                line-height: 1.8;
                color: var(--muted)
            }

            .creator-benefits {
                display: grid;
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 10px
            }

            .creator-benefits>div {
                padding: 18px 14px;
                background: var(--surface);
                border: 1px solid #ffffff08;
                border-radius: 10px
            }

            .creator-benefits strong {
                font-size: 13px;
                font-weight: 500;
                color: var(--gold-light)
            }

            .creator-benefits p {
                font-size: 11px;
                line-height: 1.85;
                color: var(--muted);
                margin-top: 9px
            }

            .creator-note {
                font-size: 11px;
                color: var(--muted);
                line-height: 1.8;
                margin-top: 12px !important
            }

            .creator-steps {
                display: flex;
                flex-direction: column;
                gap: 20px;
                list-style: none;
                padding: 0;
                margin: 0
            }

            .creator-steps li {
                display: flex;
                gap: 15px;
                align-items: flex-start
            }

            .creator-steps b {
                font-size: 18px;
                color: var(--gold);
                line-height: 1.6;
                font-style: italic;
                font-weight: 500
            }

            .creator-steps strong {
                font-size: 13px;
                font-weight: 500
            }

            .creator-steps p {
                font-size: 12px;
                color: var(--muted);
                margin-top: 6px;
                line-height: 1.7
            }

            .creator-faq {
                margin-top: 29px;
                background: var(--surface);
                padding: 20px;
                border: 1px solid #ffffff06;
                border-radius: 11px
            }

            .creator-faq h2 {
                font-size: 14px;
                font-weight: 500;
                margin-bottom: 10px
            }

            .creator-faq p {
                font-size: 12px;
                line-height: 1.9;
                color: var(--muted)
            }

            .creator-apply {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 10px;
                width: 100%;
                border: 0;
                background: linear-gradient(100deg, #e23e69, #c13c65);
                padding: 15px 18px;
                border-radius: 10px;
                font-size: 14px;
                font-weight: 600;
                color: #fff;
                margin-top: 26px;
                transition: filter .15s
            }

            .creator-apply:hover {
                filter: brightness(1.08)
            }

            .creator-apply:disabled {
                opacity: .6;
                cursor: wait
            }

            .creator-apply .creator-arrow {
                margin-left: auto
            }

            .creator-apply .creator-send {
                margin-right: auto
            }

            .creator-footer-note {
                text-align: center;
                margin-top: 11px !important
            }

            .creator-disabled {
                padding: 12px 16px;
                background: #3f2533;
                border: 1px solid #8a476333;
                border-radius: 9px;
                color: #f3c7d7;
                font-size: 12px;
                margin-top: 25px !important
            }

            .creator-dialog {
                color: var(--text);
                background: var(--surface);
                border: 1px solid #ffffff13;
                border-radius: 18px;
                padding: 0;
                width: calc(100% - 32px);
                max-width: 480px;
                max-height: 90vh;
                max-height: 90dvh;
                overflow: auto;
                overscroll-behavior: contain;
                box-shadow: 0 18px 70px #0007
            }

            .creator-dialog::backdrop {
                background: #0009;
                backdrop-filter: blur(5px)
            }

            .creator-dialog>header {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 14px 18px;
                border-bottom: 1px solid #ffffff09;
                position: sticky;
                top: 0;
                background: #191a1cf5;
                backdrop-filter: blur(10px);
                z-index: 1
            }

            .creator-dialog h2 {
                font-size: 17px;
                font-weight: 600
            }

            .creator-form {
                padding: 18px 20px 24px
            }

            .creator-intro {
                font-size: 11px;
                line-height: 1.8;
                color: var(--muted);
                margin-bottom: 21px !important
            }

            .creator-form label {
                display: block;
                font-size: 12px;
                color: var(--text);
                margin-bottom: 17px
            }

            .creator-required {
                font-style: normal;
                color: #f18ba4
            }

            .creator-form label>small {
                font-size: 10px;
                color: var(--muted);
                margin-left: 5px
            }

            .creator-form input,
            .creator-form textarea,
            .creator-form select {
                display: block;
                width: 100%;
                min-width: 0;
                border: 1px solid #ffffff14;
                border-radius: 7px;
                background: var(--surface2);
                color: var(--text);
                padding: 11px 12px;
                margin-top: 8px;
                font: inherit;
                font-size: 12px;
                outline: none;
                color-scheme: dark
            }

            .creator-form textarea {
                resize: vertical;
                min-height: 106px;
                line-height: 1.8
            }

            .creator-form input:focus,
            .creator-form textarea:focus,
            .creator-form select:focus {
                border-color: var(--gold)
            }

            .creator-form input::placeholder,
            .creator-form textarea::placeholder {
                color: var(--muted)
            }

            .creator-form .creator-count {
                display: block;
                text-align: right;
                font-size: 10px;
                margin-top: 6px;
                color: var(--muted)
            }

            .creator-pair {
                display: grid;
                grid-template-columns: 1fr 2fr;
                gap: 11px
            }

            .creator-form .creator-verify-row {
                display: flex;
                align-items: center;
                gap: 11px
            }

            .creator-verify-row input {
                flex: 1
            }

            .creator-verify-row button {
                border: 0;
                padding: 0;
                background: transparent;
                margin-top: 8px;
                flex-shrink: 0;
                border-radius: 6px;
                overflow: hidden
            }

            .creator-verify-row img {
                display: block;
                width: 120px;
                height: 42px;
                object-fit: contain;
                background: #fff
            }

            .creator-privacy {
                font-size: 10px;
                color: var(--muted);
                line-height: 1.8;
                margin: 7px 0 !important
            }

            .creator-public-note {
                font-size: 11px;
                line-height: 1.8;
                background: #52322c66;
                color: #f5c3a9;
                padding: 10px 12px;
                border-radius: 7px;
                margin-bottom: 15px !important
            }

            .creator-error {
                background: #5e253045;
                color: #f4b0be;
                border: 1px solid #a64d6233;
                border-radius: 6px;
                font-size: 12px;
                padding: 10px;
                margin-bottom: 13px !important;
                overflow-wrap: anywhere
            }

            .creator-error a {
                color: #ffe0ea;
                text-decoration: underline
            }

            .creator-form .creator-apply {
                margin-top: 18px
            }

            .creator-success {
                padding: 36px 24px 28px;
                text-align: center
            }

            .creator-success-icon {
                display: grid;
                place-items: center;
                width: 62px;
                height: 62px;
                border-radius: 50%;
                background: #d4b58518;
                color: var(--gold);
                margin: 0 auto 22px
            }

            .creator-success-icon svg {
                width: 29px;
                height: 29px
            }

            .creator-success h3 {
                font-size: 20px;
                margin-bottom: 13px
            }

            .creator-success p {
                font-size: 12px;
                line-height: 1.9;
                color: var(--muted)
            }

            .creator-page :focus-visible,
            .creator-dialog :focus-visible {
                outline: 2px solid var(--gold);
                outline-offset: 4px
            }

            .creator-page [hidden],
            .creator-dialog [hidden] {
                display: none !important
            }

            .creator-spinner {
                width: 15px;
                height: 15px;
                border: 2px solid #ffffff55;
                border-top-color: #fff;
                border-radius: 50%;
                animation: creator-spin .8s linear infinite
            }

            @keyframes creator-spin {
                to {
                    transform: rotate(360deg)
                }
            }

            @media(max-width:600px) {
                .creator-page {
                    margin: 8px auto 26px;
                    padding: 0 18px;
                    max-width: 480px
                }

                .creator-heading {
                    height: 52px;
                    margin-bottom: 10px
                }

                .creator-hero {
                    padding: 24px 21px
                }

                .creator-hero h2 {
                    font-size: 27px;
                    margin: 20px 0 14px
                }

                .creator-hero>p {
                    font-size: 12px
                }

                .creator-art {
                    right: 3px;
                    top: 61px
                }

                .creator-art svg {
                    width: 85px;
                    height: 85px
                }

                .creator-role p,
                .creator-steps p,
                .creator-faq p {
                    font-size: 11px
                }

                .creator-benefits {
                    gap: 9px
                }

                .creator-benefits>div {
                    padding: 16px 11px
                }

                .creator-benefits strong {
                    font-size: 12px
                }

                .creator-benefits p {
                    font-size: 10px
                }

                .creator-note {
                    font-size: 10px
                }

                .creator-dialog {
                    width: 100%;
                    max-width: 480px;
                    margin: 0 auto;
                    border-radius: 18px 18px 0 0;
                    max-height: 91vh;
                    max-height: 91dvh;
                    top: auto;
                    bottom: 0;
                    padding-bottom: env(safe-area-inset-bottom)
                }
            }

            @media(max-width:370px) {
                .creator-page {
                    padding-left: 15px;
                    padding-right: 15px
                }

                .creator-hero {
                    padding: 22px 17px
                }

                .creator-hero h2 {
                    font-size: 25px
                }

                .creator-benefits {
                    gap: 7px
                }

                .creator-benefits>div {
                    padding: 14px 9px
                }

                .creator-form {
                    padding-left: 17px;
                    padding-right: 17px
                }
            }

            @media(prefers-reduced-motion:reduce) {
                .creator-spinner {
                    animation: none
                }

                .creator-apply {
                    transition: none
                }
            }

            /* Match the site's black and gold theme and responsive content width. */
            .creator-page {
                width: min(calc(100% - 96px), 1120px);
                max-width: none;
                padding: 0;
                margin: 30px auto 52px;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 30px 36px
            }

            .creator-heading {
                grid-column: 1/-1;
                justify-content: flex-start;
                gap: 12px;
                height: auto;
                margin: 0;
                color: var(--muted)
            }

            .creator-heading h1 {
                font-size: 13px;
                font-weight: 400;
                color: var(--muted)
            }

            .creator-heading>span {
                display: none
            }

            .creator-back {
                width: 28px;
                height: 28px;
                color: var(--muted)
            }

            .creator-hero {
                grid-column: 1/-1;
                text-align: center;
                padding: 44px 36px 42px;
                border: 1px solid #d4b58522;
                border-radius: 12px;
                background: radial-gradient(ellipse at 50% 0, #d4b58512, transparent 75%), #151514
            }

            .creator-pill {
                border: 0;
                background: none;
                color: var(--gold);
                font-size: 11px;
                letter-spacing: 2px;
                padding: 0
            }

            .creator-pill svg {
                display: none
            }

            .creator-hero h2 {
                font-size: 42px;
                line-height: 1.4;
                letter-spacing: 1px;
                margin: 20px 0 15px
            }

            .creator-hero h2 br {
                display: none
            }

            .creator-hero>p {
                max-width: 680px;
                margin: 0 auto;
                color: var(--muted);
                font-size: 13px
            }

            .creator-art {
                display: none
            }

            .creator-section {
                margin: 0;
                min-width: 0
            }

            .creator-section>h2 {
                font-size: 23px;
                margin-bottom: 22px;
                color: var(--text)
            }

            .creator-section:nth-of-type(2) {
                grid-column: 1/-1;
                display: grid;
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 18px
            }

            .creator-section:nth-of-type(2)>h2 {
                grid-column: 1/-1;
                margin: 0 0 3px
            }

            .creator-role {
                padding: 23px 20px;
                border: 1px solid var(--line);
                background: var(--surface);
                border-radius: 10px;
                gap: 13px
            }

            .creator-role h3 {
                font-size: 15px;
                margin-bottom: 9px
            }

            .creator-role p {
                font-size: 12px;
                line-height: 1.9
            }

            .creator-role>span {
                border-radius: 8px
            }

            .creator-section:nth-of-type(3) {
                grid-column: 1/-1
            }

            .creator-benefits {
                gap: 18px
            }

            .creator-benefits>div {
                padding: 22px 23px;
                border-radius: 10px
            }

            .creator-benefits strong {
                font-size: 15px;
                color: var(--gold)
            }

            .creator-benefits p {
                font-size: 12px
            }

            .creator-note {
                font-size: 11px;
                color: var(--muted)
            }

            .creator-section:nth-of-type(4) {
                padding: 25px 28px;
                border: 1px solid var(--line);
                border-radius: 10px;
                background: var(--surface)
            }

            .creator-steps {
                gap: 19px
            }

            .creator-steps b {
                font: italic 24px/1.5 Georgia, serif
            }

            .creator-steps strong {
                font-size: 14px
            }

            .creator-steps p {
                font-size: 12px
            }

            .creator-faq {
                margin: 0;
                padding: 28px;
                background: var(--surface);
                border: 1px solid var(--line);
                border-radius: 10px;
                align-self: stretch;
                display: flex;
                flex-direction: column;
                justify-content: center
            }

            .creator-faq h2 {
                font-size: 19px;
                line-height: 1.6;
                margin-bottom: 15px
            }

            .creator-faq p {
                font-size: 13px;
                line-height: 2
            }

            .creator-apply {
                background: linear-gradient(110deg, var(--gold-light), #c6a36e);
                color: #201c15;
                border: 1px solid #d4b58540;
                font-size: 14px;
                border-radius: 8px;
                min-height: 46px;
                padding: 12px 24px
            }

            .creator-apply:hover {
                color: #181512;
                filter: brightness(1.06)
            }

            .creator-page>.creator-apply {
                grid-column: 1/-1;
                width: auto;
                min-width: 250px;
                justify-self: center;
                margin: 0;
                gap: 18px;
                border-radius: 30px
            }

            .creator-apply .creator-arrow,
            .creator-apply .creator-send {
                margin: 0
            }

            .creator-footer-note {
                grid-column: 1/-1;
                margin: -18px 0 0 !important
            }

            .creator-disabled {
                grid-column: 1/-1
            }

            .creator-dialog {
                border-radius: 12px;
                border-color: #d4b58525;
                max-width: 520px;
                background: var(--surface)
            }

            .creator-dialog>header {
                padding: 16px 22px;
                background: #191a1cf5
            }

            .creator-form {
                padding: 22px 24px 26px
            }

            .creator-close {
                color: var(--muted)
            }

            .creator-form label {
                font-size: 13px
            }

            .creator-form input,
            .creator-form textarea,
            .creator-form select {
                font-size: 13px;
                border-color: #ffffff14
            }

            .creator-required {
                color: var(--gold)
            }

            .creator-spinner {
                border-color: #201c1530;
                border-top-color: #201c15
            }

            .creator-success-icon {
                background: #d4b58518;
                color: var(--gold)
            }

            .creator-error {
                background: #5e253045;
                color: #f4b0be
            }

            .creator-form .creator-apply {
                width: 100%
            }

            @media(max-width:1250px) {
                .creator-page {
                    width: calc(100% - 64px)
                }
            }

            @media(max-width:1000px) {
                .creator-page {
                    width: calc(100% - 40px);
                    gap: 26px 22px
                }

                .creator-role {
                    padding: 20px 16px;
                    flex-direction: column
                }

                .creator-hero h2 {
                    font-size: 35px
                }

                .creator-faq h2 {
                    font-size: 17px
                }
            }

            @media(max-width:700px) {
                .creator-page {
                    width: calc(100% - 32px);
                    max-width: none;
                    margin: 20px auto 30px;
                    gap: 25px;
                    grid-template-columns: 1fr;
                    padding: 0
                }

                .creator-heading {
                    height: auto;
                    margin: 0;
                    gap: 8px
                }

                .creator-hero {
                    padding: 29px 20px;
                    border-radius: 10px
                }

                .creator-pill {
                    font-size: 9px;
                    letter-spacing: 1px
                }

                .creator-hero h2 {
                    font-size: 29px;
                    margin: 18px 0 14px;
                    line-height: 1.6
                }

                .creator-hero h2 br {
                    display: block
                }

                .creator-hero>p {
                    font-size: 12px;
                    line-height: 1.95
                }

                .creator-section>h2 {
                    font-size: 20px;
                    margin-bottom: 17px
                }

                .creator-section:nth-of-type(2) {
                    grid-template-columns: 1fr;
                    gap: 12px
                }

                .creator-section:nth-of-type(2)>h2 {
                    margin-bottom: 5px
                }

                .creator-role {
                    flex-direction: row;
                    padding: 18px 17px;
                    align-items: flex-start;
                    gap: 13px
                }

                .creator-role h3 {
                    font-size: 14px
                }

                .creator-role p {
                    font-size: 11px
                }

                .creator-benefits {
                    gap: 9px
                }

                .creator-benefits>div {
                    padding: 18px 11px
                }

                .creator-benefits strong {
                    font-size: 12px
                }

                .creator-benefits p {
                    font-size: 10px;
                    line-height: 1.9
                }

                .creator-note {
                    font-size: 10px
                }

                .creator-section:nth-of-type(4) {
                    padding: 21px 20px
                }

                .creator-steps strong {
                    font-size: 13px
                }

                .creator-steps p {
                    font-size: 11px
                }

                .creator-faq {
                    padding: 22px 20px
                }

                .creator-faq h2 {
                    font-size: 16px;
                    margin-bottom: 10px
                }

                .creator-faq p {
                    font-size: 12px
                }

                .creator-page>.creator-apply {
                    width: 100%;
                    min-width: 0;
                    max-width: 340px;
                    font-size: 13px
                }

                .creator-footer-note {
                    margin-top: -15px !important
                }

                .creator-dialog {
                    max-width: 520px;
                    border-radius: 14px 14px 0 0
                }

                .creator-form {
                    padding: 18px 20px 24px
                }

                .creator-dialog>header {
                    padding: 14px 18px
                }

                .creator-form label,
                .creator-form input,
                .creator-form textarea,
                .creator-form select {
                    font-size: 12px
                }
            }