:root {
  --pp-color-blue-50: #eff6ff;
  --pp-color-blue-100: #dbeafe;
  --pp-color-blue-500: #2563eb;
  --pp-color-blue-600: #1d4ed8;
  --pp-color-blue-700: #1e40af;
  --pp-color-slate-50: #f8fafc;
  --pp-color-slate-100: #f1f5f9;
  --pp-color-slate-200: #e2e8f0;
  --pp-color-slate-500: #64748b;
  --pp-color-slate-700: #334155;
  --pp-color-slate-900: #0f172a;
  --pp-color-white: #fff;
  --pp-color-bg-page: var(--pp-color-slate-50);
  --pp-color-bg-surface: var(--pp-color-white);
  --pp-color-bg-subtle: var(--pp-color-slate-100);
  --pp-color-text-primary: var(--pp-color-slate-900);
  --pp-color-text-secondary: var(--pp-color-slate-700);
  --pp-color-text-muted: var(--pp-color-slate-500);
  --pp-color-border: var(--pp-color-slate-200);
  --pp-color-action: var(--pp-color-blue-500);
  --pp-color-action-hover: var(--pp-color-blue-600);
  --pp-radius-sm: .5rem;
  --pp-radius-md: .875rem;
  --pp-radius-lg: 1.5rem;
  --pp-shadow-card: 0 14px 40px rgb(15 23 42 / .08);
  --pp-container-content: 48rem;
  --pp-container-wide: 72rem;
  --pp-container-max: 80rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--pp-color-text-primary); background: var(--pp-color-bg-page); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 1rem; line-height: 1.6; }
a { color: var(--pp-color-blue-700); text-underline-offset: .18em; }
a:hover { color: var(--pp-color-action-hover); }
:focus-visible { outline: 3px solid var(--pp-color-blue-500); outline-offset: 3px; border-radius: .2rem; }
h1, h2, h3 { margin: 0 0 .75rem; line-height: 1.15; letter-spacing: -.025em; }
h1 { max-width: 18ch; font-size: clamp(2.35rem, 7vw, 4.8rem); }
h2 { font-size: clamp(1.6rem, 4vw, 2.35rem); }
h3 { font-size: 1.25rem; }
p { margin: 0 0 1rem; }
img { display: block; max-width: 100%; }
address { font-style: normal; }
.container { width: min(100% - 2rem, var(--pp-container-wide)); margin-inline: auto; }
.content-width { max-width: var(--pp-container-content); }
.skip-link { position: fixed; z-index: 100; top: .75rem; left: .75rem; padding: .75rem 1rem; color: white; background: var(--pp-color-slate-900); transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.site-header { position: relative; z-index: 10; border-bottom: 1px solid var(--pp-color-border); background: rgb(255 255 255 / .96); }
.header-row { display: flex; min-height: 4.75rem; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: inline-flex; align-items: center; gap: .55rem; color: var(--pp-color-slate-900); font-size: 1.15rem; font-weight: 800; text-decoration: none; }
.brand > span { display: grid; width: 2.1rem; height: 2.1rem; place-items: center; border-radius: .7rem; color: white; background: var(--pp-color-blue-600); }
.nav-menu summary { min-height: 44px; padding: .55rem .8rem; cursor: pointer; font-weight: 700; }
.nav-menu nav { position: absolute; top: 4.25rem; right: 1rem; left: 1rem; display: grid; gap: .4rem; padding: 1rem; border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-md); background: white; box-shadow: var(--pp-shadow-card); }
.nav-menu nav a { min-height: 44px; padding: .6rem; font-weight: 650; text-decoration: none; }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: .72rem 1.15rem; border: 2px solid var(--pp-color-action); border-radius: .65rem; color: white; background: var(--pp-color-action); font: inherit; font-weight: 750; line-height: 1.2; text-decoration: none; cursor: pointer; }
.button:hover { border-color: var(--pp-color-action-hover); color: white; background: var(--pp-color-action-hover); }
.button-small { min-height: 42px !important; padding: .5rem .8rem !important; }
.button-secondary { color: var(--pp-color-blue-700); background: transparent; }
.button-secondary:hover { color: white; }
.button-light { border-color: white; color: var(--pp-color-slate-900); background: white; }
.button-light:hover { border-color: var(--pp-color-blue-100); color: var(--pp-color-blue-700); background: var(--pp-color-blue-50); }
.button-full { width: 100%; }
.button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1.5rem; }
.text-link { font-weight: 750; }
.eyebrow, .meta { color: var(--pp-color-blue-700); font-size: .78rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.meta { color: var(--pp-color-text-muted); }
.hero, .page-hero, .profile-hero, .article-header { padding: clamp(3.5rem, 9vw, 7rem) 0; overflow: hidden; background: white; }
.hero { background: radial-gradient(circle at 92% 8%, var(--pp-color-blue-100), transparent 30%), white; }
.hero-grid, .profile-grid { display: grid; align-items: center; gap: 2.5rem; }
.hero-copy { max-width: 60ch; color: var(--pp-color-text-secondary); font-size: clamp(1.08rem, 2.4vw, 1.3rem); }
.hero-card { position: relative; padding: 2rem; overflow: hidden; border: 1px solid var(--pp-color-blue-100); border-radius: var(--pp-radius-lg); background: linear-gradient(145deg, var(--pp-color-slate-900), #172554); box-shadow: var(--pp-shadow-card); color: white; }
.hero-card h2 { font-size: 1.9rem; }
.hero-card .eyebrow { color: #bfdbfe; }
.hero-mark { display: grid; width: 4.5rem; height: 4.5rem; margin-bottom: 3rem; place-items: center; border-radius: 1.3rem; background: var(--pp-color-blue-500); font-size: 2rem; font-weight: 900; }
.check-list { display: grid; gap: .7rem; padding: 0; list-style: none; }
.check-list li::before { content: "✓"; margin-right: .6rem; color: #86efac; font-weight: 900; }
.section { padding: clamp(3.5rem, 8vw, 6.5rem) 0; }
.section-subtle { background: var(--pp-color-bg-subtle); }
.section-heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.card-grid, .editorial-grid { display: grid; gap: 1.25rem; }
.card { overflow: hidden; border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-md); background: white; box-shadow: 0 5px 20px rgb(15 23 42 / .04); }
.card-art { display: grid; min-height: 10rem; place-items: center; color: white; background: #1e3a8a; font-size: 3rem; font-weight: 900; }
.restaurant-art { background: linear-gradient(145deg, #164e63, #0f766e); }
.product-art { background: linear-gradient(145deg, #312e81, #4338ca); }
.card-body { padding: 1.35rem; }
.card h2, .card h3 { font-size: 1.3rem; }
.card h2 a, .card h3 a, .editorial-card h2 a, .editorial-card h3 a { color: var(--pp-color-text-primary); }
.editorial-card { padding: 1.5rem 0; border-top: 3px solid var(--pp-color-slate-900); }
.location { color: var(--pp-color-text-muted); font-weight: 650; }
.empty { padding: 2rem; border: 1px dashed var(--pp-color-slate-500); border-radius: var(--pp-radius-md); color: var(--pp-color-text-secondary); }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 1.5rem; font-size: .9rem; }
.article-header h1 { font-size: clamp(2.2rem, 6vw, 4rem); }
.prose { font-size: 1.08rem; }
.prose > * + * { margin-top: 1.25rem; }
.two-column { display: grid; gap: 2rem; }
.profile-monogram { display: grid; aspect-ratio: 4 / 3; place-items: center; border-radius: var(--pp-radius-lg); color: white; background: linear-gradient(145deg, #164e63, #0f766e); box-shadow: var(--pp-shadow-card); font-size: clamp(5rem, 20vw, 10rem); font-weight: 900; }
.detail-card, .notice { padding: 1.5rem; border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-md); background: white; }
.notice { margin-top: 2rem; border-left: 5px solid var(--pp-color-blue-500); background: var(--pp-color-blue-50); }
.detail-card address + address { margin-top: 1.5rem; }
.detail-card dl { display: grid; grid-template-columns: 1fr 1.5fr; gap: .7rem; }
.detail-card dt { font-weight: 750; }
.detail-card dd { margin: 0; }
.price { font-size: 1.6rem; font-weight: 850; }
.disclosure { max-width: 62ch; margin-top: 1rem; color: var(--pp-color-text-secondary); font-size: .9rem; }
.status-unavailable { padding: .8rem 1rem; border-radius: .6rem; background: var(--pp-color-slate-100); color: var(--pp-color-text-secondary); font-weight: 700; }
.pill-row { display: flex; gap: .65rem; padding-bottom: 1.5rem; overflow-x: auto; }
.pill-row a { flex: 0 0 auto; min-height: 44px; padding: .55rem .9rem; border: 1px solid var(--pp-color-border); border-radius: 99rem; background: white; font-weight: 700; text-decoration: none; }
.search-form label, .auth-card label { display: block; margin: 1rem 0 .35rem; font-weight: 750; }
input { width: 100%; min-height: 48px; padding: .7rem .8rem; border: 1px solid var(--pp-color-slate-500); border-radius: .5rem; color: var(--pp-color-text-primary); background: white; font: inherit; }
select, textarea { width: 100%; padding: .7rem .8rem; border: 1px solid var(--pp-color-slate-500); border-radius: .5rem; color: var(--pp-color-text-primary); background: white; font: inherit; }
.input-row { display: grid; gap: .7rem; }
.search-result { padding: 1.5rem 0; border-bottom: 1px solid var(--pp-color-border); }
.auth-shell { display: grid; min-height: 70vh; padding: 3rem 1rem; place-items: center; background: var(--pp-color-slate-100); }
.auth-card { width: min(100%, 30rem); padding: clamp(1.5rem, 5vw, 2.5rem); border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-lg); background: white; box-shadow: var(--pp-shadow-card); }
.auth-card h1 { font-size: 2.4rem; }
.checkbox { display: flex !important; align-items: center; gap: .7rem; }
.checkbox input { width: 1.25rem; min-height: 1.25rem; }
.alert { padding: 1rem; border-radius: .5rem; }
.alert-error { border: 1px solid #fecaca; color: #991b1b; background: #fef2f2; }
.admin-header { padding: 3rem 0; background: white; }
.admin-header h1 { font-size: 2.5rem; }
.metric-grid { display: grid; gap: 1rem; }
.metric-grid article { display: grid; padding: 1.5rem; border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-md); background: white; }
.metric-grid strong { font-size: 2.5rem; }
.metric-grid span { color: var(--pp-color-text-muted); font-weight: 700; }
.invitation { padding: 3rem 0; color: white; background: var(--pp-color-blue-700); }
.invitation .eyebrow { color: #bfdbfe; }
.invitation-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; }
.site-footer { padding: 4rem 0 1.5rem; color: #cbd5e1; background: var(--pp-color-slate-900); }
.brand-footer, .site-footer h2 { color: white; }
.site-footer h2 { font-size: 1rem; }
.footer-grid { display: grid; gap: 2rem; }
.footer-grid nav { display: grid; align-content: start; gap: .55rem; }
.footer-grid nav a { color: #cbd5e1; }
.footer-bottom { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid #334155; font-size: .9rem; }
.admin-workspace { display: grid; gap: 1.25rem; }
.admin-workspace form, .enrollment-card form { display: grid; gap: .8rem; }
.admin-workspace label, .enrollment-card > form > label:not(.consent-choice) { font-weight: 750; }
.managed-item { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; border-top: 1px solid var(--pp-color-border); }
.reward-summary { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem; background: var(--pp-color-bg-subtle); }
.compact { margin: 0; gap: .65rem; }
.small-url { max-width: 28rem; overflow-wrap: anywhere; font-size: .85rem; }
details > summary { margin: .75rem 0; cursor: pointer; }
.enrollment-shell, .wallet-shell { min-height: 75vh; padding: 2rem 1rem; background: linear-gradient(160deg, var(--pp-color-blue-50), white 55%); }
.enrollment-card { width: min(100%, 34rem); margin: 0 auto; padding: clamp(1.4rem, 5vw, 2.5rem); border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-lg); background: white; box-shadow: var(--pp-shadow-card); }
.enrollment-card h1, .wallet-shell h1 { font-size: clamp(2rem, 8vw, 3.6rem); }
.reward-lede { font-size: 1.15rem; }
.consent-choice { display: grid; grid-template-columns: 1.5rem 1fr; gap: .7rem; padding: 1rem; border: 1px solid var(--pp-color-border); border-radius: .65rem; }
.consent-choice input { width: 1.25rem; min-height: 1.25rem; }
.consent-choice small { display: block; margin-top: .3rem; color: var(--pp-color-text-secondary); font-weight: 400; }
.required-consent { border-color: var(--pp-color-blue-500); background: var(--pp-color-blue-50); }
.privacy-note { margin-top: 1.25rem; color: var(--pp-color-text-muted); font-size: .85rem; }
.wallet-shell { padding-block: 3rem; }
.success-banner, .review-invitation { margin-bottom: 1.5rem; padding: 1.2rem; border-radius: var(--pp-radius-md); background: #ecfdf5; }
.reward-wallet-card { margin: 1.25rem 0; padding: clamp(1.25rem, 5vw, 2rem); border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-lg); background: white; box-shadow: var(--pp-shadow-card); }
.reward-code { margin: 1.5rem 0; padding: 1rem; border: 2px dashed var(--pp-color-blue-500); border-radius: .75rem; background: var(--pp-color-blue-50); font-size: clamp(1.8rem, 9vw, 3rem); font-weight: 900; letter-spacing: .12em; text-align: center; }
.reward-wallet-card dl { display: grid; grid-template-columns: 1fr 2fr; gap: .5rem; }
.reward-wallet-card dt { font-weight: 800; }
.reward-wallet-card dd { margin: 0; }
.review-invitation { margin-top: 2rem; background: var(--pp-color-bg-subtle); }
.crm-metrics { grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); }
.metric-alert { border-color: #f59e0b !important; background: #fffbeb !important; }
.crm-filter { display: grid; gap: .75rem; margin-bottom: 2rem; padding: 1rem; border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-md); background: white; }
.crm-filter label, .crm-detail-grid label, .crm-form-card label { font-weight: 750; }
.table-scroll, .pipeline-board { overflow-x: auto; }
.crm-table { width: 100%; border-collapse: collapse; background: white; }
.crm-table th, .crm-table td { min-width: 8rem; padding: .8rem; border-bottom: 1px solid var(--pp-color-border); text-align: left; vertical-align: top; }
.crm-table small { display: block; color: var(--pp-color-text-muted); }
.tag { display: inline-block; margin-left: .4rem; padding: .1rem .45rem; border-radius: 999px; color: #78350f; background: #fef3c7; font-size: .72rem; font-weight: 800; }
.attention { color: #b45309; font-weight: 850; }
.pipeline-board { display: grid; grid-auto-columns: minmax(14rem, 1fr); grid-auto-flow: column; gap: 1rem; padding-bottom: 1rem; }
.pipeline-column { padding: 1rem; border: 1px solid var(--pp-color-border); border-radius: var(--pp-radius-md); background: white; }
.pipeline-column h3 { display: flex; justify-content: space-between; text-transform: capitalize; }
.pipeline-card { display: grid; gap: .3rem; margin-top: .7rem; padding: .8rem; border: 1px solid var(--pp-color-border); border-radius: .6rem; color: var(--pp-color-text-primary); text-decoration: none; }
.pipeline-card small { color: var(--pp-color-text-muted); }
.empty-compact { color: var(--pp-color-text-muted); }
.crm-form-card { width: min(100%, 48rem); }
.crm-detail-grid { display: grid; gap: 1.25rem; }
.crm-detail-grid form { display: grid; gap: .7rem; }
.opportunity-panel { padding: 1rem 0; border-top: 1px solid var(--pp-color-border); }
.timeline { display: grid; gap: 1rem; padding-left: 1.4rem; }
.timeline li { padding-left: .5rem; border-left: 3px solid var(--pp-color-blue-100); }
.onboarding-list { display: grid; gap: .8rem; padding: 0; list-style: none; }
.onboarding-list li { display: grid; grid-template-columns: 2rem 1fr; gap: .7rem; padding: 1rem; border: 1px solid var(--pp-color-border); border-radius: .7rem; }
.onboarding-list li > span { color: var(--pp-color-blue-600); font-size: 1.5rem; font-weight: 900; }
.milestone-completed { background: #ecfdf5; }

@media (min-width: 48rem) {
  .container { width: min(100% - 3rem, var(--pp-container-wide)); }
  .nav-menu summary { display: none; }
  .nav-menu nav { position: static; display: flex; align-items: center; padding: 0; border: 0; box-shadow: none; }
  .hero-grid, .profile-grid { grid-template-columns: 1.15fr .85fr; }
  .card-grid { grid-template-columns: repeat(3, 1fr); }
  .editorial-grid { grid-template-columns: repeat(3, 1fr); }
  .two-column { grid-template-columns: minmax(0, 1.65fr) minmax(16rem, .7fr); }
  .input-row { grid-template-columns: 1fr auto; }
  .metric-grid { grid-template-columns: repeat(3, 1fr); }
  .metric-grid-wide { grid-template-columns: repeat(6, 1fr); }
  .admin-workspace { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
  .crm-filter { grid-template-columns: 2fr repeat(4, 1fr) auto; align-items: end; }
  .crm-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid { grid-template-columns: 2fr 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
