/* OnlyFanus — style.css v4 */
:root {
  --teal:   #22c4b8;
  --teal-h: #2dd4c8;
  --ink:    #07080f;
  --deep:   #0a0e1a;
  --sur:    rgba(6,10,20,0.97);
  --bdr:    rgba(255,255,255,0.055);
  --bright: #f0f4f8;
  --serif:  'Cormorant Garamond', Georgia, serif;
  --sans:   'DM Sans', system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;}
body{background:var(--ink);color:var(--bright);font-family:var(--sans);overflow-x:hidden;}
::-webkit-scrollbar{width:3px;}
::-webkit-scrollbar-thumb{background:rgba(34,196,184,0.25);border-radius:2px;}
button,input{font-family:inherit;}
input::placeholder{color:rgba(255,255,255,0.25);}
/* Remove button click animation */
button{cursor:pointer;transition:background 0.15s,color 0.15s,border-color 0.15s,opacity 0.15s;}
button:active{transform:none;}
.teal-u{color:var(--teal);}
.wm-text{white-space:nowrap;display:inline-block;letter-spacing:0.01em;}

@keyframes lPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.3;transform:scale(0.65)}}
@keyframes riseIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes bubRise{0%{transform:translateY(0);opacity:0.55}100%{transform:translateY(-110vh);opacity:0}}
@keyframes fadeUp{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* LOADER */
#loader{position:fixed;inset:0;background:var(--ink);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;z-index:9999;transition:opacity 0.6s;}
#loader.done{opacity:0;pointer-events:none;}
.loader-logo{font-family:var(--serif);font-size:2.2rem;font-weight:300;color:#fff;display:flex;align-items:center;gap:10px;letter-spacing:0.01em;}
.loader-logo span{color:var(--teal);}
.loader-ring{width:36px;height:36px;border:2px solid rgba(34,196,184,0.2);border-top-color:var(--teal);border-radius:50%;animation:spin 0.85s linear infinite;}
.loader-sub{font-size:0.72rem;color:rgba(255,255,255,0.3);letter-spacing:0.1em;}

/* NAV */
#nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem 1.75rem;display:flex;align-items:center;justify-content:space-between;background:rgba(6,8,14,0.2);backdrop-filter:blur(20px);transition:all 0.3s;}
#nav.scrolled{background:rgba(6,8,14,0.97);border-bottom:1px solid var(--bdr);}
.nav-logo{font-family:var(--serif);font-size:1.35rem;font-weight:300;color:#fff;display:flex;align-items:center;gap:8px;letter-spacing:0.01em;white-space:nowrap;}
.nav-logo span{white-space:nowrap;}
.nav-links{display:flex;gap:0.5rem;align-items:center;flex-wrap:wrap;}
.btn-nav{background:none;border:none;color:rgba(255,255,255,0.5);font-size:0.8rem;padding:0.35rem 0.75rem;}
.btn-nav:hover{color:#fff;}
.btn-teal{padding:0.42rem 1.15rem;background:var(--teal);border:none;border-radius:20px;color:var(--ink);font-size:0.8rem;font-weight:700;box-shadow:0 4px 20px rgba(34,196,184,0.3);}
.btn-teal:hover{background:var(--teal-h);}

/* HERO */
#hero{position:relative;height:100vh;overflow:hidden;display:flex;flex-direction:column;}
#hero-video-wrap{position:absolute;inset:0;overflow:hidden;}
#hero-iframe{position:absolute;top:-10%;left:-10%;width:120%;height:120%;border:none;pointer-events:none;}
#hero-canvas{position:absolute;inset:0;width:100%;height:100%;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(5,8,18,0.5) 0%,rgba(5,8,18,0.05) 35%,rgba(5,8,18,0.6) 75%,var(--ink) 100%);pointer-events:none;}
.hero-bub-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.hbub{position:absolute;bottom:-10px;border-radius:50%;border:1px solid rgba(34,196,184,0.2);animation:bubRise linear infinite;}
.hero-content{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;padding:0 1.5rem 5.5rem;}
.hero-pill{display:inline-flex;align-items:center;gap:0.5rem;background:rgba(34,196,184,0.13);border:1px solid rgba(34,196,184,0.28);border-radius:20px;padding:0.35rem 1rem;font-size:0.7rem;font-weight:500;color:var(--teal);margin-bottom:1.75rem;letter-spacing:0.05em;animation:riseIn 0.8s ease 0.15s both;}
.pdot{width:6px;height:6px;border-radius:50%;background:var(--teal);display:inline-block;animation:lPulse 2s ease infinite;}
.hero-h1{font-family:var(--serif);font-size:clamp(3rem,9vw,6.5rem);font-weight:300;line-height:1.05;letter-spacing:-0.02em;color:#fff;margin-bottom:1.25rem;text-shadow:0 4px 40px rgba(0,0,0,0.65);animation:riseIn 0.8s ease 0.3s both;}
.hero-h1 em{color:var(--teal);font-style:italic;}
.hero-sub{font-size:clamp(0.9rem,2vw,1.08rem);color:rgba(255,255,255,0.55);line-height:1.75;max-width:430px;margin:0 auto 2.5rem;animation:riseIn 0.8s ease 0.45s both;}
.hero-btns{display:flex;gap:0.8rem;justify-content:center;flex-wrap:wrap;animation:riseIn 0.8s ease 0.6s both;}
.btn-hero{padding:0.95rem 2.25rem;background:var(--teal);border:none;border-radius:50px;color:var(--ink);font-size:0.92rem;font-weight:700;box-shadow:0 4px 28px rgba(34,196,184,0.4);}
.btn-hero:hover{background:var(--teal-h);}
.btn-hero-out{padding:0.95rem 2rem;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.18);border-radius:50px;color:#fff;font-size:0.92rem;}
.btn-hero-out:hover{background:rgba(255,255,255,0.14);}

/* SECTIONS */
.sec{padding:5rem 1.5rem;}
.sec-dark{background:var(--ink);}
.sec-mid{background:var(--deep);}
.ctr{max-width:1040px;margin:0 auto;}
.eyebrow{font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--teal);margin-bottom:0.65rem;}
.sec-h2{font-family:var(--serif);font-size:clamp(1.8rem,4vw,2.9rem);font-weight:300;line-height:1.2;}
.sec-h2 em{font-style:italic;color:var(--teal);}
.sec-sub{font-size:0.9rem;color:rgba(255,255,255,0.4);margin-top:0.5rem;line-height:1.7;}

/* TANK GRID */
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1rem;}
.tcard{border-radius:20px;overflow:hidden;cursor:pointer;box-shadow:0 4px 24px rgba(0,0,0,0.45);transition:transform 0.25s,box-shadow 0.25s;}
.tcard:hover{transform:translateY(-5px);}
.tcanvas-wrap{height:175px;position:relative;background:#07080f;}
.tcanvas-wrap canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;}
.tcanvas-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:1;}
.live-badge{position:absolute;top:0.65rem;left:0.65rem;display:flex;align-items:center;gap:0.35rem;background:rgba(0,0,0,0.52);backdrop-filter:blur(6px);border-radius:20px;padding:0.25rem 0.65rem;z-index:3;}
.rdot{width:6px;height:6px;border-radius:50%;background:#ef4444;display:inline-block;animation:lPulse 1.5s ease infinite;}
.live-txt{font-size:0.6rem;color:#fff;font-weight:700;letter-spacing:0.08em;}
.prem-badge{position:absolute;top:0.65rem;right:0.65rem;background:rgba(245,158,11,0.18);border:1px solid rgba(245,158,11,0.4);border-radius:20px;padding:0.2rem 0.6rem;font-size:0.58rem;color:#f59e0b;font-weight:700;z-index:3;}
.tinfo{padding:0.9rem 1.05rem 1.1rem;background:rgba(8,12,22,0.97);}
.tname{font-family:var(--serif);font-size:1rem;color:var(--bright);margin-bottom:0.3rem;}
.tmeta{display:flex;justify-content:space-between;}
.tmeta span{font-size:0.7rem;color:rgba(200,220,220,0.38);}

/* CREATOR TANKS — landing section */
.creator-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-bottom:2.5rem;}
.creator-card{background:rgba(255,255,255,0.025);border:1px solid var(--bdr);border-radius:18px;overflow:hidden;transition:transform 0.22s,border-color 0.2s;}
.creator-card:hover{transform:translateY(-4px);border-color:rgba(34,196,184,0.22);}
.creator-thumb{aspect-ratio:16/10;position:relative;background:linear-gradient(135deg,rgba(34,196,184,0.08),rgba(34,196,184,0.02));display:flex;align-items:center;justify-content:center;overflow:hidden;}
.creator-thumb-empty::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(34,196,184,0.02) 10px,rgba(34,196,184,0.02) 20px);}
.creator-ghost-lbl{font-family:var(--serif);font-size:1rem;font-weight:300;color:rgba(34,196,184,0.35);letter-spacing:0.12em;text-transform:uppercase;position:relative;z-index:1;}
.creator-thumb-cta{background:linear-gradient(135deg,rgba(34,196,184,0.14),rgba(34,196,184,0.04));}
.creator-cta-icon{font-size:3rem;color:var(--teal);opacity:0.6;font-weight:200;}
.creator-card-cta{border-color:rgba(34,196,184,0.28);}
.creator-card-cta:hover{border-color:var(--teal);}
.creator-info{padding:1rem 1.15rem 1.15rem;}
.creator-handle{font-family:var(--serif);font-size:1.05rem;font-weight:300;color:#fff;margin-bottom:0.25rem;}
.creator-meta{font-size:0.72rem;color:rgba(34,196,184,0.5);letter-spacing:0.05em;}
.creator-apply-btn{margin-top:0.85rem;width:100%;padding:0.55rem;background:rgba(34,196,184,0.12);border:1px solid rgba(34,196,184,0.3);border-radius:20px;color:var(--teal);font-size:0.72rem;font-weight:600;}
.creator-apply-btn:hover{background:rgba(34,196,184,0.22);}
.creator-footnote{text-align:center;font-family:var(--serif);font-size:1rem;font-style:italic;color:rgba(255,255,255,0.38);font-weight:300;line-height:1.7;max-width:540px;margin:0 auto;}

/* CREATOR TANKS — sidebar version */
.screators{padding:0.55rem 1rem 0.7rem;border-top:1px solid var(--bdr);flex-shrink:0;}
.screators-lbl{font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(34,196,184,0.5);margin-bottom:0.5rem;}
.screators-empty{background:rgba(34,196,184,0.04);border:1px dashed rgba(34,196,184,0.2);border-radius:10px;padding:0.6rem 0.75rem;}
.screators-msg{font-size:0.72rem;color:rgba(34,196,184,0.7);font-weight:500;margin-bottom:0.2rem;}
.screators-sub{font-size:0.6rem;color:rgba(255,255,255,0.38);line-height:1.45;}

/* MANIFESTO */
.manifesto-sec{padding:6rem 1.5rem;background:var(--ink);text-align:center;position:relative;overflow:hidden;}
.manifesto-sec::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(34,196,184,0.05) 0%,transparent 70%);pointer-events:none;}
.manifesto-inner{max-width:700px;margin:0 auto;position:relative;z-index:1;}
.manifesto-text{font-family:var(--serif);font-size:clamp(2rem,5vw,3.5rem);font-weight:300;line-height:1.15;color:#fff;letter-spacing:-0.01em;margin-bottom:1.5rem;}
.manifesto-text em{font-style:italic;color:var(--teal);}
.manifesto-sub{font-size:clamp(0.88rem,1.5vw,1rem);color:rgba(255,255,255,0.4);line-height:1.8;max-width:480px;margin:0 auto;}

/* HOW IT WORKS */
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-top:3.5rem;}
.step-card{padding:2rem 1.75rem;background:rgba(255,255,255,0.025);border:1px solid var(--bdr);border-radius:20px;transition:border-color 0.2s,background 0.2s;}
.step-card:hover{border-color:rgba(34,196,184,0.25);background:rgba(34,196,184,0.04);}
.step-n{font-family:var(--serif);font-size:0.68rem;color:rgba(34,196,184,0.4);letter-spacing:0.15em;margin-bottom:1rem;}
.step-icon{font-size:1.5rem;margin-bottom:0.9rem;}
.step-title{font-family:var(--serif);font-size:1.05rem;margin-bottom:0.5rem;}
.step-desc{font-size:0.83rem;line-height:1.75;color:rgba(200,220,220,0.48);}

/* FEATURES 3+3 */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,0.05);border-radius:20px;overflow:hidden;margin-top:3.5rem;}
.feat-cell{background:var(--ink);padding:2rem 1.75rem;transition:background 0.22s;}
.feat-cell:hover{background:#0d1220;}
.feat-icon{font-size:1.5rem;margin-bottom:0.9rem;}
.feat-title{font-family:var(--serif);font-size:1rem;margin-bottom:0.5rem;}
.feat-desc{font-size:0.82rem;line-height:1.75;color:rgba(200,220,220,0.48);}

/* SUPPORT */
.support-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;}
.support-card{padding:2rem 1.75rem 2.25rem;border-radius:22px;border:1px solid var(--bdr);background:rgba(255,255,255,0.02);position:relative;transition:transform 0.22s,border-color 0.2s;}
.support-card:hover{transform:translateY(-4px);border-color:rgba(34,196,184,0.2);}
.support-card.support-hi{border-color:var(--teal);background:rgba(34,196,184,0.06);box-shadow:0 0 0 1px var(--teal),0 20px 60px rgba(34,196,184,0.08);}
.support-badge{position:absolute;top:-1px;left:50%;transform:translateX(-50%);background:var(--teal);color:var(--ink);font-size:0.6rem;font-weight:700;letter-spacing:0.1em;padding:0.28rem 1rem;border-radius:0 0 10px 10px;}
.support-icon{font-size:1.75rem;margin-bottom:0.75rem;}
.support-name{font-family:var(--serif);font-size:1.3rem;font-weight:300;margin-bottom:0.5rem;}
.support-desc{font-size:0.82rem;line-height:1.75;color:rgba(200,237,234,0.5);margin-bottom:1.75rem;}
.pbtn{width:100%;padding:0.88rem;border-radius:50px;border:none;font-size:0.85rem;font-weight:600;}
.pbtn.fill{background:var(--teal);color:var(--ink);box-shadow:0 4px 20px rgba(34,196,184,0.25);}
.pbtn.fill:hover{background:var(--teal-h);}

/* CTA */
.cta-section{border-top:1px solid rgba(34,196,184,0.07);text-align:center;}
.cta-inner{max-width:500px;margin:0 auto;}
.cta-pill{display:inline-block;background:rgba(34,196,184,0.09);border:1px solid rgba(34,196,184,0.2);border-radius:20px;padding:0.35rem 1rem;font-size:0.68rem;color:var(--teal);margin-bottom:1.5rem;}
.cta-sub{font-size:0.88rem;color:rgba(200,220,220,0.48);line-height:1.9;margin-bottom:2rem;text-align:center;}
.cta-micro{font-size:0.65rem;color:rgba(200,220,220,0.25);margin-top:0.75rem;}
.notify-wrap{display:flex;max-width:370px;margin:0 auto;border:1px solid rgba(34,196,184,0.25);border-radius:50px;overflow:hidden;background:rgba(255,255,255,0.03);}
.notify-in{flex:1;padding:0.88rem 1.25rem;background:transparent;border:none;color:var(--bright);font-size:0.85rem;outline:none;}
.notify-btn{padding:0.88rem 1.4rem;background:var(--teal);border:none;color:var(--ink);font-size:0.82rem;font-weight:700;}
.notify-btn:hover{background:var(--teal-h);}
.notify-done{padding:1rem 1.5rem;background:rgba(34,196,184,0.09);border:1px solid rgba(34,196,184,0.25);border-radius:14px;color:var(--teal);font-size:0.9rem;display:inline-block;}

/* FOOTER */
footer{background:var(--ink);border-top:1px solid var(--bdr);padding:2.25rem 1.5rem;}
.footer-inner{max-width:1040px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0.75rem;}
.footer-wit{font-size:0.7rem;color:rgba(200,220,220,0.22);}
.footer-copy{font-size:0.7rem;color:rgba(200,220,220,0.18);}

/* ══════════ DASHBOARD ══════════ */
#dashboard{display:none;height:100vh;flex-direction:column;background:var(--ink);overflow:hidden;}
#dashboard.on{display:flex;}
#mob-bar{display:none;padding:0.7rem 1rem;background:var(--sur);border-bottom:1px solid var(--bdr);align-items:center;justify-content:space-between;flex-shrink:0;}
.mob-menu-btn{background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.1);border-radius:8px;padding:0.4rem 0.7rem;color:rgba(255,255,255,0.7);font-size:0.9rem;}
.mob-back-btn{background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.1);border-radius:8px;padding:0.4rem 0.7rem;color:rgba(255,255,255,0.5);font-size:0.7rem;}
.dash-body{flex:1;display:flex;overflow:hidden;min-height:0;}

/* SIDEBAR */
#sbd{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.65);z-index:190;backdrop-filter:blur(3px);}
#sbd.on{display:block;}
#sidebar{width:260px;flex-shrink:0;background:var(--sur);border-right:1px solid var(--bdr);display:flex;flex-direction:column;height:100%;overflow:hidden;transition:transform 0.28s;z-index:200;}
.slogo-row{padding:1rem 1rem 0.8rem;border-bottom:1px solid var(--bdr);display:flex;justify-content:space-between;align-items:center;flex-shrink:0;}
.slogo{font-family:var(--serif);font-size:1.15rem;font-weight:300;display:flex;align-items:center;gap:7px;letter-spacing:0.01em;}
.slogo span,.slogo .teal-u{color:var(--teal);}
.ssubtag{font-size:0.58rem;color:rgba(180,220,218,0.38);margin-top:2px;letter-spacing:0.07em;}
.slogo-btns{display:flex;gap:0.35rem;align-items:center;}
.sback{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:20px;color:rgba(255,255,255,0.55);font-size:0.66rem;padding:0.28rem 0.7rem;}
.sback:hover{background:rgba(255,255,255,0.12);color:#fff;}
#sb-close{display:none;background:none;border:none;color:rgba(255,255,255,0.4);font-size:1.1rem;}

/* Search — moved down, aligned with video start */
.ssearch-wrap{padding:0.65rem 0.85rem;border-bottom:1px solid var(--bdr);position:relative;flex-shrink:0;}
.ssearch-icon{position:absolute;left:1.45rem;top:50%;transform:translateY(-50%);pointer-events:none;z-index:1;}
.ssearch{width:100%;padding:0.5rem 0.75rem 0.5rem 2.1rem;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.08);border-radius:20px;color:var(--bright);font-size:0.72rem;outline:none;transition:border-color 0.2s;}
.ssearch:focus{border-color:rgba(34,196,184,0.35);}

.scount{padding:0.4rem 1rem 0.3rem;font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(34,196,184,0.48);flex-shrink:0;}
.slist{overflow-y:auto;}
.sitem{display:flex;align-items:center;gap:0.55rem;padding:0.55rem 0.85rem;cursor:pointer;border-left:2px solid transparent;transition:background 0.15s,border-color 0.15s;}
.sitem:hover{background:rgba(255,255,255,0.03);}
.sitem.on{background:rgba(34,196,184,0.08);border-left-color:var(--teal);}
.sthumb{width:42px;height:32px;border-radius:7px;overflow:hidden;flex-shrink:0;position:relative;}
.sthumb img{width:100%;height:100%;object-fit:cover;display:block;}
.sdot{position:absolute;bottom:2px;right:3px;width:5px;height:5px;border-radius:50%;}
.siname{font-size:0.73rem;font-weight:500;color:#e8f0f4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.siviews{font-size:0.58rem;color:rgba(255,255,255,0.3);margin-top:1px;}

/* Favourites */
.sfavs-lbl{padding:0.55rem 1rem 0.25rem;font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(239,68,68,0.6);border-top:1px solid var(--bdr);margin-top:0.25rem;}

/* Species */
.sspecies{padding:0.75rem 1rem;border-top:1px solid var(--bdr);flex-shrink:0;}
.sspecies-lbl{font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(34,196,184,0.5);margin-bottom:0.5rem;}
.sspecies-row{display:flex;align-items:center;gap:0.5rem;font-size:0.72rem;color:rgba(255,255,255,0.55);margin-bottom:0.28rem;}
.sspecies-dot{width:4px;height:4px;border-radius:50%;opacity:0.7;display:inline-block;flex-shrink:0;}

.scta{padding:0.85rem 0.9rem;border-top:1px solid var(--bdr);background:rgba(34,196,184,0.03);flex-shrink:0;}
.scta-lbl{font-size:0.65rem;font-weight:600;color:var(--teal);margin-bottom:0.35rem;}
.scta-row{display:flex;gap:0.35rem;}
.semail{flex:1;padding:0.45rem 0.6rem;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:8px;color:var(--bright);font-size:0.65rem;outline:none;}
.sebtn{padding:0.45rem 0.65rem;background:var(--teal);border:none;border-radius:8px;color:var(--ink);font-size:0.65rem;font-weight:700;}

/* PLAYER */
#player{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden;}

/* TOP BAR — brightness + sleep on right, no location, no premium */
.pbar{padding:0.55rem 1rem;border-bottom:1px solid var(--bdr);display:flex;align-items:center;gap:0.5rem;background:rgba(6,10,20,0.88);flex-shrink:0;flex-wrap:wrap;position:relative;z-index:5;}
.pbar-right{display:flex;align-items:center;gap:0.75rem;margin-left:auto;flex-wrap:wrap;}
.lred{width:7px;height:7px;border-radius:50%;background:#ef4444;display:inline-block;animation:lPulse 1.5s ease infinite;flex-shrink:0;}
.ltxt{font-size:0.62rem;font-weight:700;color:#ef4444;letter-spacing:0.1em;}
.sep{font-size:0.62rem;color:rgba(255,255,255,0.2);}
.bstat{font-size:0.7rem;color:rgba(255,255,255,0.45);}
.slider-group{display:flex;align-items:center;gap:0.4rem;}
.slider-lbl{font-size:0.7rem;color:rgba(255,255,255,0.3);}
input[type=range]{-webkit-appearance:none;width:65px;height:3px;border-radius:2px;background:rgba(255,255,255,0.15);outline:none;cursor:pointer;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:11px;height:11px;border-radius:50%;background:var(--teal);}
.sleep-inline{display:flex;align-items:center;gap:0.4rem;}
.sleep-inline-lbl{font-size:0.7rem;color:rgba(255,255,255,0.3);}
.sleep-num-wrap{display:flex;align-items:center;gap:2px;}
.sleep-num-btn{width:18px;height:20px;background:rgba(34,196,184,0.08);border:1px solid rgba(34,196,184,0.2);border-radius:5px;color:var(--teal);font-size:0.75rem;font-weight:600;padding:0;display:flex;align-items:center;justify-content:center;line-height:1;}
.sleep-num-btn:hover{background:rgba(34,196,184,0.18);}
.sleep-input{width:34px;padding:0.18rem 0;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:5px;color:var(--bright);font-size:0.65rem;outline:none;text-align:center;-moz-appearance:textfield;}
.sleep-input::-webkit-outer-spin-button,.sleep-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.sleep-input:focus{border-color:rgba(34,196,184,0.4);}
.sleep-start-btn{padding:0.22rem 0.55rem;background:rgba(34,196,184,0.1);border:1px solid rgba(34,196,184,0.25);border-radius:7px;color:var(--teal);font-size:0.62rem;font-weight:600;}
.sleep-start-btn:hover{background:rgba(34,196,184,0.2);}
.sleep-start-btn.active{background:var(--teal);color:var(--ink);border-color:var(--teal);}
.sleep-cd-txt{font-size:0.6rem;color:var(--teal);min-width:32px;}

#player-wrap{flex:1;position:relative;min-height:0;}
#player-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;}
#yt-wrap{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;}
#yt-wrap iframe{position:absolute;top:-10%;left:-10%;width:120%;height:120%;border:none;pointer-events:none;opacity:0;transition:opacity 1.5s;}

/* Location overlay — improved */
.povl{position:absolute;bottom:0.9rem;left:1rem;z-index:4;pointer-events:none;}
.pov-name{font-family:var(--serif);font-size:clamp(1rem,2.5vw,1.6rem);font-weight:300;color:#fff;text-shadow:0 2px 20px rgba(0,0,0,0.9);margin-bottom:0.15rem;line-height:1.2;}
.pov-loc{font-size:0.65rem;color:rgba(255,255,255,0.5);background:rgba(0,0,0,0.35);backdrop-filter:blur(6px);padding:0.15rem 0.5rem;border-radius:10px;display:inline-block;}

/* Fullscreen button — bottom left of video */
.fs-overlay-btn{position:absolute;bottom:0.85rem;right:0.85rem;z-index:4;background:rgba(0,0,0,0.45);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,0.15);border-radius:8px;color:rgba(255,255,255,0.65);font-size:1rem;padding:0.3rem 0.5rem;line-height:1;}
.fs-overlay-btn:hover{background:rgba(0,0,0,0.65);color:#fff;}

/* SOUND BAR */
.sndbar{padding:0.55rem 1rem;border-top:1px solid var(--bdr);background:rgba(6,10,20,0.92);display:flex;align-items:center;gap:0.4rem;flex-wrap:wrap;flex-shrink:0;position:relative;z-index:5;}
.snd-ico{font-size:0.8rem;color:rgba(255,255,255,0.22);margin-right:0.1rem;}
.sndbtn{display:flex;align-items:center;gap:0.28rem;padding:0.3rem 0.75rem;border-radius:20px;font-size:0.68rem;background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.45);border:1px solid rgba(255,255,255,0.07);font-weight:400;}
.sndbtn.on{background:var(--teal);color:var(--ink);border:none;font-weight:700;}
.sndbtn:hover:not(.on){background:rgba(255,255,255,0.1);}
.vol-wrap{margin-left:auto;display:flex;align-items:center;gap:0.45rem;}
.vol-lbl{font-size:0.58rem;color:rgba(255,255,255,0.25);}

/* RIGHT PANEL — narrower, feed + chat */
#rp{width:210px;flex-shrink:0;border-left:1px solid var(--bdr);background:var(--sur);display:flex;flex-direction:column;overflow:hidden;}
.rp-feed{padding:0.85rem 0.9rem;flex-shrink:0;border-bottom:none;}
.rp-lbl{font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(34,196,184,0.5);margin-bottom:0.5rem;}
.rp-feed-sub{font-size:0.68rem;color:rgba(255,255,255,0.38);line-height:1.6;margin-bottom:0.65rem;}
.feed-btn{width:100%;padding:0.5rem;background:var(--teal);border:none;border-radius:20px;color:var(--ink);font-size:0.72rem;font-weight:700;margin-bottom:0.5rem;}
.feed-btn:hover{background:var(--teal-h);}
.feed-log{display:flex;flex-direction:column;gap:0.3rem;}
.feed-entry{font-size:0.65rem;color:rgba(255,255,255,0.5);line-height:1.5;animation:fadeUp 0.3s ease;padding:0.2rem 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.rp-divider{height:1px;background:var(--bdr);margin:0.5rem 0;flex-shrink:0;}
.rp-chat-lbl{font-size:0.58rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(34,196,184,0.5);padding:0.4rem 0.9rem 0.3rem;flex-shrink:0;}
.chat-feed{flex:1;overflow-y:auto;padding:0 0.9rem 0.5rem;display:flex;flex-direction:column;gap:0.4rem;justify-content:flex-end;}
.chat-empty{font-size:0.65rem;color:rgba(255,255,255,0.2);font-style:italic;}
.cmsg{font-size:0.68rem;line-height:1.5;animation:fadeUp 0.3s ease;}
.cusr{font-weight:600;font-size:0.6rem;}
.ctxt{color:rgba(255,255,255,0.52);}

/* TOAST */
#toast{position:fixed;bottom:1.25rem;left:50%;transform:translateX(-50%) translateY(16px);background:rgba(6,10,20,0.96);border:1px solid rgba(34,196,184,0.35);backdrop-filter:blur(16px);border-radius:50px;padding:0.65rem 1.4rem;font-size:0.8rem;color:var(--bright);z-index:9998;white-space:nowrap;opacity:0;transition:all 0.35s cubic-bezier(0.34,1.56,0.64,1);pointer-events:none;}
#toast.on{opacity:1;transform:translateX(-50%) translateY(0);}

/* RESPONSIVE */
@media(max-width:1059px){#rp{display:none;}}
@media(max-width:768px){.feat-grid{grid-template-columns:1fr;}}
@media(max-width:699px){
  #sidebar{position:fixed;top:0;left:0;bottom:0;transform:translateX(-100%);box-shadow:4px 0 40px rgba(0,0,0,0.7);}
  #sidebar.on{transform:translateX(0);}
  #mob-bar{display:flex;}
  #sb-close{display:block !important;}
  .pbar-right{gap:0.5rem;}
}