:root {
    --theme-text: #26314d;
    --theme-primary: #3858d6;
    --theme-secondary: #16b9b1;
    --surface: #fff;
    --surface-muted: #f7f8ff;
    --border: #cbd3ee;
    --link: #3156d9;
    --bright-blue: #3858d6;
    --bright-blue-dark: #263da8;
    --bright-cyan: #12b9c7;
    --bright-green: #23b574;
    --bright-orange: #ff8b32;
    --bright-pink: #ed4f91;
    --bright-purple: #794fd1;
    --bright-yellow: #ffd84d;
    --bright-ink: #26314d;
    --bright-shadow: 0 12px 32px rgba(50, 67, 135, .13);
    font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
    color: var(--bright-ink);
    background: #eef1ff;
}

body {
    color: var(--bright-ink);
    background:
        radial-gradient(circle at 9% 3%, rgba(255, 216, 77, .38), transparent 21rem),
        radial-gradient(circle at 92% 4%, rgba(237, 79, 145, .2), transparent 24rem),
        linear-gradient(180deg, #f8f9ff 0, #eef2ff 44rem, #f7f9ff 100%);
    font-size: .94rem;
}

a { color: var(--bright-blue); text-underline-offset: .16em; }
a:visited { color: #6445b5; }
a:hover { color: #d83f7f; }

.site-header, .site-footer { width: min(100% - 2rem, 88rem); }
.site-header { padding: 1rem 0 .8rem; }
.site-shell {
    width: min(100% - 2rem, 88rem);
    max-width: 88rem;
    padding: clamp(.85rem, 2vw, 1.4rem);
    background: rgba(255, 255, 255, .94);
    border: 1px solid rgba(174, 185, 225, .9);
    border-radius: 1.15rem;
    box-shadow: var(--bright-shadow);
}
.admin-page .site-shell, .members-page .site-shell { width: min(100% - 2rem, 100rem); max-width: 100rem; }

.site-brand {
    position: relative;
    display: flex;
    align-items: center;
    gap: .8rem;
    min-width: min(100%, 27rem);
    padding: .75rem 1rem;
    color: #fff !important;
    text-align: left;
    text-decoration: none;
    background: linear-gradient(110deg, var(--bright-blue-dark), var(--bright-blue) 52%, var(--bright-purple));
    border: 1px solid #263da8;
    border-radius: .9rem;
    box-shadow: 0 5px 0 #1b2c82, 0 11px 25px rgba(37, 55, 145, .18);
}
.site-brand:visited, .site-brand:hover { color: #fff !important; }
.site-brand:hover { transform: translateY(-1px); }
.site-brand__spark { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; color: #5e4900; background: var(--bright-yellow); border-radius: 50%; box-shadow: inset 0 -3px 0 rgba(150, 104, 0, .16); }
.site-brand__copy { display: grid; gap: .12rem; }
.site-brand__copy strong { font-size: clamp(1.05rem, 3vw, 1.4rem); letter-spacing: -.02em; }
.site-brand__copy small { color: #dfe7ff; font-size: .7rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.site-brand__burst { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; margin-left: auto; color: #6c2949; font-size: .78rem; font-weight: 900; background: #ff9ec6; border: 2px solid #fff; border-radius: 50%; transform: rotate(7deg); }

.site-footer { padding: 1.25rem .75rem 1.7rem; color: #65708f; }
.site-footer nav { gap: .5rem 1rem; }

h1, h2, h3 { color: #28386f; letter-spacing: -.025em; }
.eyebrow { color: #5968a2; font-size: .71rem; font-weight: 900; letter-spacing: .13em; }

input, select, textarea {
    min-height: 2.65rem;
    padding: .68rem .76rem;
    color: var(--bright-ink);
    background: #fff;
    border: 1px solid #aeb9dd;
    border-radius: .55rem;
    box-shadow: inset 0 1px 2px rgba(44, 56, 105, .08);
}
textarea { min-height: 7rem; }
input:focus, select:focus, textarea:focus { border-color: var(--bright-blue); box-shadow: 0 0 0 3px rgba(56, 88, 214, .16); outline: 0; }
button, input[type="button"], input[type="submit"], .button, a.button {
    min-height: 2.65rem;
    padding: .65rem 1rem;
    color: #fff !important;
    font-weight: 900;
    letter-spacing: .01em;
    background: linear-gradient(180deg, #5274ef, var(--bright-blue));
    border: 1px solid #2942ae;
    border-radius: .58rem;
    box-shadow: 0 3px 0 #243a9c, 0 7px 16px rgba(46, 66, 165, .18);
    transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
}
button:hover, input[type="button"]:hover, input[type="submit"]:hover, .button:hover, a.button:hover { color: #fff !important; filter: brightness(1.08); transform: translateY(-1px); }
button:active, input[type="submit"]:active, .button:active { box-shadow: 0 1px 0 #243a9c; transform: translateY(2px); }
.button-secondary, .button--secondary, a.button-secondary, a.button--secondary { color: #6b4d00 !important; background: linear-gradient(180deg, #ffe77e, var(--bright-yellow)); border-color: #cda927; box-shadow: 0 3px 0 #b89620; }
.button-secondary:hover, .button--secondary:hover, a.button-secondary:hover, a.button--secondary:hover { color: #4b3700 !important; }
:focus-visible { outline: 3px solid #ffb52d; outline-offset: 3px; }

.panel, .index-copy, .join-card, .game-result, .login-panel, .settings-group,
.member-summary, .member-menu, .paid-links, .member-buttons, .solo-reader-card,
.form-card, .inventory-card, .campaign-group, .admin-navigation, .challenge-card,
.challenge-landing > section {
    background: linear-gradient(180deg, #fff, #fafbff);
    border: 1px solid #ccd4ee;
    border-radius: .9rem;
    box-shadow: 0 7px 20px rgba(45, 60, 127, .09);
}
.login-panel { max-width: 30rem; padding: clamp(1.25rem, 4vw, 2rem); border-top: 5px solid var(--bright-cyan); }
.notice { color: #24574e; background: #e6fbf5; border: 1px solid #8ad8c2; border-left: 6px solid var(--bright-green); border-radius: .65rem; }
.notice-error { color: #7c2947; background: #fff0f5; border-color: #f3aac7; border-left-color: var(--bright-pink); }
.notice-success { color: #145a42; background: #e9fff6; border-color: #8cdfbd; border-left-color: var(--bright-green); }

.member-layout, .admin-layout { gap: 1.35rem; }
.member-summary { border-top: 5px solid var(--bright-orange); }
.member-menu { border-top: 5px solid var(--bright-cyan); }
.paid-links { border-top: 5px solid var(--bright-purple); }
.member-buttons { border-top: 5px solid var(--bright-pink); }
.member-summary h2, .member-menu h2, .paid-links h2, .settings-group h2, .admin-menu__section h2 { color: var(--bright-blue-dark); }
.account-stats div { background: #f2f5ff; border: 1px solid #d9dff5; }
.account-stats dd { color: var(--bright-blue-dark); font-size: 1.05rem; }
.daily-bonus { color: #5e4300 !important; background: linear-gradient(120deg, #ffe36c, #ffad45); border: 1px solid #d29425; box-shadow: 0 4px 0 #c28621; }
.member-menu-group summary { color: #344580; }
.member-menu-group summary::after { display: grid; place-items: center; width: 1.35rem; height: 1.35rem; color: #fff; background: var(--bright-pink); border-radius: 50%; }
.member-menu__link, .paid-links a { padding: .58rem .5rem; border-color: #e1e5f4; border-radius: .4rem; }
.member-menu__link:hover, .paid-links a:hover { color: var(--bright-blue-dark); background: #eef2ff; }
.member-menu__link[aria-current="page"] { color: #fff; font-weight: 900; background: linear-gradient(90deg, var(--bright-blue), var(--bright-purple)); }

.admin-navigation { border-top: 5px solid var(--bright-purple); }
.admin-menu__section { padding-bottom: .8rem; border-bottom: 1px solid #e0e4f3; }
.admin-menu__section a { padding: .3rem .4rem; border-radius: .35rem; }
.admin-menu__section a:hover { background: #eef1ff; }

.member-welcome, .stats-hero, .ad-setup-page__hero, .html-ad-hero, .promo-admin__hero,
.moderation-hero, .campaign-dashboard__hero, .text-post-hero, .challenge-hero {
    color: #fff;
    background: linear-gradient(120deg, var(--bright-blue-dark), var(--bright-blue) 45%, var(--bright-purple));
    border: 1px solid #263da8;
    border-radius: 1rem;
    box-shadow: 0 8px 0 rgba(37, 55, 145, .16), 0 17px 32px rgba(42, 57, 130, .15);
}
.member-welcome h1, .stats-hero h1, .ad-setup-page__hero h1, .html-ad-hero h1,
.campaign-dashboard__hero h1, .challenge-hero h1 { color: #fff; }
.member-welcome .eyebrow, .stats-hero .eyebrow, .challenge-hero .eyebrow { color: #d9e4ff; }

.status-pill { border-radius: 999px; }
.inventory-card { border-left: 5px solid var(--bright-cyan); }
.campaign-summary article:nth-child(4n+1), .challenge-metrics span:nth-child(4n+1) { border-top: 4px solid var(--bright-blue); }
.campaign-summary article:nth-child(4n+2), .challenge-metrics span:nth-child(4n+2) { border-top: 4px solid var(--bright-pink); }
.campaign-summary article:nth-child(4n+3), .challenge-metrics span:nth-child(4n+3) { border-top: 4px solid var(--bright-green); }
.campaign-summary article:nth-child(4n+4), .challenge-metrics span:nth-child(4n+4) { border-top: 4px solid var(--bright-orange); }
progress { overflow: hidden; accent-color: var(--bright-green); border-radius: 999px; }

.challenge-public-page .site-shell { overflow: hidden; padding: clamp(.75rem, 2vw, 1.25rem); }
.challenge-landing { gap: clamp(1.25rem, 3vw, 2rem); }
.challenge-landing > section { position: relative; overflow: hidden; }
.challenge-landing > .challenge-public-hero {
    color: #fff;
    background:
        radial-gradient(circle at 88% 18%, rgba(255, 216, 77, .95) 0 2.7rem, transparent 2.8rem),
        radial-gradient(circle at 82% 73%, rgba(237, 79, 145, .75) 0 4rem, transparent 4.1rem),
        linear-gradient(125deg, #2d48b7, #4868e9 48%, #7750ce);
    border: 0;
    border-radius: 1.1rem;
    box-shadow: 0 10px 0 rgba(40, 57, 142, .18), 0 22px 44px rgba(42, 55, 130, .2);
}
.challenge-landing > .challenge-public-hero h1 { max-width: 13ch; color: #fff; line-height: 1; text-shadow: 0 2px 0 rgba(0, 0, 0, .12); }
.challenge-landing > .challenge-public-hero .eyebrow { color: #ffe883; }
.challenge-landing > .challenge-public-hero small { color: #e2e8ff; }
.challenge-public-visual { background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .3); box-shadow: inset 0 1px rgba(255, 255, 255, .25); }
.challenge-public-visual strong { padding: .65rem; color: #27356b; background: #fff; border-radius: .5rem; box-shadow: 0 3px 0 rgba(29, 42, 108, .28); }
.challenge-public-visual strong:first-child { background: var(--bright-yellow); }
.challenge-public-visual strong:last-child { color: #fff; background: var(--bright-pink); }
.challenge-public-grid article { min-height: 5rem; background: #f8f9ff; border: 1px solid #dbe1f6; border-top: 4px solid var(--bright-cyan); }
.challenge-public-grid article:nth-child(4n+2) { border-top-color: var(--bright-pink); }
.challenge-public-grid article:nth-child(4n+3) { border-top-color: var(--bright-orange); }
.challenge-public-grid article:nth-child(4n+4) { border-top-color: var(--bright-purple); }
.challenge-public-steps li { background: #f3f5ff; border: 1px solid #d8def4; box-shadow: 0 4px 10px rgba(50, 65, 125, .07); }
.challenge-public-steps li:nth-child(4n+2) span { background: var(--bright-pink); }
.challenge-public-steps li:nth-child(4n+3) span { background: var(--bright-orange); }
.challenge-public-steps li:nth-child(4n+4) span { background: var(--bright-purple); }
.challenge-expectations { background: #fff9dc !important; border: 1px solid #e8c94e !important; border-left: 7px solid var(--bright-yellow) !important; }
.sales-join { background: linear-gradient(135deg, #eff5ff, #f9f2ff 55%, #fff7da); border: 1px solid #c8d2f0; box-shadow: 0 10px 28px rgba(47, 63, 130, .12); }
.sales-signup-form { background: #fff; border: 1px solid #cdd5ef; box-shadow: 0 7px 22px rgba(48, 61, 122, .1); }
.sales-faq__list details { border: 1px solid #d3daf0; border-left: 5px solid var(--bright-cyan); box-shadow: 0 4px 12px rgba(43, 57, 119, .06); }
.sales-faq__list details:nth-child(even) { border-left-color: var(--bright-pink); }

@media (prefers-reduced-motion: no-preference) {
    .site-brand__spark { animation: bright-pop 3s ease-in-out infinite; }
    @keyframes bright-pop { 0%, 100% { transform: rotate(0) scale(1); } 50% { transform: rotate(10deg) scale(1.08); } }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
@media (max-width: 40rem) {
    .site-header, .site-footer { width: min(100% - 1rem, 88rem); }
    .site-shell, .admin-page .site-shell, .members-page .site-shell { width: calc(100% - 1rem); padding: .65rem; border-radius: .85rem; }
    .site-brand { width: 100%; min-width: 0; padding: .65rem .75rem; }
    .site-brand__burst { display: none; }
    .site-brand__copy small { letter-spacing: .06em; }
}
@media (max-width: 55.99rem) { .member-main { grid-row: 1; } .member-sidebar { grid-row: 2; } }
