/* ===== added features integrated into the original Goku Saga design ===== */
/* forms section -> 8-form Saga story */
#forms .saga-forms{ display:flex; flex-direction:column; gap:16px; }
.sf-chapter{ display:grid; grid-template-columns:210px 1fr; border-radius:14px; overflow:hidden; background:#12131c; border:1px solid rgba(255,255,255,.1); box-shadow:0 24px 60px -30px rgba(0,0,0,.9); }
.sf-chapter:nth-child(even){ grid-template-columns:1fr 210px; }
.sf-chapter:nth-child(even) .sf-art{ order:2; }
.sf-art{ background:radial-gradient(circle at 50% 28%, rgba(255,160,60,.16), #0c0d14); min-height:180px; display:flex; align-items:flex-end; justify-content:center; overflow:hidden; }
.sf-art img{ height:100%; max-height:230px; width:auto; object-fit:contain; object-position:bottom; }
.sf-body{ padding:22px 28px; display:flex; flex-direction:column; justify-content:center; }
.sf-no{ font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:2px; font-size:12px; color:#ff6a1a; }
.sf-body h3{ font-family:'Anton',sans-serif; font-size:clamp(22px,3vw,40px); margin:8px 0 10px; color:#fff; line-height:1; }
.sf-body p{ color:#c3cad9; font-size:15px; line-height:1.6; max-width:600px; }
@media(max-width:720px){ .sf-chapter,.sf-chapter:nth-child(even){ grid-template-columns:1fr; } .sf-chapter:nth-child(even) .sf-art{ order:0; } }

/* community highlight — compact HORIZONTAL rectangle slideshow */
.cx-slideshow{ display:flex; gap:10px; align-items:stretch; max-width:700px; margin:0 auto; }
.cx-nav{ width:40px; flex:none; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.04); color:#fff; font-size:22px; cursor:pointer; border-radius:10px; transition:.15s; }
.cx-nav:hover{ border-color:#ff6a1a; color:#ff6a1a; }
.cx-stage{ flex:1; display:flex; }
.cx-card{ flex:1; display:grid; grid-template-columns:170px 1fr; background:#12131c; border:1px solid rgba(255,255,255,.1); border-radius:12px; overflow:hidden; text-decoration:none; min-height:138px; }
.cx-card.no-media{ grid-template-columns:1fr; }
.cx-media{ overflow:hidden; } .cx-media img{ width:100%; height:100%; object-fit:cover; }
.cx-body{ padding:13px 16px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.cx-top{ display:flex; align-items:center; gap:9px; color:#fff; } .cx-av{ width:34px; height:34px; border-radius:50%; object-fit:cover; flex:none; }
.cx-id{ min-width:0; } .cx-id b{ display:block; font-family:'Oswald'; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .cx-id span{ font-size:11px; color:#9aa2b6; } .cx-top svg{ margin-left:auto; flex:none; color:#fff; }
.cx-text{ color:#c3cad9; font-size:13.5px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.cx-foot{ margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:11px; color:#9aa2b6; } .cx-foot span:first-child{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .cx-view{ color:#ff6a1a; font-family:'Oswald'; letter-spacing:1px; flex:none; }
.cx-dots{ display:flex; gap:7px; justify-content:center; margin-top:14px; } .cx-dot{ width:9px; height:9px; border-radius:50%; border:1px solid rgba(255,255,255,.3); background:transparent; cursor:pointer; padding:0; } .cx-dot.on{ background:#ff6a1a; border-color:#ff6a1a; }
.cx-empty{ text-align:center; color:#9aa2b6; padding:34px 16px; margin:auto; }
@media(max-width:560px){ .cx-card{ grid-template-columns:118px 1fr; } .cx-media{ min-height:120px; } }

/* ===== LIVE SCOUTER — Dragon Ball scouter HUD ===== */
.scouter{ max-width:640px; margin:0 auto 30px; }
.sc-frame{ position:relative; overflow:hidden; padding:20px 22px; border-radius:16px;
  font-family:'Share Tech Mono',monospace; color:#8dffbe;
  border:1px solid rgba(70,255,150,.45);
  background:radial-gradient(120% 90% at 50% -10%, rgba(40,255,140,.10), rgba(3,16,9,.96) 60%), linear-gradient(180deg,rgba(4,20,11,.95),rgba(2,9,6,.97));
  box-shadow:0 0 46px rgba(50,255,140,.16), inset 0 0 46px rgba(40,255,140,.07); }
.sc-frame::before{ content:''; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background:repeating-linear-gradient(0deg, rgba(70,255,150,.06) 0 1px, transparent 1px 3px); }
.sc-scan{ position:absolute; left:0; right:0; top:0; height:46px; pointer-events:none;
  background:linear-gradient(180deg, transparent, rgba(90,255,160,.20), transparent); animation:scScan 3.4s linear infinite; }
@keyframes scScan{ 0%{ transform:translateY(-46px);} 100%{ transform:translateY(430px);} }
.sc-cross{ position:absolute; inset:0; pointer-events:none; opacity:.20;
  background:linear-gradient(rgba(90,255,160,.6),rgba(90,255,160,.6)) center/1px 100% no-repeat, linear-gradient(rgba(90,255,160,.6),rgba(90,255,160,.6)) center/100% 1px no-repeat; }
.sc-corner{ position:absolute; width:16px; height:16px; border:2px solid rgba(140,255,180,.85); z-index:2; }
.sc-corner.tl{ top:9px; left:9px; border-right:0; border-bottom:0; } .sc-corner.tr{ top:9px; right:9px; border-left:0; border-bottom:0; }
.sc-corner.bl{ bottom:9px; left:9px; border-right:0; border-top:0; } .sc-corner.br{ bottom:9px; right:9px; border-left:0; border-top:0; }
.sc-top{ position:relative; z-index:2; display:flex; justify-content:space-between; align-items:center; font-size:12px; letter-spacing:3px; }
.sc-tag{ color:#c7ffdd; font-weight:700; } .sc-tag::before{ content:'▮ '; color:#39ff9a; }
.sc-live{ color:#6be0a0; letter-spacing:2px; } .sc-live::before{ content:'● '; }
.sc-live.on{ color:#39ff9a; animation:scBlink 1.4s steps(1) infinite; text-shadow:0 0 10px rgba(60,255,150,.8); }
@keyframes scBlink{ 50%{ opacity:.45; } }
.sc-target{ position:relative; z-index:2; font-size:11px; letter-spacing:1.5px; color:#6be0a0; margin:8px 0 12px; } .sc-target b{ color:#eafff2; }
.sc-power{ position:relative; z-index:2; text-align:center; border:1px dashed rgba(70,255,150,.35); border-radius:12px; padding:10px 8px; margin-bottom:12px; background:rgba(40,255,140,.05); }
.sc-plabel{ display:block; font-size:9px; letter-spacing:2.5px; color:#6be0a0; margin-bottom:2px; }
.sc-power b{ font-family:'Teko',sans-serif; font-weight:600; font-size:52px; line-height:.9; color:#d8ffe8; text-shadow:0 0 16px rgba(70,255,150,.55); }
.sc-readout{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:14px; }
.sc-row{ display:flex; justify-content:space-between; align-items:center; border:1px solid rgba(70,255,150,.2); border-radius:8px; padding:7px 11px; background:rgba(40,255,140,.04); }
.sc-row.wide{ grid-column:1 / -1; }
.sc-row span{ font-size:9px; letter-spacing:1.5px; color:#6be0a0; }
.sc-row b{ font-family:'Teko',sans-serif; font-weight:500; font-size:22px; color:#d8ffe8; letter-spacing:.5px; }
.sc-links{ position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:16px; justify-content:center; border-top:1px solid rgba(70,255,150,.18); padding-top:13px; }
.sc-links a{ font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:1px; font-size:12px; color:#9effc4; transition:.15s; }
.sc-links a:hover{ color:#fff; text-shadow:0 0 9px rgba(70,255,150,.8); }
@media(max-width:560px){ .sc-power b{ font-size:42px; } }
/* live scouter overlay (opened from the floating dock icon) */
.gx-modal{ position:fixed; inset:0; z-index:99999; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(2,8,5,.74); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.gx-modal.show{ display:flex; animation:gxIn .18s ease; }
@keyframes gxIn{ from{ opacity:0; } to{ opacity:1; } }
.gx-modal-box{ width:min(560px,100%); margin:0; }
.gx-close{ position:absolute; top:11px; right:12px; z-index:6; width:30px; height:30px; display:grid; place-items:center; border:1px solid rgba(120,255,170,.5); background:rgba(0,0,0,.35); color:#9effc4; border-radius:8px; cursor:pointer; font-size:13px; line-height:1; }
.gx-close:hover{ color:#fff; border-color:#39ff9a; box-shadow:0 0 10px rgba(60,255,150,.5); }

/* tokenomics — small reserved strip */
.tokenomics-strip{ padding:26px 0; border-top:1px solid rgba(255,255,255,.08); }
.tk-inner{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; justify-content:center; }
.tk-kick{ font-family:'Anton'; font-size:20px; color:#fff; letter-spacing:1px; }
.tk-rows{ display:flex; gap:26px; flex-wrap:wrap; }
.tk-rows div{ text-align:center; } .tk-rows b{ font-family:'Oswald'; font-weight:700; font-size:22px; color:#ffc23a; display:block; line-height:1; } .tk-rows span{ font-family:'Oswald'; font-size:10px; letter-spacing:1px; color:#9aa2b6; }
.tk-wp{ font-family:'Oswald'; font-weight:700; letter-spacing:1px; font-size:12px; color:#ff6a1a; border:1px solid rgba(255,106,26,.5); padding:8px 14px; border-radius:8px; transition:.15s; }
.tk-wp:hover{ background:rgba(255,106,26,.12); }