/* ============================================================
   I BEAN TROLLED — members.css
   Shared styles for the Inner 369 members portal
   ============================================================ */

/* ── PORTAL LAYOUT ── */
.portal-page { position:relative; z-index:1; max-width:900px; margin:0 auto; padding:100px 24px 60px; }

/* ── PORTAL NAV ── */
/* ── PORTAL NAV — SIDEBAR ── */
.portal-toggle {
  position:fixed; top:70px; left:0; z-index:95;
  background:rgba(139,0,255,.9); backdrop-filter:blur(8px);
  border-radius:0 8px 8px 0;
  padding:10px 12px;
  cursor:pointer;
  display:flex; flex-direction:column; gap:4px;
  border:1px solid rgba(192,132,252,.3);
  border-left:none;
  transition:all .3s;
}
.portal-toggle span {
  width:18px; height:2px;
  background:#fff; border-radius:2px; display:block;
}
.portal-toggle:hover { background:rgba(139,0,255,1); }

.portal-sidebar {
  position:fixed; top:0; left:-260px; bottom:0; z-index:200;
  width:260px;
  background:rgba(10,5,25,.98); backdrop-filter:blur(16px);
  border-right:1px solid rgba(139,0,255,.3);
  transition:left .3s cubic-bezier(.4,0,.2,1);
  display:flex; flex-direction:column;
  padding:0 0 24px;
  overflow-y:auto;
}
.portal-sidebar.open { left:0; }

.portal-sidebar-overlay {
  position:fixed; inset:0; z-index:199;
  background:rgba(0,0,0,.6);
  opacity:0; pointer-events:none;
  transition:opacity .3s;
}
.portal-sidebar-overlay.visible { opacity:1; pointer-events:all; }

.portal-sidebar-header {
  padding:20px 20px 16px;
  border-bottom:1px solid rgba(139,0,255,.2);
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:8px;
}
.portal-sidebar-title {
  font-family:'Cinzel Decorative',serif;
  font-size:.7rem; letter-spacing:.15em;
  color:#c084fc;
}
.portal-sidebar-close {
  background:none; border:none;
  color:rgba(232,224,240,.5);
  font-size:1.2rem; cursor:pointer;
  line-height:1; padding:4px;
}
.portal-sidebar-close:hover { color:#e8e0f0; }

.portal-sidebar a {
  font-family:'Space Mono',monospace;
  font-size:.65rem; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(232,224,240,.6); text-decoration:none;
  padding:14px 20px;
  border-left:3px solid transparent;
  transition:all .2s; display:block;
}
.portal-sidebar a:hover { color:#e8e0f0; background:rgba(139,0,255,.08); border-left-color:rgba(139,0,255,.4); }
.portal-sidebar a.active { color:#c084fc; background:rgba(139,0,255,.12); border-left-color:#8B00FF; }

/* On desktop keep a slim top bar */
.portal-nav {
  position:fixed; top:62px; left:0; right:0; z-index:90;
  background:rgba(20,10,40,.98); backdrop-filter:blur(12px);
  border-top:1px solid rgba(139,0,255,.2);
  border-bottom:1px solid rgba(139,0,255,.4);
  display:flex; align-items:center; justify-content:center;
  overflow-x:auto; padding:0 8px;
  scrollbar-width:none;
}
.portal-nav::-webkit-scrollbar{display:none;}
.portal-nav a {
  font-family:'Space Mono',monospace; font-size:.58rem;
  letter-spacing:.12em; text-transform:uppercase;
  color:rgba(232,224,240,.7); text-decoration:none;
  padding:12px 14px; border-bottom:2px solid transparent;
  transition:all .2s; white-space:nowrap; flex-shrink:0;
}
.portal-nav a:hover { color:#e8e0f0; }
.portal-nav a.active { color:#c084fc; border-bottom-color:#8B00FF; }

/* Portal toggle hidden by default, shown on mobile only */
.portal-toggle { display:none; }

@media(max-width:768px) {
  .portal-nav { display:none !important; }
  .portal-toggle { 
    display:flex;
    position:fixed; top:70px; left:0; z-index:95;
    background:rgba(139,0,255,.9); backdrop-filter:blur(8px);
    border-radius:0 8px 8px 0;
    padding:10px 12px;
    cursor:pointer;
    flex-direction:column; gap:4px;
    border:1px solid rgba(192,132,252,.3);
    border-left:none;
  }
  .portal-page { padding-top:100px; }
}
@media(min-width:769px) {
  .portal-sidebar { display:none !important; }
  .portal-sidebar-overlay { display:none !important; }
  .portal-page { padding-top:140px; }
}

@media(max-width:600px) {
  body{overflow-x:hidden;max-width:100vw;}
}
/* ── PORTAL HEADER ── */
.portal-header { text-align:center; margin-bottom:40px; }
.portal-title { font-family:'Cinzel Decorative',serif; font-size:clamp(1.2rem,4vw,2rem); color:#e8e0f0; margin-bottom:8px; text-shadow:0 0 30px rgba(192,132,252,.4); }
.portal-sub { font-style:italic; color:rgba(232,224,240,.45); font-size:.9rem; }

/* ── CARDS ── */
.portal-card { background:rgba(255,255,255,.03); border:1px solid rgba(192,132,252,.15); border-radius:20px; padding:28px; margin-bottom:24px; }
.portal-card-title { font-family:'Cinzel Decorative',serif; font-size:.82rem; letter-spacing:.12em; color:#c084fc; margin-bottom:6px; }
.portal-card-sub { font-style:italic; color:rgba(232,224,240,.4); font-size:.82rem; margin-bottom:20px; line-height:1.6; }

/* ── MEDITATION CARDS ── */
.meditation-card { border-radius:20px; overflow:hidden; margin-bottom:24px; border:1px solid rgba(255,255,255,.08); transition:transform .3s; }
.meditation-card:hover { transform:translateY(-3px); }
.meditation-header { padding:20px 24px; display:flex; align-items:center; gap:16px; }
.meditation-troll { width:70px; height:70px; object-fit:contain; filter:drop-shadow(0 0 12px var(--c)); animation:float 3s ease-in-out infinite; flex-shrink:0; }
.meditation-meta { flex:1; }
.meditation-color { font-family:'Space Mono',monospace; font-size:.58rem; letter-spacing:.15em; text-transform:uppercase; margin-bottom:4px; }
.meditation-title { font-family:'Cinzel Decorative',serif; font-size:1rem; color:#e8e0f0; margin-bottom:4px; }
.meditation-desc { font-style:italic; font-size:.82rem; color:rgba(232,224,240,.5); line-height:1.6; }
.meditation-video { padding:0 20px 20px; }
.meditation-video-wrap { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:12px; }
.meditation-video-wrap iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:0; border-radius:12px; }
.meditation-locked { padding:20px; text-align:center; }
.meditation-locked p { font-style:italic; color:rgba(232,224,240,.35); font-size:.85rem; margin-bottom:12px; }
.meditation-locked a { font-family:'Cinzel Decorative',serif; font-size:.65rem; letter-spacing:.12em; color:#c084fc; border:1.5px solid rgba(192,132,252,.3); border-radius:50px; padding:8px 20px; text-decoration:none; display:inline-block; transition:all .3s; }
.meditation-locked a:hover { background:rgba(192,132,252,.1); }
.coming-soon-badge { font-family:'Space Mono',monospace; font-size:.58rem; letter-spacing:.12em; background:rgba(192,132,252,.08); border:1px solid rgba(192,132,252,.2); color:rgba(192,132,252,.5); border-radius:50px; padding:4px 12px; display:inline-block; margin-top:8px; }

/* ── ORACLE SECTION ── */
.oracle-member-wrap { display:flex; flex-direction:column; align-items:center; gap:20px; }

/* ── COMING SOON ── */
.coming-soon-card { background:rgba(255,255,255,.02); border:1px dashed rgba(192,132,252,.15); border-radius:20px; padding:32px; text-align:center; margin-bottom:24px; }
.coming-soon-card p { font-style:italic; color:rgba(232,224,240,.3); font-size:.88rem; line-height:1.8; }

/* ── SHARED ── */
@keyframes float { 0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);} }
@media(max-width:600px) { body{overflow-x:hidden;max-width:100vw;} }