@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Syne:wght@500;600;700&family=Zen+Kaku+Gothic+New:wght@400;500;700&display=swap');

:root {
  --fresh-bg: #000;
  --fresh-surface: #090909;
  --fresh-surface-2: #111;
  --fresh-line: rgba(255, 255, 255, .14);
  --fresh-line-soft: rgba(255, 255, 255, .075);
  --fresh-text: #f4f4ef;
  --fresh-muted: #9b9b95;
  --fresh-faint: #666661;
  --fresh-accent: #ff6846;
  --fresh-accent-soft: rgba(255, 104, 70, .12);
  --fresh-display: 'Syne', 'Zen Kaku Gothic New', sans-serif;
  --fresh-body: 'Zen Kaku Gothic New', sans-serif;
  --fresh-mono: 'IBM Plex Mono', ui-monospace, monospace;
}

html[data-theme='light'] {
  --fresh-bg: #f4f3ee;
  --fresh-surface: #fff;
  --fresh-surface-2: #e9e8e2;
  --fresh-line: rgba(15, 15, 13, .17);
  --fresh-line-soft: rgba(15, 15, 13, .08);
  --fresh-text: #10100e;
  --fresh-muted: #5f5f59;
  --fresh-faint: #888881;
  --fresh-accent: #d94d2f;
  --fresh-accent-soft: rgba(217, 77, 47, .1);
}

body, button, input, textarea, select { font-family: var(--fresh-body); }
.brand, .public-brand, .studio-brand { font-family: var(--fresh-display); font-weight: 700; letter-spacing: -.035em; }
.brand-mark, .public-brand-mark { width: 20px; height: 20px; gap: 2px; transform: none; }
.brand-mark i, .public-brand-mark i { border-radius: 0; background: currentColor; }
.brand-mark i:first-child, .public-brand-mark i:first-child { color: var(--fresh-accent); }
.theme-toggle { border-radius: 3px !important; box-shadow: none !important; }

/* Auth */
.login-body { min-height: 100svh; color: var(--fresh-text) !important; background: var(--fresh-bg) !important; font-family: var(--fresh-body) !important; }
.login-body::before {
  inset: 0 0 0 52% !important; width: auto !important; height: auto !important; opacity: 1 !important; border-radius: 0 !important;
  background: linear-gradient(90deg, var(--fresh-bg), transparent 22%), linear-gradient(180deg, transparent 60%, rgba(0,0,0,.6)), url('/assets/login/background.jpg') center / cover no-repeat !important;
  filter: saturate(.6) contrast(1.08) !important; transform: none !important;
}
.login-body::after { display: none !important; }
.login-header {
  inset: 0 0 auto !important; width: 100% !important; max-width: none !important; height: 66px !important; margin: 0 !important;
  padding: 0 clamp(18px, 3.5vw, 56px) !important; border: 0 !important; border-bottom: 1px solid var(--fresh-line-soft) !important;
  border-radius: 0 !important; background: color-mix(in srgb, var(--fresh-bg) 92%, transparent) !important; box-shadow: none !important;
}
.login-main { min-height: 100svh !important; display: grid !important; grid-template-columns: 52% 48%; place-items: center start !important; padding: 110px clamp(28px, 7vw, 110px) 60px !important; }
.login-card, html[data-theme='light'] .login-card {
  width: min(100%, 480px) !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  background: transparent !important; box-shadow: none !important; text-align: left !important; animation: auth-enter 420ms cubic-bezier(.2,.75,.2,1) both;
}
.discord-mark { width: 52px !important; height: 52px !important; margin: 0 0 34px !important; border: 1px solid var(--fresh-line) !important; border-radius: 3px !important; background: transparent !important; box-shadow: none !important; }
.login-card h1 { margin: 0 !important; color: var(--fresh-text) !important; font-family: var(--fresh-display) !important; font-size: clamp(3rem, 5vw, 5rem) !important; font-weight: 600 !important; line-height: .95 !important; letter-spacing: -.065em !important; }
.login-card > p:not(.auth-status) { margin: 18px 0 0 !important; color: var(--fresh-muted) !important; text-align: left !important; }
.discord-login-button {
  min-height: 54px !important; justify-content: space-between !important; margin-top: 34px !important; padding: 0 17px !important;
  border: 1px solid var(--fresh-text) !important; border-radius: 3px !important; background: var(--fresh-text) !important; color: var(--fresh-bg) !important;
  box-shadow: none !important; font-size: .78rem !important; font-weight: 700 !important; transition: transform 180ms ease, opacity 180ms ease !important;
}
.discord-login-button:hover { transform: translateY(-2px) !important; box-shadow: none !important; }
.auth-switch { margin-top: 24px !important; color: var(--fresh-muted) !important; text-align: left !important; }
.auth-switch a { color: var(--fresh-text) !important; text-decoration: underline !important; text-underline-offset: 4px; }
.register-form { margin-top: 30px !important; }
.register-field-label, .register-hint { font-family: var(--fresh-mono) !important; }
.register-input-shell, html[data-theme='light'] .register-input-shell { border: 1px solid var(--fresh-line) !important; border-radius: 3px !important; background: transparent !important; box-shadow: none !important; }
.register-input-shell:focus-within, html[data-theme='light'] .register-input-shell:focus-within { border-color: var(--fresh-text) !important; box-shadow: 0 0 0 1px var(--fresh-text) !important; }
.register-prefix, .register-username-input { color: var(--fresh-text) !important; }

/* Dashboard */
.dashboard-page {
  --studio-bg: var(--fresh-bg); --studio-panel: var(--fresh-surface); --studio-panel-solid: var(--fresh-surface);
  --studio-panel-raised: var(--fresh-surface-2); --studio-line: var(--fresh-line-soft); --studio-line-strong: var(--fresh-line);
  --studio-line-highlight: transparent; --studio-text: var(--fresh-text); --studio-muted: var(--fresh-muted); --studio-faint: var(--fresh-faint);
  --studio-accent: var(--fresh-accent); --studio-accent-soft: var(--fresh-accent-soft); --studio-accent-line: color-mix(in srgb, var(--fresh-accent) 58%, transparent);
  --studio-mauve: var(--fresh-accent); color: var(--fresh-text) !important; background: var(--fresh-bg) !important; font-family: var(--fresh-body) !important;
}
.studio-grain { display: none !important; }
.studio-shell { grid-template-columns: 216px minmax(0, 1fr) !important; }
.studio-sidebar { width: 216px !important; border-right: 1px solid var(--fresh-line-soft) !important; background: var(--fresh-bg) !important; box-shadow: none !important; }
.studio-sidebar-head, .studio-sidebar-foot { border-color: var(--fresh-line-soft) !important; }
.studio-nav-link { min-height: 42px !important; margin: 1px 10px !important; padding: 0 11px !important; border: 0 !important; border-radius: 3px !important; color: var(--fresh-muted) !important; background: transparent !important; }
.studio-nav-link:hover { color: var(--fresh-text) !important; background: var(--fresh-surface) !important; }
.studio-nav-link.is-active { color: var(--fresh-text) !important; background: var(--fresh-surface-2) !important; }
.studio-nav-link.is-active::before { background: var(--fresh-accent) !important; }
.studio-workspace { margin-left: 216px !important; background: var(--fresh-bg) !important; }
.studio-topbar { min-height: 66px !important; border-bottom: 1px solid var(--fresh-line-soft) !important; background: color-mix(in srgb, var(--fresh-bg) 94%, transparent) !important; box-shadow: none !important; }
.topbar-title span, .nav-kicker, .nav-kicker-secondary, .editor-card-index, .upgrade-kicker, .subsection-heading span, .metric-grid span { font-family: var(--fresh-mono) !important; }
.topbar-title strong, .studio-intro h1, .editor-card-head h2, .plan-card h2, .empty-state-card h2 { font-family: var(--fresh-display) !important; font-weight: 600 !important; letter-spacing: -.04em !important; }
.studio-main { gap: 20px !important; padding: 28px clamp(18px, 3vw, 42px) 72px !important; }
.studio-intro { margin-bottom: 22px !important; padding-bottom: 22px !important; border-bottom: 1px solid var(--fresh-line-soft) !important; }
.studio-intro h1 { font-size: clamp(2.35rem, 4vw, 4.4rem) !important; line-height: .94 !important; }
.topbar-button, .editor-card, .template-section, .publish-card, .preview-frame, .metric-grid article, .empty-state-card, .plan-card, .account-card, .upgrade-card { border-radius: 3px !important; box-shadow: none !important; }
.topbar-button { border: 1px solid var(--fresh-line) !important; background: transparent !important; }
.topbar-button-primary { border-color: var(--fresh-text) !important; background: var(--fresh-text) !important; color: var(--fresh-bg) !important; }
.editor-card, .template-section, .metric-grid article, .empty-state-card, .plan-card, .account-card { border: 1px solid var(--fresh-line-soft) !important; background: var(--fresh-surface) !important; }
.editor-card-head { border-bottom: 1px solid var(--fresh-line-soft) !important; }
.background-option, .background-upload, .layout-option, .font-option, .effect-option, .social-option, .status-option, .template-card, .discord-identity, .publish-card { border-radius: 2px !important; box-shadow: none !important; }
.background-option.is-selected, .layout-option.is-selected, .font-option.is-selected, .effect-option.is-selected, .social-option.is-selected, .status-option.is-selected, .template-card.is-selected { border-color: var(--fresh-accent) !important; background: var(--fresh-accent-soft) !important; }
.preview-frame { border: 1px solid var(--fresh-line) !important; background: #030303 !important; }
.profile-preview { border-radius: 1px !important; }
.studio-toast, .public-toast { border-radius: 3px !important; box-shadow: none !important; }

/* Public profile — compact, background-first social profile */
.public-page {
  --profile-panel: rgba(5, 5, 7, .46);
  --profile-panel-strong: rgba(4, 4, 6, .68);
  --profile-line: rgba(255, 255, 255, .15);
  color: var(--public-text);
  background: #000;
  font-family: var(--fresh-body) !important;
}
.public-background { transform: scale(1.015); }
.public-grain { opacity: .075 !important; }
.public-wash {
  background:
    linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.34) 54%, rgba(0,0,0,.58)),
    rgba(0,0,0,calc(var(--public-overlay) * .42)) !important;
}
.public-vignette { background: radial-gradient(circle at 50% 45%, transparent 8%, rgba(0,0,0,.14) 50%, rgba(0,0,0,.66) 120%) !important; }
.public-header { min-height: 0 !important; padding: 22px clamp(18px, 3vw, 42px) !important; border: 0 !important; }
.public-brand { color: rgba(255,255,255,.68) !important; font-size: .64rem !important; }
.public-action {
  min-height: 34px !important;
  padding-inline: 13px !important;
  border-color: rgba(255,255,255,.14) !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.34) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: none !important;
}
.public-stage { place-items: center !important; padding: 92px 24px 132px !important; }
.public-core {
  width: min(520px, calc(100vw - 32px)) !important;
  display: grid !important;
  grid-template-columns: 84px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 18px !important;
  row-gap: 0 !important;
  text-align: left !important;
  animation: profile-enter 480ms cubic-bezier(.2,.78,.2,1) both;
}
.public-core.is-loading { transform: translateY(6px) !important; }
.public-avatar-wrap {
  grid-column: 1 !important;
  grid-row: 1 / span 4 !important;
  width: 84px !important;
  margin: 0 !important;
}
.public-avatar-wrap img {
  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 50% !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.26) !important;
}
.public-status-dot { width: 15px !important; height: 15px !important; right: 2px !important; bottom: 3px !important; border: 3px solid rgba(7,7,9,.9) !important; box-shadow: 0 0 0 1px rgba(255,255,255,.1) !important; }
.public-badges {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-height: 0 !important;
  justify-content: flex-start !important;
  margin: 6px 0 0 !important;
}
.public-badges span { min-width: 20px !important; height: 20px !important; border-radius: 6px !important; background: rgba(0,0,0,.38) !important; backdrop-filter: blur(8px) !important; }
.public-core h1 {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  font-family: var(--fresh-display) !important;
  font-size: clamp(2.05rem, 5vw, 2.8rem) !important;
  font-weight: 650 !important;
  line-height: .96 !important;
  letter-spacing: -.055em !important;
  text-shadow: 0 3px 20px rgba(0,0,0,.45) !important;
}
.public-page[data-font='serif'] .public-core h1, .public-page[data-font='round'] .public-core h1, .public-page[data-font='clean'] .public-core h1 { font-family: var(--fresh-display) !important; }
.public-handle {
  grid-column: 2 !important;
  grid-row: 3 !important;
  margin: 6px 0 0 !important;
  color: rgba(255,255,255,.58) !important;
  font-family: var(--fresh-mono) !important;
  font-size: .62rem !important;
  letter-spacing: .04em !important;
}
.public-bio {
  grid-column: 1 / -1 !important;
  grid-row: 5 !important;
  max-width: none !important;
  margin: 18px 0 0 !important;
  color: rgba(255,255,255,.72) !important;
  font-size: .78rem !important;
  line-height: 1.75 !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.5) !important;
}
.public-discord-card {
  grid-column: 1 / -1 !important;
  grid-row: 6 !important;
  grid-template-columns: 40px minmax(0,1fr) auto !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 14px 0 0 !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 11px !important;
  background: rgba(0,0,0,.22) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: none !important;
}
.public-discord-card > img { width: 40px !important; height: 40px !important; border-radius: 50% !important; }
.public-discord-card strong { font-size: .72rem !important; }
.public-discord-card span { font-size: .55rem !important; }
.public-socials {
  grid-column: 1 / -1 !important;
  grid-row: 7 !important;
  justify-content: flex-start !important;
  gap: 9px !important;
  margin: 14px 0 0 !important;
}
.public-socials span {
  width: 22px !important;
  height: 22px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
.public-page[data-layout='card'] .public-core {
  padding: 26px !important;
  border: 1px solid var(--profile-line) !important;
  border-radius: 16px !important;
  background: var(--profile-panel) !important;
  backdrop-filter: blur(18px) saturate(118%) !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.28) !important;
}
.public-page[data-layout='left'] .public-stage { place-items: center start !important; padding-left: clamp(30px, 10vw, 170px) !important; }
.public-page[data-layout='left'] .public-core { align-items: center !important; }
.public-player {
  right: auto !important;
  bottom: 24px !important;
  left: 50% !important;
  width: min(520px, calc(100vw - 32px)) !important;
  min-height: 56px !important;
  padding: 7px 9px !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 14px !important;
  background: rgba(0,0,0,.42) !important;
  backdrop-filter: blur(16px) saturate(120%) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.22) !important;
  transform: translateX(-50%) !important;
}
.player-art { border-radius: 9px !important; }
.public-signature { right: 24px !important; bottom: 24px !important; }

@keyframes auth-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 900px) {
  .editorial-refresh .hero { grid-template-columns: 1fr !important; }
  .editorial-refresh .hero-copy { padding-top: 46px; }
  .editorial-refresh .hero h1 { max-width: 10ch !important; }
  .editorial-refresh .hero-visual { min-height: 520px; }
  .login-body::before { inset: auto 0 0 0 !important; height: 31vh !important; opacity: .38 !important; background: linear-gradient(180deg, var(--fresh-bg), transparent 48%), url('/assets/login/background.jpg') center / cover no-repeat !important; }
  .login-main { display: block !important; padding: 130px 24px 100px !important; }
  .login-card { margin-inline: auto !important; }
  .studio-shell { display: block !important; }
  .studio-workspace { margin-left: 0 !important; }
}

@media (max-width: 620px) {
  .editorial-refresh .site-header, .login-header { padding-inline: 14px !important; }
  .editorial-refresh .hero { padding-top: 104px !important; }
  .editorial-refresh .hero::before { top: 88px; left: 20px; }
  .editorial-refresh .hero h1 { font-size: clamp(3.1rem, 15vw, 5rem) !important; }
  .editorial-refresh .hero-visual { min-height: 420px; }
  .editorial-refresh .hero-visual .profile-primary { right: 12px !important; bottom: 34px !important; width: min(280px, calc(100% - 24px)) !important; }
  .editorial-refresh .bento-grid, .editorial-refresh .showcase-track { gap: 10px !important; border: 0 !important; background: transparent !important; }
  .login-main { padding-inline: 20px !important; }
  .login-card h1 { font-size: 3.2rem !important; }
  .public-header { padding: 14px !important; }
  .public-brand span:last-child { display: none; }
  .public-stage { padding: 82px 16px 116px !important; }
  .public-core { grid-template-columns: 70px minmax(0,1fr) !important; column-gap: 14px !important; }
  .public-avatar-wrap { width: 70px !important; }
  .public-page[data-layout='left'] .public-stage { place-items: center !important; padding-left: 16px !important; }
  .public-page[data-layout='card'] .public-core { padding: 20px !important; }
  .public-core h1 { font-size: clamp(1.9rem, 9vw, 2.45rem) !important; }
  .public-discord-card { grid-template-columns: 36px minmax(0,1fr) auto !important; padding: 9px 10px !important; }
  .public-discord-card > img { width: 36px !important; height: 36px !important; }
  .public-socials span { width: 22px !important; height: 22px !important; }
  .public-player { grid-template-columns: 40px minmax(0,1fr) auto !important; bottom: 14px !important; }
  .public-player .player-time { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .login-card, .editorial-refresh .button, .editorial-refresh .handle-row button,
  .studio-nav-link, .topbar-button, .workspace-panel, .public-core { animation: none !important; transition: none !important; }
}

@keyframes profile-enter {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Home: minimal, centered identities; scoped to the landing page. */
html.editorial-refresh {
  --fresh-bg: #0e0e10; --fresh-surface: #17171b; --fresh-surface-2: #202025;
  --fresh-text: #f4f3f6; --fresh-muted: #b4afb0; --fresh-faint: #999295;
  --fresh-line: rgba(244,240,235,.17); --fresh-line-soft: rgba(244,240,235,.09);
  --fresh-accent: #b8acf0; --fresh-accent-soft: rgba(184,172,240,.1);
  --fresh-display: 'Manrope', 'Zen Kaku Gothic New', 'Yu Gothic', sans-serif;
  --fresh-body: 'Manrope', 'Zen Kaku Gothic New', 'Yu Gothic', sans-serif;
  --fresh-mono: 'Manrope', 'Zen Kaku Gothic New', sans-serif;
  --bg: var(--fresh-bg); --bg-soft: var(--fresh-bg); --surface: var(--fresh-surface);
  --surface-solid: var(--fresh-surface); --surface-2: var(--fresh-surface-2);
  --text: var(--fresh-text); --muted: var(--fresh-muted); --faint: var(--fresh-faint);
  --accent: var(--fresh-accent); --accent-soft: var(--fresh-accent-soft);
  --line: var(--fresh-line-soft); --line-strong: var(--fresh-line); --lime: var(--fresh-accent);
  color-scheme: dark;
}
html[data-theme='light'].editorial-refresh {
  --fresh-bg: #f5f4f7; --fresh-surface: #fff; --fresh-surface-2: #e9e7ef;
  --fresh-text: #292529; --fresh-muted: #645d62; --fresh-faint: #72676e;
  --fresh-line: rgba(41,37,41,.2); --fresh-line-soft: rgba(41,37,41,.1);
  --fresh-accent: #6954aa; --fresh-accent-soft: rgba(105,84,170,.1); color-scheme: light;
}
html.editorial-refresh body { background: var(--fresh-bg) !important; color: var(--fresh-text) !important; font-family: var(--fresh-body) !important; -webkit-font-smoothing: antialiased; }
html.editorial-refresh :is(button,input,textarea,select) { font-family: var(--fresh-body); }
html.editorial-refresh :is(h1,h2,h3) { font-family: var(--fresh-display) !important; text-wrap: balance; }
html.editorial-refresh :is(a,button,input):focus-visible { outline: 2px solid var(--fresh-accent); outline-offset: 5px; }
html.editorial-refresh .section-shell { width: min(calc(100% - 80px), 1200px); }
html.editorial-refresh .site-header {
  inset: 0 0 auto !important; width: 100%; max-width: none; height: 76px; margin: 0 !important;
  padding: 0 max(40px, calc((100% - 1200px)/2)); border: 0 !important; border-bottom: 0 !important;
  border-radius: 0 !important; background: var(--fresh-bg) !important; backdrop-filter: none !important; box-shadow: none !important;
}
html.editorial-refresh .brand { font-family: 'Manrope',sans-serif; font-size: 1rem; font-weight: 800; letter-spacing: -.025em; }
html.editorial-refresh .brand-mark { width: 20px; height: 22px; transform: none; }
html.editorial-refresh .brand-mark i { border-radius: 2px !important; background: var(--fresh-text) !important; }
html.editorial-refresh .brand-mark i:first-child { background: var(--fresh-accent) !important; }
html.editorial-refresh .desktop-nav { display: flex; background: transparent !important; border: 0 !important; gap: 32px; }
html.editorial-refresh :is(.desktop-nav a,.login-link) { color: var(--fresh-muted) !important; font-size: .8rem; font-weight: 500; }
html.editorial-refresh :is(.desktop-nav a,.login-link):hover { color: var(--fresh-text) !important; }
html.editorial-refresh .theme-toggle { border-radius: 8px !important; border-color: var(--fresh-line) !important; }
html.editorial-refresh .button, html.editorial-refresh .handle-row button {
  border: 1px solid var(--fresh-line) !important; border-radius: 10px !important; box-shadow: none !important;
  min-height: 50px; font-size: .86rem; font-weight: 700; transition: transform 220ms cubic-bezier(.2,.75,.2,1), background-color 220ms ease !important;
}
html.editorial-refresh .button-primary, html.editorial-refresh .handle-row button { color: #15131c !important; background: #cec5f4 !important; border-color: #cec5f4 !important; }
html.editorial-refresh .button-primary:hover, html.editorial-refresh .handle-row button:hover { background: #e1daf9 !important; transform: translateY(-2px); }
html.editorial-refresh .button-small { min-height: 40px; font-size: .76rem; padding-inline: 17px; }
html.editorial-refresh .editorial-section { position: relative; padding-block: clamp(72px, 8vw, 112px) !important; border-top: 0; scroll-margin-top: 76px; }
html.editorial-refresh .editorial-section::before, html.editorial-refresh .editorial-section::after { display: none !important; }
html.editorial-refresh .hero {
  min-height: min(780px,100svh) !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: clamp(32px,5vw,72px) !important; padding-top: 112px !important; padding-bottom: 44px !important;
  align-items: center; background: transparent !important; border: 0; overflow: visible;
}
html.editorial-refresh .hero-copy { max-width: none; text-align: left; padding: 0; }
html.editorial-refresh .hero-eyebrow, html.editorial-refresh .kicker {
  display: inline-flex; color: var(--fresh-accent) !important; font-family: 'Manrope', sans-serif !important;
  font-size: .65rem !important; font-weight: 600; letter-spacing: .16em !important; margin-bottom: 22px;
}
html.editorial-refresh .hero-eyebrow::before { display: none; }
html.editorial-refresh .hero h1 {
  max-width: none !important; margin: 0 !important; color: var(--fresh-text) !important;
  font-size: clamp(2.2rem,3.6vw,3.45rem) !important; font-weight: 700 !important; line-height: 1.55 !important;
  letter-spacing: -.055em !important; text-shadow: none !important; white-space: nowrap;
}
html.editorial-refresh .hero h1 span { color: var(--fresh-text) !important; background: none !important; font: inherit !important; }
html.editorial-refresh .hero-lede { max-width: 33em; margin: 25px 0 0 !important; color: var(--fresh-muted) !important; font-size: .96rem !important; line-height: 2 !important; }
html.editorial-refresh .hero-actions { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 24px; margin-top: 32px !important; }
html.editorial-refresh .hero-text-link { display: inline-flex; align-items: center; gap: 18px; font-size: .82rem; color: var(--fresh-text); border-bottom: 1px solid var(--fresh-line); padding-block: 10px; transition: color 220ms ease; }
html.editorial-refresh .hero-text-link:hover { color: var(--fresh-accent); }
html.editorial-refresh .hero-visual {
  position: relative; width: 100%; min-height: clamp(420px,calc(100svh - 156px),560px) !important;
  margin: 0; transform: none !important; overflow: hidden; isolation: isolate;
  border: 0 !important; border-radius: 16px !important; box-shadow: none !important;
  background: linear-gradient(180deg,rgba(8,8,12,.42),rgba(8,8,12,.67)),url('/assets/showcase/hero-sample-background.jpg') 50% 48% / cover no-repeat !important;
}
html.editorial-refresh .hero-visual::before, html.editorial-refresh .hero-visual::after { display: none !important; }
html.editorial-refresh .hero-preview-vignette { position: absolute; inset: 0; background: radial-gradient(ellipse at center,transparent 10%,rgba(6,6,10,.4)); pointer-events: none; }
html.editorial-refresh .home-profile-preview {
  position: absolute; inset: 50% 24px auto; width: auto; transform: translateY(-50%);
  text-align: center; color: #fff; padding: 0; border: 0; background: none; animation: none;
}
html.editorial-refresh .home-profile-head { display: flex; flex-direction: column; align-items: center; gap: 18px; }
html.editorial-refresh .home-avatar-wrap { width: 96px; height: 96px; }
html.editorial-refresh .home-avatar-wrap img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 0; box-shadow: 0 0 0 5px rgba(255,255,255,.07); }
html.editorial-refresh .home-name-row { display: flex; align-items: center; justify-content: center; gap: 10px; }
html.editorial-refresh .home-name-row h2 { margin: 0; color: #fff !important; font: 700 2.35rem/1.2 'Manrope',sans-serif !important; letter-spacing: -.035em !important; text-shadow: 0 0 18px rgba(255,255,255,.25); }
html.editorial-refresh .sample-badge { color: #d8d0fa; font-size: .9rem; }
html.editorial-refresh .home-profile-name small { display: block; margin-top: 7px; color: #dad6e2; font-size: .75rem; letter-spacing: .035em; }
html.editorial-refresh .home-bio { margin: 20px 0 0; color: #ece9f1; font-size: .85rem; text-shadow: 0 2px 8px rgba(0,0,0,.4); }
html.editorial-refresh .home-socials { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 25px; }
html.editorial-refresh .home-socials span { display: block; width: 26px; height: 26px; border: 0; border-radius: 0; background: none; }
html.editorial-refresh .home-socials img { display: block; width: 26px; height: 26px; filter: brightness(0) invert(1) drop-shadow(0 0 5px rgba(255,255,255,.2)); }
html.editorial-refresh .hero-preview-label { position: absolute; bottom: 22px; left: 0; right: 0; text-align: center; color: #d9d4e1; font: 500 .6rem/1 'Manrope',sans-serif; letter-spacing: .13em; }
html.editorial-refresh .section-heading, html.editorial-refresh .showcase .section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; max-width: none; text-align: left; margin: 0 0 44px !important; }
html.editorial-refresh .section-heading .kicker { margin-bottom: 14px; }
html.editorial-refresh .section-heading h2, html.editorial-refresh .showcase .section-heading h2, html.editorial-refresh .price-copy h2, html.editorial-refresh .final-cta h2 {
  max-width: none !important; margin: 0; color: var(--fresh-text) !important; font-size: clamp(1.85rem,3.1vw,2.75rem) !important;
  font-weight: 700 !important; line-height: 1.55 !important; letter-spacing: -.035em !important;
}
html.editorial-refresh .section-heading p { max-width: 27em; margin: 0 !important; color: var(--fresh-muted) !important; font-size: .9rem; line-height: 2; }
html.editorial-refresh .bento-grid { grid-template-columns: 1fr 1fr; gap: 48px 56px !important; border: 0 !important; background: none !important; }
html.editorial-refresh .bento { min-height: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; overflow: visible; }
html.editorial-refresh .bento::before, html.editorial-refresh .bento::after { display: none !important; }
html.editorial-refresh .bento h3 { margin: 0 0 14px; font-size: clamp(1.3rem,2vw,1.65rem) !important; font-weight: 700 !important; line-height: 1.6; letter-spacing: -.02em !important; }
html.editorial-refresh .bento p { color: var(--fresh-muted) !important; font-size: .87rem; }
html.editorial-refresh .bento-wide { grid-column: 1 / -1; min-height: 0 !important; grid-template-columns: .9fr 1.1fr; gap: 48px; align-items: center; }
html.editorial-refresh .bento:not(.bento-wide) { padding: 32px 0 0 !important; border-top: 1px solid var(--fresh-line-soft) !important; }
html.editorial-refresh .bento:not(.bento-wide) :is(.link-stack,.analytics-mini) { margin-top: 28px !important; }
html.editorial-refresh .theme-preview { height: 300px; border: 0 !important; border-radius: 12px !important; transform: none !important; box-shadow: none !important; overflow: hidden; }
html.editorial-refresh .link-stack > div { padding: 14px 0; border: 0 !important; border-bottom: 1px solid var(--fresh-line-soft) !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; }
html.editorial-refresh .link-stack span { background: none !important; color: var(--fresh-accent) !important; }
html.editorial-refresh .analytics-mini { padding: 0; border: 0 !important; border-radius: 0 !important; background: none !important; }
html.editorial-refresh .analytics-mini path { stroke: var(--fresh-accent) !important; filter: none !important; }
html.editorial-refresh .bento-domain { padding-top: 40px !important; border-top: 1px solid var(--fresh-line-soft) !important; }
html.editorial-refresh .domain-art { height: 180px; background: none !important; border: 0 !important; transform: none !important; }
html.editorial-refresh #features .bento-domain .domain-browser {
  width: 100% !important; padding: 0 !important; background: none !important; color: var(--fresh-text) !important;
  border: 0 !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important;
}
html.editorial-refresh #features .bento-domain .domain-browser > span {
  display: inline-flex; align-items: baseline; min-height: 0; padding: 0 !important;
  background: transparent !important; border: 0 solid transparent !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important;
  color: var(--fresh-muted) !important; font-family: var(--fresh-body);
  font-size: clamp(1.3rem,2.5vw,2rem) !important; line-height: 1.4; letter-spacing: -.025em;
}
html.editorial-refresh .domain-browser .animated-handle { color: var(--fresh-text); }
html.editorial-refresh .domain-browser > div, html.editorial-refresh .domain-glow { display: none; }
html.editorial-refresh .showcase { overflow: visible; background: var(--fresh-bg) !important; }
html.editorial-refresh .marquee-wrap { width: min(calc(100% - 80px),1200px) !important; margin-inline: auto; padding: 0; overflow: visible; }
html.editorial-refresh .showcase-track { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) !important; width: 100%; gap: 24px !important; padding: 0; border: 0 !important; background: transparent !important; animation: none !important; transform: none !important; }
html.editorial-refresh .gallery-example { min-width: 0; }
html.editorial-refresh .gallery-caption { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 16px; font-size: .83rem; font-weight: 600; }
html.editorial-refresh .gallery-caption small { font-size: .62rem; letter-spacing: .1em; font-weight: 500; color: var(--fresh-muted); }
html.editorial-refresh .showcase-card {
  width: 100%; max-width: none; height: 480px !important; position: relative; isolation: isolate;
  border: 0 !important; border-radius: 14px !important; box-shadow: none !important; overflow: hidden;
  color: #fff !important; font-family: var(--fresh-body); transition: transform 300ms cubic-bezier(.2,.75,.2,1) !important;
}
html.editorial-refresh .showcase-card::before, html.editorial-refresh .showcase-card::after { display: none !important; }
html.editorial-refresh .showcase-card .mood-background { z-index: -3; filter: saturate(.6) brightness(.7); }
html.editorial-refresh .showcase-card .mood-wash { z-index: -2; background: linear-gradient(180deg,rgba(8,8,12,.3),rgba(8,8,12,.65)),radial-gradient(ellipse at center,transparent,rgba(8,8,12,.28)); }
html.editorial-refresh .showcase-card .mood-profile {
  position: absolute; inset: 50% 24px auto; padding: 0; transform: translateY(-50%);
  color: #fff !important; text-align: center; border: 0 !important; border-radius: 0 !important;
  background: none !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
html.editorial-refresh .showcase-card .mood-avatar-wrap { width: 80px; height: 80px; margin: 0 auto; float: none; }
html.editorial-refresh .showcase-card .mood-avatar-wrap img { border: 0; border-radius: 50%; box-shadow: 0 0 0 4px rgba(255,255,255,.08); }
html.editorial-refresh .showcase-card .mood-avatar-wrap > span { display: none; }
html.editorial-refresh .showcase-card .mood-identity { margin-top: 21px; display: flex; flex-direction: column; align-items: center; }
html.editorial-refresh .showcase-card .mood-identity h3 {
  order: -1; margin: 0 0 8px; color: #fff !important; font: 700 2.05rem/1.2 'Manrope',sans-serif !important;
  letter-spacing: -.03em !important; text-shadow: 0 0 16px rgba(255,255,255,.2); transform: none;
}
html.editorial-refresh .showcase-card .mood-identity small { color: #ddd9e5 !important; font: 500 .68rem/1.5 var(--fresh-body); letter-spacing: .05em; opacity: 1; }
html.editorial-refresh .showcase-card .mood-identity p { color: #eeeaf4 !important; font: 400 .76rem/1.9 var(--fresh-body); min-height: 0; margin: 18px 0 0; opacity: 1; text-shadow: 0 2px 8px rgba(0,0,0,.5); }
html.editorial-refresh .profile-socials { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 28px; }
html.editorial-refresh .profile-socials span { display: block; width: 25px; height: 25px; background: none; border: 0; padding: 0; }
html.editorial-refresh .profile-socials img { display: block; width: 25px; height: 25px; filter: brightness(0) invert(1) drop-shadow(0 0 5px rgba(255,255,255,.18)); }
html.editorial-refresh .mood-sakura .mood-background { object-position: 44% 18%; }
html.editorial-refresh .mood-noir .mood-background { object-position: 53% 32%; filter: grayscale(1) brightness(.64); }
html.editorial-refresh .mood-noir .mood-profile { top: 53%; }
html.editorial-refresh .mood-veil .mood-background { object-position: 52% 33%; filter: grayscale(1) brightness(.58); }
html.editorial-refresh .mood-veil .mood-avatar-wrap { width: 72px; height: 72px; }
html.editorial-refresh .gallery-description { margin: 16px 0 0; color: var(--fresh-muted); font-size: .75rem; }
html.editorial-refresh .gallery-next { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 35px; padding-top: 24px; border-top: 1px solid var(--fresh-line-soft); }
html.editorial-refresh .gallery-next p { font-size: .72rem; color: var(--fresh-muted); margin: 0; }
html.editorial-refresh .pricing-panel { min-height: 0; grid-template-columns: 1fr .85fr; gap: 64px; padding: 0; background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
html.editorial-refresh #pricing .pricing-panel p { color: var(--fresh-muted) !important; font-size: .9rem; }
html.editorial-refresh .price-card, html.editorial-refresh .pricing .pricing-panel .price-card { max-width: 400px; padding: 8px 0 8px 40px; background: none !important; color: var(--fresh-text) !important; border: 0 !important; border-left: 1px solid var(--fresh-line-soft) !important; border-radius: 0 !important; transform: none; box-shadow: none !important; }
html.editorial-refresh .price-top span { color: var(--fresh-text); background: var(--fresh-accent-soft); border-radius: 4px; }
html.editorial-refresh .pricing .pricing-panel .price-card :is(.price-top small,.price span,.price-note) { color: var(--fresh-muted) !important; opacity: 1; }
html.editorial-refresh .price b { font-family: 'Manrope',sans-serif; font-weight: 600; font-size: 3.3rem; letter-spacing: -.05em; }
html.editorial-refresh .price-card ul { border-color: var(--fresh-line-soft); }
html.editorial-refresh .pricing .pricing-panel .price-card li { color: var(--fresh-text) !important; opacity: 1; line-height: 1.7; }
html.editorial-refresh .price-card li::before { color: var(--fresh-accent); }
html.editorial-refresh #cta { background: transparent !important; }
html.editorial-refresh #cta .cta-inner {
  min-height: 320px; padding: 48px 0 !important; background: none !important;
  color: var(--fresh-text) !important; border: 0 !important;
  border-radius: 0 !important; box-shadow: none !important;
}
html.editorial-refresh #cta .cta-inner p { color: var(--fresh-muted) !important; }
html.editorial-refresh .final-cta p { color: var(--fresh-muted) !important; font-size: .88rem; }
html.editorial-refresh .handle-form { max-width: 670px; margin-top: 30px; border: 1px solid var(--fresh-line) !important; border-radius: 12px !important; background: var(--fresh-surface) !important; box-shadow: none !important; }
html[data-theme='light'].editorial-refresh .handle-form { background: var(--fresh-surface) !important; border-color: var(--fresh-line) !important; }
html[data-theme='light'].editorial-refresh .handle-row input, html[data-theme='light'].editorial-refresh .handle-row .url-prefix { color: var(--fresh-text) !important; }
html.editorial-refresh .handle-row { grid-template-columns: auto minmax(0,1fr) auto; }
html.editorial-refresh .handle-row input, html.editorial-refresh .handle-row .url-prefix { color: var(--fresh-text) !important; font-size: .95rem !important; }
html.editorial-refresh .handle-row button { padding-inline: 18px; min-height: 48px; }
html.editorial-refresh .final-cta .form-message { color: var(--fresh-muted); font-size: .75rem; }
html.editorial-refresh .site-footer { border-top: 1px solid var(--fresh-line-soft) !important; background: transparent !important; }
html.editorial-refresh .site-footer :is(p,small,a:not(.brand)) { color: var(--fresh-muted); }
@media (max-width: 1000px) {
  html.editorial-refresh .site-header { grid-template-columns: 1fr auto; }
  html.editorial-refresh .desktop-nav { display: none; }
  html.editorial-refresh .menu-toggle { display: grid; border-radius: 8px !important; border-color: var(--fresh-line) !important; }
  html.editorial-refresh .mobile-menu { inset: 86px 24px auto; background: var(--fresh-surface); border-radius: 12px; }
  html.editorial-refresh .header-actions > .button { display: none; }
  html.editorial-refresh .hero { grid-template-columns: 1fr 1fr !important; gap: 28px !important; min-height: 720px !important; }
  html.editorial-refresh .hero h1 { font-size: clamp(1.95rem,3.7vw,2.55rem) !important; }
  html.editorial-refresh .hero-visual { min-height: 500px !important; }
  html.editorial-refresh .showcase-track { gap: 16px !important; }
  html.editorial-refresh .gallery-caption small { display: none; }
  html.editorial-refresh .pricing-panel { gap: 36px; }
}
@media (max-width: 800px) {
  html.editorial-refresh .section-shell, html.editorial-refresh .marquee-wrap { width: min(calc(100% - 48px),1200px) !important; }
  html.editorial-refresh .site-header { padding-inline: 24px; }
  html.editorial-refresh .hero { grid-template-columns: 1fr !important; min-height: 0 !important; gap: 36px !important; padding-top: 126px !important; }
  html.editorial-refresh .hero-copy { text-align: left; }
  html.editorial-refresh .hero h1 { font-size: clamp(2rem,5.2vw,2.8rem) !important; }
  html.editorial-refresh .hero-visual { min-height: 460px !important; }
  html.editorial-refresh .section-heading, html.editorial-refresh .showcase .section-heading { display: block; }
  html.editorial-refresh .section-heading p { margin-top: 20px !important; }
  html.editorial-refresh .bento-wide { grid-template-columns: 1fr; }
  html.editorial-refresh .bento-grid { gap: 40px 32px !important; }
  html.editorial-refresh .theme-preview { margin-top: 0; }
  html.editorial-refresh .showcase-track { grid-template-columns: 1fr !important; gap: 36px !important; }
  html.editorial-refresh .gallery-example { width: min(100%,480px); margin-inline: auto; }
  html.editorial-refresh .gallery-caption small { display: block; }
  html.editorial-refresh .showcase-card { height: 460px !important; }
  html.editorial-refresh .pricing-panel { grid-template-columns: 1fr; }
  html.editorial-refresh .pricing .pricing-panel .price-card { max-width: none; justify-self: stretch; padding: 32px 0 0; border-left: 0 !important; border-top: 1px solid var(--fresh-line-soft) !important; }
}
@media (max-width: 520px) {
  html.editorial-refresh .section-shell, html.editorial-refresh .marquee-wrap { width: calc(100% - 40px) !important; }
  html.editorial-refresh .site-header { height: 66px; padding-inline: 20px !important; }
  html.editorial-refresh .login-link { display: none; }
  html.editorial-refresh .theme-toggle { display: grid; width: 36px; height: 36px; }
  html.editorial-refresh .mobile-menu { inset: 76px 20px auto; }
  html.editorial-refresh .hero { padding-top: 108px !important; padding-bottom: 52px !important; gap: 30px !important; }
  html.editorial-refresh .hero-eyebrow { font-size: .59rem !important; margin-bottom: 18px; }
  html.editorial-refresh .hero h1 { font-size: clamp(1.68rem,7.15vw,2.2rem) !important; letter-spacing: -.05em !important; line-height: 1.6 !important; }
  html.editorial-refresh .hero-lede { margin-top: 20px !important; font-size: .82rem !important; }
  html.editorial-refresh .hero-actions { gap: 20px; margin-top: 24px !important; }
  html.editorial-refresh .hero-actions .button { width: auto; min-height: 46px; padding-inline: 18px; font-size: .8rem; }
  html.editorial-refresh .hero-text-link { font-size: .74rem; gap: 12px; }
  html.editorial-refresh .hero-visual { min-height: 390px !important; border-radius: 12px !important; }
  html.editorial-refresh .home-avatar-wrap { width: 80px; height: 80px; }
  html.editorial-refresh .home-name-row h2 { font-size: 2rem !important; }
  html.editorial-refresh .home-bio { font-size: .78rem; }
  html.editorial-refresh .editorial-section { padding-block: 60px !important; scroll-margin-top: 66px; }
  html.editorial-refresh .section-heading h2, html.editorial-refresh .showcase .section-heading h2, html.editorial-refresh .price-copy h2, html.editorial-refresh .final-cta h2 { font-size: clamp(1.7rem,7.3vw,2.15rem) !important; }
  html.editorial-refresh .section-heading p { font-size: .82rem; }
  html.editorial-refresh .bento-grid { grid-template-columns: 1fr; gap: 36px !important; }
  html.editorial-refresh .bento, html.editorial-refresh .bento-wide { grid-column: auto; gap: 24px; }
  html.editorial-refresh .bento:not(.bento-wide) { min-height: 0 !important; }
  html.editorial-refresh .worldview-card .theme-preview { height: 260px; margin-top: 24px !important; }
  html.editorial-refresh .bento-domain .domain-art { height: 120px; }
  html.editorial-refresh .domain-browser { padding: 0; }
  html.editorial-refresh .showcase-card { height: 430px !important; }
  html.editorial-refresh .showcase-card .mood-profile { left: 20px; right: 20px; }
  html.editorial-refresh .showcase-card .mood-identity p { font-size: .74rem; }
  html.editorial-refresh .gallery-next { flex-direction: column; align-items: flex-start; gap: 12px; }
  html.editorial-refresh #cta .cta-inner { min-height: 0; padding: 24px 0 !important; }
  html.editorial-refresh .handle-row { grid-template-columns: auto minmax(0,1fr); }
  html.editorial-refresh .handle-row button { grid-column: 1 / -1; width: 100%; margin-top: 7px; }
  html.editorial-refresh .handle-row input { width: 100%; min-width: 0; }
  html.editorial-refresh .site-footer { gap: 22px; text-align: left; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  html.editorial-refresh { scroll-behavior: auto; }
  html.editorial-refresh *, html.editorial-refresh *::before, html.editorial-refresh *::after { animation: none !important; transition: none !important; }
  html.editorial-refresh .is-tiltable { transform: none !important; }
}

/* Dashboard: editing controls added with the direct-edit flow. */
.dashboard-page .edit-intro {
  padding: 2px 0 16px;
  border-bottom: 1px solid var(--fresh-line-soft);
}
.dashboard-page .edit-intro > span,
.dashboard-page .step-heading > span {
  display: block;
  color: var(--fresh-accent);
  font-family: var(--fresh-mono);
  font-size: .63rem;
  font-weight: 600;
  letter-spacing: .12em;
}
.dashboard-page .edit-intro h1 {
  margin: 9px 0 7px;
  color: var(--fresh-text);
  font-family: var(--fresh-display);
  font-size: clamp(1.25rem, 2.1vw, 1.7rem);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -.035em;
}
.dashboard-page .edit-intro p {
  margin: 0;
  color: var(--fresh-muted);
  font-size: .76rem;
  line-height: 1.8;
}
.dashboard-page .creation-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 2px 0 12px;
}
.dashboard-page .creation-steps button {
  min-width: 0;
  min-height: 46px;
  padding: 10px 9px;
  border: 1px solid var(--fresh-line);
  border-radius: 8px;
  background: var(--fresh-surface);
  color: var(--fresh-muted);
  font-size: .76rem;
  font-weight: 700;
  line-height: 1.35;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease;
}
.dashboard-page .creation-steps button:hover {
  border-color: var(--fresh-muted);
  color: var(--fresh-text);
}
.dashboard-page .creation-steps button.is-active {
  border-color: var(--fresh-accent);
  background: var(--fresh-surface-2);
  color: var(--fresh-text);
  box-shadow: inset 0 -2px var(--fresh-accent);
}
.dashboard-page .step-heading {
  padding: 10px 0 18px;
}
.dashboard-page .step-heading h1 {
  margin: 7px 0 10px;
  color: var(--fresh-text);
  font-family: var(--fresh-display);
  font-size: clamp(1.6rem, 2.8vw, 2.15rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.045em;
}
.dashboard-page .step-heading p {
  margin: 0;
  color: var(--fresh-muted);
  font-size: .8rem;
  line-height: 1.75;
}
.dashboard-page .back-to-preview {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  max-width: 100%;
  margin-top: 16px;
  padding: 9px 15px;
  border: 1px solid var(--fresh-line);
  border-radius: 8px;
  background: var(--fresh-surface);
  color: var(--fresh-text);
  font-size: .73rem;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease;
}
.dashboard-page .back-to-preview:hover {
  border-color: var(--fresh-accent);
  background: var(--fresh-surface-2);
}
.dashboard-page .profile-preview .preview-corner-left { display: none; }
.dashboard-page .preview-background-edit {
  position: absolute;
  z-index: 5;
  top: 12px;
  left: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  max-width: calc(100% - 24px);
  padding: 7px 11px;
  border: 1px solid rgba(255, 255, 255, .32);
  border-radius: 6px;
  background: rgba(9, 9, 10, .82);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  line-height: 1.35;
  cursor: pointer;
  backdrop-filter: blur(8px);
  transition: border-color .18s ease, background-color .18s ease;
}
.dashboard-page .preview-background-edit:hover {
  border-color: rgba(255, 255, 255, .75);
  background: rgba(9, 9, 10, .96);
}
.dashboard-page .preview-background-edit:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.dashboard-page .direct-save-actions {
  display: flex;
  justify-content: flex-end;
  padding: 20px 0 8px;
}
.dashboard-page .direct-save-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  min-height: 48px;
  padding: 11px 20px;
  border: 1px solid var(--fresh-text);
  border-radius: 8px;
  background: var(--fresh-text);
  color: var(--fresh-bg);
  font-size: .77rem;
  font-weight: 700;
  cursor: pointer;
  transition: opacity .18s ease, transform .18s ease;
}
.dashboard-page .direct-save-actions button:hover { opacity: .86; transform: translateY(-1px); }
.dashboard-page .direct-save-actions button:disabled { opacity: .5; cursor: wait; transform: none; }
.dashboard-page .direct-save-actions button span { font-size: 1.05rem; }
.dashboard-page :is(.creation-steps button, .back-to-preview, .direct-save-actions button):focus-visible {
  outline: 2px solid var(--fresh-accent);
  outline-offset: 3px;
}
.dashboard-page .field-block :is(input, textarea, select)::placeholder {
  color: var(--fresh-muted);
  opacity: .9;
}
@media (max-width: 620px) {
  .dashboard-page .edit-intro { padding-bottom: 13px; }
  .dashboard-page .edit-intro p { font-size: .71rem; }
  .dashboard-page .creation-steps { gap: 6px; margin-bottom: 8px; }
  .dashboard-page .creation-steps button { min-height: 48px; padding-inline: 4px; font-size: .69rem; }
  .dashboard-page .step-heading { padding-block: 8px 12px; }
  .dashboard-page .back-to-preview { width: 100%; }
  .dashboard-page .direct-save-actions button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .dashboard-page :is(.creation-steps button, .back-to-preview, .preview-background-edit, .direct-save-actions button) { transition: none; }
}