:root{
  --navy:#0A0E1F;--navy-mid:#151A33;--navy-light:#212A4D;--gold:#7C5CFC;--gold-light:#A78BFA;
  --gold-dim:#4C3A99;--gold-dim-text:#C4B5FD;--white:#F7F8FC;--off-white:#E6E8F7;--muted:#9AA0C3;--on-gold:#14102B;--fixed-light:#ffffff;
  --physical:#059669;--physical-light:#34D399;--gto:#E11D48;--gto-light:#FB7185;
  --psych:#2563EB;--psych-light:#60A5FA;--academic:#7C3AED;--academic-light:#C4B5FD;
  --rest:#16A34A;--rest-light:#4ADE80;--success:#22C55E;--warning:#F59E0B;--danger:#EF4444;
  --desc-text:#C7CCE9;
  --accent2:#EC4899;--accent2-light:#F472B6;--accent3:#06B6D4;--accent3-light:#22D3EE;
}
html[data-theme="light"]{
  --navy:#F6F7FC;--navy-mid:#FFFFFF;--navy-light:#EEF0FB;--gold:#6D3FF0;--gold-light:#5A2FD9;
  --gold-dim:#C9B8FA;--gold-dim-text:#5A2FD9;--white:#12142E;--off-white:#2B2E52;--muted:#666B94;--on-gold:#FFFFFF;--fixed-light:#ffffff;
  --physical:#059669;--physical-light:#047857;--gto:#E11D48;--gto-light:#BE123C;
  --psych:#2563EB;--psych-light:#1D4ED8;--academic:#7C3AED;--academic-light:#6D28D9;
  --rest:#16A34A;--rest-light:#15803D;--success:#16A34A;--warning:#D97706;--danger:#DC2626;
  --desc-text:#4A4E77;
  --accent2:#DB2777;--accent2-light:#BE185D;--accent3:#0891B2;--accent3-light:#0E7490;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--navy);color:var(--white);font-family:'Inter',sans-serif;font-size:14px;line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;position:relative;}
body::before{
  content:'';
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(ellipse 60% 45% at 15% 20%,rgba(124,92,252,.16) 0%,transparent 60%),
    radial-gradient(ellipse 55% 45% at 85% 15%,rgba(236,72,153,.30) 0%,transparent 60%),
    radial-gradient(ellipse 65% 50% at 25% 85%,rgba(124,92,252,.10) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 90%,rgba(6,182,212,.28) 0%,transparent 60%),
    var(--navy);
  background-repeat:no-repeat;
  animation:bgDrift 26s ease-in-out infinite alternate;
  will-change:background-position;
}
html[data-theme="light"] body::before{
  background:
    radial-gradient(ellipse 60% 45% at 15% 20%,rgba(109,63,240,.14) 0%,transparent 60%),
    radial-gradient(ellipse 55% 45% at 85% 15%,rgba(236,72,153,.10) 0%,transparent 60%),
    radial-gradient(ellipse 65% 50% at 25% 85%,rgba(109,63,240,.08) 0%,transparent 60%),
    radial-gradient(ellipse 60% 50% at 90% 90%,rgba(6,182,212,.10) 0%,transparent 60%),
    var(--navy);
  background-repeat:no-repeat;
}
@keyframes bgDrift{
  0%{background-position:0% 0%,0% 0%,0% 0%,0% 0%,0 0;}
  50%{background-position:6% 4%,-5% 6%,5% -4%,-4% -5%,0 0;}
  100%{background-position:-6% -3%,5% -5%,-5% 4%,4% 5%,0 0;}
}
@media (prefers-reduced-motion:reduce){
  body::before{animation:none;}
}
@media (max-width:640px){
  body::before{animation-duration:34s;}
}
#bgNetworkCanvas{
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  display:block;
}
button,input,select,textarea{font-family:inherit;}
button{-webkit-tap-highlight-color:transparent;}
::selection{background:rgba(124,92,252,.35);color:var(--white);}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-track{background:rgba(255,255,255,.02);}
::-webkit-scrollbar-thumb{background:rgba(124,92,252,.35);border-radius:14px;}
::-webkit-scrollbar-thumb:hover{background:rgba(124,92,252,.55);}

.whatsapp-float{position:fixed;bottom:24px;right:24px;width:56px;height:56px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:999;box-shadow:0 4px 12px rgba(0,0,0,.4);cursor:pointer;transition:all .3s;text-decoration:none;}
.whatsapp-float:hover{transform:scale(1.1);box-shadow:0 6px 16px rgba(37,211,102,.4);}
.whatsapp-float span{color:white;font-size:28px;display:flex;align-items:center;justify-content:center;}

.gate-screen{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px;background:transparent;position:relative;}
.gate-screen::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(124,92,252,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(124,92,252,.035) 1px,transparent 1px);background-size:42px 42px;pointer-events:none;mask-image:radial-gradient(ellipse 70% 55% at 50% 35%,#000 0%,transparent 75%);}
.gate-card{position:relative;background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1px solid rgba(124,92,252,.22);border-radius:18px;padding:38px 34px 30px;max-width:440px;width:100%;box-shadow:0 24px 70px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.02) inset;z-index:1;}
.gate-card::before{content:'';position:absolute;top:0;left:18px;right:18px;height:1px;background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);}
.gate-card::after{content:'';position:absolute;top:14px;left:14px;right:14px;bottom:14px;border:1px solid rgba(124,92,252,.08);border-radius:14px;pointer-events:none;}
.gate-logo{text-align:center;margin-bottom:22px;}
.gate-logo .crest-ring{width:84px;height:84px;border-radius:50%;margin:0 auto 16px;padding:3px;background:linear-gradient(160deg,var(--gold-light),var(--gold-dim));box-shadow:0 8px 28px rgba(124,92,252,.3),0 0 0 1px rgba(124,92,252,.15);overflow:hidden;}
.gate-logo .crest-ring img{width:100%;height:100%;border-radius:50%;display:block;border:2px solid var(--navy-mid);object-fit:cover;font-size:0;}
.gate-logo .anchor{font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:4px;color:var(--white);text-transform:uppercase;opacity:.85;}
.gate-logo h1{font-family:'Space Grotesk',sans-serif;font-size:42px;letter-spacing:4px;color:var(--white);margin-top:6px;}
.gate-logo h1 span{color:var(--white);}
.gate-rule{display:flex;align-items:center;gap:10px;justify-content:center;margin:14px 0 16px;color:var(--white);}
.gate-rule::before,.gate-rule::after{content:'';height:1px;width:46px;background:linear-gradient(90deg,transparent,rgba(124,92,252,.5));}
.gate-rule::after{background:linear-gradient(90deg,rgba(124,92,252,.5),transparent);}
.gate-rule span{font-size:9px;}
.gate-sub{text-align:center;color:var(--muted);font-size:11px;letter-spacing:2.5px;margin-bottom:6px;font-family:'Poppins',sans-serif;text-transform:uppercase;}
.gate-tagline{text-align:center;color:var(--off-white);font-size:12px;line-height:1.7;margin:0 0 22px;opacity:.8;}
.auth-toggle{display:flex;gap:0;margin-bottom:24px;background:rgba(0,0,0,.25);border:1px solid rgba(124,92,252,.2);border-radius:14px;padding:4px;position:relative;}
.auth-toggle-btn{flex:1;padding:11px 0;border:none;border-radius:10px;font-family:'Poppins',sans-serif;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;background:transparent;color:var(--muted);font-weight:500;transition:all .25s;}
.auth-toggle-btn.is-active{background:var(--gold);color:var(--on-gold);font-weight:700;box-shadow:0 4px 14px rgba(124,92,252,.35);}
.auth-toggle-btn:not(.is-active):hover{color:var(--white);}
.form-group{margin-bottom:16px;}
.form-label{display:block;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--white);margin-bottom:8px;}
.form-input,.form-select{width:100%;background:rgba(255,255,255,.035);border:1px solid rgba(124,92,252,.22);border-radius:14px;padding:13px 14px;color:var(--white);font-size:14px;transition:border-color .2s,background .2s,box-shadow .2s;}
.pwd-field-wrap{position:relative;}
.pwd-field-wrap input.form-input{padding-right:42px;}
.pwd-toggle-btn{position:absolute;top:50%;right:6px;transform:translateY(-50%);background:transparent;border:none;cursor:pointer;font-size:16px;line-height:1;padding:6px;opacity:.6;transition:opacity .2s;}
.pwd-toggle-btn:hover{opacity:1;}
.form-input:focus,.form-select:focus{outline:none;border-color:var(--gold);background:rgba(255,255,255,.055);box-shadow:0 0 0 3px rgba(124,92,252,.12);}
.form-select option{background:var(--navy-mid);color:var(--white);}
.gate-btn{width:100%;padding:14px;border:none;border-radius:14px;font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:2.5px;text-transform:uppercase;cursor:pointer;background:linear-gradient(150deg,var(--gold-light),var(--gold));color:var(--on-gold);font-weight:700;margin-top:10px;transition:all .2s;box-shadow:0 6px 18px rgba(124,92,252,.22);}
.gate-btn:hover{box-shadow:0 8px 24px rgba(124,92,252,.4);transform:translateY(-1px);}
.gate-btn:active{transform:translateY(0);}
.gate-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;}
.social-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;border-radius:14px;font-family:'Inter',sans-serif;font-size:13px;font-weight:600;cursor:pointer;margin-bottom:10px;transition:all .2s;border:1px solid rgba(124,92,252,.25);background:rgba(255,255,255,.035);color:var(--white);}
.social-btn:hover{background:rgba(255,255,255,.07);border-color:rgba(124,92,252,.45);transform:translateY(-1px);}
.social-btn:active{transform:translateY(0);}
.social-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;}
.social-btn svg{flex-shrink:0;}
.gate-divider{display:flex;align-items:center;gap:10px;margin:16px 0;color:var(--muted);font-family:'Poppins',sans-serif;font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;}
.gate-divider::before,.gate-divider::after{content:'';flex:1;height:1px;background:rgba(124,92,252,.2);}
.gate-link{text-align:center;margin-top:18px;font-size:11.5px;color:var(--muted);}
.gate-link a{color:var(--white);cursor:pointer;text-decoration:underline;}
.gate-error{background:rgba(225,29,72,.15);border:1px solid var(--danger);color:#ff8a7a;padding:10px 14px;border-radius:14px;font-size:12px;margin-bottom:14px;display:none;}
.gate-badges{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:6px;padding-top:18px;border-top:1px solid rgba(124,92,252,.12);}
.gate-badges-label{text-align:center;font-family:'Poppins',sans-serif;font-size:8.5px;letter-spacing:2px;color:var(--white);text-transform:uppercase;margin:22px 0 10px;}
.gate-badges .badge{padding:5px 12px;border-radius:8px;font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:1px;text-transform:uppercase;border:1px solid var(--gold-dim);color:var(--muted);background:rgba(255,255,255,.015);transition:all .2s;}
.gate-secure-note{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:16px;color:var(--muted);font-family:'Poppins',sans-serif;font-size:9.5px;letter-spacing:1px;text-transform:uppercase;opacity:.75;}

/* ===== QUICK AUTH (compact Google + email landing card) ===== */
#authQuickBlock .quick-google-btn{margin-bottom:0;padding:14px;border-radius:999px;font-size:14px;}
#authQuickBlock .gate-divider{margin:16px 0;}
.quick-email-input{width:100%;background:rgba(255,255,255,.035);border:1px solid rgba(124,92,252,.22);border-radius:999px;padding:14px 18px;color:var(--white);font-size:14px;margin-bottom:12px;transition:border-color .2s,background .2s,box-shadow .2s;}
.quick-email-input:focus{outline:none;border-color:var(--gold);background:rgba(255,255,255,.055);box-shadow:0 0 0 3px rgba(124,92,252,.12);}
.quick-continue-btn{border-radius:999px;margin-top:0;background:var(--white,#fff);color:#111;box-shadow:0 6px 18px rgba(0,0,0,.18);}
.quick-continue-btn:hover{box-shadow:0 8px 22px rgba(0,0,0,.24);}
.quick-privacy-note{text-align:center;color:var(--muted);font-size:11px;line-height:1.6;margin-top:14px;}
.quick-privacy-note a{color:var(--white);text-decoration:underline;cursor:pointer;}
.auth-back-link{display:inline-block;color:var(--muted);font-family:'Poppins',sans-serif;font-size:11px;letter-spacing:.5px;cursor:pointer;margin-bottom:14px;text-decoration:none;}
.auth-back-link:hover{color:var(--white);}

.app-wrap{display:none;}
.app-wrap.show{display:block;}

/* Boot loader: shown the instant the page loads, before we know whether the visitor is
   already signed in. Without this, the login form was flashed on screen first and then
   swapped for the app a moment later whenever auto-login succeeded (or vice-versa on a
   slow connection) — this neutral screen removes that flicker in both directions. */
.app-boot-loader{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse 80% 60% at 50% 0%,#253018 0%,#0A0E1F 55%,#080B18 100%);}
.app-boot-loader .boot-spin{width:32px;height:32px;border:3px solid rgba(124,92,252,.25);border-top-color:var(--gold);border-radius:50%;animation:spin .7s linear infinite;}
html[data-theme="light"] .app-boot-loader{background:radial-gradient(ellipse 80% 60% at 50% 0%,#ffffff 0%,#ffffff 55%,#EEF0FB 100%);}

.hero{background:linear-gradient(180deg,rgba(20,23,15,.22) 0%,rgba(20,23,15,.42) 100%);border-bottom:1px solid rgba(124,92,252,.35);box-shadow:0 1px 0 rgba(124,92,252,.15),0 12px 40px rgba(0,0,0,.35);padding:36px 24px 32px;position:relative;overflow:hidden;text-align:center;}
.hero::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 60px,rgba(124,92,252,.04) 60px,rgba(124,92,252,.04) 61px),repeating-linear-gradient(90deg,transparent,transparent 60px,rgba(124,92,252,.04) 60px,rgba(124,92,252,.04) 61px);}
.hero-top{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto 20px;position:relative;z-index:2;flex-wrap:wrap;gap:10px;}
.hero-user{font-family:'Poppins',sans-serif;font-size:11px;color:var(--muted);text-align:left;}
.hero-user b{color:var(--white);}
.hero-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.pill-btn{padding:8px 16px;border-radius:20px;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;border:1px solid var(--gold-dim);background:rgba(255,255,255,.02);color:var(--white);transition:all .25s cubic-bezier(.4,0,.2,1);line-height:1.3;}
.pill-btn:hover{background:rgba(124,92,252,.16);border-color:var(--gold);transform:translateY(-1px);}
.pill-btn.premium{background:linear-gradient(150deg,var(--gold-light),var(--gold));color:var(--on-gold);font-weight:700;border-color:var(--gold);box-shadow:0 4px 14px rgba(124,92,252,.3);}
.pill-btn.admin-active{background:rgba(225,29,72,.25);color:#ff9a8a;border-color:var(--gto-light);}
.hero-anchor{font-family:'Poppins',sans-serif;font-size:11px;letter-spacing:4px;color:var(--white);text-transform:uppercase;margin-bottom:14px;}
.hero h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(32px,6vw,68px);letter-spacing:2px;line-height:1.15;color:var(--white);text-shadow:0 0 60px rgba(124,92,252,.3);}
.hero h1 span{color:var(--white);}
.hero-sub{font-family:'Space Grotesk',sans-serif;font-size:clamp(16px,2.5vw,24px);letter-spacing:6px;color:var(--muted);margin-top:6px;}
.hero-badges{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:22px;}
.badge{padding:6px 14px;border-radius:8px;font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:2px;text-transform:uppercase;font-weight:500;}
.badge.phys{background:rgba(5,150,105,.2);color:var(--physical-light);border:1px solid var(--physical);}
.badge.gto{background:rgba(225,29,72,.2);color:var(--gto-light);border:1px solid var(--gto);}
.badge.psy{background:rgba(37,99,235,.2);color:var(--psych-light);border:1px solid var(--psych);}
.badge.acad{background:rgba(124,58,237,.2);color:var(--academic-light);border:1px solid var(--academic);}

/* ============ APP SHELL: sidebar + main content (replaces old horizontal tab bar) ============ */
.app-shell{display:flex;align-items:stretch;min-height:calc(100vh - 260px);min-height:calc(100dvh - 260px);}
.sidebar{width:264px;flex-shrink:0;background:linear-gradient(180deg,rgba(35,40,26,.98),rgba(8,17,31,.98));border-right:1px solid rgba(124,92,252,.2);position:sticky;top:0;align-self:flex-start;height:100vh;height:100dvh;overflow-y:auto;padding:18px 0 24px;z-index:97;scrollbar-width:thin;}
.sidebar::-webkit-scrollbar{width:6px;}
.sidebar::-webkit-scrollbar-thumb{background:rgba(124,92,252,.25);border-radius:10px;}
.sidebar-label{font-family:'Poppins',sans-serif;font-size:9.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--white);padding:0 20px 10px;margin-top:6px;}
.nav-btn{display:flex;align-items:center;gap:12px;width:100%;padding:13px 20px;background:none;border:none;border-left:3px solid transparent;color:var(--muted);font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;text-align:left;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;}
.nav-btn:hover{color:var(--white);background:rgba(124,92,252,.08);}
.nav-btn.active{color:var(--white);border-left-color:var(--gold);background:rgba(124,92,252,.12);font-weight:700;}
.nav-btn.locked-nav{opacity:.62;}
.main-content{flex:1;min-width:0;}
#notifDotSidebar{top:9px;right:16px;}
.sidebar-logout-wrap{margin-top:14px;padding:14px 20px 4px;border-top:1px solid rgba(124,92,252,.15);}
.sidebar-logout-btn{display:flex;justify-content:space-between;align-items:center;color:#ff9a8a;border-radius:14px;padding:11px 14px;}
.sidebar-logout-btn:hover{color:#fff;background:rgba(225,29,72,.18);}
.sidebar-logout-btn .logout-arrow{font-size:15px;transition:transform .2s;}
.sidebar-logout-btn:hover .logout-arrow{transform:translateX(4px);}

/* ============ Settings tab ============ */
.settings-card{background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1px solid rgba(124,92,252,.2);border-radius:18px;padding:22px;margin-bottom:18px;box-shadow:0 8px 24px rgba(0,0,0,.2);}
.settings-card h4{font-family:'Space Grotesk',sans-serif;font-size:17px;letter-spacing:2px;color:var(--white);margin-bottom:4px;}
.settings-card p{color:var(--muted);font-size:12px;margin-bottom:14px;}
.settings-row{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;}
.theme-switch{display:flex;background:rgba(255,255,255,.04);border:1px solid rgba(124,92,252,.25);border-radius:24px;padding:3px;gap:2px;}
.theme-switch-opt{display:flex;align-items:center;gap:6px;padding:9px 18px;border-radius:20px;font-family:'Poppins',sans-serif;font-size:11px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;color:var(--muted);transition:all .25s cubic-bezier(.4,0,.2,1);border:none;background:none;}
.theme-switch-opt.active{background:linear-gradient(150deg,var(--gold-light),var(--gold));color:var(--on-gold);font-weight:700;box-shadow:0 4px 14px rgba(124,92,252,.3);}

.sidebar-toggle{display:flex;position:fixed;top:14px;left:14px;z-index:150;background:rgba(35,40,26,.95);border:1px solid rgba(124,92,252,.35);color:var(--fixed-light);width:44px;height:44px;border-radius:16px;font-size:18px;cursor:pointer;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.35);}
.sidebar{transition:margin-left .28s cubic-bezier(.4,0,.2,1);}
.sidebar.collapsed{margin-left:-264px;}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:95;}
.sidebar-overlay.show{display:block;}

/* ============ Sidebar quick-jump search ============ */
.sidebar-search-wrap{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,rgba(35,40,26,.98),rgba(35,40,26,.98) 80%,transparent);padding:0 16px 14px;margin-bottom:6px;}
.sidebar-search{width:100%;padding:10px 14px 10px 34px;border-radius:20px;border:1px solid rgba(124,92,252,.28);background:rgba(255,255,255,.04);color:var(--off-white);font-family:'Inter',sans-serif;font-size:12.5px;transition:all .2s;}
.sidebar-search::placeholder{color:var(--muted);}
.sidebar-search:focus{outline:none;border-color:var(--gold);background:rgba(255,255,255,.07);box-shadow:0 0 0 3px rgba(124,92,252,.14);}
.sidebar-search-icon{position:absolute;left:30px;margin-top:11px;font-size:12px;color:var(--white);pointer-events:none;}
.sidebar-search-panel{display:none;position:absolute;left:16px;right:16px;top:calc(100% - 6px);background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1px solid rgba(124,92,252,.3);border-radius:16px;box-shadow:0 18px 46px rgba(0,0,0,.5);max-height:min(420px,60vh);overflow-y:auto;padding:6px;z-index:50;}
.sidebar-search-panel.show{display:block;}
.nav-btn.search-hidden{display:none;}
html[data-theme="light"] .sidebar-search{background:rgba(0,0,0,.03);}
html[data-theme="light"] .sidebar-search-wrap{background:linear-gradient(180deg,#ffffff,#ffffff 80%,transparent);}

/* ============ Dashboard universal search ============ */
.dash-search-wrap{position:relative;margin:2px 0 26px;z-index:40;}
.dash-search-box{display:flex;align-items:center;gap:10px;background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1.5px solid rgba(124,92,252,.4);border-radius:14px;padding:15px 18px;box-shadow:0 10px 30px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.02) inset;transition:border-color .2s,box-shadow .2s;}
.dash-search-box:focus-within{border-color:var(--gold);box-shadow:0 10px 34px rgba(124,92,252,.22),0 0 0 3px rgba(124,92,252,.12);}
.dash-search-icon{font-size:17px;color:var(--white);flex-shrink:0;}
.dash-search-input{flex:1;border:none;background:transparent;outline:none;color:var(--white);font-family:'Inter',sans-serif;font-size:15px;font-weight:500;}
.dash-search-input::placeholder{color:var(--muted);font-weight:400;}
.dash-search-clear{display:none;border:none;background:rgba(255,255,255,.06);color:var(--muted);width:24px;height:24px;border-radius:50%;font-size:13px;cursor:pointer;align-items:center;justify-content:center;flex-shrink:0;}
.dash-search-clear.show{display:flex;}
.dash-search-spinner{display:none;width:15px;height:15px;border-radius:50%;border:2px solid rgba(124,92,252,.25);border-top-color:var(--gold);flex-shrink:0;animation:dashSearchSpin .7s linear infinite;}
.dash-search-spinner.show{display:block;}
@keyframes dashSearchSpin{to{transform:rotate(360deg);}}
.dash-search-panel{display:none;position:absolute;top:calc(100% + 10px);left:0;right:0;background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1px solid rgba(124,92,252,.3);border-radius:20px;box-shadow:0 18px 46px rgba(0,0,0,.5);max-height:min(480px,70vh);overflow-y:auto;padding:8px;}
.dash-search-panel.show{display:block;}
.dash-search-group-label{font-family:'Poppins',sans-serif;font-size:9.5px;letter-spacing:1.8px;text-transform:uppercase;color:var(--white);padding:10px 12px 6px;}
.dash-search-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;cursor:pointer;transition:background .15s;}
.dash-search-item:hover,.dash-search-item.is-active{background:rgba(124,92,252,.12);}
.dash-search-item-icon{width:32px;height:32px;border-radius:16px;background:rgba(124,92,252,.14);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;}
.dash-search-item-text{min-width:0;flex:1;}
.dash-search-item-title{font-size:13px;font-weight:600;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dash-search-item-sub{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px;}
.dash-search-item-go{font-size:11px;color:var(--white);font-family:'Poppins',sans-serif;flex-shrink:0;}
.dash-search-web-item .dash-search-item-icon{background:rgba(255,255,255,.05);}
.dash-search-divider{height:1px;background:rgba(124,92,252,.14);margin:6px 4px;}
.dash-search-empty{padding:22px 14px;text-align:center;color:var(--muted);font-size:12.5px;}
html[data-theme="light"] .dash-search-box{background:linear-gradient(165deg,#ffffff 0%,#F0F1FA 100%);box-shadow:0 8px 22px rgba(90,66,22,.1);}
html[data-theme="light"] .dash-search-panel{background:linear-gradient(165deg,#ffffff 0%,#F0F1FA 100%);}
html[data-theme="light"] .dash-search-item:hover,html[data-theme="light"] .dash-search-item.is-active{background:rgba(109,63,240,.1);}
@media(max-width:480px){.dash-search-box{padding:13px 15px;}.dash-search-input{font-size:14px;}}

/* ============ Search — floating button + modal (replaces inline search bar) ============ */
.dash-search-modal-overlay{position:fixed;inset:0;background:rgba(5,10,20,.72);backdrop-filter:blur(2px);z-index:1200;display:none;align-items:flex-start;justify-content:center;padding:80px 20px 20px;}
.dash-search-modal-overlay.show{display:flex;}
.dash-search-modal{position:relative;width:100%;max-width:640px;margin-top:0;}
.dash-search-modal .dash-search-wrap{margin:0;}
.dash-search-modal-close{position:absolute;top:-44px;right:0;width:34px;height:34px;border-radius:50%;border:1px solid rgba(124,92,252,.35);background:rgba(255,255,255,.06);color:var(--white);font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.dash-search-modal-close:hover{background:rgba(124,92,252,.2);border-color:var(--gold);}
@media(max-width:480px){.dash-search-modal-overlay{padding:60px 14px 14px;}.dash-search-modal-close{top:-40px;}}

/* ============ Inline Google results (Programmable Search embed) ============ */
/* ---- Full-screen web search overlay — opens when in-app search finds nothing.
   Dark, centered search page (like a search engine's own home/results page),
   covering the entire viewport so the user can search literally anything. ---- */
.google-fullscreen-overlay{position:fixed;inset:0;z-index:1400;background:#131314;display:none;flex-direction:column;overflow:hidden;}
.google-fullscreen-overlay.show{display:flex;}
.gfs-topbar{flex-shrink:0;padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top));}
.gfs-back-btn{border:none;background:rgba(255,255,255,.08);color:#e8eaed;font-family:'Poppins',sans-serif;font-size:12px;letter-spacing:.4px;padding:8px 16px;border-radius:20px;cursor:pointer;}
.gfs-back-btn:hover{background:rgba(255,255,255,.14);}
.gfs-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 16px 40px;}
.gfs-search-wrap{max-width:600px;margin:6vh auto 28px;text-align:center;}
.gfs-wordmark{font-family:'Poppins',sans-serif;font-size:38px;font-weight:700;color:#e8eaed;margin-bottom:26px;letter-spacing:-.5px;}
.gfs-search-box{display:flex;align-items:center;gap:10px;background:#303134;border:1px solid rgba(255,255,255,.12);border-radius:26px;padding:12px 20px;box-shadow:0 4px 18px rgba(0,0,0,.35);}
.gfs-search-box:focus-within{border-color:rgba(255,255,255,.3);}
.gfs-search-icon{font-size:16px;opacity:.7;flex-shrink:0;}
.gfs-search-input{flex:1;background:none;border:none;outline:none;color:#e8eaed;font-size:15px;font-family:'DM Sans',sans-serif;}
.gfs-search-input::placeholder{color:rgba(255,255,255,.45);}
.gfs-search-clear{border:none;background:none;color:rgba(255,255,255,.5);font-size:13px;cursor:pointer;flex-shrink:0;}
.gfs-search-actions{margin-top:20px;}
.gfs-results{max-width:820px;margin:0 auto;color:#e8eaed;font-size:13px;}
.gfs-results-loading{padding:30px 4px;text-align:center;color:rgba(255,255,255,.55);font-size:12.5px;}

/* ============ Bottom nav (WhatsApp/Instagram style, mobile only) ============ */
.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;z-index:140;background:linear-gradient(180deg,rgba(20,23,15,.92),rgba(8,17,31,.99));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid rgba(124,92,252,.22);box-shadow:0 -10px 28px rgba(0,0,0,.4);padding-bottom:env(safe-area-inset-bottom);}
/* Desktop fallback: if the user collapses the sidebar on a laptop, show the bottom nav
   so there's always a way to navigate/reopen it, instead of leaving the screen with no nav at all. */
body.desktop-nav-fallback .bottom-nav{display:block;}
body.desktop-nav-fallback .app-shell{padding-bottom:74px;}
body.desktop-nav-fallback .bottom-nav-inner{max-width:460px;}
.bottom-nav::before{content:'';display:block;height:2px;background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);opacity:.6;}
.bottom-nav-inner{display:flex;justify-content:space-around;align-items:stretch;max-width:520px;margin:0 auto;}
.bottom-nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:none;border:none;color:var(--muted);font-family:'Poppins',sans-serif;font-size:9.5px;letter-spacing:.5px;text-transform:uppercase;padding:8px 4px 7px;cursor:pointer;transition:color .2s;position:relative;}
.bottom-nav-btn .bn-icon{font-size:21px;line-height:1;transition:transform .22s cubic-bezier(.4,0,.2,1);}
.bottom-nav-btn.active{color:var(--white);font-weight:700;}
.bottom-nav-btn.active .bn-icon{transform:translateY(-3px);filter:drop-shadow(0 2px 8px rgba(124,92,252,.5));}
.bottom-nav-btn.active::after{content:'';position:absolute;top:2px;left:50%;transform:translateX(-50%);width:26px;height:3px;border-radius:8px;background:linear-gradient(90deg,var(--gold-dim),var(--gold-light));}
html[data-theme="light"] .bottom-nav{background:linear-gradient(180deg,#ffffff,#ffffff 90%);}
.back-to-dashboard-btn{display:none;align-items:center;justify-content:center;gap:7px;position:fixed;top:14px;left:68px;z-index:150;background:rgba(35,40,26,.95);border:1px solid rgba(124,92,252,.35);color:var(--fixed-light);height:44px;padding:0 16px;border-radius:16px;font-family:'Poppins',sans-serif;font-size:11px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35);transition:all .2s;}
.back-to-dashboard-btn:hover{background:rgba(124,92,252,.16);border-color:var(--gold);}
.back-to-dashboard-btn.show{display:flex;}
@media(max-width:480px){.back-to-dashboard-btn{padding:0 12px;font-size:10px;}.back-to-dashboard-btn span.label{display:none;}}

/* "More" sub-navigation: professional card-grid selector, replacing the old pill tab bar */
.more-nav-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:26px;}
.more-nav-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 10px;border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(124,92,252,.18);color:var(--off-white);font-family:'Poppins',sans-serif;font-size:10.5px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);}
.more-nav-card .icon{font-size:22px;}
.more-nav-card:hover{border-color:var(--gold);color:var(--white);transform:translateY(-2px);background:rgba(124,92,252,.08);}
.more-nav-card.active{background:var(--gold);color:var(--on-gold);border-color:var(--gold);font-weight:700;}

/* Quick Access grid on the dashboard — surfaces every feature prominently */
.quick-access-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:28px;}
.qa-card{display:flex;flex-direction:column;gap:6px;padding:18px 16px;border-radius:16px;background:linear-gradient(160deg,rgba(124,92,252,.08),rgba(255,255,255,.02)),var(--navy-mid);border:1px solid rgba(124,92,252,.2);cursor:pointer;transition:all .22s cubic-bezier(.4,0,.2,1);text-align:left;position:relative;z-index:1;}
.qa-card:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.25);}
.qa-card .qa-icon{font-size:24px;}
.qa-card .qa-title{font-family:'Space Grotesk',sans-serif;font-size:17px;letter-spacing:1px;color:var(--white);}
.qa-card .qa-desc{font-family:'Poppins',sans-serif;font-size:10px;color:var(--desc-text);line-height:1.5;}

/* Live AI Interview — camera + voice mock interview */
.li-video-wrap{position:relative;width:100%;max-width:520px;margin:0 auto 18px;border-radius:18px;overflow:hidden;border:1px solid rgba(124,92,252,.3);background:#000;box-shadow:0 12px 30px rgba(0,0,0,.4);}
.li-video-wrap video{width:100%;display:block;aspect-ratio:4/3;object-fit:cover;transform:scaleX(-1);background:#000;}
.li-rec-badge{position:absolute;top:10px;left:10px;background:rgba(225,29,72,.85);color:#fff;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1px;padding:4px 10px;border-radius:20px;display:flex;align-items:center;gap:5px;animation:liPulse 1.4s infinite;}
@keyframes liPulse{0%,100%{opacity:1;}50%{opacity:.35;}}
.li-face-guide{position:absolute;inset:12% 26%;border:2px dashed rgba(167,139,250,.4);border-radius:50%;pointer-events:none;}
.li-question-box{background:linear-gradient(160deg,rgba(124,92,252,.1),rgba(255,255,255,.02));border:1px solid rgba(124,92,252,.25);border-radius:16px;padding:16px 18px;max-width:520px;margin:0 auto;}
.li-q-label{font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:2px;color:var(--white);text-transform:uppercase;margin-bottom:8px;}
.li-q-text{font-family:'Inter',sans-serif;font-size:15px;color:var(--white);line-height:1.6;min-height:48px;}
.li-progress-track{max-width:520px;margin:14px auto 0;height:6px;border-radius:10px;background:rgba(255,255,255,.06);overflow:hidden;}
.li-progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--gold),var(--gold-light));transition:width .2s linear;}
.li-mistake-item{padding:12px 14px;border-radius:14px;border-left:3px solid var(--warning);background:rgba(243,156,18,.08);font-size:12.5px;color:var(--off-white);line-height:1.6;}
.li-mistake-item.good{border-left-color:var(--success);background:rgba(5,150,105,.08);}
.md-item{padding:12px 14px;border-radius:14px;margin-bottom:8px;font-size:12.5px;line-height:1.6;color:var(--off-white);}
.md-item b{display:block;color:var(--white);margin-bottom:3px;font-size:13px;}
.md-item.merit{border-left:3px solid var(--success);background:rgba(5,150,105,.08);}
.md-item.demerit{border-left:3px solid var(--warning);background:rgba(243,156,18,.08);}

.section{display:none;padding:36px 20px;max-width:1200px;margin:0 auto;}
.section.active{display:block;animation:sectionFadeIn .35s cubic-bezier(.2,.8,.2,1);}
@keyframes sectionFadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
.section-header{position:relative;margin-bottom:28px;padding-left:18px;border-left:none;}
.section-header::before{content:'';position:absolute;left:0;top:2px;bottom:2px;width:4px;border-radius:8px;background:linear-gradient(180deg,var(--gold-light),var(--gold-dim));box-shadow:0 0 10px rgba(124,92,252,.35);}
.section-header h2{font-family:'Space Grotesk',sans-serif;font-size:36px;letter-spacing:4px;color:var(--white);text-shadow:0 0 24px rgba(124,92,252,.2);}
.section-header p{color:var(--desc-text);font-size:13px;letter-spacing:1px;margin-top:4px;}

.progress-dashboard{position:relative;background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1px solid rgba(124,92,252,.2);border-radius:20px;padding:26px 24px 24px;margin-bottom:28px;box-shadow:0 20px 48px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.03);overflow:hidden;}
.progress-dashboard::before{content:'';position:absolute;top:0;left:22px;right:22px;height:1px;background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);opacity:.8;}
.progress-dashboard::after{content:'';position:absolute;top:-60%;right:-15%;width:320px;height:320px;background:radial-gradient(circle,rgba(124,92,252,.09),transparent 70%);pointer-events:none;}
.progress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;flex-wrap:wrap;gap:12px;position:relative;z-index:1;}
.progress-header h3{font-family:'Space Grotesk',sans-serif;font-size:22px;letter-spacing:2px;color:var(--white);}
.current-day-info{text-align:right;background:linear-gradient(150deg,rgba(124,92,252,.14),rgba(124,92,252,.05));padding:10px 18px;border-radius:16px;border:1px solid rgba(124,92,252,.25);box-shadow:0 4px 14px rgba(124,92,252,.08);}
.current-day-info .day-number{font-family:'Space Grotesk',sans-serif;font-size:30px;color:var(--white);line-height:1;text-shadow:0 0 16px rgba(124,92,252,.3);}
.current-day-info .day-label{font-family:'Poppins',sans-serif;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;}


.overall-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:22px;}
.stat-box{position:relative;background:linear-gradient(160deg,rgba(255,255,255,.045),rgba(255,255,255,.012));border:1px solid rgba(124,92,252,.18);border-radius:18px;padding:16px 14px;text-align:center;transition:all .25s cubic-bezier(.4,0,.2,1);overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.04);}
.stat-box::before{content:'';position:absolute;top:0;left:14px;right:14px;height:1px;background:linear-gradient(90deg,transparent,rgba(167,139,250,.55),transparent);}
.stat-box:hover{border-color:rgba(124,92,252,.4);background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.28),0 0 0 1px rgba(124,92,252,.1);}
.stat-icon{font-size:16px;opacity:.85;margin-bottom:4px;}
.stat-number{font-family:'Space Grotesk',sans-serif;font-size:28px;color:var(--white);line-height:1;margin-bottom:4px;text-shadow:0 0 18px rgba(124,92,252,.25);}
.stat-label{font-family:'Poppins',sans-serif;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;}
.stat-box.pulse-update{animation:statPulse .5s cubic-bezier(.3,0,.2,1);}
@keyframes statPulse{0%{transform:scale(1);}35%{transform:scale(1.08);box-shadow:0 0 0 4px rgba(124,92,252,.18),0 12px 28px rgba(0,0,0,.3);}100%{transform:scale(1);}}
.stat-icon{display:inline-block;animation:iconFloat 3.2s ease-in-out infinite;}
.stat-box:nth-child(2) .stat-icon{animation-delay:.3s;}
.stat-box:nth-child(3) .stat-icon{animation-delay:.6s;}
.stat-box:nth-child(4) .stat-icon{animation-delay:.9s;}
@keyframes iconFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-3px);}}

/* ===================== Motivation banner (rotating words/quotes) ===================== */
.motivation-banner{position:relative;background:linear-gradient(120deg,#212A4D 0%,#151A33 45%,#1c2f52 100%);background-size:220% 220%;animation:gradientDrift 9s ease infinite;border:1px solid rgba(124,92,252,.28);border-radius:20px;padding:20px 22px;margin-bottom:20px;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.3);}
@keyframes gradientDrift{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
.motivation-banner::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(167,139,250,.55) 1px,transparent 1px);background-size:26px 26px;opacity:.06;pointer-events:none;}
.motivation-banner .mb-label{font-family:'Poppins',sans-serif;font-size:9.5px;letter-spacing:3px;color:var(--white);text-transform:uppercase;opacity:.85;display:flex;align-items:center;gap:7px;margin-bottom:8px;}
.motivation-banner .mb-label .dot{width:6px;height:6px;border-radius:50%;background:var(--gold-light);animation:recPulse 1.4s infinite;}
.mb-label .ai-tag{margin-left:auto;font-size:8px;padding:2px 7px;border-radius:18px;background:rgba(167,139,250,.14);border:1px solid rgba(167,139,250,.35);color:var(--white);letter-spacing:1px;display:flex;align-items:center;gap:4px;}
.mb-label .ai-tag .ai-spin{width:7px;height:7px;border:1.5px solid rgba(167,139,250,.35);border-top-color:var(--gold-light);border-radius:50%;animation:spin .7s linear infinite;}
.motivation-quote-card{position:relative;background:linear-gradient(120deg,#151A33 0%,#212A4D 55%,#151A33 100%);background-size:220% 220%;animation:gradientDrift 11s ease infinite reverse;border:1px solid rgba(124,92,252,.24);border-radius:20px;padding:18px 22px 18px 46px;margin-bottom:20px;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.28);}
.motivation-quote-card .mq-mark{position:absolute;top:6px;left:14px;font-family:'Space Grotesk',sans-serif;font-size:52px;color:rgba(167,139,250,.28);line-height:1;user-select:none;}
.motivation-quote-card .mb-label{margin-bottom:6px;}
.motivation-quote{font-family:'Inter',sans-serif;font-style:italic;font-size:14.5px;line-height:1.6;color:var(--off-white);position:relative;z-index:1;min-height:22px;}
.motivation-quote.mq-anim{animation:mwCycle .65s cubic-bezier(.2,.8,.2,1);}
.motivation-quote.mq-loading{color:var(--muted);position:relative;overflow:hidden;}
.motivation-quote.mq-loading::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.12) 50%,transparent 70%);background-size:200% 100%;animation:shimmerSweep 1.4s ease-in-out infinite;}
.motivation-word{font-family:'Space Grotesk',sans-serif;font-size:24px;letter-spacing:1.5px;color:var(--white);min-height:32px;position:relative;z-index:1;}
.motivation-word.mw-anim{animation:mwCycle .6s cubic-bezier(.2,.8,.2,1);}
@keyframes mwCycle{0%{opacity:0;transform:translateY(10px) scale(.98);filter:blur(3px);}60%{opacity:1;filter:blur(0);}100%{opacity:1;transform:translateY(0) scale(1);}}
.motivation-sub{font-family:'Inter',sans-serif;font-size:11.5px;color:var(--off-white);opacity:.7;margin-top:5px;position:relative;z-index:1;}

/* ===================== Streak tracker ===================== */
.streak-strip{display:flex;align-items:center;gap:16px;background:rgba(255,255,255,.03);border:1px solid rgba(124,92,252,.2);border-radius:18px;padding:14px 18px;margin-bottom:20px;flex-wrap:wrap;}
.streak-flame{font-size:30px;filter:drop-shadow(0 0 8px rgba(167,139,250,.5));}
.streak-flame.alive{animation:flameFlicker 1.6s ease-in-out infinite;}
@keyframes flameFlicker{0%,100%{transform:scale(1) rotate(0deg);}25%{transform:scale(1.06) rotate(-2deg);}50%{transform:scale(.97) rotate(1deg);}75%{transform:scale(1.05) rotate(2deg);}}
.streak-info .streak-num{font-family:'Space Grotesk',sans-serif;font-size:26px;color:var(--white);line-height:1;}
.streak-info .streak-txt{font-family:'Poppins',sans-serif;font-size:9.5px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;margin-top:2px;}
.streak-dots{display:flex;gap:5px;margin-left:auto;}
.streak-dots .sd{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(124,92,252,.2);transition:all .3s;}
.streak-dots .sd.filled{background:var(--gold-light);border-color:var(--gold-light);box-shadow:0 0 8px rgba(167,139,250,.6);}

/* ===================== Achievement badges ===================== */
.badge-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px;margin-bottom:22px;}
.ach-badge{position:relative;text-align:center;padding:14px 8px 10px;border-radius:18px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.02);opacity:.4;filter:grayscale(1);transition:all .35s cubic-bezier(.3,0,.2,1);}
.ach-badge.unlocked{opacity:1;filter:grayscale(0);border-color:rgba(124,92,252,.35);background:linear-gradient(160deg,rgba(124,92,252,.14),rgba(255,255,255,.02));box-shadow:0 8px 20px rgba(124,92,252,.12);}
.ach-badge.unlocked.just-unlocked{animation:badgePop .55s cubic-bezier(.34,1.56,.64,1);}
@keyframes badgePop{0%{transform:scale(.5) rotate(-8deg);opacity:0;}60%{transform:scale(1.15) rotate(4deg);opacity:1;}100%{transform:scale(1) rotate(0);}}
.ach-badge .ab-icon{font-size:22px;margin-bottom:6px;}
.ach-badge.unlocked .ab-icon{animation:badgeShine 2.4s ease-in-out infinite;}
@keyframes badgeShine{0%,100%{filter:drop-shadow(0 0 0 rgba(167,139,250,0));}50%{filter:drop-shadow(0 0 6px rgba(167,139,250,.7));}}
.ach-badge .ab-name{font-family:'Poppins',sans-serif;font-size:8.5px;letter-spacing:1px;text-transform:uppercase;color:var(--off-white);}
.ach-badge .ab-req{font-family:'Poppins',sans-serif;font-size:7.5px;color:var(--muted);margin-top:2px;}
.ach-badge.unlocked::after{content:'✓';position:absolute;top:5px;right:7px;font-size:9px;color:var(--white);}

/* ===================== Confetti canvas ===================== */
#dashConfettiCanvas{position:fixed;inset:0;pointer-events:none;z-index:9999;}

.progress-container{margin-bottom:22px;}
.progress-label{display:flex;justify-content:space-between;margin-bottom:8px;font-family:'Poppins',sans-serif;font-size:11px;color:var(--muted);}
.progress-bar{background:rgba(255,255,255,.05);height:11px;border-radius:14px;overflow:hidden;border:1px solid rgba(124,92,252,.1);}
.progress-fill{position:relative;height:100%;background:linear-gradient(90deg,var(--gold-dim),var(--gold-light));border-radius:14px;width:0%;transition:width .5s cubic-bezier(.2,.8,.2,1);overflow:hidden;}
.progress-fill::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.45) 50%,transparent 80%);background-size:200% 100%;animation:shimmerSweep 2.6s ease-in-out infinite;}
@keyframes shimmerSweep{0%{background-position:160% 0;}100%{background-position:-60% 0;}}

.daily-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:7px;margin-bottom:22px;}
.daily-cell{aspect-ratio:1;border-radius:14px;border:1px solid rgba(124,92,252,.2);display:flex;align-items:center;justify-content:center;font-family:'Poppins',sans-serif;font-size:10px;font-weight:600;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);background:rgba(255,255,255,.02);position:relative;}
.daily-cell:hover{border-color:var(--gold);background:rgba(124,92,252,.12);transform:translateY(-1px);}
.daily-cell.locked{background:rgba(225,29,72,.08);color:var(--muted);cursor:pointer;}
.daily-cell.locked::before{content:'🔒';position:absolute;font-size:9px;top:1px;right:2px;}
.daily-cell.completed{background:rgba(5,150,105,.3);color:var(--rest-light);border-color:var(--rest-light);}
.daily-cell.completed::after{content:'✓';font-size:14px;}
.daily-cell.current{background:rgba(124,92,252,.3);color:var(--white);border-color:var(--gold);box-shadow:0 0 12px rgba(124,92,252,.35);}

.weekly-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:22px;}
.week-card{background:rgba(255,255,255,.02);border:1px solid rgba(124,92,252,.15);border-radius:14px;padding:14px;transition:all .2s;}
.week-card:hover{border-color:rgba(124,92,252,.3);}
.week-card h4{font-family:'Space Grotesk',sans-serif;font-size:15px;letter-spacing:2px;color:var(--white);margin-bottom:10px;}
.week-progress{font-family:'Poppins',sans-serif;font-size:11px;color:var(--off-white);margin-bottom:6px;}
.week-bar{height:6px;background:rgba(255,255,255,.05);border-radius:8px;overflow:hidden;margin-bottom:6px;}
.week-bar-fill{height:100%;background:linear-gradient(90deg,var(--psych-light),var(--gold-light));border-radius:8px;transition:width .5s cubic-bezier(.2,.8,.2,1);}

.btn-group{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap;}
.btn{padding:11px 20px;border:none;border-radius:14px;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);}
.btn-primary{background:linear-gradient(150deg,var(--gold-light),var(--gold));color:var(--on-gold);font-weight:600;}
.btn-primary:hover{box-shadow:0 6px 18px rgba(124,92,252,.35);transform:translateY(-1px);}
.btn-secondary{background:transparent;border:1px solid var(--gold);color:var(--white);}
.btn-secondary:hover{background:rgba(124,92,252,.1);transform:translateY(-1px);}
.btn-danger{background:rgba(225,29,72,.3);color:var(--gto-light);border:1px solid var(--gto-light);}
.btn-danger:hover{background:rgba(225,29,72,.5);transform:translateY(-1px);}
.btn-premium{background:linear-gradient(90deg,var(--gold-dim),var(--gold-light));color:var(--on-gold);font-weight:700;}
.btn-premium:hover{box-shadow:0 6px 18px rgba(124,92,252,.4);transform:translateY(-1px);}
.btn:active{transform:translateY(0) scale(.98);}

.premium-banner{background:linear-gradient(120deg,rgba(124,92,252,.18),rgba(124,92,252,.05));border:1px solid var(--gold);border-radius:16px;padding:20px;margin-bottom:24px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;box-shadow:0 8px 24px rgba(124,92,252,.08);}
.premium-banner h3{font-family:'Space Grotesk',sans-serif;font-size:20px;letter-spacing:2px;color:var(--white);margin-bottom:6px;}
.premium-banner p{color:var(--off-white);font-size:12px;max-width:480px;}

.day-card{background:var(--navy-mid);border:1px solid rgba(124,92,252,.15);border-radius:14px;margin-bottom:18px;overflow:hidden;transition:transform .2s cubic-bezier(.4,0,.2,1),box-shadow .2s,border-color .2s;position:relative;}
.day-card:hover{transform:translateY(-2px);box-shadow:0 10px 32px rgba(0,0,0,.4);border-color:rgba(124,92,252,.3);}
.day-card.locked-card .day-header{cursor:pointer;}
.day-header{display:flex;align-items:center;gap:14px;padding:15px 18px;background:rgba(124,92,252,.07);border-bottom:1px solid rgba(124,92,252,.12);cursor:pointer;user-select:none;}
.day-num{font-family:'Space Grotesk',sans-serif;font-size:34px;line-height:1;color:var(--white);min-width:54px;}
.day-title{flex:1;}
.day-title h3{font-family:'Space Grotesk',sans-serif;font-size:18px;letter-spacing:3px;color:var(--white);}
.day-title .day-focus{font-family:'Poppins',sans-serif;font-size:10px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;margin-top:2px;}
.day-toggle{width:26px;height:26px;border-radius:50%;border:1px solid var(--gold-dim);display:flex;align-items:center;justify-content:center;color:var(--white);font-size:15px;transition:transform .25s cubic-bezier(.4,0,.2,1);flex-shrink:0;}
.day-card.open .day-toggle{transform:rotate(45deg);}
.day-body{display:none;padding:18px;}
.day-card.open .day-body{display:block;animation:sectionFadeIn .3s cubic-bezier(.2,.8,.2,1);}
.lock-overlay{display:flex;align-items:center;gap:10px;padding:14px 18px;background:rgba(225,29,72,.08);color:#ff9a8a;font-family:'Poppins',sans-serif;font-size:11px;letter-spacing:1px;}
.lock-overlay span.icon{font-size:18px;}

.session{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:14px;padding:15px;margin-bottom:14px;transition:border-color .2s;}
.session:hover{border-color:rgba(124,92,252,.18);}
.session-time{font-family:'Poppins',sans-serif;font-size:10px;color:var(--white);text-transform:uppercase;margin-bottom:8px;}
.session-content h4{font-family:'Space Grotesk',sans-serif;font-size:15px;letter-spacing:2px;color:var(--white);margin-bottom:10px;}
.stype{display:inline-block;padding:4px 10px;border-radius:8px;font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:1px;text-transform:uppercase;font-weight:600;margin-bottom:8px;}
.stype.physical{background:rgba(5,150,105,.25);color:var(--physical-light);}
.stype.psych{background:rgba(37,99,235,.25);color:var(--psych-light);}
.stype.academic{background:rgba(124,58,237,.25);color:var(--academic-light);}
.stype.gto{background:rgba(225,29,72,.25);color:var(--gto-light);}
.stype.rest{background:rgba(5,150,105,.25);color:var(--rest-light);}

.task-row{display:flex;align-items:flex-start;gap:10px;padding:7px 0;color:var(--off-white);cursor:pointer;}
.task-row:hover{opacity:.8;}
.task-cb{width:19px;height:19px;border:1px solid var(--gold-dim);border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s;margin-top:1px;}
.task-cb:hover{border-color:var(--gold);background:rgba(124,92,252,.1);}
.task-cb.checked{background:var(--gold);color:var(--on-gold);border-color:var(--gold);}
.task-cb.checked::after{content:'✓';font-weight:bold;font-size:11px;}
.task-text{flex:1;}
.task-row.done .task-text{text-decoration:line-through;opacity:.6;}
.task-row{justify-content:space-between;flex-wrap:wrap;}
.task-go-btn{padding:4px 10px;font-size:10px;letter-spacing:.5px;white-space:nowrap;margin-left:auto;}

.test-panel{background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1px solid rgba(124,92,252,.2);border-radius:16px;padding:22px;margin-bottom:18px;box-shadow:0 8px 24px rgba(0,0,0,.2);}
.test-title{font-family:'Space Grotesk',sans-serif;font-size:24px;letter-spacing:3px;color:var(--white);margin-bottom:8px;}

.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.78);backdrop-filter:blur(3px);z-index:1000;align-items:center;justify-content:center;padding:16px;}
.modal.show{display:flex;animation:modalFadeIn .2s ease-out;}
@keyframes modalFadeIn{from{opacity:0;}to{opacity:1;}}
.modal-content{background:linear-gradient(165deg,var(--navy-mid) 0%,#10152B 100%);border:1px solid rgba(124,92,252,.25);border-radius:16px;padding:30px;max-width:560px;width:100%;max-height:88vh;overflow-y:auto;box-shadow:0 24px 70px rgba(0,0,0,.55);animation:modalSlideUp .25s cubic-bezier(.2,.8,.2,1);}
@keyframes modalSlideUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}
.modal-header{font-family:'Space Grotesk',sans-serif;font-size:22px;letter-spacing:2px;color:var(--white);margin-bottom:16px;display:flex;justify-content:space-between;align-items:center;}
.modal-close{background:none;border:none;color:var(--white);font-size:22px;cursor:pointer;transition:transform .2s;}
.modal-close:hover{transform:scale(1.15);}
.modal-text{color:var(--off-white);line-height:1.7;margin-bottom:18px;font-size:13px;}

.notes-section{background:rgba(124,92,252,.08);border:1px solid rgba(124,92,252,.15);border-radius:14px;padding:18px;margin-bottom:18px;}
.notes-title{font-family:'Space Grotesk',sans-serif;font-size:17px;letter-spacing:2px;color:var(--white);margin-bottom:12px;}
.notes-input{width:100%;background:rgba(255,255,255,.03);border:1px solid rgba(124,92,252,.2);border-radius:14px;padding:12px;color:var(--white);font-family:'Inter',sans-serif;min-height:90px;resize:vertical;margin-bottom:10px;transition:border-color .2s,box-shadow .2s;}
.notes-input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(124,92,252,.1);}

/* ===================== COMMUNITY FEED ===================== */
.stories-row{display:flex;gap:12px;overflow-x:auto;padding:4px 0 12px;scrollbar-width:none;margin-bottom:22px;}
.stories-row::-webkit-scrollbar{display:none;}
.story-bubble{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;}
.story-ring{width:62px;height:62px;border-radius:50%;padding:3px;background:linear-gradient(135deg,var(--gold-light),var(--gto-light));box-shadow:0 4px 12px rgba(124,92,252,.3);}
.story-ring.seen{background:linear-gradient(135deg,var(--muted),rgba(255,255,255,.1));}
.story-ring img,.story-ring .story-av{width:100%;height:100%;border-radius:50%;border:2px solid var(--navy);object-fit:cover;display:flex;align-items:center;justify-content:center;font-size:20px;background:var(--navy-mid);}
.story-name{font-family:'Poppins',sans-serif;font-size:9px;color:var(--muted);text-align:center;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.story-add-ring{background:linear-gradient(135deg,rgba(124,92,252,.2),rgba(124,92,252,.05));border:2px dashed var(--gold-dim);}

.post-composer{background:var(--navy-mid);border:1px solid rgba(124,92,252,.18);border-radius:18px;padding:16px;margin-bottom:20px;}
.post-composer-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.post-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--navy-light),var(--navy-mid));border:2px solid var(--gold-dim);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.post-input{flex:1;background:rgba(255,255,255,.035);border:1px solid rgba(124,92,252,.18);border-radius:20px;padding:10px 16px;color:var(--white);font-size:13px;resize:none;min-height:44px;max-height:140px;overflow-y:auto;cursor:text;}
.post-input:focus{outline:none;border-color:var(--gold);background:rgba(255,255,255,.05);}
.post-actions-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.post-action-btn{padding:7px 14px;border-radius:20px;border:1px solid rgba(124,92,252,.2);background:transparent;color:var(--muted);font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:5px;}
.post-action-btn:hover{background:rgba(124,92,252,.1);color:var(--white);border-color:var(--gold-dim);}
.post-submit-btn{margin-left:auto;padding:8px 20px;border-radius:20px;background:linear-gradient(150deg,var(--gold-light),var(--gold));color:var(--on-gold);border:none;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;font-weight:700;transition:all .2s;}
.post-submit-btn:hover{box-shadow:0 4px 14px rgba(124,92,252,.4);transform:translateY(-1px);}

.feed-post{background:var(--navy-mid);border:1px solid rgba(124,92,252,.12);border-radius:18px;margin-bottom:16px;overflow:hidden;transition:border-color .2s;}
.feed-post:hover{border-color:rgba(124,92,252,.25);}
.post-header{display:flex;align-items:center;gap:10px;padding:14px 16px 10px;}
.post-user-av{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--navy-light),var(--navy-mid));border:2px solid var(--gold-dim);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
.post-user-info{flex:1;}
.post-user-name{font-weight:600;color:var(--white);font-size:13px;}
.post-user-meta{font-family:'Poppins',sans-serif;font-size:9px;color:var(--muted);letter-spacing:1px;margin-top:2px;}
.post-badge-tag{padding:2px 8px;border-radius:18px;font-family:'Poppins',sans-serif;font-size:8px;letter-spacing:1px;background:rgba(124,92,252,.15);color:var(--white);border:1px solid rgba(124,92,252,.2);}
.post-body{padding:0 16px 12px;color:var(--off-white);font-size:13px;line-height:1.7;}
.post-body img{width:100%;border-radius:16px;margin-top:10px;max-height:400px;object-fit:cover;}
.post-reactions{display:flex;gap:6px;padding:10px 16px;border-top:1px solid rgba(255,255,255,.04);flex-wrap:wrap;}
.react-btn{padding:5px 12px;border-radius:16px;border:1px solid rgba(255,255,255,.06);background:transparent;color:var(--muted);font-size:12px;cursor:pointer;transition:all .18s;display:flex;align-items:center;gap:4px;}
.react-btn:hover,.react-btn.active{background:rgba(124,92,252,.12);border-color:rgba(124,92,252,.3);color:var(--white);}
.react-btn.liked{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.3);color:#f87171;}
.comment-section{border-top:1px solid rgba(255,255,255,.04);padding:10px 16px;}
.comment-item{display:flex;gap:8px;margin-bottom:10px;}
.comment-av{width:28px;height:28px;border-radius:50%;background:var(--navy-light);display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;border:1px solid rgba(124,92,252,.15);}
.comment-bubble{background:rgba(255,255,255,.03);border-radius:18px;padding:7px 12px;flex:1;}
.comment-author{font-weight:600;font-size:11px;color:var(--white);}
.comment-text{font-size:12px;color:var(--off-white);margin-top:2px;line-height:1.5;}
.comment-time{font-family:'Poppins',sans-serif;font-size:9px;color:var(--muted);margin-top:4px;}
.comment-input-row{display:flex;gap:8px;align-items:center;margin-top:8px;}
.comment-inp{flex:1;background:rgba(255,255,255,.03);border:1px solid rgba(124,92,252,.15);border-radius:16px;padding:8px 14px;color:var(--white);font-size:12px;}
.comment-inp:focus{outline:none;border-color:var(--gold);}
.comment-send-btn{padding:7px 14px;border-radius:16px;background:var(--gold);color:var(--on-gold);border:none;font-size:11px;cursor:pointer;font-weight:700;}

/* ===================== LEADERBOARD ===================== */
.lb-filter-row{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap;}
.lb-filter-btn{padding:8px 18px;border-radius:20px;border:1px solid rgba(124,92,252,.2);background:transparent;color:var(--muted);font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1px;cursor:pointer;transition:all .2s;}
.lb-filter-btn.active{background:var(--gold);color:var(--on-gold);border-color:var(--gold);font-weight:700;}
.lb-podium{display:flex;align-items:flex-end;justify-content:center;gap:12px;margin-bottom:28px;padding:20px;}
.lb-pod{display:flex;flex-direction:column;align-items:center;gap:8px;}
.lb-pod-av{border-radius:50%;border:3px solid var(--gold-dim);display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--navy-mid);}
.lb-pod.first .lb-pod-av{width:70px;height:70px;border-color:#ffd700;box-shadow:0 0 20px rgba(255,215,0,.35);}
.lb-pod.second .lb-pod-av{width:58px;height:58px;border-color:#c0c0c0;}
.lb-pod.third .lb-pod-av{width:52px;height:52px;border-color:#cd7f32;}
.lb-pod-name{font-family:'Poppins',sans-serif;font-size:9px;color:var(--off-white);text-align:center;max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lb-pod-score{font-family:'Space Grotesk',sans-serif;font-size:15px;color:var(--white);}
.lb-pod-crown{font-size:22px;line-height:1;}
.lb-pillar{border-radius:14px 6px 0 0;width:60px;}
.lb-pod.first .lb-pillar{height:90px;background:linear-gradient(180deg,rgba(255,215,0,.3),rgba(255,215,0,.08));}
.lb-pod.second .lb-pillar{height:65px;background:linear-gradient(180deg,rgba(192,192,192,.2),rgba(192,192,192,.05));}
.lb-pod.third .lb-pillar{height:48px;background:linear-gradient(180deg,rgba(205,127,50,.2),rgba(205,127,50,.05));}
.lb-row{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--navy-mid);border:1px solid rgba(124,92,252,.1);border-radius:16px;margin-bottom:8px;transition:all .2s;}
.lb-row:hover{border-color:rgba(124,92,252,.25);background:rgba(255,255,255,.025);}
.lb-row.me{border-color:var(--gold);background:rgba(124,92,252,.07);}
.lb-rank{font-family:'Space Grotesk',sans-serif;font-size:22px;color:var(--muted);min-width:36px;text-align:center;}
.lb-av{width:42px;height:42px;border-radius:50%;background:var(--navy-light);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;border:2px solid rgba(124,92,252,.2);}
.lb-info{flex:1;}
.lb-username{font-weight:600;color:var(--white);font-size:13px;}
.lb-sub{font-family:'Poppins',sans-serif;font-size:9px;color:var(--muted);margin-top:2px;}


/* ===================== PROFILE ===================== */
.profile-cover{height:140px;background:linear-gradient(135deg,var(--navy-light),var(--navy-mid));border-radius:18px 10px 0 0;position:relative;overflow:hidden;}
.profile-cover::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(45deg,transparent,transparent 20px,rgba(124,92,252,.04) 20px,rgba(124,92,252,.04) 21px);}
.profile-card{background:var(--navy-mid);border:1px solid rgba(124,92,252,.15);border-radius:18px;overflow:hidden;margin-bottom:20px;}
.profile-info-row{display:flex;align-items:flex-end;gap:14px;padding:0 20px;margin-top:-28px;margin-bottom:16px;}
.profile-av-big{width:80px;height:80px;border-radius:50%;border:4px solid var(--navy-mid);background:linear-gradient(135deg,var(--navy-light),var(--gold-dim));display:flex;align-items:center;justify-content:center;font-size:34px;flex-shrink:0;box-shadow:0 4px 16px rgba(0,0,0,.4);}
.profile-name{font-family:'Space Grotesk',sans-serif;font-size:26px;letter-spacing:2px;color:var(--white);}
.profile-handle{font-family:'Poppins',sans-serif;font-size:10px;color:var(--muted);letter-spacing:1px;}
.profile-stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border-top:1px solid rgba(124,92,252,.1);}
.profile-stat{text-align:center;padding:14px 8px;border-right:1px solid rgba(124,92,252,.08);}
.profile-stat:last-child{border-right:none;}
.profile-stat-n{font-family:'Space Grotesk',sans-serif;font-size:24px;color:var(--white);}
.profile-stat-l{font-family:'Poppins',sans-serif;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;}


/* ===================== NOTIFICATION BELL ===================== */
.notif-bell-wrap{position:relative;display:inline-block;}
.notif-dot{position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:var(--danger);border:2px solid var(--navy);display:none;}
.notif-panel{position:fixed;top:56px;right:12px;width:320px;max-height:440px;background:var(--navy-mid);border:1px solid rgba(124,92,252,.25);border-radius:18px;box-shadow:0 16px 40px rgba(0,0,0,.55);z-index:500;overflow:hidden;display:none;flex-direction:column;}
.notif-panel.show{display:flex;}
.notif-panel-head{padding:14px 16px;border-bottom:1px solid rgba(124,92,252,.12);display:flex;justify-content:space-between;align-items:center;}
.notif-panel-title{font-family:'Space Grotesk',sans-serif;font-size:18px;letter-spacing:2px;color:var(--white);}
.notif-list{overflow-y:auto;flex:1;}
.notif-item{display:flex;gap:10px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.03);cursor:pointer;transition:background .15s;}
.notif-item:hover{background:rgba(255,255,255,.03);}
.notif-item.unread{background:rgba(124,92,252,.05);}
.notif-item-icon{font-size:20px;flex-shrink:0;margin-top:2px;}
.notif-item-text{flex:1;font-size:12px;color:var(--off-white);line-height:1.5;}
.notif-item-time{font-family:'Poppins',sans-serif;font-size:9px;color:var(--muted);margin-top:4px;}



/* ===================== STORY VIEWER ===================== */
.story-viewer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.94);z-index:8000;display:none;align-items:center;justify-content:center;}
.story-viewer-overlay.show{display:flex;}
.story-viewer-card{width:min(380px,96vw);background:linear-gradient(165deg,var(--navy-mid),var(--navy));border-radius:16px;overflow:hidden;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.7);}
.story-progress-bar{height:3px;background:rgba(255,255,255,.15);margin:0 4px;}
.story-progress-fill{height:100%;background:var(--gold);border-radius:8px;transition:width linear;}
.story-header{display:flex;align-items:center;gap:10px;padding:14px 16px 8px;}
.story-body{padding:20px 20px 28px;min-height:300px;display:flex;flex-direction:column;justify-content:center;}
.story-body h3{font-family:'Space Grotesk',sans-serif;font-size:28px;letter-spacing:2px;color:var(--white);margin-bottom:10px;}
.story-body p{color:var(--off-white);font-size:14px;line-height:1.8;}
.story-close-btn{position:absolute;top:12px;right:14px;background:rgba(0,0,0,.4);border:none;color:#fff;font-size:18px;width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;}

@media(max-width:768px){
  .lb-podium{gap:6px;padding:12px 6px;}
  .lb-pod.first .lb-pod-av{width:58px;height:58px;}
  .notif-panel{width:calc(100vw - 24px);right:12px;}
}

footer{text-align:center;padding:22px;font-family:'Poppins',sans-serif;font-size:10px;color:var(--muted);letter-spacing:2px;border-top:1px solid rgba(124,92,252,.1);margin-top:36px;}
.pay-step .num{font-family:'Space Grotesk',sans-serif;font-size:20px;color:var(--white);min-width:28px;}
.pay-number-box{background:rgba(5,150,105,.12);border:1px solid var(--rest-light);border-radius:14px;padding:14px;text-align:center;margin-bottom:16px;}
.pay-number-box .num-label{font-family:'Poppins',sans-serif;font-size:10px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;}
.pay-number-box .num-value{font-family:'Space Grotesk',sans-serif;font-size:26px;color:var(--rest-light);letter-spacing:2px;margin-top:4px;}
.copy-btn{background:transparent;border:1px solid var(--rest-light);color:var(--rest-light);padding:4px 10px;border-radius:10px;font-size:10px;cursor:pointer;margin-top:8px;font-family:'Poppins',sans-serif;transition:all .2s;}
.copy-btn:hover{background:rgba(5,150,105,.15);}

.admin-table{width:100%;border-collapse:collapse;margin-top:14px;font-size:12px;}
.admin-table th{text-align:left;padding:8px;background:rgba(124,92,252,.1);color:var(--white);font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1px;text-transform:uppercase;}
.admin-table td{padding:8px;border-bottom:1px solid rgba(255,255,255,.05);color:var(--off-white);}
.admin-table tr{transition:background .15s;}
.admin-table tr:hover{background:rgba(255,255,255,.025);}
.code-tag{font-family:'Poppins',sans-serif;background:rgba(124,92,252,.15);padding:3px 8px;border-radius:10px;color:var(--white);letter-spacing:1px;}
.status-used{color:var(--muted);}
.status-active{color:var(--rest-light);}

.loading-spin{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.2);border-top-color:var(--gold);border-radius:50%;animation:spin 0.7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

.command-task{background:rgba(255,255,255,.02);border-left:3px solid var(--gto-light);border-radius:10px;padding:14px;margin-bottom:12px;transition:background .2s;}
.command-task:hover{background:rgba(255,255,255,.035);}
.command-task h5{color:var(--gto-light);font-family:'Space Grotesk',sans-serif;font-size:16px;letter-spacing:2px;margin-bottom:6px;}
.command-task p{color:var(--off-white);font-size:12px;line-height:1.7;}

.mech-option{display:block;background:rgba(255,255,255,.03);border:1px solid rgba(124,92,252,.2);border-radius:14px;padding:10px 12px;color:var(--off-white);font-size:13px;cursor:pointer;transition:border-color .15s,background .15s;}
.mech-option:hover{background:rgba(255,255,255,.06);}
.mech-option.selected{border-color:var(--gold);background:rgba(124,92,252,.12);color:var(--white);}

.obstacle-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:10px;}
.obstacle-card{background:rgba(255,255,255,.02);border:1px solid rgba(5,150,105,.25);border-radius:16px;padding:14px;transition:background .2s;}
.obstacle-card:hover{background:rgba(255,255,255,.045);}
.obstacle-card .obstacle-svg-wrap{border-radius:14px;overflow:hidden;border:1px solid rgba(5,150,105,.2);margin-bottom:10px;}
.obstacle-card .obstacle-svg-wrap img{width:100%;height:140px;object-fit:cover;display:block;}
.obstacle-card h5{color:var(--physical-light);font-family:'Space Grotesk',sans-serif;font-size:16px;letter-spacing:2px;margin-bottom:6px;}
.obstacle-card p{color:var(--off-white);font-size:12px;line-height:1.6;margin-bottom:4px;}
.obstacle-card .obstacle-tag{display:inline-block;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-top:6px;}

.bio-table{width:100%;border-collapse:collapse;margin:10px 0;font-size:11px;}
.bio-table th,.bio-table td{border:1px solid rgba(124,92,252,.2);padding:8px;color:var(--off-white);text-align:left;}
.bio-table th{background:rgba(124,92,252,.1);color:var(--white);font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:1px;text-transform:uppercase;}
.bio-table input{width:100%;background:transparent;border:none;color:var(--white);font-size:11px;}
.bio-table input:focus{outline:none;background:rgba(124,92,252,.08);}

.sct-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.sct-num{font-family:'Poppins',sans-serif;font-size:11px;color:var(--white);min-width:28px;}
.sct-stub{font-size:12px;color:var(--off-white);min-width:160px;}
.sct-fill{flex:1;background:rgba(255,255,255,.03);border:none;border-bottom:1px solid rgba(124,92,252,.3);color:var(--white);padding:4px 8px;font-size:12px;}
.sct-fill:focus{outline:none;border-bottom-color:var(--gold);}

.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:16px 0;margin-bottom:20px;}
.admin-stat-card{background:rgba(124,92,252,.08);border:1px solid rgba(124,92,252,.2);border-radius:14px;padding:14px;text-align:center;transition:all .2s;}
.admin-stat-card:hover{border-color:rgba(124,92,252,.4);}
.admin-stat-card .stat-big{font-family:'Space Grotesk',sans-serif;font-size:32px;color:var(--white);font-weight:bold;}
.admin-stat-card .stat-label{font-family:'Poppins',sans-serif;font-size:10px;color:var(--muted);text-transform:uppercase;margin-top:6px;letter-spacing:1px;}

.ai-chat-container{background:rgba(255,255,255,.02);border:1px solid rgba(124,92,252,.2);border-radius:16px;height:400px;display:flex;flex-direction:column;}
.ai-chat-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;}
.ai-chat-bubble{padding:10px 14px;border-radius:18px;font-size:13px;line-height:1.6;max-width:85%;animation:sectionFadeIn .25s cubic-bezier(.2,.8,.2,1);}
.ai-chat-bubble.user{align-self:flex-end;background:rgba(124,92,252,.18);color:var(--off-white);}
.ai-chat-bubble.ai{align-self:flex-start;background:rgba(37,99,235,.15);color:var(--off-white);border:1px solid rgba(37,99,235,.3);}
@keyframes recPulse{0%,100%{opacity:1;}50%{opacity:.25;}}

/* ===================== ADMIN DASHBOARD — professional theme ===================== */
.admin-dashboard{display:none;min-height:100vh;background:#0b0f1a;color:#e2e8f0;font-family:'Inter',sans-serif;}
.admin-dashboard.show{display:block;}
.admin-topbar{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,var(--navy-mid) 0%,var(--navy) 100%);border-bottom:1px solid rgba(124,92,252,.25);box-shadow:0 1px 0 rgba(124,92,252,.15),0 8px 32px rgba(0,0,0,.4);padding:16px 28px;flex-wrap:wrap;gap:12px;position:sticky;top:0;z-index:200;backdrop-filter:blur(12px);}
.admin-topbar-brand{display:flex;align-items:center;gap:14px;}
.admin-shield{width:40px;height:40px;border-radius:18px;background:linear-gradient(145deg,var(--gold-light),var(--gold));display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:0 4px 14px rgba(124,92,252,.35);flex-shrink:0;}
.admin-topbar-title{font-family:'Space Grotesk',sans-serif;font-size:20px;letter-spacing:3px;color:var(--white);line-height:1;}
.admin-topbar-sub{font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:2px;color:#94a3b8;text-transform:uppercase;margin-top:3px;}
.admin-logout-btn{padding:8px 18px;border-radius:14px;border:1px solid rgba(239,68,68,.35);background:rgba(239,68,68,.08);color:#fca5a5;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all .2s;}
.admin-logout-btn:hover{background:rgba(239,68,68,.2);border-color:#ef4444;color:#fff;transform:translateY(-1px);}
/* ============ ADMIN SIDEBAR SHELL — real sidebar nav + search, mirrors the candidate app ============ */
.admin-shell{display:flex;align-items:stretch;position:relative;z-index:1;}
.admin-sidebar-toggle{display:flex;background:rgba(255,255,255,.05);border:1px solid rgba(124,92,252,.35);color:var(--white);width:38px;height:38px;border-radius:16px;font-size:16px;cursor:pointer;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;}
.admin-sidebar-toggle:hover{background:rgba(124,92,252,.18);}
.admin-sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:199;}
.admin-sidebar-overlay.show{display:block;}
#adminSidebar{position:sticky;top:var(--admin-topbar-h,73px);height:calc(100vh - var(--admin-topbar-h,73px));background:linear-gradient(180deg,rgba(35,40,26,.98),rgba(8,17,31,.98));transition:margin-left .28s cubic-bezier(.4,0,.2,1);}
#adminSidebar.collapsed{margin-left:-264px;}
.admin-main{flex:1;min-width:0;}
.admin-body{padding:28px 24px;max-width:1280px;margin:0 auto;}
@media(max-width:768px){
  #adminSidebar{position:fixed;top:0;left:0;height:100vh;transform:translateX(-100%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:8px 0 24px rgba(0,0,0,.4);padding-top:24px;z-index:201;}
  #adminSidebar.open{transform:translateX(0);}
  .admin-body{padding:20px 14px;}
}
.admin-tabpanel{display:none;}
.admin-tabpanel.active{display:block;animation:sectionFadeIn .3s cubic-bezier(.2,.8,.2,1);}
.admin-section-title{font-family:'Space Grotesk',sans-serif;font-size:22px;letter-spacing:3px;color:#e2e8f0;padding-left:14px;margin-bottom:6px;border-left:3px solid var(--gold);}
.admin-helptext{color:#94a3b8;font-size:12px;margin-bottom:18px;line-height:1.7;}
.admin-card{background:var(--navy-mid);border:1px solid rgba(124,92,252,.18);border-radius:18px;padding:22px;margin-bottom:18px;box-shadow:0 4px 24px rgba(0,0,0,.25);}
#allDaysFreeSlider{background:rgba(220,38,38,.30);border:1px solid rgba(220,38,38,.55);box-shadow:inset 0 1px 4px rgba(0,0,0,.35);}
#allDaysFreeSlider::before{content:'OFF';position:absolute;right:7px;top:50%;transform:translateY(-50%);font-size:9px;font-weight:800;letter-spacing:.5px;color:rgba(255,255,255,.8);font-family:'DM Mono',monospace;}
#allDaysFreeToggle:checked ~ #allDaysFreeSlider{background:#22C55E;border-color:#22C55E;box-shadow:0 0 14px rgba(34,197,94,.5),inset 0 1px 4px rgba(0,0,0,.2);}
#allDaysFreeToggle:checked ~ #allDaysFreeSlider::before{content:'ON';left:8px;right:auto;color:#fff;}
#allDaysFreeKnob{box-shadow:0 2px 6px rgba(0,0,0,.45);}
#allDaysFreeToggle:checked ~ #allDaysFreeKnob{transform:translateX(30px);box-shadow:0 2px 8px rgba(34,197,94,.55);}
#initialTestToggleSlider{background:rgba(220,38,38,.30);border:1px solid rgba(220,38,38,.55);box-shadow:inset 0 1px 4px rgba(0,0,0,.35);}
#initialTestToggleSlider::before{content:'OFF';position:absolute;right:7px;top:50%;transform:translateY(-50%);font-size:9px;font-weight:800;letter-spacing:.5px;color:rgba(255,255,255,.8);font-family:'DM Mono',monospace;}
#initialTestToggle:checked ~ #initialTestToggleSlider{background:#22C55E;border-color:#22C55E;box-shadow:0 0 14px rgba(34,197,94,.5),inset 0 1px 4px rgba(0,0,0,.2);}
#initialTestToggle:checked ~ #initialTestToggleSlider::before{content:'ON';left:8px;right:auto;color:#fff;}
#initialTestToggleKnob{box-shadow:0 2px 6px rgba(0,0,0,.45);}
#initialTestToggle:checked ~ #initialTestToggleKnob{transform:translateX(30px);box-shadow:0 2px 8px rgba(34,197,94,.55);}

/* Persistent warning banner shown in the admin dashboard while "all days free"
   is active, so it's never ambiguous whether the paywall is currently live. */
.admin-all-free-banner{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:linear-gradient(90deg,rgba(34,197,94,.16),rgba(34,197,94,.06));
  border-bottom:1px solid rgba(34,197,94,.4);
  padding:10px 22px;color:#eafff1;font-size:12.5px;line-height:1.4;
}
.admin-all-free-banner .aafb-dot{
  width:9px;height:9px;border-radius:50%;background:#22C55E;flex-shrink:0;
  box-shadow:0 0 0 0 rgba(34,197,94,.6);
  animation:aafbPulse 1.6s ease-in-out infinite;
}
@keyframes aafbPulse{
  0%{box-shadow:0 0 0 0 rgba(34,197,94,.55);}
  70%{box-shadow:0 0 0 8px rgba(34,197,94,0);}
  100%{box-shadow:0 0 0 0 rgba(34,197,94,0);}
}
.admin-all-free-banner .aafb-text{flex:1;min-width:220px;}
.admin-all-free-banner .aafb-text strong{color:#fff;}
.admin-all-free-banner .aafb-jump{
  background:rgba(34,197,94,.18);border:1px solid rgba(34,197,94,.5);color:#eafff1;
  font-family:'DM Mono',monospace;font-size:10.5px;letter-spacing:.5px;text-transform:uppercase;
  padding:6px 12px;border-radius:20px;cursor:pointer;white-space:nowrap;transition:background .2s;
}
.admin-all-free-banner .aafb-jump:hover{background:rgba(34,197,94,.32);}
.admin-card:hover{border-color:rgba(124,92,252,.3);}
.admin-table-wrap{max-height:440px;overflow-y:auto;border:1px solid rgba(124,92,252,.18);border-radius:16px;}
.admin-dashboard .admin-table{margin-top:0;}
.admin-dashboard .admin-table th{background:rgba(124,92,252,.08);color:var(--white);position:sticky;top:0;font-size:9.5px;letter-spacing:1.5px;border-bottom:1px solid rgba(124,92,252,.18);}
.admin-dashboard .admin-table td{color:#e2e8f0;border-bottom:1px solid rgba(255,255,255,.04);font-size:12px;}
.admin-dashboard .admin-table tr:hover{background:rgba(124,92,252,.04);}
.admin-dashboard .admin-stat-card{background:linear-gradient(145deg,var(--navy-mid),var(--navy-light));border:1px solid rgba(124,92,252,.18);border-radius:18px;position:relative;overflow:hidden;}
.admin-dashboard .admin-stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--gold-light));opacity:.6;}
.admin-dashboard .admin-stat-card:hover{border-color:rgba(124,92,252,.4);box-shadow:0 8px 24px rgba(124,92,252,.1);}
.admin-dashboard .admin-stat-card .stat-big{color:#e2e8f0;font-size:36px;}
.admin-dashboard .admin-stat-card .stat-label{color:#94a3b8;letter-spacing:1.5px;}
.admin-dashboard .form-label{color:var(--white);font-size:9.5px;letter-spacing:2px;}
.admin-dashboard .form-input{background:rgba(255,255,255,.025);border:1px solid rgba(124,92,252,.18);color:#e2e8f0;}
.admin-dashboard .form-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(124,92,252,.12);}
.admin-dashboard .btn-primary{background:linear-gradient(150deg,var(--gold-light),var(--gold));color:var(--on-gold);border:none;}
.admin-dashboard .btn-primary:hover{box-shadow:0 6px 18px rgba(124,92,252,.4);}
.admin-dashboard .btn-secondary{border-color:rgba(124,92,252,.4);color:var(--white);}
.admin-dashboard .btn-secondary:hover{background:rgba(124,92,252,.1);}
.admin-dashboard .btn-danger{background:rgba(239,68,68,.12);color:#fca5a5;border-color:rgba(239,68,68,.35);}
.admin-dashboard .btn-danger:hover{background:rgba(239,68,68,.25);}
.admin-dashboard .code-tag{background:rgba(124,92,252,.12);color:var(--white);border:1px solid rgba(124,92,252,.25);}
.admin-dashboard .status-active{color:#22c55e;}
.admin-dashboard .status-used{color:#64748b;}
.admin-dashboard ::-webkit-scrollbar-thumb{background:rgba(124,92,252,.3);}
.admin-dashboard ::-webkit-scrollbar-thumb:hover{background:rgba(124,92,252,.5);}
.admin-dashboard .ai-chat-container{border-color:rgba(124,92,252,.18);background:rgba(255,255,255,.015);}
.admin-dashboard .ai-chat-bubble.user{background:rgba(124,92,252,.18);}
.admin-dashboard .ai-chat-bubble.ai{background:rgba(124,92,252,.08);border-color:rgba(124,92,252,.2);}
.admin-dashboard .notes-input{background:rgba(255,255,255,.025);border-color:rgba(124,92,252,.18);color:#e2e8f0;}
.admin-dashboard .notes-input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(124,92,252,.1);}

/* ===================== ADMIN DASHBOARD — premium animated polish ===================== */
.admin-dashboard{position:relative;overflow-x:hidden;}
.admin-dashboard::before,.admin-dashboard::after{content:'';position:fixed;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0;opacity:.5;}
.admin-dashboard::before{top:-160px;right:-120px;width:420px;height:420px;background:radial-gradient(circle,rgba(124,92,252,.22),transparent 70%);animation:adminBlobFloat1 16s ease-in-out infinite;}
.admin-dashboard::after{bottom:-180px;left:-140px;width:460px;height:460px;background:radial-gradient(circle,rgba(37,99,235,.16),transparent 70%);animation:adminBlobFloat2 20s ease-in-out infinite;}
@keyframes adminBlobFloat1{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-40px,50px) scale(1.15);}}
@keyframes adminBlobFloat2{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(50px,-30px) scale(1.1);}}
.admin-topbar,.admin-tabbar,.admin-body{position:relative;z-index:1;}

.admin-topbar{animation:adminSlideDown .5s cubic-bezier(.2,.8,.2,1);overflow:hidden;}
.admin-topbar::after{content:'';position:absolute;top:0;left:-40%;width:35%;height:100%;background:linear-gradient(100deg,transparent,rgba(124,92,252,.12),transparent);animation:adminTopbarSheen 6s ease-in-out infinite;pointer-events:none;}
@keyframes adminTopbarSheen{0%{left:-40%;}50%{left:120%;}100%{left:120%;}}
@keyframes adminSlideDown{from{opacity:0;transform:translateY(-14px);}to{opacity:1;transform:translateY(0);}}
.admin-shield{position:relative;animation:adminShieldPulse 2.6s ease-in-out infinite;}
.admin-shield::after{content:'';position:absolute;inset:-4px;border-radius:20px;border:1px solid rgba(124,92,252,.5);animation:adminShieldRing 2.6s ease-in-out infinite;}
@keyframes adminShieldPulse{0%,100%{box-shadow:0 4px 14px rgba(124,92,252,.35);}50%{box-shadow:0 4px 26px rgba(124,92,252,.65);}}
@keyframes adminShieldRing{0%{transform:scale(1);opacity:.7;}70%{transform:scale(1.25);opacity:0;}100%{opacity:0;}}
.admin-topbar-title{background:linear-gradient(90deg,var(--gold-light) 0%,#fff 50%,var(--gold-light) 100%);background-size:220% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:adminTitleShimmer 5s linear infinite;}
@keyframes adminTitleShimmer{0%{background-position:200% center;}100%{background-position:-20% center;}}
.admin-logout-btn{position:relative;overflow:hidden;}

.admin-tabbar{position:relative;animation:adminSlideDown .5s cubic-bezier(.2,.8,.2,1) .05s backwards;}
.admin-tab-indicator{position:absolute;bottom:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--gold-light));border-radius:8px 2px 0 0;box-shadow:0 0 10px rgba(124,92,252,.7);transition:left .32s cubic-bezier(.4,0,.2,1),width .32s cubic-bezier(.4,0,.2,1);pointer-events:none;}
.admin-tab-btn{position:relative;}
.admin-tab-btn.active{animation:adminTabPop .32s cubic-bezier(.34,1.56,.64,1);}
@keyframes adminTabPop{0%{transform:scale(.94);}60%{transform:scale(1.04);}100%{transform:scale(1);}}
#adminNotifBadge,#adminChatBadge{animation:adminBadgePulse 1.6s ease-in-out infinite;}
@keyframes adminBadgePulse{0%,100%{transform:scale(1);}50%{transform:scale(1.18);}}

.admin-stat-card,.admin-card{animation:adminCardEnter .5s cubic-bezier(.2,.8,.2,1) backwards;}
.admin-stats-grid .admin-stat-card:nth-child(1){animation-delay:.03s;}
.admin-stats-grid .admin-stat-card:nth-child(2){animation-delay:.08s;}
.admin-stats-grid .admin-stat-card:nth-child(3){animation-delay:.13s;}
.admin-stats-grid .admin-stat-card:nth-child(4){animation-delay:.18s;}
.admin-stats-grid .admin-stat-card:nth-child(5){animation-delay:.23s;}
.admin-stats-grid .admin-stat-card:nth-child(6){animation-delay:.28s;}
.admin-tabpanel .admin-card:nth-of-type(1){animation-delay:.04s;}
.admin-tabpanel .admin-card:nth-of-type(2){animation-delay:.1s;}
.admin-tabpanel .admin-card:nth-of-type(3){animation-delay:.16s;}
.admin-tabpanel .admin-card:nth-of-type(4){animation-delay:.22s;}
@keyframes adminCardEnter{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
.admin-stat-card{overflow:hidden;}
.admin-stat-card::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.08),transparent);transition:left .6s ease;pointer-events:none;}
.admin-stat-card:hover::after{left:130%;}
.admin-stat-card .stat-big{transition:transform .2s;}
.admin-stat-card:hover .stat-big{transform:scale(1.08);}
.admin-dashboard .btn-primary,.admin-dashboard .btn-secondary{position:relative;overflow:hidden;}
.admin-dashboard .btn-primary::after,.admin-dashboard .btn-secondary::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transition:left .5s ease;pointer-events:none;}
.admin-dashboard .btn-primary:hover::after,.admin-dashboard .btn-secondary:hover::after{left:130%;}
.admin-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),var(--gold-light),var(--gold),transparent);background-size:200% auto;animation:adminCardBorderShimmer 4s linear infinite;opacity:.7;}
@keyframes adminCardBorderShimmer{0%{background-position:200% center;}100%{background-position:-20% center;}}
.admin-card{position:relative;}

@media(prefers-reduced-motion:reduce){
  .admin-dashboard::before,.admin-dashboard::after,.admin-shield,.admin-shield::after,.admin-topbar-title,.admin-topbar::after,.admin-card::before,#adminNotifBadge,#adminChatBadge{animation:none;}
}


.media-preview{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:8px;margin-top:10px;}
.media-thumb{width:80px;height:80px;border-radius:14px;object-fit:cover;border:1px solid rgba(124,92,252,.2);cursor:pointer;transition:transform .2s,border-color .2s;}
.media-thumb:hover{transform:scale(1.05);border-color:var(--gold);}

/* ===================== THEME TOGGLE ===================== */
.theme-toggle-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:20px;font-family:'Poppins',sans-serif;font-size:10px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;border:1px solid var(--gold-dim);background:rgba(255,255,255,.02);color:var(--white);transition:all .25s cubic-bezier(.4,0,.2,1);line-height:1.3;}
.theme-toggle-btn:hover{background:rgba(124,92,252,.16);border-color:var(--gold);transform:translateY(-1px);}
.theme-toggle-btn .tt-icon{font-size:13px;line-height:1;}

body,.hero,.gate-screen,.gate-card,.progress-dashboard,.day-card,.session,.test-panel,.modal-content,.notes-section,.premium-banner,.stat-box,.week-card,.admin-card{transition:background .35s ease,background-color .35s ease,border-color .35s ease,box-shadow .35s ease,color .35s ease;}

/* Light theme: re-tone surfaces that were authored with literal white/black overlays */
html[data-theme="light"] body{background:var(--navy);}
html[data-theme="light"] .gate-screen{background:transparent;}
html[data-theme="light"] .gate-screen::before{background-image:linear-gradient(rgba(109,63,240,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(109,63,240,.05) 1px,transparent 1px);}
html[data-theme="light"] .gate-card{background:linear-gradient(165deg,#ffffff 0%,#F0F1FA 100%);box-shadow:0 18px 50px rgba(90,66,22,.14),0 0 0 1px rgba(0,0,0,.02) inset;border-color:rgba(109,63,240,.25);}
html[data-theme="light"] .hero{background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(243,239,225,.65) 100%);box-shadow:0 1px 0 rgba(109,63,240,.2),0 8px 28px rgba(90,66,22,.08);}
html[data-theme="light"] .sidebar{background:linear-gradient(180deg,#ffffff,#F0F1FA);box-shadow:4px 0 16px rgba(90,66,22,.06);}
html[data-theme="light"] .progress-dashboard,html[data-theme="light"] .test-panel,html[data-theme="light"] .modal-content,html[data-theme="light"] .settings-card{background:linear-gradient(165deg,#ffffff 0%,#F0F1FA 100%);box-shadow:0 8px 28px rgba(90,66,22,.1);}
html[data-theme="light"] .day-card{background:#ffffff;}
html[data-theme="light"] .day-card:hover{box-shadow:0 10px 32px rgba(90,66,22,.16);}
html[data-theme="light"] .session,html[data-theme="light"] .week-card,html[data-theme="light"] .stat-box,html[data-theme="light"] .command-task,html[data-theme="light"] .admin-card{background:rgba(0,0,0,.025);}
html[data-theme="light"] .command-task:hover{background:rgba(0,0,0,.04);}
html[data-theme="light"] .stat-box:hover{background:rgba(0,0,0,.045);border-color:rgba(109,63,240,.35);}
html[data-theme="light"] .form-input,html[data-theme="light"] .form-select,html[data-theme="light"] .notes-input,html[data-theme="light"] .ai-chat-container,html[data-theme="light"] .pay-step,html[data-theme="light"] .sct-fill{background:rgba(0,0,0,.03);}
html[data-theme="light"] .form-input:focus,html[data-theme="light"] .form-select:focus{background:rgba(0,0,0,.045);}
html[data-theme="light"] .daily-cell,html[data-theme="light"] .more-nav-card,html[data-theme="light"] .progress-bar,html[data-theme="light"] .week-bar,html[data-theme="light"] .pill-btn,html[data-theme="light"] .gate-badges .badge{background:rgba(0,0,0,.03);}
html[data-theme="light"] .loading-spin{border-color:rgba(0,0,0,.15);border-top-color:var(--gold);}
html[data-theme="light"] ::-webkit-scrollbar-track{background:rgba(0,0,0,.03);}
html[data-theme="light"] .modal{background:rgba(20,15,5,.45);}
html[data-theme="light"] .whatsapp-float{box-shadow:0 4px 12px rgba(0,0,0,.18);}
html[data-theme="light"] .auth-toggle{background:rgba(0,0,0,.04);}
html[data-theme="light"] .admin-table td{color:var(--off-white);}
html[data-theme="light"] .admin-table tr:hover{background:rgba(0,0,0,.025);}
html[data-theme="light"] .premium-banner{background:linear-gradient(120deg,rgba(109,63,240,.12),rgba(109,63,240,.03));box-shadow:0 8px 24px rgba(90,66,22,.06);}
html[data-theme="light"] .motivation-banner{background:linear-gradient(120deg,#F0F1FA 0%,#ffffff 45%,#EEF0FB 100%);background-size:220% 220%;box-shadow:0 8px 28px rgba(90,66,22,.08);}
html[data-theme="light"] .motivation-quote-card{background:linear-gradient(120deg,#ffffff 0%,#F0F1FA 55%,#ffffff 100%);background-size:220% 220%;box-shadow:0 8px 28px rgba(90,66,22,.08);}
html[data-theme="light"] .hero h1{text-shadow:0 0 40px rgba(109,63,240,.15);}
html[data-theme="light"] .gate-card::after{border-color:rgba(109,63,240,.12);}
html[data-theme="light"] .pill-btn{color:var(--white);background:rgba(0,0,0,.035);}
html[data-theme="light"] .pill-btn.admin-active{background:rgba(225,29,72,.12);color:#a4291b;}
html[data-theme="light"] .theme-toggle-btn{background:rgba(0,0,0,.035);}
/* Admin dashboard intentionally keeps its dedicated dark theme regardless of the candidate-facing toggle */

@media(max-width:768px){
  .hero{padding:30px 16px;background:linear-gradient(180deg,rgba(20,23,15,.3) 0%,rgba(20,23,15,.6) 100%);}.daily-grid{grid-template-columns:repeat(auto-fill,minmax(34px,1fr));}
  .overall-stats{grid-template-columns:repeat(2,1fr);}.day-header{flex-wrap:wrap;}.day-title{flex-basis:100%;}
  .gate-card{padding:28px 20px;}.sct-row{flex-wrap:wrap;}.sct-stub{min-width:100%;}
  .ai-chat-bubble{max-width:95%;}
  .sidebar-toggle{display:none;}
  .back-to-dashboard-btn{left:14px;}
  .sidebar{position:fixed;top:0;left:0;height:100vh;transform:translateX(-100%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:8px 0 24px rgba(0,0,0,.4);padding-top:24px;}
  .sidebar.open{transform:translateX(0);}
  .quick-access-grid{grid-template-columns:repeat(auto-fit,minmax(135px,1fr));}
  .bottom-nav{display:block;}
  .app-shell{padding-bottom:74px;}
  body{padding-bottom:env(safe-area-inset-bottom);}
  .whatsapp-float{bottom:calc(88px + env(safe-area-inset-bottom));}
  #aiFloatingBtn{bottom:calc(154px + env(safe-area-inset-bottom)) !important;}
}

/* =====================================================================
   ISSB PREP — V2 "AURORA" VIBRANT UI LAYER
   A from-scratch visual language layered on top of the original rules
   above. Every class name used by the app's JS is preserved 1:1 — only
   look & feel changes: gradient-mesh backgrounds, glassmorphism cards,
   pill-shaped gradient buttons, punchy category colors, soft glow
   shadows, springy micro-animations, bigger rounded corners.
   ===================================================================== */

/* ---------- Global surface + gradient mesh ---------- */
body{
  background:
    radial-gradient(1200px 800px at 8% -8%, rgba(124,92,252,.35), transparent 55%),
    radial-gradient(1000px 700px at 108% 0%, rgba(236,72,153,.28), transparent 55%),
    radial-gradient(900px 700px at 50% 115%, rgba(6,182,212,.22), transparent 55%),
    var(--navy) !important;
  background-attachment:fixed;
}
html[data-theme="light"] body{
  background:
    radial-gradient(1200px 800px at 8% -8%, rgba(124,92,252,.14), transparent 55%),
    radial-gradient(1000px 700px at 108% 0%, rgba(236,72,153,.10), transparent 55%),
    radial-gradient(900px 700px at 50% 115%, rgba(6,182,212,.10), transparent 55%),
    var(--navy) !important;
}
body::before{opacity:.5;}

::selection{background:linear-gradient(90deg,var(--gold),var(--accent2));color:#fff;}

/* ---------- Typography polish ---------- */
h1,h2,h3,h4,.hero h1,.gate-logo h1,.section-header h2,.progress-header h3,.current-day-info .day-number,
.settings-card h4,.week-card h4,.stat-number,.streak-info .streak-num{
  font-family:'Space Grotesk',sans-serif !important;
  letter-spacing:.5px !important;
}
.gate-logo h1{
  background:linear-gradient(90deg,var(--gold-light),var(--accent2),var(--accent3));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  letter-spacing:2px !important;
}
.hero h1{
  background:linear-gradient(100deg,var(--gold-light) 0%,var(--accent2-light) 50%,var(--accent3-light) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:none !important;
}
.section-header::before{background:linear-gradient(180deg,var(--gold-light),var(--accent2)) !important;box-shadow:0 0 14px rgba(124,92,252,.5) !important;}

/* ---------- Buttons: bold gradient pills with glow ---------- */
.gate-btn,.btn-primary,.btn-premium,.pill-btn.premium{
  background:linear-gradient(120deg,var(--gold) 0%,var(--accent2) 55%,var(--gold) 100%) !important;
  background-size:200% auto;
  color:#fff !important;
  border-radius:999px !important;
  box-shadow:0 8px 24px rgba(124,92,252,.4),0 2px 8px rgba(236,72,153,.25) !important;
  border:none !important;
  transition:background-position .5s ease,transform .18s ease,box-shadow .18s ease !important;
}
.gate-btn:hover,.btn-primary:hover,.btn-premium:hover,.pill-btn.premium:hover{
  background-position:100% center !important;
  transform:translateY(-2px) scale(1.015) !important;
  box-shadow:0 12px 32px rgba(124,92,252,.5),0 4px 14px rgba(236,72,153,.35) !important;
}
.btn,.pill-btn,.theme-toggle-btn,.social-btn,.auth-toggle-btn,.gate-btn,.btn-primary,.btn-secondary,.btn-danger,.btn-premium{
  border-radius:999px !important;
  font-family:'Poppins',sans-serif !important;
  font-weight:600 !important;
}
.btn-secondary{
  background:rgba(124,92,252,.08) !important;
  border:1.5px solid var(--gold) !important;
  color:var(--gold-light) !important;
}
html[data-theme="light"] .btn-secondary{color:var(--gold) !important;}
.btn-secondary:hover{background:rgba(124,92,252,.16) !important;transform:translateY(-2px) !important;}
.btn-danger{
  background:linear-gradient(120deg,#F43F5E,#EF4444) !important;
  color:#fff !important;border:none !important;
}
.social-btn,.auth-toggle-btn:not(.is-active),.theme-toggle-btn{
  border:1.5px solid rgba(124,92,252,.25) !important;
}
.auth-toggle{border-radius:999px !important;}
.auth-toggle-btn.is-active{
  background:linear-gradient(120deg,var(--gold),var(--accent2)) !important;
  color:#fff !important;border-radius:999px !important;
  box-shadow:0 6px 18px rgba(124,92,252,.4) !important;
}
.pill-btn.admin-active{background:linear-gradient(120deg,#F43F5E,#EF4444) !important;color:#fff !important;border:none !important;}

/* ---------- Glassmorphism cards ---------- */
.gate-card,.settings-card,.progress-dashboard,.day-card,.week-card,.stat-box,.streak-strip,
.motivation-banner,.motivation-quote-card,.premium-banner,.ach-badge,.admin-card,.admin-stat-card,
.dash-search-box,.dash-search-panel,.modal-content{
  background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015)) !important;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:22px !important;
  box-shadow:0 16px 40px rgba(10,10,30,.35),inset 0 1px 0 rgba(255,255,255,.06) !important;
}
html[data-theme="light"] .gate-card,html[data-theme="light"] .settings-card,html[data-theme="light"] .progress-dashboard,
html[data-theme="light"] .day-card,html[data-theme="light"] .week-card,html[data-theme="light"] .stat-box,
html[data-theme="light"] .streak-strip,html[data-theme="light"] .premium-banner,html[data-theme="light"] .modal-content,
html[data-theme="light"] .admin-card{
  background:linear-gradient(160deg,rgba(124,92,252,.06),rgba(255,255,255,.9)) !important;
  border:1px solid rgba(124,92,252,.14) !important;
  box-shadow:0 12px 30px rgba(80,60,160,.10) !important;
}
.day-card:hover,.week-card:hover,.stat-box:hover{
  transform:translateY(-4px) !important;
  border-color:rgba(124,92,252,.4) !important;
  box-shadow:0 20px 46px rgba(124,92,252,.22) !important;
}
.gate-card::before,.progress-dashboard::before{
  background:linear-gradient(90deg,transparent,var(--gold-light) 20%,var(--accent2) 50%,var(--accent3) 80%,transparent) !important;
  height:2px !important;opacity:.9;
}

/* ---------- Category color pops (badges, borders) ---------- */
.badge.phys{background:rgba(5,150,105,.18) !important;color:var(--physical-light) !important;border:1px solid var(--physical) !important;}
.badge.gto{background:rgba(225,29,72,.18) !important;color:var(--gto-light) !important;border:1px solid var(--gto) !important;}
.badge.psy{background:rgba(37,99,235,.18) !important;color:var(--psych-light) !important;border:1px solid var(--psych) !important;}
.badge.acad{background:rgba(124,58,237,.18) !important;color:var(--academic-light) !important;border:1px solid var(--academic) !important;}
.badge,.gate-badges .badge{border-radius:999px !important;font-family:'Poppins',sans-serif !important;}

/* ---------- Progress bars: vivid gradient fills ---------- */
.progress-bar,.week-bar,.li-progress-track{border-radius:999px !important;overflow:hidden;}
.progress-fill,.li-progress-fill{
  background:linear-gradient(90deg,var(--gold),var(--accent2),var(--accent3)) !important;
  border-radius:999px !important;
}
.week-bar-fill{background:linear-gradient(90deg,var(--psych-light),var(--accent2)) !important;border-radius:999px !important;}
.daily-cell{border-radius:12px !important;}
.daily-cell.completed{background:linear-gradient(150deg,rgba(52,211,153,.35),rgba(5,150,105,.25)) !important;border-color:var(--physical-light) !important;color:#fff !important;}
.daily-cell.current{background:linear-gradient(150deg,rgba(124,92,252,.4),rgba(236,72,153,.3)) !important;border-color:var(--gold-light) !important;box-shadow:0 0 16px rgba(124,92,252,.5) !important;}

/* ---------- Sidebar / nav ---------- */
.sidebar{
  background:linear-gradient(180deg,rgba(21,26,51,.98),rgba(10,14,31,.98)) !important;
  border-right:1px solid rgba(124,92,252,.18) !important;
  backdrop-filter:blur(14px);
}
html[data-theme="light"] .sidebar{background:linear-gradient(180deg,#ffffff,#F6F7FC) !important;}
.nav-btn{border-radius:0 999px 999px 0 !important;margin-right:10px;}
.nav-btn.active{
  background:linear-gradient(90deg,rgba(124,92,252,.25),rgba(236,72,153,.08)) !important;
  border-left-color:var(--gold-light) !important;
  box-shadow:inset 0 0 0 1px rgba(124,92,252,.15);
}
.nav-btn:hover{background:rgba(124,92,252,.12) !important;}

/* ---------- Streak / achievement flair ---------- */
.streak-dots .sd.filled{background:linear-gradient(120deg,var(--gold-light),var(--accent2)) !important;box-shadow:0 0 10px rgba(124,92,252,.6) !important;}
.ach-badge.unlocked{
  background:linear-gradient(160deg,rgba(124,92,252,.18),rgba(236,72,153,.06)) !important;
  border-color:rgba(124,92,252,.4) !important;
}

/* ---------- Hero polish ---------- */
.hero{
  background:linear-gradient(180deg,rgba(124,92,252,.08) 0%,rgba(10,14,31,.5) 100%) !important;
  border-bottom:1px solid rgba(124,92,252,.25) !important;
}
.hero-badges .badge{border-radius:999px !important;}

/* ---------- Motion: soft, springy ---------- */
.gate-card,.day-card,.stat-box,.week-card,.ach-badge{transition:transform .25s cubic-bezier(.2,.9,.25,1.2),box-shadow .25s ease,border-color .25s ease !important;}

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--gold),var(--accent2)) !important;}

/* ---------- Whatsapp float / small icons keep brand color but round more ---------- */
.whatsapp-float{box-shadow:0 8px 22px rgba(37,211,102,.35) !important;}

/* ---------- Focus rings ---------- */
.form-input:focus,.form-select:focus,.dash-search-input:focus{
  box-shadow:0 0 0 3px rgba(124,92,252,.22) !important;
}

/* =====================================================================
   ISSB PREP — V3 "AMBIENT / 2030" LAYER
   Direction: liquid-glass depth, bento-style density, glow-based
   hierarchy instead of flat color fills, floating capsule navigation,
   near-black OLED canvas, kinetic type, minimal chrome. Same class
   names as always — zero functional change, pure visual evolution.
   ===================================================================== */

:root{
  --amb-bg:#050609;
  --amb-glass:rgba(255,255,255,.045);
  --amb-glass-strong:rgba(255,255,255,.08);
  --amb-border:rgba(255,255,255,.09);
  --amb-glow-a:#8B5CFF;   /* violet */
  --amb-glow-b:#00E5C7;   /* bioluminescent teal */
  --amb-glow-c:#FF3EA5;   /* magenta */
}
html[data-theme="light"]{
  --amb-bg:#F3F4FA;
  --amb-glass:rgba(20,20,40,.035);
  --amb-glass-strong:rgba(20,20,40,.06);
  --amb-border:rgba(20,20,40,.10);
}

/* ---------- Canvas: near-black with slow ambient aurora ---------- */
body{
  background:var(--amb-bg) !important;
  background-image:
    radial-gradient(900px 600px at 12% -6%, rgba(139,92,255,.20), transparent 60%),
    radial-gradient(800px 600px at 100% 8%, rgba(0,229,199,.14), transparent 60%),
    radial-gradient(900px 700px at 40% 118%, rgba(255,62,165,.14), transparent 60%) !important;
  background-attachment:fixed;
}
html[data-theme="light"] body{
  background-image:
    radial-gradient(900px 600px at 12% -6%, rgba(139,92,255,.10), transparent 60%),
    radial-gradient(800px 600px at 100% 8%, rgba(0,229,199,.08), transparent 60%),
    radial-gradient(900px 700px at 40% 118%, rgba(255,62,165,.08), transparent 60%) !important;
}
body::before{display:none !important;}

/* ---------- Type: tighter, kinetic, display-forward ---------- */
h1,h2,h3,h4,.hero h1,.gate-logo h1,.section-header h2,.progress-header h3,
.current-day-info .day-number,.settings-card h4,.week-card h4,.stat-number,
.streak-info .streak-num{
  font-family:'Space Grotesk',sans-serif !important;
  letter-spacing:-.02em !important;
  font-weight:600 !important;
}
.stat-number,.current-day-info .day-number{font-weight:700 !important;letter-spacing:-.03em !important;}

/* ---------- Liquid glass surface for every card ---------- */
.gate-card,.settings-card,.progress-dashboard,.day-card,.week-card,.stat-box,.streak-strip,
.motivation-banner,.motivation-quote-card,.premium-banner,.ach-badge,.admin-card,.admin-stat-card,
.dash-search-box,.dash-search-panel,.modal-content{
  background:var(--amb-glass) !important;
  backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
  border:1px solid var(--amb-border) !important;
  border-radius:28px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.06) inset,
    0 24px 60px rgba(0,0,0,.5) !important;
}
html[data-theme="light"] .gate-card,html[data-theme="light"] .settings-card,html[data-theme="light"] .progress-dashboard,
html[data-theme="light"] .day-card,html[data-theme="light"] .week-card,html[data-theme="light"] .stat-box,
html[data-theme="light"] .streak-strip,html[data-theme="light"] .premium-banner,html[data-theme="light"] .modal-content,
html[data-theme="light"] .admin-card{
  background:var(--amb-glass) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 18px 40px rgba(60,50,120,.10) !important;
}
.day-card:hover,.week-card:hover,.stat-box:hover{
  transform:translateY(-3px) !important;
  border-color:rgba(139,92,255,.45) !important;
  box-shadow:0 0 0 1px rgba(139,92,255,.25),0 24px 60px rgba(139,92,255,.18) !important;
}

/* ---------- Glow-based accents instead of flat fills ---------- */
.gate-btn,.btn-primary,.btn-premium,.pill-btn.premium{
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  color:#fff !important;
  border-radius:999px !important;
  position:relative;
  box-shadow:0 0 0 1px rgba(139,92,255,.35),0 0 26px rgba(139,92,255,.35) !important;
  transition:box-shadow .25s ease,transform .18s ease,background .25s ease !important;
}
.gate-btn:hover,.btn-primary:hover,.btn-premium:hover,.pill-btn.premium:hover{
  background:rgba(255,255,255,.1) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 0 0 1px rgba(0,229,199,.5),0 0 40px rgba(0,229,199,.45) !important;
}
.btn,.pill-btn,.theme-toggle-btn,.social-btn,.auth-toggle-btn{
  border-radius:999px !important;
  font-family:'Poppins',sans-serif !important;
}
.btn-secondary{background:rgba(255,255,255,.04) !important;border:1px solid var(--amb-border) !important;color:#fff !important;}
.badge,.gate-badges .badge{border-radius:999px !important;background:rgba(255,255,255,.05) !important;border:1px solid var(--amb-border) !important;}
.badge.phys{box-shadow:inset 0 0 0 1px rgba(0,229,199,.35);color:#5EEAD4 !important;}
.badge.gto{box-shadow:inset 0 0 0 1px rgba(255,62,165,.35);color:#FF8FC7 !important;}
.badge.psy{box-shadow:inset 0 0 0 1px rgba(96,165,250,.35);color:#93C5FD !important;}
.badge.acad{box-shadow:inset 0 0 0 1px rgba(139,92,255,.4);color:#C4B5FD !important;}

/* ---------- Progress: thin glowing line, not a bar ---------- */
.progress-bar,.week-bar{background:rgba(255,255,255,.06) !important;height:6px !important;border-radius:999px !important;}
.progress-fill,.week-bar-fill{
  background:linear-gradient(90deg,var(--amb-glow-a),var(--amb-glow-b),var(--amb-glow-c)) !important;
  box-shadow:0 0 12px rgba(139,92,255,.6) !important;
  border-radius:999px !important;
}
.daily-cell{border-radius:14px !important;background:rgba(255,255,255,.04) !important;}
.daily-cell.completed{background:rgba(0,229,199,.12) !important;border-color:rgba(0,229,199,.4) !important;box-shadow:0 0 14px rgba(0,229,199,.25) !important;}
.daily-cell.current{background:rgba(139,92,255,.14) !important;border-color:rgba(139,92,255,.5) !important;box-shadow:0 0 16px rgba(139,92,255,.4) !important;}

/* ---------- Sidebar → slim glass rail ---------- */
.sidebar{
  background:rgba(5,6,9,.6) !important;
  backdrop-filter:blur(24px);
  border-right:1px solid var(--amb-border) !important;
}
html[data-theme="light"] .sidebar{background:rgba(255,255,255,.6) !important;}
.nav-btn{border-radius:999px !important;margin:2px 10px;width:calc(100% - 20px) !important;}
.nav-btn.active{
  background:rgba(139,92,255,.14) !important;
  border-left-color:transparent !important;
  box-shadow:inset 0 0 0 1px rgba(139,92,255,.4),0 0 20px rgba(139,92,255,.15) !important;
}
.nav-btn:hover{background:rgba(255,255,255,.05) !important;}

/* ---------- Headline gradient text with glow ---------- */
.gate-logo h1,.hero h1{
  background:linear-gradient(100deg,#fff 0%,var(--amb-glow-a) 45%,var(--amb-glow-b) 75%,var(--amb-glow-c) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 22px rgba(139,92,255,.35));
}
.section-header::before{background:linear-gradient(180deg,var(--amb-glow-a),var(--amb-glow-b)) !important;box-shadow:0 0 16px rgba(139,92,255,.5) !important;}

/* ---------- Streak / achievements: soft bioluminescent glow ---------- */
.streak-flame{filter:drop-shadow(0 0 10px rgba(255,62,165,.55)) !important;}
.streak-dots .sd.filled{background:var(--amb-glow-b) !important;box-shadow:0 0 10px rgba(0,229,199,.7) !important;}
.ach-badge.unlocked{background:rgba(139,92,255,.08) !important;border-color:rgba(139,92,255,.35) !important;box-shadow:0 0 18px rgba(139,92,255,.15) !important;}

/* ---------- Motion ---------- */
.gate-card,.day-card,.stat-box,.week-card,.ach-badge{transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease,border-color .3s ease !important;}

::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--amb-glow-a),var(--amb-glow-b)) !important;}
.form-input:focus,.form-select:focus,.dash-search-input:focus{
  box-shadow:0 0 0 1px rgba(139,92,255,.5),0 0 20px rgba(139,92,255,.25) !important;
}

/* =====================================================================
   PERF FIX — scroll jank was caused by backdrop-filter blur (28px) being
   applied via the layers above to every repeating card (day-card,
   stat-box, week-card, ach-badge, admin-card, feed posts, etc). Backdrop
   blur forces the browser to re-sample everything behind each element on
   every scroll frame — with 30 day-cards + stat boxes + a live animated
   canvas behind them, that's extremely expensive and reads as "slow to
   load" while scrolling. This block removes blur from repeated list
   items only (kept on one-off overlays like modals/sidebar/bottom-nav),
   and lets the browser skip offscreen work entirely via content-visibility.
   ===================================================================== */
.day-card,.week-card,.stat-box,.ach-badge,.admin-card,.admin-stat-card,
.feed-post,.session,.lb-row,.command-task,.obstacle-card,.mech-option,
.notif-item,.qa-card{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Let the browser skip layout/paint for cards that are off-screen — this
   is the main win for "instant" scrolling through long lists (30-day plan,
   community feed, leaderboard, GTO/mechanical task lists). */
.day-card,.feed-post,.session,.lb-row,.notif-item{
  content-visibility:auto;
  contain-intrinsic-size:auto 260px;
}
.week-card,.stat-box,.ach-badge{
  content-visibility:auto;
  contain-intrinsic-size:auto 120px;
}

/* Hover-lift transforms were also firing on touch (tap) devices, forcing
   a layout/paint pass mid-scroll. Restrict them to devices that actually
   have a hover-capable pointer (mouse/trackpad). */
@media (hover:none){
  .day-card:hover,.week-card:hover,.stat-box:hover{
    transform:none !important;
    box-shadow:inherit !important;
  }
}

/* =====================================================================
   LIGHT THEME CONTRAST FIX
   The Ambient/2030 glass layer above (rgba(255,255,255,.03-.10) glass
   fills, white button text, pastel neon badge colors, white-origin
   gradient headline) was tuned for a near-black canvas. On the light
   theme's near-white canvas those same values are nearly invisible —
   white text on white glass, 3.5% tinted cards that vanish into the
   page, pastel badges with no contrast. This block restores real
   contrast for light mode only, without touching dark mode at all.
   ===================================================================== */
html[data-theme="light"]{
  --amb-glass:rgba(255,255,255,.82);
  --amb-glass-strong:rgba(255,255,255,.92);
  --amb-border:rgba(20,20,40,.12);
}
html[data-theme="light"] .gate-card,html[data-theme="light"] .settings-card,html[data-theme="light"] .progress-dashboard,
html[data-theme="light"] .day-card,html[data-theme="light"] .week-card,html[data-theme="light"] .stat-box,
html[data-theme="light"] .streak-strip,html[data-theme="light"] .premium-banner,html[data-theme="light"] .modal-content,
html[data-theme="light"] .admin-card,html[data-theme="light"] .test-panel,html[data-theme="light"] .session,
html[data-theme="light"] .dash-search-box,html[data-theme="light"] .dash-search-panel{
  background:var(--amb-glass) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 10px 28px rgba(40,30,80,.10) !important;
}
html[data-theme="light"] .modal-content{background:var(--amb-glass-strong) !important;}
html[data-theme="light"] .gate-btn,html[data-theme="light"] .btn-primary,html[data-theme="light"] .btn-premium,
html[data-theme="light"] .pill-btn.premium,html[data-theme="light"] .task-go-btn{
  background:linear-gradient(150deg,var(--gold-light),var(--gold)) !important;
  border:1px solid rgba(109,63,240,.35) !important;
  color:#fff !important;
  box-shadow:0 4px 16px rgba(109,63,240,.30) !important;
}
html[data-theme="light"] .gate-btn:hover,html[data-theme="light"] .btn-primary:hover,
html[data-theme="light"] .btn-premium:hover,html[data-theme="light"] .pill-btn.premium:hover{
  box-shadow:0 6px 22px rgba(109,63,240,.4) !important;
}
html[data-theme="light"] .btn-secondary{
  background:rgba(109,63,240,.08) !important;
  border:1px solid rgba(109,63,240,.3) !important;
  color:var(--gold) !important;
}
html[data-theme="light"] .badge,html[data-theme="light"] .gate-badges .badge{
  background:rgba(20,20,40,.05) !important;
  border:1px solid rgba(20,20,40,.12) !important;
}
html[data-theme="light"] .badge.phys{color:var(--physical-light) !important;}
html[data-theme="light"] .badge.gto{color:var(--gto-light) !important;}
html[data-theme="light"] .badge.psy{color:var(--psych-light) !important;}
html[data-theme="light"] .badge.acad{color:var(--academic-light) !important;}
html[data-theme="light"] .gate-logo h1,html[data-theme="light"] .hero h1{
  background:none !important;
  -webkit-background-clip:initial !important;background-clip:initial !important;
  -webkit-text-fill-color:var(--gold) !important;color:var(--gold) !important;
  filter:none !important;text-shadow:none !important;
}
html[data-theme="light"] .gate-logo h1 span,html[data-theme="light"] .hero h1 span{
  color:#0891B2 !important;-webkit-text-fill-color:#0891B2 !important;
}
html[data-theme="light"] .sidebar{background:rgba(255,255,255,.92) !important;}
html[data-theme="light"] .nav-btn.active{
  background:rgba(109,63,240,.10) !important;
  box-shadow:inset 0 0 0 1px rgba(109,63,240,.3) !important;
}
html[data-theme="light"] .nav-btn:hover{background:rgba(20,20,40,.04) !important;}
html[data-theme="light"] .form-input,html[data-theme="light"] .form-select,html[data-theme="light"] .notes-input{
  background:rgba(20,20,40,.04) !important;
  color:var(--white) !important;
}
html[data-theme="light"] .day-card,html[data-theme="light"] .week-card,html[data-theme="light"] .stat-box,
html[data-theme="light"] .session{border:1px solid rgba(20,20,40,.08) !important;}
html[data-theme="light"] .hero{
  background:linear-gradient(180deg,rgba(124,92,252,.07) 0%,rgba(243,239,225,.55) 100%) !important;
  border-bottom:1px solid rgba(109,63,240,.18) !important;
}
html[data-theme="light"] body::before{opacity:1 !important;}

/* ===================== "DASHING" UPGRADE PACK — added, nothing above removed =====================
   1) Animated circular progress ring around the Completion stat
   2) Extra hero polish (glow pulse, floating entrance, animated badge shimmer)
   3) Global micro-interactions (card lift, button ripple-ish feedback, staggered fade-ins)
   All additive — existing classes/behaviour untouched. */

/* ---- 1) Progress ring ---- */
.progress-ring-wrap{position:relative;width:74px;height:74px;margin:0 auto 8px;}
.progress-ring-wrap svg{width:100%;height:100%;transform:rotate(-90deg);}
.progress-ring-track{fill:none;stroke:rgba(255,255,255,.08);stroke-width:6;}
.progress-ring-fill{fill:none;stroke:url(#ringGradient);stroke-width:6;stroke-linecap:round;stroke-dasharray:207.3;stroke-dashoffset:207.3;transition:stroke-dashoffset .8s cubic-bezier(.2,.8,.2,1);}
.progress-ring-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:700;color:var(--white);}

/* ---- 2) Hero polish ---- */
.hero{animation:heroFadeIn .7s cubic-bezier(.2,.8,.2,1);}
@keyframes heroFadeIn{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:translateY(0);}}
.hero h1{animation:heroGlowPulse 4.5s ease-in-out 2;}
@keyframes heroGlowPulse{0%,100%{text-shadow:0 0 60px rgba(124,92,252,.3);}50%{text-shadow:0 0 90px rgba(124,92,252,.55),0 0 30px rgba(200,146,42,.25);}}
.hero-badges .badge{transition:transform .25s cubic-bezier(.4,0,.2,1),box-shadow .25s;}
.hero-badges .badge:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 20px rgba(124,92,252,.35);}

/* ---- 3) Global micro-interactions ---- */
.qa-card,.day-card,.stat-box,.streak-strip,.motivation-quote-card,.admin-stat-card{
  animation:cardRiseIn .5s cubic-bezier(.2,.8,.2,1) both;
}
.qa-card:nth-child(2),.day-card:nth-child(2){animation-delay:.05s;}
.qa-card:nth-child(3),.day-card:nth-child(3){animation-delay:.1s;}
.qa-card:nth-child(4),.day-card:nth-child(4){animation-delay:.15s;}
.qa-card:nth-child(5),.day-card:nth-child(5){animation-delay:.2s;}
@keyframes cardRiseIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}

.qa-card{transition:transform .25s cubic-bezier(.4,0,.2,1),box-shadow .25s,border-color .25s;}
.qa-card:hover{transform:translateY(-5px) scale(1.015);box-shadow:0 16px 34px rgba(0,0,0,.32),0 0 0 1px rgba(124,92,252,.18);}

.btn,.pill-btn,.btn-primary,.btn-secondary,.btn-danger,.btn-premium{position:relative;overflow:hidden;}
.btn::after,.pill-btn::after{content:'';position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,.35) 0%,transparent 60%);opacity:0;transform:scale(0);transition:opacity .4s,transform .4s;pointer-events:none;}
.btn:active::after,.pill-btn:active::after{opacity:1;transform:scale(1.6);transition:0s;}

.nav-btn,.admin-tab-btn{transition:background .2s,transform .15s,color .2s;}
.nav-btn:hover,.admin-tab-btn:hover{transform:translateX(3px);}

::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-thumb{background:rgba(124,92,252,.35);border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:rgba(124,92,252,.55);}

@media (prefers-reduced-motion: reduce){
  .hero,.hero h1,.feature-card,.day-card,.stat-box,.streak-strip,.motivation-quote-card,.admin-stat-card{animation:none !important;}
}

/* ---------------------------- SHORTS TAB ---------------------------- */
.section.shorts-section{padding:0;max-width:100%;}
.shorts-app{position:relative;height:calc(100dvh - 64px);max-height:calc(100dvh - 64px);display:flex;flex-direction:column;background:#000;border-radius:10px;overflow:hidden;margin:0 auto;max-width:480px;}
@media (min-width:769px){ .shorts-app{height:calc(100vh - 40px);max-height:820px;margin-top:10px;} }
.shorts-topbar{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;justify-content:center;padding:14px 12px 10px;background:linear-gradient(180deg,rgba(0,0,0,.65),transparent);}
.shorts-topbar-tabs{display:flex;gap:22px;}
.shorts-tab{background:none;border:none;color:rgba(255,255,255,.55);font-family:'Poppins',sans-serif;font-size:14px;font-weight:600;letter-spacing:.3px;padding:4px 2px;cursor:pointer;position:relative;}
.shorts-tab.active{color:#fff;}
.shorts-tab.active::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:#fff;}
.shorts-searchbar{position:absolute;top:52px;left:12px;right:12px;z-index:20;display:flex;align-items:center;gap:8px;background:rgba(20,20,20,.85);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.15);border-radius:24px;padding:8px 14px;}
.shorts-search-icon{font-size:14px;opacity:.7;}
.shorts-searchbar input{flex:1;background:none;border:none;outline:none;color:#fff;font-size:13px;font-family:'DM Sans',sans-serif;}
.shorts-searchbar input::placeholder{color:rgba(255,255,255,.45);}
.shorts-search-go{background:var(--gold);color:#fff;border:none;border-radius:50%;width:30px;height:30px;flex:0 0 30px;font-size:14px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.shorts-feed{flex:1;overflow-y:scroll;scroll-snap-type:y mandatory;scrollbar-width:none;-ms-overflow-style:none;}
.shorts-feed::-webkit-scrollbar{display:none;}
.shorts-item{position:relative;height:100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.shorts-item iframe{width:100%;height:100%;border:none;}
.shorts-item .shorts-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.75);pointer-events:none;}
.shorts-item .shorts-play-hint{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:52px;color:rgba(255,255,255,.85);text-shadow:0 4px 18px rgba(0,0,0,.5);pointer-events:none;transition:opacity .2s ease;}
.shorts-item .shorts-caption{position:absolute;left:14px;right:70px;bottom:22px;z-index:10;color:#fff;font-family:'DM Sans',sans-serif;pointer-events:none;}
.shorts-item .shorts-caption .st{font-size:13px;font-weight:600;line-height:1.35;text-shadow:0 2px 8px rgba(0,0,0,.6);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.shorts-item .shorts-caption .sc{font-size:11px;opacity:.75;margin-top:4px;}
.shorts-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:rgba(255,255,255,.7);text-align:center;padding:24px;}
.shorts-empty-icon{font-size:44px;}
.shorts-empty-text{font-family:'DM Sans',sans-serif;font-size:13px;max-width:280px;line-height:1.5;}
.shorts-back-pill{position:absolute;top:98px;left:12px;z-index:20;background:rgba(20,20,20,.8);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:6px 12px;font-size:11px;cursor:pointer;}
.shorts-loading-more{scroll-snap-align:start;height:100%;width:100%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);font-family:'DM Sans',sans-serif;font-size:13px;}

/* ---- Shorts: true full-screen mode (video fills the whole viewport, bottom nav floats
   on top as a translucent overlay instead of leaving an empty strip below the video) ----
   Applies at all screen sizes (not just mobile) so desktop also gets a real full-screen
   Shorts view instead of a boxed player with empty space around it. */
body.shorts-fullscreen{overflow:hidden;}
body.shorts-fullscreen .app-shell{padding-bottom:0;}
body.shorts-fullscreen .shorts-app{position:fixed;inset:0;width:100%;height:100dvh;max-height:100dvh;max-width:100%;margin:0;border-radius:0;z-index:135;}
body.shorts-fullscreen .shorts-topbar{padding-top:calc(14px + env(safe-area-inset-top));}
body.shorts-fullscreen .shorts-searchbar{top:calc(52px + env(safe-area-inset-top));}
body.shorts-fullscreen .bottom-nav{background:linear-gradient(180deg,rgba(10,10,10,.05),rgba(8,10,14,.72));border-top:1px solid rgba(255,255,255,.14);box-shadow:none;display:block;pointer-events:none;}
body.shorts-fullscreen .bottom-nav-btn{pointer-events:auto;}
body.shorts-fullscreen .sidebar{display:none;}
/* Chat/AI Coach bubbles otherwise float above every section (incl. Shorts) at z-index:999,
   sitting on top of the full-screen video — hide them while Shorts is open. */
body.shorts-fullscreen .whatsapp-float{display:none !important;}

/* ---- Shorts: "Videos" tab — a scrollable list of videos with real thumbnails/titles,
   tapping one opens a detail player instead of the vertical swipe feed. ---- */
.shorts-videolist{position:absolute;inset:0;top:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:64px 10px 20px;}
body.shorts-fullscreen .shorts-videolist{padding-top:calc(64px + env(safe-area-inset-top));}
.video-list-item{display:flex;gap:10px;padding:8px;border-radius:10px;cursor:pointer;transition:background .15s;}
.video-list-item:hover,.video-list-item:active{background:rgba(255,255,255,.07);}
.vli-thumb-wrap{position:relative;flex:0 0 128px;width:128px;height:72px;border-radius:8px;overflow:hidden;background:#111;}
.vli-thumb{width:100%;height:100%;object-fit:cover;display:block;}
.vli-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:19px;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.6);background:rgba(0,0,0,.12);}
.vli-info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;}
.vli-title{color:#fff;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.vli-channel{color:rgba(255,255,255,.6);font-size:11px;margin-top:4px;}

/* ---- Shorts: "Search" tab — a dedicated full search screen (styled like the main
   YouTube search page): opens on a "Try searching to get started" prompt, then shows
   results as a normal scrollable list, same look as the Videos tab list above. ---- */
.shorts-searchscreen{position:absolute;inset:0;top:0;background:#0f0f0f;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:96px 10px 20px;}
body.shorts-fullscreen .shorts-searchscreen{padding-top:calc(96px + env(safe-area-inset-top));}
.shorts-search-intro{display:flex;align-items:center;justify-content:center;min-height:60vh;padding:12px;}
.shorts-search-intro-card{width:100%;max-width:420px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:34px 22px;text-align:center;}
.ssi-title{color:#fff;font-family:'Poppins',sans-serif;font-size:17px;font-weight:700;margin-bottom:10px;}
.ssi-sub{color:rgba(255,255,255,.55);font-family:'DM Sans',sans-serif;font-size:12.5px;line-height:1.6;}
.shorts-searchlist{padding-bottom:10px;}
.shorts-searchlist .shorts-empty{position:static;height:60vh;}

/* ---- Shorts: video detail modal (proper player + title/channel, opened from the
   Videos tab) ---- */
.video-detail-modal{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;}
.video-detail-modal.show{display:flex;}
.video-detail-inner{width:100%;max-width:720px;max-height:100%;overflow-y:auto;background:#000;}
@media(min-width:769px){.video-detail-inner{border-radius:12px;overflow:hidden;}}
.video-detail-frame-wrap{position:relative;width:100%;aspect-ratio:16/9;background:#000;}
.video-detail-frame-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:none;}
.video-detail-close{position:fixed;top:calc(14px + env(safe-area-inset-top));right:14px;z-index:310;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.28);color:#fff;font-size:15px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.video-detail-meta{padding:14px 16px 20px;color:#fff;}
.video-detail-meta .vdt{font-family:'DM Sans',sans-serif;font-size:15px;font-weight:700;line-height:1.4;}
.video-detail-meta .vdc{font-size:12px;color:rgba(255,255,255,.6);margin-top:6px;}

/* ---- Admin: Shorts Topics chip editor ---- */
.shorts-topics-chips{display:flex;flex-wrap:wrap;gap:8px;}
.shorts-topic-chip{display:inline-flex;align-items:center;gap:6px;background:rgba(200,146,42,.12);border:1px solid rgba(200,146,42,.3);color:var(--off-white);border-radius:16px;padding:6px 8px 6px 12px;font-size:12px;font-family:'DM Sans',sans-serif;}
.shorts-topic-chip button{background:rgba(255,255,255,.08);border:none;color:var(--off-white);width:18px;height:18px;border-radius:50%;cursor:pointer;font-size:11px;line-height:1;display:flex;align-items:center;justify-content:center;}
.shorts-topic-chip button:hover{background:var(--danger);color:#fff;}