/* SWG+ Figma polish layer
   Drop into /public_html/assets/css/ and load after the existing page CSS. */
:root{
  --swgp-bg:#050816;
  --swgp-bg-2:#0b1024;
  --swgp-panel:rgba(10,18,42,.78);
  --swgp-panel-strong:rgba(13,24,55,.92);
  --swgp-border:rgba(148,163,184,.18);
  --swgp-border-hot:rgba(56,189,248,.35);
  --swgp-text:#e5eefb;
  --swgp-muted:#9fb0cc;
  --swgp-blue:#38bdf8;
  --swgp-cyan:#22d3ee;
  --swgp-violet:#8b5cf6;
  --swgp-gold:#facc15;
  --swgp-green:#34d399;
  --swgp-red:#fb7185;
  --swgp-shadow:0 24px 80px rgba(0,0,0,.42);
  --swgp-soft-shadow:0 14px 42px rgba(2,8,23,.32);
  --swgp-radius:28px;
  --swgp-radius-sm:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  color:var(--swgp-text);
  background:
    radial-gradient(circle at 18% -8%, rgba(56,189,248,.28), transparent 34rem),
    radial-gradient(circle at 84% 8%, rgba(139,92,246,.22), transparent 32rem),
    radial-gradient(circle at 52% 110%, rgba(250,204,21,.08), transparent 28rem),
    linear-gradient(135deg,var(--swgp-bg),var(--swgp-bg-2) 48%,#020617);
  min-height:100vh;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.65), transparent 82%);
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(circle at 50% 0%, transparent 0, rgba(2,6,23,.2) 45%, rgba(2,6,23,.72) 100%);
}
.container,.dashboard-shell{
  width:min(1180px, calc(100% - 32px));
  margin-inline:auto;
}
.container,.start-here-page,.dashboard-shell{position:relative}
a{color:#7dd3fc;text-decoration:none;transition:color .2s ease, transform .2s ease, border-color .2s ease, background .2s ease}
a:hover{color:#fff}
button,input,select,textarea{font:inherit}
input,select,textarea{
  color:var(--swgp-text)!important;
  background:rgba(2,6,23,.52)!important;
  border:1px solid var(--swgp-border)!important;
  border-radius:16px!important;
  outline:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
input:focus,select:focus,textarea:focus{
  border-color:var(--swgp-border-hot)!important;
  box-shadow:0 0 0 4px rgba(56,189,248,.12)!important;
}
::placeholder{color:#718096!important}
.card,.hero-card,.status-card,.focus-card,.journey-card,.trust-card,.species-card,.donation-section,.map-card,
.broadcast-card,.community-card,.profile-card,.station-link-card,.alert,.tab-panel.is-active .card{
  position:relative;
  overflow:hidden;
  border:1px solid var(--swgp-border)!important;
  border-radius:var(--swgp-radius)!important;
  background:
    linear-gradient(145deg, rgba(15,23,42,.9), rgba(8,13,31,.72)) padding-box,
    linear-gradient(145deg, rgba(56,189,248,.36), rgba(139,92,246,.2), rgba(250,204,21,.16)) border-box!important;
  box-shadow:var(--swgp-soft-shadow)!important;
  backdrop-filter:blur(18px) saturate(145%);
}
.card::before,.hero-card::before,.status-card::before,.focus-card::before,.journey-card::before,.trust-card::before,.species-card::before,.donation-section::before,.map-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg, rgba(255,255,255,.14), transparent 34%, transparent 70%, rgba(56,189,248,.08));
  opacity:.55;
}
.card > *,.hero-card > *,.status-card > *,.focus-card > *,.journey-card > *,.trust-card > *,.species-card > *,.donation-section > *,.map-card > *{position:relative}
.card:hover,.hero-card:hover,.status-card:hover,.focus-card:hover,.journey-card:hover,.trust-card:hover,.species-card:hover{
  transform:translateY(-3px);
  border-color:rgba(56,189,248,.34)!important;
  box-shadow:0 24px 68px rgba(2,8,23,.45)!important;
}
h1,h2,h3{
  letter-spacing:-.035em;
  color:#f8fbff;
  text-wrap:balance;
}
p,li,.status-meta,.map-blurb,.biography{color:var(--swgp-muted)}
.kicker,.feature-badge,.species-badge,.value-chip,.station-link-chip,.status-online,.status-offline,.status-indicator,.button,.cta-links a,.quick-links a,.map-request-button,.cross-links a{
  border-radius:999px!important;
}
.button,.cta-links a,.quick-links a,.map-request-button,.cross-links a,.species-chip,.map-filter__clear{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:.78rem 1.05rem;
  color:#04111f!important;
  font-weight:800;
  border:1px solid rgba(125,211,252,.42)!important;
  background:linear-gradient(135deg,#67e8f9,#38bdf8 48%,#a78bfa)!important;
  box-shadow:0 14px 32px rgba(56,189,248,.18), inset 0 1px 0 rgba(255,255,255,.35);
}
.button:hover,.cta-links a:hover,.quick-links a:hover,.map-request-button:hover,.cross-links a:hover,.species-chip:hover,.map-filter__clear:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 44px rgba(56,189,248,.28), inset 0 1px 0 rgba(255,255,255,.45);
}
.cta-links .secondary,.quick-links a:nth-child(n+2),.cross-links a:first-child{
  color:#dbeafe!important;
  background:rgba(15,23,42,.74)!important;
}
.status-indicator.online,.status-online{color:#bbf7d0!important;background:rgba(52,211,153,.13)!important;border:1px solid rgba(52,211,153,.26)!important}
.status-indicator.offline,.status-offline{color:#fecdd3!important;background:rgba(251,113,133,.12)!important;border:1px solid rgba(251,113,133,.24)!important}
.status-indicator.unknown{color:#fde68a!important;background:rgba(250,204,21,.12)!important;border:1px solid rgba(250,204,21,.24)!important}
.status-grid,.hero-grid,.focus-grid,.species-grid,.journey-grid,.trust-grid,.layout-grid{
  gap:1rem!important;
}
.status-card,.hero-card,.focus-card,.journey-card,.trust-card,.card{padding:clamp(1rem,2vw,1.45rem)!important}
.species-section,.focus-section,.hero-grid,.status-grid,.donation-section,.tab-panels,.journey-grid,.trust-grid,.cross-links{margin-top:clamp(1.25rem,3vw,2.5rem)!important}
.species-header,.section-header{
  padding:clamp(1rem,2.4vw,1.6rem);
  border:1px solid var(--swgp-border);
  border-radius:var(--swgp-radius);
  background:linear-gradient(135deg, rgba(15,23,42,.68), rgba(8,13,31,.52));
  box-shadow:var(--swgp-soft-shadow);
}
.species-filters,.map-filter,.map-controls,.map-actions,.quick-links,.cta-links{
  border:1px solid var(--swgp-border);
  border-radius:22px;
  background:rgba(2,6,23,.34);
  padding:1rem;
}
.species-card img,.profile-card img,.planet-gallery__visual img{
  border-radius:20px!important;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 16px 38px rgba(0,0,0,.28);
}
.species-card strong{display:block;margin-top:.85rem;font-size:1.05rem;color:#fff}
.species-meta{font-size:.9rem}
.species-card.is-recommended{border-color:rgba(250,204,21,.38)!important;box-shadow:0 22px 58px rgba(250,204,21,.08)!important}
.species-badge,.feature-badge,.value-chip,.station-link-chip{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:.35rem .65rem;
  font-size:.76rem;
  font-weight:900;
  color:#fef3c7;
  background:rgba(250,204,21,.12);
  border:1px solid rgba(250,204,21,.26);
}
.dashboard-shell{padding:24px 0 48px}
.tab-panels{animation:swgpFade .32s ease both}
.server-status-list,.event-highlight,.status-meta{list-style:none;padding-left:0!important}
.server-status-list li,.status-meta li,.event-highlight li,.activity-log li{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:.8rem 0;
  border-bottom:1px solid rgba(148,163,184,.12);
}
.server-status-list li:last-child,.status-meta li:last-child,.event-highlight li:last-child{border-bottom:0}
.profile-card{display:grid!important;grid-template-columns:auto 1fr;gap:1.2rem;align-items:center}
.profile-card img{width:96px;height:96px;object-fit:cover}
.progress-track{height:10px;border-radius:999px;background:rgba(148,163,184,.18);overflow:hidden;margin-top:1rem}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--swgp-blue),var(--swgp-violet),var(--swgp-gold));border-radius:inherit}
.galaxy-map,.planet-gallery,.map-readout,.map-fallback{
  border-radius:24px!important;
  border:1px solid var(--swgp-border)!important;
  background:rgba(2,6,23,.38)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.alert{padding:1rem 1.15rem;margin:1rem 0;color:#dbeafe}
.alert-success{border-color:rgba(52,211,153,.3)!important;background:rgba(52,211,153,.1)!important}
.alert-error{border-color:rgba(251,113,133,.3)!important;background:rgba(251,113,133,.1)!important}
.start-here-page main{
  max-width:980px;
  margin:0 auto;
  padding:clamp(1rem,3vw,2rem) 0 4rem;
}
.breadcrumbs{
  width:max-content;
  max-width:100%;
  margin-bottom:1rem;
  padding:.65rem .9rem;
  border:1px solid var(--swgp-border);
  border-radius:999px;
  background:rgba(2,6,23,.42);
  color:var(--swgp-muted);
}
.start-here-page h1{font-size:clamp(2.5rem,7vw,5.25rem);line-height:.95;margin:.25rem 0 1rem;background:linear-gradient(135deg,#fff,#a5f3fc 48%,#fef08a);-webkit-background-clip:text;background-clip:text;color:transparent}
.start-here-page main>p{font-size:1.08rem;line-height:1.75}
@keyframes swgpFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (max-width:780px){
  .container,.dashboard-shell{width:min(100% - 20px,1180px)}
  .profile-card{grid-template-columns:1fr!important;text-align:left}
  .server-status-list li,.status-meta li,.event-highlight li{display:block}
  .cta-links,.quick-links,.cross-links{display:grid!important;grid-template-columns:1fr!important}
}