/* =========================================================
   GERBANG SISTEM SUNYI / ATLAS GATEWAY
   Clean Final CSS + Editorial Premium Lift
   Root: #sistem-sunyi-atlas
   Prefix: ssa-
   Dynamic content: #sunyi-* sections
   TagDiv Newspaper Safe
========================================================= */


/* =========================================================
   01. GLOBAL SAFETY
========================================================= */

html{
  scroll-behavior:smooth;
}

body{
  overflow-x:hidden;
}

#sistem-sunyi-atlas,
#sistem-sunyi-atlas *,
#sistem-sunyi-atlas *::before,
#sistem-sunyi-atlas *::after{
  box-sizing:border-box !important;
}


/* =========================================================
   02. ROOT TOKENS
========================================================= */

#sistem-sunyi-atlas{
  --ssa-bg:#06101b;
  --ssa-bg-2:#0b1826;
  --ssa-bg-3:#101f2c;

  --ssa-text:#f2efe7;
  --ssa-text-strong:#fff7e7;
  --ssa-muted:rgba(242,239,231,.74);
  --ssa-soft:rgba(242,239,231,.56);
  --ssa-faint:rgba(242,239,231,.40);

  --ssa-card:rgba(255,255,255,.060);
  --ssa-card-2:rgba(255,255,255,.088);
  --ssa-card-3:rgba(255,255,255,.036);
  --ssa-panel:rgba(8,20,32,.78);
  --ssa-panel-solid:#0b1826;

  --ssa-line:rgba(184,210,232,.14);
  --ssa-line-soft:rgba(184,210,232,.085);
  --ssa-line-strong:rgba(200,167,90,.38);

  --ssa-gold:#c8a75a;
  --ssa-gold-2:#e2c77f;
  --ssa-gold-soft:rgba(200,167,90,.16);

  --ssa-blue:#88b9df;
  --ssa-blue-soft:rgba(88,136,174,.16);

  --ssa-green:#89c6a4;
  --ssa-green-soft:rgba(137,198,164,.12);

  --ssa-red:#a94c42;
  --ssa-red-soft:rgba(169,76,66,.14);

  --ssa-purple:#b9a1ea;
  --ssa-purple-soft:rgba(185,161,234,.12);

  --ssa-radius-xl:34px;
  --ssa-radius-lg:26px;
  --ssa-radius-md:18px;
  --ssa-radius-sm:14px;

  --ssa-max:1180px;
  --ssa-shadow:0 28px 88px rgba(0,0,0,.30);
  --ssa-shadow-deep:0 34px 104px rgba(0,0,0,.40);
  --ssa-shadow-soft:0 18px 54px rgba(0,0,0,.18);

  position:relative !important;
  width:100% !important;
  min-height:100vh !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  isolation:isolate !important;

  font-family:Inter, "Lato", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size:16px !important;
  line-height:1.68 !important;
  color:var(--ssa-text) !important;

  background:
    radial-gradient(circle at 14% 0%, rgba(88,136,174,.24), transparent 34%),
    radial-gradient(circle at 84% 10%, rgba(200,167,90,.13), transparent 34%),
    radial-gradient(circle at 50% 100%, rgba(137,198,164,.055), transparent 38%),
    linear-gradient(90deg, rgba(200,167,90,.014) 0 1px, transparent 1px 100%),
    linear-gradient(145deg,#050a12 0%, var(--ssa-bg) 44%, #102132 100%) !important;
  background-size:auto, auto, auto, 58px 58px, auto !important;
}

#sistem-sunyi-atlas[data-theme="light"],
#sistem-sunyi-atlas.ssa-light{
  --ssa-bg:#f8f3ea;
  --ssa-bg-2:#f1eadf;
  --ssa-bg-3:#e9edf0;

  --ssa-text:#182332;
  --ssa-text-strong:#0d1723;
  --ssa-muted:rgba(24,35,50,.72);
  --ssa-soft:rgba(24,35,50,.56);
  --ssa-faint:rgba(24,35,50,.40);

  --ssa-card:rgba(255,255,255,.70);
  --ssa-card-2:rgba(255,255,255,.88);
  --ssa-card-3:rgba(255,255,255,.56);
  --ssa-panel:rgba(255,255,255,.78);
  --ssa-panel-solid:#ffffff;

  --ssa-line:rgba(80,58,30,.13);
  --ssa-line-soft:rgba(80,58,30,.08);
  --ssa-line-strong:rgba(142,101,45,.36);

  --ssa-gold:#9f7430;
  --ssa-gold-2:#745220;
  --ssa-gold-soft:rgba(159,116,48,.12);

  --ssa-blue:#2f678f;
  --ssa-blue-soft:rgba(47,103,143,.11);

  --ssa-green:#36774f;
  --ssa-green-soft:rgba(54,119,79,.10);

  --ssa-red:#9b3831;
  --ssa-red-soft:rgba(155,56,49,.10);

  --ssa-purple:#604f91;
  --ssa-purple-soft:rgba(96,79,145,.10);

  --ssa-shadow:0 24px 70px rgba(30,35,44,.12);
  --ssa-shadow-deep:0 28px 76px rgba(30,35,44,.13);
  --ssa-shadow-soft:0 16px 46px rgba(30,35,44,.09);

  color:var(--ssa-text) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(47,103,143,.12), transparent 34%),
    radial-gradient(circle at 84% 10%, rgba(159,116,48,.13), transparent 34%),
    radial-gradient(circle at 50% 100%, rgba(54,119,79,.045), transparent 38%),
    linear-gradient(90deg, rgba(159,116,48,.014) 0 1px, transparent 1px 100%),
    linear-gradient(145deg,#fbf7ef 0%, #f4ede2 48%, #e9eef2 100%) !important;
  background-size:auto, auto, auto, 58px 58px, auto !important;
}


/* =========================================================
   03. TAGDIV AND TYPOGRAPHY GUARD
========================================================= */

#sistem-sunyi-atlas h1,
#sistem-sunyi-atlas h2,
#sistem-sunyi-atlas h3,
#sistem-sunyi-atlas h4,
#sistem-sunyi-atlas p,
#sistem-sunyi-atlas a,
#sistem-sunyi-atlas span,
#sistem-sunyi-atlas small,
#sistem-sunyi-atlas strong,
#sistem-sunyi-atlas b,
#sistem-sunyi-atlas em,
#sistem-sunyi-atlas button,
#sistem-sunyi-atlas div,
#sistem-sunyi-atlas section,
#sistem-sunyi-atlas article,
#sistem-sunyi-atlas aside,
#sistem-sunyi-atlas nav,
#sistem-sunyi-atlas footer{
  font-family:inherit !important;
  text-shadow:none !important;
  box-shadow:none;
}

#sistem-sunyi-atlas a,
#sistem-sunyi-atlas a:link,
#sistem-sunyi-atlas a:visited,
#sistem-sunyi-atlas a:hover,
#sistem-sunyi-atlas a:active{
  color:inherit !important;
  text-decoration:none !important;
  outline:none !important;
}

#sistem-sunyi-atlas img{
  max-width:100% !important;
  height:auto !important;
  border:0 !important;
  box-shadow:none !important;
}

#sistem-sunyi-atlas h1,
#sistem-sunyi-atlas h2,
#sistem-sunyi-atlas h3{
  margin:0 !important;
  color:var(--ssa-text-strong) !important;
  font-family:Georgia, "Times New Roman", serif !important;
  font-weight:560 !important;
  text-transform:none !important;
  text-wrap:balance !important;
}

#sistem-sunyi-atlas h1{
  max-width:760px !important;
  font-size:clamp(3.2rem, 7vw, 5.35rem) !important;
  line-height:.94 !important;
  letter-spacing:-.065em !important;
}

#sistem-sunyi-atlas h2{
  font-size:clamp(2rem, 3.55vw, 3.05rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.052em !important;
}

#sistem-sunyi-atlas h3{
  font-size:clamp(1.35rem, 2.1vw, 1.72rem) !important;
  line-height:1.14 !important;
  letter-spacing:-.034em !important;
}

#sistem-sunyi-atlas p{
  margin:0 !important;
  color:var(--ssa-muted) !important;
  text-wrap:pretty !important;
}

#sistem-sunyi-atlas .ssa-shell{
  width:min(var(--ssa-max), calc(100% - 44px)) !important;
  margin:0 auto !important;
  padding:0 !important;
  position:relative !important;
  z-index:2 !important;
}


/* =========================================================
   04. DECORATIVE BACKGROUND
========================================================= */

#sistem-sunyi-atlas .ssa-bg{
  position:fixed !important;
  inset:0 !important;
  z-index:-2 !important;
  overflow:hidden !important;
  pointer-events:none !important;
}

#sistem-sunyi-atlas .ssa-bg::before{
  content:"" !important;
  position:absolute !important;
  width:min(86vw, 920px) !important;
  height:min(86vw, 920px) !important;
  left:50% !important;
  top:8% !important;
  transform:translateX(-50%) !important;
  border-radius:50% !important;
  background:
    radial-gradient(circle, rgba(184,210,232,.075), transparent 43%),
    repeating-radial-gradient(circle, rgba(200,167,90,.085) 0 1px, transparent 1px 82px) !important;
  opacity:.68 !important;
}

#sistem-sunyi-atlas .ssa-bg-orbit{
  position:absolute !important;
  left:50% !important;
  top:14% !important;
  transform:translateX(-50%) !important;
  border:1px solid rgba(184,210,232,.10) !important;
  border-radius:50% !important;
}

#sistem-sunyi-atlas .ssa-bg-orbit-1{
  width:380px !important;
  height:380px !important;
  opacity:.28 !important;
}

#sistem-sunyi-atlas .ssa-bg-orbit-2{
  width:600px !important;
  height:600px !important;
  opacity:.20 !important;
}

#sistem-sunyi-atlas .ssa-bg-orbit-3{
  width:850px !important;
  height:850px !important;
  opacity:.12 !important;
}

#sistem-sunyi-atlas .ssa-bg-noise{
  position:absolute !important;
  inset:0 !important;
  opacity:.075 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px) !important;
  background-size:82px 82px !important;
  mask-image:radial-gradient(circle at center, black, transparent 72%) !important;
}


/* =========================================================
   05. TOPBAR
========================================================= */

#sistem-sunyi-atlas .ssa-atlas-topbar{
  position:relative !important;
  z-index:40 !important;
  padding:22px 0 8px !important;
}

#sistem-sunyi-atlas .ssa-atlas-topbar-inner{
  width:min(var(--ssa-max), calc(100% - 44px)) !important;
  margin:0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
}

#sistem-sunyi-atlas .ssa-atlas-topbar-left,
#sistem-sunyi-atlas .ssa-atlas-topbar-right{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:10px !important;
}

#sistem-sunyi-atlas .ssa-atlas-toplink,
#sistem-sunyi-atlas .ssa-atlas-topbrand{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:36px !important;
  padding:8px 13px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.052) !important;
  color:var(--ssa-muted) !important;
  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
  font-size:.74rem !important;
  font-weight:900 !important;
  line-height:1.2 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  transition:
    transform .24s ease,
    background .24s ease,
    color .24s ease,
    border-color .24s ease !important;
}

#sistem-sunyi-atlas .ssa-atlas-topbrand{
  color:var(--ssa-gold) !important;
  border-color:var(--ssa-line-strong) !important;
  background:var(--ssa-gold-soft) !important;
}

#sistem-sunyi-atlas .ssa-atlas-toplink:hover{
  transform:translateY(-2px) !important;
  border-color:var(--ssa-line-strong) !important;
  background:var(--ssa-gold-soft) !important;
  color:var(--ssa-text-strong) !important;
}


/* =========================================================
   06. FLOATING MODE TOGGLE FROM OLD JS
========================================================= */

#ssa-mode-toggle,
body > #ssa-mode-toggle{
  position:fixed !important;
  right:22px !important;
  bottom:22px !important;
  z-index:999999 !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;

  min-height:44px !important;
  padding:0 16px !important;

  border:1px solid rgba(246,234,208,.16) !important;
  border-radius:999px !important;
  background:rgba(7,16,26,.86) !important;
  color:#f2ead8 !important;

  font-family:Inter, "Lato", system-ui, sans-serif !important;
  font-size:.82rem !important;
  font-weight:850 !important;
  line-height:1 !important;
  letter-spacing:.02em !important;

  cursor:pointer !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;

  box-shadow:0 16px 48px rgba(0,0,0,.28) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
}

#ssa-mode-toggle[data-active-theme="light"],
body > #ssa-mode-toggle[data-active-theme="light"]{
  border-color:rgba(80,58,30,.14) !important;
  background:rgba(255,255,255,.90) !important;
  color:#182332 !important;
  box-shadow:0 16px 44px rgba(30,35,44,.14) !important;
}


/* =========================================================
   07. HERO
========================================================= */

#sistem-sunyi-atlas .ssa-hero{
  position:relative !important;
  min-height:calc(100vh - 66px) !important;
  display:flex !important;
  align-items:center !important;
  padding:78px 0 86px !important;
  overflow:hidden !important;
}

#sistem-sunyi-atlas .ssa-hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    radial-gradient(circle at 15% 14%, rgba(200,167,90,.12), transparent 31%),
    radial-gradient(circle at 76% 20%, rgba(88,136,174,.22), transparent 35%),
    linear-gradient(90deg, rgba(5,10,18,.48), transparent 50%, rgba(5,10,18,.38)) !important;
  pointer-events:none !important;
}

#sistem-sunyi-atlas .ssa-hero::after{
  content:"" !important;
  position:absolute !important;
  inset:28px !important;
  border:1px solid rgba(200,167,90,.13) !important;
  border-radius:38px !important;
  pointer-events:none !important;
  opacity:.78 !important;
}

#sistem-sunyi-atlas .ssa-hero-grid{
  position:relative !important;
  z-index:2 !important;
  display:grid !important;
  grid-template-columns:minmax(0, 1.04fr) minmax(330px, .76fr) !important;
  gap:54px !important;
  align-items:center !important;
}

#sistem-sunyi-atlas .ssa-hero-copy{
  position:relative !important;
  z-index:2 !important;
}

#sistem-sunyi-atlas .ssa-brandline{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 0 22px !important;
  padding:7px 12px 7px 8px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.052) !important;
  color:var(--ssa-muted) !important;
  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
  font-size:.76rem !important;
  font-weight:850 !important;
}

#sistem-sunyi-atlas .ssa-logo{
  width:30px !important;
  height:30px !important;
  border-radius:999px !important;
  object-fit:cover !important;
}

#sistem-sunyi-atlas .ssa-kicker{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 0 16px !important;
  color:var(--ssa-gold) !important;
  font-size:.76rem !important;
  font-weight:950 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
}

#sistem-sunyi-atlas .ssa-kicker::before{
  content:"" !important;
  width:34px !important;
  height:1px !important;
  background:var(--ssa-gold) !important;
}

#sistem-sunyi-atlas .ssa-subtitle{
  max-width:750px !important;
  margin:24px 0 0 !important;
  color:var(--ssa-text-strong) !important;
  font-family:Georgia, "Times New Roman", serif !important;
  font-size:clamp(1.28rem, 2.2vw, 1.82rem) !important;
  line-height:1.32 !important;
  letter-spacing:-.034em !important;
}

#sistem-sunyi-atlas .ssa-lead{
  max-width:760px !important;
  margin:22px 0 0 !important;
  font-size:clamp(1rem, 1.24vw, 1.12rem) !important;
  line-height:1.82 !important;
}

#sistem-sunyi-atlas .ssa-cta-row,
#sistem-sunyi-atlas .ssa-inline-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:12px !important;
}

#sistem-sunyi-atlas .ssa-cta-row{
  margin-top:34px !important;
}

#sistem-sunyi-atlas .ssa-inline-actions{
  margin-top:28px !important;
}

#sistem-sunyi-atlas .ssa-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:46px !important;
  padding:0 18px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.060) !important;
  color:var(--ssa-text-strong) !important;
  backdrop-filter:blur(14px) !important;
  -webkit-backdrop-filter:blur(14px) !important;
  font-size:.86rem !important;
  font-weight:850 !important;
  line-height:1.2 !important;
  transition:
    transform .24s ease,
    background .24s ease,
    color .24s ease,
    border-color .24s ease,
    box-shadow .24s ease !important;
}

#sistem-sunyi-atlas .ssa-btn:hover{
  transform:translateY(-2px) !important;
  border-color:var(--ssa-line-strong) !important;
  box-shadow:0 16px 42px rgba(200,167,90,.12) !important;
}

#sistem-sunyi-atlas .ssa-btn-primary{
  background:linear-gradient(135deg,#b99150,#e2c77f) !important;
  border-color:rgba(255,255,255,.16) !important;
  color:#17110a !important;
  box-shadow:0 16px 42px rgba(200,167,90,.18) !important;
}


/* =========================================================
   08. HERO PANEL
========================================================= */

#sistem-sunyi-atlas .ssa-hero-panel{
  position:relative !important;
  overflow:hidden !important;
  min-height:520px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  padding:34px !important;
  border:1px solid var(--ssa-line-strong) !important;
  border-radius:var(--ssa-radius-xl) !important;
  background:
    radial-gradient(circle at 50% 22%, rgba(200,167,90,.16), transparent 35%),
    radial-gradient(circle at 12% 80%, rgba(88,136,174,.14), transparent 35%),
    linear-gradient(145deg, rgba(255,255,255,.074), rgba(255,255,255,.028)) !important;
  box-shadow:var(--ssa-shadow-deep) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
}

#sistem-sunyi-atlas .ssa-hero-panel::before{
  content:"" !important;
  position:absolute !important;
  inset:22px !important;
  border:1px solid rgba(200,167,90,.14) !important;
  border-radius:28px !important;
  pointer-events:none !important;
}

#sistem-sunyi-atlas .ssa-orbit-mark{
  position:absolute !important;
  inset:42px !important;
  border-radius:50% !important;
  pointer-events:none !important;
}

#sistem-sunyi-atlas .ssa-orbit-mark span{
  position:absolute !important;
  inset:50% !important;
  transform:translate(-50%, -50%) !important;
  border:1px solid rgba(200,167,90,.15) !important;
  border-radius:50% !important;
}

#sistem-sunyi-atlas .ssa-orbit-mark span:nth-child(1){
  width:120px !important;
  height:120px !important;
}

#sistem-sunyi-atlas .ssa-orbit-mark span:nth-child(2){
  width:210px !important;
  height:210px !important;
}

#sistem-sunyi-atlas .ssa-orbit-mark span:nth-child(3){
  width:310px !important;
  height:310px !important;
}

#sistem-sunyi-atlas .ssa-orbit-mark span:nth-child(4){
  width:410px !important;
  height:410px !important;
}

#sistem-sunyi-atlas .ssa-panel-content,
#sistem-sunyi-atlas .ssa-qotd{
  position:relative !important;
  z-index:2 !important;
}

#sistem-sunyi-atlas .ssa-panel-label{
  margin:0 0 10px !important;
  color:var(--ssa-gold) !important;
  font-size:.72rem !important;
  font-weight:950 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
}

#sistem-sunyi-atlas .ssa-panel-content h2{
  max-width:360px !important;
  font-size:clamp(2rem, 3.1vw, 2.8rem) !important;
  line-height:1.06 !important;
}

#sistem-sunyi-atlas .ssa-panel-content p{
  max-width:410px !important;
  margin-top:18px !important;
  font-size:.98rem !important;
  line-height:1.78 !important;
}

#sistem-sunyi-atlas .ssa-qotd{
  padding:20px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.052) !important;
}

#sistem-sunyi-atlas .ssa-qotd p{
  color:var(--ssa-text-strong) !important;
  font-family:Georgia, "Times New Roman", serif !important;
  font-size:1.28rem !important;
  line-height:1.34 !important;
  letter-spacing:-.030em !important;
}

#sistem-sunyi-atlas .ssa-qotd span{
  display:block !important;
  margin-top:12px !important;
  color:var(--ssa-gold) !important;
  font-size:.78rem !important;
  font-weight:850 !important;
}


/* =========================================================
   09. GEMA TERBARU
   Dynamic content via loadLatest() into #resonansi-scroll
========================================================= */

#sistem-sunyi-atlas .ssa-latest{
  position:relative !important;
  z-index:5 !important;
  margin-top:-42px !important;
  padding:0 0 34px !important;
}

#sistem-sunyi-atlas .ssa-latest-shell{
  display:grid !important;
  grid-template-columns:auto minmax(0, 1fr) !important;
  gap:14px !important;
  align-items:center !important;
  padding:14px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:24px !important;
  background:var(--ssa-panel) !important;
  box-shadow:var(--ssa-shadow) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
}

#sistem-sunyi-atlas .ssa-latest-label{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  padding:0 12px !important;
  border-radius:999px !important;
  background:var(--ssa-gold-soft) !important;
  color:var(--ssa-gold) !important;
  font-size:.70rem !important;
  font-weight:950 !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}

#sistem-sunyi-atlas #resonansi-scroll,
#sistem-sunyi-atlas .resonansi-scroll{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  padding:2px 2px 4px !important;
  scrollbar-width:thin !important;
  scrollbar-color:var(--ssa-line-strong) transparent !important;
  -webkit-overflow-scrolling:touch !important;
}

/* Loading state sebelum JS mengisi data */
#sistem-sunyi-atlas #resonansi-scroll .loading-gema,
#sistem-sunyi-atlas .resonansi-scroll .loading-gema{
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  padding:0 12px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.052) !important;
  color:var(--ssa-muted) !important;
  font-size:.78rem !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

/* Links hasil render dinamis dari loadLatest() */
#sistem-sunyi-atlas #resonansi-scroll a,
#sistem-sunyi-atlas .resonansi-scroll a{
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  padding:0 12px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.052) !important;
  color:var(--ssa-muted) !important;
  font-size:.78rem !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  transition:
    transform .22s ease,
    border-color .22s ease,
    background .22s ease,
    color .22s ease !important;
}

#sistem-sunyi-atlas #resonansi-scroll a:hover,
#sistem-sunyi-atlas .resonansi-scroll a:hover{
  transform:translateY(-2px) !important;
  border-color:var(--ssa-line-strong) !important;
  background:var(--ssa-gold-soft) !important;
  color:var(--ssa-text-strong) !important;
}

#sistem-sunyi-atlas #resonansi-scroll .lihat-semua,
#sistem-sunyi-atlas .resonansi-scroll .lihat-semua{
  color:var(--ssa-gold) !important;
  border-color:var(--ssa-line-strong) !important;
  background:var(--ssa-gold-soft) !important;
}

#sistem-sunyi-atlas[data-theme="light"] #resonansi-scroll .loading-gema,
#sistem-sunyi-atlas.ssa-light #resonansi-scroll .loading-gema,
#sistem-sunyi-atlas[data-theme="light"] .resonansi-scroll .loading-gema,
#sistem-sunyi-atlas.ssa-light .resonansi-scroll .loading-gema,
#sistem-sunyi-atlas[data-theme="light"] #resonansi-scroll a,
#sistem-sunyi-atlas.ssa-light #resonansi-scroll a,
#sistem-sunyi-atlas[data-theme="light"] .resonansi-scroll a,
#sistem-sunyi-atlas.ssa-light .resonansi-scroll a{
  background:rgba(255,255,255,.70) !important;
}

@media(max-width:720px){
  #sistem-sunyi-atlas .ssa-latest{
    margin-top:-24px !important;
  }

  #sistem-sunyi-atlas .ssa-latest-shell{
    grid-template-columns:1fr !important;
  }

  #sistem-sunyi-atlas .ssa-latest-label{
    width:fit-content !important;
  }
}


/* =========================================================
   10. SECTION BASE
========================================================= */

#sistem-sunyi-atlas .ssa-section{
  position:relative !important;
  padding:86px 0 !important;
}

#sistem-sunyi-atlas .ssa-section-head{
  max-width:820px !important;
  margin:0 auto 38px !important;
  text-align:center !important;
}

#sistem-sunyi-atlas .ssa-section-head-left{
  margin:0 !important;
  text-align:left !important;
}

#sistem-sunyi-atlas .ssa-section-head h2{
  margin:0 !important;
}

#sistem-sunyi-atlas .ssa-section-head p{
  max-width:760px !important;
  margin:18px auto 0 !important;
  font-size:1rem !important;
  line-height:1.82 !important;
}

#sistem-sunyi-atlas .ssa-section-head-left p{
  margin-left:0 !important;
  margin-right:0 !important;
}

#sistem-sunyi-atlas .ssa-reveal{
  opacity:1 !important;
  transform:none !important;
}

#sistem-sunyi-atlas .ssa-visible,
#sistem-sunyi-atlas .visible{
  opacity:1 !important;
  transform:none !important;
}


/* =========================================================
   11. JALUR MASUK
========================================================= */

#sistem-sunyi-atlas .ssa-path-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:16px !important;
}

#sistem-sunyi-atlas .ssa-path-card,
#sistem-sunyi-atlas .ssa-map-card,
#sistem-sunyi-atlas .ssa-orbit-card,
#sistem-sunyi-atlas .ssa-kamus-card,
#sistem-sunyi-atlas .ssa-study-card{
  position:relative !important;
  overflow:hidden !important;
  border:1px solid var(--ssa-line) !important;
  background:
    radial-gradient(circle at 88% 8%, var(--ssa-blue-soft), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.060), rgba(255,255,255,.024)),
    var(--ssa-panel) !important;
  box-shadow:var(--ssa-shadow-soft) !important;
  transition:
    transform .24s ease,
    background .24s ease,
    border-color .24s ease,
    box-shadow .24s ease !important;
}

#sistem-sunyi-atlas .ssa-path-card::before,
#sistem-sunyi-atlas .ssa-map-card::before,
#sistem-sunyi-atlas .ssa-orbit-card::before,
#sistem-sunyi-atlas .ssa-kamus-card::before,
#sistem-sunyi-atlas .ssa-study-card::before{
  content:"" !important;
  position:absolute !important;
  left:18px !important;
  right:18px !important;
  top:0 !important;
  height:1px !important;
  background:linear-gradient(90deg, rgba(200,167,90,.48), transparent) !important;
  pointer-events:none !important;
}

#sistem-sunyi-atlas .ssa-path-card:hover,
#sistem-sunyi-atlas .ssa-map-card:hover,
#sistem-sunyi-atlas .ssa-orbit-card:hover,
#sistem-sunyi-atlas .ssa-kamus-card:hover,
#sistem-sunyi-atlas .ssa-study-card:hover{
  transform:translateY(-4px) !important;
  border-color:var(--ssa-line-strong) !important;
  background:
    radial-gradient(circle at 12% 0%, var(--ssa-gold-soft), transparent 36%),
    radial-gradient(circle at 88% 8%, var(--ssa-blue-soft), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.078), rgba(255,255,255,.030)),
    var(--ssa-panel) !important;
  box-shadow:var(--ssa-shadow) !important;
}

#sistem-sunyi-atlas .ssa-path-card{
  min-height:250px !important;
  padding:25px !important;
  border-radius:24px !important;
}

#sistem-sunyi-atlas .ssa-path-card span,
#sistem-sunyi-atlas .ssa-map-card span,
#sistem-sunyi-atlas .ssa-orbit-card span,
#sistem-sunyi-atlas .ssa-kamus-card span,
#sistem-sunyi-atlas .ssa-study-card span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:30px !important;
  margin-bottom:16px !important;
  padding:0 11px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.050) !important;
  color:var(--ssa-gold) !important;
  font-size:.72rem !important;
  font-weight:950 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
}

#sistem-sunyi-atlas .ssa-path-card h3,
#sistem-sunyi-atlas .ssa-map-card h3,
#sistem-sunyi-atlas .ssa-orbit-card h3,
#sistem-sunyi-atlas .ssa-kamus-card h3,
#sistem-sunyi-atlas .ssa-study-card h3{
  margin:0 0 13px !important;
}

#sistem-sunyi-atlas .ssa-path-card p,
#sistem-sunyi-atlas .ssa-map-card p,
#sistem-sunyi-atlas .ssa-orbit-card p,
#sistem-sunyi-atlas .ssa-kamus-card p,
#sistem-sunyi-atlas .ssa-study-card p{
  font-size:.94rem !important;
  line-height:1.74 !important;
}


/* =========================================================
   12. PETA BESAR
========================================================= */

#sistem-sunyi-atlas .ssa-map-section{
  border-top:1px solid var(--ssa-line) !important;
  border-bottom:1px solid var(--ssa-line) !important;
  background:
    radial-gradient(circle at 8% 14%, rgba(200,167,90,.10), transparent 26%),
    radial-gradient(circle at 86% 18%, rgba(88,136,174,.16), transparent 30%),
    var(--ssa-bg-2) !important;
}

#sistem-sunyi-atlas .ssa-map-layout{
  display:grid !important;
  grid-template-columns:minmax(0, .88fr) minmax(0, 1.12fr) !important;
  gap:40px !important;
  align-items:center !important;
}

#sistem-sunyi-atlas .ssa-map-cards{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:16px !important;
}

#sistem-sunyi-atlas .ssa-map-card{
  min-height:214px !important;
  padding:24px !important;
  border-radius:24px !important;
}


/* =========================================================
   13. ORBIT CARDS
========================================================= */

#sistem-sunyi-atlas .ssa-orbit-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:16px !important;
}

#sistem-sunyi-atlas .ssa-orbit-card{
  min-height:300px !important;
  display:flex !important;
  flex-direction:column !important;
  padding:0 !important;
  border-radius:24px !important;
}

#sistem-sunyi-atlas .ssa-orbit-card > a:first-child{
  display:block !important;
  flex:1 1 auto !important;
  padding:25px 25px 18px !important;
}

#sistem-sunyi-atlas .ssa-mini-link{
  position:relative !important;
  z-index:2 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  min-height:50px !important;
  margin:0 18px 18px !important;
  padding:0 14px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.050) !important;
  color:var(--ssa-gold) !important;
  font-size:.78rem !important;
  font-weight:850 !important;
}

#sistem-sunyi-atlas .ssa-mini-link:hover{
  border-color:var(--ssa-line-strong) !important;
  background:var(--ssa-gold-soft) !important;
  color:var(--ssa-text-strong) !important;
}


/* =========================================================
   14. EXTERNAL INTRO BOXES
========================================================= */

#sistem-sunyi-atlas .ssa-external-intro{
  padding-bottom:26px !important;
}

#sistem-sunyi-atlas .ssa-external-intro-box{
  position:relative !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) auto !important;
  gap:28px !important;
  align-items:center !important;
  padding:30px !important;
  border:1px solid var(--ssa-line-strong) !important;
  border-radius:var(--ssa-radius-xl) !important;
  background:
    radial-gradient(circle at 12% 10%, var(--ssa-gold-soft), transparent 34%),
    radial-gradient(circle at 92% 18%, var(--ssa-blue-soft), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.074), rgba(255,255,255,.028)),
    var(--ssa-panel) !important;
  box-shadow:var(--ssa-shadow) !important;
}

#sistem-sunyi-atlas .ssa-external-intro-box::before{
  content:"" !important;
  position:absolute !important;
  left:26px !important;
  right:26px !important;
  top:0 !important;
  height:1px !important;
  background:linear-gradient(90deg, rgba(200,167,90,.52), transparent) !important;
}

#sistem-sunyi-atlas .ssa-external-intro-box h2{
  margin:0 !important;
}

#sistem-sunyi-atlas .ssa-external-intro-box p:not(.ssa-kicker){
  max-width:760px !important;
  margin-top:14px !important;
  font-size:1rem !important;
  line-height:1.78 !important;
}


/* =========================================================
   15. DYNAMIC SLOT AND FETCHED SECTIONS
========================================================= */

#sistem-sunyi-atlas .ssa-dynamic-slot{
  position:relative !important;
  z-index:2 !important;
  width:min(var(--ssa-max), calc(100% - 44px)) !important;
  margin:0 auto 44px !important;
}

#sistem-sunyi-atlas .ssa-loader-inner{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  min-height:120px !important;
  padding:22px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:24px !important;
  background:var(--ssa-panel) !important;
  color:var(--ssa-muted) !important;
}

#sistem-sunyi-atlas .ssa-loader-mark{
  width:18px !important;
  height:18px !important;
  border-radius:999px !important;
  background:var(--ssa-gold) !important;
  box-shadow:0 0 28px rgba(200,167,90,.42) !important;
}


/* Dynamic fetched section shell */

#sistem-sunyi-atlas #sunyi-infografik,
#sistem-sunyi-atlas #sunyi-inti,
#sistem-sunyi-atlas #sunyi-resonansi,
#sistem-sunyi-atlas #sunyi-fraktal,
#sistem-sunyi-atlas #sunyi-jejakluar,
#sistem-sunyi-atlas #sunyi-pembacaan,
#sistem-sunyi-atlas #sunyi-musik,
#sistem-sunyi-atlas #sunyi-dialektika,
#sistem-sunyi-atlas #sunyi-ed{
  position:relative !important;
  z-index:2 !important;
  width:min(var(--ssa-max), calc(100% - 44px)) !important;
  margin:0 auto 44px !important;
  padding:0 !important;
  background:transparent !important;
}

#sistem-sunyi-atlas #sunyi-infografik .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-resonansi .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-fraktal .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-jejakluar .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-pembacaan .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-musik .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-dialektika .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-ed .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas #sunyi-inti .sunyi-inti-wrapper{
  position:relative !important;
  overflow:hidden !important;
  width:100% !important;
  margin:0 !important;
  padding:34px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:var(--ssa-radius-xl) !important;
  background:
    radial-gradient(circle at 12% 0%, var(--ssa-blue-soft), transparent 34%),
    radial-gradient(circle at 92% 8%, rgba(200,167,90,.075), transparent 32%),
    linear-gradient(145deg, rgba(255,255,255,.060), rgba(255,255,255,.024)),
    var(--ssa-panel) !important;
  box-shadow:var(--ssa-shadow-soft) !important;
}

#sistem-sunyi-atlas #sunyi-ed .sunyi-resonansi-wrapper{
  border-color:rgba(169,76,66,.26) !important;
  background:
    radial-gradient(circle at 14% 0%, var(--ssa-red-soft), transparent 36%),
    radial-gradient(circle at 92% 8%, rgba(169,76,66,.085), transparent 32%),
    linear-gradient(145deg, rgba(255,255,255,.060), rgba(255,255,255,.024)),
    var(--ssa-panel) !important;
}

#sistem-sunyi-atlas #sunyi-infografik .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-resonansi .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-fraktal .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-jejakluar .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-pembacaan .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-musik .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-dialektika .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-ed .sunyi-resonansi-wrapper::before,
#sistem-sunyi-atlas #sunyi-inti .sunyi-inti-wrapper::before{
  content:"" !important;
  position:absolute !important;
  left:26px !important;
  right:26px !important;
  top:0 !important;
  height:1px !important;
  background:linear-gradient(90deg, rgba(200,167,90,.48), transparent) !important;
  pointer-events:none !important;
}

#sistem-sunyi-atlas #sunyi-ed .sunyi-resonansi-wrapper::before{
  background:linear-gradient(90deg, rgba(169,76,66,.55), transparent) !important;
}

#sistem-sunyi-atlas .sunyi-resonansi-wrapper > h2,
#sistem-sunyi-atlas .sunyi-inti-header h2{
  margin:0 !important;
  color:var(--ssa-text-strong) !important;
  font-family:Georgia, "Times New Roman", serif !important;
  font-size:clamp(2rem, 3.2vw, 2.75rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.050em !important;
}

#sistem-sunyi-atlas .sunyi-resonansi-wrapper > p,
#sistem-sunyi-atlas .sunyi-inti-header p{
  max-width:780px !important;
  margin:16px 0 28px !important;
  color:var(--ssa-muted) !important;
  font-size:1rem !important;
  line-height:1.78 !important;
}

#sistem-sunyi-atlas .sunyi-inti-label{
  display:inline-flex !important;
  align-items:center !important;
  margin:0 0 12px !important;
  color:var(--ssa-gold) !important;
  font-size:.74rem !important;
  font-weight:950 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
}


/* Dynamic grids */

#sistem-sunyi-atlas .sunyi-resonansi-grid,
#sistem-sunyi-atlas .sunyi-inti-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:14px !important;
  margin:0 !important;
  padding:0 !important;
}

#sistem-sunyi-atlas .sunyi-resonansi-card,
#sistem-sunyi-atlas .sunyi-inti-card{
  position:relative !important;
  overflow:hidden !important;
  min-height:136px !important;
  display:flex !important;
  align-items:flex-end !important;
  padding:18px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:20px !important;
  background:
    radial-gradient(circle at 88% 8%, var(--ssa-blue-soft), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.062), rgba(255,255,255,.024)) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.12) !important;
  transition:
    transform .24s ease,
    border-color .24s ease,
    background .24s ease,
    box-shadow .24s ease !important;
}

#sistem-sunyi-atlas .sunyi-resonansi-card::before,
#sistem-sunyi-atlas .sunyi-inti-card::before{
  content:"" !important;
  position:absolute !important;
  left:16px !important;
  right:16px !important;
  top:0 !important;
  height:1px !important;
  background:linear-gradient(90deg, rgba(200,167,90,.42), transparent) !important;
}

#sistem-sunyi-atlas .sunyi-resonansi-card:hover,
#sistem-sunyi-atlas .sunyi-inti-card:hover{
  transform:translateY(-3px) !important;
  border-color:var(--ssa-line-strong) !important;
  background:
    radial-gradient(circle at 12% 0%, var(--ssa-gold-soft), transparent 36%),
    radial-gradient(circle at 88% 8%, var(--ssa-blue-soft), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.074), rgba(255,255,255,.028)) !important;
  box-shadow:var(--ssa-shadow-soft) !important;
}

#sistem-sunyi-atlas .sunyi-resonansi-card h3,
#sistem-sunyi-atlas .sunyi-inti-card h3{
  position:relative !important;
  z-index:2 !important;
  margin:0 !important;
  color:var(--ssa-text-strong) !important;
  font-family:Georgia, "Times New Roman", serif !important;
  font-size:1.18rem !important;
  line-height:1.18 !important;
  letter-spacing:-.030em !important;
  font-weight:560 !important;
}

#sistem-sunyi-atlas .sunyi-resonansi-btn,
#sistem-sunyi-atlas .sunyi-inti-btn{
  display:flex !important;
  justify-content:center !important;
  margin-top:24px !important;
}

#sistem-sunyi-atlas .sunyi-archive-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:44px !important;
  padding:0 18px !important;
  border:1px solid var(--ssa-line-strong) !important;
  border-radius:999px !important;
  background:var(--ssa-gold-soft) !important;
  color:var(--ssa-text-strong) !important;
  font-size:.84rem !important;
  font-weight:850 !important;
}

#sistem-sunyi-atlas .sunyi-archive-btn:hover{
  background:linear-gradient(135deg,#b99150,#e2c77f) !important;
  color:#17110a !important;
}


/* =========================================================
   16. KAMUS, STUDI KASUS
========================================================= */

#sistem-sunyi-atlas .ssa-kamus-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:16px !important;
}

@media(max-width:1120px){
  #sistem-sunyi-atlas .ssa-kamus-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media(max-width:720px){
  #sistem-sunyi-atlas .ssa-kamus-grid{
    grid-template-columns:1fr !important;
  }
}

#sistem-sunyi-atlas .ssa-kamus-card{
  min-height:245px !important;
  padding:25px !important;
  border-radius:24px !important;
}

#sistem-sunyi-atlas .ssa-study{
  border-top:1px solid var(--ssa-line) !important;
  background:
    radial-gradient(circle at 10% 10%, var(--ssa-green-soft), transparent 34%),
    radial-gradient(circle at 90% 12%, var(--ssa-blue-soft), transparent 34%),
    var(--ssa-bg-2) !important;
}

#sistem-sunyi-atlas .ssa-study-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:16px !important;
}

#sistem-sunyi-atlas .ssa-study-card{
  min-height:250px !important;
  padding:25px !important;
  border-radius:24px !important;
}


/* =========================================================
   17. CLOSING AND FOOTER
========================================================= */

#sistem-sunyi-atlas .ssa-closing{
  position:relative !important;
  padding:86px 0 !important;
}

#sistem-sunyi-atlas .ssa-closing-card{
  position:relative !important;
  overflow:hidden !important;
  max-width:980px !important;
  margin:0 auto !important;
  padding:42px !important;
  border:1px solid var(--ssa-line-strong) !important;
  border-radius:var(--ssa-radius-xl) !important;
  background:
    radial-gradient(circle at 12% 20%, var(--ssa-gold-soft), transparent 34%),
    radial-gradient(circle at 86% 18%, var(--ssa-blue-soft), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.074), rgba(255,255,255,.028)),
    var(--ssa-panel) !important;
  box-shadow:var(--ssa-shadow) !important;
  text-align:center !important;
}

#sistem-sunyi-atlas .ssa-closing-card::before{
  content:"" !important;
  position:absolute !important;
  left:32px !important;
  right:32px !important;
  top:0 !important;
  height:1px !important;
  background:linear-gradient(90deg, rgba(200,167,90,.56), transparent) !important;
}

#sistem-sunyi-atlas .ssa-closing-card h2{
  max-width:760px !important;
  margin:0 auto !important;
  font-size:clamp(2rem, 3.4vw, 3rem) !important;
}

#sistem-sunyi-atlas .ssa-closing-card > p:not(.ssa-kicker){
  max-width:760px !important;
  margin:18px auto 0 !important;
  font-size:1.02rem !important;
  line-height:1.82 !important;
}

#sistem-sunyi-atlas .ssa-cta-center{
  justify-content:center !important;
}

#sistem-sunyi-atlas .ssa-origin{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  max-width:720px !important;
  margin:28px auto 0 !important;
  padding-top:24px !important;
  border-top:1px solid var(--ssa-line) !important;
}

#sistem-sunyi-atlas .ssa-origin img{
  width:32px !important;
  height:32px !important;
  border-radius:999px !important;
  flex:0 0 auto !important;
}

#sistem-sunyi-atlas .ssa-origin p{
  font-size:.90rem !important;
  line-height:1.6 !important;
}

#sistem-sunyi-atlas .ssa-origin a{
  color:var(--ssa-gold) !important;
  font-weight:850 !important;
}

#sistem-sunyi-atlas .ssa-footerbar{
  position:relative !important;
  z-index:2 !important;
  width:min(var(--ssa-max), calc(100% - 44px)) !important;
  margin:0 auto 26px !important;
  padding:16px 20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  border:1px solid var(--ssa-line) !important;
  border-radius:22px !important;
  background:var(--ssa-panel) !important;
  color:var(--ssa-muted) !important;
  box-shadow:var(--ssa-shadow-soft) !important;
  font-size:.78rem !important;
  font-weight:800 !important;
  line-height:1.5 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
}

#sistem-sunyi-atlas .ssa-footerbar a{
  color:var(--ssa-gold) !important;
}


/* =========================================================
   18. LIGHT MODE POLISH
========================================================= */

body.ssa-light #sistem-sunyi-atlas{
  color:var(--ssa-text) !important;
}
#sistem-sunyi-atlas[data-theme="light"] .ssa-atlas-toplink,
#sistem-sunyi-atlas.ssa-light .ssa-atlas-toplink,
#sistem-sunyi-atlas[data-theme="light"] .ssa-brandline,
#sistem-sunyi-atlas.ssa-light .ssa-brandline,
#sistem-sunyi-atlas[data-theme="light"] .ssa-btn,
#sistem-sunyi-atlas.ssa-light .ssa-btn,
#sistem-sunyi-atlas[data-theme="light"] .resonansi-scroll a,
#sistem-sunyi-atlas.ssa-light .resonansi-scroll a{
  background:rgba(255,255,255,.70) !important;
}

#sistem-sunyi-atlas[data-theme="light"] .ssa-hero-panel,
#sistem-sunyi-atlas.ssa-light .ssa-hero-panel,
#sistem-sunyi-atlas[data-theme="light"] .ssa-path-card,
#sistem-sunyi-atlas.ssa-light .ssa-path-card,
#sistem-sunyi-atlas[data-theme="light"] .ssa-map-card,
#sistem-sunyi-atlas.ssa-light .ssa-map-card,
#sistem-sunyi-atlas[data-theme="light"] .ssa-orbit-card,
#sistem-sunyi-atlas.ssa-light .ssa-orbit-card,
#sistem-sunyi-atlas[data-theme="light"] .ssa-kamus-card,
#sistem-sunyi-atlas.ssa-light .ssa-kamus-card,
#sistem-sunyi-atlas[data-theme="light"] .ssa-study-card,
#sistem-sunyi-atlas.ssa-light .ssa-study-card,
#sistem-sunyi-atlas[data-theme="light"] .ssa-external-intro-box,
#sistem-sunyi-atlas.ssa-light .ssa-external-intro-box,
#sistem-sunyi-atlas[data-theme="light"] .ssa-closing-card,
#sistem-sunyi-atlas.ssa-light .ssa-closing-card,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-infografik .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-infografik .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-resonansi .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-resonansi .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-fraktal .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-fraktal .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-jejakluar .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-jejakluar .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-pembacaan .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-pembacaan .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-musik .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-musik .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-dialektika .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-dialektika .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-ed .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-ed .sunyi-resonansi-wrapper,
#sistem-sunyi-atlas[data-theme="light"] #sunyi-inti .sunyi-inti-wrapper,
#sistem-sunyi-atlas.ssa-light #sunyi-inti .sunyi-inti-wrapper{
  background:
    radial-gradient(circle at 88% 8%, var(--ssa-blue-soft), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.92), rgba(255,255,255,.62)),
    var(--ssa-panel) !important;
}

#sistem-sunyi-atlas[data-theme="light"] .ssa-qotd,
#sistem-sunyi-atlas.ssa-light .ssa-qotd,
#sistem-sunyi-atlas[data-theme="light"] .ssa-mini-link,
#sistem-sunyi-atlas.ssa-light .ssa-mini-link,
#sistem-sunyi-atlas[data-theme="light"] .sunyi-resonansi-card,
#sistem-sunyi-atlas.ssa-light .sunyi-resonansi-card,
#sistem-sunyi-atlas[data-theme="light"] .sunyi-inti-card,
#sistem-sunyi-atlas.ssa-light .sunyi-inti-card{
  background:rgba(255,255,255,.68) !important;
}


/* =========================================================
   19. RESPONSIVE
========================================================= */

@media(max-width:1120px){
  #sistem-sunyi-atlas .ssa-hero-grid,
  #sistem-sunyi-atlas .ssa-map-layout{
    grid-template-columns:1fr !important;
  }

  #sistem-sunyi-atlas .ssa-hero-panel{
    min-height:430px !important;
  }

  #sistem-sunyi-atlas .ssa-path-grid,
  #sistem-sunyi-atlas .ssa-orbit-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  #sistem-sunyi-atlas .sunyi-resonansi-grid,
  #sistem-sunyi-atlas .sunyi-inti-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media(max-width:900px){
  #sistem-sunyi-atlas .ssa-atlas-topbar-inner{
    align-items:flex-start !important;
    flex-direction:column !important;
  }

  #sistem-sunyi-atlas .ssa-atlas-topbar-left{
    width:100% !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    padding-bottom:4px !important;
    -webkit-overflow-scrolling:touch !important;
  }

  #sistem-sunyi-atlas .ssa-atlas-toplink{
    flex:0 0 auto !important;
  }

  #sistem-sunyi-atlas .ssa-atlas-topbar-right{
    width:100% !important;
  }

	 #sistem-sunyi-atlas .ssa-map-cards,
	  #sistem-sunyi-atlas .ssa-study-grid{
		grid-template-columns:1fr !important;
	  }

	  #sistem-sunyi-atlas .ssa-kamus-grid{
		grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
	  }

  #sistem-sunyi-atlas .ssa-external-intro-box{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:720px){
  #sistem-sunyi-atlas .ssa-shell,
  #sistem-sunyi-atlas .ssa-atlas-topbar-inner,
  #sistem-sunyi-atlas .ssa-dynamic-slot,
  #sistem-sunyi-atlas #sunyi-infografik,
  #sistem-sunyi-atlas #sunyi-inti,
  #sistem-sunyi-atlas #sunyi-resonansi,
  #sistem-sunyi-atlas #sunyi-fraktal,
  #sistem-sunyi-atlas #sunyi-jejakluar,
  #sistem-sunyi-atlas #sunyi-pembacaan,
  #sistem-sunyi-atlas #sunyi-musik,
  #sistem-sunyi-atlas #sunyi-dialektika,
  #sistem-sunyi-atlas #sunyi-ed,
  #sistem-sunyi-atlas .ssa-footerbar{
    width:min(100% - 32px, var(--ssa-max)) !important;
  }

  #sistem-sunyi-atlas .ssa-hero{
    min-height:auto !important;
    padding:56px 0 66px !important;
  }

  #sistem-sunyi-atlas .ssa-hero::after{
    inset:14px !important;
    border-radius:24px !important;
  }

  #sistem-sunyi-atlas h1{
    font-size:clamp(2.75rem, 13vw, 4.2rem) !important;
    line-height:.98 !important;
    letter-spacing:-.060em !important;
  }

  #sistem-sunyi-atlas h2{
    font-size:clamp(1.9rem, 8.7vw, 2.65rem) !important;
    line-height:1.08 !important;
  }

  #sistem-sunyi-atlas .ssa-subtitle{
    font-size:1.22rem !important;
    line-height:1.42 !important;
  }

  #sistem-sunyi-atlas .ssa-lead{
    font-size:.98rem !important;
    line-height:1.74 !important;
  }

  #sistem-sunyi-atlas .ssa-cta-row,
  #sistem-sunyi-atlas .ssa-inline-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
  }

  #sistem-sunyi-atlas .ssa-btn{
    width:100% !important;
  }

  #sistem-sunyi-atlas .ssa-hero-panel{
    min-height:auto !important;
    padding:24px !important;
    border-radius:26px !important;
  }

  #sistem-sunyi-atlas .ssa-orbit-mark{
    opacity:.42 !important;
  }

  #sistem-sunyi-atlas .ssa-latest{
    margin-top:-24px !important;
  }

  #sistem-sunyi-atlas .ssa-latest-shell{
    grid-template-columns:1fr !important;
  }

  #sistem-sunyi-atlas .ssa-section{
    padding:64px 0 !important;
  }

  #sistem-sunyi-atlas .ssa-section-head{
    text-align:left !important;
    margin-bottom:28px !important;
  }

  #sistem-sunyi-atlas .ssa-section-head p{
    margin-left:0 !important;
    margin-right:0 !important;
  }

  #sistem-sunyi-atlas .ssa-path-grid,
  #sistem-sunyi-atlas .ssa-orbit-grid,
  #sistem-sunyi-atlas .sunyi-resonansi-grid,
  #sistem-sunyi-atlas .sunyi-inti-grid{
    grid-template-columns:1fr !important;
  }

  #sistem-sunyi-atlas .ssa-path-card,
  #sistem-sunyi-atlas .ssa-map-card,
  #sistem-sunyi-atlas .ssa-orbit-card,
  #sistem-sunyi-atlas .ssa-kamus-card,
  #sistem-sunyi-atlas .ssa-study-card{
    min-height:auto !important;
    padding:22px !important;
    border-radius:22px !important;
  }

  #sistem-sunyi-atlas .ssa-orbit-card{
    padding:0 !important;
  }

  #sistem-sunyi-atlas .ssa-orbit-card > a:first-child{
    padding:22px 22px 14px !important;
  }

  #sistem-sunyi-atlas #sunyi-infografik .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-resonansi .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-fraktal .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-jejakluar .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-pembacaan .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-musik .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-dialektika .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-ed .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-inti .sunyi-inti-wrapper,
  #sistem-sunyi-atlas .ssa-external-intro-box,
  #sistem-sunyi-atlas .ssa-closing-card{
    padding:24px !important;
    border-radius:26px !important;
  }

  #sistem-sunyi-atlas .sunyi-resonansi-card,
  #sistem-sunyi-atlas .sunyi-inti-card{
    min-height:116px !important;
  }

  #sistem-sunyi-atlas .ssa-origin{
    align-items:flex-start !important;
    text-align:left !important;
  }

  #sistem-sunyi-atlas .ssa-footerbar{
    flex-direction:column !important;
    align-items:flex-start !important;
    text-align:left !important;
  }

  #ssa-mode-toggle,
  body > #ssa-mode-toggle{
    right:14px !important;
    bottom:14px !important;
    min-height:42px !important;
    padding:0 14px !important;
    font-size:.78rem !important;
  }
}

@media(max-width:460px){
  #sistem-sunyi-atlas .ssa-shell,
  #sistem-sunyi-atlas .ssa-atlas-topbar-inner,
  #sistem-sunyi-atlas .ssa-dynamic-slot,
  #sistem-sunyi-atlas #sunyi-infografik,
  #sistem-sunyi-atlas #sunyi-inti,
  #sistem-sunyi-atlas #sunyi-resonansi,
  #sistem-sunyi-atlas #sunyi-fraktal,
  #sistem-sunyi-atlas #sunyi-jejakluar,
  #sistem-sunyi-atlas #sunyi-pembacaan,
  #sistem-sunyi-atlas #sunyi-musik,
  #sistem-sunyi-atlas #sunyi-dialektika,
  #sistem-sunyi-atlas #sunyi-ed,
  #sistem-sunyi-atlas .ssa-footerbar{
    width:min(100% - 24px, var(--ssa-max)) !important;
  }

  #sistem-sunyi-atlas h1{
    font-size:2.72rem !important;
  }

  #sistem-sunyi-atlas .ssa-hero-panel,
  #sistem-sunyi-atlas .ssa-external-intro-box,
  #sistem-sunyi-atlas .ssa-closing-card,
  #sistem-sunyi-atlas #sunyi-infografik .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-resonansi .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-fraktal .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-jejakluar .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-pembacaan .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-musik .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-dialektika .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-ed .sunyi-resonansi-wrapper,
  #sistem-sunyi-atlas #sunyi-inti .sunyi-inti-wrapper{
    padding:20px !important;
    border-radius:22px !important;
  }

  #sistem-sunyi-atlas .ssa-origin{
    flex-direction:column !important;
  }
}

@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto !important;
  }

  #sistem-sunyi-atlas *,
  #sistem-sunyi-atlas *::before,
  #sistem-sunyi-atlas *::after,
  #ssa-mode-toggle,
  body > #ssa-mode-toggle{
    transition:none !important;
    animation:none !important;
    scroll-behavior:auto !important;
  }
}