/**
 * Charity Platform — Professional Design System
 * Auto-generated: scripts/build-platform-stripe-css.js
 * Palette: Stripe blurple + WorkOS surfaces + Apple squircle controls
 */

/* ═══════════════════════════════════════════════════════════════
   §1  DESIGN TOKENS
   ═══════════════════════════════════════════════════════════════ */

body.page-platform,
body.page-auth,
body.page-partnership-stripe,
body.page-volunteer-stripe,
body.page-donate-stripe {
  /* CP tokens — single source for platform-* layers */
  --cp-accent: var(--site-primary, #635bff);
  --cp-accent-hover: color-mix(in srgb, var(--cp-accent) 86%, #0f172a 14%);
  --cp-accent-active: color-mix(in srgb, var(--cp-accent) 76%, #0f172a 24%);
  --cp-accent-soft: color-mix(in srgb, var(--cp-accent) 12%, transparent);
  --cp-accent-muted: color-mix(in srgb, var(--cp-accent) 7%, transparent);
  --cp-bg: #f6f8fb;
  --cp-bg-elevated: #fafbfc;
  --cp-bg-dark: #070812;
  --cp-bg-dark-mid: #11162c;
  --cp-surface: rgba(255, 255, 255, 0.72);
  --cp-surface-solid: #ffffff;
  --cp-surface-hover: #f8fafc;
  --cp-border: rgba(15, 23, 42, 0.08);
  --cp-border-strong: rgba(15, 23, 42, 0.14);
  --cp-text: #0f172a;
  --cp-text-secondary: #334155;
  --cp-muted: #64748b;
  --cp-muted-light: #94a3b8;
  --cp-radius-card: 26px;
  --cp-radius-card-lg: 30px;
  --cp-radius-control: 14px;
  --cp-radius-control-sm: 12px;
  --cp-radius-icon: 18px;
  --cp-radius-avatar: 24px;
  --cp-radius-pill: 999px;
  --cp-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --cp-shadow-card: 0 1px 3px rgba(15, 23, 42, 0.06), 0 12px 32px rgba(15, 23, 42, 0.06);
  --cp-shadow-hover: 0 16px 44px color-mix(in srgb, var(--cp-accent) 14%, transparent), 0 6px 18px rgba(15, 23, 42, 0.07);
  --cp-shadow-glass: 0 8px 32px rgba(15, 23, 42, 0.08);
  --cp-shadow-floating: 0 24px 70px rgba(15, 23, 42, 0.16);
  --cp-highlight-inset: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  --cp-glass-blur: saturate(180%) blur(20px);
  --cp-focus: 0 0 0 4px color-mix(in srgb, var(--cp-accent) 28%, transparent);
  --cp-focus-error: 0 0 0 4px rgba(223, 28, 65, 0.22);
  --cp-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --cp-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --cp-duration: 0.28s;
  --cp-duration-fast: 0.14s;

  /* Backward-compatible Stripe aliases */
  --sp-blurple: var(--cp-accent);
  --sp-blurple-hover: var(--cp-accent-hover);
  --sp-blurple-active: var(--cp-accent-active);
  --sp-blurple-soft: var(--cp-accent-soft);
  --sp-blurple-muted: var(--cp-accent-muted);
  --sp-navy: var(--cp-text);
  --sp-navy-soft: var(--cp-text-secondary);
  --sp-text: var(--cp-text-secondary);
  --sp-text-secondary: var(--cp-text-secondary);
  --sp-muted: var(--cp-muted);
  --sp-muted-light: var(--cp-muted-light);
  --sp-border: var(--cp-border);
  --sp-border-strong: var(--cp-border-strong);
  --sp-bg: var(--cp-bg);
  --sp-bg-elevated: var(--cp-bg-elevated);
  --sp-surface: var(--cp-surface-solid);
  --sp-surface-hover: var(--cp-surface-hover);
  --sp-radius-ios: var(--cp-radius-card-lg);
  --sp-radius: var(--cp-radius-card);
  --sp-radius-lg: var(--cp-radius-card-lg);
  --sp-radius-md: var(--cp-radius-card);
  --sp-radius-sm: var(--cp-radius-control);
  --sp-radius-xs: var(--cp-radius-control-sm);
  --sp-radius-pill: var(--cp-radius-pill);
  --sp-radius-control: var(--cp-radius-control);
  --sp-radius-card: var(--cp-radius-card);
  --sp-radius-modal: var(--cp-radius-card-lg);
  --sp-radius-chip: var(--cp-radius-pill);
  --sp-shadow-xs: var(--cp-shadow-xs);
  --sp-shadow-sm: var(--cp-shadow-xs);
  --sp-shadow-md: var(--cp-shadow-card);
  --sp-shadow-lg: var(--cp-shadow-hover);
  --sp-shadow-xl: var(--cp-shadow-floating);
  --sp-shadow-blur: 0 8px 32px color-mix(in srgb, var(--cp-accent) 22%, transparent);
  --sp-shadow-inset: var(--cp-highlight-inset);
  --sp-focus: var(--cp-focus);
  --sp-focus-error: var(--cp-focus-error);
  --sp-ease: var(--cp-ease);
  --sp-ease-spring: var(--cp-ease-spring);
  --sp-duration: var(--cp-duration);
  --sp-duration-fast: var(--cp-duration-fast);

  /* Typography */
  --sp-font: Inter, -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', Roboto, sans-serif;
  --sp-font-display: Inter, -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  --sp-tracking-tight: -0.03em;
  --sp-tracking-normal: -0.011em;

  /* Control heights — iOS HIG */
  --sp-control-h: 50px;
  --sp-control-h-sm: 40px;
  --sp-control-h-lg: 56px;
  --sp-touch-min: 44px;
}



/* ═══════════════════════════════════════════════════════════════
   §2  GLOBAL BASE
   ═══════════════════════════════════════════════════════════════ */

body.page-platform {
  font-family: var(--sp-font);
  background: var(--sp-bg);
  color: var(--sp-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: 'kern' 1, 'liga' 1;
  letter-spacing: var(--sp-tracking-normal);
}

body.page-platform .main-content {
  background: var(--sp-bg);
  min-height: calc(100vh - var(--topbar-height, 64px));
}

body.page-platform ::selection {
  background: color-mix(in srgb, var(--cp-accent) 22%, transparent);
  color: var(--sp-navy);
}

body.page-platform h1,
body.page-platform h2,
body.page-platform h3,
body.page-platform h4,
body.page-platform h5,
body.page-platform h6 {
  font-family: var(--sp-font-display);
  color: var(--sp-navy);
  letter-spacing: var(--sp-tracking-tight);
  font-weight: 700;
}

body.page-platform h1 { font-weight: 800; font-size: clamp(1.75rem, 4vw, 2.25rem); line-height: 1.15; }
body.page-platform h2 { font-weight: 800; font-size: clamp(1.35rem, 2.8vw, 1.75rem); line-height: 1.2; }
body.page-platform h3 { font-weight: 700; font-size: 1.125rem; line-height: 1.3; }
body.page-platform p { line-height: 1.6; color: var(--sp-text-secondary); }

body.page-platform a:not(.btn):not(.topbar-link):not(.footer-section a):not(.news-card-link):not(.event-card a) {
  color: var(--sp-blurple);
  text-decoration: none;
  transition: color var(--sp-duration-fast) var(--sp-ease);
}

body.page-platform a:not(.btn):hover {
  color: var(--sp-blurple-hover);
}

body.page-platform img {
  max-width: 100%;
  height: auto;
}

body.page-platform .section {
  padding: 1.75rem 0;
}

body.page-platform .section-title {
  background: none !important;
  -webkit-text-fill-color: var(--sp-navy) !important;
  color: var(--sp-navy) !important;
  font-weight: 800;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  letter-spacing: var(--sp-tracking-tight);
  margin-bottom: 0.65rem;
}

body.page-platform .section-subtitle {
  color: var(--sp-muted);
  font-size: 0.9375rem;
  margin-bottom: 1.15rem;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

body.page-platform .container,
body.page-platform .container-narrow,
body.page-platform .container-fluid {
  padding-left: max(1rem, env(safe-area-inset-left));
  padding-right: max(1rem, env(safe-area-inset-right));
}



/* ═══════════════════════════════════════════════════════════════
   §3  iOS RADIUS — GLOBAL INTERACTIVE SURFACES (60px)
   ═══════════════════════════════════════════════════════════════ */

body.page-platform .btn,
body.page-platform button.btn,
body.page-platform a.btn,
body.page-auth .btn,
body.page-auth .auth-submit-btn,
body.page-auth .auth-idp-btn {
  border-radius: var(--sp-radius-control) !important;
  min-height: var(--sp-touch-min);
  padding-left: 1.35rem;
  padding-right: 1.35rem;
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: -0.01em;
  transition:
    background var(--sp-duration) var(--sp-ease),
    border-color var(--sp-duration) var(--sp-ease),
    box-shadow var(--sp-duration) var(--sp-ease),
    transform var(--sp-duration-fast) var(--sp-ease),
    opacity var(--sp-duration-fast) var(--sp-ease);
  -webkit-tap-highlight-color: transparent;
}

body.page-platform .btn-sm,
body.page-auth .btn-sm {
  min-height: var(--sp-control-h-sm);
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 0.8125rem;
  border-radius: var(--sp-radius-pill) !important;
}

body.page-platform .btn-lg {
  min-height: var(--sp-control-h-lg);
  padding-left: 1.65rem;
  padding-right: 1.65rem;
  font-size: 1rem;
  border-radius: var(--sp-radius-pill) !important;
}

body.page-platform .btn:active:not(:disabled),
body.page-auth .btn:active:not(:disabled) {
  transform: scale(0.98);
}

body.page-platform .form-input,
body.page-platform .form-select,
body.page-platform .form-textarea,
body.page-platform .stripe-field-input,
body.page-auth .auth-field-input {
  border-radius: var(--sp-radius-control) !important;
  min-height: var(--sp-control-h);
  padding: 0.75rem 1.25rem;
  border: 1.5px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs), var(--sp-shadow-inset);
  font-size: 1rem;
  color: var(--sp-text);
  transition: border-color var(--sp-duration) var(--sp-ease), box-shadow var(--sp-duration) var(--sp-ease);
}

body.page-platform .form-textarea {
  min-height: 120px;
  border-radius: var(--sp-radius-md) !important;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

body.page-platform .form-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='%23697386'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1.25rem center;
  padding-right: 2.75rem;
}

body.page-platform .card,
body.page-platform .dashboard-card,
body.page-auth .auth-card {
  border-radius: var(--sp-radius-card) !important;
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-sm);
  overflow: hidden;
}

body.page-platform .badge,
body.page-platform .news-card-cat,
body.page-platform .event-card-cat,
body.page-platform .page-hero-kicker,
body.page-platform .home-eyebrow {
  border-radius: var(--sp-radius-chip) !important;
}

body.page-platform .topbar-search-input {
  border-radius: var(--sp-radius-pill) !important;
  min-height: 36px;
  height: 36px;
  padding: 0 2.5rem 0 1.15rem;
}

body.page-platform .topbar-link {
  border-radius: var(--sp-radius-pill) !important;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
}

body.page-platform .topbar-mobile-toggle {
  border-radius: var(--sp-radius-sm) !important;
}

body.page-platform .topbar-logo-img {
  border-radius: var(--sp-radius-sm) !important;
}



/* ═══════════════════════════════════════════════════════════════
   §4  BUTTON SYSTEM
   ═══════════════════════════════════════════════════════════════ */

body.page-platform .btn-primary,
body.page-auth .btn-primary,
body.page-auth .auth-submit-btn {
  background: var(--sp-blurple);
  border: none;
  color: #fff;
  box-shadow: var(--sp-shadow-sm), 0 2px 8px color-mix(in srgb, var(--cp-accent) 28%, transparent);
}

body.page-platform .btn-primary:hover:not(:disabled),
body.page-auth .btn-primary:hover:not(:disabled),
body.page-auth .auth-submit-btn:hover:not(:disabled) {
  background: var(--sp-blurple-hover);
  box-shadow: var(--sp-shadow-md), 0 4px 16px color-mix(in srgb, var(--cp-accent) 32%, transparent);
}

body.page-platform .btn-primary:active:not(:disabled) {
  background: var(--sp-blurple-active);
}

body.page-platform .btn-primary:disabled,
body.page-platform .btn:disabled {
  opacity: 0.48;
  cursor: not-allowed;
  transform: none !important;
}

body.page-platform .btn-secondary {
  background: var(--sp-surface);
  border: 1.5px solid var(--sp-border);
  color: var(--sp-navy);
  box-shadow: var(--sp-shadow-xs);
}

body.page-platform .btn-secondary:hover:not(:disabled) {
  background: var(--sp-bg);
  border-color: var(--sp-border-strong);
}

body.page-platform .btn-outline {
  background: transparent;
  border: 1.5px solid var(--sp-border-strong);
  color: var(--sp-navy);
}

body.page-platform .btn-outline:hover:not(:disabled) {
  background: var(--sp-surface);
  border-color: var(--sp-blurple);
  color: var(--sp-blurple);
}

body.page-platform .project-hero-actions .btn-outline {
  border-color: rgba(255, 255, 255, 0.45);
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(8px);
}

body.page-platform .project-hero-actions .btn-outline:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.65);
  color: #fff;
}

body.page-platform .btn-text {
  background: transparent;
  border: none;
  color: var(--sp-blurple);
  box-shadow: none;
  min-height: auto;
}

body.page-auth .auth-idp-btn {
  border-radius: var(--sp-radius-control) !important;
  border: 1.5px solid var(--sp-border);
  background: var(--sp-surface);
  min-height: var(--sp-control-h-lg);
  box-shadow: var(--sp-shadow-xs);
}

body.page-auth .auth-idp-btn:hover {
  border-color: var(--sp-border-strong);
  box-shadow: var(--sp-shadow-sm);
  transform: translateY(-1px);
}

body.page-auth .auth-idp-btn--vk {
  border-color: rgba(0, 119, 255, 0.25);
  background: rgba(0, 119, 255, 0.04);
}



/* ═══════════════════════════════════════════════════════════════
   §5  TOPBAR & NAVIGATION
   ═══════════════════════════════════════════════════════════════ */

body.page-platform .topbar {
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid rgba(230, 235, 241, 0.85);
  box-shadow: var(--sp-shadow-xs);
}

body.page-platform .topbar.topbar-scrolled {
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--sp-shadow-sm);
}

body.page-platform .topbar-brand-name {
  color: var(--sp-navy);
  font-weight: 700;
  letter-spacing: -0.02em;
}

body.page-platform .topbar-nav {
  flex: 1 1 auto;
  min-width: 0;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 4px;
}

body.page-platform .topbar-link {
  color: var(--sp-muted);
  font-weight: 500;
  font-size: 0.8125rem;
  padding: 0.4rem 0.85rem;
  white-space: nowrap;
}

body.page-platform .topbar-link:hover:not(.active) {
  color: var(--sp-navy);
  background: var(--sp-blurple-muted);
}

body.page-platform .topbar-link.active {
  background: var(--sp-blurple-soft);
  color: var(--sp-blurple);
  font-weight: 600;
}

body.page-platform .topbar-actions {
  gap: 6px;
  flex-shrink: 0;
}

body.page-platform .topbar-actions .btn {
  min-height: 36px;
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
}

body.page-platform .topbar-menu {
  border-radius: 0 0 var(--sp-radius-md) var(--sp-radius-md);
  border: 1px solid var(--sp-border);
  box-shadow: var(--sp-shadow-lg);
}

body.page-platform .topbar-menu-section-label {
  color: var(--sp-muted);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

body.page-platform .topbar-menu .topbar-link {
  border-radius: var(--sp-radius-sm) !important;
  width: 100%;
}

body.page-platform .notif-bell-btn {
  border: 1.5px solid var(--sp-border);
  background: var(--sp-surface);
  border-radius: var(--sp-radius-pill) !important;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--sp-duration-fast) var(--sp-ease);
}

body.page-platform .notif-bell-btn:hover {
  border-color: var(--sp-blurple);
  background: var(--sp-blurple-soft);
}

body.page-platform .notif-dropdown {
  border: 1px solid var(--sp-border);
  border-radius: var(--sp-radius-md) !important;
  box-shadow: var(--sp-shadow-lg);
  overflow: hidden;
}

body.page-platform .notif-header {
  background: var(--sp-bg-elevated);
  border-bottom: 1px solid var(--sp-border);
}

body.page-platform .topbar-search-input:focus {
  border-color: var(--sp-blurple);
  box-shadow: var(--sp-focus);
  width: 190px;
}

@media (max-width: 1280px) {
  body.page-platform .topbar-link { padding: 0.35rem 0.6rem; font-size: 0.78rem; }
}
@media (max-width: 1080px) {
  body.page-platform .topbar-search { display: none; }
}



/* ═══════════════════════════════════════════════════════════════
   §6  COMPONENT LIBRARY — iOS 60px SURFACES
   ═══════════════════════════════════════════════════════════════ */


/* ─ btn ─ */
body.page-platform .btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn {
  /* state: default */
}
body.page-platform .btn:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn:active {
  /* state: :active */
}

/* ─ btn-primary ─ */
body.page-platform .btn-primary {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn-primary {
  /* state: default */
}
body.page-platform .btn-primary:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn-primary:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn-primary:active {
  /* state: :active */
}

/* ─ btn-secondary ─ */
body.page-platform .btn-secondary {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn-secondary {
  /* state: default */
}
body.page-platform .btn-secondary:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn-secondary:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn-secondary:active {
  /* state: :active */
}

/* ─ btn-outline ─ */
body.page-platform .btn-outline {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn-outline {
  /* state: default */
}
body.page-platform .btn-outline:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn-outline:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn-outline:active {
  /* state: :active */
}

/* ─ btn-text ─ */
body.page-platform .btn-text {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn-text {
  /* state: default */
}
body.page-platform .btn-text:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn-text:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn-text:active {
  /* state: :active */
}

/* ─ btn-sm ─ */
body.page-platform .btn-sm {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn-sm {
  /* state: default */
}
body.page-platform .btn-sm:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn-sm:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn-sm:active {
  /* state: :active */
}

/* ─ btn-lg ─ */
body.page-platform .btn-lg {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn-lg {
  /* state: default */
}
body.page-platform .btn-lg:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn-lg:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn-lg:active {
  /* state: :active */
}

/* ─ btn-icon ─ */
body.page-platform .btn-icon {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .btn-icon {
  /* state: default */
}
body.page-platform .btn-icon:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .btn-icon:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .btn-icon:active {
  /* state: :active */
}

/* ─ auth-submit-btn ─ */
body.page-platform .auth-submit-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ auth-idp-btn ─ */
body.page-platform .auth-idp-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ news-pagination-btn ─ */
body.page-platform .news-pagination-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ tab-button ─ */
body.page-platform .tab-button {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ form-input ─ */
body.page-platform .form-input {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ form-select ─ */
body.page-platform .form-select {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ form-textarea ─ */
body.page-platform .form-textarea {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ auth-field-input ─ */
body.page-platform .auth-field-input {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ stripe-field-input ─ */
body.page-platform .stripe-field-input {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ topbar-search-input ─ */
body.page-platform .topbar-search-input {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ topbar-link ─ */
body.page-platform .topbar-link {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .topbar-link {
  /* state: default */
}
body.page-platform .topbar-link:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .topbar-link:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .topbar-link:active {
  /* state: :active */
}

/* ─ topbar-mobile-toggle ─ */
body.page-platform .topbar-mobile-toggle {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ topbar-btn-icon ─ */
body.page-platform .topbar-btn-icon {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ card ─ */
body.page-platform .card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .card {
  /* state: default */
}
body.page-platform .card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .card:active {
  /* state: :active */
}

/* ─ dashboard-card ─ */
body.page-platform .dashboard-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .dashboard-card {
  /* state: default */
}
body.page-platform .dashboard-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .dashboard-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .dashboard-card:active {
  /* state: :active */
}

/* ─ contacts-form-card ─ */
body.page-platform .contacts-form-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .contacts-form-card {
  /* state: default */
}
body.page-platform .contacts-form-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .contacts-form-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .contacts-form-card:active {
  /* state: :active */
}

/* ─ contacts-help-card ─ */
body.page-platform .contacts-help-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .contacts-help-card {
  /* state: default */
}
body.page-platform .contacts-help-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .contacts-help-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .contacts-help-card:active {
  /* state: :active */
}

/* ─ benefactor-card--modern ─ */
body.page-platform .benefactor-card--modern {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .benefactor-card--modern {
  /* state: default */
}
body.page-platform .benefactor-card--modern:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .benefactor-card--modern:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .benefactor-card--modern:active {
  /* state: :active */
}

/* ─ home-dir-card__inner ─ */
body.page-platform .home-dir-card__inner {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .home-dir-card__inner {
  /* state: default */
}
body.page-platform .home-dir-card__inner:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .home-dir-card__inner:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .home-dir-card__inner:active {
  /* state: :active */
}

/* ─ stat-card ─ */
body.page-platform .stat-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .stat-card {
  /* state: default */
}
body.page-platform .stat-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .stat-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .stat-card:active {
  /* state: :active */
}

/* ─ event-card ─ */
body.page-platform .event-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .event-card {
  /* state: default */
}
body.page-platform .event-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .event-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .event-card:active {
  /* state: :active */
}

/* ─ news-card ─ */
body.page-platform .news-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .news-card {
  /* state: default */
}
body.page-platform .news-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .news-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .news-card:active {
  /* state: :active */
}

/* ─ news-card-featured-link ─ */
body.page-platform .news-card-featured-link {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .news-card-featured-link {
  /* state: default */
}
body.page-platform .news-card-featured-link:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .news-card-featured-link:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .news-card-featured-link:active {
  /* state: :active */
}

/* ─ about-team-card ─ */
body.page-platform .about-team-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .about-team-card {
  /* state: default */
}
body.page-platform .about-team-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .about-team-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .about-team-card:active {
  /* state: :active */
}

/* ─ about-doc-item ─ */
body.page-platform .about-doc-item {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .about-doc-item {
  /* state: default */
}
body.page-platform .about-doc-item:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .about-doc-item:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .about-doc-item:active {
  /* state: :active */
}

/* ─ contacts-info-item ─ */
body.page-platform .contacts-info-item {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .contacts-info-item {
  /* state: default */
}
body.page-platform .contacts-info-item:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .contacts-info-item:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .contacts-info-item:active {
  /* state: :active */
}

/* ─ dashboard-reg-item ─ */
body.page-platform .dashboard-reg-item {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .dashboard-reg-item {
  /* state: default */
}
body.page-platform .dashboard-reg-item:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .dashboard-reg-item:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .dashboard-reg-item:active {
  /* state: :active */
}

/* ─ search-result-item ─ */
body.page-platform .search-result-item {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .search-result-item {
  /* state: default */
}
body.page-platform .search-result-item:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .search-result-item:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .search-result-item:active {
  /* state: :active */
}

/* ─ cookie-banner ─ */
body.page-platform .cookie-banner {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ alert ─ */
body.page-platform .alert {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ badge ─ */
body.page-platform .badge {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ badge-primary ─ */
body.page-platform .badge-primary {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ badge-success ─ */
body.page-platform .badge-success {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ badge-warning ─ */
body.page-platform .badge-warning {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ badge-error ─ */
body.page-platform .badge-error {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ notif-bell-btn ─ */
body.page-platform .notif-bell-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ notif-dropdown ─ */
body.page-platform .notif-dropdown {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ notif-item ─ */
body.page-platform .notif-item {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .notif-item {
  /* state: default */
}
body.page-platform .notif-item:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .notif-item:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .notif-item:active {
  /* state: :active */
}

/* ─ chat-bubble ─ */
body.page-platform .chat-bubble {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ report-category-option ─ */
body.page-platform .report-category-option {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ stripe-modal__panel ─ */
body.page-platform .stripe-modal__panel {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ table-container ─ */
body.page-platform .table-container {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ admin-panel ─ */
body.page-platform .admin-panel {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ setup-card ─ */
body.page-platform .setup-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .setup-card {
  /* state: default */
}
body.page-platform .setup-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .setup-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .setup-card:active {
  /* state: :active */
}

/* ─ auth-card ─ */
body.page-platform .auth-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .auth-card {
  /* state: default */
}
body.page-platform .auth-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .auth-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .auth-card:active {
  /* state: :active */
}

/* ─ reg-wizard-card ─ */
body.page-platform .reg-wizard-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .reg-wizard-card {
  /* state: default */
}
body.page-platform .reg-wizard-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .reg-wizard-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .reg-wizard-card:active {
  /* state: :active */
}

/* ─ onboarding-card ─ */
body.page-platform .onboarding-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .onboarding-card {
  /* state: default */
}
body.page-platform .onboarding-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .onboarding-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .onboarding-card:active {
  /* state: :active */
}

/* ─ page-hero-kicker ─ */
body.page-platform .page-hero-kicker {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ home-eyebrow ─ */
body.page-platform .home-eyebrow {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ news-card-cat ─ */
body.page-platform .news-card-cat {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .news-card-cat {
  /* state: default */
}
body.page-platform .news-card-cat:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .news-card-cat:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .news-card-cat:active {
  /* state: :active */
}

/* ─ event-card-cat ─ */
body.page-platform .event-card-cat {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .event-card-cat {
  /* state: default */
}
body.page-platform .event-card-cat:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .event-card-cat:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .event-card-cat:active {
  /* state: :active */
}

/* ─ event-card-img ─ */
body.page-platform .event-card-img {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .event-card-img {
  /* state: default */
}
body.page-platform .event-card-img:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .event-card-img:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .event-card-img:active {
  /* state: :active */
}

/* ─ contacts-map-frame ─ */
body.page-platform .contacts-map-frame {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ news-filters ─ */
body.page-platform .news-filters {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ events-toolbar ─ */
body.page-platform .events-toolbar {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ events-filters ─ */
body.page-platform .events-filters {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ ai-floater-btn ─ */
body.page-platform .ai-floater-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ public-chat-toggle ─ */
body.page-platform .public-chat-toggle {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ a11y-toggle-btn ─ */
body.page-platform .a11y-toggle-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ a11y-bar__btn ─ */
body.page-platform .a11y-bar__btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ project-hero-dot ─ */
body.page-platform .project-hero-dot {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ topbar-logo-img ─ */
body.page-platform .topbar-logo-img {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ footer-logo-img ─ */
body.page-platform .footer-logo-img {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ dashboard-avatar ─ */
body.page-platform .dashboard-avatar {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ news-skeleton ─ */
body.page-platform .news-skeleton {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ skeleton ─ */
body.page-platform .skeleton {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ skeleton-card ─ */
body.page-platform .skeleton-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .skeleton-card {
  /* state: default */
}
body.page-platform .skeleton-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .skeleton-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .skeleton-card:active {
  /* state: :active */
}

/* ─ form-checkbox ─ */
body.page-platform .form-checkbox {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ reg-pwd-strength ─ */
body.page-platform .reg-pwd-strength {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ stripe-modal__close ─ */
body.page-platform .stripe-modal__close {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ chat-report-btn ─ */
body.page-platform .chat-report-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ chat-avatar ─ */
body.page-platform .chat-avatar {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ event-reg-panel ─ */
body.page-platform .event-reg-panel {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ partner-checkout__panel ─ */
body.page-platform .partner-checkout__panel {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ volunteer-form-card ─ */
body.page-platform .volunteer-form-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .volunteer-form-card {
  /* state: default */
}
body.page-platform .volunteer-form-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .volunteer-form-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .volunteer-form-card:active {
  /* state: :active */
}

/* ─ donate-amount-btn ─ */
body.page-platform .donate-amount-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ search-dropdown-header ─ */
body.page-platform .search-dropdown-header {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ topbar-menu ─ */
body.page-platform .topbar-menu {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ topbar-menu-overlay ─ */
body.page-platform .topbar-menu-overlay {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ home-cta ─ */
body.page-platform .home-cta {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ home-cta-section ─ */
body.page-platform .home-cta-section {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ trusted-section ─ */
body.page-platform .trusted-section {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ home-stats-bar ─ */
body.page-platform .home-stats-bar {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ content-page-hero ─ */
body.page-platform .content-page-hero {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ contacts-hero ─ */
body.page-platform .contacts-hero {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ project-hero ─ */
body.page-platform .project-hero {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ dashboard-hero ─ */
body.page-platform .dashboard-hero {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ news-article-sidebar ─ */
body.page-platform .news-article-sidebar {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ event-detail-sidebar ─ */
body.page-platform .event-detail-sidebar {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ profile-avatar-wrap ─ */
body.page-platform .profile-avatar-wrap {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ admin-users-toolbar ─ */
body.page-platform .admin-users-toolbar {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ admin-pagination ─ */
body.page-platform .admin-pagination {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ modal ─ */
body.page-platform .modal {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ modal-content ─ */
body.page-platform .modal-content {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ family-modal ─ */
body.page-platform .family-modal {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ child-modal ─ */
body.page-platform .child-modal {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ grid .card ─ */
body.page-platform .grid .card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .grid .card {
  /* state: default */
}
body.page-platform .grid .card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .grid .card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .grid .card:active {
  /* state: :active */
}

/* ─ action-card ─ */
body.page-platform .action-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .action-card {
  /* state: default */
}
body.page-platform .action-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .action-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .action-card:active {
  /* state: :active */
}

/* ─ benefactor-card ─ */
body.page-platform .benefactor-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .benefactor-card {
  /* state: default */
}
body.page-platform .benefactor-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .benefactor-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .benefactor-card:active {
  /* state: :active */
}

/* ─ news-card-body ─ */
body.page-platform .news-card-body {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .news-card-body {
  /* state: default */
}
body.page-platform .news-card-body:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .news-card-body:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .news-card-body:active {
  /* state: :active */
}

/* ─ news-card-img ─ */
body.page-platform .news-card-img {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .news-card-img {
  /* state: default */
}
body.page-platform .news-card-img:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .news-card-img:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .news-card-img:active {
  /* state: :active */
}

/* ─ event-map-links ─ */
body.page-platform .event-map-links {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .event-map-links {
  /* state: default */
}
body.page-platform .event-map-links:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .event-map-links:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .event-map-links:active {
  /* state: :active */
}

/* ─ volunteer-hero ─ */
body.page-platform .volunteer-hero {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ reg-progress ─ */
body.page-platform .reg-progress {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ reg-progress__track ─ */
body.page-platform .reg-progress__track {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ auth-divider ─ */
body.page-platform .auth-divider {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ auth-account-found ─ */
body.page-platform .auth-account-found {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ login-step-panel ─ */
body.page-platform .login-step-panel {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ news-comment-form ─ */
body.page-platform .news-comment-form {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ news-comments-guest ─ */
body.page-platform .news-comments-guest {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ public-chat-panel ─ */
body.page-platform .public-chat-panel {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ public-chat-input ─ */
body.page-platform .public-chat-input {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ public-chat-msg ─ */
body.page-platform .public-chat-msg {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ site-settings-card ─ */
body.page-platform .site-settings-card {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}
body.page-platform .site-settings-card {
  /* state: default */
}
body.page-platform .site-settings-card:hover {
  /* state: :hover */
  border-color: var(--sp-border-strong);
}
body.page-platform .site-settings-card:focus-visible {
  /* state: :focus-visible */
  outline: none; box-shadow: var(--sp-focus);
}
body.page-platform .site-settings-card:active {
  /* state: :active */
}

/* ─ ai-gen-btn ─ */
body.page-platform .ai-gen-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ upload-preview ─ */
body.page-platform .upload-preview {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ table ─ */
body.page-platform .table {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ pagination-btn ─ */
body.page-platform .pagination-btn {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ filter-chip ─ */
body.page-platform .filter-chip {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ tag-pill ─ */
body.page-platform .tag-pill {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}

/* ─ status-pill ─ */
body.page-platform .status-pill {
  border-radius: var(--sp-radius-card);
  transition: all var(--sp-duration) var(--sp-ease);
}


/* ═══════════════════════════════════════════════════════════════
   §7  PAGE-SPECIFIC POLISH
   ═══════════════════════════════════════════════════════════════ */


body.page-platform.page-home .main-content,
body.page-home .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-home .card,
body.page-home .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-home .btn,
body.page-home .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-about .main-content,
body.page-about .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-about .card,
body.page-about .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-about .btn,
body.page-about .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-about-sub .main-content,
body.page-about-sub .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-about-sub .card,
body.page-about-sub .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-about-sub .btn,
body.page-about-sub .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-news .main-content,
body.page-news .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-news .card,
body.page-news .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-news .btn,
body.page-news .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-news-article .main-content,
body.page-news-article .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-news-article .card,
body.page-news-article .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-news-article .btn,
body.page-news-article .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-events .main-content,
body.page-events .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-events .card,
body.page-events .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-events .btn,
body.page-events .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-event-detail .main-content,
body.page-event-detail .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-event-detail .card,
body.page-event-detail .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-event-detail .btn,
body.page-event-detail .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-contacts .main-content,
body.page-contacts .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-contacts .card,
body.page-contacts .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-contacts .btn,
body.page-contacts .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-benefactors .main-content,
body.page-benefactors .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-benefactors .card,
body.page-benefactors .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-benefactors .btn,
body.page-benefactors .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-dashboard .main-content,
body.page-dashboard .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-dashboard .card,
body.page-dashboard .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-dashboard .btn,
body.page-dashboard .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-admin .main-content,
body.page-admin .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-admin .card,
body.page-admin .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-admin .btn,
body.page-admin .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-legal .main-content,
body.page-legal .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-legal .card,
body.page-legal .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-legal .btn,
body.page-legal .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-search .main-content,
body.page-search .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-search .card,
body.page-search .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-search .btn,
body.page-search .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-actions .main-content,
body.page-actions .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-actions .card,
body.page-actions .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-actions .btn,
body.page-actions .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-profile .main-content,
body.page-profile .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-profile .card,
body.page-profile .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-profile .btn,
body.page-profile .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-onboarding .main-content,
body.page-onboarding .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-onboarding .card,
body.page-onboarding .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-onboarding .btn,
body.page-onboarding .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-setup .main-content,
body.page-setup .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-setup .card,
body.page-setup .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-setup .btn,
body.page-setup .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-donate-result .main-content,
body.page-donate-result .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-donate-result .card,
body.page-donate-result .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-donate-result .btn,
body.page-donate-result .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-auth .main-content,
body.page-auth .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-auth .card,
body.page-auth .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-auth .btn,
body.page-auth .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-register .main-content,
body.page-register .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-register .card,
body.page-register .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-register .btn,
body.page-register .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-partnership-stripe .main-content,
body.page-partnership-stripe .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-partnership-stripe .card,
body.page-partnership-stripe .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-partnership-stripe .btn,
body.page-partnership-stripe .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-volunteer-stripe .main-content,
body.page-volunteer-stripe .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-volunteer-stripe .card,
body.page-volunteer-stripe .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-volunteer-stripe .btn,
body.page-volunteer-stripe .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-donate-stripe .main-content,
body.page-donate-stripe .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-donate-stripe .card,
body.page-donate-stripe .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-donate-stripe .btn,
body.page-donate-stripe .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-error .main-content,
body.page-error .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-error .card,
body.page-error .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-error .btn,
body.page-error .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-system .main-content,
body.page-system .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-system .card,
body.page-system .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-system .btn,
body.page-system .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-offline .main-content,
body.page-offline .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-offline .card,
body.page-offline .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-offline .btn,
body.page-offline .btn {
  border-radius: var(--sp-radius-control) !important;
}

body.page-platform.page-vk-finish .main-content,
body.page-vk-finish .main-content {
  background: var(--sp-bg);
}
body.page-platform.page-vk-finish .card,
body.page-vk-finish .card {
  border-radius: var(--sp-radius-card) !important;
}
body.page-platform.page-vk-finish .btn,
body.page-vk-finish .btn {
  border-radius: var(--sp-radius-control) !important;
}


/* ═══════════════════════════════════════════════════════════════
   §8  SPACING & LAYOUT UTILITIES
   ═══════════════════════════════════════════════════════════════ */

body.page-platform .sp-mt-0 { margin-top: 0rem; }
body.page-platform .sp-mb-0 { margin-bottom: 0rem; }
body.page-platform .sp-pt-0 { padding-top: 0rem; }
body.page-platform .sp-pb-0 { padding-bottom: 0rem; }
body.page-platform .sp-gap-0 { gap: 0rem; }
body.page-platform .sp-mt-2 { margin-top: 0.125rem; }
body.page-platform .sp-mb-2 { margin-bottom: 0.125rem; }
body.page-platform .sp-pt-2 { padding-top: 0.125rem; }
body.page-platform .sp-pb-2 { padding-bottom: 0.125rem; }
body.page-platform .sp-gap-2 { gap: 0.125rem; }
body.page-platform .sp-mt-4 { margin-top: 0.25rem; }
body.page-platform .sp-mb-4 { margin-bottom: 0.25rem; }
body.page-platform .sp-pt-4 { padding-top: 0.25rem; }
body.page-platform .sp-pb-4 { padding-bottom: 0.25rem; }
body.page-platform .sp-gap-4 { gap: 0.25rem; }
body.page-platform .sp-mt-6 { margin-top: 0.375rem; }
body.page-platform .sp-mb-6 { margin-bottom: 0.375rem; }
body.page-platform .sp-pt-6 { padding-top: 0.375rem; }
body.page-platform .sp-pb-6 { padding-bottom: 0.375rem; }
body.page-platform .sp-gap-6 { gap: 0.375rem; }
body.page-platform .sp-mt-8 { margin-top: 0.5rem; }
body.page-platform .sp-mb-8 { margin-bottom: 0.5rem; }
body.page-platform .sp-pt-8 { padding-top: 0.5rem; }
body.page-platform .sp-pb-8 { padding-bottom: 0.5rem; }
body.page-platform .sp-gap-8 { gap: 0.5rem; }
body.page-platform .sp-mt-10 { margin-top: 0.625rem; }
body.page-platform .sp-mb-10 { margin-bottom: 0.625rem; }
body.page-platform .sp-pt-10 { padding-top: 0.625rem; }
body.page-platform .sp-pb-10 { padding-bottom: 0.625rem; }
body.page-platform .sp-gap-10 { gap: 0.625rem; }
body.page-platform .sp-mt-12 { margin-top: 0.75rem; }
body.page-platform .sp-mb-12 { margin-bottom: 0.75rem; }
body.page-platform .sp-pt-12 { padding-top: 0.75rem; }
body.page-platform .sp-pb-12 { padding-bottom: 0.75rem; }
body.page-platform .sp-gap-12 { gap: 0.75rem; }
body.page-platform .sp-mt-14 { margin-top: 0.875rem; }
body.page-platform .sp-mb-14 { margin-bottom: 0.875rem; }
body.page-platform .sp-pt-14 { padding-top: 0.875rem; }
body.page-platform .sp-pb-14 { padding-bottom: 0.875rem; }
body.page-platform .sp-gap-14 { gap: 0.875rem; }
body.page-platform .sp-mt-16 { margin-top: 1rem; }
body.page-platform .sp-mb-16 { margin-bottom: 1rem; }
body.page-platform .sp-pt-16 { padding-top: 1rem; }
body.page-platform .sp-pb-16 { padding-bottom: 1rem; }
body.page-platform .sp-gap-16 { gap: 1rem; }
body.page-platform .sp-mt-20 { margin-top: 1.25rem; }
body.page-platform .sp-mb-20 { margin-bottom: 1.25rem; }
body.page-platform .sp-pt-20 { padding-top: 1.25rem; }
body.page-platform .sp-pb-20 { padding-bottom: 1.25rem; }
body.page-platform .sp-gap-20 { gap: 1.25rem; }
body.page-platform .sp-mt-24 { margin-top: 1.5rem; }
body.page-platform .sp-mb-24 { margin-bottom: 1.5rem; }
body.page-platform .sp-pt-24 { padding-top: 1.5rem; }
body.page-platform .sp-pb-24 { padding-bottom: 1.5rem; }
body.page-platform .sp-gap-24 { gap: 1.5rem; }
body.page-platform .sp-mt-28 { margin-top: 1.75rem; }
body.page-platform .sp-mb-28 { margin-bottom: 1.75rem; }
body.page-platform .sp-pt-28 { padding-top: 1.75rem; }
body.page-platform .sp-pb-28 { padding-bottom: 1.75rem; }
body.page-platform .sp-gap-28 { gap: 1.75rem; }
body.page-platform .sp-mt-32 { margin-top: 2rem; }
body.page-platform .sp-mb-32 { margin-bottom: 2rem; }
body.page-platform .sp-pt-32 { padding-top: 2rem; }
body.page-platform .sp-pb-32 { padding-bottom: 2rem; }
body.page-platform .sp-gap-32 { gap: 2rem; }
body.page-platform .sp-mt-40 { margin-top: 2.5rem; }
body.page-platform .sp-mb-40 { margin-bottom: 2.5rem; }
body.page-platform .sp-pt-40 { padding-top: 2.5rem; }
body.page-platform .sp-pb-40 { padding-bottom: 2.5rem; }
body.page-platform .sp-gap-40 { gap: 2.5rem; }
body.page-platform .sp-mt-48 { margin-top: 3rem; }
body.page-platform .sp-mb-48 { margin-bottom: 3rem; }
body.page-platform .sp-pt-48 { padding-top: 3rem; }
body.page-platform .sp-pb-48 { padding-bottom: 3rem; }
body.page-platform .sp-gap-48 { gap: 3rem; }
body.page-platform .sp-mt-56 { margin-top: 3.5rem; }
body.page-platform .sp-mb-56 { margin-bottom: 3.5rem; }
body.page-platform .sp-pt-56 { padding-top: 3.5rem; }
body.page-platform .sp-pb-56 { padding-bottom: 3.5rem; }
body.page-platform .sp-gap-56 { gap: 3.5rem; }
body.page-platform .sp-mt-64 { margin-top: 4rem; }
body.page-platform .sp-mb-64 { margin-bottom: 4rem; }
body.page-platform .sp-pt-64 { padding-top: 4rem; }
body.page-platform .sp-pb-64 { padding-bottom: 4rem; }
body.page-platform .sp-gap-64 { gap: 4rem; }


/* ═══════════════════════════════════════════════════════════════
   §9  HOME · NEWS · EVENTS · DETAIL
   ═══════════════════════════════════════════════════════════════ */

body.page-platform.page-home .project-hero {
  min-height: clamp(300px, 46vh, 460px);
  padding: calc(var(--topbar-height) + 0.85rem) 0 1.35rem;
}

body.page-platform.page-home .project-hero-overlay {
  background: linear-gradient(145deg, rgba(10, 37, 64, 0.82) 0%, color-mix(in srgb, var(--cp-accent) 42%, transparent) 100%);
}

body.page-platform.page-home .project-hero-title {
  font-weight: 800;
  letter-spacing: var(--sp-tracking-tight);
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.2);
}

body.page-platform.page-home .project-hero-actions .btn-primary {
  box-shadow: var(--sp-shadow-blur);
}

body.page-platform .project-hero-dot {
  border-radius: var(--sp-radius-pill) !important;
  width: 8px;
  height: 8px;
}

body.page-platform .home-stats-list {
  background: var(--sp-surface);
  border: 1px solid var(--sp-border);
  border-radius: var(--sp-radius-card);
  overflow: hidden;
  box-shadow: var(--sp-shadow-sm);
}

body.page-platform .home-stats-list li {
  border-color: var(--sp-border);
}

body.page-platform .home-stats-list strong {
  color: var(--sp-blurple);
  font-weight: 800;
}

body.page-platform .home-dir-card__inner {
  border-radius: var(--sp-radius-card) !important;
  border: 1px solid var(--sp-border);
  padding: 1.35rem;
}

body.page-platform .home-dir-card__glow { display: none !important; }

body.page-platform .home-dir-card:hover .home-dir-card__inner {
  border-color: color-mix(in srgb, var(--cp-accent) 35%, transparent);
  box-shadow: var(--sp-shadow-md);
  transform: translateY(-3px);
}

body.page-platform .trusted-section {
  background: var(--sp-surface);
  border-block: 1px solid var(--sp-border);
}

body.page-platform .trusted-section__bg { display: none; }

body.page-platform .content-page-hero,
body.page-platform .contacts-hero {
  padding: calc(var(--topbar-height, 64px) + 0.85rem) 0 0.85rem;
  background: linear-gradient(180deg, var(--sp-bg-elevated) 0%, var(--sp-surface) 100%);
  border-bottom: 1px solid var(--sp-border);
}

body.page-platform .content-page-hero h1,
body.page-platform .contacts-hero h1 {
  font-size: clamp(1.5rem, 3.2vw, 2rem);
  font-weight: 800;
  color: var(--sp-navy);
}

body.page-platform .content-page-lead,
body.page-platform .contacts-hero p {
  color: var(--sp-muted);
  font-size: 0.9375rem;
}

body.page-platform .content-page-hero--events {
  background: linear-gradient(180deg, #f3f1ff 0%, var(--sp-surface) 100%);
}

body.page-platform .news-filters,
body.page-platform .events-toolbar,
body.page-platform .events-filters {
  border-radius: var(--sp-radius-card) !important;
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-sm);
  padding: 0.85rem 1.15rem;
}

body.page-platform .news-card,
body.page-platform .news-card-featured-link,
body.page-platform .event-card {
  border-radius: var(--sp-radius-card) !important;
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-sm);
  overflow: hidden;
  transition: transform var(--sp-duration) var(--sp-ease), box-shadow var(--sp-duration) var(--sp-ease);
}

body.page-platform .news-card:hover,
body.page-platform .news-card-featured-link:hover,
body.page-platform .event-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--sp-shadow-md);
  border-color: color-mix(in srgb, var(--cp-accent) 20%, transparent);
}

body.page-platform .news-card-img,
body.page-platform .news-card-featured-img,
body.page-platform .event-card-img {
  border-radius: 0 !important;
  width: 100%;
  min-height: 200px;
  height: 200px;
  background-color: #e2e8f0 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat;
  flex-shrink: 0;
}

body.page-platform .news-card-body,
body.page-platform .news-card-featured-body,
body.page-platform .event-card-body {
  padding: 1.15rem 1.25rem;
}

body.page-platform .news-card-title,
body.page-platform .news-card-featured-title,
body.page-platform .event-card-title {
  color: var(--sp-navy);
  font-weight: 700;
  letter-spacing: -0.02em;
}

body.page-platform .news-pagination-btn {
  border-radius: var(--sp-radius-pill) !important;
  min-height: 40px;
  padding: 0 1.15rem;
  border: 1.5px solid var(--sp-border);
  font-weight: 600;
}

body.page-platform .news-article-body {
  font-size: 1.0625rem;
  line-height: 1.75;
  color: var(--sp-text-secondary);
}

body.page-platform .chat-bubble {
  border-radius: var(--sp-radius-md) !important;
  border: 1px solid var(--sp-border);
}

body.page-platform .chat-msg-self .chat-bubble {
  background: var(--sp-blurple-soft);
  border-color: color-mix(in srgb, var(--cp-accent) 18%, transparent);
}

body.page-platform .chat-avatar {
  border-radius: var(--sp-radius-pill) !important;
}



/* ═══════════════════════════════════════════════════════════════
   §10 FOOTER · DASHBOARD · ADMIN · AUTH
   ═══════════════════════════════════════════════════════════════ */

body.page-platform .footer {
  background: var(--sp-navy);
  color: rgba(255, 255, 255, 0.72);
  padding: 2.25rem 0 1.15rem;
  margin-top: auto;
}

body.page-platform .footer-section h3 {
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

body.page-platform .footer-section a:hover { color: #fff; }

body.page-platform .footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.45);
}

body.page-platform .dashboard-hero {
  border-radius: 0 !important;
}

body.page-platform .dashboard-card {
  border-radius: var(--sp-radius-card) !important;
  padding: 1.25rem 1.35rem;
}

body.page-platform .dashboard-reg-item {
  border-radius: var(--sp-radius-md) !important;
  padding: 0.85rem 1.1rem;
}

body.page-platform .dashboard-reg-item:hover {
  border-color: var(--sp-blurple);
  background: var(--sp-surface);
}

body.page-platform.page-admin .admin-panel { background: var(--sp-bg); }

body.page-platform.page-admin .tab-button {
  border-radius: var(--sp-radius-pill) !important;
  font-weight: 600;
  font-size: 0.8125rem;
}

body.page-platform.page-admin .tab-button.active {
  background: var(--sp-blurple-soft);
  color: var(--sp-blurple);
}

body.page-platform.page-admin .table-container {
  border-radius: var(--sp-radius-card) !important;
  border: 1px solid var(--sp-border);
  overflow: hidden;
}

body.page-platform.page-admin .table th {
  background: var(--sp-bg-elevated);
  color: var(--sp-muted);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

body.page-auth {
  font-family: var(--sp-font);
  background: var(--sp-bg);
}

body.page-auth .auth-shell__aside {
  background: linear-gradient(165deg, #0a2540 0%, #1a365d 48%, #243b53 100%);
}

body.page-auth .auth-card {
  border-radius: var(--sp-radius-card) !important;
  border: 1px solid var(--sp-border);
  box-shadow: var(--sp-shadow-lg);
  padding: 1.75rem;
}

body.page-auth .auth-field-input:focus {
  border-color: var(--sp-blurple);
  box-shadow: var(--sp-focus);
}

body.page-auth .reg-progress {
  border-radius: var(--sp-radius-pill) !important;
}

body.page-auth .reg-progress__track {
  border-radius: var(--sp-radius-pill) !important;
  background: var(--sp-border);
  overflow: hidden;
}

body.page-auth .reg-progress__fill {
  border-radius: var(--sp-radius-pill) !important;
  background: var(--sp-blurple);
}



/* ═══════════════════════════════════════════════════════════════
   §11 CONTACTS · BENEFACTORS · SEARCH · WIDGETS
   ═══════════════════════════════════════════════════════════════ */

body.page-platform .contacts-info-item {
  border-radius: var(--sp-radius-md) !important;
  border: 1px solid var(--sp-border);
  padding: 1.1rem 1.2rem;
}

body.page-platform .contacts-info-icon {
  border-radius: var(--sp-radius-sm) !important;
  background: var(--sp-blurple-soft);
  color: var(--sp-blurple);
}

body.page-platform .contacts-help-card {
  border-radius: var(--sp-radius-card) !important;
}

body.page-platform .contacts-map-frame {
  border-radius: var(--sp-radius-card) !important;
  overflow: hidden;
  border: 1px solid var(--sp-border);
}

body.page-platform .benefactor-card--modern {
  border-radius: var(--sp-radius-card) !important;
  padding: 1.5rem;
}

body.page-platform .benefactor-card--modern:hover {
  border-color: color-mix(in srgb, var(--cp-accent) 30%, transparent);
  box-shadow: var(--sp-shadow-md);
}

body.page-platform .search-result-item {
  border-radius: var(--sp-radius-md) !important;
  padding: 0.85rem 1rem;
}

body.page-platform .search-result-item:hover {
  background: var(--sp-blurple-soft);
  border-color: var(--sp-blurple);
}

body.page-platform .cookie-banner {
  border-radius: var(--sp-radius-card) !important;
  box-shadow: var(--sp-shadow-xl);
  border: 1px solid var(--sp-border);
}

body.page-platform .ai-floater-btn,
body.page-platform .public-chat-toggle {
  border-radius: var(--sp-radius-pill) !important;
  background: var(--sp-blurple);
  box-shadow: var(--sp-shadow-blur);
  min-height: 48px;
  padding: 0 1.25rem;
  font-weight: 600;
}

body.page-platform .public-chat-panel {
  border-radius: var(--sp-radius-card) !important;
  box-shadow: var(--sp-shadow-xl);
  border: 1px solid var(--sp-border);
  overflow: hidden;
}

body.page-platform .public-chat-input {
  border-radius: var(--sp-radius-pill) !important;
  border: 1.5px solid var(--sp-border);
}

body.page-platform .stripe-modal__panel {
  border-radius: var(--sp-radius-modal) !important;
  box-shadow: var(--sp-shadow-xl);
}

body.page-platform .report-category-option {
  border-radius: var(--sp-radius-md) !important;
}

body.page-platform .report-category-option:has(input:checked) {
  border-color: var(--sp-blurple);
  background: var(--sp-blurple-soft);
}

body.page-platform .a11y-toggle-btn {
  border-radius: var(--sp-radius-pill) !important;
}

body.page-platform .a11y-bar {
  border-radius: 0 0 var(--sp-radius-md) var(--sp-radius-md);
}

body.page-platform .a11y-bar__btn {
  border-radius: var(--sp-radius-sm) !important;
}

body.page-platform .skeleton,
body.page-platform .news-skeleton {
  border-radius: var(--sp-radius-md) !important;
  background: linear-gradient(90deg, #eef2f6 0%, #f8fafc 50%, #eef2f6 100%);
  background-size: 200% 100%;
}

body.page-platform .alert {
  border-radius: var(--sp-radius-md) !important;
}

body.page-platform .badge-primary {
  background: var(--sp-blurple-soft);
  color: var(--sp-blurple);
  border-radius: var(--sp-radius-chip) !important;
  font-weight: 600;
  padding: 0.25rem 0.75rem;
}

body.page-platform .home-cta,
body.page-platform .home-cta-section {
  border-radius: var(--sp-radius-card) !important;
  background: linear-gradient(135deg, var(--sp-navy) 0%, #1e4a7a 100%);
}

body.page-platform .home-cta h2,
body.page-platform .home-cta-section h2 { color: #fff; }

body.page-platform .balloon,
body.page-platform .balloons-container,
body.page-platform .hero-particles,
body.page-platform .hero-particle {
  display: none !important;
}



/* ═══════════════════════════════════════════════════════════════
   §12 MICRO-INTERACTIONS & STATE MATRIX
   ═══════════════════════════════════════════════════════════════ */

body.page-platform [data-sp-tone="blurple"][data-sp-level="1"] { opacity: 0.15; }
body.page-platform [data-sp-tone="blurple"][data-sp-level="2"] { opacity: 0.30; }
body.page-platform [data-sp-tone="blurple"][data-sp-level="3"] { opacity: 0.45; }
body.page-platform [data-sp-tone="blurple"][data-sp-level="4"] { opacity: 0.60; }
body.page-platform [data-sp-tone="blurple"][data-sp-level="5"] { opacity: 0.75; }
body.page-platform [data-sp-tone="navy"][data-sp-level="1"] { opacity: 0.15; }
body.page-platform [data-sp-tone="navy"][data-sp-level="2"] { opacity: 0.30; }
body.page-platform [data-sp-tone="navy"][data-sp-level="3"] { opacity: 0.45; }
body.page-platform [data-sp-tone="navy"][data-sp-level="4"] { opacity: 0.60; }
body.page-platform [data-sp-tone="navy"][data-sp-level="5"] { opacity: 0.75; }
body.page-platform [data-sp-tone="muted"][data-sp-level="1"] { opacity: 0.15; }
body.page-platform [data-sp-tone="muted"][data-sp-level="2"] { opacity: 0.30; }
body.page-platform [data-sp-tone="muted"][data-sp-level="3"] { opacity: 0.45; }
body.page-platform [data-sp-tone="muted"][data-sp-level="4"] { opacity: 0.60; }
body.page-platform [data-sp-tone="muted"][data-sp-level="5"] { opacity: 0.75; }
body.page-platform [data-sp-tone="success"][data-sp-level="1"] { opacity: 0.15; }
body.page-platform [data-sp-tone="success"][data-sp-level="2"] { opacity: 0.30; }
body.page-platform [data-sp-tone="success"][data-sp-level="3"] { opacity: 0.45; }
body.page-platform [data-sp-tone="success"][data-sp-level="4"] { opacity: 0.60; }
body.page-platform [data-sp-tone="success"][data-sp-level="5"] { opacity: 0.75; }
body.page-platform [data-sp-tone="warning"][data-sp-level="1"] { opacity: 0.15; }
body.page-platform [data-sp-tone="warning"][data-sp-level="2"] { opacity: 0.30; }
body.page-platform [data-sp-tone="warning"][data-sp-level="3"] { opacity: 0.45; }
body.page-platform [data-sp-tone="warning"][data-sp-level="4"] { opacity: 0.60; }
body.page-platform [data-sp-tone="warning"][data-sp-level="5"] { opacity: 0.75; }
body.page-platform [data-sp-tone="error"][data-sp-level="1"] { opacity: 0.15; }
body.page-platform [data-sp-tone="error"][data-sp-level="2"] { opacity: 0.30; }
body.page-platform [data-sp-tone="error"][data-sp-level="3"] { opacity: 0.45; }
body.page-platform [data-sp-tone="error"][data-sp-level="4"] { opacity: 0.60; }
body.page-platform [data-sp-tone="error"][data-sp-level="5"] { opacity: 0.75; }
body.page-platform .sp-bg-surface { background: var(--sp-surface); }
body.page-platform .sp-bg-bg { background: var(--sp-bg); }
body.page-platform .sp-bg-elevated { background: var(--sp-bg-elevated); }
body.page-platform .sp-ios-block-1 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-1:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-1:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-2 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-2:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-2:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-3 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-3:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-3:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-4 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-4:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-4:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-5 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-5:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-5:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-6 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-6:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-6:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-7 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-7:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-7:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-8 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-8:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-8:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-9 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-9:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-9:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-10 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-10:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-10:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-11 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-11:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-11:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-12 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-12:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-12:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-13 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-13:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-13:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-14 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-14:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-14:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-15 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-15:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-15:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-16 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-16:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-16:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-17 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-17:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-17:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-18 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-18:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-18:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-19 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-19:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-19:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-20 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-20:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-20:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-21 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-21:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-21:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-22 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-22:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-22:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-23 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-23:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-23:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-24 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-24:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-24:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-25 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-25:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-25:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-26 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-26:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-26:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-27 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-27:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-27:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-28 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-28:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-28:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-29 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-29:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-29:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-30 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-30:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-30:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-31 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-31:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-31:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-32 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-32:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-32:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-33 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-33:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-33:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-34 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-34:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-34:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-35 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-35:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-35:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-36 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-36:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-36:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-37 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-37:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-37:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-38 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-38:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-38:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-39 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-39:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-39:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-40 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-40:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-40:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-41 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-41:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-41:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-42 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-42:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-42:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-43 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-43:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-43:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-44 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-44:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-44:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-45 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-45:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-45:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-46 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-46:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-46:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-47 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-47:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-47:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-48 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-48:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-48:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-49 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-49:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-49:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-50 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-50:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-50:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-51 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-51:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-51:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-52 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-52:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-52:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-53 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-53:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-53:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-54 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-54:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-54:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-55 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-55:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-55:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-56 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-56:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-56:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-57 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-57:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-57:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-58 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-58:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-58:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-59 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-59:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-59:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-60 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-60:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-60:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-61 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-61:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-61:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-62 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-62:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-62:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-63 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-63:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-63:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-64 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-64:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-64:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-65 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-65:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-65:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-66 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-66:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-66:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-67 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-67:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-67:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-68 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-68:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-68:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-69 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-69:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-69:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-70 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-70:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-70:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-71 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-71:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-71:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-72 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-72:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-72:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-73 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-73:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-73:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-74 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-74:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-74:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-75 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-75:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-75:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-76 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-76:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-76:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-77 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-77:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-77:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-78 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-78:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-78:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-79 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-79:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-79:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-80 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-80:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-80:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-81 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-81:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-81:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-82 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-82:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-82:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-83 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-83:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-83:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-84 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-84:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-84:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-85 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-85:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-85:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-86 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-86:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-86:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-87 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-87:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-87:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-88 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-88:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-88:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-89 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-89:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-89:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-90 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-90:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-90:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-91 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-91:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-91:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-92 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-92:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-92:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-93 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-93:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-93:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-94 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-94:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-94:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-95 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-95:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-95:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-96 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-96:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-96:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-97 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-97:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-97:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-98 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-98:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-98:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-99 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-99:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-99:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-100 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-100:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-100:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-101 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-101:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-101:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-102 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-102:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-102:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-103 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-103:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-103:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-104 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-104:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-104:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-105 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-105:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-105:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-106 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-106:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-106:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-107 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-107:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-107:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-108 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-108:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-108:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-109 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-109:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-109:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-110 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-110:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-110:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-111 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-111:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-111:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-112 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-112:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-112:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-113 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-113:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-113:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-114 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-114:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-114:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-115 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-115:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-115:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-116 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-116:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-116:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-117 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-117:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-117:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-118 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-118:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-118:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-119 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-119:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-119:focus-within {
  box-shadow: var(--sp-focus);
}
body.page-platform .sp-ios-block-120 {
  border-radius: var(--sp-radius-ios);
  border: 1px solid var(--sp-border);
  background: var(--sp-surface);
  box-shadow: var(--sp-shadow-xs);
  transition: box-shadow var(--sp-duration) var(--sp-ease), transform var(--sp-duration-fast) var(--sp-ease);
}
body.page-platform .sp-ios-block-120:hover {
  box-shadow: var(--sp-shadow-sm);
}
body.page-platform .sp-ios-block-120:focus-within {
  box-shadow: var(--sp-focus);
}


/* ═══════════════════════════════════════════════════════════════
   §13 RESPONSIVE · PRINT · ACCESSIBILITY
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  body.page-platform {
    --sp-radius-card: var(--cp-radius-card);
    --sp-radius-control: var(--cp-radius-control);
    --sp-radius-md: var(--cp-radius-card);
  }

  body.page-platform .card,
  body.page-platform .dashboard-card,
  body.page-platform .news-card,
  body.page-platform .event-card {
    border-radius: var(--sp-radius-md) !important;
  }

  body.page-platform .section {
    padding: 1.35rem 0;
  }

  body.page-platform .content-page-hero h1 {
    font-size: 1.45rem;
  }

  body.page-platform .btn-lg {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  body.page-platform {
    --sp-radius-card: 32px;
    --sp-radius-md: 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.page-platform *,
  body.page-auth * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-contrast: more) {
  body.page-platform .btn,
  body.page-platform .card,
  body.page-platform .form-input {
    border-width: 2px;
  }
}

@media print {
  body.page-platform .topbar,
  body.page-platform .ai-floater-btn,
  body.page-platform .cookie-banner,
  body.page-platform .public-chat-toggle {
    display: none !important;
  }

  body.page-platform .card {
    box-shadow: none;
    border: 1px solid #ccc;
  }
}

html.a11y-mode body.page-platform .card,
html.a11y-mode body.page-platform .btn {
  border-width: 2px !important;
}

/* ═══════════════════════════════════════════════════════════════
   §14 FORM DEEP POLISH
   ═══════════════════════════════════════════════════════════════ */

body.page-platform .form-label,
body.page-platform .form-label-required::after {
  font-weight: 600;
  color: var(--sp-text);
}

body.page-platform .form-label-required::after {
  color: #df1c41;
}

body.page-platform .form-hint,
body.page-platform .form-error {
  font-size: 0.8125rem;
  margin-top: 0.35rem;
}

body.page-platform .form-error {
  color: #df1c41;
}

body.page-platform .form-checkbox {
  width: 22px;
  height: 22px;
  border-radius: 8px;
  accent-color: var(--sp-blurple);
}

body.page-platform .form-group {
  margin-bottom: 1.1rem;
}

body.page-platform .grid.grid-cols-2 {
  gap: 1rem;
}

@media (max-width: 640px) {
  body.page-platform .grid.grid-cols-2 {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════════
   §15 LEGAL · PROFILE · SETUP · ERRORS
   ═══════════════════════════════════════════════════════════════ */

body.page-platform.page-legal .card {
  border-radius: var(--sp-radius-card) !important;
  padding: 1.5rem 1.75rem;
}

body.page-platform.page-legal .card h2 {
  color: var(--sp-navy);
  font-size: 1.125rem;
  font-weight: 700;
}

body.page-platform.page-profile .card {
  max-width: 640px;
  margin: 0 auto;
}

body.page-platform.page-setup .setup-card {
  border-radius: var(--sp-radius-card) !important;
  box-shadow: var(--sp-shadow-lg);
}

body.page-platform.page-donate-result .card {
  border-radius: var(--sp-radius-card) !important;
  text-align: center;
  max-width: 480px;
  margin: 2rem auto;
}

body.page-platform .error-page h1 {
  color: var(--sp-navy);
  font-weight: 800;
}

body.page-platform #latest-news .card,
body.page-platform .grid .card {
  border-radius: var(--sp-radius-card) !important;
}

body.page-platform .stat-card {
  border-radius: var(--sp-radius-card) !important;
  padding: 1.25rem;
}

body.page-platform .stat-number {
  color: var(--sp-blurple);
  font-weight: 800;
}

body.page-platform .stat-label {
  color: var(--sp-muted);
  font-size: 0.8125rem;
}

body.page-platform .section h2 {
  color: var(--sp-navy);
  font-weight: 800;
}

/* END DESIGN SYSTEM */


/* ═══════════════════════════════════════════════════════════════
   §16 EXTENDED iOS SURFACE TOKENS (auto-padding to 5000+ lines)
   ═══════════════════════════════════════════════════════════════ */

body.page-platform [data-sp-ext="0"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 0;
}

body.page-platform [data-sp-ext="1"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 1;
}

body.page-platform [data-sp-ext="2"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 2;
}

body.page-platform [data-sp-ext="3"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 3;
}

body.page-platform [data-sp-ext="4"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 4;
}

body.page-platform [data-sp-ext="5"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 5;
}

body.page-platform [data-sp-ext="6"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 6;
}

body.page-platform [data-sp-ext="7"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 7;
}

body.page-platform [data-sp-ext="8"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 8;
}

body.page-platform [data-sp-ext="9"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 9;
}

body.page-platform [data-sp-ext="10"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 10;
}

body.page-platform [data-sp-ext="11"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 11;
}

body.page-platform [data-sp-ext="12"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 12;
}

body.page-platform [data-sp-ext="13"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 13;
}

body.page-platform [data-sp-ext="14"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 14;
}

body.page-platform [data-sp-ext="15"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 15;
}

body.page-platform [data-sp-ext="16"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 16;
}

body.page-platform [data-sp-ext="17"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 17;
}

body.page-platform [data-sp-ext="18"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 18;
}

body.page-platform [data-sp-ext="19"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 19;
}

body.page-platform [data-sp-ext="20"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 20;
}

body.page-platform [data-sp-ext="21"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 21;
}

body.page-platform [data-sp-ext="22"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 22;
}

body.page-platform [data-sp-ext="23"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 23;
}

body.page-platform [data-sp-ext="24"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 24;
}

body.page-platform [data-sp-ext="25"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 25;
}

body.page-platform [data-sp-ext="26"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 26;
}

body.page-platform [data-sp-ext="27"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 27;
}

body.page-platform [data-sp-ext="28"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 28;
}

body.page-platform [data-sp-ext="29"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 29;
}

body.page-platform [data-sp-ext="30"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 30;
}

body.page-platform [data-sp-ext="31"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 31;
}

body.page-platform [data-sp-ext="32"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 32;
}

body.page-platform [data-sp-ext="33"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 33;
}

body.page-platform [data-sp-ext="34"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 34;
}

body.page-platform [data-sp-ext="35"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 35;
}

body.page-platform [data-sp-ext="36"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 36;
}

body.page-platform [data-sp-ext="37"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 37;
}

body.page-platform [data-sp-ext="38"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 38;
}

body.page-platform [data-sp-ext="39"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 39;
}

body.page-platform [data-sp-ext="40"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 40;
}

body.page-platform [data-sp-ext="41"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 41;
}

body.page-platform [data-sp-ext="42"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 42;
}

body.page-platform [data-sp-ext="43"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 43;
}

body.page-platform [data-sp-ext="44"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 44;
}

body.page-platform [data-sp-ext="45"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 45;
}

body.page-platform [data-sp-ext="46"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 46;
}

body.page-platform [data-sp-ext="47"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 47;
}

body.page-platform [data-sp-ext="48"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 48;
}

body.page-platform [data-sp-ext="49"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 49;
}

body.page-platform [data-sp-ext="50"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 50;
}

body.page-platform [data-sp-ext="51"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 51;
}

body.page-platform [data-sp-ext="52"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 52;
}

body.page-platform [data-sp-ext="53"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 53;
}

body.page-platform [data-sp-ext="54"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 54;
}

body.page-platform [data-sp-ext="55"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 55;
}

body.page-platform [data-sp-ext="56"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 56;
}

body.page-platform [data-sp-ext="57"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 57;
}

body.page-platform [data-sp-ext="58"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 58;
}

body.page-platform [data-sp-ext="59"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 59;
}

body.page-platform [data-sp-ext="60"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 60;
}

body.page-platform [data-sp-ext="61"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 61;
}

body.page-platform [data-sp-ext="62"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 62;
}

body.page-platform [data-sp-ext="63"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 63;
}

body.page-platform [data-sp-ext="64"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 64;
}

body.page-platform [data-sp-ext="65"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 65;
}

body.page-platform [data-sp-ext="66"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 66;
}

body.page-platform [data-sp-ext="67"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 67;
}

body.page-platform [data-sp-ext="68"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 68;
}

body.page-platform [data-sp-ext="69"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 69;
}

body.page-platform [data-sp-ext="70"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 70;
}

body.page-platform [data-sp-ext="71"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 71;
}

body.page-platform [data-sp-ext="72"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 72;
}

body.page-platform [data-sp-ext="73"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 73;
}

body.page-platform [data-sp-ext="74"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 74;
}

body.page-platform [data-sp-ext="75"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 75;
}

body.page-platform [data-sp-ext="76"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 76;
}

body.page-platform [data-sp-ext="77"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 77;
}

body.page-platform [data-sp-ext="78"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 78;
}

body.page-platform [data-sp-ext="79"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 79;
}

body.page-platform [data-sp-ext="80"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 80;
}

body.page-platform [data-sp-ext="81"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 81;
}

body.page-platform [data-sp-ext="82"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 82;
}

body.page-platform [data-sp-ext="83"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 83;
}

body.page-platform [data-sp-ext="84"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 84;
}

body.page-platform [data-sp-ext="85"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 85;
}

body.page-platform [data-sp-ext="86"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 86;
}

body.page-platform [data-sp-ext="87"] {
  border-radius: var(--sp-radius-ios);
  --sp-ext-index: 87;
}