/*
 * Competition, Worlds and profile editorial layer.
 *
 * The application already owns the data, actions and responsive shell on
 * these pages. This file supplies the shared visual language after those
 * page styles so the redesign stays scoped and does not alter media players,
 * checkout flows or the global navigation.
 */
:root {
  --mpe-ink: #111214;
  --mpe-graphite: #24262b;
  --mpe-teal: #10495c;
  --mpe-cyan: #187d91;
  --mpe-orange: #f47732;
  --mpe-copper: #ad633d;
  --mpe-ivory: #e9e0d1;
  --mpe-cream: #f4eee4;
  --mpe-muted: #92908d;
  --mpe-line: rgba(17, 18, 20, .18);
  --mpe-display: var(--mp-display-font, var(--mp-font, Inter, ui-sans-serif, system-ui, sans-serif));
  --mpe-body: var(--mp-font, Inter, ui-sans-serif, system-ui, sans-serif);
}

/* A small shared reset for the editorial surfaces. */
.competitions-page,
.comp-detail-wrap,
.competition-submissions,
.create-competition-page,
.competition-fund-page,
.worlds-page,
.world-page,
.create-world-page,
.join-world-page,
.profile-page,
.profile-settings-page {
  color: var(--mpe-ink);
  font-family: var(--mpe-body);
}

.competitions-page :is(h1, h2, h3),
.comp-detail-wrap :is(h1, h2, h3),
.competition-submissions :is(h1, h2, h3),
.create-competition-page :is(h1, h2, h3),
.competition-fund-page :is(h1, h2, h3),
.worlds-page :is(h1, h2, h3),
.world-page :is(h1, h2, h3),
.create-world-page :is(h1, h2, h3),
.join-world-page :is(h1, h2, h3),
.profile-page :is(h1, h2, h3),
.profile-settings-page :is(h1, h2, h3) {
  font-family: var(--mpe-display);
}

.competitions-page,
.worlds-page,
.profile-page,
.profile-settings-page {
  width: min(1420px, calc(100% - 48px));
  margin-inline: auto;
}

/* Decorative light trails and the off-canvas shell panels must never create
   a document-wide horizontal scroll area. */
body[data-section="competitions"],
body[data-section="worlds"],
body[data-section="profile"],
body[data-section="settings"] { overflow-x: clip; }

html:has(body[data-section="competitions"]),
html:has(body[data-section="worlds"]),
html:has(body[data-section="profile"]),
html:has(body[data-section="settings"]) { overflow-x: clip; }

/* -------------------------------------------------------------------------
   COMPETITIONS — electric poster / challenge desk
   ------------------------------------------------------------------------- */
.competitions-page {
  padding: 34px 0 92px;
  position: relative;
  isolation: isolate;
}

.competitions-page::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 8px -10vw auto;
  height: 520px;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 70% 18%, rgba(24, 125, 145, .3), transparent 30%),
    radial-gradient(ellipse at 90% 70%, rgba(244, 119, 50, .17), transparent 28%),
    repeating-linear-gradient(158deg, transparent 0 70px, rgba(244, 119, 50, .12) 71px 73px, transparent 74px 126px);
  opacity: .92;
  mask-image: linear-gradient(180deg, #000 0, #000 70%, transparent 100%);
}

.competitions-page .competitions-hero,
.comp-detail-wrap .comp-detail-header {
  border: 1px solid rgba(242, 238, 231, .2) !important;
  border-radius: 2px !important;
  background:
    linear-gradient(115deg, rgba(8, 16, 20, .96), rgba(16, 73, 92, .92) 66%, rgba(17, 18, 20, .98)),
    var(--mpe-ink) !important;
  box-shadow: 0 22px 54px rgba(8, 22, 29, .28) !important;
}

.competitions-page .competitions-hero {
  min-height: 382px;
  padding: clamp(30px, 5vw, 68px) clamp(24px, 6vw, 74px) !important;
  overflow: hidden;
}

.competitions-page .competitions-hero::before,
.comp-detail-wrap .comp-detail-header::before {
  content: "";
  position: absolute;
  inset: -18% -6% auto 35%;
  height: 150%;
  pointer-events: none;
  background:
    linear-gradient(112deg, transparent 0 46%, rgba(255, 179, 71, .24) 47% 48%, transparent 49% 57%, rgba(244, 119, 50, .22) 58% 59%, transparent 60%),
    radial-gradient(ellipse at 55% 34%, rgba(24, 125, 145, .26), transparent 44%);
  transform: rotate(-8deg);
  opacity: .82;
}

.competitions-page .competitions-hero > *,
.comp-detail-wrap .comp-detail-header > * { position: relative; z-index: 1; }

.competitions-page .competitions-eyebrow,
.competitions-page .eyebrow,
.comp-detail-wrap .competition-category {
  color: var(--mpe-orange) !important;
  font: 850 11px/1 var(--mpe-body);
  letter-spacing: .16em;
  text-transform: uppercase;
}

.competitions-page .competitions-hero h1 {
  max-width: 760px;
  margin: 16px 0 14px !important;
  color: var(--mpe-cream) !important;
  font-size: clamp(44px, 7vw, 92px) !important;
  line-height: .92 !important;
  letter-spacing: -.06em !important;
  text-wrap: balance;
}

.competitions-page .competitions-hero p {
  max-width: 590px;
  color: rgba(244, 238, 228, .75) !important;
  font-size: clamp(15px, 1.7vw, 18px) !important;
  line-height: 1.6 !important;
}

.competitions-page .create-competition-link,
.create-competition-page .competition-submit,
.competition-fund-page .primary {
  border: 1px solid var(--mpe-orange) !important;
  border-radius: 0 !important;
  background: var(--mpe-orange) !important;
  color: #161719 !important;
  box-shadow: 5px 5px 0 rgba(8, 16, 20, .38) !important;
  font-weight: 900;
  letter-spacing: .02em;
}

.competitions-page .create-competition-link:hover,
.create-competition-page .competition-submit:hover,
.competition-fund-page .primary:hover { transform: translate(-1px, -1px); filter: brightness(1.06); }

.competitions-page .competition-battle-coach {
  align-self: stretch;
  padding: 10px;
  border: 1px solid rgba(244, 119, 50, .55);
  border-radius: 0;
  background: rgba(3, 12, 16, .34);
}

.competitions-page .competition-battle-coach img { border-radius: 0 !important; filter: saturate(.85) contrast(1.1) !important; }

.competitions-page .competition-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
  margin-top: 26px;
}

.competitions-page .competition-card {
  min-width: 0;
  border: 1px solid var(--mpe-line) !important;
  border-radius: 0 !important;
  background: var(--mpe-cream) !important;
  box-shadow: 7px 7px 0 rgba(17, 18, 20, .12) !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.competitions-page .competition-card::before { display: none; }
.competitions-page .competition-card:hover { transform: translateY(-4px); border-color: var(--mpe-orange) !important; box-shadow: 9px 10px 0 rgba(244, 119, 50, .18) !important; }
.competitions-page .competition-card-link { padding: 24px !important; }
.competitions-page .competition-card h2 { margin: 15px 0 10px; font-size: clamp(25px, 3vw, 37px) !important; line-height: .98; letter-spacing: -.045em; }
.competitions-page .competition-category { display: inline-flex; padding: 6px 8px; border: 1px solid var(--mpe-copper); background: transparent !important; color: var(--mpe-copper) !important; }
.competitions-page .competition-description { color: #56514a !important; line-height: 1.55; }
.competitions-page .competition-meta { border-top: 1px solid rgba(17, 18, 20, .16); color: #5c5750; }
.competitions-page .competition-meta strong { color: var(--mpe-ink); }
.competitions-page .competition-creator { border-top: 1px solid rgba(17, 18, 20, .12); border-radius: 0 !important; }
.competitions-page .competition-avatar { border-radius: 0 !important; box-shadow: none !important; background: var(--mpe-teal) !important; }

.competition-empty,
.comp-detail-card,
.competition-submissions .ecosystem-feed-empty,
.competition-submissions .ecosystem-see-more-wrap {
  border-radius: 0 !important;
  border: 1px solid var(--mpe-line) !important;
}

.competition-empty { background: var(--mpe-cream) !important; }

/* Detail, fund and editor surfaces */
.comp-detail-wrap {
  width: min(1240px, calc(100% - 40px));
  max-width: none;
  padding: 34px 0 96px !important;
}

.comp-detail-wrap .comp-detail-header {
  border-radius: 0 !important;
  padding: clamp(26px, 5vw, 64px) !important;
}

.comp-detail-wrap .comp-detail-header h1 {
  color: var(--mpe-cream) !important;
  font-size: clamp(38px, 6vw, 78px) !important;
  line-height: .95 !important;
  letter-spacing: -.06em !important;
}

.comp-detail-wrap .comp-detail-description,
.comp-detail-wrap .comp-host-link { color: rgba(244, 238, 228, .78) !important; }
.comp-detail-wrap .comp-host-link small { color: rgba(244, 238, 228, .57) !important; }
.comp-detail-wrap .comp-detail-stats { border-radius: 0 !important; border-color: rgba(244, 238, 228, .24) !important; background: rgba(7, 16, 20, .44) !important; }
.comp-detail-wrap .comp-detail-stats strong { color: var(--mpe-cream); font-family: var(--mpe-display); }
.comp-detail-wrap .competition-detail-coach { border-radius: 0 !important; background: rgba(7, 16, 20, .28) !important; }
.comp-detail-wrap .competition-detail-coach img { border-radius: 0 !important; }
.comp-detail-card { padding: clamp(20px, 3vw, 34px) !important; background: var(--mpe-cream) !important; box-shadow: 6px 6px 0 rgba(17, 18, 20, .1) !important; }
.comp-detail-card h2 { font-size: clamp(27px, 4vw, 42px) !important; letter-spacing: -.05em !important; }
.comp-detail-card p { line-height: 1.7; }
.comp-prize-list li { border-radius: 0 !important; background: rgba(244, 119, 50, .08) !important; border-left: 3px solid var(--mpe-orange); }
.comp-prize-winner-badge { border-radius: 0 !important; background: var(--mpe-teal) !important; color: var(--mpe-cream) !important; }
.comp-entry-form :is(input, textarea, select),
.competition-form :is(input, textarea, select) { border-radius: 0 !important; border-color: rgba(17,18,20,.28) !important; background: var(--mpe-cream) !important; }
.comp-entry-form :is(input, textarea, select):focus,
.competition-form :is(input, textarea, select):focus { outline: 2px solid var(--mpe-orange); outline-offset: 1px; }
.competition-actions .competition-action { border-radius: 0 !important; }

.create-competition-page,
.competition-fund-page { max-width: 960px !important; padding-top: 42px !important; padding-bottom: 92px !important; }
.create-competition-page h1,
.competition-fund-page .page-title { font-size: clamp(42px, 7vw, 78px) !important; line-height: .94 !important; letter-spacing: -.06em !important; }
.create-competition-page > p { max-width: 640px; color: #68625b !important; }
.competition-form,
.create-competition-page .card,
.competition-fund-page .market-card { border-radius: 0 !important; border-color: var(--mpe-line) !important; background: var(--mpe-cream) !important; box-shadow: 7px 7px 0 rgba(17,18,20,.1) !important; }
.competition-submit,.competition-cancel { border-radius: 0 !important; }
.competition-cancel { border: 1px solid var(--mpe-line) !important; }

/* The compact edit route does not have a page-specific wrapper, so use the
   competition section marker supplied by the app shell without touching the
   public listing/detail compositions above. */
body[data-section="competitions"] main.app-page:not(.competitions-page) {
  width: min(960px, calc(100% - 40px));
  margin-inline: auto;
  padding: 42px 0 92px;
}
body[data-section="competitions"] main.app-page:not(.competitions-page) > div[style] { max-width: none !important; padding: 0 !important; }
body[data-section="competitions"] main.app-page:not(.competitions-page) .page-title {
  margin: 14px 0 24px;
  font: 850 clamp(42px, 7vw, 78px)/.94 var(--mpe-display);
  letter-spacing: -.06em;
}
body[data-section="competitions"] main.app-page:not(.competitions-page) form.card,
body[data-section="competitions"] main.app-page:not(.competitions-page) .market-card {
  border-radius: 0 !important;
  border: 1px solid var(--mpe-line) !important;
  background: var(--mpe-cream) !important;
  box-shadow: 7px 7px 0 rgba(17,18,20,.1) !important;
}
body[data-section="competitions"] main.app-page:not(.competitions-page) form.card :is(input, textarea, select) { border-radius: 0 !important; }

.competition-submissions {
  width: min(1240px, calc(100% - 40px));
  margin-inline: auto;
  padding: 34px 0 92px;
}
.competition-submissions > h1 { margin: 12px 0 26px; font-size: clamp(42px, 7vw, 78px); line-height: .93; letter-spacing: -.06em; }
.competition-submissions .video-feed-grid { gap: 18px; }
.competition-submissions .ecosystem-see-more { border-radius: 0 !important; border: 1px solid var(--mpe-line); }

/* -------------------------------------------------------------------------
   WORLDS — window collage / community rooms
   ------------------------------------------------------------------------- */
.worlds-page { padding: 34px 0 92px; }
.worlds-page .worlds-container { width: 100% !important; }
.worlds-page .worlds-intro {
  position: relative;
  overflow: hidden;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) !important;
  padding: clamp(28px, 5vw, 64px) !important;
  border: 1px solid rgba(244, 238, 228, .22) !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 78% 20%, rgba(244,119,50,.22), transparent 22%),
    linear-gradient(124deg, rgba(11, 17, 20, .98), rgba(16, 73, 92, .9) 66%, rgba(17, 18, 20, .98)) !important;
  box-shadow: 0 22px 54px rgba(8,22,29,.24);
}
.worlds-page .worlds-intro::before {
  content: "";
  position: absolute;
  inset: 0 0 0 42%;
  pointer-events: none;
  background: repeating-linear-gradient(157deg, transparent 0 64px, rgba(244,119,50,.11) 65px 67px, transparent 68px 122px);
  opacity: .75;
}
.worlds-page .worlds-intro-copy,
.worlds-page .worlds-echo,
.worlds-page .worlds-filters { position: relative; z-index: 1; }
.worlds-page .worlds-intro h1 { margin: 14px 0 12px; color: var(--mpe-cream) !important; font-size: clamp(52px, 9vw, 112px) !important; line-height: .86 !important; letter-spacing: -.075em !important; }
.worlds-page .worlds-intro p { max-width: 520px; color: rgba(244,238,228,.74) !important; line-height: 1.65; }
.worlds-page .worlds-intro .eyebrow { color: var(--mpe-orange) !important; }
.worlds-page .worlds-echo { padding: 8px; border: 1px solid rgba(244,119,50,.55); border-radius: 0; background: rgba(3,12,16,.34); }
.worlds-page .worlds-echo img { border-radius: 0 !important; filter: saturate(.78) contrast(1.08); }
.worlds-page .worlds-intro-copy .primary { border-radius: 0 !important; background: var(--mpe-orange) !important; color: #161719 !important; }
.worlds-page .worlds-filters { border-top-color: rgba(244,238,228,.24) !important; }
.worlds-page .worlds-filters :is(input, select) { border-radius: 0 !important; border-color: rgba(244,238,228,.28) !important; background: rgba(3,12,16,.32) !important; color: var(--mpe-cream) !important; }
.worlds-page .worlds-filters button { border-radius: 0 !important; background: var(--mpe-orange) !important; color: #161719 !important; }
.worlds-page .worlds-grid { gap: 18px !important; margin-top: 26px; }
.worlds-page .world-card { min-width: 0; border: 1px solid var(--mpe-line) !important; border-radius: 0 !important; background: var(--mpe-cream) !important; box-shadow: 6px 6px 0 rgba(17,18,20,.1) !important; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.worlds-page .world-card:hover { transform: translateY(-4px); border-color: var(--mpe-cyan) !important; box-shadow: 8px 9px 0 rgba(24,125,145,.17) !important; }
.worlds-page .world-card > .world-avatar { border-radius: 0 !important; background: var(--mpe-teal) !important; }
.worlds-page .world-card-category { border-radius: 0 !important; border: 1px solid var(--mpe-copper); background: transparent !important; color: var(--mpe-copper) !important; }
.worlds-page .world-card h2 { font-size: clamp(25px, 3vw, 38px) !important; line-height: .97; letter-spacing: -.05em; }
.worlds-page .world-card p { color: #5d5851 !important; line-height: 1.55; }
.worlds-page .world-card-meta { border-top: 1px solid rgba(17,18,20,.14); color: #6d675e !important; }
.worlds-page .world-card-badge { border-radius: 0 !important; background: rgba(16,73,92,.12) !important; color: var(--mpe-teal) !important; }
.worlds-page .worlds-empty { border-radius: 0 !important; }

.world-page { width: 100%; }
.world-page .world-container { width: min(1320px, calc(100% - 44px)); padding: 34px 0 96px; }
.world-page .world-shell { gap: 18px; }
.world-page .world-navigation,
.world-page .world-planets,
.world-page .world-chat-header,
.world-page .world-composer,
.world-page .members-panel { border-radius: 0 !important; border-color: rgba(17,18,20,.18) !important; }
.world-page .world-navigation { background: var(--mpe-cream) !important; box-shadow: 5px 5px 0 rgba(17,18,20,.1); }
.world-page .world-rail-heading { border-radius: 0 !important; background: linear-gradient(135deg, var(--mpe-ink), var(--mpe-teal)) !important; }
.world-page .world-compact-header h1,
.world-page .world-name-button { font-family: var(--mpe-display) !important; letter-spacing: -.04em; }
.world-page .world-planets { background: rgba(16,73,92,.06) !important; }
.world-page .planet-link,
.world-page .planet-add { border-radius: 0 !important; }
.world-page .planet-link.active { border-left: 3px solid var(--mpe-orange); }
.world-page .world-chat-header { background: var(--mpe-cream) !important; }
.world-page .world-post { border-bottom: 1px solid rgba(17,18,20,.09); border-radius: 0 !important; }
.world-page .world-post:hover { background: rgba(16,73,92,.06) !important; }
.world-page .world-post-body { line-height: 1.65; }
.world-page .world-composer { background: var(--mpe-cream) !important; box-shadow: 5px 5px 0 rgba(17,18,20,.1); }
.world-page .world-composer-icon,
.world-page .world-members-toggle,
.world-page .world-options-toggle,
.world-page .post-menu-button { border-radius: 0 !important; }
.world-page .world-options-panel,
.world-page .world-share,
.world-page .world-rules,
.world-page .world-brand-settings,
.world-page .world-manage,
.world-page .post-menu { border-radius: 0 !important; }

.create-world-page,
.join-world-page { padding-bottom: 96px; }
.create-world-page .create-world-container,
.join-world-page .join-world-container { width: min(1120px, calc(100% - 44px)); padding: 34px 0 0; }
.create-world-page .create-world-intro,
.join-world-page .join-world-intro { border-radius: 0 !important; border: 1px solid rgba(244,238,228,.2); background: linear-gradient(124deg, var(--mpe-ink), var(--mpe-teal)) !important; color: var(--mpe-cream); box-shadow: 0 22px 54px rgba(8,22,29,.22); }
.create-world-page .create-world-intro h1,
.join-world-page .join-world-intro h1 { color: var(--mpe-cream); font-size: clamp(48px, 8vw, 92px); line-height: .9; letter-spacing: -.07em; }
.create-world-page .create-world-intro p,
.join-world-page .join-world-intro p { color: rgba(244,238,228,.72); }
.create-world-page .create-world-form,
.create-world-page .create-world-preview,
.join-world-page .join-world-card { border-radius: 0 !important; border-color: var(--mpe-line) !important; background: var(--mpe-cream) !important; box-shadow: 6px 6px 0 rgba(17,18,20,.1); }
.create-world-page .create-world-field :is(input, select, textarea),
.join-world-page .join-world-form :is(input, select, textarea) { border-radius: 0 !important; }
.create-world-page .create-world-submit,
.join-world-page .join-world-submit { border-radius: 0 !important; background: var(--mpe-orange) !important; color: #161719 !important; }

/* -------------------------------------------------------------------------
   PROFILES — clean artist portfolio surfaces
   ------------------------------------------------------------------------- */
.profile-page { max-width: 1320px; padding: 34px 0 96px; }
.profile-page .viewed-profile-cover { height: clamp(220px, 28vw, 360px); border-radius: 0 !important; border: 1px solid rgba(17,18,20,.16); background-color: var(--mpe-teal); }
.profile-page .viewed-profile-cover::after { background: linear-gradient(180deg, rgba(4,9,12,.04), rgba(4,9,12,.7)) !important; }
.profile-page .viewed-profile-head { grid-template-columns: 154px minmax(0, 1fr); gap: 26px; padding-inline: clamp(16px, 4vw, 46px); }
.profile-page .viewed-profile-picture,
.profile-page .viewed-profile-initials { width: 154px; height: 154px; margin-top: -50px; border: 5px solid var(--mpe-cream); border-radius: 0 !important; box-shadow: 10px 10px 0 rgba(17,18,20,.18); }
.profile-page .viewed-profile-initials { background: var(--mpe-teal); font-family: var(--mpe-display); }
.profile-page .viewed-profile-details { padding-top: 22px; }
.profile-page .viewed-profile-details h1 { color: var(--mpe-ink); font-size: clamp(42px, 6vw, 78px) !important; line-height: .9; letter-spacing: -.065em; }
.profile-page .viewed-profile-details > p:first-of-type { color: var(--mpe-copper); letter-spacing: .04em; }
.profile-page .profile-collaboration-summary { margin: 14px 0 18px; border-block: 1px solid var(--mpe-line); padding: 10px 0; color: var(--mpe-ink); }
.profile-page .profile-collaboration-summary summary { cursor: pointer; font: 800 11px/1.4 var(--mpe-body); letter-spacing: .12em; text-transform: uppercase; color: var(--mpe-teal); }
.profile-page .profile-collaboration-summary p { margin: 8px 0 0; font-size: 12px; line-height: 1.55; color: #6d675e; }
.profile-page .profile-collaboration-summary a { color: var(--mpe-copper); text-decoration: underline; text-underline-offset: 3px; }
.profile-page .viewed-profile-stats { gap: 0; flex-wrap: wrap; border-top: 1px solid var(--mpe-line); border-bottom: 1px solid var(--mpe-line); padding: 12px 0; }
.profile-page .viewed-profile-stats span { padding-right: 22px; margin-right: 22px; border-right: 1px solid var(--mpe-line); }
.profile-page .viewed-profile-stats span:last-child { border-right: 0; }
.profile-page .viewed-profile-stats b { color: var(--mpe-teal); font-family: var(--mpe-display); }
.profile-page .viewed-profile-actions { right: clamp(16px, 4vw, 46px); bottom: 18px; }
.profile-page .viewed-profile-actions :is(a, button) { border-radius: 0 !important; box-shadow: 4px 4px 0 rgba(17,18,20,.22); }
.profile-page .viewed-profile-actions .secondary { background: var(--mpe-cream); color: var(--mpe-ink); }
.profile-page .profile-featured-track { border-radius: 0 !important; background: var(--mpe-cream); box-shadow: 4px 4px 0 rgba(17,18,20,.1); }
.profile-page .profile-featured-track-cover { border-radius: 0 !important; }
.profile-page .profile-track-play-toggle { border-radius: 0 !important; background: var(--mpe-orange); }
.profile-page .profile-tabs { margin: 38px 0 24px; padding: 0; border-bottom: 1px solid var(--mpe-line); border-radius: 0 !important; background: transparent; gap: 4px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
.profile-page .profile-tabs::-webkit-scrollbar { display: none; }
.profile-page .profile-tab { flex: 0 0 auto; padding: 13px 16px; border: 0 !important; border-bottom: 3px solid transparent !important; border-radius: 0 !important; color: #68625b; }
.profile-page .profile-tab.active { background: transparent !important; color: var(--mpe-ink); border-bottom-color: var(--mpe-orange) !important; box-shadow: none !important; }
.profile-page .profile-tab small { border-radius: 0 !important; background: rgba(16,73,92,.1); color: var(--mpe-teal); }
.profile-page .profile-tab-panel { padding: 0 0 60px; }
.profile-page :is(.profile-text-card, .profile-track-card, .profile-beat-card, .profile-info-card, .profile-saved-card) { border-radius: 0 !important; border-color: var(--mpe-line) !important; background: var(--mpe-cream) !important; box-shadow: 4px 4px 0 rgba(17,18,20,.08); }
.profile-page :is(.profile-text-card, .profile-track-card, .profile-beat-card, .profile-info-card, .profile-saved-card):hover { border-color: var(--mpe-cyan) !important; box-shadow: 6px 7px 0 rgba(24,125,145,.14); }
.profile-page :is(.profile-video-thumb, .profile-track-cover, .profile-beat-cover) { border-radius: 0 !important; }
.profile-page .profile-info-eyebrow { border-radius: 0 !important; background: rgba(244,119,50,.1); color: var(--mpe-copper); }
.profile-page .profile-info-card h3,
.profile-page .profile-empty-state h2,
.profile-page .profile-saved-group h2 { font-family: var(--mpe-display); letter-spacing: -.045em; }
.profile-page .profile-empty-state,
.profile-page .private-profile-state { border-radius: 0 !important; background: rgba(16,73,92,.05) !important; }
.profile-page :is(.profile-text-card-actions button, .profile-beat-actions button, .profile-subtab) { border-radius: 0 !important; }

.profile-settings-page { max-width: 1220px; padding: 34px 0 96px; }
.profile-settings-page .settings-layout { gap: 22px; }
.profile-settings-page .settings-nav { border-radius: 0 !important; border-color: var(--mpe-line) !important; background: var(--mpe-cream) !important; }
.profile-settings-page .settings-nav button { border-radius: 0 !important; }
.profile-settings-page .settings-nav button.active { border-left: 3px solid var(--mpe-orange); background: rgba(244,119,50,.1); color: var(--mpe-ink); }
.profile-settings-page .settings-panel,
.profile-settings-page .card { border-radius: 0 !important; border-color: var(--mpe-line) !important; background: var(--mpe-cream) !important; box-shadow: 5px 5px 0 rgba(17,18,20,.08); }
.profile-settings-page .settings-panel :is(input, select, textarea) { border-radius: 0 !important; }
.profile-settings-page .settings-panel :is(input, select, textarea):focus { outline: 2px solid var(--mpe-orange); outline-offset: 1px; }
.profile-settings-page .profile-theme-choice { border-radius: 0 !important; }

/* Dark theme surfaces */
.theme-dark :is(.competitions-page, .comp-detail-wrap, .competition-submissions, .create-competition-page, .competition-fund-page, .worlds-page, .world-page, .create-world-page, .join-world-page, .profile-page, .profile-settings-page) { color: var(--mpe-cream); }
.theme-dark .competitions-page .competition-card,
.theme-dark .comp-detail-card,
.theme-dark .competition-form,
.theme-dark .create-competition-page .card,
.theme-dark .competition-fund-page .market-card,
.theme-dark .worlds-page .world-card,
.theme-dark .world-page .world-navigation,
.theme-dark .world-page .world-chat-header,
.theme-dark .world-page .world-composer,
.theme-dark .world-page .members-panel,
.theme-dark .create-world-page .create-world-form,
.theme-dark .create-world-page .create-world-preview,
.theme-dark .join-world-page .join-world-card,
.theme-dark .profile-page :is(.profile-text-card, .profile-track-card, .profile-beat-card, .profile-info-card, .profile-saved-card),
.theme-dark .profile-settings-page :is(.settings-nav, .settings-panel, .card) {
  border-color: rgba(244,238,228,.18) !important;
  background: #171a1d !important;
  color: var(--mpe-cream) !important;
}
.theme-dark .competitions-page .competition-description,
.theme-dark .competitions-page .competition-meta,
.theme-dark .worlds-page .world-card p,
.theme-dark .worlds-page .world-card-meta,
.theme-dark .profile-page .profile-video-meta,
.theme-dark .profile-page .profile-track-meta,
.theme-dark .profile-page .profile-info-card p,
.theme-dark .profile-page .profile-saved-card span,
.theme-dark .profile-page .profile-saved-card small { color: #b7b2aa !important; }
.theme-dark .competitions-page .competition-meta,
.theme-dark .worlds-page .world-card-meta,
.theme-dark .profile-page .viewed-profile-stats { border-color: rgba(244,238,228,.18) !important; }
.theme-dark .profile-page .profile-collaboration-summary { border-color: rgba(244,238,228,.18); color: var(--mpe-cream); }
.theme-dark .profile-page .profile-collaboration-summary p { color: #b7b2aa; }
.theme-dark .profile-page .viewed-profile-details h1,
.theme-dark .profile-page .profile-tab.active,
.theme-dark .profile-settings-page .settings-nav button.active { color: var(--mpe-cream) !important; }
.theme-dark .profile-page .profile-featured-track,
.theme-dark .profile-settings-page .settings-panel :is(input, select, textarea) { background: #202428 !important; color: var(--mpe-cream) !important; border-color: rgba(244,238,228,.24) !important; }
.theme-dark .profile-page .private-profile-state,
.theme-dark .profile-page .profile-empty-state { background: rgba(24,125,145,.12) !important; border-color: rgba(244,238,228,.2) !important; }
.theme-dark .world-page .world-planets { background: rgba(244,238,228,.04) !important; border-color: rgba(244,238,228,.16) !important; }

@media (max-width: 760px) {
  .competitions-page,
  .worlds-page,
  .profile-page,
  .profile-settings-page { width: min(100% - 24px, 640px); padding-top: 22px; }
  .competitions-page .competitions-hero,
  .worlds-page .worlds-intro { grid-template-columns: 1fr !important; padding: 28px 22px !important; }
  .competitions-page .competitions-hero h1 { font-size: clamp(44px, 13vw, 70px) !important; }
  .worlds-page .worlds-intro h1 { font-size: clamp(50px, 17vw, 82px) !important; }
  .competitions-page .competition-battle-coach { max-width: 310px; justify-self: end; }
  .competition-grid,
  .worlds-page .worlds-grid { grid-template-columns: 1fr !important; }
  .comp-detail-wrap,
  .competition-submissions { width: min(100% - 24px, 640px); padding-top: 22px !important; }
  .comp-detail-wrap .comp-detail-header { grid-template-columns: 1fr !important; grid-template-areas: "copy" "art" "stats" !important; }
  .comp-detail-wrap .comp-detail-header h1 { font-size: clamp(42px, 13vw, 68px) !important; }
  .comp-detail-wrap .comp-detail-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .create-world-page .create-world-container,
  .join-world-page .join-world-container { width: min(100% - 24px, 640px); }
  .create-world-page .create-world-intro,
  .join-world-page .join-world-intro { padding: 28px 22px !important; }
  .create-world-page .create-world-intro h1,
  .join-world-page .join-world-intro h1 { font-size: clamp(44px, 13vw, 70px); }
  .world-page .world-container { width: calc(100% - 22px); padding-top: 20px; }
  .profile-page .viewed-profile-head { grid-template-columns: 1fr; gap: 12px; padding-inline: 12px; }
  .profile-page .viewed-profile-picture,
  .profile-page .viewed-profile-initials { width: 112px; height: 112px; margin-top: -30px; }
  .profile-page .viewed-profile-details { padding-top: 0; }
  .profile-page .viewed-profile-details h1 { font-size: clamp(40px, 12vw, 64px) !important; }
  .profile-page .viewed-profile-actions { left: 12px; right: 12px; bottom: 12px; }
  .profile-page .viewed-profile-actions :is(a, button) { min-height: 40px; padding-inline: 14px; }
  .profile-page .profile-tab-panel { padding-inline: 0; }
  .profile-page .profile-post-grid,
  .profile-page .profile-video-grid,
  .profile-page .profile-info-grid { grid-template-columns: 1fr !important; }
  .profile-settings-page .settings-layout { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .competitions-page *, .worlds-page *, .world-page *, .profile-page *, .profile-settings-page * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* Counts are stacked and aligned so the labels remain readable at narrow widths. */
.profile-page .viewed-profile-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(94px, 1fr));
  align-items: stretch;
  gap: 0;
  margin-top: 18px;
  padding: 14px 0;
}
.profile-page .viewed-profile-stats span {
  display: flex;
  min-width: 0;
  min-height: 46px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 5px;
  margin: 0;
  padding: 2px 18px;
  border-right: 1px solid var(--mpe-line);
  color: #6a655e;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .09em;
  line-height: 1.25;
  text-transform: uppercase;
}
.profile-page .viewed-profile-stats span:last-child { border-right: 0; }
.profile-page .viewed-profile-stats b {
  display: block;
  color: var(--mpe-teal);
  font-family: var(--mpe-display);
  font-size: clamp(23px, 3vw, 34px);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
  line-height: .95;
}

.profile-page .profile-tab small {
  display: inline-grid;
  min-width: 25px;
  min-height: 21px;
  place-items: center;
  padding: 4px 7px;
  border: 1px solid rgba(16, 73, 92, .2);
  border-radius: 0 !important;
  background: rgba(16, 73, 92, .1);
  color: var(--mpe-teal);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.theme-dark .profile-page .viewed-profile-stats span { color: #c7c0b7 !important; }
.theme-dark .profile-page .viewed-profile-stats b { color: #fff8ed !important; }
.theme-dark .profile-page .profile-tab { color: #c7c0b7 !important; }
.theme-dark .profile-page .profile-tab.active { background: transparent !important; color: #fff8ed !important; }
.theme-dark .profile-page .profile-tab small {
  border-color: rgba(125, 205, 220, .34) !important;
  background: rgba(24, 125, 145, .28) !important;
  color: #fff8ed !important;
}



@media (max-width: 760px) {
.profile-page .profile-ecosystem-grid > .profile-ecosystem-card,
  .profile-page .profile-ecosystem-grid > .profile-empty-state { margin-bottom: 12px; }
  .profile-page .viewed-profile-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 14px;
    padding: 12px 0;
  }
  .profile-page .viewed-profile-stats span {
    align-items: center;
    padding: 2px 7px;
    text-align: center;
  }
  .profile-page .viewed-profile-stats b { font-size: clamp(22px, 7vw, 30px); }
  .profile-page .profile-tab { gap: 6px; padding: 12px 12px; font-size: 12px; }
}
@media (max-width: 500px) {
.profile-page .profile-ecosystem-grid > .profile-ecosystem-card,
  .profile-page .profile-ecosystem-grid > .profile-empty-state { margin-bottom: 10px; }
.profile-page .viewed-profile-stats span { font-size: 9px; letter-spacing: .06em; }
}

