:root {
  --css-page:#10111b;
  --css-panel:#1d1b2a;
  --css-panel-raised:#292437;
  --css-line:#ffffff14;
  --css-ink:#f8f4ff;
  --css-muted:#c5bfd0;
  --css-lilac:#d8b0f3;
  --css-glow:#a86bdb;
  --css-ease:cubic-bezier(.2,.75,.2,1);
  --css-hero-image:url('/assets/southside-sunset.png');
}
body.ss-site { background:var(--css-page)!important; color:var(--css-ink)!important; }
.ss-site .ss-header {
  width:min(1480px,calc(100% - 36px))!important; max-width:1480px!important; min-height:68px!important; margin:14px auto 0!important; top:14px!important;
  padding:10px clamp(18px,3vw,34px)!important; border:1px solid #ffffff18!important;
  border-radius:17px!important; background:#171421d4!important; box-shadow:0 16px 46px #08071038!important;
  transition:background .25s var(--css-ease),box-shadow .25s var(--css-ease),border-color .25s var(--css-ease);
}
.ss-site .ss-header.has-scrolled { background:#171421f5!important; border-color:#d1a9ef33!important; box-shadow:0 20px 50px #07061188!important; }
.ss-site .ss-nav { gap:4px!important; }
.ss-site .ss-nav a:not(.nav-admin) { position:relative; border:0!important; border-radius:10px!important; }
.ss-site .ss-nav a:not(.nav-admin):after { content:""; position:absolute; left:17px; right:17px; bottom:5px; height:2px; border-radius:2px; background:var(--css-lilac); transform:scaleX(0); transition:transform .22s var(--css-ease); }
.ss-site .ss-nav a.is-active:after,.ss-site .ss-nav a:not(.nav-admin):hover:after { transform:scaleX(1); }
.ss-site .brand-word { font-size:18px!important; font-weight:850!important; letter-spacing:-.04em!important; }
.ss-site.home .ss-brand:before { content:""; flex:none; width:35px; height:35px; border-radius:9px; background:url('/assets/central-south-side-logo.png') center/cover no-repeat; box-shadow:0 3px 12px #0007; }
.ss-site .ss-brand .brand-logo { width:35px!important; height:35px!important; border-radius:9px!important; }
.ss-site .brand-word small { margin-top:2px; color:var(--css-lilac)!important; letter-spacing:.22em!important; }
.ss-site .ss-nav .nav-admin { padding:11px 17px!important; border-radius:10px!important; background:var(--css-lilac)!important; color:#211628!important; box-shadow:0 8px 24px #b37add31; font-weight:750; }
.ss-site .ss-nav .nav-admin:hover { background:#ebd0ff!important; transform:translateY(-2px); }
.site-account { position:relative; }
.account-menu summary { display:flex; align-items:center; gap:9px; padding:5px 10px 5px 5px; border:1px solid #ffffff1f; border-radius:11px; background:#ffffff0d; color:#f6edfa; cursor:pointer; list-style:none; font-size:13px; font-weight:700; }
.account-menu summary::-webkit-details-marker { display:none; }
.account-menu summary img { width:30px; height:30px; border-radius:8px; object-fit:cover; }
.account-menu-content { position:absolute; z-index:40; top:calc(100% + 10px); right:0; min-width:190px; padding:7px; border:1px solid #ffffff20; border-radius:12px; background:#241d31; box-shadow:0 22px 50px #080611bb; }
.account-menu-content a,.account-menu-content button { display:block; width:100%; padding:10px 12px; border:0; border-radius:8px; background:none; color:#f4eaf8; text-align:left; text-decoration:none; font:inherit; cursor:pointer; }
.account-menu-content a:hover,.account-menu-content button:hover { background:#ffffff12; }
.ss-site .ss-hero { min-height:680px!important; height:min(790px,calc(100svh - 82px))!important; margin-top:-82px; padding-top:160px!important; background:#10111b!important; }
.ss-site .ss-hero:before { background-image:linear-gradient(90deg,#0d0d17f7 0%,#17101dcf 40%,#17101d68 75%,#17101d8c),var(--css-hero-image)!important; background-position:center!important; background-size:cover!important; filter:saturate(.9)!important; }
.ss-site .ss-hero:after { background:radial-gradient(ellipse at 85% 45%,#b579ce3b,transparent 40%),linear-gradient(0deg,var(--css-page),transparent 26%)!important; }
.ss-site .ss-hero-content { max-width:780px!important; }
.ss-site .ss-hero h1 { font-size:clamp(52px,6.3vw,103px)!important; line-height:.98!important; letter-spacing:-.073em!important; }
.ss-site .ss-hero #site-hero-accent { color:var(--css-lilac)!important; -webkit-text-fill-color:var(--css-lilac)!important; }
.ss-site .hero-kicker { background:#d2a2f112!important; border:1px solid #d8acf447!important; border-radius:99px!important; padding:10px 16px!important; }
.ss-site .hero-lede { max-width:575px!important; font-size:18px!important; line-height:1.6!important; color:#e5dce9!important; }
.ss-site .hero-crest { display:none!important; }
.ss-site .button { border-radius:12px!important; min-height:52px!important; padding:14px 23px!important; font-size:13px!important; font-weight:750!important; transition:transform .22s var(--css-ease),box-shadow .22s var(--css-ease),background .22s var(--css-ease)!important; }
.ss-site .button.primary { background:linear-gradient(120deg,#e0b9fa,#b989e4)!important; border:1px solid #f0d6ff!important; color:#23172c!important; box-shadow:0 12px 32px #a466cf45!important; }
.ss-site .button:not(.primary) { background:#1d1926dd!important; border:1px solid #f3e2ff56!important; color:#faf3ff!important; }
.ss-site .button:hover { transform:translateY(-3px)!important; box-shadow:0 20px 36px #a466cf47!important; }
.ss-site .live-strip { max-width:1370px!important; position:relative; z-index:2; margin:-34px auto 22px!important; background:#211d2de8!important; border:1px solid #ffffff1d!important; border-radius:18px!important; box-shadow:0 25px 70px #09071288!important; backdrop-filter:blur(20px); }
.ss-site .live-item { border:0!important; }
.ss-site .live-item:not(:last-of-type) { border-right:1px solid #ffffff12!important; }
.ss-site .live-link { background:#b780de22!important; color:#f6ddff!important; }
.ss-site .ss-section { max-width:1390px!important; padding:96px 28px!important; border:0!important; }
.ss-site .ss-section+.ss-section { border-top:1px solid #ffffff0c!important; }
.ss-site .section-heading h2 { font-size:clamp(36px,4.5vw,66px)!important; line-height:1.03!important; letter-spacing:-.06em!important; }
.ss-site .section-heading>p { color:var(--css-muted)!important; }
.ss-site .start-grid { gap:16px!important; border:0!important; }
.ss-site :is(.start-card,.system-card,.faction-card,.partner-tile,.help-detail) { border:1px solid var(--css-line)!important; border-radius:18px!important; background:linear-gradient(155deg,#282334,#1b1a27 72%)!important; box-shadow:0 16px 40px #08071038!important; }
.ss-site .start-card,.ss-site .start-card:last-child { min-height:280px!important; padding:34px!important; }
.ss-site :is(.start-card,.system-card,.faction-card,.partner-tile):hover { transform:translateY(-5px)!important; border-color:#d9b5f559!important; box-shadow:0 25px 55px #08071075,0 0 30px #9e60cd18!important; }
.ss-site .step-label { display:block!important; width:auto!important; height:auto!important; background:none!important; border:0!important; color:var(--css-lilac)!important; font:750 38px/1 system-ui,sans-serif!important; letter-spacing:-.07em!important; }
.ss-site .system-index { color:var(--css-lilac)!important; }
.ss-site .support-panel { border:1px solid #e6baf944!important; border-radius:22px!important; background:radial-gradient(circle at 87% 18%,#a46acd40,transparent 42%),linear-gradient(125deg,#32253e,#201d2e)!important; box-shadow:0 26px 55px #0807106b!important; }
.ss-site .faq-list { display:grid; gap:12px; max-width:930px; }
.ss-site .faq-list .help-detail { padding:22px 26px!important; }
.ss-site .faq-list .help-detail summary { cursor:pointer; font-weight:750; color:#faf2ff; }
.ss-site .faq-list .help-detail p { color:var(--css-muted); line-height:1.6; margin:14px 0 0; }
.ss-site :focus-visible { outline:2px solid #e9c6ff!important; outline-offset:3px!important; }
@media(max-width:1000px) { .ss-site .ss-hero { margin-top:-82px; } .ss-site .ss-hero-content { max-width:680px!important; } }
@media(max-width:850px) { .ss-site .ss-header { width:calc(100% - 24px); margin-top:10px; } .ss-site .ss-nav.is-open { border:1px solid #ffffff1a!important; border-radius:14px!important; background:#1e1b2af7!important; } .ss-site .ss-hero { min-height:720px!important; height:auto!important; padding:170px 7vw 120px!important; } .ss-site .ss-hero:before { background-position:60% center!important; } .ss-site .live-strip { margin:0 12px!important; } .ss-site .start-grid { grid-template-columns:1fr!important; } .site-account { width:100%; } }
@media(max-width:560px) { .ss-site .ss-hero h1 { font-size:clamp(45px,12vw,68px)!important; } .ss-site .hero-lede { font-size:16px!important; } .ss-site .ss-section { padding:64px 20px!important; } .ss-site .live-item:not(:last-of-type) { border-right:0!important; border-bottom:1px solid #ffffff12!important; } }
@media(prefers-reduced-motion:reduce) { .ss-site *, .ss-site *:before, .ss-site *:after { animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important; } }

/* Editorial landing composition: shared controls retain the portal palette. */
.ss-site.home .ss-header { width:min(1120px,calc(100% - 40px))!important; }
.ss-site.home .ss-hero { height:min(920px,100svh)!important; min-height:760px!important; padding:150px max(7vw,calc((100vw - 1320px)/2)) 220px!important; align-items:center!important; }
.ss-site.home .ss-hero:before { background-image:linear-gradient(90deg,#10101bcf 0%,#15101b87 42%,#15101b20 80%),var(--css-hero-image)!important; filter:saturate(.78)!important; }
.ss-site.home .ss-hero:after { background:linear-gradient(0deg,#11111b9c,transparent 45%)!important; }
.ss-site.home .ss-hero-content { max-width:650px!important; }
.ss-site.home .ss-hero h1 { font-size:clamp(48px,4.8vw,76px)!important; line-height:1.04!important; letter-spacing:-.055em!important; max-width:650px!important; margin:24px 0!important; }
.ss-site.home .hero-kicker { padding:0!important; border:0!important; background:none!important; font-size:11px!important; letter-spacing:.19em!important; }
.ss-site.home .hero-lede { max-width:440px!important; font-size:16px!important; }
.ss-site.home .hero-actions { gap:12px!important; flex-wrap:wrap; }
.ss-site.home .hero-guide { display:none!important; }
.ss-site.home .hero-wordmark { position:absolute; z-index:1; bottom:-.035em; left:50%; transform:translateX(-50%); white-space:nowrap; color:#f5eafa33; font:850 clamp(92px,17.4vw,320px)/.8 system-ui,sans-serif; letter-spacing:-.075em; pointer-events:none; }
.ss-site.home .hero-community { position:absolute; right:max(7vw,calc((100vw - 1320px)/2)); bottom:230px; display:flex; align-items:center; gap:16px; width:310px; padding:23px; border-radius:18px; background:#ede4f0ed; color:#272031; text-decoration:none; box-shadow:0 16px 40px #0807102e; backdrop-filter:blur(16px); transition:transform .25s var(--css-ease),background .25s; }
.hero-community:hover { transform:translateY(-4px); background:#fff7ff!important; }
.hero-community small { display:block; font-size:9px; font-weight:750; letter-spacing:.14em; margin-bottom:9px; }
.hero-community strong { display:block; font-size:20px; line-height:1.15; letter-spacing:-.03em; }
.hero-community span>span { display:block; margin-top:9px; font-size:11px; opacity:.7; }
.community-orbit { flex:none; display:grid; place-items:center; width:45px; height:45px; border-radius:50%; background:#cab0df; font-size:23px; }
.ss-site.home .live-strip { width:min(1180px,calc(100% - 48px))!important; margin:24px auto 0!important; box-shadow:none!important; border:0!important; background:#1e1c29!important; }
.ss-site.home #einstieg { max-width:none!important; margin-top:28px; padding:80px max(7vw,calc((100vw - 1260px)/2)) 88px!important; color:#292132!important; background:#eee9f0!important; border-radius:28px 28px 0 0; }
.start-intro { text-align:center; margin:0 auto 65px; }
.ss-site.home .start-intro .eyebrow { color:#786186!important; font-size:10px!important; }
.start-intro>p:last-child { font-size:clamp(32px,4vw,58px); line-height:1.15; font-weight:650; letter-spacing:-.055em; margin:20px 0; }
.start-intro>p:last-child span { color:#8d709e; }
.ss-site.home #einstieg .section-heading h2 { font-size:clamp(28px,3vw,42px)!important; color:#292132!important; }
.ss-site.home #einstieg .section-heading>p { color:#6b6271!important; }
.ss-site.home #einstieg .eyebrow { color:#80618e!important; }
.ss-site.home #einstieg .start-grid { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px!important; }
.ss-site.home #einstieg .start-card { background:#fbf8fc!important; border:0!important; box-shadow:none!important; padding:28px!important; min-height:270px!important; border-radius:16px!important; }
.ss-site.home #einstieg .start-card h3 { color:#292132!important; font-size:20px!important; }
.ss-site.home #einstieg .start-card p { color:#6b6271!important; font-size:14px!important; }
.ss-site.home #einstieg .start-card .text-link { color:#70507f!important; font-size:13px!important; }
.ss-site.home #einstieg .step-label { color:#ab8dbb!important; font-size:28px!important; }
.ss-site.home .ss-section+.ss-section { border:0!important; }
.ss-site.home :is(.system-card,.faction-card,.partner-tile):before { display:none!important; }
@media(max-width:1100px) {
  .ss-site.home .hero-community { width:265px; right:5vw; bottom:180px; padding:19px; }
  .ss-site.home .ss-hero-content { max-width:58vw!important; }
}
@media(max-width:850px) {
  .ss-site.home .ss-header { width:calc(100% - 24px)!important; }
  .ss-site.home .ss-hero { height:auto!important; min-height:820px!important; padding:150px 7vw 330px!important; align-items:flex-start!important; }
  .ss-site.home .ss-hero-content { max-width:100%!important; }
  .ss-site.home .ss-hero:before { background-position:58% center!important; }
  .ss-site.home .hero-community { right:7vw; bottom:140px; width:280px; }
  .ss-site.home .hero-wordmark { font-size:17.4vw; bottom:25px; }
  .ss-site.home #einstieg .start-grid { grid-template-columns:1fr!important; }
  .ss-site.home #einstieg .start-card { min-height:0!important; }
  .ss-site.home #einstieg { padding:58px 24px!important; }
  .start-intro { margin-bottom:46px; }
}
@media(max-width:560px) {
  .ss-site.home .ss-hero { min-height:820px!important; padding-top:145px!important; }
  .ss-site.home .ss-hero h1 { font-size:clamp(42px,10vw,56px)!important; }
  .ss-site.home .hero-community { left:7vw; right:auto; bottom:135px; width:min(310px,86%); }
  .ss-site.home .live-strip { width:calc(100% - 24px)!important; }
}

.ss-site.home #einstieg .start-card:last-child { grid-column:auto!important; }
.ss-site.home #einstieg { margin-inline:0!important; }
.ss-site.home .hero-community { text-align:left!important; }
.ss-site.home #einstieg { width:100%!important; border-radius:28px 28px 0 0!important; }