/* ============================================================
   MMUST Christian Union — Phase 37
   Mobile, Accessibility & Performance Optimization
   Cumulative release built on Phase 36.4.3.
   ============================================================ */

:root{
  --phase37-focus:#FF9900;
  --phase37-focus-contrast:#000000;
  --phase37-safe-bottom:env(safe-area-inset-bottom,0px);
  --phase37-safe-top:env(safe-area-inset-top,0px);
}

html{scroll-padding-top:104px;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{min-width:0;overflow-x:hidden}
main,.container,.member-portal-content,.member-portal-main{min-width:0}
img,svg,video,canvas,iframe,object,embed{max-width:100%}
img{height:auto}
pre,code,kbd,samp{overflow-wrap:normal}
pre{max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch}
:where(h1,h2,h3,h4,h5,h6,[id]){scroll-margin-top:112px}
:where(p,li,dd,dt,a,strong,span,small){overflow-wrap:break-word}

/* Keyboard accessibility */
.phase37-skip-link{
  position:fixed;left:16px;top:12px;z-index:5000;
  transform:translateY(-160%);padding:11px 15px;border:2px solid #000;
  border-radius:10px;background:#FF9900;color:#000;font-weight:900;
  box-shadow:0 10px 26px rgba(0,0,0,.20);transition:transform .15s ease;
}
.phase37-skip-link:focus{transform:translateY(0);outline:3px solid #fff;outline-offset:2px}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid var(--phase37-focus)!important;
  outline-offset:3px!important;
}
:where(input,select,textarea):focus-visible{border-color:#0099FF!important}
:where(button,[role="button"]){touch-action:manipulation}

/* Reusable horizontal table viewport created by phase37.js. */
.phase37-table-scroll{
  width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;
  -webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;
  scrollbar-gutter:stable;border-radius:inherit;
}
.phase37-table-scroll>table{width:100%;min-width:max-content;margin:0}
.phase37-table-scroll:focus-visible{outline:3px solid #0099FF!important;outline-offset:2px!important}
.phase37-table-hint{display:none}

/* Forms: prevent narrow-screen overflow and iOS zoom. */
form,fieldset,label{min-width:0;max-width:100%}
input,select,textarea,button{max-width:100%}
textarea{resize:vertical}
input[type="file"]{width:100%}

/* Media embeds remain within the viewport. */
iframe,object,embed{width:100%}
video{height:auto}

/* Improve card/grid resilience without changing desktop composition. */
:where(.grid,.card-grid,.feature-grid,.leader-grid,.footer-grid,.v3-footer-grid,
       .community-grid,.member-dashboard-grid,.portal-dashboard-grid,
       .workspace-grid,.weekly-public-grid,.public-discovery-links)>*{min-width:0}

/* Member portal: keep content usable when long labels/tables are present. */
.member-portal-shell,.member-portal-content,.member-portal-main{max-width:100%}
.member-portal-main{overflow-x:clip}
.portal-nav-copy,.portal-mobile-current{min-width:0}
.portal-nav-copy strong,.portal-nav-copy small,.portal-mobile-current strong{overflow-wrap:anywhere}

/* Loading/paint efficiency for large below-fold public sections. */
.public-site-body main>section:nth-of-type(n+4){content-visibility:auto;contain-intrinsic-size:700px}
.member-portal-body .member-portal-main>section:nth-of-type(n+3){content-visibility:auto;contain-intrinsic-size:600px}

/* Print should remain clean and complete. */
@media print{
  .phase37-skip-link{display:none!important}
  .phase37-table-scroll{overflow:visible!important}
  .phase37-table-scroll>table{width:100%!important}
  .public-site-body main>section,.member-portal-body .member-portal-main>section{content-visibility:visible!important;contain-intrinsic-size:auto!important}
}

@media(max-width:900px){
  html{scroll-padding-top:88px}
  :where(h1,h2,h3,h4,h5,h6,[id]){scroll-margin-top:96px}
  .container{width:min(100% - 28px,1180px)}
  .phase37-table-hint{display:block;margin:0 0 7px;font-size:11px;font-weight:800;color:rgba(0,0,0,.58)}
  .footer-grid,.v3-footer-grid{row-gap:26px}
}

@media(max-width:760px){
  body{font-size:15px}
  .container{width:min(100% - 24px,1180px)}
  input:not([type="checkbox"]):not([type="radio"]),select,textarea{font-size:16px!important}
  button,.button,input[type="submit"],input[type="button"],input[type="reset"]{min-height:44px}
  .mobile-drawer a,.member-portal-sidebar a{min-height:44px}
  .site-header{padding-top:var(--phase37-safe-top)}
  .v3-brand,.brand{min-width:0;max-width:calc(100vw - 92px)}
  .brand-copy{min-width:0}
  .brand-copy strong{font-size:clamp(10px,3vw,14px);overflow-wrap:anywhere}
  .brand-copy small{font-size:8px;line-height:1.3}
  .footer-bottom{gap:8px;align-items:flex-start;flex-direction:column}
  .member-portal-mobilebar{padding-top:max(0px,var(--phase37-safe-top))}
  .member-portal-main{padding-left:0;padding-right:0}
  .mmustcu-assist-panel{max-height:calc(100dvh - 24px - var(--phase37-safe-top) - var(--phase37-safe-bottom))}
}

@media(max-width:520px){
  .container{width:min(100% - 20px,1180px)}
  .button{white-space:normal;text-align:center}
  .constitution-pdf-object{min-height:430px}
  .footer-contact-mini a,.footer-contact-mini span{overflow-wrap:anywhere}
  .phase37-table-scroll{margin-inline:0}
}

/* Respect operating-system motion preferences across every phase. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  .public-site-body main>section,.member-portal-body .member-portal-main>section{
    content-visibility:visible!important;contain-intrinsic-size:auto!important;
  }
}

/* High-contrast / forced-colours resilience. */
@media(forced-colors:active){
  :where(a,button,input,select,textarea,summary):focus-visible{outline:2px solid Highlight!important}
  .button,.mmustcu-assist-launcher{forced-color-adjust:auto}
}

/* ============================================================
   Phase 37.0.1 — Mobile Dense Card & Media Grid Refinement
   User preference: 2 content cards per row on phones; 3 photos
   per row inside media albums. Overrides older single-column
   mobile rules from the cumulative Phase 36/37 stylesheet.
   ============================================================ */
@media(max-width:760px){
  /* Public/member card collections: keep two useful cards visible per row. */
  :where(
    .value-grid,
    .public-card-grid,
    .album-grid,
    .notice-grid,
    .community-cards,
    .resource-grid,
    .leader-grid,
    .sermon-grid,
    .pathway-grid,
    .ministry-preview-grid,
    .weekly-grid,
    .team-preview-grid,
    .home-event-grid,
    .media-album-grid,
    .gallery-album-grid,
    .modern-resource-grid,
    .modern-sermon-grid,
    .about-testimonial-grid,
    .home-community-feature-grid,
    .home-visual-event-grid,
    .ministry-visual-grid,
    .evteam-visual-grid,
    .weekly-pillar-grid,
    .weekly-rhythm-board,
    .weekly-event-grid,
    .weekly-community-links,
    .notification-summary-grid,
    .member-activity-stats,
    .formation-service-grid
  ){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }

  /* Ensure spanning cards do not unexpectedly consume the full mobile row. */
  .weekly-pillar-grid article:last-child{grid-column:auto!important}

  /* Ministries and EV Teams: compact two-column cards without changing identity. */
  .ministry-visual-card,.evteam-visual-card{min-width:0!important}
  .ministry-card-image,.evteam-card-visual{height:150px!important}
  .ministry-card-body,.evteam-card-body{padding:13px!important}
  .ministry-card-body small,.evteam-card-body small{font-size:8px!important}
  .ministry-card-body h3,.evteam-card-body h3{font-size:15px!important;line-height:1.18!important;margin:5px 0 7px!important}
  .ministry-card-body p,.evteam-card-body p{font-size:10px!important;line-height:1.45!important}
  .ministry-card-body footer,.evteam-card-body footer{gap:6px!important;font-size:8px!important}
  .evteam-logo-wrap{width:58px!important;height:58px!important;left:10px!important;bottom:10px!important}

  /* Gallery folders: two clean folder cards per row on every phone. */
  .unified-gallery-page .gallery-album-grid,
  .media-library-page .media-album-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }
  .gallery-album-card{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    border-radius:13px!important;
  }
  .gallery-album-cover{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:1/1!important;
    padding:5px!important;
  }
  .gallery-album-body{
    min-height:124px!important;
    padding:10px!important;
  }
  .gallery-album-date{font-size:7px!important;margin-bottom:5px!important}
  .gallery-album-body h3{
    font-size:13px!important;
    line-height:1.22!important;
    margin:0 0 9px!important;
    overflow-wrap:anywhere!important;
  }
  .gallery-view-action{
    min-height:36px!important;
    padding:0 9px!important;
    font-size:8px!important;
    border-radius:8px!important;
  }
  .gallery-view-action b{font-size:14px!important}

  /* Open media albums: exactly three photographs per row on phones. */
  .gallery-photo-grid,
  .enhanced-photo-grid,
  .photo-grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .gallery-photo-grid{margin-top:16px!important}
  .gallery-photo-card,.enhanced-photo-tile{min-width:0!important;border-radius:7px!important}
  .gallery-photo-frame{
    width:100%!important;
    height:auto!important;
    aspect-ratio:1/1!important;
    padding:2px!important;
  }
  .gallery-photo-frame img{
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
  }
  .enhanced-photo-tile img{aspect-ratio:1/1!important;object-fit:cover!important}
  .enhanced-photo-tile>span{display:none!important}

  /* Compact common visual cards enough to remain readable in two columns. */
  .feature-card,.public-info-card{padding:16px!important;min-height:0!important}
  .feature-card h3,.public-info-card h2{font-size:16px!important;margin-top:14px!important}
  .feature-card p,.public-info-card p{font-size:10px!important;line-height:1.45!important}
  .leader-card{min-width:0!important}
}

/* Keep the requested density even on very narrow phones. */
@media(max-width:390px){
  :where(
    .value-grid,.public-card-grid,.album-grid,.notice-grid,.community-cards,
    .resource-grid,.leader-grid,.sermon-grid,.pathway-grid,.ministry-preview-grid,
    .weekly-grid,.team-preview-grid,.home-event-grid,.media-album-grid,.gallery-album-grid,
    .modern-resource-grid,.modern-sermon-grid,.about-testimonial-grid,
    .home-community-feature-grid,.home-visual-event-grid,.ministry-visual-grid,.evteam-visual-grid,
    .weekly-pillar-grid,.weekly-rhythm-board,.weekly-event-grid,.weekly-community-links,
    .notification-summary-grid,.member-activity-stats,.formation-service-grid
  ){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .gallery-photo-grid,.enhanced-photo-grid,.photo-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;
  }
  .ministry-card-image,.evteam-card-visual{height:132px!important}
  .ministry-card-body,.evteam-card-body{padding:10px!important}
  .ministry-card-body h3,.evteam-card-body h3{font-size:13px!important}
  .ministry-card-body p,.evteam-card-body p{font-size:9px!important}
}

/* Compact the legacy card internals so the two-column preference stays usable. */
@media(max-width:760px){
  .visual-story-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .visual-story-card,.visual-story-card:last-child{grid-column:auto!important;min-height:285px!important}
  .visual-story-card>div{padding:14px!important}
  .visual-story-card h3{font-size:17px!important;margin:5px 0 9px!important}
  .visual-story-card small,.visual-story-card span{font-size:10px!important}

  .media-album-card{
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
    min-width:0!important;
  }
  .media-album-visual{height:auto!important;min-height:0!important;aspect-ratio:1/1!important}
  .media-folder-art{width:72%!important;height:48%!important;min-height:64px!important}
  .media-folder-art .folder-body b{font-size:9px!important}
  .media-folder-art .folder-body small{font-size:5.5px!important}
  .media-photo-count{right:6px!important;bottom:6px!important;padding:5px 7px!important;font-size:6.5px!important}
  .media-album-body{min-height:126px!important;padding:10px!important}
  .media-album-body h3{font-size:13px!important;line-height:1.2!important}
  .media-album-body p{font-size:8px!important;line-height:1.4!important;margin-bottom:9px!important}
  .media-album-meta{font-size:6px!important;gap:2px!important;margin-bottom:5px!important}
  .media-view-button{min-height:34px!important;padding:0 8px!important;font-size:7px!important}

  .pathway-card,.ministry-preview-card,.team-preview-card{padding:15px!important;min-height:205px!important}
  .pathway-card h3,.ministry-preview-card h3,.team-preview-card h3{font-size:15px!important;margin:14px 0 6px!important}
  .pathway-card p,.ministry-preview-card p,.team-preview-card p{font-size:9px!important;line-height:1.45!important}

  .weekly-grid article{grid-template-columns:36px minmax(0,1fr)!important;gap:8px!important;padding:12px!important}
  .weekly-grid article>span{width:34px!important;height:34px!important;font-size:8px!important}
  .weekly-grid h3{font-size:13px!important}.weekly-grid p{font-size:9px!important}

  .home-event-card,.visual-event-card{
    grid-template-columns:1fr!important;
    align-items:start!important;
    gap:8px!important;
    padding:12px!important;
    min-height:0!important;
  }
  .event-date-block,.visual-event-date{width:54px!important;height:62px!important}
  .event-date-block strong,.visual-event-date strong{font-size:22px!important}
  .event-arrow,.visual-event-arrow{display:none!important}
  .home-event-card h3,.visual-event-copy h3{font-size:14px!important}
  .home-event-card p,.visual-event-copy p{font-size:9px!important}

  .weekly-event-card{grid-template-columns:1fr!important;gap:8px!important;padding:11px!important;min-height:0!important}
  .weekly-event-date{width:56px!important;min-height:64px!important}
  .weekly-event-date strong{font-size:21px!important}
  .weekly-event-card h3{font-size:14px!important}.weekly-event-card p{font-size:9px!important}.weekly-event-arrow{display:none!important}

  .weekly-rhythm-board article{grid-template-columns:1fr!important;gap:8px!important;padding:12px!important;min-height:0!important}
  .weekly-rhythm-index{width:38px!important;height:38px!important}
  .weekly-rhythm-board h3{font-size:14px!important}.weekly-rhythm-board p{font-size:9px!important}

  .weekly-community-links>a{grid-template-rows:115px auto!important}
  .weekly-community-links span{padding:10px!important}
  .weekly-community-links strong{font-size:13px!important}.weekly-community-links small{font-size:9px!important}
  .weekly-pillar-grid article{min-height:300px!important}
  .weekly-pillar-grid article>div{padding:15px!important}
  .weekly-pillar-grid h2{font-size:19px!important}.weekly-pillar-grid p{font-size:10px!important}

  .home-community-card{min-height:300px!important}
  .home-community-card-copy{left:14px!important;right:14px!important;bottom:14px!important}
  .home-community-card-copy strong{font-size:38px!important}
  .home-community-card-copy h3{font-size:17px!important;margin:6px 0 9px!important}
  .home-community-card-copy small,.home-community-card-copy span{font-size:9px!important}

  .resource-card .resource-body,.leader-card>div:last-child{padding:11px!important}
  .resource-body h3,.sermon-card h3,.leader-card h2{font-size:13px!important}
  .resource-body p,.sermon-card p{font-size:9px!important}
  .sermon-card{padding:13px!important;min-height:170px!important}

  .modern-resource-card{display:flex!important;flex-direction:column!important;grid-template-columns:none!important}
  .modern-resource-cover{height:140px!important;min-height:0!important;padding:5px!important}
  .modern-resource-body{padding:10px!important}
  .modern-resource-body h3{font-size:13px!important}
  .modern-sermon-card{padding:11px!important}
  .modern-sermon-card h3{font-size:13px!important}
}

@media(max-width:390px){
  .visual-story-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .visual-story-card,.visual-story-card:last-child{min-height:250px!important}
  .home-community-card{min-height:270px!important}
  .media-album-body{min-height:118px!important;padding:8px!important}
  .gallery-album-body{min-height:116px!important;padding:8px!important}
  .gallery-album-body h3,.media-album-body h3{font-size:12px!important}
}

/* ==========================================================================
   PHASE 37.1 — PROFESSIONAL SVG ICON SYSTEM
   Lucide Static 1.31.0, progressive enhancement with text fallback.
   ========================================================================== */
.ui-svg-icon{display:block;width:1.25rem;height:1.25rem;max-width:100%;max-height:100%;object-fit:contain}
.home-rhythm-grid>a>span.ui-iconified,.weekly-rhythm-index.ui-iconified,.portal-nav-icon.ui-iconified,.formation-card-icon.ui-iconified,.give-account-icon.ui-iconified,.give-note-icon.ui-iconified,.mmustcu-assist-launcher-icon.ui-iconified{font-size:0!important;line-height:0}
.home-rhythm-grid>a>span.ui-iconified .ui-svg-icon{width:21px;height:21px;filter:brightness(0) invert(1)}
.weekly-rhythm-index.ui-iconified .ui-svg-icon{width:23px;height:23px;filter:brightness(0) invert(1)}
.weekly-rhythm-board article:nth-child(even) .weekly-rhythm-index.ui-iconified .ui-svg-icon{filter:brightness(0)}
.portal-nav-icon.ui-iconified .ui-svg-icon{width:19px;height:19px;filter:brightness(0) invert(1)}
.portal-nav-section>a:nth-of-type(even):not(.is-active) .portal-nav-icon.ui-iconified .ui-svg-icon{filter:brightness(0)}
.portal-sidebar-footer a>span.ui-iconified{display:grid;place-items:center;min-width:24px;font-size:0!important}
.portal-sidebar-footer a>span.ui-iconified .ui-svg-icon{width:17px;height:17px}
.portal-sidebar-close.ui-iconified{font-size:0!important}
.portal-sidebar-close.ui-iconified .ui-svg-icon{width:20px;height:20px}
.formation-card-icon.ui-iconified .ui-svg-icon{width:24px;height:24px;filter:brightness(0) invert(1)}
.formation-card-icon.orange.ui-iconified .ui-svg-icon{filter:brightness(0)}
.give-account-icon.ui-iconified .ui-svg-icon{width:23px;height:23px;filter:brightness(0) invert(1)}
.give-account-icon.offering.ui-iconified .ui-svg-icon{filter:brightness(0)}
.give-note-icon.ui-iconified .ui-svg-icon{width:16px;height:16px;filter:brightness(0) invert(1)}
.mmustcu-assist-launcher-icon.ui-iconified .ui-svg-icon{width:21px;height:21px;filter:brightness(0)}
.nav-submenu-trigger>span.ui-iconified{display:inline-flex!important;align-items:center;justify-content:center;width:14px;height:14px;font-size:0!important;vertical-align:middle}
.nav-submenu-trigger>span.ui-iconified .ui-svg-icon{width:14px;height:14px}
button[data-menu].ui-iconified{font-size:0!important}
button[data-menu].ui-iconified .ui-svg-icon{width:21px;height:21px;margin:auto}
@media(max-width:620px){
  .home-rhythm-grid>a>span.ui-iconified .ui-svg-icon{width:19px;height:19px}
  .portal-nav-icon.ui-iconified .ui-svg-icon{width:18px;height:18px}
}


/* ==========================================================================
   PHASE 37.2 — ICON COMPLETION + MEMBER PORTAL CLEANUP
   ========================================================================== */
.ui-notification-icon{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 auto}
.ui-notification-icon.ui-iconified{font-size:0!important;line-height:0;background:transparent!important;min-width:20px!important;width:20px!important;height:20px!important;border-radius:0!important}
.ui-notification-icon.ui-iconified .ui-svg-icon{width:18px;height:18px;filter:none}
.notification-head-button .ui-notification-icon.ui-iconified .ui-svg-icon{width:17px;height:17px}
.portal-mobile-notifications>span.ui-iconified{font-size:0!important;line-height:0}
.portal-mobile-notifications>span.ui-iconified .ui-svg-icon{width:20px;height:20px;filter:brightness(0) invert(1)}
.drawer-close.ui-iconified{font-size:0!important;line-height:0}
.drawer-close.ui-iconified .ui-svg-icon{width:21px;height:21px}

/* =========================================================
   PHASE 37.3 — NEWS COUNTDOWN + PUBLIC SUPPORT CARD STUDIO
   ========================================================= */
.campaign-news-hero,.support-card-hero{background:linear-gradient(135deg,#00152f 0%,#003b72 52%,#005ea8 100%);position:relative;overflow:hidden}
.campaign-news-hero:after,.support-card-hero:after{content:"";position:absolute;inset:auto -8% -80% 38%;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,153,0,.38),transparent 66%);pointer-events:none}
.campaign-feature-section{background:#061426;color:#fff;position:relative;overflow:hidden;padding:72px 0}
.campaign-feature-section:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 28%,rgba(255,153,0,.14),transparent 34%),radial-gradient(circle at 10% 74%,rgba(0,153,255,.16),transparent 30%);pointer-events:none}
.campaign-feature-shell{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:54px;align-items:center;z-index:1}
.campaign-status-row{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:.14em;font-size:.78rem;color:#8dd8ff;margin-bottom:16px}
.campaign-live-dot{width:9px;height:9px;border-radius:50%;background:#ff9900;box-shadow:0 0 0 6px rgba(255,153,0,.12),0 0 24px rgba(255,153,0,.9)}
.campaign-feature-copy h2{font-size:clamp(2.4rem,5vw,5.3rem);line-height:.96;letter-spacing:-.045em;margin:0 0 16px;max-width:780px}
.campaign-subheadline{font-size:clamp(1.1rem,2vw,1.55rem)!important;color:#ffb73f!important;font-weight:800;margin:0 0 14px!important}
.campaign-feature-copy>p{font-size:1.06rem;color:#c9d7e7;line-height:1.8;max-width:760px}
.campaign-feature-visual{display:flex;justify-content:center}
.campaign-feature-visual img{display:block;width:min(100%,470px);aspect-ratio:4/5;object-fit:cover;border-radius:26px;box-shadow:0 35px 80px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.11);transform:rotate(1.1deg)}
.campaign-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:28px 0}
.campaign-meta-grid>div{position:relative;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);border-radius:18px;padding:17px 15px 16px 44px;min-height:84px}
.campaign-meta-grid small{display:block;font-size:.68rem;letter-spacing:.12em;color:#65c7ff;font-weight:800;margin-bottom:5px}
.campaign-meta-grid strong{display:block;line-height:1.35;font-size:.91rem;color:#fff}
.campaign-meta-icon{position:absolute;left:14px;top:18px;width:22px;height:22px;color:#ffad2d}
.campaign-feature-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.campaign-feature-actions .button{display:inline-flex;align-items:center;gap:9px}
.campaign-feature-actions .button [data-lucide]{width:19px;height:19px}
.campaign-glow-button{box-shadow:0 12px 32px rgba(0,153,255,.24)}

.campaign-countdown-section{padding:0;background:#061426;color:#fff}
.campaign-countdown-board{transform:translateY(28px);position:relative;z-index:2;background:linear-gradient(135deg,#fff 0%,#f4f8ff 100%);color:#111827;border-radius:26px;padding:34px;box-shadow:0 28px 70px rgba(0,20,45,.28);display:grid;grid-template-columns:minmax(230px,.75fr) minmax(0,1.25fr);gap:30px;align-items:center;border:1px solid rgba(0,153,255,.12)}
.campaign-countdown-head .eyebrow{color:#007acb}
.campaign-countdown-head h2{font-size:clamp(1.5rem,2.5vw,2.25rem);line-height:1.1;margin:8px 0 8px}
.campaign-countdown-head p{margin:0;color:#667085}
.campaign-countdown-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.campaign-countdown-grid>div{background:#07172c;color:#fff;border-radius:18px;padding:20px 8px;text-align:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.campaign-countdown-grid strong{display:block;font-size:clamp(1.8rem,4vw,3.4rem);font-variant-numeric:tabular-nums;line-height:1;color:#fff}
.campaign-countdown-grid span{display:block;margin-top:8px;color:#ffad2d;font-size:.68rem;font-weight:900;letter-spacing:.11em}
.campaign-countdown-board.is-live .campaign-countdown-grid>div{background:#063c2b}
.campaign-countdown-board.is-complete .campaign-countdown-grid>div{background:#273142}

.campaign-detail-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:24px;padding-top:44px}
.campaign-detail-card,.campaign-support-card{border-radius:24px}
.campaign-theme-box{background:#07172c;color:#fff;border-radius:18px;padding:20px 22px;margin:22px 0}
.campaign-theme-box small{display:block;color:#ffad2d;font-weight:900;letter-spacing:.12em;margin-bottom:7px}
.campaign-theme-box strong{display:block;font-size:1.25rem;line-height:1.35}
.campaign-theme-box span{display:inline-block;margin-top:9px;background:#007acb;border-radius:999px;padding:5px 11px;font-size:.78rem;font-weight:800}
.campaign-activity-chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}
.campaign-activity-chips span{background:#eef7ff;border:1px solid #caeaff;color:#075985;border-radius:999px;padding:8px 12px;font-size:.82rem;font-weight:800}
.campaign-support-card{background:linear-gradient(145deg,#001d3d,#003f78);color:#fff}
.campaign-support-card .kicker{color:#6ed0ff}.campaign-support-card h2{color:#fff}.campaign-support-card p{color:#dceaf6}
.campaign-list-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.campaign-mini-card{border:1px solid #e5e7eb;border-radius:18px;padding:20px;display:flex;justify-content:space-between;gap:12px;align-items:flex-end;background:#fff}
.campaign-mini-card small{color:#007acb;font-weight:900;letter-spacing:.1em}.campaign-mini-card h3{margin:6px 0}.campaign-mini-card p{margin:0;color:#667085;font-size:.88rem}.campaign-mini-card>a{white-space:nowrap;font-weight:900;color:#007acb}

.support-studio-section{background:#f6f9fd}
.support-privacy-note{display:flex;gap:15px;align-items:flex-start;border:1px solid #bfdbfe;background:#edf5ff;border-radius:18px;padding:18px 20px;margin-bottom:24px;color:#0f2745}
.support-privacy-note>[data-lucide]{width:27px;height:27px;flex:0 0 auto;color:#0b7dda;margin-top:2px}.support-privacy-note strong{display:block;margin-bottom:3px}.support-privacy-note p{margin:0;color:#4b6381;font-size:.91rem}
.support-studio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.support-editor-panel,.support-actions-panel,.support-output-panel{background:#fff;border:1px solid #e3e8ef;border-radius:24px;padding:24px;box-shadow:0 12px 40px rgba(15,35,60,.055);min-width:0}
.support-panel-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}.support-panel-head small{display:block;color:#007acb;font-weight:900;letter-spacing:.1em;font-size:.67rem}.support-panel-head h2{margin:3px 0 0;font-size:1.15rem}.support-step{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#061b38;color:#fff;font-weight:900;font-size:.76rem}
.support-file-control{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:11px;align-items:center;border:1.5px dashed #bdd5eb;border-radius:16px;padding:14px 16px;cursor:pointer;background:#f8fbff;margin-bottom:16px;transition:.2s ease}.support-file-control:hover{border-color:#0099ff;background:#f1f9ff}.support-file-control>[data-lucide]{grid-row:1/3;width:24px;height:24px;color:#007acb}.support-file-control strong{font-size:.9rem}.support-file-control small{font-size:.75rem;color:#6b7280}.support-file-control input{position:absolute;inset:0;opacity:0;cursor:pointer}
.support-crop-stage{position:relative;width:min(100%,420px);aspect-ratio:1;margin:0 auto 14px;border-radius:20px;overflow:hidden;background:#9aa3b2;box-shadow:inset 0 0 0 1px rgba(0,0,0,.07);touch-action:none}
.support-crop-stage canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none}.support-crop-stage canvas:active{cursor:grabbing}
.support-crop-empty,.support-output-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;color:#6b7280;padding:22px;background:rgba(249,250,251,.94)}
.support-crop-empty[hidden],.support-output-empty[hidden]{display:none}.support-crop-empty>[data-lucide],.support-output-empty>[data-lucide]{width:36px;height:36px;color:#9ca3af}.support-crop-empty small{font-size:.78rem}
.support-zoom-label{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;font-weight:800;font-size:.82rem;color:#344054}.support-zoom-label input{width:100%;accent-color:#0099ff}.support-drag-hint{display:flex;gap:7px;align-items:center;color:#667085;font-size:.76rem;margin:12px 0 0}.support-drag-hint>[data-lucide]{width:15px;height:15px;flex:0 0 auto}
.support-actions-panel{display:flex;flex-direction:column}.support-campaign-summary{background:linear-gradient(145deg,#061b38,#003f78);color:#fff;border-radius:18px;padding:20px;margin:4px 0 20px}.support-campaign-summary span{color:#6ed0ff;font-size:.68rem;font-weight:900;letter-spacing:.11em}.support-campaign-summary strong{display:block;font-size:1.5rem;line-height:1.08;margin:8px 0}.support-campaign-summary small{display:block;color:#cfe3f5}.support-actions-panel .button{margin-bottom:10px;display:flex;align-items:center;justify-content:center;gap:8px}.support-actions-panel .button>[data-lucide],.support-output-panel .button>[data-lucide]{width:18px;height:18px}.support-help{margin-top:auto;border-top:1px solid #e8edf3;padding-top:16px;display:flex;gap:10px;color:#667085}.support-help>[data-lucide]{width:20px;height:20px;color:#007acb;flex:0 0 auto}.support-help p{font-size:.79rem;line-height:1.55;margin:0}
.support-output-wrap{position:relative;width:100%;aspect-ratio:1;margin-bottom:16px;border:1.5px dashed #cbd5e1;border-radius:18px;overflow:hidden;background:#f8fafc}.support-output-wrap canvas{display:block;width:100%;height:100%;background:#fff}.support-output-empty{background:rgba(248,250,252,.98)}
.support-back-row{margin-top:24px}

@media(max-width:1050px){.campaign-feature-shell{grid-template-columns:1fr .72fr;gap:34px}.support-studio{grid-template-columns:1fr 1fr}.support-output-panel{grid-column:1/-1;max-width:620px;width:100%;justify-self:center}.campaign-countdown-board{grid-template-columns:1fr}}
@media(max-width:760px){
 .campaign-feature-section{padding:48px 0}.campaign-feature-shell{grid-template-columns:1fr;gap:28px}.campaign-feature-copy h2{font-size:clamp(2.35rem,12vw,4.2rem)}.campaign-feature-visual{order:-1}.campaign-feature-visual img{width:min(100%,390px);border-radius:20px;transform:none}.campaign-meta-grid{grid-template-columns:1fr 1fr}.campaign-meta-grid>div:last-child{grid-column:1/-1}.campaign-feature-actions{display:grid;grid-template-columns:1fr}.campaign-feature-actions .button{width:100%;justify-content:center}
 .campaign-countdown-board{padding:22px;border-radius:22px;gap:20px;transform:translateY(18px)}.campaign-countdown-grid{gap:7px}.campaign-countdown-grid>div{border-radius:14px;padding:16px 4px}.campaign-countdown-grid strong{font-size:clamp(1.6rem,9vw,2.5rem)}.campaign-countdown-grid span{font-size:.56rem;letter-spacing:.07em}
 .campaign-detail-grid{grid-template-columns:1fr}.campaign-list-grid{grid-template-columns:1fr 1fr}
 .support-studio{grid-template-columns:1fr;gap:16px}.support-output-panel{grid-column:auto;max-width:none}.support-editor-panel,.support-actions-panel,.support-output-panel{padding:18px;border-radius:20px}.support-privacy-note{margin-left:14px;margin-right:14px}.support-studio-section>.container.support-studio{padding-left:14px;padding-right:14px}.support-crop-stage{max-width:390px}
}
@media(max-width:480px){.campaign-meta-grid{grid-template-columns:1fr}.campaign-meta-grid>div:last-child{grid-column:auto}.campaign-list-grid{grid-template-columns:1fr}.campaign-countdown-board{margin-left:10px;margin-right:10px}.campaign-countdown-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.campaign-countdown-grid strong{font-size:1.65rem}.campaign-countdown-grid span{font-size:.49rem}.support-privacy-note{padding:15px}.support-file-control{padding:12px}.support-campaign-summary strong{font-size:1.3rem}}

/* =========================================================
   PHASE 37.3.1 — HOMEPAGE MISSION COUNTDOWN + SUPPORT ALERT
   ========================================================= */
.home-mission-homepage-section{position:relative;padding:34px 0 78px;background:linear-gradient(180deg,#fff 0%,#f5faff 58%,#eef7ff 100%);overflow:hidden}
.home-mission-homepage-section:before{content:"";position:absolute;inset:-160px -120px auto auto;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(255,153,0,.16),transparent 68%);pointer-events:none}
.home-mission-homepage-shell{position:relative;z-index:1}
.home-mission-support-alert{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px;align-items:center;padding:22px 24px;border-radius:24px;background:linear-gradient(125deg,#04172e 0%,#063d72 56%,#075f9d 100%);color:#fff;box-shadow:0 22px 55px rgba(0,50,100,.2);border:1px solid rgba(255,255,255,.1)}
.home-mission-support-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:17px;background:linear-gradient(145deg,#ff9900,#ffb62e);color:#04172e;box-shadow:0 8px 24px rgba(255,153,0,.26)}
.home-mission-support-icon [data-lucide],.home-mission-support-icon .ui-svg-icon{width:27px;height:27px}
.home-mission-support-kicker{display:block;color:#80d6ff;font-size:.69rem;font-weight:900;letter-spacing:.13em;margin-bottom:5px}
.home-mission-support-copy h2{margin:0 0 5px;color:#fff;font-size:clamp(1.35rem,2.5vw,2rem);line-height:1.08}
.home-mission-support-copy p{margin:0;color:#d8e9f8;font-size:.91rem;line-height:1.55;max-width:760px}
.home-mission-support-actions{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:245px}
.home-support-card-button{display:inline-flex!important;align-items:center;justify-content:center;gap:8px!important;background:linear-gradient(135deg,#ff9900,#ffb52a)!important;color:#04172e!important;border-color:transparent!important;font-weight:900!important;box-shadow:0 10px 26px rgba(255,153,0,.22)}
.home-support-card-button:hover{transform:translateY(-1px);filter:brightness(1.04)}
.home-support-card-button [data-lucide],.home-support-card-button .ui-svg-icon{width:18px;height:18px}
.home-mission-details-link{color:#d9efff;text-align:center;font-weight:800;font-size:.81rem;text-decoration:none}
.home-mission-details-link:hover{color:#fff}
.home-mission-countdown-board{transform:none;margin-top:16px;padding:27px 30px;border-radius:24px;background:#fff;box-shadow:0 18px 45px rgba(15,53,85,.12);border:1px solid #dcecf9}
.home-mission-countdown-board .campaign-countdown-head .eyebrow{color:#0087df}
.home-mission-countdown-board .campaign-countdown-grid>div{background:linear-gradient(145deg,#06172e,#0a2c4f);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 8px 20px rgba(5,30,55,.09)}
.home-mission-countdown-board .campaign-countdown-grid strong{color:#fff}
.home-mission-countdown-board .campaign-countdown-grid span{color:#ffad2d}
.home-mission-countdown-board.is-live .campaign-countdown-grid>div{background:linear-gradient(145deg,#06452f,#08734d)}
.home-mission-countdown-board.is-complete .campaign-countdown-grid>div{background:#273142}
@media(max-width:900px){.home-mission-support-alert{grid-template-columns:auto 1fr}.home-mission-support-actions{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-width:0}.home-mission-details-link{padding:0 8px}}
@media(max-width:620px){.home-mission-homepage-section{padding:24px 0 56px}.home-mission-support-alert{grid-template-columns:44px minmax(0,1fr);gap:13px;padding:17px 15px;border-radius:20px}.home-mission-support-icon{width:44px;height:44px;border-radius:14px}.home-mission-support-icon [data-lucide],.home-mission-support-icon .ui-svg-icon{width:23px;height:23px}.home-mission-support-kicker{font-size:.58rem;letter-spacing:.09em}.home-mission-support-copy h2{font-size:1.24rem}.home-mission-support-copy p{font-size:.82rem}.home-mission-support-actions{display:flex;grid-column:1/-1;flex-direction:column;gap:10px}.home-support-card-button{width:100%}.home-mission-countdown-board{margin-top:12px;padding:18px 12px;border-radius:20px}.home-mission-countdown-board .campaign-countdown-head{text-align:center}.home-mission-countdown-board .campaign-countdown-grid{gap:6px}.home-mission-countdown-board .campaign-countdown-grid>div{padding:14px 2px;border-radius:12px}.home-mission-countdown-board .campaign-countdown-grid strong{font-size:clamp(1.45rem,8vw,2rem)}.home-mission-countdown-board .campaign-countdown-grid span{font-size:.48rem;letter-spacing:.04em}}