:root {
  --black: #191916;
  --page: #eee9df;
  --card: #fffdf8;
  --raised: #f7f1e6;
  --input: #fffaf2;
  --gold-light: #d1ad60;
  --gold: #ad7615;
  --gold-dark: #70490a;
  --cream: #24231f;
  --muted: #6d6961;
  --line: rgba(145, 96, 16, .38);
  --line-soft: rgba(76, 65, 48, .20);
  --shadow: 0 22px 65px rgba(52, 40, 21, .16), 0 3px 10px rgba(52, 40, 21, .07);
  --radius: 14px;
  --font-dashboard-display: "Inter Tight", "Arial Narrow", Arial, sans-serif;
  --font-dashboard-body: "Inter", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { color-scheme: light; background: var(--page); scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--page); color: var(--cream); font-family: var(--font-dashboard-body), Arial, sans-serif; font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }
img { max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-dashboard-display), Impact, sans-serif; text-transform: uppercase; letter-spacing: .02em; line-height: .98; }
h2 { font-size: clamp(1.7rem, 2.3vw, 2.45rem); }
h3 { font-size: 1.35rem; }
small { color: var(--muted); }
[hidden] { display: none !important; }

.loading-screen { min-height: 100vh; display: grid; place-content: center; justify-items: center; gap: 18px; background: var(--page); }
.loading-screen img { width: 132px; }
.loading-screen p { color: var(--muted); letter-spacing: .05em; }
.spinner { width: 28px; height: 28px; border: 2px solid rgba(201,168,76,.18); border-top-color: var(--gold); border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.gold-button, .outline-button, .mini-button, .text-button, .referral-link button, .referral-link a { border-radius: 7px; cursor: pointer; font-weight: 700; letter-spacing: .035em; transition: transform .16s, border-color .16s, background .16s; }
.gold-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 0 24px; border: 1px solid var(--gold-light); background: linear-gradient(135deg, var(--gold-light), var(--gold), var(--gold-dark)); color: #090a08; box-shadow: 0 10px 30px rgba(201,168,76,.15); }
.gold-button:hover { transform: translateY(-1px); filter: brightness(1.07); }
.gold-button:disabled { cursor: not-allowed; filter: grayscale(.7); opacity: .5; transform: none; }
.outline-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0 19px; border: 1px solid rgba(201,168,76,.38); background: transparent; color: var(--gold-light); }
.outline-button:hover { background: rgba(201,168,76,.08); border-color: var(--gold); }
.text-button { min-height: 40px; border: 0; background: transparent; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.button-link { text-decoration: none; }
.button-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.mini-button { border: 1px solid var(--line-soft); background: #171817; color: var(--cream); padding: 7px 10px; font-size: .78rem; }
.mini-button:hover { border-color: var(--gold-dark); }
.section-kicker, .auth-kicker { display: block; margin-bottom: 8px; color: var(--gold); font-size: .7rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; }

/* Authentication */
.auth-page { min-height: 100vh; display: grid; place-content: center; justify-items: center; padding: 42px 20px; background: linear-gradient(rgba(7,8,7,.2), rgba(7,8,7,.88)), repeating-linear-gradient(120deg, transparent 0 60px, rgba(201,168,76,.018) 60px 61px), var(--page); }
.auth-brand { width: 180px; margin-bottom: 25px; }
.auth-brand img { display: block; }
.auth-card { width: min(100%, 590px); padding: 44px 46px 38px; position: relative; overflow: hidden; border: 1px solid rgba(201,168,76,.22); border-radius: 3px 3px 18px 18px; background: linear-gradient(160deg, rgba(20,20,20,.98), rgba(11,11,11,.99)); box-shadow: var(--shadow); }
.auth-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, transparent, var(--gold-light), var(--gold), transparent); }
.auth-card::after { content: "TPC"; position: absolute; right: -12px; top: 12px; font: 900 6rem/1 var(--font-dashboard-display); color: rgba(201,168,76,.025); pointer-events: none; }
.auth-card h1 { margin-bottom: 12px; font-size: clamp(2.5rem, 8vw, 4rem); color: white; }
.auth-subtitle { max-width: 430px; margin-bottom: 27px; color: #aaa08d; }
.auth-footer { margin: 21px 0 0; font-size: .85rem; color: var(--muted); }
.auth-footer a, .auth-switch a, .form-row a, .member-gate-note a { color: var(--gold-light); text-underline-offset: 3px; }
.auth-switch { margin: 25px 0 0; text-align: center; color: var(--muted); font-size: .9rem; }
.stack { display: grid; gap: 17px; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { display: grid; gap: 7px; }
.field > span { color: #d9cfb8; font-size: .76rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.field input, .field select, .field textarea, .admin-search input, .registry-select { width: 100%; min-height: 48px; border: 1px solid rgba(255,255,255,.11); border-radius: 7px; background: var(--input); color: white; padding: 11px 14px; }
.field textarea { min-height: 110px; resize: vertical; }
.field input:hover, .field input:focus, .field select:focus, .field textarea:focus { border-color: rgba(201,168,76,.55); }
.field-help { margin: -10px 0 0; color: var(--muted); font-size: .78rem; }
.form-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: .82rem; }
.check { display: flex; align-items: flex-start; gap: 9px; color: #b8af9d; font-size: .83rem; }
.check input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: var(--gold); }
.terms { line-height: 1.45; }
.activation-steps { display: grid; grid-template-columns: 1fr 38px 1fr; align-items: center; margin: 0 0 25px; padding: 13px 0; border-block: 1px solid var(--line-soft); }
.activation-steps > span { display: flex; align-items: center; gap: 7px; color: #746e62; font-size: .76rem; font-weight: 800; }
.activation-steps > span:last-child { justify-content: flex-end; }
.activation-steps b { font: inherit; text-transform: uppercase; letter-spacing: .05em; }
.activation-steps .active { color: var(--gold-light); }
.activation-steps .complete { color: #65d49b; }
.activation-steps i { height: 1px; background: var(--line); }
.member-gate-note { margin-top: 24px; padding: 17px 18px; border-left: 2px solid var(--gold-dark); background: rgba(201,168,76,.045); }
.member-gate-note strong { font-family: var(--font-dashboard-display); font-size: 1.05rem; text-transform: uppercase; }
.member-gate-note p { margin: 3px 0; color: var(--muted); font-size: .84rem; }
.member-gate-note a { font-size: .8rem; font-weight: 700; }
.verified-member { display: grid; padding: 14px 16px; border: 1px solid rgba(69,181,119,.22); border-radius: 8px; background: rgba(21,95,55,.13); }
.verified-member span { color: #6ed99f; font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; }
.verified-member strong { color: white; }
.activation-success { display: grid; gap: 13px; justify-items: center; padding: 12px 0 4px; text-align: center; }
.activation-success > span { display: grid; width: 62px; height: 62px; place-items: center; border: 1px solid var(--gold); border-radius: 50%; color: var(--gold-light); font-size: 1.7rem; }
.activation-success h2 { margin: 7px 0 0; font-size: 2rem; }
.activation-success p { color: var(--muted); }
.notice { margin: 0 0 18px; padding: 12px 14px; border: 1px solid; border-radius: 7px; font-size: .86rem; }
.notice-error { border-color: rgba(225,81,71,.4); background: rgba(121,30,25,.19); color: #ffb4ad; }
.notice-success { border-color: rgba(76,194,129,.38); background: rgba(20,96,54,.19); color: #9ce5bd; }
.notice-info { border-color: rgba(201,168,76,.3); background: rgba(201,168,76,.07); color: var(--gold-light); }

/* Shared portal shell */
.portal-layout { min-height: 100vh; background: var(--page); }
.sidebar { position: fixed; z-index: 30; inset: 0 auto 0 0; width: 244px; display: flex; flex-direction: column; padding: 25px 18px 20px; border-right: 1px solid var(--line-soft); background: linear-gradient(180deg, #0d0d0d, #080808 70%); }
.sidebar-brand { display: block; padding: 0 14px 20px; }
.sidebar-brand img { width: 154px; display: block; }
.sidebar-brand small { display: block; margin-top: -4px; color: var(--gold-dark); letter-spacing: .22em; font-weight: 800; font-size: .59rem; }
.member-status { display: flex; align-items: center; gap: 10px; margin: 0 7px 21px; padding: 12px; border: 1px solid rgba(46,151,91,.18); background: rgba(16,61,38,.13); }
.member-status > i { width: 8px; height: 8px; border-radius: 50%; background: #4bca84; box-shadow: none; }
.member-status span { display: grid; line-height: 1.2; }
.member-status strong { color: #b9d9c7; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.member-status small { font-size: .68rem; text-transform: capitalize; }
.sidebar nav { display: grid; gap: 5px; }
.sidebar nav a { display: flex; align-items: center; gap: 12px; min-height: 45px; padding: 0 13px; border: 1px solid transparent; border-radius: 7px; color: #958e80; font-size: .87rem; font-weight: 600; text-decoration: none; }
.sidebar nav a > span { width: 20px; color: #665f52; text-align: center; font-size: .95rem; }
.sidebar nav a:hover { color: var(--cream); background: rgba(255,255,255,.035); }
.sidebar nav a.active { border-color: rgba(201,168,76,.18); background: linear-gradient(90deg, rgba(201,168,76,.12), rgba(201,168,76,.025)); color: var(--gold-light); }
.sidebar nav a.active > span { color: var(--gold); }
.sidebar-bottom { display: grid; gap: 13px; margin-top: auto; padding-top: 20px; border-top: 1px solid var(--line-soft); }
.support-link, .exit-admin { display: flex; justify-content: space-between; padding: 0 13px; color: #6f695e; font-size: .76rem; text-decoration: none; }
.support-link:hover, .exit-admin:hover { color: var(--gold-light); }
.portal-main { margin-left: 244px; min-width: 0; }
.topbar { min-height: 90px; display: flex; align-items: center; gap: 20px; padding: 17px clamp(24px, 4vw, 58px); border-bottom: 1px solid var(--line-soft); background: rgba(10,10,10,.88); backdrop-filter: blur(12px); }
.topbar-copy { display: grid; gap: 2px; }
.topbar-copy > span { color: var(--gold-dark); font-size: .63rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.topbar-copy h1 { margin: 0; color: white; font-size: 1.65rem; }
.profile-chip { display: flex; align-items: center; gap: 10px; margin-left: auto; color: var(--cream); text-decoration: none; }
.profile-chip > span { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(201,168,76,.35); border-radius: 50%; background: #171811; color: var(--gold-light); font-family: var(--font-dashboard-display); font-size: 1.1rem; font-weight: 700; }
.profile-chip b { font-size: .8rem; }
.menu-button { display: none; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 6px; background: transparent; color: var(--gold-light); }
.sidebar-scrim { display: none; position: fixed; z-index: 20; inset: 0; border: 0; background: rgba(0,0,0,.7); }
.page-content { width: min(100%, 1540px); margin: auto; padding: clamp(26px, 4vw, 54px) clamp(22px, 4vw, 58px) 70px; }

/* Member overview */
.welcome-band { position: relative; overflow: hidden; display: flex; justify-content: space-between; align-items: center; gap: 30px; margin-bottom: 23px; padding: 30px 34px; border: 1px solid rgba(201,168,76,.19); background: linear-gradient(105deg, rgba(18,18,18,.98), rgba(12,12,12,.96) 58%, rgba(93,70,23,.14)); }
.welcome-band::after { content: ""; position: absolute; right: 9%; top: -70px; width: 180px; height: 180px; border: 1px solid rgba(201,168,76,.09); transform: rotate(45deg); }
.welcome-band h2 { margin-bottom: 8px; color: white; font-size: clamp(2rem, 4vw, 3.15rem); }
.welcome-band p { margin: 0; color: #aba28f; }
.access-seal { display: flex; align-items: center; gap: 12px; min-width: 180px; }
.access-seal > i { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(76,201,132,.35); border-radius: 50%; color: #6edd9f; font-style: normal; }
.access-seal span { display: grid; }
.access-seal b { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: #cde7d8; }
.announcement-strip { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 20px; margin-bottom: 31px; padding: 15px 20px; border: 1px solid var(--line-soft); border-left: 2px solid var(--gold); background: rgba(255,255,255,.02); }
.announcement-strip > span { color: var(--gold); font-size: .65rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 800; }
.announcement-strip h3 { margin: 0 0 2px; font-size: 1rem; }
.announcement-strip p { margin: 0; color: var(--muted); font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.announcement-strip time { color: #766f62; font-size: .75rem; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 26px; }
.dashboard-aside { display: grid; align-content: start; gap: 18px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin: 0 0 16px; }
.section-heading h2 { margin: 0; }
.section-heading a, .next-call a, .rank-panel a { color: var(--gold); font-size: .76rem; font-weight: 700; text-decoration: none; }
.content-row, .content-library { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.content-card { overflow: hidden; border: 1px solid var(--line-soft); border-radius: 9px; background: var(--card); transition: border-color .18s, transform .18s; }
.content-card:hover { transform: translateY(-2px); border-color: rgba(201,168,76,.27); }
.content-art { min-height: 112px; position: relative; display: flex; align-items: end; padding: 13px; background: linear-gradient(135deg, #171717, #0d0d0d 62%, #332817); background-position: center; background-size: cover; }
.content-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent, rgba(0,0,0,.55)); }
.content-art > span { position: relative; z-index: 1; color: var(--gold-light); font-size: .61rem; font-weight: 800; text-transform: uppercase; letter-spacing: .13em; }
.content-art > i { position: absolute; z-index: 1; right: 14px; top: 14px; display: grid; width: 31px; height: 31px; place-items: center; border: 1px solid rgba(245,224,152,.3); border-radius: 50%; background: rgba(0,0,0,.34); color: var(--gold-light); font-size: .65rem; font-style: normal; }
.content-card-body { padding: 16px; }
.content-meta { display: flex; justify-content: space-between; color: #6f685c; font-size: .62rem; text-transform: uppercase; letter-spacing: .08em; }
.content-card h3 { margin: 8px 0 6px; color: white; font-size: 1.22rem; }
.content-card p { min-height: 38px; margin-bottom: 12px; color: var(--muted); font-size: .75rem; line-height: 1.45; }
.content-progress { height: 3px; overflow: hidden; background: #222; }
.content-progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--gold-dark), var(--gold-light)); }
.content-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 11px; }
.content-card-footer a { color: var(--gold-light); font-size: .72rem; font-weight: 700; text-decoration: none; }
.coming-label { color: #777064; font-size: .7rem; font-weight: 600; }
.dark-panel, .rank-panel, .form-panel, .membership-panel, .table-panel, .settings-hero { border: 1px solid var(--line-soft); background: var(--card); }
.dark-panel { padding: 25px; }
.next-call { background: linear-gradient(145deg, #171717, #101010 68%); }
.next-call time { display: block; color: var(--gold-light); font-size: .78rem; margin-bottom: 11px; }
.next-call h3 { margin-bottom: 8px; color: white; font-size: 1.55rem; }
.next-call p { color: #9e9788; font-size: .83rem; }
.next-call .gold-button { width: 100%; margin-top: 9px; }
.rank-panel { padding: 22px 25px; background: linear-gradient(140deg, rgba(201,168,76,.08), transparent), #111; }
.rank-panel > span { color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .11em; }
.rank-panel > strong { display: block; margin: 3px 0; color: var(--gold-light); font-family: var(--font-dashboard-display); font-size: 3.1rem; line-height: 1; }
.rank-panel p { margin-bottom: 9px; color: var(--muted); font-size: .75rem; }
.snapshot { margin-top: 35px; }
.stats-grid, .admin-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.stat-card { min-height: 132px; display: grid; align-content: center; gap: 4px; padding: 20px; border: 1px solid var(--line-soft); background: linear-gradient(145deg, rgba(255,255,255,.02), transparent), var(--card); }
.stat-card.accent { border-color: rgba(201,168,76,.25); background: linear-gradient(145deg, rgba(201,168,76,.1), transparent), var(--card); }
.stat-card > span { color: var(--muted); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.stat-card > strong { color: white; font: 700 clamp(1.6rem, 2.5vw, 2.25rem)/1 var(--font-dashboard-display); }
.stat-card.accent > strong { color: var(--gold-light); }
.stat-card small { font-size: .67rem; }
.empty-state { min-height: 210px; display: grid; place-content: center; justify-items: center; padding: 30px; border: 1px dashed rgba(201,168,76,.18); background: rgba(255,255,255,.015); text-align: center; }
.empty-mark { color: rgba(201,168,76,.24); font: 800 1rem var(--font-dashboard-display); letter-spacing: .18em; }
.empty-state h3 { margin: 9px 0 6px; color: white; }
.empty-state p { max-width: 460px; margin-bottom: 15px; color: var(--muted); font-size: .82rem; }

/* Content, calls, referrals, leaderboard */
.page-intro, .leaderboard-hero { margin-bottom: 34px; padding: 26px 0 30px; border-bottom: 1px solid var(--line-soft); }
.page-intro h2, .leaderboard-hero h2 { max-width: 800px; margin-bottom: 9px; color: white; font-size: clamp(2.4rem, 5vw, 4.5rem); }
.page-intro p, .leaderboard-hero p { max-width: 710px; margin: 0; color: var(--muted); }
.content-hero, .leaderboard-hero { display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.library-progress { min-width: 120px; display: grid; justify-items: center; padding: 18px; border: 1px solid var(--line); }
.library-progress strong { color: var(--gold-light); font: 700 2.5rem/1 var(--font-dashboard-display); }
.library-progress strong small { font-size: 1rem; }
.library-progress span { color: var(--muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; }
.filter-bar { display: flex; justify-content: space-between; margin-bottom: 16px; color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; }
.content-library { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.content-library .content-art { min-height: 150px; }
.call-list { display: grid; gap: 10px; margin-bottom: 44px; }
.call-list article { display: grid; grid-template-columns: 160px 1fr auto; align-items: center; gap: 22px; padding: 21px 23px; border: 1px solid var(--line-soft); background: var(--card); }
.call-list time { color: var(--gold-light); font-size: .78rem; }
.call-list h3 { margin: 0 0 4px; color: white; }
.call-list p { margin: 0; color: var(--muted); font-size: .8rem; }
.referral-activation { display: flex; align-items: center; justify-content: space-between; gap: 35px; padding: 35px; border: 1px solid var(--line); background: linear-gradient(110deg, rgba(24,24,24,.96), rgba(17,17,17,.98)); }
.referral-activation-copy { flex: 1; min-width: 0; }
.referral-activation h2 { margin: 0 0 8px; color: white; }
.referral-activation p { margin: 0; color: var(--muted); }
.referral-activation .inline-action-error { margin-top: 12px; color: #ff9f97; font-size: .86rem; font-weight: 600; }
.referral-activation .inline-action-error[hidden] { display: none; }
.referral-activation > .gold-button { flex: 0 0 auto; width: min(240px, 100%); }
.referral-link-panel { margin-bottom: 24px; padding: 25px; border: 1px solid var(--line); background: linear-gradient(110deg, #181818, #111111); }
.referral-link-panel h2 { margin-bottom: 18px; }
.referral-link { display: grid; grid-template-columns: 1fr auto auto; }
.referral-link input { min-width: 0; height: 51px; border: 1px solid rgba(201,168,76,.25); background: #101010; color: var(--cream); padding: 0 16px; }
.referral-link button, .referral-link a { display: grid; place-items: center; min-width: 100px; border: 1px solid rgba(201,168,76,.3); border-left: 0; border-radius: 0; background: #19180f; color: var(--gold-light); text-decoration: none; }
.referral-link-panel > small { display: block; margin-top: 8px; }
.referral-stats { grid-template-columns: repeat(3, 1fr); margin-bottom: 24px; }
.payout-panel { display: flex; justify-content: space-between; gap: 40px; align-items: center; }
.payout-panel > div:first-child { max-width: 720px; }
.payout-panel h2 { margin-bottom: 7px; }
.payout-panel p { margin: 0; color: var(--muted); }
.payout-panel > div:last-child { display: grid; gap: 9px; min-width: 220px; }
.leaderboard-hero { padding: 28px 34px; border: 1px solid var(--line); background: linear-gradient(110deg, rgba(20,20,20,.96), rgba(26,22,13,.58)); }
.your-rank { min-width: 150px; text-align: center; }
.your-rank span { color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; }
.your-rank strong { display: block; color: var(--gold-light); font: 700 4.5rem/1 var(--font-dashboard-display); }

/* Tables and admin */
.table-panel { overflow: hidden; }
.table-heading { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 24px; border-bottom: 1px solid var(--line-soft); }
.table-heading h2 { margin: 0; font-size: 1.55rem; }
.table-heading > span { color: var(--muted); font-size: .75rem; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 12px 17px; color: #797266; background: #0e0f0e; font-size: .64rem; letter-spacing: .09em; text-align: left; text-transform: uppercase; white-space: nowrap; }
td { padding: 15px 17px; border-top: 1px solid var(--line-soft); color: #bfb6a4; font-size: .79rem; vertical-align: middle; }
td > strong { display: block; color: #eee5d1; }
td > small { display: block; margin-top: 2px; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.current-row td { background: rgba(201,168,76,.055); }
.member-cell { display: flex; align-items: center; gap: 11px; }
.member-cell > span { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--gold-light); }
.member-cell div { display: grid; }
.rank { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid var(--line-soft); border-radius: 50%; font-weight: 800; }
.rank-1 { border-color: var(--gold); color: var(--gold-light); background: rgba(201,168,76,.1); }
.rank-2 { border-color: #aeb7bf; color: #d4dce2; }
.rank-3 { border-color: #9a6641; color: #c9936d; }
.status-pill { display: inline-flex; padding: 4px 8px; border: 1px solid; border-radius: 99px; font-size: .62rem; font-weight: 800; letter-spacing: .055em; text-transform: uppercase; white-space: nowrap; }
.status-pill.good { border-color: rgba(59,180,111,.28); background: rgba(31,116,69,.13); color: #74d9a1; }
.status-pill.warn { border-color: rgba(201,168,76,.28); background: rgba(201,168,76,.08); color: var(--gold-light); }
.status-pill.bad { border-color: rgba(220,78,66,.3); background: rgba(139,37,29,.11); color: #ff9f97; }
.table-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 170px; }
.registry-select { min-width: 160px; min-height: 34px; padding: 5px 8px; font-size: .72rem; }
.admin-sidebar { border-right-color: rgba(201,168,76,.12); background: linear-gradient(180deg, #121008, #090909 44%); }
.admin-layout .topbar { border-bottom-color: rgba(201,168,76,.14); }
.admin-stats { grid-template-columns: repeat(5, 1fr); margin-bottom: 22px; }
.admin-stats .stat-card { min-height: 120px; }
.sync-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line-soft); }
.sync-grid > article { min-height: 140px; display: grid; align-content: center; gap: 7px; padding: 22px; background: var(--card); }
.sync-grid > article > span:first-child { font-family: var(--font-dashboard-display); font-size: 1.2rem; text-transform: uppercase; }
.sync-grid article > strong { color: var(--cream); }
.admin-search { display: flex; gap: 7px; }
.admin-search input { width: 220px; min-height: 42px; }
.admin-search .outline-button { min-height: 42px; }
.admin-split { display: grid; grid-template-columns: minmax(310px, 420px) minmax(0, 1fr); align-items: start; gap: 20px; }
.form-panel { padding: 27px; }
.form-panel h2 { margin-bottom: 8px; }
.form-panel > p { color: var(--muted); font-size: .82rem; }
.settings-hero { margin-bottom: 20px; padding: 30px; background: linear-gradient(115deg, rgba(22,22,22,.96), #111); }
.settings-hero h2 { margin-bottom: 8px; }
.settings-hero p { max-width: 750px; margin: 0; color: var(--muted); }
.settings-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.settings-grid article { min-height: 125px; display: grid; align-content: center; gap: 7px; padding: 22px; border: 1px solid var(--line-soft); background: var(--card); }
.settings-grid article > span:first-child { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .07em; }

/* Account */
.account-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 18px; }
.preferences-panel { display: grid; grid-template-columns: minmax(220px, .65fr) 1fr; gap: 40px; margin-bottom: 18px; }
.preferences-panel form { display: grid; }
.preferences-panel form > label { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.preferences-panel label span { display: grid; }
.preferences-panel label strong { color: var(--cream); font-size: .85rem; }
.preferences-panel label input { width: 36px; height: 20px; accent-color: var(--gold); }
.preferences-panel button { margin-top: 16px; justify-self: end; }
.membership-panel { padding: 27px; }
.membership-panel dl { display: grid; grid-template-columns: repeat(4, 1fr); margin: 22px 0; border-block: 1px solid var(--line-soft); }
.membership-panel dl > div { padding: 16px 18px; border-right: 1px solid var(--line-soft); }
.membership-panel dl > div:last-child { border: 0; }
.membership-panel dt { color: var(--muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; }
.membership-panel dd { margin: 5px 0 0; color: var(--cream); font-size: .85rem; }

@media (max-width: 1180px) {
  .content-library { grid-template-columns: repeat(3, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-aside { grid-template-columns: 1fr 1fr; }
  .admin-stats { grid-template-columns: repeat(3, 1fr); }
  .admin-split { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .sidebar { transform: translateX(-102%); transition: transform .22s ease; box-shadow: var(--shadow); }
  .sidebar.open { transform: translateX(0); }
  .nav-open .sidebar-scrim { display: block; }
  .portal-main { margin-left: 0; }
  .menu-button { display: block; }
  .content-row, .content-library { grid-template-columns: repeat(2, 1fr); }
  .stats-grid, .referral-stats { grid-template-columns: repeat(2, 1fr); }
  .account-grid { grid-template-columns: 1fr; }
  .membership-panel dl { grid-template-columns: repeat(2, 1fr); }
  .membership-panel dl > div:nth-child(2) { border-right: 0; }
  .admin-stats { grid-template-columns: repeat(2, 1fr); }
  .settings-grid { grid-template-columns: repeat(2, 1fr); }
  .sync-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .auth-page { padding: 22px 13px; place-content: start center; }
  .auth-brand { width: 150px; margin-bottom: 17px; }
  .auth-card { padding: 32px 22px 27px; }
  .auth-card h1 { font-size: 2.75rem; }
  .field-grid { grid-template-columns: 1fr; }
  .activation-steps b { display: none; }
  .topbar { min-height: 72px; padding: 12px 17px; }
  .topbar-copy h1 { font-size: 1.35rem; }
  .profile-chip b { display: none; }
  .page-content { padding: 23px 15px 50px; }
  .welcome-band, .content-hero, .leaderboard-hero, .payout-panel, .referral-activation { align-items: flex-start; flex-direction: column; padding: 24px 20px; }
  .welcome-band .access-seal { width: 100%; padding-top: 16px; border-top: 1px solid var(--line-soft); }
  .announcement-strip { grid-template-columns: 1fr; gap: 5px; }
  .announcement-strip time { display: none; }
  .content-row, .content-library, .stats-grid, .referral-stats, .admin-stats, .settings-grid { grid-template-columns: 1fr; }
  .dashboard-aside { grid-template-columns: 1fr; }
  .content-art, .content-library .content-art { min-height: 150px; }
  .call-list article { grid-template-columns: 1fr; gap: 9px; }
  .referral-link { grid-template-columns: 1fr 1fr; }
  .referral-link input { grid-column: 1 / -1; }
  .referral-link button, .referral-link a { min-height: 43px; border: 1px solid rgba(201,168,76,.3); }
  .payout-panel > div:last-child { width: 100%; }
  .library-progress, .your-rank { align-self: stretch; }
  .table-heading { align-items: flex-start; flex-direction: column; }
  .admin-search { width: 100%; }
  .admin-search input { width: 100%; min-width: 0; }
  .preferences-panel { grid-template-columns: 1fr; gap: 10px; }
  .membership-panel dl { grid-template-columns: 1fr; }
  .membership-panel dl > div { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .membership-panel dl > div:last-child { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* Simple content-first portal */
.simple-layout .sidebar { width: 218px; padding: 24px 16px 18px; background: #0a0a0a; }
.simple-layout .sidebar-brand { margin: 0 8px 34px; }
.simple-layout .sidebar-brand img { width: 142px; }
.simple-layout .sidebar nav { gap: 4px; }
.simple-layout .sidebar nav a { min-height: 46px; padding: 0 13px; border-radius: 8px; color: #9f9b91; font-size: .88rem; }
.simple-layout .sidebar nav a span { width: 22px; color: #777268; text-align: center; }
.simple-layout .sidebar nav a.active { border: 0; background: rgba(201,168,76,.1); color: #fff6df; }
.simple-layout .sidebar nav a.active span { color: var(--gold-light); }
.simple-layout .portal-main { margin-left: 218px; }
.simple-layout .topbar { min-height: 76px; padding: 13px clamp(22px, 3vw, 44px); }
.simple-layout .topbar-copy > span { letter-spacing: .1em; }
.simple-layout .topbar-copy h1 { font-size: 1.45rem; }
.simple-layout .page-content { width: min(100%, 1320px); padding: clamp(25px, 3.5vw, 46px) clamp(20px, 3vw, 44px) 70px; }
.simple-layout .support-link, .simple-layout .exit-admin { padding: 12px 13px; color: #8c877d; font-size: .78rem; text-decoration: none; }

.simple-welcome { margin-bottom: 34px; }
.simple-welcome > span, .hub-intro > div > span, .admin-welcome > span { color: var(--gold); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.simple-welcome h2 { margin: 5px 0 7px; color: #fff; font-size: clamp(2.35rem, 5vw, 4.5rem); }
.simple-welcome p { margin: 0; color: #938e83; font-size: .95rem; }
.simple-update { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: start; margin-bottom: 34px; padding: 17px 19px; border-left: 2px solid var(--gold); background: rgba(201,168,76,.055); }
.simple-update > span { margin-top: 2px; color: var(--gold-light); font-size: .65rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.simple-update strong { color: #f6efdf; }
.simple-update p { margin: 2px 0 0; color: #aaa397; font-size: .82rem; }
.simple-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.simple-heading h2 { margin: 0; color: #fff; font-size: 2rem; }
.simple-heading a { color: var(--gold-light); font-size: .8rem; text-decoration: none; }

body.welcome-open { overflow: hidden; }
.welcome-overlay { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 18px; background: rgba(0,0,0,.82); backdrop-filter: blur(8px); }
.welcome-modal { position: relative; width: min(100%, 610px); padding: clamp(28px, 5vw, 46px); overflow: hidden; border: 1px solid rgba(201,168,76,.34); border-radius: 14px; background: linear-gradient(155deg, #171717, #0b0b0b 72%); box-shadow: 0 42px 130px rgba(0,0,0,.78); }
.welcome-modal::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, transparent, var(--gold-light), var(--gold), transparent); }
.welcome-close { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; background: rgba(0,0,0,.18); color: #a49d90; font-size: 1.3rem; cursor: pointer; }
.welcome-logo { width: 145px; display: block; margin: 0 0 26px; }
.welcome-modal h2 { max-width: 470px; margin: 0 0 13px; color: white; font-size: clamp(2.45rem, 7vw, 4.25rem); }
.welcome-lead { max-width: 510px; margin-bottom: 24px; color: #aaa397; font-size: .95rem; line-height: 1.65; }
.welcome-lead a { color: var(--gold-light); font-weight: 700; text-underline-offset: 3px; }
.welcome-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 22px; }
.welcome-steps article { display: grid; grid-template-columns: 30px 1fr; gap: 11px; align-items: center; padding: 14px; border: 1px solid var(--line-soft); border-radius: 9px; background: rgba(255,255,255,.025); }
.welcome-steps b { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(201,168,76,.34); border-radius: 50%; color: var(--gold-light); font-size: .75rem; }
.welcome-steps div { display: grid; min-width: 0; }
.welcome-steps strong { color: #f6efdf; font-family: var(--font-dashboard-display); font-size: 1.08rem; line-height: 1; text-transform: uppercase; }
.welcome-steps span { margin-top: 4px; color: #8f897f; font-size: .7rem; }
.welcome-actions { display: grid; grid-template-columns: 1fr 1.25fr; gap: 10px; }
.welcome-actions > * { width: 100%; }
.welcome-later { display: block; margin: 15px auto 0; border: 0; background: transparent; color: #777168; font-size: .76rem; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.welcome-action-message { display: grid; gap: 8px; margin-bottom: 12px; color: #9ce5bd; font-size: .79rem; }
.welcome-action-message:empty { display: none; }
.welcome-action-message.error { color: #ffb4ad; }
.welcome-action-message input { width: 100%; min-height: 40px; padding: 8px 11px; border: 1px solid rgba(76,194,129,.25); border-radius: 7px; background: #101010; color: white; font-size: .75rem; }

.hub-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.hub-card { min-width: 0; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 11px; background: #121212; transition: transform .18s ease, border-color .18s ease; }
.hub-card:hover { transform: translateY(-2px); border-color: rgba(201,168,76,.28); }
.hub-card-open { width: 100%; display: grid; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; }
.hub-card-art { position: relative; min-height: 168px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(145deg, #171717, #0c0c0c); }
.hub-card-art img { width: 100%; height: 168px; display: block; object-fit: cover; }
.hub-card-art small { position: absolute; left: 12px; top: 12px; padding: 5px 8px; border: 1px solid rgba(245,224,152,.24); border-radius: 99px; background: rgba(5,8,6,.78); color: var(--gold-light); font-size: .58rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; backdrop-filter: blur(7px); }
.content-symbol { color: var(--gold-light); font: 700 2.3rem/1 var(--font-dashboard-display); }
.hub-card-copy { min-height: 156px; display: flex; flex-direction: column; align-items: flex-start; padding: 16px 17px 17px; }
.hub-card-date { color: #767168; font-size: .66rem; }
.hub-card-copy > strong { margin: 5px 0 7px; color: #fff7e5; font-family: var(--font-dashboard-display); font-size: 1.35rem; line-height: 1.05; text-transform: uppercase; }
.hub-card-copy > span:not(.hub-card-date) { display: -webkit-box; overflow: hidden; color: #969087; font-size: .77rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.hub-card-copy > b { margin-top: auto; padding-top: 14px; color: var(--gold-light); font-size: .73rem; }
.hub-card-copy > b i { margin-left: 4px; font-style: normal; }

.hub-intro { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 20px; }
.hub-intro h2 { margin: 5px 0 0; color: white; font-size: clamp(2.4rem, 5vw, 4.25rem); }
.hub-intro input { width: min(100%, 320px); min-height: 46px; padding: 0 15px; border: 1px solid var(--line-soft); border-radius: 9px; background: #121412; color: white; }
.hub-filters { display: flex; gap: 7px; overflow-x: auto; margin-bottom: 24px; padding-bottom: 3px; }
.hub-filter { min-height: 36px; padding: 0 14px; border: 1px solid var(--line-soft); border-radius: 99px; background: transparent; color: #8f8a80; cursor: pointer; white-space: nowrap; }
.hub-filter.active { border-color: rgba(201,168,76,.4); background: rgba(201,168,76,.1); color: var(--gold-light); }

.content-viewer { width: min(920px, calc(100% - 28px)); max-height: calc(100vh - 28px); padding: 0; overflow: auto; border: 1px solid rgba(201,168,76,.25); border-radius: 13px; background: #0d0f0e; color: var(--cream); box-shadow: 0 40px 120px rgba(0,0,0,.75); }
.content-viewer::backdrop { background: rgba(0,0,0,.78); backdrop-filter: blur(5px); }
.viewer-close { position: sticky; z-index: 3; top: 12px; float: right; width: 38px; height: 38px; margin: 12px 12px -50px 0; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; background: rgba(5,6,5,.82); color: white; font-size: 1.35rem; cursor: pointer; }
.viewer-media { background: #050605; }
.viewer-media:empty { display: none; }
.viewer-media video, .viewer-media img { width: 100%; max-height: 68vh; display: block; object-fit: contain; }
.viewer-copy { padding: clamp(22px, 4vw, 38px); }
.viewer-copy > span { color: var(--gold); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.viewer-copy h2 { margin: 7px 0 13px; color: white; font-size: clamp(2rem, 5vw, 3.6rem); }
.viewer-copy p { max-width: 760px; color: #b6afa1; line-height: 1.75; }
.viewer-copy .gold-button { margin-top: 8px; }

.admin-welcome { margin-bottom: 24px; }
.admin-welcome h2 { margin: 5px 0 0; color: white; font-size: clamp(2.2rem, 4vw, 3.5rem); }
.admin-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 18px; }
.admin-actions a { min-height: 170px; display: grid; align-content: center; gap: 7px; padding: 24px; border: 1px solid var(--line-soft); border-radius: 10px; background: #121212; color: inherit; text-decoration: none; transition: border-color .16s, transform .16s; }
.admin-actions a:hover { transform: translateY(-2px); border-color: rgba(201,168,76,.32); }
.admin-actions a > span { color: var(--gold-light); font-size: 1.6rem; }
.admin-actions a > strong { color: white; font-family: var(--font-dashboard-display); font-size: 1.6rem; text-transform: uppercase; }
.admin-actions a > small { font-size: .76rem; }
.admin-quick-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 9px; background: var(--line-soft); }
.admin-quick-stats article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; background: #111111; }
.admin-quick-stats span { color: #8c877d; font-size: .73rem; }
.admin-quick-stats strong { color: white; font: 700 1.65rem/1 var(--font-dashboard-display); }

.admin-content-layout { display: grid; grid-template-columns: minmax(320px, 430px) minmax(0, 1fr); gap: 22px; align-items: start; }
.publish-panel { position: sticky; top: 96px; border-radius: 10px; }
.upload-field small { font-size: .7rem; }
.upload-progress { position: relative; height: 38px; display: grid; place-items: center; overflow: hidden; border-radius: 7px; background: rgba(201,168,76,.09); color: var(--gold-light); font-size: .75rem; }
.upload-progress i { position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(245,224,152,.2), transparent); animation: upload-slide 1.2s linear infinite; }
@keyframes upload-slide { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.admin-content-list { display: grid; gap: 10px; }
.admin-content-card { display: grid; grid-template-columns: 105px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 12px; border: 1px solid var(--line-soft); border-radius: 9px; background: #111111; }
.admin-content-preview { width: 105px; height: 72px; display: grid; place-items: center; overflow: hidden; border-radius: 7px; background: #101010; color: var(--gold-light); font: 700 1.5rem/1 var(--font-dashboard-display); }
.admin-content-preview img { width: 100%; height: 100%; object-fit: cover; }
.admin-content-card > div:nth-child(2) { min-width: 0; display: grid; }
.admin-content-card small { color: var(--gold-dark); font-size: .62rem; text-transform: uppercase; }
.admin-content-card strong { overflow: hidden; color: white; font-family: var(--font-dashboard-display); font-size: 1.2rem; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.admin-content-card p { overflow: hidden; margin: 2px 0 0; color: #8e887e; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.affiliate-code-form { min-width: 210px; display: grid; grid-template-columns: minmax(120px, 1fr) auto; gap: 7px; }
.affiliate-code-form input { width: 100%; min-height: 36px; padding: 6px 9px; border: 1px solid var(--line-soft); border-radius: 6px; background: #171817; color: white; font: 700 .78rem/1 var(--font-dashboard-body); }
.affiliate-code-form input:focus { border-color: rgba(201,168,76,.55); }

.simple-welcome.compact { margin-bottom: 24px; }
.simple-welcome.compact h2 { font-size: clamp(2.2rem, 4vw, 3.6rem); }
.simple-welcome.compact .button-link { width: fit-content; margin-top: 18px; }
.simple-referral-card { margin-bottom: 18px; border-radius: 10px; }
.referral-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; margin-bottom: 18px; border: 1px solid var(--line-soft); border-radius: 10px; background: var(--line-soft); }
.referral-summary article { display: grid; gap: 6px; padding: 24px; background: #111111; }
.referral-summary span { color: #8d887e; font-size: .7rem; text-transform: uppercase; }
.referral-summary strong { color: white; font: 700 2.25rem/1 var(--font-dashboard-display); }
.simple-actions-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.account-simple-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.account-simple-grid .form-panel, .simple-preferences, .simple-membership { border-radius: 10px; }
.account-simple-grid h2, .simple-preferences h2, .simple-membership h2 { margin-top: 0; color: white; font-size: 1.8rem; }
.account-simple-grid form > small { margin-top: -7px; font-size: .68rem; }
.simple-preferences { margin-bottom: 16px; }
.simple-preferences > div { align-self: start; }
.simple-preferences form label small { display: none; }
.simple-membership { gap: 18px; }

@media (max-width: 1100px) {
  .hub-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-content-layout { grid-template-columns: 1fr; }
  .publish-panel { position: static; }
}
@media (max-width: 900px) {
  .simple-layout .portal-main { margin-left: 0; }
  .simple-layout .sidebar { width: 218px; }
}
@media (max-width: 640px) {
  .simple-layout .page-content { padding-inline: 15px; }
  .hub-grid, .admin-actions, .admin-quick-stats { grid-template-columns: 1fr; }
  .hub-intro { align-items: stretch; flex-direction: column; gap: 18px; }
  .hub-intro input { width: 100%; }
  .hub-card-art, .hub-card-art img { height: 190px; min-height: 190px; }
  .simple-update { grid-template-columns: 1fr; gap: 5px; }
  .admin-actions a { min-height: 128px; }
  .admin-content-card { grid-template-columns: 78px minmax(0, 1fr); }
  .admin-content-preview { width: 78px; height: 62px; }
  .admin-content-card > button { grid-column: 1 / -1; width: 100%; }
  .referral-summary, .account-simple-grid { grid-template-columns: 1fr; }
  .referral-summary article { grid-template-columns: 1fr auto; align-items: center; padding: 18px; }
  .simple-actions-row > * { width: 100%; }
  .welcome-modal { padding: 30px 22px 24px; }
  .welcome-logo { width: 120px; margin-bottom: 20px; }
  .welcome-steps, .welcome-actions { grid-template-columns: 1fr; }
}

/* Simple Learn / Earn portal */
.home-welcome { margin-bottom: 24px; }
.home-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 34px; }
.home-path { min-height: 245px; display: grid; grid-template-rows: auto 1fr auto; gap: 16px; padding: 28px; border: 1px solid var(--line-soft); border-radius: 12px; background: linear-gradient(145deg, #151515, #0c0c0c); color: inherit; text-decoration: none; transition: transform .16s ease, border-color .16s ease; }
.home-path:hover { transform: translateY(-2px); border-color: rgba(201,168,76,.42); }
.home-path-earn { border-color: rgba(201,168,76,.28); box-shadow: 0 16px 44px rgba(0,0,0,.22); }
.home-path-icon { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(201,168,76,.28); border-radius: 50%; background: rgba(201,168,76,.08); color: var(--gold-light); font-size: 1rem; }
.home-path small { color: var(--gold); font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.home-path h3 { margin: 5px 0 8px; color: white; font: 700 clamp(2.5rem, 5vw, 4rem)/.95 var(--font-dashboard-display); text-transform: uppercase; }
.home-path p { max-width: 330px; margin: 0; color: #9c968b; line-height: 1.55; }
.home-path > b { color: var(--gold-light); font-size: .78rem; }
.home-latest { margin-top: 0; }
.simple-section-intro p { margin: 8px 0 0; color: #938e83; }

.earn-hero { margin-bottom: 20px; }
.earn-link-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 16px; padding: 24px; border: 1px solid rgba(201,168,76,.26); border-radius: 12px; background: linear-gradient(135deg, rgba(201,168,76,.09), #111111 44%); }
.earn-link-card > div { min-width: 0; }
.earn-link-card span { color: var(--gold); font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.earn-link-card h2 { margin: 5px 0 0; color: white; font-size: clamp(1.75rem, 4vw, 2.7rem); }
.earn-link-card p { margin: 7px 0 0; color: #979187; }
.earn-link-card small { display: block; min-height: 18px; margin-top: 8px; color: #ef8c7d; }
.earn-link-row { width: min(100%, 590px); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.earn-link-row input { min-width: 0; min-height: 46px; padding: 10px 13px; border: 1px solid var(--line-soft); border-radius: 7px; background: #171917; color: white; }
.earn-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; margin-bottom: 30px; border: 1px solid var(--line-soft); border-radius: 10px; background: var(--line-soft); }
.earn-steps article { display: flex; align-items: center; gap: 12px; padding: 18px; background: #111111; }
.earn-steps b { width: 30px; height: 30px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--gold); color: #080a08; }
.earn-steps span { color: white; font-weight: 700; }
.clip-library { display: grid; gap: 14px; }
.clip-list { display: grid; gap: 14px; }
.clip-card { display: grid; grid-template-columns: minmax(260px, 420px) minmax(0, 1fr); gap: 22px; padding: 16px; border: 1px solid var(--line-soft); border-radius: 12px; background: #111111; }
.clip-preview { min-height: 220px; display: grid; place-items: center; overflow: hidden; border-radius: 9px; background: #090909; }
.clip-preview video, .clip-preview img { width: 100%; height: 100%; max-height: 320px; object-fit: contain; background: #050505; }
.clip-symbol { color: var(--gold-light); font-size: 2rem; }
.clip-copy { min-width: 0; align-self: center; }
.clip-copy > span { color: var(--gold); font-size: .65rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.clip-copy h3 { margin: 7px 0 9px; color: white; font-size: clamp(1.8rem, 3vw, 2.6rem); }
.clip-copy p { max-width: 620px; margin: 0 0 18px; color: #9b958b; line-height: 1.65; white-space: pre-line; }
.clip-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.clip-actions > * { min-width: 145px; }
.clip-message { display: block; min-height: 18px; margin-top: 8px; color: var(--gold-light); }

.welcome-modal-simple { max-width: 560px; text-align: center; }
.welcome-modal-simple .welcome-lead { max-width: 450px; margin-inline: auto; }
.welcome-learn-link { display: inline-block; margin-top: 18px; color: var(--gold-light); font-size: .78rem; font-weight: 700; text-decoration: none; }

@media (max-width: 780px) {
  .home-paths, .earn-steps { grid-template-columns: 1fr; }
  .home-path { min-height: 205px; }
  .earn-link-card { align-items: stretch; flex-direction: column; }
  .earn-link-card > button { width: 100%; }
  .earn-link-row { grid-template-columns: 1fr; }
  .clip-card { grid-template-columns: 1fr; }
  .clip-preview { min-height: 190px; }
}

@media (max-width: 520px) {
  .home-path { padding: 22px; }
  .earn-link-card { padding: 20px; }
  .clip-card { padding: 11px; }
  .clip-actions > * { width: 100%; }
}
.viewer-media iframe { width: 100%; height: min(72vh, 820px); display: block; border: 0; background: white; }
.earn-steps article { align-items: flex-start; }
.earn-steps span { line-height: 1.35; }


/* Dashboard visual refinement: neutral dark surfaces, no decorative green glow.
   Semantic success/status greens remain intact for clarity. */

/* ============================================
   Dashboard-only typography refinement
   Public pages, VSL pages, and auth screens keep
   their original typography and are not affected.
   ============================================ */
.portal-layout {
  font-family: var(--font-dashboard-body);
  font-size: 16px;
  line-height: 1.58;
  letter-spacing: 0;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}
.portal-layout button,
.portal-layout input,
.portal-layout select,
.portal-layout textarea {
  font-family: var(--font-dashboard-body);
  letter-spacing: 0;
}
.portal-layout h1,
.portal-layout h2,
.portal-layout h3 {
  font-family: var(--font-dashboard-body);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.014em;
  text-transform: none;
}

/* Major page and promotional headings only. */
.portal-layout .simple-welcome h2,
.portal-layout .welcome-band h2,
.portal-layout .page-intro h2,
.portal-layout .hub-intro h2,
.portal-layout .admin-welcome h2,
.portal-layout .leaderboard-hero h2,
.portal-layout .settings-hero h2,
.portal-layout .welcome-modal h2 {
  font-family: var(--font-dashboard-display);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.032em;
  text-wrap: balance;
}
.portal-layout .simple-welcome h2,
.portal-layout .welcome-band h2,
.portal-layout .page-intro h2,
.portal-layout .admin-welcome h2 {
  font-size: clamp(2.1rem, 3.7vw, 3.2rem);
}
.portal-layout .earn-hero h2 {
  font-size: clamp(2.2rem, 4vw, 3.35rem);
}
.portal-layout .hub-intro h2 {
  font-size: clamp(2rem, 3.4vw, 2.9rem);
}
.portal-layout .leaderboard-hero h2,
.portal-layout .settings-hero h2 {
  font-size: clamp(1.9rem, 3vw, 2.65rem);
}
.portal-layout .welcome-modal h2 {
  font-size: clamp(2.05rem, 4.7vw, 3.1rem);
}

/* Utility states must never compete with page-level headings. */
.portal-layout .utility-hero h2 {
  font-family: var(--font-dashboard-body);
  font-size: clamp(1.5rem, 2.5vw, 1.9rem);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -.018em;
}
.portal-layout .earn-link-card h2 {
  margin-top: 5px;
  font-family: var(--font-dashboard-body);
  font-size: clamp(1.2rem, 2vw, 1.5rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.016em;
}

/* Clear secondary hierarchy for sections and interface panels. */
.portal-layout .simple-heading h2,
.portal-layout .section-heading h2,
.portal-layout .table-heading h2,
.portal-layout .form-panel h2,
.portal-layout .account-simple-grid h2,
.portal-layout .simple-preferences h2,
.portal-layout .simple-membership h2,
.portal-layout .referral-activation-copy h2,
.portal-layout .referral-link-panel h2,
.portal-layout .publish-panel h2,
.portal-layout .admin-content-list .simple-heading h2 {
  font-family: var(--font-dashboard-body);
  font-size: clamp(1.2rem, 1.8vw, 1.45rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.014em;
}
.portal-layout .clip-library .simple-heading h2 {
  font-size: clamp(1.25rem, 1.9vw, 1.5rem);
}

/* Card titles and empty states use restrained interface typography. */
.portal-layout .empty-state h3 {
  margin: 9px 0 6px;
  font-family: var(--font-dashboard-body);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.01em;
  text-transform: none;
}
.portal-layout .clip-copy h3 {
  margin: 7px 0 9px;
  font-family: var(--font-dashboard-body);
  font-size: clamp(1.18rem, 1.8vw, 1.4rem);
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: -.012em;
}
.portal-layout .hub-card-copy > strong,
.portal-layout .admin-content-card strong,
.portal-layout .admin-actions a > strong,
.portal-layout .content-card h3,
.portal-layout .next-call h3,
.portal-layout .announcement-strip h3,
.portal-layout .welcome-steps strong {
  font-family: var(--font-dashboard-body);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.01em;
  text-transform: none;
}
.portal-layout .hub-card-copy > strong { font-size: 1.05rem; }
.portal-layout .admin-content-card strong { font-size: .98rem; }
.portal-layout .admin-actions a > strong { font-size: 1.2rem; }
.portal-layout .content-card h3 { font-size: 1.08rem; }
.portal-layout .next-call h3 { font-size: 1.25rem; }
.portal-layout .announcement-strip h3 { font-size: .95rem; }
.portal-layout .welcome-steps strong { font-size: .95rem; }

/* Learn/Earn choice cards stay bold without becoming hero-sized. */
.portal-layout .home-path h3 {
  font-family: var(--font-dashboard-display);
  font-size: clamp(2rem, 3.5vw, 2.75rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.035em;
  text-transform: none;
}
.portal-layout .viewer-copy h2 {
  font-family: var(--font-dashboard-display);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -.03em;
  text-transform: none;
}

/* Sidebar, top bar, controls, and steps share one calm UI voice. */
.portal-layout .sidebar nav a,
.portal-layout .simple-layout .sidebar nav a {
  font-family: var(--font-dashboard-body);
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: none;
}
.portal-layout .topbar-copy h1 {
  font-family: var(--font-dashboard-display);
  font-size: clamp(1.25rem, 1.8vw, 1.48rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.022em;
  text-transform: none;
}
.portal-layout .profile-chip b,
.portal-layout .support-link,
.portal-layout .exit-admin {
  font-family: var(--font-dashboard-body);
  font-weight: 600;
  letter-spacing: 0;
}
.portal-layout .gold-button,
.portal-layout .outline-button,
.portal-layout .mini-button,
.portal-layout .text-button,
.portal-layout .referral-link button,
.portal-layout .referral-link a {
  font-family: var(--font-dashboard-body);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.portal-layout .earn-steps span {
  color: white;
  font-family: var(--font-dashboard-body);
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
}
.portal-layout .earn-steps b {
  font-family: var(--font-dashboard-body);
  font-size: .82rem;
  font-weight: 700;
}

/* Natural, readable form and supporting text. */
.portal-layout .field > span,
.portal-layout .member-gate-note strong,
.portal-layout .sync-grid > article > span:first-child,
.portal-layout .settings-grid article > span:first-child {
  font-family: var(--font-dashboard-body);
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.portal-layout .field > span { font-size: .78rem; }
.portal-layout .member-gate-note strong { font-size: .95rem; }
.portal-layout p,
.portal-layout small,
.portal-layout .notice,
.portal-layout .field-help,
.portal-layout .hub-card-copy > span:not(.hub-card-date),
.portal-layout .clip-copy p,
.portal-layout .simple-welcome p,
.portal-layout .hub-intro p,
.portal-layout .home-path p,
.portal-layout .empty-state p {
  font-family: var(--font-dashboard-body);
  letter-spacing: 0;
}
.portal-layout .simple-welcome p,
.portal-layout .hub-intro p,
.portal-layout .clip-copy p,
.portal-layout .empty-state p {
  line-height: 1.62;
}

/* Uppercase remains limited to small labels, metadata, and table headers. */
.portal-layout .section-kicker,
.portal-layout .topbar-copy > span,
.portal-layout .simple-welcome > span,
.portal-layout .hub-intro > div > span,
.portal-layout .admin-welcome > span,
.portal-layout .home-path small,
.portal-layout .earn-link-card > div > span,
.portal-layout .clip-copy > span,
.portal-layout .status-pill,
.portal-layout .membership-panel dt,
.portal-layout .your-rank span,
.portal-layout th {
  font-family: var(--font-dashboard-body);
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.portal-layout th { font-size: .66rem; }
.portal-layout td { font-size: .82rem; line-height: 1.5; }

/* Numbers remain highly scannable without affecting interface copy. */
.portal-layout .stat-card strong,
.portal-layout .referral-summary strong,
.portal-layout .your-rank strong,
.portal-layout .admin-quick-stats strong,
.portal-layout .rank-panel > strong,
.portal-layout .rank {
  font-family: var(--font-dashboard-display);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  letter-spacing: -.035em;
}

@media (max-width: 640px) {
  .portal-layout { font-size: 15px; }
  .portal-layout .simple-welcome h2,
  .portal-layout .welcome-band h2,
  .portal-layout .page-intro h2,
  .portal-layout .admin-welcome h2 { font-size: clamp(1.95rem, 9.5vw, 2.7rem); }
  .portal-layout .earn-hero h2 { font-size: clamp(2.05rem, 10vw, 2.85rem); }
  .portal-layout .hub-intro h2 { font-size: clamp(1.85rem, 8.8vw, 2.5rem); }
  .portal-layout .home-path h3 { font-size: clamp(1.85rem, 9vw, 2.35rem); }
  .portal-layout .topbar-copy h1 { font-size: 1.25rem; }
  .portal-layout .earn-link-card h2 { font-size: 1.2rem; }
}

/* Production review: unified dashboard composition and restrained hierarchy. */
.clipboard-fallback {
  position: fixed;
  inset: auto auto -1000px -1000px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.portal-layout {
  position: relative;
  isolation: isolate;
  overflow-x: clip;
  background: #090909;
}
.portal-layout::before {
  content: "";
  position: fixed;
  z-index: 0;
  inset: 0 0 0 244px;
  pointer-events: none;
  background: #090909 url("/assets/dashboard-context.webp") right top / min(1050px, 78vw) auto no-repeat;
  opacity: .78;
}
.portal-layout .portal-main {
  position: relative;
  z-index: 1;
  background: rgba(9, 9, 9, .72);
}
.portal-layout .sidebar,
.portal-layout .sidebar-scrim { z-index: 30; }
.portal-layout .sidebar-scrim { z-index: 20; }
.portal-layout .page-content { position: relative; z-index: 1; }
.portal-layout .topbar { background: rgba(9, 9, 9, .94); }
.portal-layout .sidebar { background: rgba(8, 8, 8, .98); }
.portal-layout .home-path,
.portal-layout .earn-link-card,
.portal-layout .clip-card,
.portal-layout .hub-card,
.portal-layout .form-panel,
.portal-layout .table-panel,
.portal-layout .settings-hero,
.portal-layout .settings-grid article,
.portal-layout .simple-referral-card,
.portal-layout .referral-summary article,
.portal-layout .account-simple-grid article,
.portal-layout .simple-preferences,
.portal-layout .simple-membership {
  background-color: rgba(16, 16, 16, .96);
  backdrop-filter: blur(3px);
}

/* Page-level statements remain strongest, but no longer overpower the work area. */
.portal-layout .simple-welcome h2,
.portal-layout .welcome-band h2,
.portal-layout .page-intro h2,
.portal-layout .admin-welcome h2,
.portal-layout .earn-hero h2 {
  font-size: clamp(2rem, 3.2vw, 2.85rem);
  line-height: 1.04;
  letter-spacing: -.034em;
}
.portal-layout .hub-intro h2 {
  font-size: clamp(1.9rem, 2.9vw, 2.65rem);
  line-height: 1.06;
}
.portal-layout .leaderboard-hero h2,
.portal-layout .settings-hero h2,
.portal-layout .welcome-modal h2 {
  font-size: clamp(1.8rem, 2.7vw, 2.45rem);
}
.portal-layout .home-path h3 {
  font-size: clamp(1.75rem, 2.7vw, 2.25rem);
}
.portal-layout .page-content > section:first-child { max-width: 1180px; }
.portal-layout .simple-welcome p,
.portal-layout .hub-intro p { max-width: 680px; }

/* Consistent, purposeful controls and destructive states. */
.portal-layout button,
.portal-layout .button-link { min-width: 0; }
.portal-layout .mini-button[data-action="unlink"],
.portal-layout .mini-button[data-action="suspend"] {
  border-color: rgba(225, 81, 71, .35);
  color: #f2a39b;
}
.portal-layout .mini-button[data-action="unlink"]:hover,
.portal-layout .mini-button[data-action="suspend"]:hover {
  background: rgba(121, 30, 25, .18);
  border-color: rgba(225, 81, 71, .58);
}

@media (max-width: 900px) {
  .portal-layout::before { inset: 0; background-size: 1180px auto; opacity: .52; }
}
@media (max-width: 640px) {
  .portal-layout::before { inset: 0; background-position: 72% 40px; background-size: 980px auto; opacity: .38; }
  .portal-layout .simple-welcome h2,
  .portal-layout .welcome-band h2,
  .portal-layout .page-intro h2,
  .portal-layout .admin-welcome h2,
  .portal-layout .earn-hero h2 { font-size: clamp(1.8rem, 8.5vw, 2.35rem); }
  .portal-layout .hub-intro h2 { font-size: clamp(1.75rem, 8vw, 2.2rem); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
.portal-layout .composed-heading > span { font-weight: 600; }
.portal-layout .composed-heading > strong { color: inherit; font: inherit; font-weight: 600; }

/* Security and UX review: neutral authentication surfaces and operational links. */
.auth-page {
  background:
    linear-gradient(rgba(7, 7, 7, .22), rgba(7, 7, 7, .9)),
    repeating-linear-gradient(120deg, transparent 0 60px, rgba(201, 168, 76, .018) 60px 61px),
    var(--page);
}
.auth-card {
  background: linear-gradient(160deg, rgba(20, 20, 20, .98), rgba(11, 11, 11, .99));
}
.content-viewer { background: #0d0d0d; }
.viewer-media { background: #050505; }
.hub-card-art small { background: rgba(7, 7, 7, .82); }
.system-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.system-links .button-link { min-height: 42px; }

/* Authentication belongs to the portal type system without inheriting dashboard-scale display treatment. */
.auth-page { font-family: var(--font-dashboard-body); }
.auth-card h1 {
  font-family: var(--font-dashboard-display);
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.03em;
  text-transform: none;
}
.auth-subtitle, .auth-switch, .auth-footer, .field-help, .member-gate-note p {
  font-family: var(--font-dashboard-body);
  letter-spacing: 0;
}

/* Latest owner revision: cleaner navigation, balanced actions, four-step Earn flow, and real media uploader. */
.portal-layout::before {
  display: none !important;
  content: none !important;
  background: none !important;
}
.portal-layout,
.portal-layout .portal-main {
  background: #090909;
}
.portal-layout .portal-main { min-width: 0; }

/* Shared inline icon system. */
.portal-layout .ui-icon,
.portal-layout .nav-icon,
.portal-layout .menu-icon,
.portal-layout .link-icon,
.portal-layout .button-icon,
.portal-layout .path-icon,
.portal-layout .admin-action-icon,
.portal-layout .admin-preview-icon,
.portal-layout .upload-icon,
.portal-layout .selected-file-icon {
  display: block;
  width: 1.15em;
  height: 1.15em;
  flex: 0 0 auto;
}
.portal-layout .button-link,
.portal-layout button,
.portal-layout .support-link {
  align-items: center;
}
.portal-layout .button-icon,
.portal-layout .link-icon { margin-left: .35rem; }

/* Stronger, recognizable sidebar branding without crowding navigation. */
.portal-layout.simple-layout .sidebar {
  width: 232px;
  padding: 25px 16px 18px;
}
.portal-layout.simple-layout .sidebar-brand {
  display: grid;
  justify-items: start;
  margin: 0 6px 30px;
  padding: 0 8px 16px;
}
.portal-layout.simple-layout .sidebar-brand img {
  width: min(174px, 100%);
  height: auto;
  object-fit: contain;
}
.portal-layout.simple-layout .sidebar-brand small {
  margin: 6px 0 0 3px;
}

/* Gold hover/focus treatment; active state remains stronger and stable. */
.portal-layout .sidebar nav a,
.portal-layout.simple-layout .sidebar nav a {
  position: relative;
  min-height: 48px;
  border: 1px solid transparent;
  color: #a29d93;
  transition: color .16s ease, background-color .16s ease, border-color .16s ease;
}
.portal-layout .sidebar nav a .nav-icon,
.portal-layout.simple-layout .sidebar nav a .nav-icon {
  width: 20px;
  height: 20px;
  color: #777166;
  transition: color .16s ease;
}
.portal-layout .sidebar nav a:hover,
.portal-layout .sidebar nav a:focus-visible,
.portal-layout.simple-layout .sidebar nav a:hover,
.portal-layout.simple-layout .sidebar nav a:focus-visible {
  color: var(--gold-light);
  border-color: rgba(201,168,76,.18);
  background: rgba(201,168,76,.055);
  outline: none;
}
.portal-layout .sidebar nav a:hover .nav-icon,
.portal-layout .sidebar nav a:focus-visible .nav-icon,
.portal-layout.simple-layout .sidebar nav a:hover .nav-icon,
.portal-layout.simple-layout .sidebar nav a:focus-visible .nav-icon {
  color: var(--gold);
}
.portal-layout .sidebar nav a.active,
.portal-layout.simple-layout .sidebar nav a.active {
  color: #fff8e7;
  border-color: rgba(201,168,76,.34);
  background: rgba(201,168,76,.12);
  box-shadow: inset 3px 0 0 var(--gold);
}
.portal-layout .sidebar nav a.active .nav-icon,
.portal-layout.simple-layout .sidebar nav a.active .nav-icon { color: var(--gold-light); }
.portal-layout .support-link:hover,
.portal-layout .support-link:focus-visible,
.portal-layout .exit-admin:hover,
.portal-layout .exit-admin:focus-visible {
  color: var(--gold-light);
  outline: 1px solid rgba(201,168,76,.28);
  outline-offset: 4px;
}

/* Restrained page-title scale across member and admin views. */
.portal-layout .simple-welcome h2,
.portal-layout .welcome-band h2,
.portal-layout .page-intro h2,
.portal-layout .admin-welcome h2,
.portal-layout .earn-hero h2,
.portal-layout .hub-intro h2 {
  font-size: clamp(1.9rem, 2.8vw, 2.55rem);
  line-height: 1.06;
  letter-spacing: -.032em;
}
.portal-layout .simple-heading h2,
.portal-layout .clip-library .simple-heading h2,
.portal-layout .form-panel > h2,
.portal-layout .table-panel > h2,
.portal-layout .earn-link-card h2,
.portal-layout .empty-state h3 {
  font-family: var(--font-dashboard-body);
  font-size: clamp(1.05rem, 1.5vw, 1.32rem);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.012em;
  text-transform: none;
}

/* Home Learn/Earn entry points: larger targets and a balanced composition. */
.portal-layout .home-welcome { margin-bottom: 24px; }
.portal-layout .home-paths {
  align-content: center;
  min-height: min(470px, calc(100vh - 300px));
  gap: 20px;
  margin: 0 0 38px;
}
.portal-layout .home-path {
  min-height: 280px;
  padding: 32px;
  border-color: rgba(201,168,76,.17);
  background: #11110f;
  transition: transform .18s ease, border-color .18s ease, background-color .18s ease;
}
.portal-layout .home-path:hover,
.portal-layout .home-path:focus-visible {
  transform: translateY(-4px) scale(1.008);
  border-color: rgba(201,168,76,.55);
  background: #15140f;
  outline: none;
}
.portal-layout .home-path:focus-visible {
  box-shadow: 0 0 0 3px rgba(201,168,76,.18);
}
.portal-layout .home-path .path-icon {
  width: 42px;
  height: 42px;
  padding: 9px;
  box-sizing: border-box;
  border: 1px solid rgba(201,168,76,.34);
  border-radius: 50%;
  color: var(--gold-light);
  background: rgba(201,168,76,.07);
}
.portal-layout .home-path > b {
  display: inline-flex;
  width: fit-content;
  min-height: 42px;
  align-items: center;
  padding: 0 2px;
  font-size: .86rem;
}

/* Earn page composition and four-step process. */
.portal-layout .earn-heading-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 24px;
}
.portal-layout .earn-heading-row .earn-hero {
  flex: 1 1 680px;
  margin: 0;
}
.portal-layout .earn-affiliate-button {
  flex: 0 0 auto;
  margin-top: 8px;
  min-height: 44px;
  white-space: nowrap;
}
.portal-layout .earn-link-unavailable {
  border-color: rgba(201,168,76,.22);
}
.portal-layout .earn-steps {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 34px;
}
.portal-layout .earn-steps article {
  min-height: 94px;
  padding: 18px 16px;
}
.portal-layout .earn-steps span {
  font-size: .86rem;
  line-height: 1.42;
}

/* Shared drag-and-drop uploader for Learn and Earn administration. */
.portal-layout .publish-panel { overflow: visible; }
.portal-layout .publish-intro {
  max-width: 680px;
  margin: -4px 0 22px;
  color: #9e998f;
}
.portal-layout .media-dropzone {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 7px;
  min-height: 210px;
  padding: 32px 24px;
  border: 1px dashed rgba(201,168,76,.42);
  border-radius: 12px;
  background: #0d0d0c;
  color: #ded7c7;
  text-align: center;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background-color .16s ease;
}
.portal-layout .media-dropzone[hidden] { display: none !important; }
.portal-layout .media-dropzone:hover,
.portal-layout .media-dropzone:focus-visible,
.portal-layout .media-dropzone.drag-active {
  transform: translateY(-2px);
  border-color: var(--gold);
  background: #13120e;
  outline: none;
}
.portal-layout .media-dropzone:focus-visible {
  box-shadow: 0 0 0 3px rgba(201,168,76,.18);
}
.portal-layout .media-dropzone[aria-disabled="true"] {
  cursor: progress;
  opacity: .7;
  transform: none;
}
.portal-layout .media-dropzone .upload-icon {
  width: 38px;
  height: 38px;
  margin-bottom: 4px;
  color: var(--gold-light);
}
.portal-layout .media-dropzone > strong {
  color: #fff;
  font-size: 1.05rem;
}
.portal-layout .media-dropzone > p,
.portal-layout .media-dropzone > small { margin: 0; }
.portal-layout .media-dropzone > p { color: #b6b0a4; }
.portal-layout .media-dropzone > small { color: #817c72; }
.portal-layout .selected-file {
  width: min(560px, 100%);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 13px 14px;
  border: 1px solid rgba(201,168,76,.2);
  border-radius: 9px;
  background: #171612;
  text-align: left;
}
.portal-layout .selected-file[hidden] { display: none !important; }
.portal-layout .selected-file-icon { width: 24px; height: 24px; color: var(--gold); }
.portal-layout .selected-file > div { min-width: 0; }
.portal-layout .selected-file strong,
.portal-layout .selected-file small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.portal-layout .selected-file small { margin-top: 2px; color: #8f897f; }
.portal-layout .selected-file .text-button { min-height: 38px; }
.portal-layout .upload-progress {
  display: grid;
  gap: 8px;
  padding: 12px 0 2px;
}
.portal-layout .upload-progress[hidden] { display: none !important; }
.portal-layout .upload-progress-track {
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: #25231f;
}
.portal-layout .upload-progress-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--gold);
  transform: none;
  animation: none;
  transition: width .2s ease;
}
.portal-layout .upload-progress.is-active .upload-progress-track i {
  transform: none;
  animation: none;
}
.portal-layout .upload-progress.is-complete .upload-progress-track i {
  width: 100%;
  transform: none;
  animation: none;
}
.portal-layout .upload-progress span { color: #aaa397; font-size: .82rem; }
.portal-layout .publish-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.portal-layout .admin-content-preview .admin-preview-icon { width: 30px; height: 30px; color: var(--gold-light); }
@media (max-width: 1100px) {
  .portal-layout .earn-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .portal-layout.simple-layout .sidebar { width: min(286px, 88vw); }
  .portal-layout.simple-layout .sidebar-brand img { width: 164px; }
  .portal-layout .home-paths { min-height: auto; }
  .portal-layout .earn-heading-row { display: grid; gap: 16px; }
  .portal-layout .earn-affiliate-button { justify-self: start; margin-top: 0; }
}
@media (max-width: 640px) {
  .portal-layout .simple-welcome h2,
  .portal-layout .welcome-band h2,
  .portal-layout .page-intro h2,
  .portal-layout .admin-welcome h2,
  .portal-layout .earn-hero h2,
  .portal-layout .hub-intro h2 {
    font-size: clamp(1.75rem, 8vw, 2.15rem);
  }
  .portal-layout .home-paths,
  .portal-layout .earn-steps { grid-template-columns: 1fr; }
  .portal-layout .home-path { min-height: 220px; padding: 24px; }
  .portal-layout .earn-heading-row { margin-bottom: 20px; }
  .portal-layout .earn-affiliate-button { width: 100%; justify-content: center; }
  .portal-layout .earn-steps article { min-height: 74px; }
  .portal-layout .media-dropzone { min-height: 190px; padding: 26px 16px; }
  .portal-layout .selected-file { grid-template-columns: auto minmax(0, 1fr); }
  .portal-layout .selected-file .text-button { grid-column: 1 / -1; justify-self: start; }
}

/* Page-by-page portal audit: cleaner auth, media previews, and aligned utility UI. */
.auth-card {
  width: min(100%, 520px);
  padding: 36px 38px 32px;
}
.auth-card::after { content: none; display: none; }
.auth-card h1 { max-width: 12ch; }
.auth-subtitle { max-width: 44ch; line-height: 1.55; }
.auth-footer a { color: var(--gold-light); font-weight: 600; }
.membership-required-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 18px;
}
.membership-required-actions > * { width: 100%; justify-content: center; }
.auth-card .button-icon {
  display: block;
  width: 1.05em;
  height: 1.05em;
  flex: 0 0 auto;
  margin-left: .35rem;
}
.membership-signout { display: block; margin: 16px auto 0; }

.password-control {
  position: relative;
  display: block;
}
.password-control input { padding-right: 66px; }
.password-toggle {
  position: absolute;
  right: 7px;
  top: 50%;
  min-width: 48px;
  min-height: 34px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--gold-light);
  font: 700 .72rem/1 var(--font-dashboard-body);
  transform: translateY(-50%);
  cursor: pointer;
}
.password-toggle:hover,
.password-toggle:focus-visible { background: rgba(201,168,76,.1); outline: 1px solid rgba(201,168,76,.28); }

.portal-layout #media-file {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.hub-card-art video,
.admin-content-preview video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.admin-content-preview img,
.admin-content-preview video { background: #080808; }

/* Video cards decode a real frame instead of showing browser/default artwork. */
.hub-card-art,
.admin-content-preview,
.clip-preview { position: relative; }
.video-frame-thumbnail,
.provider-video-thumbnail {
  position: relative;
  z-index: 2;
  opacity: 0;
  transition: opacity .18s ease;
}
.video-frame-thumbnail.has-video-frame,
.provider-video-thumbnail { opacity: 1; }
.video-thumbnail-fallback {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: grid;
  grid-template-columns: auto auto;
  place-content: center;
  place-items: center;
  gap: 11px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 42%, rgba(201,168,76,.14), transparent 44%),
    linear-gradient(145deg, #171717, #090909);
  color: var(--gold-light);
  pointer-events: none;
}
.video-thumbnail-fallback::before,
.video-thumbnail-fallback::after {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201,168,76,.45), transparent);
}
.video-thumbnail-fallback::before { top: 20%; }
.video-thumbnail-fallback::after { bottom: 20%; }
.video-thumbnail-fallback b {
  font: 700 1rem/1 var(--font-dashboard-display);
  letter-spacing: .08em;
}
.thumbnail-play-icon { width: 18px; height: 18px; }
.hub-card-art > small { z-index: 3; }
.has-video-frame > .video-thumbnail-fallback { opacity: 0; }
.clip-preview .video-frame-thumbnail { width: 100%; height: 100%; object-fit: contain; background: #050505; }

/* ==========================================================
   Premium white + champagne-gold application theme
   Kept as a final semantic layer so legacy component layout,
   account flows and media behavior remain unchanged.
   ========================================================== */
body {
  background:
    radial-gradient(circle at 85% 0, rgba(201,166,91,.10), transparent 30rem),
    var(--page);
  color: var(--cream);
}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline-color: var(--gold-dark);
}
.gold-button {
  color: #fff;
  background: linear-gradient(135deg, #2e2c27, #171714);
  border-color: var(--gold-dark);
  box-shadow: 0 10px 28px rgba(35,31,23,.17), inset 0 1px rgba(255,255,255,.12);
}
.gold-button:hover { background: #10100e; filter: none; }
.outline-button { color: #4b473f; background: #fff; border-color: rgba(117,80,19,.42); }
.outline-button:hover { color: #171714; background: rgba(169,119,34,.07); }
.mini-button { background: #f8f6f1; color: #34322d; }
.text-button { color: #625e56; }
.section-kicker, .auth-kicker { color: var(--gold-dark); }

/* Authentication */
.auth-page {
  background:
    radial-gradient(circle at 50% 0, rgba(201,166,91,.16), transparent 32rem),
    repeating-linear-gradient(120deg, transparent 0 60px, rgba(169,119,34,.022) 60px 61px),
    linear-gradient(160deg, #ffffff, #f8f6f1);
}
.auth-card {
  border-color: rgba(169,119,34,.28);
  background: linear-gradient(160deg, #ffffff, #fbfaf7);
}
.auth-card h1,
.field input, .field select, .field textarea, .admin-search input, .registry-select { color: #24231f; }
.auth-subtitle, .auth-footer, .auth-switch { color: var(--muted); }
.auth-footer a, .auth-switch a, .form-row a, .member-gate-note a { color: var(--gold-dark); }
.field > span { color: #514d45; }
.field input, .field select, .field textarea, .admin-search input, .registry-select {
  background: #fff;
  border-color: rgba(35,33,28,.18);
  box-shadow: inset 0 1px 2px rgba(35,31,23,.03);
}
.field input:hover, .field input:focus, .field select:focus, .field textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(169,119,34,.10);
}
.check { color: #5f5b53; }
.activation-steps > span { color: #78736a; }
.notice-error { color: #9b3028; background: #fff3f1; }
.notice-success { color: #246b45; background: #eff9f3; }
.notice-info { color: #6f4d14; background: #fbf6e9; }

/* Global shell */
.portal-layout,
.simple-layout,
.portal-layout.portal-context,
.portal-layout.dashboard-context { background: transparent !important; }
.portal-layout .portal-main { background: transparent !important; }
.portal-layout::before { background: transparent !important; }
.sidebar,
.simple-layout .sidebar,
.portal-layout .sidebar,
.admin-sidebar {
  background: rgba(255,255,255,.96) !important;
  border-right-color: var(--line-soft) !important;
  box-shadow: 8px 0 30px rgba(35,31,23,.035);
}
.topbar,
.portal-layout .topbar {
  background: rgba(255,255,255,.88) !important;
  border-bottom-color: var(--line-soft) !important;
  box-shadow: 0 4px 20px rgba(35,31,23,.035);
}
.sidebar nav a,
.simple-layout .sidebar nav a { color: #615d55; }
.sidebar nav a > span,
.simple-layout .sidebar nav a span { color: #8a8378; }
.sidebar nav a:hover { color: #24231f; background: #f8f6f1; }
.sidebar nav a.active,
.simple-layout .sidebar nav a.active {
  color: #3c321f;
  border-color: rgba(169,119,34,.24);
  background: linear-gradient(90deg, rgba(201,166,91,.17), rgba(169,119,34,.035));
}
.support-link, .exit-admin,
.simple-layout .support-link, .simple-layout .exit-admin { color: #69645b; }
.member-status { background: #f2faf5; }
.member-status strong { color: #2e6948; }
.profile-chip > span { background: #f7f1e4; color: var(--gold-dark); }
.portal-layout .topbar-copy h1,
.portal-layout .admin-welcome h2,
.portal-layout .admin-actions a > strong,
.portal-layout .verified-member strong,
.portal-layout .welcome-band h2,
.portal-layout .content-card h3,
.portal-layout .next-call h3,
.portal-layout .stat-card > strong,
.portal-layout .empty-state h3,
.portal-layout .page-intro h2,
.portal-layout .leaderboard-hero h2,
.portal-layout .call-list h3,
.portal-layout .referral-activation h2,
.portal-layout .simple-welcome h2,
.portal-layout .simple-heading h2,
.portal-layout .welcome-modal h2,
.portal-layout .hub-card-copy > strong,
.portal-layout .hub-intro h2,
.portal-layout .viewer-copy h2,
.portal-layout .admin-quick-stats strong,
.portal-layout .admin-content-card strong,
.portal-layout .referral-summary strong,
.portal-layout .account-simple-grid h2,
.portal-layout .simple-preferences h2,
.portal-layout .simple-membership h2,
.portal-layout .home-path h3,
.portal-layout .earn-link-card h2,
.portal-layout .earn-steps span,
.portal-layout .clip-copy h3 { color: #24231f; }
.sidebar-scrim { background: rgba(31,29,25,.42); }

/* Panels, cards, tables, empty and loading states */
.welcome-band,
.next-call,
.rank-panel,
.stat-card,
.content-card,
.referral-activation,
.referral-link-panel,
.leaderboard-hero,
.settings-hero,
.hub-card,
.admin-actions a,
.admin-quick-stats article,
.admin-content-card,
.referral-summary article,
.home-path,
.earn-link-card,
.earn-steps article,
.clip-card {
  background: #ffffff !important;
  border-color: var(--line-soft);
  box-shadow: 0 10px 32px rgba(35,31,23,.055);
}
.portal-layout .form-panel,
.portal-layout .table-panel,
.portal-layout .settings-grid article,
.portal-layout .simple-referral-card,
.portal-layout .account-simple-grid article,
.portal-layout .simple-preferences,
.portal-layout .simple-membership {
  color: #24231f;
  background: #ffffff !important;
  border-color: var(--line-soft);
  box-shadow: 0 10px 32px rgba(35,31,23,.055);
}
.welcome-band,
.leaderboard-hero,
.settings-hero,
.earn-link-card {
  background: linear-gradient(115deg, #ffffff 42%, #f8f3e7) !important;
  border-color: rgba(169,119,34,.23);
}
.welcome-band p, .next-call p, .home-path p, .earn-link-card p,
.simple-welcome p, .simple-section-intro p, .simple-update p,
.hub-card-copy > span:not(.hub-card-date), .clip-copy p,
.admin-content-card p, .referral-summary span { color: var(--muted); }
.simple-welcome h2, .simple-heading h2, .simple-update strong,
.hub-card-copy > strong, td > strong { color: #24231f; }
.announcement-strip, .simple-update, .empty-state {
  background: rgba(255,255,255,.72);
  border-color: var(--line-soft);
}
.content-art { background-color: #efe9dc; }
.content-progress { background: #e9e5dc; }
.empty-mark { color: rgba(117,80,19,.48); }
.referral-link input,
.earn-link-row input,
.affiliate-code-form input,
.hub-intro input {
  color: #24231f;
  background: #fff;
  border-color: rgba(35,33,28,.17);
}
.referral-link button, .referral-link a { color: var(--gold-dark); background: #f8f3e7; }
.table-wrap { border-color: var(--line-soft); box-shadow: 0 10px 32px rgba(35,31,23,.045); }
th { color: #625e56; background: #f5f3ee; }
td { color: #514d45; border-color: var(--line-soft); }
.current-row td { background: rgba(169,119,34,.055); }
.rank-2 { color: #66717a; }
.rank-3 { color: #805536; }
.status-pill.good { color: #246b45; background: #eff9f3; }
.status-pill.warn { color: #6f4d14; background: #fbf6e9; }
.status-pill.bad { color: #9b3028; background: #fff3f1; }

/* Dialogs and onboarding */
.welcome-overlay,
.content-viewer::backdrop { background: rgba(31,29,25,.52); }
.welcome-modal,
.content-viewer {
  color: #24231f;
  background: #ffffff;
  border-color: rgba(169,119,34,.28);
  box-shadow: var(--shadow);
}
.welcome-close,
.viewer-close { color: #5f5b53; background: #f5f3ee; border-color: var(--line-soft); }
.welcome-lead, .welcome-steps span, .viewer-copy p { color: var(--muted); }
.welcome-steps article { background: #fbfaf7; }
.welcome-steps strong { color: #24231f; }
.welcome-later { color: #69645b; }
.welcome-action-message input { color: #24231f; background: #fff; }
.content-viewer .viewer-media,
.viewer-media,
.clip-preview,
.clip-preview video,
.clip-preview img,
.clip-preview .video-frame-thumbnail,
.admin-content-preview video { background: #080908; }
.viewer-copy { background: #fff; }

/* Content media and admin upload workflow */
.hub-card-art { background: linear-gradient(145deg, #f5f1e8, #e8dfce); }
.hub-card-art small { color: #fff; background: rgba(36,35,31,.82); }
.hub-filter { color: #5f5b53; }
.hub-filter.active { color: var(--gold-dark); background: rgba(169,119,34,.08); }
.admin-content-preview { background: #f0eadf; color: var(--gold-dark); }
.upload-progress { color: var(--gold-dark); background: rgba(169,119,34,.08); }
.media-dropzone,
.portal-layout .media-dropzone {
  color: #4e4a43;
  background: #fffdf9;
  border-color: rgba(169,119,34,.36);
}
.portal-layout .media-dropzone:hover,
.portal-layout .media-dropzone.is-dragover {
  background: #f8f3e7;
  border-color: var(--gold);
}
.portal-layout .media-dropzone > p { color: #514d45; }
.portal-layout .media-dropzone > small { color: var(--muted); }
.portal-layout .selected-file { background: #f8f3e7; border-color: rgba(169,119,34,.25); }
.portal-layout .selected-file small { color: var(--muted); }

@media (max-width: 860px) {
  .sidebar, .simple-layout .sidebar, .portal-layout .sidebar { box-shadow: 14px 0 46px rgba(35,31,23,.13); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}
.clip-preview.video-frame-unavailable .video-frame-thumbnail { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .video-frame-thumbnail,
  .provider-video-thumbnail { transition: none; }
}

.leaderboard-hero { align-items: center; }
.your-rank {
  min-width: 118px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 8px;
}
.your-rank strong {
  min-height: 38px;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1;
}

.simple-preferences > div p {
  max-width: 34ch;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.5;
}
.simple-preferences > div p strong { color: var(--cream); font-weight: 600; }

@media (max-width: 640px) {
  .auth-card { padding: 30px 22px 26px; }
  .auth-card h1 { max-width: none; font-size: clamp(2rem, 10vw, 2.6rem); }
  .your-rank { align-self: auto; justify-items: start; text-align: left; }
}

/* ==========================================================
   Contrast and finish pass — distinct canvas, panels, cards,
   controls and champagne-gold hierarchy at normal brightness.
   ========================================================== */
:root {
  --surface: #fffdf8;
  --surface-soft: #f8f2e7;
  --surface-gold: #f3e5c8;
  --surface-gold-soft: #faf3e5;
  --border-neutral: #d2c7b7;
  --border-gold-strong: #c49b4e;
  --shadow-panel: 0 14px 36px rgba(58, 43, 21, .11), 0 2px 7px rgba(58, 43, 21, .055);
  --shadow-card-strong: 0 18px 42px rgba(58, 43, 21, .14), 0 3px 9px rgba(58, 43, 21, .07);
}

body {
  background:
    radial-gradient(circle at 86% 2%, rgba(196,155,78,.18), transparent 32rem),
    linear-gradient(145deg, #f4f0e8 0%, var(--page) 52%, #e8e0d4 100%);
}
.portal-layout .portal-main { background: rgba(246,242,234,.58) !important; }
.portal-layout .page-content { background: transparent; }

.sidebar,
.simple-layout .sidebar,
.portal-layout .sidebar,
.admin-sidebar {
  background: #fbf7ef !important;
  border-right: 1px solid #cbc0ae !important;
  box-shadow: 9px 0 28px rgba(58,43,21,.07);
}
.topbar,
.portal-layout .topbar {
  background: rgba(255,253,248,.95) !important;
  border-bottom: 1px solid #d4c7b3 !important;
  box-shadow: 0 5px 20px rgba(58,43,21,.07);
}
.portal-layout .topbar::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(173,118,21,.48), transparent);
}
.sidebar nav a,
.simple-layout .sidebar nav a { color: #5d574d; }
.sidebar nav a:hover { background: #f2eadc; border-color: #dfd3c1; }
.sidebar nav a.active,
.simple-layout .sidebar nav a.active {
  color: #62420b;
  border-color: #d2ad65;
  background: linear-gradient(90deg, #f1dfbd, #f8f0df 78%);
  box-shadow: inset 3px 0 #ad7615, 0 4px 14px rgba(90,62,17,.07);
}
.sidebar nav a.active > span,
.simple-layout .sidebar nav a.active span { color: #9a6710; }
.profile-chip > span { background: #f3e5c8; border-color: #d6b66f; }

/* Page-level sections read as intentional zones, not text on white. */
.portal-layout .simple-welcome,
.portal-layout .hub-intro,
.portal-layout .page-intro,
.portal-layout .admin-welcome,
.portal-layout .earn-hero {
  position: relative;
  padding: clamp(22px, 3vw, 31px);
  border: 1px solid #cfb77f;
  border-radius: 14px;
  background:
    radial-gradient(circle at 92% 10%, rgba(196,155,78,.18), transparent 19rem),
    linear-gradient(125deg, #fffaf0 0%, #f4e8d2 100%);
  box-shadow: var(--shadow-panel);
}
.portal-layout .simple-welcome,
.portal-layout .hub-intro,
.portal-layout .admin-welcome,
.portal-layout .earn-hero { margin-bottom: 26px; }
.portal-layout .page-intro { margin-bottom: 30px; }
.portal-layout .simple-welcome::before,
.portal-layout .hub-intro::before,
.portal-layout .page-intro::before,
.portal-layout .admin-welcome::before,
.portal-layout .earn-hero::before {
  content: "";
  position: absolute;
  inset: 12px auto 12px 0;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(#d5b66f, #9b6610);
}
.portal-layout .section-kicker,
.portal-layout .simple-welcome > span,
.portal-layout .hub-intro > div > span,
.portal-layout .admin-welcome > span,
.portal-layout .earn-hero > span { color: #895b0c; }

/* Cards and functional panels use opaque cream-white surfaces and visible edges. */
.welcome-band,
.next-call,
.rank-panel,
.stat-card,
.content-card,
.referral-activation,
.referral-link-panel,
.leaderboard-hero,
.settings-hero,
.hub-card,
.admin-actions a,
.admin-quick-stats article,
.admin-content-card,
.referral-summary article,
.home-path,
.earn-link-card,
.earn-steps article,
.clip-card,
.portal-layout .form-panel,
.portal-layout .table-panel,
.portal-layout .settings-grid article,
.portal-layout .simple-referral-card,
.portal-layout .account-simple-grid article,
.portal-layout .simple-preferences,
.portal-layout .simple-membership {
  background: var(--surface) !important;
  border-color: var(--border-neutral) !important;
  box-shadow: var(--shadow-panel);
}
.content-card:hover,
.hub-card:hover,
.admin-actions a:hover,
.home-path:hover,
.clip-card:hover {
  border-color: var(--border-gold-strong) !important;
  box-shadow: var(--shadow-card-strong);
}

.welcome-band,
.leaderboard-hero,
.settings-hero,
.earn-link-card,
.referral-activation {
  background: linear-gradient(120deg, #fffaf0 34%, #f1e2c4) !important;
  border-color: #c9aa69 !important;
}
.earn-link-card,
.referral-activation { box-shadow: 0 16px 38px rgba(101,70,18,.13); }
.earn-steps { gap: 1px; border: 1px solid #cdbfa9; border-radius: 11px; background: #cdbfa9; }
.earn-steps article { background: #f9f4ea !important; box-shadow: none; border: 0 !important; }
.earn-steps article:nth-child(even) { background: #f3eadb !important; }
.earn-steps b { background: #ad7615; color: #fffdf8; box-shadow: 0 3px 8px rgba(91,60,11,.2); }

.admin-quick-stats,
.referral-summary { border-color: #cbbda8; background: #cbbda8; }
.admin-quick-stats article,
.referral-summary article { background: #f8f2e7 !important; box-shadow: none; }
.admin-quick-stats article:nth-child(even),
.referral-summary article:nth-child(even) { background: #f1e6d4 !important; }

/* Stronger structure for tables, fields, upload areas and secondary actions. */
.table-wrap {
  border: 1px solid #c9bdab;
  border-radius: 9px;
  background: var(--surface);
  box-shadow: 0 10px 28px rgba(58,43,21,.085);
}
th { color: #51483c; background: #eee4d4; border-bottom: 1px solid #c9bdab; }
td { border-color: #ddd3c5; }
tbody tr:nth-child(even) td { background: #fbf7ef; }

.field input, .field select, .field textarea,
.admin-search input, .registry-select,
.referral-link input, .earn-link-row input,
.affiliate-code-form input, .hub-intro input,
.welcome-action-message input {
  background: #fffaf2 !important;
  border-color: #c9bdab !important;
  box-shadow: inset 0 1px 2px rgba(58,43,21,.045);
}
.field input:hover, .field select:hover, .field textarea:hover,
.admin-search input:hover, .registry-select:hover { border-color: #ae8a46 !important; }
.field input:focus, .field select:focus, .field textarea:focus,
.admin-search input:focus, .registry-select:focus {
  border-color: #9c6811 !important;
  box-shadow: 0 0 0 3px rgba(173,118,21,.16) !important;
}
.outline-button {
  color: #4c4030;
  background: #fffaf2;
  border-color: #b99655;
  box-shadow: 0 4px 12px rgba(58,43,21,.055);
}
.outline-button:hover { background: #f1e3c9; border-color: #9c6811; }
.mini-button { background: #f1eadf; border-color: #cbbfae; }
.mini-button:hover { background: #e9dcc8; border-color: #a77b30; }
.media-dropzone,
.portal-layout .media-dropzone {
  background: #fbf4e8 !important;
  border-color: #c9a65f !important;
  box-shadow: inset 0 0 0 1px rgba(173,118,21,.06);
}
.portal-layout .selected-file { background: #f2e7d3; border-color: #c7a661; }

.notice-info { color: #62420b; background: #f6e9cf; border-color: #c9a75f; }
.notice-success { background: #eaf6ee; border-color: #8fbea2; }
.notice-error { background: #fff0ed; border-color: #d8a19b; }
.empty-state { background: #f8f2e7; border-color: #c4a76e; }
.welcome-steps article { background: #f8f1e5; border-color: #d4c5ae; }

/* Authentication remains airy while the card clearly separates from the canvas. */
.auth-page {
  background:
    radial-gradient(circle at 50% 0, rgba(196,155,78,.24), transparent 32rem),
    linear-gradient(145deg, #f6f2ea, #e9e0d2);
}
.auth-card {
  background: #fffdf8;
  border-color: #c5a15b;
  box-shadow: 0 26px 70px rgba(58,43,21,.18), 0 4px 12px rgba(58,43,21,.08);
}

@media (max-width: 860px) {
  .sidebar, .simple-layout .sidebar, .portal-layout .sidebar {
    background: #fbf7ef !important;
    box-shadow: 15px 0 46px rgba(58,43,21,.18);
  }
}
@media (max-width: 640px) {
  .portal-layout .simple-welcome,
  .portal-layout .hub-intro,
  .portal-layout .page-intro,
  .portal-layout .admin-welcome,
  .portal-layout .earn-hero { padding: 20px 18px; border-radius: 11px; }
}

/* Final accessible accent states found during the live route audit. */
.sidebar nav a.active .nav-label,
.simple-layout .sidebar nav a.active .nav-label { color: #70490a; }
.section-heading a,
.simple-heading a,
.content-card-footer a,
.home-path > b,
.hub-card-copy > b,
.password-toggle { color: #895b0c; }
.hub-filter.active {
  color: #5b3b07;
  background: #efe1c4;
  border-color: #b48a3c;
}
.member-cell > span,
.rank-1,
.your-rank strong { color: #895b0c; }
.portal-layout .publish-intro { color: #625e56; }
.portal-layout .media-dropzone > strong { color: #24231f; }
.portal-layout .admin-quick-stats article > span,
.portal-layout .referral-summary article > span { color: #625e56; }
.portal-layout .mini-button[data-action="unlink"],
.portal-layout .mini-button[data-action="suspend"] {
  color: #9c352e;
  background: #fff0ed;
  border-color: #d39a94;
}
.portal-layout .mini-button[data-action="unlink"]:hover,
.portal-layout .mini-button[data-action="suspend"]:hover {
  color: #74251f;
  background: #f9dcd8;
  border-color: #b9635a;
}
.welcome-modal,
.content-viewer,
.viewer-copy {
  background: var(--surface);
}
.welcome-modal,
.content-viewer { border-color: #c5a15b; }

/* ==========================================================
   Restrained production palette
   Neutral structure first; gold is reserved for small labels,
   progress, focus, and active-state details.
   ========================================================== */
:root {
  --page: #f2efe9;
  --card: #fffdf9;
  --raised: #f8f5ef;
  --input: #ffffff;
  --cream: #25231f;
  --muted: #6b665e;
  --line: #c9c1b5;
  --line-soft: #ddd7cd;
  --gold-light: #c7a45e;
  --gold: #9c6c19;
  --gold-dark: #6f4b0f;
  --shadow: 0 16px 42px rgba(49, 39, 24, .12), 0 3px 10px rgba(49, 39, 24, .06);
}

body {
  background: #f2efe9;
  color: #25231f;
}
.portal-layout .portal-main {
  background: #f2efe9 !important;
}
.portal-layout .page-content { background: transparent; }

.sidebar,
.simple-layout .sidebar,
.portal-layout .sidebar,
.admin-sidebar {
  background: #faf8f3 !important;
  border-right: 1px solid #d4cec4 !important;
  box-shadow: 5px 0 20px rgba(49, 39, 24, .045);
}
.topbar,
.portal-layout .topbar {
  background: rgba(255, 253, 249, .97) !important;
  border-bottom: 1px solid #d8d2c8 !important;
  box-shadow: 0 3px 14px rgba(49, 39, 24, .045);
}
.portal-layout .topbar::after { content: none; }
.sidebar nav a,
.simple-layout .sidebar nav a { color: #625e57; }
.sidebar nav a:hover {
  color: #292722;
  background: #f0ece5;
  border-color: transparent;
}
.sidebar nav a.active,
.simple-layout .sidebar nav a.active {
  color: #292722;
  border-color: #d6cfc4;
  background: #ece8e0;
  box-shadow: inset 3px 0 #9c6c19;
}
.sidebar nav a.active > span,
.simple-layout .sidebar nav a.active span,
.sidebar nav a.active .nav-label,
.simple-layout .sidebar nav a.active .nav-label { color: #4b463e; }
.profile-chip > span {
  color: #6f4b0f;
  background: #f5efe2;
  border-color: #d8c69f;
}

/* Page introductions are clean cards with one quiet hairline accent. */
.portal-layout .simple-welcome,
.portal-layout .hub-intro,
.portal-layout .page-intro,
.portal-layout .admin-welcome,
.portal-layout .earn-hero {
  padding: clamp(22px, 3vw, 30px);
  border: 1px solid #d8d1c6;
  border-radius: 12px;
  background: #fffdf9;
  box-shadow: 0 8px 25px rgba(49, 39, 24, .075);
}
.portal-layout .simple-welcome::before,
.portal-layout .hub-intro::before,
.portal-layout .page-intro::before,
.portal-layout .admin-welcome::before,
.portal-layout .earn-hero::before {
  inset: 0 auto auto 24px;
  width: 48px;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: #a87924;
}
.portal-layout .section-kicker,
.portal-layout .simple-welcome > span,
.portal-layout .hub-intro > div > span,
.portal-layout .admin-welcome > span,
.portal-layout .earn-hero > span { color: #825a14; }

.welcome-band,
.next-call,
.rank-panel,
.stat-card,
.content-card,
.referral-activation,
.referral-link-panel,
.leaderboard-hero,
.settings-hero,
.hub-card,
.admin-actions a,
.admin-quick-stats article,
.admin-content-card,
.referral-summary article,
.home-path,
.earn-link-card,
.earn-steps article,
.clip-card,
.portal-layout .form-panel,
.portal-layout .table-panel,
.portal-layout .settings-grid article,
.portal-layout .simple-referral-card,
.portal-layout .account-simple-grid article,
.portal-layout .simple-preferences,
.portal-layout .simple-membership {
  background: #fffdf9 !important;
  border-color: #d7d0c5 !important;
  box-shadow: 0 7px 22px rgba(49, 39, 24, .07);
}
.welcome-band,
.leaderboard-hero,
.settings-hero,
.earn-link-card,
.referral-activation {
  background: #fbf8f1 !important;
  border-color: #d4c8b3 !important;
}
.content-card:hover,
.hub-card:hover,
.admin-actions a:hover,
.home-path:hover,
.clip-card:hover {
  border-color: #b9995b !important;
  box-shadow: 0 11px 28px rgba(49, 39, 24, .10);
}

.earn-steps {
  gap: 12px;
  border: 0;
  background: transparent;
}
.earn-steps article,
.earn-steps article:nth-child(even) {
  background: #fffdf9 !important;
  border: 1px solid #d8d1c6 !important;
  box-shadow: 0 4px 14px rgba(49, 39, 24, .045);
}
.earn-steps b {
  color: #fff;
  background: #8c6117;
  box-shadow: none;
}
.admin-quick-stats,
.referral-summary {
  gap: 12px;
  border: 0;
  background: transparent;
}
.admin-quick-stats article,
.admin-quick-stats article:nth-child(even),
.referral-summary article,
.referral-summary article:nth-child(even) {
  background: #f8f5ef !important;
  border: 1px solid #d8d1c6 !important;
  box-shadow: none;
}

.table-wrap {
  border-color: #cec7bc;
  background: #fffdf9;
  box-shadow: 0 7px 20px rgba(49, 39, 24, .06);
}
th {
  color: #504b44;
  background: #eeeae3;
  border-color: #cec7bc;
}
td { border-color: #ded8cf; }
tbody tr:nth-child(even) td { background: #faf8f3; }
.current-row td { background: #f7f1e4; }

.field input, .field select, .field textarea,
.admin-search input, .registry-select,
.referral-link input, .earn-link-row input,
.affiliate-code-form input, .hub-intro input,
.welcome-action-message input {
  color: #292722;
  background: #fff !important;
  border-color: #cfc8bd !important;
}
.field input:focus, .field select:focus, .field textarea:focus,
.admin-search input:focus, .registry-select:focus {
  border-color: #8c6117 !important;
  box-shadow: 0 0 0 3px rgba(140, 97, 23, .13) !important;
}
.media-dropzone,
.portal-layout .media-dropzone {
  color: #4d4942;
  background: #f8f5ef !important;
  border-color: #bca878 !important;
  box-shadow: none;
}
.portal-layout .media-dropzone:hover,
.portal-layout .media-dropzone.is-dragover,
.portal-layout .media-dropzone.drag-active {
  background: #f3eee4 !important;
  border-color: #8c6117 !important;
}

.gold-button {
  color: #fff;
  background: #22211d;
  border-color: #76531a;
  box-shadow: 0 8px 20px rgba(34, 33, 29, .16);
}
.gold-button:hover { background: #11110f; }
.outline-button {
  color: #443f37;
  background: #fffdf9;
  border-color: #bca66f;
  box-shadow: none;
}
.outline-button:hover { color: #292722; background: #f2ede4; }
.mini-button {
  color: #3f3b34;
  background: #f0ece5;
  border-color: #cec7bc;
}

.announcement-strip,
.simple-update,
.empty-state,
.welcome-steps article { background: #f8f5ef; border-color: #d7d0c5; }
.notice-info { color: #60430f; background: #f7efdf; border-color: #cbb680; }
.notice-success { color: #285f42; background: #edf6f0; border-color: #9dbca8; }
.notice-error { color: #8b352f; background: #fbefed; border-color: #d1a39e; }

.auth-page {
  background: radial-gradient(circle at 50% 0, rgba(168, 121, 36, .10), transparent 30rem), #f2efe9;
}
.auth-card,
.welcome-modal,
.content-viewer,
.viewer-copy {
  background: #fffdf9;
  border-color: #cec3ad;
}
.auth-card { box-shadow: 0 22px 58px rgba(49, 39, 24, .15); }

@media (max-width: 860px) {
  .sidebar, .simple-layout .sidebar, .portal-layout .sidebar {
    background: #faf8f3 !important;
    box-shadow: 12px 0 38px rgba(49, 39, 24, .16);
  }
}

/* Final contrast pass: win over the legacy dark-sidebar selectors above. */
.portal-layout .sidebar nav a,
.portal-layout.simple-layout .sidebar nav a {
  color: #514d46;
}
.portal-layout .sidebar nav a > span,
.portal-layout .sidebar nav a .nav-label,
.portal-layout.simple-layout .sidebar nav a > span,
.portal-layout.simple-layout .sidebar nav a .nav-label {
  color: #57524a;
}
.portal-layout .sidebar nav a.active,
.portal-layout.simple-layout .sidebar nav a.active {
  color: #292722 !important;
  border-color: #d6cfc4 !important;
  background: #ece8e0 !important;
  box-shadow: inset 3px 0 #9c6c19 !important;
}
.portal-layout .sidebar nav a.active > span,
.portal-layout .sidebar nav a.active .nav-label,
.portal-layout.simple-layout .sidebar nav a.active > span,
.portal-layout.simple-layout .sidebar nav a.active .nav-label {
  color: #3f3b35 !important;
}
.portal-layout .sidebar nav a.active .nav-icon,
.portal-layout.simple-layout .sidebar nav a.active .nav-icon {
  color: #805914;
}
.portal-layout .section-kicker,
.portal-layout .simple-welcome > span,
.portal-layout .hub-intro > div > span,
.portal-layout .admin-welcome > span,
.portal-layout .earn-hero > span,
.portal-layout .earn-link-card > div > span,
.portal-layout .clip-copy > span {
  color: #704b0f;
}
.activation-steps .active { color: #704b0f; }
.activation-steps .complete { color: #246b45; }