/* Spirit Portal refinement pass: shared design language and elemental accents. */
:root{
  --sp-surface:rgba(15,21,25,.86);--sp-surface-2:rgba(22,29,34,.9);--sp-line:rgba(255,255,255,.105);
  --sp-shadow:0 18px 45px rgba(0,0,0,.24);--sp-radius:18px;--sp-fast:160ms ease;--sp-normal:240ms ease;
}
body{background:#10171a}
.site-header{box-shadow:0 8px 28px rgba(0,0,0,.18)}
.site-nav a,.site-button,.sp-button{transition:transform var(--sp-fast),background var(--sp-fast),border-color var(--sp-fast),color var(--sp-fast),box-shadow var(--sp-fast)}
.site-nav a:hover,.site-button:hover,.sp-button:hover{transform:translateY(-1px)}
.sp-card,.content-card,.guide-card,.event-card,.announcement-card{border-radius:var(--sp-radius)!important;border:1px solid var(--sp-line)!important;background:linear-gradient(155deg,var(--sp-surface-2),var(--sp-surface))!important;box-shadow:var(--sp-shadow);transition:transform var(--sp-normal),border-color var(--sp-normal),box-shadow var(--sp-normal)}
.sp-card:hover,.content-card:hover,.guide-card:hover,.event-card:hover,.announcement-card:hover{border-color:color-mix(in srgb,var(--accent) 34%,var(--sp-line))!important;box-shadow:0 22px 52px rgba(0,0,0,.29)}
.page-heading,.sp-banner{border-radius:22px!important}
.sp-section-heading h2,.page-heading h1{letter-spacing:-.02em}
.sp-section-heading{gap:1rem}
.sp-badge{border-radius:999px}
.dv2-empty-panel,.empty-state{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(255,255,255,.025),rgba(255,255,255,.01))}
.dv2-empty-panel:before,.empty-state:before{content:'☯';position:absolute;right:14px;bottom:-18px;font-size:4rem;opacity:.045}
.sp-toast-region{position:fixed;right:20px;bottom:20px;z-index:1000;display:grid;gap:10px;max-width:min(380px,calc(100vw - 40px))}
.sp-toast{padding:14px 16px;border:1px solid var(--sp-line);border-radius:14px;background:rgba(12,17,20,.96);box-shadow:0 18px 50px rgba(0,0,0,.38);animation:spToastIn .22s ease both}
.sp-toast strong{display:block;margin-bottom:3px}.sp-toast span{color:var(--muted);font-size:.9rem}.sp-toast--success{border-color:rgba(108,198,164,.45)}.sp-toast--error{border-color:rgba(225,120,80,.5)}
@keyframes spToastIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Spirit Portal Navigation v2 and shared component primitives */
:root{--sp-surface:rgba(19,27,36,.96);--sp-surface-2:rgba(25,35,47,.98);--sp-border:rgba(255,255,255,.11);--sp-radius:16px;--sp-shadow:0 18px 48px rgba(0,0,0,.32)}
.sp-card{background:linear-gradient(145deg,var(--sp-surface-2),var(--sp-surface));border:1px solid var(--sp-border);border-radius:var(--sp-radius);box-shadow:var(--sp-shadow)}
.sp-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:0 1rem;border:1px solid transparent;border-radius:12px;font:inherit;font-weight:800;text-decoration:none;cursor:pointer}
.sp-button--primary{color:#15191d;background:var(--accent)}.sp-button--secondary{color:var(--ink);border-color:var(--sp-border);background:rgba(255,255,255,.05)}
.sp-badge{display:inline-flex;align-items:center;justify-content:center;min-height:1.4rem;padding:0 .45rem;border-radius:999px;font-size:.72rem;font-weight:900;background:var(--accent);color:#15191d}
.sp-icon-button{display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid var(--sp-border);border-radius:12px;color:var(--ink);background:rgba(255,255,255,.045);cursor:pointer}
.sp-icon-button:hover,.sp-profile-button:hover{border-color:rgba(216,169,75,.35);background:rgba(255,255,255,.08)}
.site-header.sp-nav-shell{min-height:72px;padding:10px clamp(16px,3vw,44px);display:grid;grid-template-columns:minmax(220px,1fr) auto minmax(220px,1fr);gap:20px;background:rgba(8,12,16,.82);border-bottom:1px solid rgba(255,255,255,.09);box-shadow:0 10px 34px rgba(0,0,0,.22);backdrop-filter:blur(20px) saturate(130%)}
.sp-nav-left{display:flex;align-items:center;min-width:0}.sp-brand{min-width:0}.sp-brand-copy{min-width:0}.sp-brand-copy strong,.sp-brand-copy small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-primary-nav{justify-self:center;gap:2px}.sp-primary-nav a{position:relative;padding:12px 14px;border-radius:10px;background:transparent;color:var(--muted);font-weight:700}
.sp-primary-nav a:after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:99px;background:var(--accent);transform:scaleX(0);transform-origin:center;transition:transform .2s ease}
.sp-primary-nav a:hover,.sp-primary-nav a.active{color:var(--ink);background:rgba(255,255,255,.045)}.sp-primary-nav a.active:after{transform:scaleX(1)}
.sp-primary-nav .sp-nav-login{color:#15191d;background:var(--accent)}.sp-primary-nav .sp-nav-login:after{display:none}
.sp-nav-actions{justify-self:end;display:flex;align-items:center;gap:8px}.sp-nav-menu{position:relative}.sp-notification-button{position:relative}
.sp-notification-badge{position:absolute;top:-5px;right:-6px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:2px solid #0d1319;border-radius:999px;background:var(--accent);color:#12171c;font-size:.65rem;font-weight:900;animation:spBadgeIn .25s ease-out}
@keyframes spBadgeIn{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}
.sp-profile-button{display:flex;align-items:center;gap:9px;min-height:44px;padding:4px 10px 4px 5px;border:1px solid var(--sp-border);border-radius:14px;color:var(--ink);background:rgba(255,255,255,.045);cursor:pointer}.sp-avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(145deg,var(--accent),var(--accent-2));color:#111820;font-weight:900}.sp-avatar.large{width:42px;height:42px}.sp-profile-name{max-width:130px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:800}.sp-profile-chevron{color:var(--muted)}
.sp-nav-dropdown{position:absolute;right:0;top:calc(100% + 10px);z-index:70;width:min(360px,calc(100vw - 24px));overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:linear-gradient(145deg,rgba(28,39,52,.99),rgba(14,21,30,.995));box-shadow:0 24px 70px rgba(0,0,0,.48);transform-origin:top right;animation:spMenuIn .16s ease-out}.sp-nav-dropdown[hidden]{display:none!important}@keyframes spMenuIn{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
.sp-dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:15px 16px;border-bottom:1px solid var(--sp-border)}.sp-dropdown-header span{color:var(--muted);font-size:.78rem}.sp-notification-preview-list{max-height:360px;overflow:auto}.sp-notification-preview{display:grid;gap:4px;padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.07);text-decoration:none}.sp-notification-preview:hover{background:rgba(255,255,255,.045)}.sp-notification-preview.unread{box-shadow:inset 3px 0 var(--accent)}.sp-notification-preview strong{font-size:.9rem}.sp-notification-preview span{color:var(--muted);font-size:.8rem;line-height:1.45}.sp-dropdown-empty{padding:24px 16px;color:var(--muted);text-align:center}.sp-dropdown-footer{display:block;padding:13px 16px;color:var(--accent);font-weight:800;text-align:center;text-decoration:none;background:rgba(255,255,255,.025)}
.sp-profile-dropdown{width:260px;padding:8px}.sp-profile-summary{display:flex;align-items:center;gap:11px;padding:10px 9px 14px;border-bottom:1px solid var(--sp-border);margin-bottom:5px}.sp-profile-summary span:last-child{display:grid}.sp-profile-summary small{color:var(--muted);font-size:.74rem}.sp-profile-dropdown>a{display:flex;padding:10px 11px;border-radius:10px;color:var(--ink);text-decoration:none;font-weight:700}.sp-profile-dropdown>a:hover{background:rgba(255,255,255,.055)}.sp-dropdown-divider{height:1px;margin:5px 4px;background:var(--sp-border)}.sp-profile-dropdown .sp-logout-link{color:#f1a5a5}
.sp-mobile-scrim{display:none}
@media(max-width:980px){.site-header.sp-nav-shell{grid-template-columns:1fr auto}.sp-brand-copy small{display:none}.sp-primary-nav{position:fixed;top:0;left:0;z-index:90;width:min(330px,86vw);height:100dvh;padding:90px 18px 24px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:5px;background:linear-gradient(180deg,#111a24,#0c1219);border-right:1px solid var(--sp-border);box-shadow:24px 0 60px rgba(0,0,0,.42);transform:translateX(-105%);transition:transform .22s ease}.sp-primary-nav.open{transform:translateX(0)}.sp-primary-nav a{width:100%;padding:13px 14px}.sp-primary-nav a:after{left:14px;right:auto;width:3px;height:auto;top:10px;bottom:10px;transform:scaleY(0)}.sp-primary-nav a.active:after{transform:scaleY(1)}.nav-toggle{display:grid;position:relative;z-index:100;margin-right:8px}.sp-mobile-scrim{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.56);backdrop-filter:blur(3px)}.sp-mobile-scrim:not([hidden]){display:block}.sp-nav-actions{grid-column:2}.sp-profile-name,.sp-profile-chevron{display:none}.sp-profile-button{width:44px;padding:4px}.sp-profile-dropdown{right:0}}
@media(max-width:560px){.site-header.sp-nav-shell{min-height:64px;padding:8px 12px;gap:8px}.brand-mark{width:38px;height:38px}.sp-brand-copy strong{font-size:1rem}.sp-nav-actions{gap:5px}.sp-icon-button,.sp-profile-button{width:40px;height:40px;min-height:40px}.sp-avatar{width:31px;height:31px}.sp-notification-dropdown{position:fixed;top:68px;left:12px;right:12px;width:auto}.sp-profile-dropdown{position:fixed;top:68px;right:12px;width:min(260px,calc(100vw - 24px))}}


/* Navigation toggle and mobile drawer repair. */
.nav-toggle.sp-icon-button{display:none}
.sp-mobile-nav-heading{display:none}
@media(max-width:980px){
  .nav-toggle.sp-icon-button{display:grid}
  .sp-primary-nav{overflow-y:auto;-webkit-overflow-scrolling:touch}
  .sp-mobile-nav-heading{display:flex;align-items:center;gap:12px;margin:-70px 0 22px;padding:0 2px 18px;border-bottom:1px solid var(--sp-border)}
  .sp-mobile-nav-heading .brand-mark{flex:0 0 auto;width:40px;height:40px}
  .sp-mobile-nav-heading span:last-child{display:grid;gap:2px;min-width:0}
  .sp-mobile-nav-heading strong{font-family:Georgia,serif;font-size:1.05rem;color:var(--ink)}
  .sp-mobile-nav-heading small{color:var(--muted);font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sp-primary-nav a{display:block;color:var(--ink);text-align:left}
}
@media(min-width:981px){
  .sp-mobile-scrim{display:none!important}
  .sp-primary-nav{transform:none!important}
}


/* Mobile navigation state repair v2. */
@media (max-width:980px){
  html.sp-mobile-nav-open,body.sp-mobile-nav-open{overflow:hidden!important}
  #siteNavigation.sp-primary-nav{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
  #siteNavigation.sp-primary-nav.open{transform:translate3d(0,0,0)!important}
  .nav-toggle[data-sp-nav-toggle]{touch-action:manipulation;pointer-events:auto!important}
  .sp-mobile-scrim:not([hidden]){display:block!important;pointer-events:auto}
}
@media (min-width:981px){
  #siteNavigation.sp-primary-nav{transform:none!important}
}

/* Mobile navigation stacking repair v3.
   The scrim is outside the sticky header. Because backdrop-filter creates a
   stacking context, the scrim could render above the drawer even when the
   drawer's own z-index was higher. Keep the active header/drawer above the
   scrim and use a non-blurring overlay. */
@media (max-width:980px){
  html.sp-mobile-nav-open .site-header.sp-nav-shell,
  body.sp-mobile-nav-open .site-header.sp-nav-shell{
    z-index:200!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  #siteNavigation.sp-primary-nav{
    z-index:220!important;
    filter:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    isolation:isolate;
    background:#101923!important;
  }

  .sp-mobile-scrim,
  .sp-mobile-scrim:not([hidden]){
    z-index:150!important;
    background:rgba(2,6,10,.76)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    filter:none!important;
  }

  .nav-toggle[data-sp-nav-toggle]{z-index:230!important}
}