:root{
  --gold:#C9A84C;--gold-l:#E8C96A;--gold-d:#8B6914;--gold-xd:#5A4209;
  --gold-glow:rgba(201,168,76,0.14);--gold-border:rgba(201,168,76,0.24);
  --bg:#0A0A0D;--bg2:#101013;--bg3:#17171B;--bg4:#1E1E23;--bg5:#28282F;
  --text:#F4F4F2;--text2:#9C9CA3;--text3:#65656C;
  --green:#34D399;--red:#F87171;
  --card-border:rgba(255,255,255,0.08);
  --nav-h:96px;
  --radius:14px;
}
html.light{
  --bg:#F6F6F4;--bg2:#EFEFEC;--bg3:#E6E6E2;--bg4:#DBDBD5;--bg5:#CCCCC4;
  --text:#121214;--text2:#55555C;--text3:#8B8B92;
  --card-border:rgba(0,0,0,0.08);
  --gold-glow:rgba(201,168,76,0.10);--gold-border:rgba(139,105,20,0.28);
  --green:#1E8A4C;--red:#C0392B;
}
html.light #bg-canvas{opacity:.12}
html.light #nav.solid{background:rgba(245,240,232,0.94);border-bottom-color:var(--card-border)}
html.light #mob-nav{background:rgba(245,240,232,0.98);border-left-color:var(--card-border)}
html.light .nav-dropdown-menu{background:rgba(237,231,217,0.98)}
html.light #loader{background:var(--bg)}
html.light .ticker-wrap{background:rgba(237,231,217,0.95)}
html.light .faq-item,.html.light .seo-col-card{background:var(--bg3)}

/* THEME TOGGLE BUTTON */
.theme-toggle{
  display:flex;align-items:center;gap:6px;
  background:rgba(201,168,76,0.08);
  border:1px solid var(--gold-border);
  border-radius:26px;
  padding:5px 10px;
  cursor:pointer;
  transition:all .25s;
  flex-shrink:0;
}
.theme-toggle:hover{background:rgba(201,168,76,0.16);border-color:var(--gold)}
.theme-toggle-track{
  width:32px;height:17px;
  border-radius:18px;
  background:var(--bg4);
  border:1px solid var(--gold-border);
  position:relative;
  transition:background .3s;
  flex-shrink:0;
}
html.light .theme-toggle-track{background:var(--gold-d)}
.theme-toggle-thumb{
  position:absolute;top:2px;left:2px;
  width:11px;height:11px;
  border-radius:50%;
  background:var(--text3);
  transition:transform .3s, background .3s;
}
html.light .theme-toggle-thumb{transform:translateX(15px);background:#fff}
.theme-toggle-icon{font-size:.75rem;line-height:1;user-select:none}
.theme-toggle-lbl{font-size:.54rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text2);display:none}
@media(min-width:960px){.theme-toggle-lbl{display:block}}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;font-weight:300}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font-family:inherit;outline:none}
::selection{background:rgba(201,168,76,0.25);color:var(--text)}
::-webkit-scrollbar{width:2px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--gold-d)}

.img-ar-16-9{aspect-ratio:16/9;overflow:hidden;background:var(--bg4)}
.img-ar-4-3{aspect-ratio:4/3;overflow:hidden;background:var(--bg4)}
.img-ar-sq{aspect-ratio:1;overflow:hidden;background:var(--bg4)}
.img-ar-16-9 img,.img-ar-4-3 img,.img-ar-sq img{width:100%;height:100%;object-fit:cover;display:block}
.nc-thumb{width:64px;height:64px;border-radius:12px;overflow:hidden;flex-shrink:0;background:var(--bg4);aspect-ratio:1}
.nc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ani-thumb{width:72px;height:54px;border-radius:12px;overflow:hidden;flex-shrink:0;background:var(--bg4);aspect-ratio:4/3}
.ani-thumb img{width:100%;height:100%;object-fit:cover;display:block}

#bg-canvas{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.4}

/* SEO SECTIONS */
/* FEATURES — numbered stacked rows, wealthclub-style */
.feat-section{padding:110px 40px 90px;position:relative;z-index:1;background:var(--bg)}
.feat-inner{max-width:1100px;margin:0 auto}
.feat-head{text-align:center;max-width:640px;margin:0 auto 64px}
.feat-kicker{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:16px;display:block}
.feat-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:600;line-height:1.2;margin-bottom:22px}
.feat-row{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:46px 0;border-top:1px solid var(--card-border)}
.feat-row:last-child{border-bottom:1px solid var(--card-border)}
.feat-row.rev .feat-body{order:2}
.feat-row.rev .feat-preview{order:1}
.feat-num{font-family:'Space Grotesk',sans-serif;font-size:.72rem;color:var(--gold);letter-spacing:.08em;margin-bottom:14px}
.feat-h3{font-family:'Space Grotesk',sans-serif;font-size:1.5rem;font-weight:600;margin-bottom:12px;line-height:1.25}
.feat-p{font-size:.82rem;color:var(--text2);line-height:1.9;max-width:420px}
.feat-preview{background:rgba(23,23,27,0.85);border:1px solid var(--card-border);border-radius:18px;padding:22px;backdrop-filter:blur(20px);box-shadow:0 30px 60px rgba(0,0,0,.4);transition:transform .3s,border-color .3s}
.feat-row:hover .feat-preview{transform:translateY(-4px);border-color:rgba(201,168,76,.3)}
.feat-preview-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.feat-tag{font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:8px;background:rgba(201,168,76,.1);border:1px solid var(--gold-border);color:var(--gold)}
.feat-pill{font-size:.6rem;color:var(--text3)}
.feat-mini-title{font-family:'Space Grotesk',sans-serif;font-size:.95rem;font-weight:500;margin-bottom:14px}
.feat-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.feat-chip{font-size:.55rem;letter-spacing:.05em;padding:5px 11px;border-radius:999px;background:var(--bg4);color:var(--text2);border:1px solid var(--card-border)}
.feat-bars{display:flex;align-items:flex-end;gap:6px;height:60px;margin:6px 0}
.feat-bars span{flex:1;background:linear-gradient(180deg,var(--gold),var(--gold-d));border-radius:4px 4px 0 0;opacity:.85}
.feat-avatars{display:flex;gap:10px}
.feat-avatar{width:52px;height:52px;border-radius:12px;background:var(--bg4);border:1px solid var(--card-border);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.feat-avatar-dot{width:22px;height:22px;border-radius:50%;background:var(--bg5);display:flex;align-items:center;justify-content:center;font-size:.6rem;color:var(--gold);font-family:'Space Grotesk',sans-serif}
.feat-avatar-l{font-size:.48rem;color:var(--text3);letter-spacing:.04em}
.feat-chat-bubble{background:var(--bg4);border:1px solid var(--card-border);border-radius:12px;padding:10px 12px;font-size:.62rem;color:var(--text2);margin-bottom:8px}
.feat-chat-online{display:flex;align-items:center;gap:6px;font-size:.55rem;color:var(--green);margin-top:10px}
.feat-chat-dot{width:6px;height:6px;border-radius:50%;background:var(--green)}
.feat-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:8px}
.feat-cal-cell{aspect-ratio:1;border-radius:6px;background:var(--bg4);display:flex;align-items:center;justify-content:center;font-size:.5rem;color:var(--text3)}
.feat-cal-cell.on{background:rgba(201,168,76,.18);color:var(--gold);border:1px solid var(--gold-border)}
@media(max-width:900px){.feat-row,.feat-row.rev .feat-body,.feat-row.rev .feat-preview{grid-template-columns:1fr;order:initial}.feat-row{grid-template-columns:1fr;gap:24px}}

.seo-section{padding:80px 40px;position:relative;z-index:1;background:var(--bg2);}
.seo-section+.seo-section{background:var(--bg);border-top:1px solid var(--card-border);}
.seo-inner{max-width:1200px;margin:0 auto}
.seo-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.seo-h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.6rem,2.5vw,2.2rem);font-weight:500;line-height:1.2;margin-bottom:16px;}
.seo-h1 span{background:linear-gradient(120deg,var(--gold-d),var(--gold),var(--gold-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.seo-p{font-size:.82rem;color:var(--text2);line-height:2;margin-bottom:14px;letter-spacing:.02em}
.seo-h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.4rem,2vw,1.9rem);font-weight:500;margin-bottom:14px;margin-top:32px;line-height:1.25}
.seo-h2:first-child{margin-top:0}
.seo-h2 span{color:var(--gold)}
.seo-list{list-style:none;margin:0 0 14px 0;padding:0}
.seo-list li{font-size:.8rem;color:var(--text2);line-height:1.9;padding-left:18px;position:relative;margin-bottom:4px}
.seo-list li::before{content:'';position:absolute;left:0;width:4px;height:4px;border-radius:50%;background:var(--gold);top:.7em}
.seo-divider{height:1px;background:linear-gradient(90deg,transparent,var(--card-border),transparent);margin:48px 0}
.seo-cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:32px}
.seo-col-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:16px;padding:24px 20px}
.seo-col-card-t{font-family:'Space Grotesk',sans-serif;font-size:1.1rem;margin-bottom:10px;color:var(--gold)}
.seo-col-card-p{font-size:.74rem;color:var(--text2);line-height:1.9}
.faq-list{display:flex;flex-direction:column;gap:12px;margin-top:24px}
.faq-item{background:var(--bg3);border:1px solid var(--card-border);border-radius:16px;overflow:hidden}
.faq-q{padding:18px 20px;font-size:.84rem;font-weight:400;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq-q::after{content:'▾';color:var(--gold);font-size:.8rem;flex-shrink:0;transition:transform .25s}
.faq-item.open .faq-q::after{transform:rotate(-180deg)}
.faq-a{font-size:.76rem;color:var(--text2);line-height:1.9;padding:0 20px 18px;display:none}
.faq-item.open .faq-a{display:block}
.seo-trust-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:32px}
.seo-trust-card{text-align:center;padding:24px 16px;background:var(--bg3);border:1px solid var(--card-border);border-radius:16px}
.stc-v{font-family:'Space Grotesk',sans-serif;font-size:2rem;font-weight:600;background:linear-gradient(135deg,var(--gold),var(--gold-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}
.stc-l{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3);margin-top:6px}

/* LOADING */
#loader{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;transition:opacity .6s,visibility .6s}
#loader.out{opacity:0;visibility:hidden}
.loader-mark{width:64px;height:64px;border-radius:50%;border:1px solid var(--gold-border);display:flex;align-items:center;justify-content:center;position:relative;animation:rotateMark 3s linear infinite}
.loader-mark::before{content:'';position:absolute;inset:-8px;border-radius:50%;border:1px solid transparent;border-top-color:var(--gold);animation:rotateMark 1.4s linear infinite reverse}
.loader-m{font-family:'Space Grotesk',sans-serif;font-size:1.5rem;font-weight:600;color:var(--gold);line-height:1}
.loader-name{font-family:'Space Grotesk',sans-serif;font-size:.75rem;letter-spacing:.35em;color:var(--text2)}
.loader-line{width:120px;height:1px;background:rgba(201,168,76,0.1);position:relative;overflow:hidden}
.loader-line::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:scanLine 1.4s ease-in-out infinite}
@keyframes rotateMark{to{transform:rotate(360deg)}}
@keyframes scanLine{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}

/* NAVBAR */
#nav{position:fixed;top:16px;left:16px;right:16px;z-index:500;height:60px;padding:0 10px 0 22px;display:flex;align-items:center;justify-content:space-between;transition:all .35s;background:rgba(16,16,19,0.72);backdrop-filter:blur(20px);border:1px solid var(--card-border);border-radius:999px;max-width:1240px;margin:0 auto}
#nav.solid{background:rgba(16,16,19,0.88);box-shadow:0 12px 32px rgba(0,0,0,0.35)}
.nav-logo{display:flex;align-items:center;gap:10px;cursor:pointer;text-decoration:none}
.nav-mark{width:32px;height:32px;border-radius:50%;background:var(--bg4);display:flex;align-items:center;justify-content:center;position:relative;flex-shrink:0;overflow:hidden}
.nav-mark::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:1px solid var(--gold-border)}
.nav-mark img{width:100%;height:100%;object-fit:cover}
.nav-brandname{font-family:'Space Grotesk',sans-serif;font-size:.78rem;letter-spacing:.02em;font-weight:500}
.nav-brandname b{color:var(--gold)}
.nav-center{display:flex;align-items:center;gap:2px}
.nav-link{font-size:.74rem;font-weight:400;letter-spacing:.01em;color:var(--text2);padding:8px 16px;border-radius:999px;cursor:pointer;transition:all .2s;position:relative;border:none;background:none}
.nav-link:hover{color:var(--text);background:rgba(255,255,255,0.06)}
.nav-link.active{color:var(--bg);background:var(--gold)}
.nav-dropdown{position:relative}
.nav-caret{display:inline-block;font-size:.6em;margin-left:4px;transition:transform .25s;position:relative;top:-1px}
.nav-dropdown.open .nav-caret{transform:rotate(180deg)}
.nav-dropdown-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);min-width:210px;background:rgba(16,16,19,0.98);backdrop-filter:blur(24px);border:1px solid var(--card-border);border-radius:16px;padding:6px;display:flex;flex-direction:column;gap:2px;z-index:600;box-shadow:0 24px 48px rgba(0,0,0,0.5);opacity:0;visibility:hidden;transform:translateX(-50%) translateY(-6px);transition:opacity .2s,transform .2s,visibility .2s}
.nav-dropdown.open .nav-dropdown-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-dropdown-item{font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text2);padding:10px 14px;border-radius:12px;cursor:pointer;background:none;border:none;text-align:left;width:100%;transition:all .2s;white-space:nowrap}
.nav-dropdown-item:hover{background:rgba(201,168,76,0.08);color:var(--gold)}
.nav-dropdown-item.gold{color:var(--gold);border-bottom:1px solid var(--card-border);margin-bottom:2px;padding-bottom:12px}
.nav-dropdown-item{display:flex;align-items:center;justify-content:space-between;gap:8px}
.nav-di-label{font-size:.46rem;letter-spacing:.14em;padding:2px 6px;border-radius:8px;flex-shrink:0;font-weight:500}
.nav-di-label.vip{background:rgba(201,168,76,0.15);border:1px solid var(--gold-border);color:var(--gold)}
.nav-di-label.free{background:rgba(61,186,122,0.12);border:1px solid rgba(61,186,122,0.3);color:var(--green)}
.mob-tool-label{font-size:.45rem;letter-spacing:.12em;padding:2px 6px;border-radius:8px;flex-shrink:0;font-weight:500;margin-left:auto}
.mob-tool-label.vip{background:rgba(201,168,76,0.15);border:1px solid var(--gold-border);color:var(--gold)}
.mob-tool-label.free{background:rgba(61,186,122,0.12);border:1px solid rgba(61,186,122,0.3);color:var(--green)}
.mob-sublink{display:flex;align-items:center;gap:8px}
.nav-right{display:flex;align-items:center;gap:8px}
.nav-btn-login{background:rgba(255,255,255,0.06);border:1px solid var(--card-border);color:var(--text);font-size:.72rem;font-weight:400;padding:9px 18px;cursor:pointer;transition:all .2s;border-radius:999px}
.nav-btn-login:hover{background:rgba(255,255,255,0.1);border-color:var(--gold-border)}
.nav-btn-vip{background:var(--text);border:none;color:var(--bg);font-size:.72rem;font-weight:500;padding:9px 18px;cursor:pointer;border-radius:999px;transition:all .2s;animation:btnGlow 2.6s ease-in-out infinite}
.nav-btn-vip:hover{background:var(--gold);transform:translateY(-1px);animation-play-state:paused}
.nav-user-wrap{display:flex;align-items:center;gap:8px}
.nav-avatar{width:32px;height:32px;border-radius:50%;border:1px solid var(--gold-border);background:var(--bg4);display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-size:.8rem;color:var(--gold);cursor:pointer}
.nav-username{font-size:.7rem;color:var(--text2);max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vip-pill{font-size:.5rem;letter-spacing:.15em;text-transform:uppercase;padding:2px 7px;background:rgba(201,168,76,0.12);border:1px solid var(--gold-border);color:var(--gold);border-radius:8px}
.admin-pill{font-size:.5rem;letter-spacing:.15em;text-transform:uppercase;padding:2px 7px;background:rgba(61,186,122,0.1);border:1px solid rgba(61,186,122,0.3);color:var(--green);border-radius:8px}
.btn-logout{background:none;border:1px solid rgba(90,82,72,0.4);color:var(--text3);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-logout:hover{border-color:rgba(224,90,90,0.4);color:var(--red)}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none}
.hamburger span{display:block;width:22px;height:1px;background:var(--gold);transition:.3s}
.hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
#mob-nav{
  position:fixed;
  top:var(--nav-h);
  right:0;
  bottom:0;
  width:min(320px,85vw);
  background:rgba(10,10,13,0.98);
  backdrop-filter:blur(24px);
  border-left:1px solid var(--card-border);
  z-index:490;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:8px;
  padding:32px 36px;
  transform:translateX(100%);
  transition:transform .32s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
#mob-nav.open{
  transform:translateX(0);
  pointer-events:auto;
}
#mob-nav-backdrop{
  display:none;
  position:fixed;
  inset:0;
  top:var(--nav-h);
  background:rgba(0,0,0,0.5);
  z-index:489;
}
#mob-nav-backdrop.open{display:block}
.mob-link{
  font-family:'Space Grotesk',sans-serif;
  font-size:1rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--text2);
  cursor:pointer;
  transition:color .2s, padding-left .2s;
  padding:10px 0;
  width:100%;
  border-bottom:1px solid rgba(201,168,76,0.07);
}
.mob-link:last-of-type{border-bottom:none}
.mob-link:hover,.mob-link.active{color:var(--gold);padding-left:6px}
.mob-group-label{font-family:'Space Grotesk',sans-serif;font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-top:8px;opacity:.85}
.mob-sublink{font-family:'DM Sans',sans-serif;font-size:.78rem;letter-spacing:.08em;text-transform:none;color:var(--text2);cursor:pointer;transition:color .2s, padding-left .2s;padding:9px 0 9px 14px;width:100%;border-bottom:1px solid rgba(201,168,76,0.07)}
.mob-sublink:hover{color:var(--gold);padding-left:18px}

/* PAGES */
.page{display:none;min-height:100vh;position:relative;z-index:1;padding-top:var(--nav-h)}
.page.active{display:block}

/* SHARED */
.eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.eyebrow-line{height:1px;width:28px;background:linear-gradient(90deg,transparent,var(--gold))}
.eyebrow-line.r{background:linear-gradient(90deg,var(--gold),transparent)}
.eyebrow-txt{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.section-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(2rem,3.5vw,3rem);font-weight:500;line-height:1.15;margin-bottom:12px}
.section-sub{font-size:.82rem;color:var(--text2);line-height:1.95;letter-spacing:.03em}
.gold-text{background:linear-gradient(120deg,var(--gold-d),var(--gold),var(--gold-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* HERO — centered, wealthclub-style */
#hero{min-height:calc(100vh - var(--nav-h));display:flex;align-items:center;justify-content:center;padding:100px 24px 70px;position:relative;overflow:hidden;background:radial-gradient(ellipse 70% 55% at 50% 30%,rgba(244,244,242,0.06) 0%,transparent 65%)}
#hero::before{content:'';position:absolute;top:8%;left:50%;transform:translateX(-50%);width:min(900px,90vw);height:520px;background:radial-gradient(ellipse 50% 50% at 50% 50%,rgba(201,168,76,0.16) 0%,transparent 70%);filter:blur(40px);pointer-events:none;z-index:0}
.hero-inner{max-width:900px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;position:relative;z-index:1}
.hero-eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:22px}
.hero-kicker{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);opacity:.9}
.hero-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(2.4rem,6.4vw,4.6rem);font-weight:600;line-height:1.06;letter-spacing:-.03em;margin-bottom:26px}
.hero-desc{font-size:.92rem;color:var(--text2);line-height:1.85;max-width:560px;margin:0 auto 36px;letter-spacing:.01em}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-bottom:48px}
.btn-hero-primary{background:var(--text);border:none;color:var(--bg);font-size:.82rem;font-weight:500;padding:15px 30px;cursor:pointer;border-radius:999px;transition:all .25s;position:relative;overflow:hidden;animation:btnGlow 2.6s ease-in-out infinite}
@keyframes btnGlow{
  0%,100%{box-shadow:0 0 0 0 rgba(244,244,242,0.35),0 0 14px 2px rgba(201,168,76,0.15)}
  50%{box-shadow:0 0 0 8px rgba(244,244,242,0),0 0 30px 8px rgba(201,168,76,0.4)}
}
.btn-hero-primary:hover{background:var(--gold);transform:translateY(-2px);animation-play-state:paused}
.btn-hero-sec{background:rgba(255,255,255,0.06);border:1px solid var(--card-border);color:var(--text);font-size:.82rem;padding:15px 26px;cursor:pointer;border-radius:999px;transition:all .25s}
.btn-hero-sec:hover{background:rgba(255,255,255,0.1)}
.btn-hero-pub{background:transparent;border:1px solid rgba(37,211,102,0.35);color:#25D366;font-size:.82rem;padding:15px 26px;cursor:pointer;border-radius:999px;transition:all .25s;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.btn-hero-pub:hover{background:rgba(37,211,102,0.07)}
.hero-stats{display:flex;gap:36px;flex-wrap:wrap;justify-content:center;margin-bottom:52px}
.hero-stat{text-align:center}
.hero-stat .v{font-family:'Space Grotesk',sans-serif;font-size:2rem;font-weight:600;line-height:1;background:linear-gradient(135deg,var(--gold),var(--gold-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-stat .l{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);margin-top:6px}
.hero-right{position:relative;display:flex;align-items:center;justify-content:center;width:100%}
.hero-chart-card{width:100%;max-width:440px;background:rgba(23,23,27,0.85);border:1px solid var(--card-border);backdrop-filter:blur(20px);padding:24px;border-radius:18px;box-shadow:0 40px 80px rgba(0,0,0,0.5),0 0 0 1px rgba(201,168,76,0.06);animation:floatCard 4s ease-in-out infinite}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hcc-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.hcc-sym{font-family:'Space Grotesk',sans-serif;font-size:1rem;letter-spacing:.12em;color:var(--text)}
.hcc-live{display:flex;align-items:center;gap:6px;font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3)}
.hcc-dot{width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}
.hcc-price{font-family:'Space Grotesk',sans-serif;font-size:3rem;font-weight:600;line-height:1;margin-bottom:4px;background:linear-gradient(135deg,var(--gold),var(--gold-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hcc-change{font-size:.72rem;letter-spacing:.06em}
.hcc-svg{width:100%;height:80px;margin:20px 0}
.hcc-metrics{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--card-border)}
.hcc-metric{background:var(--bg3);padding:12px;text-align:center}
.hcc-metric-l{font-size:.5rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3);margin-bottom:5px}
.hcc-metric-v{font-family:'Space Grotesk',sans-serif;font-size:.98rem}

/* TICKER */
.ticker-wrap{background:rgba(16,16,19,0.95);border-top:1px solid var(--card-border);border-bottom:1px solid var(--card-border);padding:9px 0;overflow:hidden;position:relative}
.ticker-inner{display:flex;animation:tickerMove 30s linear infinite;white-space:nowrap}
.ticker-inner:hover{animation-play-state:paused}
.ticker-item{display:flex;align-items:center;gap:8px;padding:0 28px;flex-shrink:0}
.ti-sym{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3)}
.ti-price{font-family:'Space Grotesk',sans-serif;font-size:.92rem;color:var(--text)}
.ti-sep{color:var(--text3);opacity:.3;font-size:.8rem}
@keyframes tickerMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ABOUT */
#s-about{padding:100px 40px;background:var(--bg2)}
.about-inner{max-width:1200px;margin:0 auto}
.about-header{text-align:center;margin-bottom:72px}
.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.about-card{padding:36px 28px;background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;transition:all .35s;position:relative;overflow:hidden;cursor:default}
.about-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:0;transition:.35s}
.about-card:hover{transform:translateY(-6px);border-color:rgba(201,168,76,0.35);background:var(--bg4)}
.about-card:hover::before{opacity:1}
.ac-num{font-family:'Space Grotesk',sans-serif;font-size:3rem;font-weight:600;color:var(--gold);opacity:.15;position:absolute;top:16px;right:20px;line-height:1}
.ac-icon{width:48px;height:48px;border:1px solid rgba(201,168,76,0.2);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;background:rgba(201,168,76,0.04);color:var(--gold)}
.ac-title{font-family:'Space Grotesk',sans-serif;font-size:1.35rem;font-weight:500;margin-bottom:10px}
.ac-desc{font-size:.75rem;color:var(--text2);line-height:1.95;letter-spacing:.02em}

/* TESTIMONIALS */
#s-testi{padding:100px 40px}
.testi-inner{max-width:1200px;margin:0 auto}
.testi-header{text-align:center;margin-bottom:72px}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.testi-card{padding:28px;background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;transition:all .3s}
.testi-card:hover{border-color:rgba(201,168,76,0.3);transform:translateY(-4px)}
.testi-stars{color:var(--gold);font-size:.65rem;letter-spacing:3px;margin-bottom:14px}
.testi-quote{font-size:.78rem;color:var(--text2);line-height:1.9;font-style:italic;margin-bottom:18px;position:relative;padding-left:16px}
.testi-quote::before{content:'"';position:absolute;left:0;top:-4px;font-family:'Space Grotesk',sans-serif;font-size:1.5rem;color:var(--gold);opacity:.4;line-height:1}
.testi-author{font-size:.78rem;font-weight:400}
.testi-role{font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-top:3px}

/* CTA */
#s-cta{padding:100px 40px;background:var(--bg2)}
.cta-inner{max-width:900px;margin:0 auto;text-align:center}
.cta-badge{display:inline-block;font-size:.58rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);background:rgba(201,168,76,0.08);border:1px solid var(--gold-border);padding:6px 16px;border-radius:8px;margin-bottom:24px}
.cta-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(2.2rem,4vw,3.8rem);font-weight:600;margin-bottom:16px;line-height:1.15}
.cta-sub{font-size:.84rem;color:var(--text2);line-height:1.9;max-width:540px;margin:0 auto 40px;letter-spacing:.03em}
.cta-btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.wa-btn{display:inline-flex;align-items:center;gap:10px;background:#25D366;color:#08130C;font-size:.82rem;font-weight:500;border:none;padding:16px 34px;cursor:pointer;border-radius:999px;transition:all .25s;box-shadow:0 8px 24px rgba(37,211,102,0.25)}
.wa-btn:hover{box-shadow:0 0 40px rgba(37,211,102,0.5);transform:translateY(-2px)}
.wa-btn-pub{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,0.06);border:1px solid var(--card-border);color:var(--text);font-size:.82rem;padding:16px 34px;cursor:pointer;border-radius:999px;transition:all .25s}
.wa-btn-pub:hover{background:rgba(37,211,102,0.07)}

/* BERITA PAGE */
#page-berita{padding:var(--nav-h) 40px 80px}
.news-skel{display:flex;flex-direction:column;gap:14px}
.news-skel-feat{height:280px;border-radius:22px;background:linear-gradient(90deg,rgba(201,168,76,.06),rgba(201,168,76,.14),rgba(201,168,76,.06));background-size:200% 100%;animation:newsSkelPulse 1.6s ease-in-out infinite}
.news-skel-row{height:84px;border-radius:22px;background:linear-gradient(90deg,rgba(201,168,76,.06),rgba(201,168,76,.14),rgba(201,168,76,.06));background-size:200% 100%;animation:newsSkelPulse 1.6s ease-in-out infinite}
@keyframes newsSkelPulse{0%{background-position:200% 0}100%{background-position:-200% 0}}
.news-inner{max-width:1200px;margin:0 auto}
.news-top{padding:60px 0 48px;text-align:center}
.news-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px}
.news-featured{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden;margin-bottom:16px;cursor:pointer;transition:all .3s;display:flex;flex-direction:column}
.news-featured:hover{border-color:rgba(201,168,76,0.35);transform:translateY(-3px)}
.news-featured-thumb{position:relative;overflow:hidden;flex-shrink:0}
.news-featured-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.nf-cat{position:absolute;top:16px;left:16px;font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;background:rgba(201,168,76,0.9);color:var(--bg);padding:4px 10px;border-radius:8px;z-index:1}
.news-featured-body{padding:24px}
.nf-date{font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text3);margin-bottom:10px}
.nf-title{font-family:'Space Grotesk',sans-serif;font-size:1.45rem;font-weight:500;margin-bottom:10px;line-height:1.3}
.nf-excerpt{font-size:.76rem;color:var(--text2);line-height:1.85;letter-spacing:.02em}
.news-list{display:flex;flex-direction:column;gap:12px}
.news-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;padding:18px;display:flex;gap:14px;cursor:pointer;transition:all .25s}
.news-card:hover{border-color:rgba(201,168,76,0.3);background:var(--bg4)}
.nc-cat-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex-shrink:0;margin-top:5px}
.nc-body{flex:1;min-width:0}
.nc-cat{font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:5px}
.nc-title{font-size:.82rem;font-weight:400;margin-bottom:5px;letter-spacing:.02em;line-height:1.45}
.nc-date{font-size:.6rem;color:var(--text3)}
.news-sidebar-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden;margin-bottom:14px}
.nsc-header{padding:14px 16px;border-bottom:1px solid var(--card-border);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.nsc-item{padding:14px 16px;border-bottom:1px solid rgba(201,168,76,0.06);cursor:pointer;transition:background .2s}
.nsc-item:last-child{border-bottom:none}
.nsc-item:hover{background:var(--bg4)}
.nsc-title{font-size:.76rem;margin-bottom:4px;color:var(--text)}
.nsc-meta{font-size:.58rem;color:var(--text3)}
.price-widget{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden}
.pw-header{padding:12px 16px;border-bottom:1px solid var(--card-border);font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.pw-row{padding:10px 16px;border-bottom:1px solid rgba(201,168,76,0.06);display:flex;justify-content:space-between;align-items:center}
.pw-row:last-child{border-bottom:none}
.pw-sym{font-size:.72rem;color:var(--text2)}
.pw-price{font-family:'Space Grotesk',sans-serif;font-size:.98rem}
.pw-chg{font-size:.62rem}

/* ECONOMIC CALENDAR WIDGET */
.ecal-widget{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden;margin-bottom:14px}
.ecal-header{padding:14px 16px;border-bottom:1px solid var(--card-border);display:flex;align-items:center;justify-content:space-between;gap:8px}
.ecal-title{font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:8px}
.ecal-live{display:inline-flex;align-items:center;gap:5px;font-size:.55rem;letter-spacing:.15em;color:var(--green);text-transform:uppercase}
.ecal-live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:ecalPulse 1.6s ease-in-out infinite}
@keyframes ecalPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}
.ecal-filters{display:flex;gap:6px;padding:10px 16px;flex-wrap:wrap;border-bottom:1px solid var(--card-border)}
.ecal-fbtn{font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text2);background:var(--bg4);border:1px solid var(--card-border);border-radius:26px;padding:5px 12px;cursor:pointer;transition:all .2s;white-space:nowrap}
.ecal-fbtn:hover{color:var(--gold);border-color:var(--gold-border)}
.ecal-fbtn.on{background:linear-gradient(135deg,var(--gold),var(--gold-d));color:var(--bg);border-color:transparent;font-weight:500}
.ecal-list{max-height:420px;overflow-y:auto}
.ecal-row{display:flex;gap:10px;padding:12px 16px;border-bottom:1px solid rgba(201,168,76,0.06);align-items:flex-start;transition:background .2s}
.ecal-row:last-child{border-bottom:none}
.ecal-row:hover{background:var(--bg4)}
.ecal-row.is-next{background:linear-gradient(90deg,rgba(201,168,76,0.08),transparent)}
.ecal-time{flex-shrink:0;width:48px;font-family:'Space Grotesk',sans-serif;font-size:.82rem;color:var(--text);padding-top:1px}
.ecal-time small{display:block;font-size:.5rem;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;margin-top:2px}
.ecal-impact{flex-shrink:0;width:14px;display:flex;justify-content:center;padding-top:5px}
.ecal-dot{width:8px;height:8px;border-radius:50%;display:block}
.ecal-dot.high{background:var(--red);box-shadow:0 0 8px rgba(224,90,90,0.6)}
.ecal-dot.medium{background:var(--gold);box-shadow:0 0 8px rgba(201,168,76,0.5)}
.ecal-dot.low{background:var(--text3)}
.ecal-body{flex:1;min-width:0}
.ecal-event-top{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap}
.ecal-curr{font-size:.6rem;letter-spacing:.1em;font-weight:500;color:var(--gold);background:rgba(201,168,76,0.1);border:1px solid var(--gold-border);border-radius:10px;padding:1px 6px;flex-shrink:0}
.ecal-name{font-size:.72rem;color:var(--text);line-height:1.4}
.ecal-vals{display:flex;gap:14px;font-size:.62rem;color:var(--text2);margin-top:5px;flex-wrap:wrap}
.ecal-vals b{color:var(--text);font-weight:500}
.ecal-vals .v-better{color:var(--green)}
.ecal-vals .v-worse{color:var(--red)}
.ecal-footer{padding:10px 16px;text-align:center;border-top:1px solid var(--card-border)}
.ecal-footer a{font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);transition:opacity .2s}
.ecal-footer a:hover{opacity:.7}
.ecal-empty{padding:32px 16px;text-align:center;color:var(--text3);font-size:.7rem}
.ecal-list::-webkit-scrollbar{width:3px}
.ecal-list::-webkit-scrollbar-thumb{background:var(--gold-d)}
.ecal-datehead{padding:8px 16px;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid var(--card-border)}
.ecal-datehead.today{background:rgba(201,168,76,0.08);color:var(--gold)}
.ecal-datehead.future{background:var(--bg4);color:var(--text3)}
.ecal-bias{display:inline-flex;align-items:center;gap:3px;font-size:.56rem;font-weight:500;border-radius:20px;padding:1px 7px;margin-left:6px;white-space:nowrap}
.ecal-bias.bull{color:#1a3d0f;background:#9fd97a}
.ecal-bias.bear{color:#4a1414;background:#e69a9a}
.ecal-bias svg{width:10px;height:10px}

/* NEWS DETAIL */
#news-detail-view{display:none}
#news-detail-view.open{display:block}
.nd-back{display:inline-flex;align-items:center;gap:8px;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text2);background:none;border:1px solid var(--card-border);padding:8px 16px;border-radius:var(--radius);cursor:pointer;transition:all .25s;margin:32px 0 24px}
.nd-back:hover{border-color:var(--gold);color:var(--gold)}
.nd-wrap{max-width:820px;margin:0 auto;padding:0 0 80px}
.nd-cat-bar{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.nd-cat-badge{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;background:rgba(201,168,76,0.12);border:1px solid var(--gold-border);color:var(--gold);padding:4px 12px;border-radius:8px}
.nd-date{font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text3)}
.nd-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:500;line-height:1.15;margin-bottom:18px}
.nd-excerpt{font-size:.9rem;color:var(--text2);line-height:1.9;border-left:2px solid var(--gold);padding-left:18px;margin-bottom:32px;font-style:italic}
.nd-hero-img{border-radius:18px;overflow:hidden;margin-bottom:36px;aspect-ratio:16/9;background:var(--bg4)}
.nd-hero-img img{width:100%;height:100%;object-fit:cover;display:block}
.nd-body{font-size:.84rem;color:var(--text2);line-height:2;letter-spacing:.02em;white-space:pre-wrap}
.nd-share{margin-top:48px;padding-top:28px;border-top:1px solid var(--card-border);display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.nd-share-label{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text3)}

/* VIP */
#page-vip{padding:var(--nav-h) 0 80px}
.vip-hero{padding:80px 40px 100px;text-align:center;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(201,168,76,0.06),transparent 65%)}
.vip-hero-badge{display:inline-flex;align-items:center;gap:8px;font-size:.6rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);background:rgba(201,168,76,0.07);border:1px solid var(--gold-border);padding:8px 18px;border-radius:8px;margin-bottom:28px}
.vip-hero-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(2.8rem,5vw,5rem);font-weight:600;line-height:1.08;margin-bottom:18px}
.vip-hero-sub{font-size:.86rem;color:var(--text2);max-width:500px;margin:0 auto 48px;line-height:1.95}
.vip-price-card{max-width:860px;margin:0 auto 72px;background:linear-gradient(160deg,rgba(22,22,30,0.98),rgba(16,16,19,0.99));border:1px solid rgba(201,168,76,0.28);border-radius:20px;overflow:hidden;box-shadow:0 0 0 1px rgba(201,168,76,0.05),0 60px 100px rgba(0,0,0,0.6)}
.vpc-top{background:linear-gradient(90deg,var(--gold-xd),var(--gold-d),var(--gold),var(--gold-d),var(--gold-xd));padding:14px 32px;text-align:center;font-family:'Space Grotesk',sans-serif;font-size:.65rem;letter-spacing:.3em;color:rgba(240,234,214,0.85)}
.vpc-body{padding:48px 40px}
.vpc-price-area{text-align:center;margin-bottom:48px}
.vpc-price-label{font-size:.58rem;letter-spacing:.25em;text-transform:uppercase;color:var(--text3);margin-bottom:10px}
.vpc-price-val{font-family:'Space Grotesk',sans-serif;font-size:5rem;font-weight:600;line-height:1;background:linear-gradient(135deg,var(--gold),var(--gold-l));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.vpc-price-note{font-size:.82rem;color:var(--text3);letter-spacing:.12em;margin-top:8px}
.vpc-benefits{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:48px}
.vpc-benefit{display:flex;gap:14px;padding:18px;background:rgba(201,168,76,0.02);border:1px solid rgba(201,168,76,0.09);border-radius:16px;transition:border-color .25s}
.vpc-benefit:hover{border-color:rgba(201,168,76,0.25)}
.vpc-benefit-icon{width:36px;height:36px;background:rgba(201,168,76,0.07);border:1px solid rgba(201,168,76,0.15);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0}
.vb-title{font-size:.84rem;letter-spacing:.04em;margin-bottom:3px}
.vb-desc{font-size:.68rem;color:var(--text3);line-height:1.65}
.vpc-cta{text-align:center}
.vpc-note{font-size:.65rem;color:var(--text3);margin-top:12px;letter-spacing:.04em}
.vpc-wa-btn{display:inline-flex;align-items:center;gap:12px;background:linear-gradient(135deg,#25D366,#1a9e50);color:#fff;font-size:.65rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;border:none;padding:17px 44px;cursor:pointer;border-radius:var(--radius);transition:all .25s;box-shadow:0 0 30px rgba(37,211,102,0.35)}
.vpc-wa-btn:hover{box-shadow:0 0 50px rgba(37,211,102,0.55);transform:translateY(-2px)}

/* AUTH */
#page-auth{min-height:100vh;align-items:center;justify-content:center;padding:var(--nav-h) 20px 40px;background:radial-gradient(ellipse 60% 50% at 50% 30%,rgba(201,168,76,0.04),transparent 60%)}
#page-auth.active{display:flex}
.auth-wrap{width:100%;max-width:400px}
.auth-logo{text-align:center;margin-bottom:32px}
.auth-logo-mark{width:52px;height:52px;border-radius:50%;background:var(--bg4);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:0 0 24px rgba(201,168,76,0.3);overflow:hidden;position:relative}
.auth-logo-mark img{width:100%;height:100%;object-fit:cover}
.auth-logo-name{font-family:'Space Grotesk',sans-serif;font-size:.9rem;letter-spacing:.2em;font-weight:500;margin-bottom:4px}
.auth-logo-name b{color:var(--gold)}
.auth-logo-sub{font-size:.58rem;letter-spacing:.25em;text-transform:uppercase;color:var(--text3)}
.auth-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.4)}
.auth-tabs{display:flex;border-bottom:1px solid var(--card-border)}
.auth-tab{flex:1;padding:14px;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3);text-align:center;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s;background:none;border:none;border-bottom:2px solid transparent}
.auth-tab.on{color:var(--gold);border-bottom-color:var(--gold)}
.auth-form{padding:24px;display:none}
.auth-form.on{display:block}
.auth-group{margin-bottom:14px}
.auth-label{display:block;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);margin-bottom:7px}
.auth-input{width:100%;background:var(--bg4);border:1px solid var(--card-border);color:var(--text);font-size:.8rem;font-weight:300;padding:10px 12px;border-radius:var(--radius);transition:border-color .2s}
.auth-input::placeholder{color:var(--text3)}
.auth-input:focus{border-color:var(--gold)}
.auth-submit{width:100%;background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.65rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;padding:13px;cursor:pointer;border-radius:var(--radius);transition:opacity .2s;margin-top:8px;display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px}
.auth-submit:hover{opacity:.9}
.auth-submit:disabled{opacity:.5;cursor:not-allowed}
.auth-err{font-size:.65rem;color:var(--red);margin-top:8px;min-height:16px;line-height:1.5}
.auth-success{font-size:.65rem;color:var(--green);margin-top:8px;min-height:16px;line-height:1.5;display:none}
.auth-info{font-size:.65rem;color:var(--text3);text-align:center;padding:16px;line-height:1.9;letter-spacing:.04em}
/* Google Sign In */
.auth-divider{display:flex;align-items:center;gap:10px;margin:12px 24px 8px}
.auth-divider-line{flex:1;height:1px;background:var(--card-border)}
.auth-divider-txt{font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text3);white-space:nowrap}
.btn-google{width:calc(100% - 48px);margin:0 24px 4px;display:flex;align-items:center;justify-content:center;gap:10px;background:transparent;border:1px solid var(--card-border);color:var(--text);font-size:.7rem;letter-spacing:.06em;padding:11px 16px;cursor:pointer;border-radius:var(--radius);transition:all .25s}
.btn-google:hover{background:rgba(201,168,76,0.06);border-color:rgba(201,168,76,0.4);color:var(--gold)}
.btn-google svg{flex-shrink:0}
.auth-forgot{display:block;text-align:right;font-size:.62rem;color:var(--text3);margin-top:6px;cursor:pointer;transition:color .2s;background:none;border:none;padding:0;letter-spacing:.04em}
.auth-forgot:hover{color:var(--gold);text-decoration:underline}
/* Forgot password overlay */
.fp-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);z-index:800;display:none;align-items:center;justify-content:center;padding:20px}
.fp-overlay.open{display:flex}
.fp-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:20px;padding:32px 28px;width:100%;max-width:380px;box-shadow:0 40px 80px rgba(0,0,0,.5)}
.fp-title{font-family:'Space Grotesk',sans-serif;font-size:1.4rem;margin-bottom:6px;color:var(--text)}
.fp-sub{font-size:.7rem;color:var(--text3);margin-bottom:22px;line-height:1.8}
.fp-label{font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text3);display:block;margin-bottom:6px}
.fp-input{width:100%;background:var(--bg4);border:1px solid var(--card-border);color:var(--text);font-size:.8rem;padding:11px 14px;border-radius:var(--radius);outline:none;transition:border-color .2s;margin-bottom:12px}
.fp-input:focus{border-color:rgba(201,168,76,0.5)}
.fp-err{font-size:.68rem;color:var(--red);margin-bottom:10px;display:none;background:rgba(224,90,90,.06);border:1px solid rgba(224,90,90,.2);padding:8px 12px;border-radius:12px}
.fp-ok{font-size:.68rem;color:var(--green);margin-bottom:10px;display:none;background:rgba(61,186,122,.06);border:1px solid rgba(61,186,122,.2);padding:8px 12px;border-radius:12px}
.fp-actions{display:flex;gap:10px}
.fp-cancel{flex:1;background:transparent;border:1px solid var(--card-border);color:var(--text2);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;padding:10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.fp-cancel:hover{border-color:rgba(201,168,76,.3)}
.fp-submit{flex:2;background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.65rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;padding:10px;cursor:pointer;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;gap:6px;transition:opacity .2s}
.fp-submit:hover{opacity:.85}
.fp-submit:disabled{opacity:.5;cursor:default}
.spin{width:14px;height:14px;border:2px solid rgba(0,0,0,.2);border-top-color:var(--bg);border-radius:50%;animation:rotateMark .6s linear infinite}

/* JOURNAL APP */
#page-journal{padding-top:var(--nav-h)}
.app-header{background:rgba(10,10,13,0.96);border-bottom:1px solid var(--card-border);padding:16px 28px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;position:sticky;top:var(--nav-h);z-index:300;backdrop-filter:blur(20px)}
.app-htitle{font-family:'Space Grotesk',sans-serif;font-size:1.15rem;font-weight:500;letter-spacing:-.01em}
.app-htitle span{color:var(--gold)}
.app-subtitle{font-size:.62rem;letter-spacing:.1em;color:var(--text3);margin-top:2px}
.live-badge{display:flex;align-items:center;gap:6px;font-size:.6rem;letter-spacing:.08em;color:var(--text2);border:1px solid var(--card-border);padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.03)}
.save-status{font-size:.6rem;letter-spacing:.06em;color:var(--text3);display:flex;align-items:center;gap:5px}
.save-status.saved .save-dot{background:var(--green)}
.save-status.saving .save-dot{background:var(--gold);animation:pulse 1s infinite}
.save-status.error .save-dot{background:var(--red)}
.pricebar{background:rgba(16,16,19,0.96);border-bottom:1px solid var(--card-border);padding:10px 28px;display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;position:sticky;top:calc(var(--nav-h) + 62px);z-index:299}
.pricebar::-webkit-scrollbar{display:none}
.app-tabs{display:flex;gap:4px;background:var(--bg2);border-bottom:1px solid var(--card-border);padding:10px 28px;overflow-x:auto;scrollbar-width:none}
.app-tabs::-webkit-scrollbar{display:none}
.app-tab{font-size:.72rem;font-weight:400;letter-spacing:.01em;color:var(--text2);padding:9px 18px;cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0;background:none;border:none;border-radius:999px}
.app-tab:hover{color:var(--text);background:rgba(255,255,255,0.06)}
.app-tab.on{color:var(--bg);background:var(--gold);font-weight:500}
.journal-page{display:none}.journal-page.on{display:block}
.jmain{padding:32px 28px;max-width:1400px;margin:0 auto}
.stats-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:28px}
.scard{background:var(--bg3);border:1px solid var(--card-border);padding:20px 18px 16px;border-radius:16px;transition:all .25s}
.scard:hover{border-color:rgba(201,168,76,0.3);transform:translateY(-2px)}
.scard-l{font-size:.62rem;letter-spacing:.06em;color:var(--text3);margin-bottom:10px}
.scard-v{font-family:'Space Grotesk',sans-serif;font-size:1.7rem;font-weight:600;line-height:1}
.scard-v.g{color:var(--green)}.scard-v.r{color:var(--red)}
.scard-sub{font-size:.65rem;color:var(--text3);margin-top:8px}
.sec-label{font-size:.7rem;font-weight:500;letter-spacing:.02em;color:var(--text);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.sec-label::before{content:'';width:3px;height:14px;border-radius:2px;background:var(--gold)}
.tbl-wrap{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden;margin-bottom:24px}
.tbl-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--card-border);flex-wrap:wrap;gap:10px}
.flt-btns{display:flex;gap:6px}
.flt-btn{font-size:.65rem;letter-spacing:.01em;background:none;border:1px solid var(--card-border);color:var(--text2);padding:6px 14px;cursor:pointer;border-radius:999px;transition:all .2s}
.flt-btn.on,.flt-btn:hover{border-color:var(--gold);color:var(--gold);background:rgba(201,168,76,.08)}
.app-hright{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.live-dot{width:5px;height:5px;border-radius:50%;background:var(--text3)}
.live-dot.on{background:var(--green)}
.btn-newtrade{background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.6rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:8px 16px;cursor:pointer;border-radius:var(--radius);transition:opacity .2s}
.btn-newtrade:hover{opacity:.85}
.save-dot{width:5px;height:5px;border-radius:50%;background:var(--text3)}
.pb-item{display:flex;align-items:center;gap:7px;flex-shrink:0;background:var(--bg3);border:1px solid var(--card-border);padding:6px 12px;border-radius:999px}
.pb-sym{font-size:.58rem;letter-spacing:.06em;color:var(--text3)}
.pb-price{font-family:'Space Grotesk',sans-serif;font-size:.85rem;font-weight:500}
.pb-chg{font-size:.6rem}
.up{color:var(--green)}.dn{color:var(--red)}
.tbl-ttl{font-family:'Space Grotesk',sans-serif;font-size:1rem;font-weight:500}
.tbl-scroll{overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--card-border) transparent}
table{width:100%;border-collapse:collapse;min-width:540px}
th{font-size:.62rem;letter-spacing:.04em;color:var(--text3);padding:13px 16px;text-align:left;border-bottom:1px solid var(--card-border);font-weight:500;white-space:nowrap;background:rgba(255,255,255,0.02)}
th:last-child{text-align:right}
td{font-size:.74rem;color:var(--text2);padding:12px 16px;border-bottom:1px solid rgba(201,168,76,0.04);transition:background .15s;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:rgba(201,168,76,0.025)}
td:last-child{text-align:right}
.td-sym{font-family:'Space Grotesk',sans-serif;font-size:1rem;color:var(--text)}
.badge{display:inline-block;font-size:.5rem;letter-spacing:.12em;text-transform:uppercase;padding:2px 7px;border-radius:8px;font-weight:500}
.badge.long{background:rgba(61,186,122,0.1);color:var(--green);border:1px solid rgba(61,186,122,0.25)}
.badge.short{background:rgba(224,90,90,0.1);color:var(--red);border:1px solid rgba(224,90,90,0.25)}
.badge.open{background:rgba(201,168,76,0.08);color:var(--gold);border:1px solid var(--card-border)}
.badge.tp{background:rgba(61,186,122,0.15);color:var(--green);border:1px solid rgba(61,186,122,0.3)}
.badge.sl{background:rgba(224,90,90,0.15);color:var(--red);border:1px solid rgba(224,90,90,0.25)}
.badge.lim{background:rgba(201,168,76,0.06);color:var(--gold-d);border:1px solid var(--card-border)}
.p-pos{color:var(--green)}.p-neg{color:var(--red)}.p-neu{color:var(--text2)}
.row-actions{display:flex;gap:5px;justify-content:flex-end}
.act-btn{background:none;border:1px solid var(--card-border);color:var(--text3);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.act-btn:hover{border-color:rgba(201,168,76,0.35);color:var(--text)}
.act-btn.del:hover{border-color:rgba(224,90,90,0.4);color:var(--red)}
.empty-state{text-align:center;padding:40px;color:var(--text3)}
.empty-icon{font-family:'Space Grotesk',sans-serif;font-size:2.5rem;opacity:.12;margin-bottom:10px;color:var(--gold)}
.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.chart-box,.bkd-box{background:var(--bg3);border:1px solid var(--card-border);padding:20px;border-radius:16px}
.chart-l{font-size:.52rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);margin-bottom:14px}
.eq-svg{width:100%;height:120px}
.bk-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid rgba(201,168,76,0.05)}
.bk-row:last-child{border-bottom:none}
.bk-sym{font-family:'Space Grotesk',sans-serif;font-size:.94rem;color:var(--text)}
.bk-bar-wrap{flex:1;margin:0 10px;height:3px;background:rgba(201,168,76,0.07)}
.bk-bar{height:100%}
.bk-val{font-size:.68rem;min-width:48px;text-align:right}
.notes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.note-card{background:var(--bg3);border:1px solid var(--card-border);padding:16px;border-radius:16px;transition:border-color .25s}
.note-card:hover{border-color:rgba(201,168,76,0.3)}
.note-sym{font-family:'Space Grotesk',sans-serif;font-size:1.05rem;margin-bottom:4px}
.note-date{font-size:.54rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text3);margin-bottom:10px}
.note-txt{font-size:.72rem;color:var(--text2);line-height:1.75}
.note-tag{font-size:.52rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-top:10px;opacity:.7}
.acc-sec{background:var(--bg3);border:1px solid var(--card-border);padding:22px;border-radius:18px;margin-bottom:16px}
.acc-sec-t{font-family:'Space Grotesk',sans-serif;font-size:1.1rem;margin-bottom:16px;font-weight:400}
.acc-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--card-border);flex-wrap:wrap;gap:8px}
.acc-row:last-child{border-bottom:none}
.acc-k{font-size:.68rem;color:var(--text2)}
.acc-v{font-size:.68rem;color:var(--text3)}
.btn-danger{background:none;border:1px solid rgba(192,80,80,0.25);color:var(--red);font-size:.55rem;letter-spacing:.14em;text-transform:uppercase;padding:6px 12px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-danger:hover{background:rgba(192,80,80,0.08)}
.vip-lock-box{background:var(--bg3);border:1px solid var(--card-border);padding:60px 32px;text-align:center;border-radius:18px;margin-top:24px}
.vll-icon{font-family:'Space Grotesk',sans-serif;font-size:3rem;color:var(--gold);opacity:.2;margin-bottom:16px}
.vll-title{font-family:'Space Grotesk',sans-serif;font-size:1.6rem;margin-bottom:10px}
.vll-sub{font-size:.72rem;color:var(--text3);margin-bottom:24px;line-height:1.9}
.vll-btn{background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.62rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;padding:12px 28px;cursor:pointer;border-radius:var(--radius)}
.prog-wrap{width:68px}
.prog-bar{width:100%;height:3px;background:rgba(201,168,76,0.1);margin-top:3px;border-radius:8px}
.prog-fill{height:100%;border-radius:8px}
.prog-txt{font-size:.52rem;color:var(--text3);margin-top:2px}

/* ADMIN */
#page-admin{padding-top:var(--nav-h)}
.admin-header{background:rgba(10,10,13,0.96);border-bottom:1px solid var(--card-border);padding:16px 28px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:var(--nav-h);z-index:300;backdrop-filter:blur(20px)}
.admin-htitle{font-family:'Space Grotesk',sans-serif;font-size:1.2rem;font-weight:400}
.admin-htitle span{color:var(--gold)}
.admin-main{padding:24px 28px;max-width:1400px;margin:0 auto}
.admin-tabs{display:flex;background:var(--bg2);border-bottom:1px solid var(--card-border);padding:0 28px;overflow-x:auto;scrollbar-width:none}
.admin-tabs::-webkit-scrollbar{display:none}
.admin-tab{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3);padding:14px 14px;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s;white-space:nowrap;flex-shrink:0;background:none;border:none;border-bottom:2px solid transparent}
.admin-tab:hover{color:var(--text2)}
.admin-tab.on{color:var(--gold);border-bottom-color:var(--gold)}
.admin-page{display:none}.admin-page.on{display:block}
.news-form-wrap{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;padding:28px;margin-bottom:24px}
.news-form-title{font-family:'Space Grotesk',sans-serif;font-size:1.3rem;font-weight:400;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center}
.nf-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.nf-full{grid-column:1/-1}
.form-lbl{display:block;font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);margin-bottom:7px}
.form-inp{width:100%;background:var(--bg4);border:1px solid var(--card-border);color:var(--text);font-size:.8rem;font-weight:300;padding:10px 12px;border-radius:var(--radius);transition:border-color .2s}
.form-inp::placeholder{color:var(--text3)}
.form-inp:focus{border-color:var(--gold)}
.form-inp[type="file"]{padding:8px 12px;cursor:pointer}
.form-textarea{min-height:100px;resize:vertical}
.img-preview-wrap{margin-top:8px;display:none}
.img-preview-wrap img{max-width:200px;max-height:120px;object-fit:cover;border-radius:12px;border:1px solid var(--card-border)}
.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.btn-save-news{background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.62rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:10px 22px;cursor:pointer;border-radius:var(--radius);transition:opacity .2s;display:flex;align-items:center;gap:8px}
.btn-save-news:hover{opacity:.88}
.btn-save-news:disabled{opacity:.5;cursor:not-allowed}
.btn-cancel-news{background:none;border:1px solid var(--card-border);color:var(--text2);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;padding:10px 16px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-cancel-news:hover{border-color:rgba(201,168,76,0.3);color:var(--gold)}
.btn-add-news{background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.62rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:8px 18px;cursor:pointer;border-radius:var(--radius)}
.upload-progress{width:100%;height:3px;background:rgba(201,168,76,0.1);border-radius:8px;margin-top:6px;display:none}
.upload-progress-bar{height:100%;background:var(--gold);border-radius:8px;transition:width .3s}
.slug-preview-row{margin-top:5px;display:flex;align-items:center;gap:6px}
.slug-preview-label{font-size:.52rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text3)}
.slug-preview-val{font-size:.62rem;color:var(--gold);font-family:'Courier New',monospace;background:rgba(201,168,76,.07);padding:2px 8px;border-radius:10px;word-break:break-all}
.upload-progress-label{font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);margin-bottom:4px}
.admin-stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:24px}
.admin-news-list{display:flex;flex-direction:column;gap:12px}
.admin-news-item{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;padding:16px 18px;display:flex;gap:14px;align-items:flex-start;transition:border-color .25s}
.admin-news-item:hover{border-color:rgba(201,168,76,0.3)}
.ani-body{flex:1;min-width:0}
.ani-cat{font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.ani-title{font-size:.88rem;font-weight:400;margin-bottom:4px;letter-spacing:.02em}
.ani-date{font-size:.62rem;color:var(--text3)}
.ani-slug{font-size:.56rem;color:var(--text3);font-family:'Courier New',monospace;margin-top:2px}
.ani-featured{display:inline-block;font-size:.5rem;letter-spacing:.14em;text-transform:uppercase;padding:2px 7px;background:rgba(201,168,76,0.12);border:1px solid var(--gold-border);color:var(--gold);border-radius:8px;margin-left:6px}
.ani-actions{display:flex;gap:6px;margin-top:8px}
.btn-edit-n{background:none;border:1px solid var(--card-border);color:var(--text3);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-edit-n:hover{border-color:rgba(201,168,76,0.4);color:var(--gold)}
.btn-del-n{background:none;border:1px solid rgba(224,90,90,0.2);color:var(--red);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-del-n:hover{background:rgba(224,90,90,0.08)}
.btn-feat-n{background:none;border:1px solid rgba(201,168,76,0.2);color:var(--gold);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-feat-n:hover{background:rgba(201,168,76,0.08)}
.user-list{display:flex;flex-direction:column;gap:8px}
.user-item{background:var(--bg3);border:1px solid var(--card-border);border-radius:16px;padding:14px 16px;display:flex;align-items:center;gap:12px;transition:border-color .25s}
.user-item:hover{border-color:rgba(201,168,76,0.25)}
.user-av{width:36px;height:36px;border-radius:50%;background:var(--bg4);border:1px solid var(--card-border);display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-size:.9rem;color:var(--gold);flex-shrink:0}
.user-info-col{flex:1;min-width:0}
.user-name{font-size:.82rem;margin-bottom:2px}
.user-email{font-size:.65rem;color:var(--text3)}
.user-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.toggle-vip{font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.toggle-vip.is-vip{background:rgba(201,168,76,0.12);border:1px solid var(--gold-border);color:var(--gold)}
.toggle-vip.not-vip{background:none;border:1px solid var(--card-border);color:var(--text3)}
.toggle-vip:hover{border-color:rgba(201,168,76,0.5)}

/* MODAL */
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.82);z-index:700;align-items:center;justify-content:center;padding:16px}
.overlay.open{display:flex}
.modal{background:var(--bg2);border:1px solid var(--card-border);width:100%;max-width:480px;max-height:90vh;overflow-y:auto;border-radius:18px}
.modal-hdr{padding:18px 24px 14px;border-bottom:1px solid var(--card-border);display:flex;justify-content:space-between;align-items:center}
.modal-ttl{font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:400}
.modal-x{background:none;border:none;color:var(--text2);font-size:1.1rem;cursor:pointer;padding:2px 6px}
.modal-body{padding:20px 24px}
.form-group{margin-bottom:13px}
.form-label{display:block;font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3);margin-bottom:6px}
.form-input{width:100%;background:var(--bg3);border:1px solid var(--card-border);color:var(--text);font-size:.78rem;font-weight:300;padding:9px 11px;border-radius:var(--radius);transition:border-color .2s;appearance:none}
.form-input::placeholder{color:var(--text3)}
.form-input:focus{border-color:var(--gold)}
.form-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.modal-foot{padding:12px 24px 18px;display:flex;gap:8px;justify-content:flex-end}
.btn-cancel-m{background:none;border:1px solid var(--card-border);color:var(--text2);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;padding:9px 14px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-save-m{background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.6rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;padding:9px 22px;cursor:pointer;border-radius:var(--radius);transition:opacity .2s}
.btn-save-m:hover{opacity:.88}

/* TOAST */
.toast{position:fixed;bottom:24px;right:24px;z-index:900;background:var(--bg3);border:1px solid var(--card-border);padding:12px 16px;display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(10px);transition:all .3s;pointer-events:none;max-width:260px;border-radius:16px}
.toast.show{opacity:1;transform:translateY(0)}
.toast-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.toast-sym{font-family:'Space Grotesk',sans-serif;font-size:.9rem}
.toast-msg{font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text3);margin-top:2px}

/* FOOTER */
footer{background:rgba(4,4,7,1);border-top:1px solid var(--card-border);padding:60px 40px 32px}
.footer-inner{max-width:1200px;margin:0 auto}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:48px;margin-bottom:40px}
.footer-logo{display:flex;align-items:center;gap:10px;margin-bottom:16px;text-decoration:none}
.footer-desc{font-size:.72rem;color:var(--text3);line-height:1.9;max-width:240px}
.footer-col-t{font-size:.54rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.footer-link{display:block;font-size:.72rem;color:var(--text3);margin-bottom:10px;transition:color .2s;cursor:pointer}
.footer-link:hover{color:var(--gold)}
.disclaimer{background:rgba(201,168,76,0.02);border:1px solid rgba(201,168,76,0.07);padding:18px 20px;margin-bottom:28px;border-radius:12px}
.disclaimer-t{font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.disclaimer-body{font-size:.68rem;color:var(--text3);line-height:1.85}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding-top:20px;border-top:1px solid rgba(201,168,76,0.07)}
.footer-copy{font-size:.6rem;color:var(--text3);letter-spacing:.08em}
.footer-craft{font-size:.54rem;color:var(--text3);letter-spacing:.1em}
.footer-craft span{color:var(--gold)}

/* ══════════ MODUL BELAJAR CSS ══════════ */
/* ── Module list ── */
.mod-list-wrap{max-width:1200px;margin:0 auto;padding:48px 40px 80px}
.mod-list-top{margin-bottom:48px}
.page-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(2.1rem,3.8vw,3.2rem);font-weight:600;letter-spacing:-.02em;line-height:1.12;margin-bottom:12px}
.page-sub{font-size:.82rem;color:var(--text2);line-height:1.9;max-width:520px}
.mod-filter-bar{display:flex;align-items:center;gap:10px;margin-bottom:32px;flex-wrap:wrap}
.mod-filter-label{font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text3)}
.mod-search{background:var(--bg3);border:1px solid var(--card-border);color:var(--text);font-size:.72rem;font-weight:300;padding:6px 12px;border-radius:var(--radius);width:220px;transition:border-color .2s;margin-left:auto}
.mod-search::placeholder{color:var(--text3)}
.mod-search:focus{border-color:var(--gold)}
.mod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.mod-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden;cursor:pointer;transition:all .3s;position:relative}
.mod-card:hover{border-color:rgba(201,168,76,.35);transform:translateY(-4px)}
.mod-card-thumb{aspect-ratio:16/9;background:var(--bg4);position:relative;overflow:hidden}
.mod-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.mod-card:hover .mod-card-thumb img{transform:scale(1.03)}
.mod-card-thumb-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--bg4),var(--bg5))}
.mod-card-thumb-placeholder svg{opacity:.12}
.mod-num-badge{position:absolute;top:12px;left:12px;font-family:'Space Grotesk',sans-serif;font-size:.55rem;letter-spacing:.2em;background:rgba(201,168,76,.9);color:var(--bg);padding:3px 9px;border-radius:8px;z-index:1;font-weight:600}
.mod-level-badge{position:absolute;top:12px;right:12px;font-size:.5rem;letter-spacing:.2em;text-transform:uppercase;padding:3px 8px;border-radius:8px;z-index:1}
.mod-level-badge.pemula{background:rgba(61,186,122,.85);color:var(--bg)}
.mod-level-badge.intermediate{background:rgba(201,168,76,.85);color:var(--bg)}
.mod-level-badge.advanced{background:rgba(224,90,90,.85);color:var(--bg)}
.mod-card-body{padding:18px 16px}
.mod-cat{font-size:.52rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.mod-title{font-family:'Space Grotesk',sans-serif;font-size:1.15rem;font-weight:500;line-height:1.3;margin-bottom:8px}
.mod-excerpt{font-size:.7rem;color:var(--text2);line-height:1.8;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mod-meta{display:flex;align-items:center;gap:12px;border-top:1px solid rgba(201,168,76,.06);padding-top:10px;margin-top:4px}
.mod-meta-item{font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);display:flex;align-items:center;gap:4px}
.mod-progress-bar{height:2px;background:rgba(201,168,76,.08);border-radius:6px;margin-top:8px;overflow:hidden}
.mod-progress-fill{height:100%;background:var(--gold);border-radius:6px;transition:width .4s}
.mod-lock-overlay{position:absolute;inset:0;background:rgba(10,10,13,.75);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;backdrop-filter:blur(2px)}
.mod-lock-icon{font-family:'Space Grotesk',sans-serif;font-size:2rem;color:var(--gold);opacity:.5}
.mod-lock-txt{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text2)}
/* ── Module reader ── */
.mod-reader-wrap{max-width:1100px;margin:0 auto;padding:40px 40px 80px}
.mod-back{display:inline-flex;align-items:center;gap:8px;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text2);background:none;border:1px solid var(--card-border);padding:7px 14px;border-radius:var(--radius);cursor:pointer;transition:all .2s;margin-bottom:28px}
.mod-back:hover{border-color:var(--gold);color:var(--gold)}
.mod-reader-grid{display:grid;grid-template-columns:260px 1fr;gap:32px;align-items:start}
.mod-sidebar{position:sticky;top:calc(var(--nav-h) + 58px);background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;overflow:hidden}
.mod-sidebar-title{padding:14px 16px;border-bottom:1px solid var(--card-border);font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.mod-sidebar-scroll{max-height:calc(100vh - 200px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--card-border) transparent}
.mod-sidebar-item{padding:12px 16px;border-bottom:1px solid rgba(201,168,76,.04);cursor:pointer;transition:background .2s;display:flex;align-items:center;gap:10px}
.mod-sidebar-item:last-child{border-bottom:none}
.mod-sidebar-item:hover{background:var(--bg4)}
.mod-sidebar-item.active{background:rgba(201,168,76,.06);border-right:2px solid var(--gold)}
.msi-num{font-family:'Space Grotesk',sans-serif;font-size:.62rem;color:var(--gold);opacity:.6;min-width:20px}
.msi-title{font-size:.72rem;color:var(--text2);line-height:1.4;flex:1;min-width:0}
.mod-sidebar-item.active .msi-title{color:var(--text)}
.msi-check{width:14px;height:14px;border-radius:50%;border:1px solid var(--text3);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.msi-check.done{background:var(--green);border-color:var(--green);color:var(--bg)}
.msi-check.done::before{content:'✓';font-size:.52rem;font-weight:600}
.mod-reader-nav{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-top:1px solid var(--card-border);background:var(--bg4)}
.mod-nav-btn{background:none;border:1px solid var(--card-border);color:var(--text2);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;padding:6px 12px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.mod-nav-btn:hover:not(:disabled){border-color:var(--gold);color:var(--gold)}
.mod-nav-btn:disabled{opacity:.3;cursor:not-allowed}
.mod-nav-prog{font-size:.58rem;color:var(--text3)}
.mod-content-area{min-height:60vh}
.mod-content-header{margin-bottom:36px}
.mod-content-header .mod-cat{font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.mod-content-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(1.8rem,3vw,2.6rem);font-weight:500;line-height:1.15;margin-bottom:14px}
.mod-content-meta{display:flex;gap:20px;flex-wrap:wrap}
.mod-content-meta-item{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text3)}
/* Block renderer */
.mblock{margin-bottom:32px}
.mblock-text{font-size:.84rem;color:var(--text2);line-height:2;letter-spacing:.02em;white-space:pre-wrap}
.mblock-h2{font-family:'Space Grotesk',sans-serif;font-size:1.55rem;font-weight:500;color:var(--text);margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--card-border)}
.mblock-h2 span{color:var(--gold)}
.mblock-h3{font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:500;color:var(--text);margin-bottom:12px}
.mblock-image{border-radius:18px;overflow:hidden;background:var(--bg4);aspect-ratio:16/9}
.mblock-image img{width:100%;height:100%;object-fit:cover;display:block}
.mblock-caption{font-size:.68rem;color:var(--text3);margin-top:8px;font-style:italic;text-align:center;line-height:1.7}
.mblock-callout{background:rgba(201,168,76,.04);border:1px solid rgba(201,168,76,.15);border-left:3px solid var(--gold);border-radius:0 6px 6px 0;padding:18px 20px}
.mblock-callout-title{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.mblock-callout-body{font-size:.78rem;color:var(--text2);line-height:1.9}
.mblock-tip{background:rgba(61,186,122,.04);border:1px solid rgba(61,186,122,.15);border-left:3px solid var(--green);border-radius:0 6px 6px 0;padding:16px 20px}
.mblock-tip-title{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--green);margin-bottom:7px}
.mblock-tip-body{font-size:.76rem;color:var(--text2);line-height:1.85}
.mblock-warning{background:rgba(224,90,90,.04);border:1px solid rgba(224,90,90,.15);border-left:3px solid var(--red);border-radius:0 6px 6px 0;padding:16px 20px}
.mblock-warning-title{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:7px}
.mblock-warning-body{font-size:.76rem;color:var(--text2);line-height:1.85}
.mblock-list{list-style:none;font-size:.8rem;color:var(--text2);line-height:2}
.mblock-list li{padding-left:20px;position:relative;margin-bottom:6px}
.mblock-list li::before{content:'';position:absolute;left:0;width:4px;height:4px;border-radius:50%;background:var(--gold);top:.7em}
.mblock-divider{height:1px;background:linear-gradient(90deg,transparent,var(--card-border),transparent);margin:32px 0}
.mblock-term{background:var(--bg4);border:1px solid var(--card-border);border-radius:16px;padding:20px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start}
.mblock-term-symbol{font-family:'Space Grotesk',sans-serif;font-size:1.6rem;font-weight:600;color:var(--gold);background:rgba(201,168,76,.06);border:1px solid var(--gold-border);border-radius:12px;padding:6px 16px;text-align:center;min-width:80px}
.mblock-term-name{font-size:.88rem;font-weight:500;margin-bottom:5px}
.mblock-term-def{font-size:.74rem;color:var(--text2);line-height:1.85}
.mquiz-block{background:var(--bg4);border:1px solid var(--card-border);border-radius:18px;padding:24px;margin-bottom:24px}
.mquiz-q{font-family:'Space Grotesk',sans-serif;font-size:1.1rem;font-weight:500;margin-bottom:18px;line-height:1.4}
.mquiz-opts{display:flex;flex-direction:column;gap:8px}
.mquiz-opt{background:var(--bg3);border:1px solid var(--card-border);padding:11px 14px;border-radius:var(--radius);cursor:pointer;font-size:.78rem;color:var(--text2);transition:all .2s;display:flex;align-items:center;gap:10px}
.mquiz-opt:hover{border-color:rgba(201,168,76,.3);background:var(--bg5)}
.mquiz-opt.correct{border-color:var(--green);background:rgba(61,186,122,.08);color:var(--green)}
.mquiz-opt.wrong{border-color:var(--red);background:rgba(224,90,90,.08);color:var(--red)}
.mquiz-opt.disabled{cursor:not-allowed;opacity:.7}
.mquiz-opt-letter{width:22px;height:22px;border-radius:50%;border:1px solid var(--text3);display:flex;align-items:center;justify-content:center;font-size:.6rem;font-family:'Space Grotesk',sans-serif;flex-shrink:0}
.mquiz-result{margin-top:14px;padding:12px 16px;border-radius:var(--radius);font-size:.75rem;line-height:1.8;display:none}
.mquiz-result.show{display:block}
.mquiz-result.correct{background:rgba(61,186,122,.08);border:1px solid rgba(61,186,122,.2);color:var(--green)}
.mquiz-result.wrong{background:rgba(224,90,90,.08);border:1px solid rgba(224,90,90,.2);color:var(--red)}
.btn-complete-mod{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.65rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;padding:13px 32px;cursor:pointer;border-radius:var(--radius);box-shadow:0 0 24px rgba(201,168,76,.3);transition:all .25s;margin-top:32px}
.btn-complete-mod:hover{box-shadow:0 0 40px rgba(201,168,76,.5);transform:translateY(-2px)}
.btn-complete-mod.done{background:linear-gradient(135deg,var(--green),#1a9e50);box-shadow:0 0 24px rgba(61,186,122,.3)}
/* ── Admin module panel ── */
.adm-mod-wrap{max-width:1200px;margin:0 auto;padding:32px 40px 80px}
.adm-top-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.btn-add-mod{background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.6rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:8px 18px;cursor:pointer;border-radius:var(--radius)}
.mod-form-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;padding:28px;margin-bottom:28px;display:none}
.mod-form-card.open{display:block}
.mod-form-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
.mod-form-head-title{font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:400}
.form-grid2m{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.form-full-m{grid-column:1/-1}
.form-lbl-m{display:block;font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text3);margin-bottom:6px}
.form-inp-m{width:100%;background:var(--bg4);border:1px solid var(--card-border);color:var(--text);font-size:.78rem;font-weight:300;padding:9px 11px;border-radius:var(--radius);transition:border-color .2s}
.form-inp-m::placeholder{color:var(--text3)}
.form-inp-m:focus{border-color:var(--gold)}
.form-textarea-m{min-height:88px;resize:vertical}
.form-actions-m{display:flex;gap:10px;justify-content:flex-end;margin-top:14px}
.btn-save-mod{background:linear-gradient(135deg,var(--gold),var(--gold-d));border:none;color:var(--bg);font-size:.6rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:9px 22px;cursor:pointer;border-radius:var(--radius);display:flex;align-items:center;gap:8px}
.btn-cancel-mod{background:none;border:1px solid var(--card-border);color:var(--text2);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;padding:9px 16px;cursor:pointer;border-radius:var(--radius)}
.btn-save-mod:disabled{opacity:.5;cursor:not-allowed}
.form-err-m{font-size:.66rem;color:var(--red);background:rgba(224,90,90,.06);border:1px solid rgba(224,90,90,.2);padding:10px 14px;border-radius:var(--radius);display:none;margin-top:10px}
.block-builder-m{background:var(--bg4);border:1px solid var(--card-border);border-radius:16px;padding:16px;margin-bottom:14px}
.block-builder-head-m{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.block-type-label-m{font-size:.54rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.block-builder-del-m{background:none;border:1px solid rgba(224,90,90,.2);color:var(--red);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;cursor:pointer;border-radius:var(--radius)}
.add-block-row-m{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.add-block-btn-m{background:none;border:1px solid var(--card-border);color:var(--text3);font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.add-block-btn-m:hover{border-color:rgba(201,168,76,.4);color:var(--gold)}
.uprog-wrap-m{height:3px;background:rgba(201,168,76,.08);border-radius:8px;margin-top:8px;display:none}
.uprog-bar-m{height:100%;background:var(--gold);border-radius:8px;transition:width .3s}
.uprog-label-m{font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text3);margin-bottom:4px;display:none}
.img-preview-wrap-m{margin-top:8px;display:none}
.img-preview-wrap-m img{max-width:200px;max-height:110px;object-fit:cover;border-radius:12px;border:1px solid var(--card-border)}
.adm-mod-list-m{display:flex;flex-direction:column;gap:12px}
.adm-mod-item-m{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;padding:16px 18px;display:flex;gap:14px;align-items:flex-start;transition:border-color .25s}
.adm-mod-item-m:hover{border-color:rgba(201,168,76,.3)}
.ami-thumb-m{width:88px;height:66px;border-radius:12px;overflow:hidden;background:var(--bg4);flex-shrink:0;aspect-ratio:4/3}
.ami-thumb-m img{width:100%;height:100%;object-fit:cover;display:block}
.ami-body-m{flex:1;min-width:0}
.ami-top-m{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap}
.ami-num-m{font-family:'Space Grotesk',sans-serif;font-size:.6rem;color:var(--gold);background:rgba(201,168,76,.1);border:1px solid var(--gold-border);padding:2px 8px;border-radius:8px}
.ami-title-m{font-size:.86rem;font-weight:400;margin-bottom:3px}
.ami-meta-m{font-size:.6rem;color:var(--text3);margin-bottom:8px}
.ami-actions-m{display:flex;gap:6px;flex-wrap:wrap}
.btn-edit-m{background:none;border:1px solid var(--card-border);color:var(--text3);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;cursor:pointer;border-radius:var(--radius);transition:all .2s}
.btn-edit-m:hover{border-color:rgba(201,168,76,.4);color:var(--gold)}
.btn-del-m{background:none;border:1px solid rgba(224,90,90,.2);color:var(--red);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;cursor:pointer;border-radius:var(--radius)}
.btn-del-m:hover{background:rgba(224,90,90,.08)}
/* ── Modul tab pills inside page ── */
.mod-app-tabs{background:rgba(16,16,19,.96);border-bottom:1px solid var(--card-border);padding:0 40px;display:flex;gap:0;overflow-x:auto;scrollbar-width:none;position:sticky;top:var(--nav-h);z-index:300;backdrop-filter:blur(20px)}
.mod-app-tabs::-webkit-scrollbar{display:none}
.mod-app-tab{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text3);padding:14px 16px;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s;white-space:nowrap;flex-shrink:0;background:none;border:none;border-bottom:2px solid transparent}
.mod-app-tab:hover{color:var(--text2)}
.mod-app-tab.on{color:var(--gold);border-bottom-color:var(--gold)}
.mod-page-sec{display:none}.mod-page-sec.on{display:block}
.vip-lock-msg{text-align:center;padding:60px 28px;background:var(--bg3);border:1px solid var(--card-border);border-radius:18px;margin-top:24px}
.vlm-icon{font-family:'Space Grotesk',sans-serif;font-size:2.5rem;color:var(--gold);opacity:.2;margin-bottom:14px}
.vlm-title{font-family:'Space Grotesk',sans-serif;font-size:1.5rem;margin-bottom:8px}
.vlm-sub{font-size:.7rem;color:var(--text3);margin-bottom:20px;line-height:1.9}
.vlm-btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#25D366,#1a9e50);border:none;color:#fff;font-size:.62rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:11px 26px;cursor:pointer;border-radius:var(--radius)}
@media(max-width:960px){.mod-grid{grid-template-columns:repeat(2,1fr)}.mod-reader-grid{grid-template-columns:1fr}.mod-sidebar{position:static}}
@media(max-width:640px){.mod-list-wrap,.mod-reader-wrap,.adm-mod-wrap{padding-left:20px;padding-right:20px}.mod-grid{grid-template-columns:1fr}.mod-app-tabs{padding:0 20px}.form-grid2m{grid-template-columns:1fr}}


@media(max-width:960px){
  .about-grid,.testi-grid{grid-template-columns:1fr 1fr}
  .news-grid{grid-template-columns:1fr}
  .news-sidebar{display:none}
  .vpc-benefits{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .stats-row .scard:last-child{grid-column:1/-1}
  .bottom-grid{grid-template-columns:1fr}
  .notes-grid{grid-template-columns:1fr 1fr}
  .nf-grid{grid-template-columns:1fr}
  .admin-stat-row{grid-template-columns:repeat(2,1fr)}
  .seo-intro-grid{grid-template-columns:1fr}
  .seo-cols3{grid-template-columns:1fr 1fr}
  .seo-trust-row{grid-template-columns:repeat(2,1fr)}
  /* Hide desktop nav links on tablet too, show hamburger */
  .nav-center{display:none}
  .hamburger{display:flex}
  .nav-btn-vip,.nav-btn-login{display:none}
  .nav-username{display:none}
}
@media(max-width:640px){
  #nav{padding:0 16px}
  .nav-center,.nav-btn-vip,.nav-btn-login,.nav-username,.vip-pill,.admin-pill,.btn-logout,.theme-toggle-lbl{display:none}
  .hamburger{display:flex}
  /* Mobile nav-right: only show avatar (if logged in), theme toggle icon, hamburger */
  .nav-right{gap:8px}
  .nav-avatar{width:28px;height:28px;font-size:.7rem}
  /* Theme toggle compact on mobile */
  .theme-toggle{padding:5px 8px}
  .theme-toggle-track{display:none}
  /* Nav user wrap compact */
  .nav-user-wrap{gap:6px}
  /* Guest buttons on mobile go into mob-nav, hide in desktop nav */
  #nav-guest{display:none}
  #hero{padding:60px 20px 48px}
  .about-grid,.testi-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .stats-row{grid-template-columns:1fr}
  .stats-row .scard:last-child{grid-column:auto}
  .form-row2{grid-template-columns:1fr}
  .notes-grid{grid-template-columns:1fr}
  .vpc-body{padding:28px 20px}
  .vip-hero{padding:60px 20px 72px}
  .toast{bottom:14px;right:12px;left:12px;max-width:none}
  .nav-username,.save-status{display:none}
  #page-berita,#page-vip{padding-left:20px;padding-right:20px}
  .admin-stat-row{grid-template-columns:1fr 1fr}
  .seo-section{padding:60px 20px}
  .seo-cols3{grid-template-columns:1fr}
  .seo-trust-row{grid-template-columns:1fr 1fr}
  .hero-actions{gap:10px}
  .btn-hero-primary,.btn-hero-sec,.btn-hero-pub{padding:12px 20px;font-size:.6rem}
  .mblock-term{grid-template-columns:1fr;gap:10px}
  .mblock-term-symbol{font-size:1.2rem;padding:8px 14px;min-width:unset;width:fit-content}
  .mblock-term-name{font-size:.84rem}
  .mblock-term-def{font-size:.76rem;line-height:1.9}
  .feat-section{padding:64px 20px 56px}
  .feat-head{margin-bottom:40px}
  .feat-row{padding:32px 0;gap:20px}
  .feat-preview{padding:18px}
  .app-header,.pricebar,.app-tabs{padding-left:16px;padding-right:16px}
  .jmain{padding:20px 16px}
  .acc-row{flex-direction:column;align-items:flex-start;gap:4px}
}

/* ══════════════════════════════════════════════════════════════
   ELEGANT MOTION SYSTEM — scroll reveal, gold shimmer, micro-int.
   ══════════════════════════════════════════════════════════════ */

/* Page transition on route change */
.page.active{display:block;animation:pageFadeIn .6s cubic-bezier(.16,1,.3,1)}
@keyframes pageFadeIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

/* Scroll-reveal base (auto-applied by JS to cards, headers, articles) */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
.reveal.vis{opacity:1;transform:translateY(0)}
.reveal-scale{opacity:0;transform:translateY(20px) scale(.96);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.reveal-scale.vis{opacity:1;transform:translateY(0) scale(1)}

/* Gold shimmer sweep across headline gradient text */
@keyframes goldShimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}
.seo-h1 span,.page-title .gold-text,h1 .gold-text{background-size:220% auto;animation:goldShimmer 6s ease-in-out infinite alternate}

/* Ambient glow pulse for gold accents / icons */
@keyframes glowPulse{0%,100%{box-shadow:0 0 0 0 rgba(201,168,76,0)}50%{box-shadow:0 0 22px 2px var(--gold-glow)}}

/* ── Card hover: lift + gold border glow (applies broadly) ── */
.news-card,.about-card,.testi-card,.seo-col-card,.faq-item,.seo-trust-card,.mod-card,
.vip-price-card,.hero-chart-card,.scard,.news-sidebar-card,.note-card,.fp-card,.auth-card{
  transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s cubic-bezier(.16,1,.3,1),border-color .45s ease;
}
.news-card:hover,.about-card:hover,.testi-card:hover,.seo-col-card:hover,.mod-card:hover,
.scard:hover,.news-sidebar-card:hover,.note-card:hover,.fp-card:hover{
  transform:translateY(-6px);
  border-color:var(--gold-border);
  box-shadow:0 18px 40px rgba(0,0,0,.28),0 0 0 1px var(--gold-border);
}
.faq-item:hover,.seo-trust-card:hover{border-color:var(--gold-border)}

/* Image zoom-in on hover inside thumbs/cards */
.nc-thumb img,.ani-thumb img,.img-ar-16-9 img,.img-ar-4-3 img,.img-ar-sq img,.mod-card-thumb img{
  transition:transform .6s cubic-bezier(.16,1,.3,1);
}
.news-card:hover .nc-thumb img,.mod-card:hover .mod-card-thumb img,
.news-featured:hover .news-featured-thumb img{transform:scale(1.07)}

/* ── Buttons: shine sweep + lift + press ── */
button,a[class*="btn"],[class*="btn-"],.btn-hero-primary,.btn-hero-sec,.btn-hero-pub{
  position:relative;overflow:hidden;
  transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,filter .3s ease;
}
button:not(:disabled)::before,a[class*="btn"]::before,[class*="btn-"]::before{
  content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(115deg,transparent,rgba(255,255,255,.16),transparent);
  transform:skewX(-20deg);transition:left .65s cubic-bezier(.16,1,.3,1);pointer-events:none;
}
button:not(:disabled):hover::before,a[class*="btn"]:hover::before,[class*="btn-"]:hover::before{left:140%}
.btn-hero-primary:hover,.btn-hero-pub:hover,.wa-btn:hover,.wa-btn-pub:hover,.vpc-wa-btn:hover,.btn-save-m:hover,.btn-save-mod:hover,.btn-save-news:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 28px var(--gold-glow);
  filter:brightness(1.06);
}
button:not(:disabled):active,a[class*="btn"]:active,[class*="btn-"]:active{transform:translateY(0) scale(.97)}
.nav-link,.flt-btn,.mod-nav-btn{transition:color .25s ease,transform .25s ease}
.nav-link:hover{transform:translateY(-1px)}

/* Nav underline refined easing (existing element, smoother curve) */
.nav-link::after{transition:transform .4s cubic-bezier(.16,1,.3,1)}

/* Logo mark gentle ambient float */
.nav-mark{transition:transform .4s cubic-bezier(.16,1,.3,1)}
.nav-logo:hover .nav-mark{transform:rotate(-6deg) scale(1.06)}

/* Stat numbers: subtle pop-in via reveal-scale reuse + gold pulse on hover */
.stc-v{transition:transform .3s ease}
.seo-trust-card:hover .stc-v{transform:scale(1.08)}

/* FAQ chevron already animates rotation — give it smoother easing */
.faq-q::after{transition:transform .35s cubic-bezier(.16,1,.3,1)}

/* Mobile nav slide refinement */
#mob-nav{transition:transform .45s cubic-bezier(.16,1,.3,1)!important}

/* Focus visibility (accessibility, kept crisp not decorative) */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--gold);outline-offset:2px;
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce){
  .reveal,.reveal-scale,.page.active,.seo-h1 span,.page-title .gold-text,h1 .gold-text,
  button::before,a[class*="btn"]::before,[class*="btn-"]::before{
    animation:none!important;transition:none!important;
  }
  .reveal,.reveal-scale{opacity:1!important;transform:none!important}
}

/* ══════════════════════════════════════════════════════════════
   VISUAL REDESIGN — glass depth, softer geometry, ambient light.
   Replaces the flat/solid opaque panels with a layered glass look.
   ══════════════════════════════════════════════════════════════ */

:root{
  --radius:12px;
  /* Cards go translucent so the ambient particle bg reads through */
  --bg3:rgba(21,20,29,0.6);
  --bg4:rgba(30,29,40,0.6);
  --bg5:rgba(38,37,50,0.6);
  --card-border:rgba(201,168,76,0.16);
  --glass-hi:rgba(255,255,255,0.05);
}
html.light{
  --bg3:rgba(237,231,217,0.62);
  --bg4:rgba(228,221,204,0.62);
  --bg5:rgba(217,209,188,0.62);
  --card-border:rgba(139,105,20,0.2);
  --glass-hi:rgba(255,255,255,0.5);
}

/* Softer, glassy surfaces on every card-like element site-wide */
.about-card,.testi-card,.news-card,.news-featured,.news-sidebar-card,.seo-col-card,.faq-item,
.seo-trust-card,.mod-card,.vip-price-card,.hero-chart-card,.scard,.note-card,.fp-card,
.auth-card,.price-widget,.nav-dropdown-menu,.mod-form-card{
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  border-radius:24px!important;
  background-image:linear-gradient(155deg,var(--glass-hi),transparent 45%);
  box-shadow:0 1px 0 0 rgba(255,255,255,.04) inset,0 24px 48px -24px rgba(0,0,0,.5);
}
.nc-thumb,.ani-thumb,.mod-card-thumb,.mod-card-thumb-placeholder{border-radius:22px!important}
.nf-cat,.vip-pill,.admin-pill,.cta-badge{border-radius:26px!important}

/* Nav: lighter glass instead of near-opaque slab */
#nav.solid{background:rgba(10,10,13,0.72)!important;backdrop-filter:blur(28px) saturate(160%)}
html.light #nav.solid{background:rgba(245,240,232,0.72)!important}

/* Ambient glow orbs behind SEO/content sections — replaces flat solid fills */
.seo-section{position:relative;overflow:hidden}
.seo-section::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(620px circle at 12% 15%, var(--gold-glow), transparent 62%),
    radial-gradient(520px circle at 88% 85%, rgba(201,168,76,.05), transparent 62%);
}

/* Ambient hero glow */
#hero{position:relative;overflow:hidden}
#hero::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(700px circle at 50% 0%, var(--gold-glow), transparent 65%);
}
#hero>*{position:relative;z-index:1}

/* Softer buttons: bigger radius already inherited via var(--radius); refine surface */
.btn-hero-sec,.nav-btn-login,.btn-logout{backdrop-filter:blur(10px)}

/* Hairline top-highlight for glass cards (subtle premium edge light) */
.about-card::after,.testi-card::after,.news-card::after,.seo-col-card::after,.mod-card::after{
  content:'';position:absolute;top:0;left:12%;right:12%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(201,168,76,.35),transparent);
  pointer-events:none;
}
.about-card,.testi-card,.news-card,.seo-col-card,.mod-card{position:relative}

/* Inputs: soften from flat blocks to gentle glass fields */
.form-inp{border-radius:20px!important;background:var(--bg4)!important;backdrop-filter:blur(8px)}
a.nav-link,a.nav-dropdown-item{text-decoration:none}a.nav-link{display:inline-block}
#page-ai .ai-lbl{font-size:.62rem;color:var(--text2);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
#page-ai .ai-seg{display:flex;gap:8px}
#page-ai .ai-seg-b,#page-ai .ai-chip{background:var(--bg3);border:1px solid var(--card-border);color:var(--text2);font-family:inherit;cursor:pointer;transition:all .2s}
#page-ai .ai-seg-b{flex:1;padding:10px 12px;border-radius:14px;font-size:.68rem;letter-spacing:.04em}
#page-ai .ai-chips{display:flex;flex-wrap:wrap;gap:8px}
#page-ai .ai-chip{padding:7px 14px;border-radius:14px;font-size:.66rem}
#page-ai .ai-seg-b:hover,#page-ai .ai-chip:hover{border-color:var(--gold);color:var(--gold)}
#page-ai .ai-seg-b.on,#page-ai .ai-chip.on{background:rgba(201,168,76,.14);border-color:var(--gold);color:var(--gold);font-weight:600}
#page-ai .ai-sig{border:1px solid var(--card-border);border-radius:18px;overflow:hidden;background:var(--bg3)}
#page-ai .ai-sig-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--card-border);flex-wrap:wrap}
#page-ai .ai-dir{font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:700;letter-spacing:.06em}
#page-ai .ai-dir.buy{color:var(--green)}#page-ai .ai-dir.sell{color:var(--red)}
#page-ai .ai-tag{font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;padding:4px 10px;border-radius:10px;border:1px solid var(--gold-border);color:var(--gold);background:rgba(201,168,76,.1)}
#page-ai .ai-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px 18px}
#page-ai .ai-cell{border:1px solid var(--card-border);border-radius:14px;padding:10px 12px;background:var(--bg)}
#page-ai .ai-cell-l{font-size:.54rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text3);margin-bottom:5px}
#page-ai .ai-cell-v{font-size:.8rem;font-weight:600;color:var(--text);line-height:1.5;word-break:break-word}
#page-ai .ai-cell.e{border-color:var(--gold-border)}#page-ai .ai-cell.e .ai-cell-v{color:var(--gold)}
#page-ai .ai-cell.s{border-color:rgba(224,90,90,.35)}#page-ai .ai-cell.s .ai-cell-v{color:var(--red)}
#page-ai .ai-cell.t{border-color:rgba(61,186,122,.35)}#page-ai .ai-cell.t .ai-cell-v{color:var(--green)}
#page-ai .ai-row{padding:0 18px 14px;font-size:.7rem;line-height:1.8;color:var(--text)}
#page-ai .ai-row b{color:var(--gold);font-weight:600;letter-spacing:.04em}
#page-ai .ai-disc{padding:12px 18px;border-top:1px solid var(--card-border);font-size:.58rem;color:var(--text3);line-height:1.7}
@media(max-width:560px){#page-ai .ai-grid{grid-template-columns:1fr}}
#page-consult .cs-wrap{padding:var(--nav-h) 40px 80px;max-width:760px;margin:0 auto}
#page-consult .cs-card{background:var(--bg3);border:1px solid var(--card-border);border-radius:18px}
#page-consult .cs-msgs{padding:16px;min-height:280px;max-height:52vh;overflow-y:auto;display:flex;flex-direction:column;gap:12px}
#page-consult .cs-b{max-width:86%;padding:10px 14px;border-radius:16px;font-size:.72rem;line-height:1.8;word-wrap:break-word}
#page-consult .cs-b.u{align-self:flex-end;background:rgba(201,168,76,.14);border:1px solid var(--gold-border);color:var(--text);border-bottom-right-radius:4px}
#page-consult .cs-b.m{align-self:flex-start;background:var(--bg4,rgba(255,255,255,.04));border:1px solid var(--card-border);color:var(--text);border-bottom-left-radius:4px}
#page-consult .cs-chip{background:transparent;border:1px solid var(--card-border);color:var(--text2);border-radius:14px;padding:6px 12px;font-size:.62rem;cursor:pointer;font-family:inherit;transition:all .2s}
#page-consult .cs-chip:hover{border-color:var(--gold);color:var(--gold)}
#page-consult .cs-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gold);margin-right:4px;animation:csBlink 1.2s infinite}
#page-consult .cs-dot:nth-child(2){animation-delay:.2s}#page-consult .cs-dot:nth-child(3){animation-delay:.4s}
@keyframes csBlink{0%,80%,100%{opacity:.2}40%{opacity:1}}
#page-consult .cs-btn{background:linear-gradient(135deg,var(--gold-d),var(--gold));color:#06060A;font-weight:600;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;border:none;border-radius:14px;padding:10px 18px;cursor:pointer;font-family:inherit}
#page-consult .cs-btn:disabled{opacity:.45;cursor:not-allowed}
#page-consult .cs-seg{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--card-border);border-radius:16px;background:var(--bg3)}
#page-consult .cs-seg-b{background:transparent;border:none;color:var(--text2);font-family:inherit;font-size:.68rem;letter-spacing:.06em;padding:9px 18px;border-radius:12px;cursor:pointer;transition:all .2s}
#page-consult .cs-seg-b:hover{color:var(--gold)}
#page-consult .cs-seg-b.on{background:linear-gradient(135deg,var(--gold-d),var(--gold));color:#06060A;font-weight:600}
@media(max-width:768px){#page-consult .cs-wrap{padding-left:16px;padding-right:16px}#page-consult .cs-b{max-width:94%}}