@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&family=Inter:wght@300;400;500;600&display=swap');

:root{
  --bg:#ffffff;--bg2:#f5f7fb;--surface:#ffffff;--surface2:#f3f5f8;
  --border:rgba(15,23,42,0.10);--border2:rgba(15,23,42,0.14);
  --accent:#d61aa3;--accent2:#ff3dbb;--accent-glow:rgba(214,26,163,0.22);
  --cyan:#0ea5e9;--blue:#2563eb;--purple:#7c3aed;--green:#16a34a;--yellow:#f59e0b;--red:#ef4444;
  --text:#111827;--text2:#374151;--muted:#6b7280;
  --font-head:'Plus Jakarta Sans',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --r-sm:10px;--r-md:16px;--r-lg:20px;--r-xl:28px;--r-2xl:36px;--r-full:999px;
  --shadow-md:0 10px 28px rgba(2,6,23,0.08);
  --shadow-lg:0 20px 60px rgba(2,6,23,0.10);
  --ease:cubic-bezier(0.25,0.46,0.45,0.94);
}

html[data-theme="dark"]{
  --bg:#070a12;--bg2:#0b1020;--surface:rgba(255,255,255,0.06);--surface2:rgba(255,255,255,0.085);
  --border:rgba(148,210,255,0.12);--border2:rgba(148,210,255,0.18);
  --text:#eaf2ff;--text2:#b7c8dc;--muted:#86a2bf;
  --shadow-md:0 10px 30px rgba(0,0,0,0.45);
  --shadow-lg:0 24px 70px rgba(0,0,0,0.55);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:100%}
body{font-family:var(--font-body);font-size:1rem;background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);color:var(--text);line-height:1.6;min-height:100vh;overflow-x:hidden;-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font:inherit;border:none;outline:none;-webkit-tap-highlight-color:transparent}
select{font:inherit}
img{max-width:100%;display:block;-webkit-user-drag:none;user-select:none}
ul,ol{list-style:none}

/* Hilangkan kotak biru tap/focus bawaan mobile */
a,button,[role="button"],input,select,textarea{-webkit-tap-highlight-color:transparent}
a:focus,button:focus,[role="button"]:focus{outline:none}
a:focus-visible,button:focus-visible,[role="button"]:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(214,26,163,0.16)}

.glass{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-md)}
.glass-strong{background:var(--surface);border:1px solid var(--border2);box-shadow:var(--shadow-lg)}
.nav-surface{position:relative;background:rgba(255,255,255,0.88);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(15,23,42,0.12);box-shadow:0 14px 38px rgba(2,6,23,0.10)}
.nav-surface::after{content:'';position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,rgba(214,26,163,0.10),rgba(255,255,255,0),rgba(37,99,235,0.08));opacity:0.9;mix-blend-mode:normal}
html[data-theme="dark"] .nav-surface{background:rgba(8,12,22,0.72);border:1px solid var(--border);box-shadow:0 10px 30px rgba(0,0,0,0.35)}

.shell{width:min(1200px,calc(100% - 40px));margin:0 auto;position:relative;z-index:1}
.shell-sm{width:min(500px,calc(100% - 40px));margin:0 auto;position:relative;z-index:1}
.shell-md{width:min(640px,calc(100% - 40px));margin:0 auto;position:relative;z-index:1}

.site-nav{position:sticky;top:0;z-index:100;padding:18px 0}
.nav-inner{border-radius:var(--r-full);padding:10px 14px 10px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:nowrap}
.brand{display:flex;align-items:center;gap:10px;flex-shrink:0}
.brand-logo{height:44px;width:auto;max-width:240px;display:block;object-fit:contain;filter:drop-shadow(0 8px 16px rgba(2,6,23,0.08))}
.nav-links{flex:1;justify-content:center;min-width:0}
.nav-links{display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:auto;scrollbar-width:none;-ms-overflow-style:none}
.nav-links::-webkit-scrollbar{display:none}
.brand-name{font-family:var(--font-head);font-weight:800;font-size:0.98rem;letter-spacing:-0.02em}
.brand-sub{display:none}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-links a{padding:9px 14px;border-radius:var(--r-full);font-size:0.9rem;font-weight:700;color:rgba(17,24,39,0.74);transition:all 200ms var(--ease);position:relative}
.nav-links a:hover{color:rgba(17,24,39,0.92);background:rgba(2,6,23,0.045);transform:translateY(-1px)}
html[data-theme="dark"] .nav-links a{color:rgba(234,242,255,0.78)}
html[data-theme="dark"] .nav-links a:hover{color:rgba(234,242,255,0.96);background:rgba(255,255,255,0.06)}
.nav-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.nav-desktop-only{display:inline-flex}

.nav-toggle{display:none;width:42px;height:42px;border-radius:var(--r-full);background:rgba(2,6,23,0.03);border:1px solid rgba(15,23,42,0.10);align-items:center;justify-content:center;transition:all 200ms var(--ease);color:rgba(17,24,39,0.78)}
.nav-toggle:hover{background:rgba(2,6,23,0.05);border-color:rgba(15,23,42,0.14);transform:translateY(-1px);color:rgba(17,24,39,0.92)}
.nav-toggle .nav-ico{width:20px;height:20px;display:block}
html[data-theme="dark"] .nav-toggle{background:rgba(255,255,255,0.06);border-color:var(--border);color:rgba(234,242,255,0.88)}
html[data-theme="dark"] .nav-toggle:hover{background:rgba(255,255,255,0.09);border-color:var(--border2);color:rgba(234,242,255,0.96)}
.nav-toggle[aria-expanded="true"]{background:rgba(214,26,163,0.10);border-color:rgba(214,26,163,0.22);color:var(--accent)}

.nav-collapse{display:none;margin-top:10px;border-radius:var(--r-xl);padding:10px;overflow:hidden}
.nav-collapse.is-open{display:block;animation:slideInRight 240ms var(--ease) both}
.nav-collapse-links{display:flex;flex-direction:column;gap:6px;padding:6px}
.nav-collapse-links a{padding:12px 14px;border-radius:var(--r-lg);font-size:0.94rem;font-weight:700;color:rgba(17,24,39,0.76);transition:all 200ms var(--ease)}
.nav-collapse-links a:hover{background:rgba(2,6,23,0.05);color:rgba(17,24,39,0.92)}
html[data-theme="dark"] .nav-collapse-links a{color:rgba(234,242,255,0.82)}
html[data-theme="dark"] .nav-collapse-links a:hover{background:rgba(255,255,255,0.08);color:rgba(234,242,255,0.96)}
.nav-collapse-actions{display:flex;flex-direction:column;gap:10px;padding:10px 6px 6px;border-top:1px solid rgba(15,23,42,0.08)}
html[data-theme="dark"] .nav-collapse-actions{border-top:1px solid rgba(148,210,255,0.12)}

.toast{position:fixed;left:50%;top:18px;transform:translateX(-50%);z-index:200;animation:toastIn 420ms var(--ease) both;pointer-events:none}
.toast-inner{display:flex;align-items:center;gap:10px;border-radius:var(--r-full);padding:10px 12px 10px 12px;min-width:min(520px,calc(100vw - 28px));max-width:min(720px,calc(100vw - 28px));pointer-events:auto}
.toast-dot{width:8px;height:8px;border-radius:999px;background:var(--accent);box-shadow:0 0 0 5px rgba(56,189,248,0.12)}
.toast-text{flex:1;font-size:0.88rem;color:var(--text2);line-height:1.45}
.toast-x{width:34px;height:34px;border-radius:999px;background:rgba(255,255,255,0.04);border:1px solid var(--border);color:var(--text2);display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:all 200ms var(--ease)}
.toast-x:hover{background:rgba(255,255,255,0.08);color:var(--text);border-color:var(--border2);transform:translateY(-1px)}
.toast-ok .toast-dot{background:var(--green);box-shadow:0 0 0 5px rgba(52,211,153,0.12)}
.toast-err .toast-dot{background:var(--red);box-shadow:0 0 0 5px rgba(248,113,113,0.14)}
.toast-info .toast-dot{background:var(--cyan);box-shadow:0 0 0 5px rgba(34,211,238,0.12)}
.toast-hide{animation:toastOut 260ms var(--ease) both}

/* Alert inline (halaman tanpa redirect) */
.alert{animation:alertSlideIn 0.45s var(--ease) both}
@keyframes alertSlideIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}

/* Halaman konten: masuk halus */
main > *:first-child{animation:pageShellIn 0.5s var(--ease) both}
@keyframes pageShellIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* Video player */
.video-wrap{position:relative;border-radius:16px;overflow:hidden}
.video-watermark{pointer-events:none;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:.18;mix-blend-mode:screen;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#fff;gap:22px;transform:rotate(-18deg);text-shadow:0 10px 26px rgba(0,0,0,.45)}
.video-watermark span{white-space:nowrap;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,0.14);background:rgba(0,0,0,0.18);backdrop-filter: blur(6px);animation: wmFloat 9s ease-in-out infinite}
.video-watermark span:nth-child(2){animation-delay:-2s;opacity:.75}
.video-watermark span:nth-child(3){animation-delay:-5s;opacity:.6}
@keyframes wmFloat{0%,100%{transform:translate3d(-14px,-8px,0)}50%{transform:translate3d(14px,8px,0)}}

/* Dropzone upload */
.dropzone{border:1px dashed rgba(15,23,42,0.20);background:rgba(2,6,23,0.02);border-radius:var(--r-lg);padding:14px 14px;transition:all 180ms var(--ease);outline:none}
.dropzone:hover{background:rgba(2,6,23,0.03);border-color:rgba(15,23,42,0.26)}
.dropzone:focus{box-shadow:0 0 0 4px rgba(214,26,163,0.16);border-color:rgba(214,26,163,0.4)}
html[data-theme="dark"] .dropzone{border-color:rgba(148,210,255,0.20);background:rgba(255,255,255,0.04)}
html[data-theme="dark"] .dropzone:hover{background:rgba(255,255,255,0.06);border-color:rgba(148,210,255,0.28)}
.dz-top{display:flex;gap:12px;align-items:center}
.dz-ico{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:900;background:rgba(214,26,163,0.10);color:var(--accent);border:1px solid rgba(214,26,163,0.20)}
.dz-bar{height:10px;border-radius:999px;background:rgba(2,6,23,0.06);overflow:hidden;border:1px solid rgba(15,23,42,0.10)}
.dz-bar-inner{height:100%;width:0%;background:linear-gradient(135deg,#ff37bd 0%,var(--accent) 55%,#a21caf 100%);border-radius:999px;transition:width 120ms linear}
html[data-theme="dark"] .dz-bar{background:rgba(255,255,255,0.06);border-color:rgba(148,210,255,0.14)}

/* WhatsApp floating button + note */
.wa-fab{position:fixed;right:18px;bottom:18px;z-index:210;display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:999px;background:linear-gradient(135deg,#22c55e 0%,#16a34a 100%);color:#ffffff;box-shadow:0 18px 40px rgba(22,163,74,0.28);border:1px solid rgba(255,255,255,0.28);transition:transform 180ms var(--ease),box-shadow 180ms var(--ease)}
.wa-fab:hover{transform:translateY(-2px);box-shadow:0 22px 50px rgba(22,163,74,0.34)}
.wa-fab svg{width:26px;height:26px;display:block}
.wa-note{position:fixed;right:86px;bottom:22px;z-index:210;max-width:min(260px,calc(100vw - 120px));background:rgba(255,255,255,0.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(15,23,42,0.10);box-shadow:0 18px 44px rgba(2,6,23,0.14);border-radius:16px;padding:12px 12px 12px 14px;opacity:0;transform:translateX(10px);pointer-events:none;transition:all 220ms var(--ease)}
.wa-note.is-show{opacity:1;transform:translateX(0);pointer-events:auto}
.wa-note-text{font-size:0.86rem;color:rgba(17,24,39,0.72);line-height:1.45}
.wa-note-x{position:absolute;right:8px;top:8px;width:28px;height:28px;border-radius:999px;border:1px solid rgba(15,23,42,0.10);background:rgba(255,255,255,0.7);color:rgba(17,24,39,0.7);display:flex;align-items:center;justify-content:center;transition:all 180ms var(--ease)}
.wa-note-x:hover{background:rgba(2,6,23,0.05);color:rgba(17,24,39,0.9)}
html[data-theme="dark"] .wa-note{background:rgba(8,12,22,0.72);border-color:var(--border);box-shadow:0 18px 44px rgba(0,0,0,0.42)}
html[data-theme="dark"] .wa-note-text{color:rgba(234,242,255,0.80)}
html[data-theme="dark"] .wa-note-x{background:rgba(255,255,255,0.06);border-color:var(--border);color:rgba(234,242,255,0.78)}
html[data-theme="dark"] .wa-note-x:hover{background:rgba(255,255,255,0.10);color:rgba(234,242,255,0.96)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:var(--r-full);font-family:var(--font-body);font-weight:600;font-size:0.9rem;padding:11px 22px;transition:all 200ms var(--ease);cursor:pointer;outline:none;border:none;white-space:nowrap}
.btn-primary{background:linear-gradient(135deg,#ff37bd 0%,var(--accent) 45%,#a21caf 100%);color:#ffffff;box-shadow:0 10px 26px rgba(214,26,163,0.24)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(214,26,163,0.30);filter:saturate(1.05)}
.btn-ghost{background:rgba(2,6,23,0.03);color:rgba(17,24,39,0.78);border:1px solid rgba(15,23,42,0.10)}
.btn-ghost:hover{background:rgba(2,6,23,0.05);color:rgba(17,24,39,0.92);border-color:rgba(15,23,42,0.14);transform:translateY(-1px)}
html[data-theme="dark"] .btn-ghost{background:rgba(255,255,255,0.06);color:rgba(234,242,255,0.82);border-color:var(--border)}
html[data-theme="dark"] .btn-ghost:hover{background:rgba(255,255,255,0.09);color:rgba(234,242,255,0.96);border-color:var(--border2)}
.btn-ghost.is-active{background:rgba(214,26,163,0.10);border-color:rgba(214,26,163,0.22);color:rgba(17,24,39,0.92);box-shadow:0 10px 26px rgba(214,26,163,0.14)}
html[data-theme="dark"] .btn-ghost.is-active{background:rgba(214,26,163,0.16);border-color:rgba(214,26,163,0.28);color:rgba(234,242,255,0.96)}
.btn-sm{padding:8px 16px;font-size:0.8rem}
.btn-lg{padding:15px 34px;font-size:1rem}
.btn-full{width:100%;justify-content:center}

.badge{display:inline-flex;align-items:center;padding:4px 11px;border-radius:var(--r-full);font-size:0.71rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}
.badge-blue{background:rgba(56,189,248,0.13);color:var(--accent);border:1px solid rgba(56,189,248,0.22)}
.badge-green{background:rgba(52,211,153,0.12);color:var(--green);border:1px solid rgba(52,211,153,0.22)}
.badge-yellow{background:rgba(251,191,36,0.12);color:var(--yellow);border:1px solid rgba(251,191,36,0.22)}
.badge-purple{background:rgba(167,139,250,0.12);color:var(--purple);border:1px solid rgba(167,139,250,0.22)}
.badge-cyan{background:rgba(34,211,238,0.12);color:var(--cyan);border:1px solid rgba(34,211,238,0.22)}
.badge-red{background:rgba(248,113,113,0.12);color:var(--red);border:1px solid rgba(248,113,113,0.22)}

h1,h2,h3,h4{font-family:var(--font-head);letter-spacing:-0.03em;line-height:1.15;font-weight:800}
h1{font-size:1.85rem}
h2{font-size:1.45rem}
h3{font-size:1.15rem}
h4{font-size:1rem}
.overline{display:inline-flex;align-items:center;gap:8px;font-size:0.72rem;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent)}
.overline::before{content:'';width:18px;height:2px;background:var(--accent);border-radius:2px;flex-shrink:0}
.grad{background:linear-gradient(135deg,#bae6fd 0%,#38bdf8 40%,#22d3ee 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.lead{font-size:1.08rem;line-height:1.85;color:var(--text2)}
.muted-text{color:var(--muted)}

.hero{padding:54px 0 42px}
.hero-simple{padding-top:34px}
.hero-simple-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:44px;align-items:center}
.hero-copy{padding:36px 0}
.hero-kicker{font-weight:700;color:var(--accent);letter-spacing:0.03em;margin-bottom:10px}
.hero-h1{font-family:var(--font-head);font-weight:800;letter-spacing:-0.02em;line-height:1.12;font-size:clamp(1.65rem,2.2vw + 1rem,2.45rem);color:rgba(17,24,39,0.86);margin-bottom:16px}
.hero-p{color:rgba(17,24,39,0.62);line-height:1.75;max-width:56ch;margin-bottom:26px}
html[data-theme="dark"] .hero-h1{color:rgba(234,242,255,0.94)}
html[data-theme="dark"] .hero-p{color:rgba(183,200,220,0.88)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-art{display:flex;justify-content:center}
.hero-art img{width:min(440px,100%);height:auto;filter:drop-shadow(0 22px 46px rgba(2,6,23,0.14))}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:48px;align-items:center}
.hero-left{display:flex;flex-direction:column;gap:22px;animation:fadeInUp 0.8s var(--ease) both}
.hero-eyebrow{display:flex;align-items:center;gap:10px}
.pulse-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulse-dot 2.2s ease-in-out infinite}
.hero-title{font-size:clamp(1.85rem,3vw + 0.6rem,3rem);line-height:1.06;word-break:break-word;overflow-wrap:anywhere}
.hero-desc{font-size:1.06rem;line-height:1.88;color:var(--text2);max-width:50ch}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-stats{display:flex;margin-top:8px;padding:20px 24px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--border)}
.hstat{flex:1;text-align:center;padding:0 16px}
.hstat+.hstat{border-left:1px solid var(--border)}
.hstat strong{display:block;font-family:var(--font-head);font-size:1.7rem;font-weight:800;letter-spacing:-0.04em}
.hstat span{font-size:0.74rem;color:var(--muted)}

.hero-right{animation:fadeInUp 0.8s var(--ease) 0.15s both}
.hero-card{border-radius:var(--r-2xl);padding:28px;min-height:500px;position:relative;overflow:hidden}
.orb{position:absolute;border-radius:50%;animation:float 8s ease-in-out infinite;background:radial-gradient(circle at 28% 28%,rgba(255,255,255,0.75),rgba(56,189,248,0.3) 50%,transparent 75%);border:1px solid rgba(255,255,255,0.22)}
.orb-a{width:230px;height:230px;top:-30px;right:-30px;animation-duration:9s}
.orb-b{width:120px;height:120px;bottom:110px;left:24px;animation-delay:-3.5s;animation-duration:7s}
.orb-c{width:58px;height:58px;top:42%;right:18%;animation-delay:-1.5s;animation-duration:6s}
.mini-player{position:absolute;left:22px;right:22px;bottom:22px;padding:20px 22px;border-radius:var(--r-lg);background:rgba(4,12,22,0.72);border:1px solid rgba(148,210,255,0.14);backdrop-filter:blur(16px)}
.mp-tag{font-size:0.68rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent);margin-bottom:5px}
.mp-title{font-family:var(--font-head);font-size:1rem;font-weight:700;margin-bottom:4px}
.mp-sub{font-size:0.8rem;color:var(--text2);margin-bottom:12px}
.prog-track{height:4px;background:rgba(255,255,255,0.08);border-radius:var(--r-full);overflow:hidden}
.prog-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--cyan));border-radius:var(--r-full)}

.section{padding:78px 0}
.section-head{margin-bottom:62px}
.section-head .overline{margin-bottom:14px}
.section-head h2{font-size:clamp(1.45rem,2.2vw + 0.85rem,2.35rem);margin-bottom:14px}
.section-head p{font-size:1.02rem;color:var(--text2);max-width:60ch;line-height:1.82}

.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}

.feat-card{border-radius:var(--r-xl);padding:28px;transition:transform 260ms var(--ease),border-color 260ms var(--ease),box-shadow 260ms var(--ease);animation:fadeInUp 0.6s var(--ease) both}
.feat-card:hover{transform:translateY(-5px);border-color:var(--border2);box-shadow:0 18px 48px rgba(2,6,23,0.10)}
.feat-icon{width:50px;height:50px;border-radius:var(--r-md);margin-bottom:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(214,26,163,0.12),rgba(214,26,163,0.02));border:1px solid rgba(214,26,163,0.18);color:rgba(214,26,163,0.92)}
.feat-icon svg{width:22px;height:22px;display:block}
.feat-card h3{font-size:1rem;margin-bottom:10px}
.feat-card p{font-size:0.87rem;color:var(--text2);line-height:1.78}

.course-card{border-radius:var(--r-xl);padding:26px;display:flex;flex-direction:column;gap:14px;transition:all 280ms var(--ease);animation:fadeInUp 0.65s var(--ease) both;position:relative;overflow:hidden}
.course-card::after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(56,189,248,0.06),transparent 60%);opacity:0;transition:opacity 300ms var(--ease);pointer-events:none}
.course-card:hover{transform:translateY(-6px);box-shadow:0 28px 68px rgba(2,6,23,0.12),0 0 0 1px rgba(214,26,163,0.10)}
.course-card:hover::after{opacity:1}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.card-price{font-family:var(--font-head);font-size:1.45rem;font-weight:800;letter-spacing:-0.03em}
.course-card h3{font-size:1.1rem;letter-spacing:-0.02em}
.course-card > p{font-size:0.86rem;color:var(--text2);line-height:1.72;flex:1}
.card-meta{display:flex;gap:14px;font-size:0.78rem;color:var(--muted);padding-top:12px;border-top:1px solid rgba(15,23,42,0.08)}
.card-actions{display:flex;gap:8px}

.testi-card{border-radius:var(--r-xl);padding:26px;display:flex;flex-direction:column;gap:14px;transition:transform 260ms var(--ease);animation:fadeInUp 0.6s var(--ease) both}
.testi-card:hover{transform:translateY(-4px)}
.stars{display:flex;gap:2px;font-size:0.82rem;color:var(--yellow);margin-bottom:2px}
.testi-card > p{font-size:0.9rem;color:var(--text2);line-height:1.82;flex:1}
.testi-author{display:flex;align-items:center;gap:12px;padding-top:12px;border-top:1px solid var(--border)}
.ava{width:38px;height:38px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,var(--accent),var(--blue));display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:0.82rem;color:#021220}
.ava-name{font-weight:600;font-size:0.88rem;display:block}
.ava-loc{font-size:0.76rem;color:var(--muted)}

.cta-band{border-radius:var(--r-2xl);padding:54px 38px;text-align:center;position:relative;overflow:hidden;background:linear-gradient(180deg,#ffffff,#fbfbfe);border:1px solid rgba(15,23,42,0.08);box-shadow:var(--shadow-md)}
.cta-band h2{line-height:1.12}
html[data-theme="dark"] .cta-band{background:linear-gradient(180deg,rgba(255,255,255,0.07),rgba(255,255,255,0.05));border-color:var(--border)}
.cta-band::before{content:'';position:absolute;width:520px;height:320px;top:-120px;left:50%;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(214,26,163,0.12),transparent 70%);filter:blur(44px);pointer-events:none}
.cta-band h2{font-size:clamp(1.45rem,2.2vw + 0.85rem,2.35rem);margin-bottom:14px}
.cta-band p{color:var(--text2);margin-bottom:30px;max-width:52ch;margin-left:auto;margin-right:auto;line-height:1.82}
.cta-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.form-group{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.form-label{font-size:0.8rem;font-weight:600;color:var(--text2);letter-spacing:0.03em}
.form-input{width:100%;padding:13px 16px;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:var(--r-md);color:var(--text);font:inherit;font-size:0.92rem;transition:all 200ms var(--ease);outline:none}
.form-input textarea{resize:vertical}
.form-input[type="number"]{-moz-appearance:textfield}
.form-input::-webkit-outer-spin-button,.form-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.form-input{background:var(--surface)}
.form-input::placeholder{color:var(--muted)}
.form-input:focus{border-color:rgba(56,189,248,0.45);background:rgba(56,189,248,0.04);box-shadow:0 0 0 3px rgba(56,189,248,0.10)}
html[data-theme="dark"] .form-input:focus{background:rgba(255,255,255,0.06);box-shadow:0 0 0 3px rgba(214,26,163,0.12);border-color:rgba(214,26,163,0.38)}

.alert{padding:13px 18px;border-radius:var(--r-md);font-size:0.88rem;font-weight:500;margin-bottom:18px}
.alert-err{background:rgba(239,68,68,0.10);border:1px solid rgba(239,68,68,0.22);color:#fca5a5}
.alert-ok{background:rgba(52,211,153,0.10);border:1px solid rgba(52,211,153,0.22);color:#6ee7b7}
.alert-info{background:rgba(56,189,248,0.10);border:1px solid rgba(56,189,248,0.22);color:var(--accent2)}

.auth-wrap{min-height:calc(100vh - 76px);display:flex;align-items:center;justify-content:center;padding:48px 20px}
.auth-box{border-radius:var(--r-2xl);padding:44px;animation:fadeInUp 0.7s var(--ease) both}
.auth-head{margin-bottom:28px}
.auth-head .overline{margin-bottom:10px}
.auth-head h1{font-size:1.95rem;margin-bottom:8px}
.auth-head p{font-size:0.88rem;color:var(--text2);line-height:1.7}
.auth-demo{border-radius:var(--r-lg);padding:16px 18px;margin-bottom:22px}
.auth-demo h4{font-size:0.78rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:8px;font-family:var(--font-head)}
.auth-demo p{font-size:0.83rem;color:var(--text2);line-height:1.7}
.divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--muted);font-size:0.78rem}
.divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--border)}
.auth-foot{text-align:center;margin-top:20px;font-size:0.86rem;color:var(--muted)}
.auth-foot a{color:var(--accent);font-weight:600}
.auth-foot a:hover{text-decoration:underline}

.page-hero{border-radius:var(--r-2xl);padding:38px 44px;margin-bottom:24px;display:flex;justify-content:space-between;align-items:center;gap:28px;animation:fadeInUp 0.7s var(--ease) both}
.page-hero h1{font-size:clamp(1.7rem,3.5vw,2.5rem);margin-bottom:8px}
.page-hero p{color:var(--text2);font-size:0.94rem;max-width:52ch;line-height:1.75}
.page-badge{flex-shrink:0;padding:20px 24px;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--border);text-align:center}
.page-badge strong{display:block;font-family:var(--font-head);font-size:2.2rem;font-weight:800;letter-spacing:-0.04em}
.page-badge span{font-size:0.76rem;color:var(--muted);margin-top:2px;display:block}

.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.stat-card{border-radius:var(--r-xl);padding:22px 24px;animation:fadeInUp 0.6s var(--ease) both}
.s-label{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--muted);margin-bottom:8px}
.s-val{font-family:var(--font-head);font-size:2rem;font-weight:800;letter-spacing:-0.04em}
.s-sub{font-size:0.76rem;color:var(--text2);margin-top:4px}

.panel{border-radius:var(--r-xl);padding:26px 28px;animation:fadeInUp 0.65s var(--ease) both}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.panel-head h2{font-size:1.1rem}

.spark-wrap{display:flex;flex-direction:column;gap:10px}
.spark{width:100%;height:38px}
.spark rect{fill:rgba(214,26,163,0.18)}
html[data-theme="dark"] .spark rect{fill:rgba(255,61,187,0.22)}
.spark-note{font-size:0.86rem;color:var(--muted)}

.table-wrap table td{vertical-align:top}

.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
thead th{padding:10px 14px;text-align:left;font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.09em;color:var(--muted);border-bottom:1px solid var(--border)}
tbody td{padding:14px;font-size:0.87rem;color:var(--text2);border-bottom:1px solid var(--border)}
tbody tr:last-child td{border-bottom:none}
tbody tr{transition:background 160ms}
tbody tr:hover td{background:rgba(255,255,255,0.02);color:var(--text)}

.clist-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}
.clist-item:last-child{border-bottom:none}
.clist-info{flex:1;min-width:0}
.clist-info strong{display:block;font-size:0.94rem;font-family:var(--font-head);letter-spacing:-0.01em;margin-bottom:4px}
.clist-meta{font-size:0.76rem;color:var(--muted)}
.clist-prog{flex-shrink:0;width:110px}
.prog-mini{height:5px;background:rgba(255,255,255,0.07);border-radius:var(--r-full);overflow:hidden;margin-bottom:4px}
.prog-mini-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--cyan));border-radius:var(--r-full)}
.prog-label{font-size:0.7rem;color:var(--muted);text-align:right}

.install-wrap{min-height:calc(100vh - 76px);display:flex;align-items:flex-start;justify-content:center;padding:60px 20px 80px}
.install-box{border-radius:var(--r-2xl);padding:48px;animation:fadeInUp 0.7s var(--ease) both}
.install-box h1{font-size:clamp(2rem,5vw,2.6rem);margin:12px 0 12px}
.install-box > p{color:var(--text2);line-height:1.82;margin-bottom:28px}
.step-list{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.step-item{display:flex;align-items:flex-start;gap:14px;padding:15px 18px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);font-size:0.88rem;color:var(--text2);line-height:1.65}
.step-num{width:26px;height:26px;flex-shrink:0;border-radius:50%;background:linear-gradient(135deg,rgba(56,189,248,0.2),rgba(56,189,248,0.06));border:1px solid rgba(56,189,248,0.25);display:flex;align-items:center;justify-content:center;font-size:0.72rem;font-weight:700;color:var(--accent);font-family:var(--font-head)}
.install-actions{display:flex;gap:12px;flex-wrap:wrap}
.accounts-box{border-radius:var(--r-xl);padding:22px;margin-top:24px}
.accounts-box h3{font-size:0.78rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:12px;font-family:var(--font-head)}
.acc-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border);font-size:0.86rem}
.acc-row:last-child{border-bottom:none}
.acc-label{color:var(--muted);font-size:0.76rem}

.cd-page{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,340px);gap:28px;align-items:start}
.cd-aside{position:sticky;top:calc(var(--site-nav-h, 88px) + 12px)}
.cd-hero{border-radius:var(--r-2xl);padding:32px 36px;margin-bottom:0;animation:fadeInUp 0.7s var(--ease) both}
.cd-hero .overline{margin-bottom:12px}
.cd-hero h1{font-size:clamp(1.45rem,1.5vw + 1.05rem,2.1rem);margin-bottom:14px}
.cd-hero p{color:var(--text2);font-size:0.95rem;line-height:1.75;max-width:62ch}
.cd-meta{display:flex;gap:16px 20px;margin-top:18px;flex-wrap:wrap}
.cd-meta span{font-size:0.8rem;color:var(--muted)}
.purchase-box{border-radius:var(--r-xl);padding:24px}
.purchase-price{font-family:var(--font-head);font-size:clamp(1.45rem,2.5vw + 0.5rem,1.95rem);font-weight:800;letter-spacing:-0.04em;margin:12px 0 6px}
.purchase-box p{font-size:0.85rem;color:var(--text2);line-height:1.7;margin-bottom:22px}
.outcome-item{display:flex;align-items:flex-start;gap:10px;font-size:0.87rem;color:var(--text2);line-height:1.65;padding:8px 0;border-bottom:1px solid var(--border)}
.outcome-item:last-child{border-bottom:none}
.outcome-item::before{content:'✓';flex-shrink:0;color:var(--green);font-weight:700;margin-top:1px}

.site-footer{padding:34px 0 24px}
.footer-bottom{display:flex;justify-content:center;align-items:center;padding-top:18px;border-top:1px solid rgba(15,23,42,0.08);font-size:0.84rem;color:rgba(17,24,39,0.55)}
html[data-theme="dark"] .footer-bottom{border-top:1px solid rgba(148,210,255,0.12);color:rgba(183,200,220,0.72)}

.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:42px;min-width:42px;padding:0 12px;border-radius:var(--r-full);background:rgba(2,6,23,0.03);border:1px solid rgba(15,23,42,0.10);transition:all 200ms var(--ease);color:rgba(17,24,39,0.75)}
.theme-toggle:hover{background:rgba(2,6,23,0.05);border-color:rgba(15,23,42,0.14);transform:translateY(-1px)}
.theme-toggle .theme-ico{width:18px;height:18px;display:block}
html[data-theme="light"] .theme-toggle .ico-moon{display:none}
html[data-theme="dark"] .theme-toggle .ico-sun{display:none}
html[data-theme="dark"] .theme-toggle{background:rgba(255,255,255,0.06);border-color:var(--border);color:rgba(234,242,255,0.86)}
html[data-theme="dark"] .theme-toggle:hover{background:rgba(255,255,255,0.09);border-color:var(--border2)}
.theme-toggle-full{width:100%;justify-content:flex-start}
.theme-label{font-size:0.88rem;font-weight:700}

@keyframes float{0%,100%{transform:translateY(0) rotate(0deg)}33%{transform:translateY(-22px) rotate(2deg)}66%{transform:translateY(-10px) rotate(-1.5deg)}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse-dot{0%,100%{box-shadow:0 0 0 0 rgba(56,189,248,0.5)}50%{box-shadow:0 0 0 8px rgba(56,189,248,0)}}
@keyframes slideInRight{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}
@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(-8px) scale(0.98)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}
@keyframes toastOut{from{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}to{opacity:0;transform:translateX(-50%) translateY(-8px) scale(0.985)}}

.delay-1{animation-delay:0.1s}.delay-2{animation-delay:0.2s}.delay-3{animation-delay:0.3s}.delay-4{animation-delay:0.4s}

@media(max-width:1024px){.hero-simple-grid{grid-template-columns:1fr}.hero-copy{padding:14px 0 0}.hero-art{order:2}.grid-4,.stats-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:980px){
  .nav-links{display:none}
  .nav-toggle{display:inline-flex}
  .nav-desktop-only{display:none !important}
  .nav-actions{
    padding:4px;
    border-radius:var(--r-full);
    background:rgba(255,255,255,0.72);
    border:1px solid rgba(15,23,42,0.10);
    box-shadow:0 10px 24px rgba(2,6,23,0.08);
    gap:4px;
  }
  html[data-theme="dark"] .nav-actions{
    background:rgba(8,12,22,0.55);
    border-color:var(--border);
    box-shadow:0 10px 26px rgba(0,0,0,0.32);
  }
  .nav-actions .nav-toggle{
    display:inline-flex;
    width:40px;
    height:40px;
    min-width:40px;
    padding:0;
    border:none;
    background:transparent;
    box-shadow:none;
    transform:none !important;
  }
  .nav-actions .nav-toggle:hover{
    background:rgba(2,6,23,0.04);
  }
  html[data-theme="dark"] .nav-actions .nav-toggle:hover{
    background:rgba(255,255,255,0.06);
  }
}
@media(max-width:900px){
  .cd-page{grid-template-columns:1fr;gap:20px}
  .cd-aside{position:static}
}
@media(max-width:768px){
  .grid-3,.grid-2{grid-template-columns:1fr}
  .hero{padding:40px 0 44px}
  .section{padding:56px 0}
  .page-hero{flex-direction:column;align-items:flex-start;padding:24px 18px}
  .auth-box{padding:26px 18px}
  .install-box{padding:28px 18px}
  .cta-band{padding:38px 18px}
  .cd-hero{padding:24px 18px}
  .hero-h1{font-size:clamp(1.75rem,7.2vw,2.35rem)}
  .hero-actions{gap:10px}
  .hero-actions .btn{width:100%;justify-content:center}
  .hero-p{max-width:unset}
  .nav-inner{padding:10px 12px 10px 14px}
  .brand-logo{height:38px;max-width:180px}
  .hero-art{margin-top:10px}
  .hero-art img{width:min(380px,100%);height:auto}
}
@media(max-width:768px){.toast{top:10px}.toast-inner{min-width:calc(100vw - 20px)}}
@media(max-width:480px){
  .shell{width:calc(100% - 32px)}
  .shell-sm,.shell-md{width:calc(100% - 32px)}
  .grid-4,.stats-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero-stats{flex-direction:column}
  .hstat+.hstat{border-left:none;border-top:1px solid var(--border);padding:12px 0 0}
  .nav-collapse{padding:8px}
  .nav-collapse-links a{padding:12px 12px}
  .btn-lg{padding:13px 18px;font-size:0.95rem}
  .hero-h1{letter-spacing:-0.03em}
}

/* Admin: tab bar horizontal scroll di mobile */
.admin-tabstrip{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  align-items:center;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  padding-bottom:4px;
  scrollbar-width:thin;
}
.admin-tabstrip .btn{flex:0 0 auto}

/* Checkout premium layout */
.checkout-shell{padding-top:28px;padding-bottom:72px}
.checkout-hero{margin-bottom:18px}
.checkout-hero-inner{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  align-items:stretch;
  justify-content:space-between;
  padding:22px 22px;
  border-radius:22px;
  position:relative;
  overflow:hidden;
}
.checkout-hero-inner::before{
  content:"";
  position:absolute;
  inset:-40% -20% auto auto;
  width:420px;height:420px;
  background:radial-gradient(circle at 30% 30%,rgba(236,72,153,0.22),transparent 62%);
  pointer-events:none;
}
.checkout-title{font-size:clamp(1.35rem,4.2vw,2rem);letter-spacing:-0.03em;margin:0 0 8px}
.checkout-lead{max-width:52ch;margin:0}
.co-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.co-pill{
  font-size:0.78rem;font-weight:700;padding:6px 10px;border-radius:999px;
  border:1px solid var(--border);background:rgba(255,255,255,0.04);color:var(--text2);
}
.checkout-hero-price{
  min-width:200px;
  padding:16px 18px;border-radius:18px;
  background:linear-gradient(145deg,rgba(56,189,248,0.14),rgba(236,72,153,0.12));
  border:1px solid var(--border);
  position:relative;z-index:1;
}
.co-price-label{font-size:0.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.12em}
.co-price-val{font-size:clamp(1.4rem,4vw,2rem);font-weight:900;font-family:var(--font-head);margin-top:4px}
.co-price-note{font-size:0.84rem;margin-top:6px}
.co-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);
  gap:16px;
  align-items:start;
}
@media(max-width:900px){.co-grid{grid-template-columns:1fr}}
.co-card,.co-aside{padding:18px 18px;border-radius:20px}
.co-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.co-card-head h2{margin:0;font-size:1.05rem}
.co-summary{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;padding:12px 14px;border-radius:14px;background:rgba(2,6,23,0.03);border:1px solid var(--border)}
html[data-theme="dark"] .co-summary{background:rgba(255,255,255,0.03)}
.co-row{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.co-input{text-transform:uppercase;letter-spacing:0.04em}
.co-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.co-aside-title{font-weight:800;font-size:0.92rem;margin-bottom:8px}
.co-list{margin:0;padding-left:18px;line-height:1.65}
.co-step{display:flex;align-items:flex-start;gap:10px;margin:8px 0}
.co-step-dot{
  flex:0 0 26px;height:26px;border-radius:999px;display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:0.78rem;background:rgba(56,189,248,0.16);border:1px solid rgba(56,189,248,0.35);color:var(--text);
}
.co-mono{font-family:var(--font-head);font-size:0.86rem}
.co-paypulse{position:relative}
.co-paypulse::after{
  content:"";position:absolute;inset:-2px;border-radius:999px;
  background:linear-gradient(120deg,rgba(236,72,153,0.35),rgba(56,189,248,0.35));
  z-index:-1;opacity:0.55;filter:blur(10px);
}
.co-rise{animation:coRise 0.55s var(--ease) both}
.co-delay{animation-delay:0.08s}
@keyframes coRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.co-shine{animation:coShine 4.5s ease-in-out infinite}
@keyframes coShine{0%,100%{filter:saturate(1)}50%{filter:saturate(1.15)}}

/* Halaman kursus: hero & harga lebih rapat di mobile */
@media(max-width:768px){
  .cd-hero{padding:22px 16px}
  .cd-meta{flex-wrap:wrap;gap:8px}
  .purchase-box{padding:22px 16px}
}

/* Admin voucher cards */
.vch-card,.vch-hint,.vch-list{border-radius:20px}

/* Auth: divider + tombol Google */
.auth-divider{display:flex;align-items:center;gap:14px;margin:22px 0 16px;color:var(--muted);font-size:0.82rem;font-weight:600}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.auth-divider span{flex-shrink:0;text-transform:lowercase}
.auth-google-note{
  margin:14px 0 0;font-size:0.78rem;line-height:1.65;color:var(--muted);text-align:center;
}
.dash-google-status{display:flex;gap:12px;align-items:flex-start;margin:0;color:var(--text2);font-size:0.9rem;line-height:1.55}
.dash-google-status .ico-google-badge{flex-shrink:0;margin-top:2px}
.btn-google-ico .ico-google-badge{display:inline-flex;vertical-align:middle}
.btn-google{
  background:#fff;
  color:#1f1f1f;
  border:1px solid rgba(15,23,42,0.14);
  box-shadow:0 1px 2px rgba(2,6,23,0.06);
  font-weight:600;
  gap:10px;
}
.btn-google:hover{
  background:#f8fafc;
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(2,6,23,0.10);
  filter:none;
}
html[data-theme="dark"] .btn-google{
  background:rgba(255,255,255,0.96);
  color:#111827;
  border-color:rgba(15,23,42,0.12);
}
.btn-google-ico{display:flex;flex-shrink:0;line-height:0}
.btn-google-ico svg{display:block}

.complete-profile-wrap .complete-profile-card{max-width:480px}
.complete-profile-form .form-input:disabled{cursor:default}

/* Dashboard pengguna */
.dash-shell{width:min(1240px,calc(100% - 40px))}
.dash-layout{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:26px;align-items:start}
.dash-side{
  position:sticky;top:88px;border-radius:var(--r-xl);padding:22px 18px;
  display:flex;flex-direction:column;gap:18px;
}
.dash-userblock{display:flex;align-items:flex-start;gap:14px}
.dash-avatar{
  flex-shrink:0;width:52px;height:52px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-weight:800;font-size:1.15rem;
  background:linear-gradient(135deg,rgba(214,26,163,0.18),rgba(37,99,235,0.12));
  border:1px solid var(--border);color:var(--text);
}
.dash-usermeta{display:flex;flex-direction:column;gap:4px;min-width:0}
.dash-username{font-size:0.95rem;line-height:1.25;word-break:break-word}
.dash-useremail,.dash-userphone{font-size:0.78rem;color:var(--muted);line-height:1.35;word-break:break-all}
.dash-nav{display:flex;flex-direction:column;gap:4px;padding-top:4px;border-top:1px solid var(--border)}
.dash-navlink{
  padding:10px 12px;border-radius:var(--r-md);font-size:0.86rem;font-weight:600;
  color:var(--text2);transition:background 160ms var(--ease),color 160ms;
}
.dash-navlink:hover{background:rgba(2,6,23,0.04);color:var(--text)}
html[data-theme="dark"] .dash-navlink:hover{background:rgba(255,255,255,0.06)}
.dash-navlink-muted{color:var(--muted);font-weight:500}
.dash-navlink-exit{margin-top:6px;color:var(--red);font-weight:700}
.dash-navlink-exit:hover{background:rgba(239,68,68,0.08);color:#b91c1c}
.dash-admincta{padding-top:12px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px}
.dash-adminlabel{font-size:0.72rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.dash-main{display:flex;flex-direction:column;gap:22px;min-width:0}
.dash-section{scroll-margin-top:96px}
/* ===== Dashboard v6: minimal, tanpa app bar (pakai nav situs) ===== */
.db-shell{width:min(960px,calc(100% - 32px));display:flex;flex-direction:column;gap:18px}
.db-anim{opacity:0;transform:translateY(14px);animation:dbFadeUp 520ms var(--ease) forwards;animation-delay:var(--anim-delay,0ms)}
@keyframes dbFadeUp{to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion: reduce){.db-anim{animation:none;opacity:1;transform:none}}

.db-hero{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 24px;
  padding:22px 24px;border-radius:var(--r-2xl);
  background:linear-gradient(135deg,rgba(214,26,163,0.07),rgba(37,99,235,0.05) 60%,transparent);
}
.db-hero-left{display:flex;align-items:center;gap:16px;min-width:0;flex:1 1 280px}
.db-hero-avatar{
  flex-shrink:0;width:64px;height:64px;border-radius:20px;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-weight:800;font-size:1.4rem;color:#fff;
  background:linear-gradient(145deg,var(--accent),var(--accent2));
  box-shadow:0 10px 24px rgba(214,26,163,0.32);
}
.db-hero-kicker{margin:0 0 4px;font-size:0.72rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.db-hero-title{margin:0;font-family:var(--font-head);font-size:clamp(1.25rem,1.4vw + 0.6rem,1.7rem);font-weight:800;letter-spacing:-0.03em;line-height:1.15;color:var(--text);word-break:break-word}
.db-hero-sub{margin:6px 0 0;font-size:0.86rem;color:var(--muted);word-break:break-word;line-height:1.45}
.db-hero-cta{
  display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:var(--r-xl);
  background:var(--text);color:var(--bg);text-decoration:none;
  box-shadow:0 12px 28px rgba(2,6,23,0.18);
  transition:transform 200ms var(--ease),box-shadow 200ms var(--ease);
}
html[data-theme="dark"] .db-hero-cta{background:var(--accent);color:#fff;box-shadow:0 12px 28px rgba(214,26,163,0.32)}
.db-hero-cta:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(2,6,23,0.22)}
.db-hero-cta-text{display:flex;flex-direction:column;gap:2px;line-height:1.2}
.db-hero-cta-k{font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;opacity:0.7}
.db-hero-cta-t{font-family:var(--font-head);font-weight:800;font-size:1rem;letter-spacing:-0.01em}
.db-hero-cta-arrow{font-size:1.2rem;font-weight:800;transition:transform 220ms var(--ease)}
.db-hero-cta:hover .db-hero-cta-arrow{transform:translateX(4px)}

.db-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media(max-width:680px){.db-stat-grid{grid-template-columns:1fr}}
.db-stat{
  display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--r-xl);
  background:var(--surface);border:1px solid var(--border);box-shadow:0 4px 14px rgba(2,6,23,0.04);
  text-decoration:none;color:inherit;
  transition:transform 200ms var(--ease),border-color 200ms var(--ease),box-shadow 200ms var(--ease);
}
.db-stat:hover{transform:translateY(-2px);border-color:var(--border2);box-shadow:0 10px 24px rgba(2,6,23,0.08)}
.db-stat-ico{
  flex-shrink:0;width:42px;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  color:var(--accent);background:rgba(214,26,163,0.12);border:1px solid rgba(214,26,163,0.22);
}
.db-stat-text{display:flex;flex-direction:column;gap:4px;min-width:0}
.db-stat-num{font-family:var(--font-head);font-size:1.45rem;font-weight:800;letter-spacing:-0.03em;line-height:1;color:var(--text)}
.db-stat-num--badge{font-size:0.85rem;display:flex;align-items:center}
.db-stat-lbl{font-size:0.74rem;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted)}

.db-card{padding:22px 22px 20px;border-radius:var(--r-2xl);min-width:0;scroll-margin-top:96px}
.db-card-hd{
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 16px;
  margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--border);
}
.db-card-title{margin:0;font-family:var(--font-head);font-size:1.08rem;font-weight:800;letter-spacing:-0.02em;color:var(--text)}
.db-card-desc{margin:4px 0 0;font-size:0.82rem;color:var(--muted);line-height:1.5}
.db-zero{padding:24px 8px;text-align:center;color:var(--muted);font-size:0.9rem}

.db-tx-scroll{margin:0 -6px;padding:0 6px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.db-tx-table{width:100%;min-width:560px;border-collapse:collapse;font-size:0.86rem}
.db-tx-table thead th{
  text-align:left;padding:10px 12px;font-size:0.66rem;font-weight:800;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted);
  background:rgba(2,6,23,0.03);border-bottom:1px solid var(--border);
}
html[data-theme="dark"] .db-tx-table thead th{background:rgba(255,255,255,0.05)}
.db-tx-table tbody td{padding:12px;border-bottom:1px solid var(--border);vertical-align:top;color:var(--text2)}
.db-tx-table tbody tr:last-child td{border-bottom:none}
.db-tx-table tbody tr:hover td{background:rgba(2,6,23,0.02)}
html[data-theme="dark"] .db-tx-table tbody tr:hover td{background:rgba(255,255,255,0.03)}
.db-tx-inv{font-family:var(--font-head);font-size:0.8rem;font-weight:800;color:var(--text);word-break:break-all}
.db-tx-course{font-size:0.78rem;color:var(--muted);margin-top:4px;line-height:1.35}
.db-tx-right{text-align:right}
.db-tx-money{font-weight:800;font-variant-numeric:tabular-nums;color:var(--text)}
.db-tx-disc{font-size:0.72rem;font-weight:600;color:var(--muted);margin-top:4px}
.db-tx-act{text-align:right;white-space:nowrap}

.db-stat-ico--accent{color:var(--accent);background:rgba(214,26,163,0.12);border:1px solid rgba(214,26,163,0.22)}
.db-stat-ico--blue{color:var(--blue);background:rgba(37,99,235,0.12);border:1px solid rgba(37,99,235,0.22)}
.db-stat-ico--green{color:var(--green);background:rgba(22,163,74,0.12);border:1px solid rgba(22,163,74,0.22)}
.db-stat-ico--purple{color:var(--purple);background:rgba(124,58,237,0.12);border:1px solid rgba(124,58,237,0.22)}

/* Kartu preview kursus di dashboard */
.db-course-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.db-course{
  display:flex;flex-direction:column;border-radius:var(--r-xl);overflow:hidden;
  background:var(--surface);border:1px solid var(--border);box-shadow:0 4px 14px rgba(2,6,23,0.05);
  text-decoration:none;color:inherit;
  transition:transform 220ms var(--ease),box-shadow 220ms var(--ease),border-color 220ms var(--ease);
}
.db-course:hover{transform:translateY(-3px);border-color:var(--border2);box-shadow:0 14px 28px rgba(2,6,23,0.1)}
.db-course-cover{
  position:relative;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden;
}
.db-course-cover::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 20%,rgba(255,255,255,0.3),transparent 55%);pointer-events:none}
.db-course-init{
  font-family:var(--font-head);font-weight:900;font-size:2.4rem;letter-spacing:-0.05em;
  text-shadow:0 6px 20px rgba(0,0,0,0.25);opacity:0.85;
}
.db-course-play{
  position:absolute;right:12px;bottom:12px;width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,0.95);color:var(--accent);display:flex;align-items:center;justify-content:center;
  padding-left:3px;box-shadow:0 6px 16px rgba(0,0,0,0.25);transition:transform 220ms var(--ease);
}
.db-course:hover .db-course-play{transform:scale(1.1)}
.db-course-level{
  position:absolute;top:10px;left:10px;padding:3px 8px;border-radius:999px;
  background:rgba(0,0,0,0.35);color:#fff;font-size:0.66rem;font-weight:700;letter-spacing:0.06em;backdrop-filter:blur(4px);
}
.db-course-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.db-course-title{font-family:var(--font-head);font-weight:800;font-size:0.92rem;letter-spacing:-0.01em;line-height:1.3;color:var(--text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.db-course-meta{font-size:0.74rem;color:var(--muted)}

.db-zero{padding:24px 8px;text-align:center;color:var(--muted);font-size:0.9rem}
.db-zero--course{padding:36px 12px}
.db-zero-art{display:flex;justify-content:center;color:var(--accent);opacity:0.75;margin-bottom:10px}
.db-zero-title{margin:0 0 6px;font-family:var(--font-head);font-weight:800;font-size:0.96rem;color:var(--text)}
.db-zero-text{margin:0;color:var(--muted);font-size:0.86rem}

/* ===== Halaman Akun & Keamanan ===== */
.ak-shell{width:min(820px,calc(100% - 32px));display:flex;flex-direction:column;gap:18px}
.ak-anim{opacity:0;transform:translateY(14px);animation:dbFadeUp 520ms var(--ease) forwards;animation-delay:var(--anim-delay,0ms)}
.ak-crumbs{display:flex;align-items:center;gap:8px;font-size:0.84rem;color:var(--muted)}
.ak-crumbs a{color:var(--text2);font-weight:600}
.ak-crumbs a:hover{color:var(--accent)}
.ak-crumbs-here{color:var(--text);font-weight:700}
.ak-hero{
  display:flex;flex-wrap:wrap;align-items:center;gap:16px;
  padding:22px 24px;border-radius:var(--r-2xl);
  background:linear-gradient(135deg,rgba(214,26,163,0.07),rgba(37,99,235,0.05) 60%,transparent);
}
.ak-hero-avatar{
  width:56px;height:56px;border-radius:18px;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-weight:800;font-size:1.25rem;color:#fff;
  background:linear-gradient(145deg,var(--accent),var(--accent2));
  box-shadow:0 8px 22px rgba(214,26,163,0.32);
}
.ak-hero-kicker{margin:0 0 4px;font-size:0.7rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.ak-hero-title{margin:0;font-family:var(--font-head);font-size:clamp(1.2rem,1.3vw + 0.6rem,1.55rem);font-weight:800;letter-spacing:-0.02em;line-height:1.2;color:var(--text)}
.ak-hero-sub{margin:4px 0 0;font-size:0.86rem;color:var(--muted);line-height:1.5}
.ak-form{display:flex;flex-direction:column;gap:14px}
.ak-card{padding:20px 22px;border-radius:var(--r-2xl)}
.ak-card-hd{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.ak-card-title{margin:0;font-family:var(--font-head);font-size:1rem;font-weight:800;letter-spacing:-0.02em;color:var(--text)}
.ak-card-desc{margin:4px 0 0;font-size:0.82rem;color:var(--muted);line-height:1.45}
.ak-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
@media(max-width:560px){.ak-grid{grid-template-columns:1fr}}
.ak-span2{grid-column:1/-1}
.ak-hint{font-size:0.76rem;color:var(--muted);margin:6px 0 0;line-height:1.45}
.ak-form .form-input:disabled{opacity:0.85;cursor:default}
.ak-pw{border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;background:rgba(2,6,23,0.02)}
html[data-theme="dark"] .ak-pw{background:rgba(255,255,255,0.04)}
.ak-pw-sum{
  cursor:pointer;list-style:none;padding:12px 14px;font-weight:800;font-size:0.9rem;display:flex;align-items:center;justify-content:space-between;gap:10px;
  user-select:none;
}
.ak-pw-sum::-webkit-details-marker{display:none}
.ak-pw-sum::after{content:'+';color:var(--muted);font-weight:900;font-size:1.05rem}
.ak-pw[open] .ak-pw-sum::after{content:'−'}
.ak-pw-tag{font-style:normal;font-weight:600;font-size:0.66rem;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted)}
.ak-pw-body{padding:0 14px 14px}
.ak-google{margin-top:16px;padding-top:14px;border-top:1px dashed var(--border)}
.ak-google-h{margin:0 0 8px;font-size:0.86rem;font-family:var(--font-head);font-weight:800;letter-spacing:-0.01em}
.ak-google-status{display:flex;gap:10px;align-items:flex-start;margin:0;color:var(--text2);font-size:0.88rem;line-height:1.55}
.ak-google-status .ico-google-badge{flex-shrink:0;margin-top:2px}
.ak-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding-top:6px}

/* ===== Admin: tab Server ===== */
.adm-srv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:780px){.adm-srv-grid{grid-template-columns:1fr}}
.adm-srv-card{padding:18px 20px;border-radius:var(--r-xl)}
.adm-srv-span2{grid-column:1/-1}
.adm-srv-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.adm-srv-h h2{margin:0;font-family:var(--font-head);font-size:0.98rem;font-weight:800;letter-spacing:-0.02em}
.adm-srv-h-sub{font-size:0.74rem}
.adm-srv-big{margin:0;font-family:var(--font-head);font-size:1.8rem;font-weight:800;letter-spacing:-0.03em;line-height:1.1}
.adm-srv-sub{margin:6px 0 0;font-size:0.8rem;color:var(--muted)}
.adm-srv-note{margin:10px 0 0;font-size:0.8rem;line-height:1.55;color:var(--muted)}
.adm-srv-note code{font-size:0.8rem;background:rgba(2,6,23,0.06);padding:2px 6px;border-radius:6px}
html[data-theme="dark"] .adm-srv-note code{background:rgba(255,255,255,0.08)}
.adm-srv-meter{height:10px;border-radius:999px;background:rgba(2,6,23,0.08);overflow:hidden;border:1px solid var(--border)}
html[data-theme="dark"] .adm-srv-meter{background:rgba(255,255,255,0.08)}
.adm-srv-meter-bar{height:100%;background:linear-gradient(90deg,var(--accent),var(--blue));border-radius:999px;transition:width 380ms var(--ease)}
.adm-srv-meter-lbl{margin:8px 0 4px;font-size:0.82rem;color:var(--text2)}
.adm-srv-pair{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}
.adm-srv-pair--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:680px){.adm-srv-pair,.adm-srv-pair--3{grid-template-columns:1fr}}
.adm-srv-pair li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:8px 10px;border-radius:10px;background:rgba(2,6,23,0.03);font-size:0.84rem}
html[data-theme="dark"] .adm-srv-pair li{background:rgba(255,255,255,0.04)}
.adm-srv-pair li span{color:var(--muted)}
.adm-srv-pair li strong{font-family:var(--font-head);font-variant-numeric:tabular-nums;color:var(--text)}
.adm-srv-pings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(max-width:640px){.adm-srv-pings{grid-template-columns:1fr}}
.adm-srv-ping{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--surface)}
.adm-srv-ping-dot{width:10px;height:10px;border-radius:50%}
.adm-srv-ping.is-ok .adm-srv-ping-dot{background:var(--green);box-shadow:0 0 0 4px rgba(22,163,74,0.18)}
.adm-srv-ping.is-bad .adm-srv-ping-dot{background:var(--red);box-shadow:0 0 0 4px rgba(239,68,68,0.18)}
.adm-srv-ping-name{font-weight:700;font-size:0.86rem;color:var(--text)}
.adm-srv-ping-ms{font-family:var(--font-head);font-weight:800;font-variant-numeric:tabular-nums;font-size:0.86rem;color:var(--text)}
.adm-srv-howto{margin-top:14px;border:1px dashed var(--border);border-radius:var(--r-md);padding:10px 12px;background:rgba(250,204,21,0.06)}
html[data-theme="dark"] .adm-srv-howto{background:rgba(250,204,21,0.08)}
.adm-srv-howto > summary{cursor:pointer;font-weight:800;font-size:0.86rem;list-style:none}
.adm-srv-howto > summary::-webkit-details-marker{display:none}
.adm-srv-howto > summary::before{content:'›';display:inline-block;margin-right:8px;transition:transform 200ms var(--ease)}
.adm-srv-howto[open] > summary::before{transform:rotate(90deg)}
.adm-srv-howto-body{font-size:0.84rem;line-height:1.6;color:var(--text2);margin-top:10px}
.adm-srv-howto-body pre{background:rgba(2,6,23,0.06);padding:10px 12px;border-radius:8px;overflow-x:auto;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.78rem;margin:8px 0}
html[data-theme="dark"] .adm-srv-howto-body pre{background:rgba(255,255,255,0.06)}

/* ===== Halaman status publik ===== */
.st-shell{width:min(720px,calc(100% - 32px));display:flex;flex-direction:column;gap:16px}
.st-hero{display:flex;align-items:center;gap:18px;padding:24px 26px;border-radius:var(--r-2xl)}
.st-badge{flex-shrink:0;width:56px;height:56px;border-radius:50%;position:relative}
.st-badge.is-ok{background:rgba(22,163,74,0.16);box-shadow:0 0 0 6px rgba(22,163,74,0.08)}
.st-badge.is-bad{background:rgba(239,68,68,0.18);box-shadow:0 0 0 6px rgba(239,68,68,0.08)}
.st-badge::after{
  content:'';position:absolute;inset:18px;border-radius:50%;
}
.st-badge.is-ok::after{background:var(--green);animation:stPulse 2.4s ease-in-out infinite}
.st-badge.is-bad::after{background:var(--red);animation:stPulse 1.2s ease-in-out infinite}
@keyframes stPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(0.86);opacity:0.7}}
.st-kicker{margin:0 0 4px;font-size:0.72rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.st-title{margin:0;font-family:var(--font-head);font-size:clamp(1.2rem,1.6vw + 0.4rem,1.6rem);font-weight:800;letter-spacing:-0.02em;line-height:1.2}
.st-sub{margin:4px 0 0;font-size:0.86rem;color:var(--muted)}
.st-card{padding:18px 20px;border-radius:var(--r-xl)}
.st-card-h{margin:0 0 12px;font-family:var(--font-head);font-size:0.96rem;font-weight:800;letter-spacing:-0.01em}
.st-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.st-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--r-md);border:1px solid var(--border);background:var(--surface)}
.st-row-dot{width:10px;height:10px;border-radius:50%}
.st-row.is-ok .st-row-dot{background:var(--green);box-shadow:0 0 0 4px rgba(22,163,74,0.18)}
.st-row.is-bad .st-row-dot{background:var(--red);box-shadow:0 0 0 4px rgba(239,68,68,0.18)}
.st-row-name{font-weight:700;font-size:0.88rem;color:var(--text)}
.st-row-val{font-family:var(--font-head);font-weight:800;font-variant-numeric:tabular-nums;font-size:0.84rem;color:var(--text)}
.st-foot{text-align:center;font-size:0.86rem;margin-top:8px}
.st-standalone{background:var(--bg);min-height:100vh;display:flex;flex-direction:column}
.st-topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 24px;border-bottom:1px solid var(--border);background:var(--surface);
}
.st-topbar-brand{font-family:var(--font-head);font-weight:800;font-size:0.88rem;letter-spacing:0.06em;color:var(--text)}
.st-topbar-pill{
  font-size:0.72rem;font-weight:800;text-transform:uppercase;letter-spacing:0.08em;
  padding:5px 12px;border-radius:999px;
}
.st-topbar-pill.is-ok{background:rgba(22,163,74,0.12);color:var(--green);border:1px solid rgba(22,163,74,0.25)}
.st-topbar-pill.is-bad{background:rgba(239,68,68,0.12);color:var(--red);border:1px solid rgba(239,68,68,0.25)}
.st-main{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:32px 16px 48px}
.st-main .st-shell{width:min(720px,100%)}
.st-footer{text-align:center;padding:16px;font-size:0.78rem;border-top:1px solid var(--border)}

/* ===== Halaman watch (video per bab) ===== */
.watch-shell{width:min(1180px,calc(100% - 32px));display:flex;flex-direction:column;gap:20px}
.watch-head{padding:22px 24px;border-radius:var(--r-2xl)}
.watch-kicker{margin:0 0 4px;font-size:0.72rem;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted)}
.watch-title{margin:0;font-family:var(--font-head);font-size:clamp(1.3rem,1.5vw + 0.5rem,1.85rem);font-weight:800;letter-spacing:-0.03em;line-height:1.15}
.watch-lead{margin:8px 0 0;font-size:0.9rem;color:var(--text2);line-height:1.55;max-width:62ch}
.watch-layout{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:18px;align-items:start}
@media(max-width:900px){.watch-layout{grid-template-columns:1fr}}
.watch-sidebar{padding:16px 14px;border-radius:var(--r-xl);max-height:min(72vh,640px);overflow:auto;position:sticky;top:88px}
@media(max-width:900px){.watch-sidebar{position:static;max-height:none}}
.watch-sidebar-h{margin:0 0 12px;font-family:var(--font-head);font-size:0.92rem;font-weight:800;letter-spacing:-0.01em}
.watch-chapters{display:flex;flex-direction:column;gap:8px}
.watch-chapter{border:1px solid var(--border);border-radius:var(--r-lg);background:rgba(2,6,23,0.02);overflow:hidden}
html[data-theme="dark"] .watch-chapter{background:rgba(255,255,255,0.03)}
.watch-chapter-sum{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 14px;cursor:pointer;font-weight:700;font-size:0.88rem;list-style:none;
  user-select:none;
}
.watch-chapter-sum::-webkit-details-marker{display:none}
.watch-chapter-title{flex:1;min-width:0;color:var(--text)}
.watch-chapter-count{font-size:0.72rem;font-weight:700;color:var(--muted);white-space:nowrap}
.watch-ch-empty{padding:0 14px 12px;font-size:0.82rem}
.watch-vlist{list-style:none;margin:0;padding:0 0 8px;display:flex;flex-direction:column;gap:2px}
.watch-vlist-flat{padding:0}
.watch-vitem a,.watch-vlink-disabled{
  display:flex;align-items:flex-start;gap:10px;padding:9px 14px 9px 12px;text-decoration:none;color:inherit;font-size:0.86rem;
  border-left:3px solid transparent;transition:background 160ms,border-color 160ms;
}
.watch-vitem a:hover{background:rgba(14,165,233,0.06)}
.watch-vitem.is-active a{background:rgba(14,165,233,0.1);border-left-color:var(--accent);font-weight:700}
.watch-vitem.is-locked .watch-vlink-disabled{opacity:0.55;cursor:not-allowed}
.watch-vico{flex-shrink:0;width:18px;text-align:center;font-size:0.72rem;line-height:1.5;color:var(--muted)}
.watch-vtext{display:flex;flex-direction:column;gap:2px;min-width:0}
.watch-vtitle{line-height:1.35;color:var(--text)}
.watch-vtag{font-size:0.68rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--accent)}
.watch-player{padding:18px;border-radius:var(--r-2xl)}
.watch-player-empty{
  min-height:280px;display:flex;align-items:center;justify-content:center;
  border:1px dashed var(--border);border-radius:var(--r-xl);color:var(--muted);font-size:0.92rem;
}
.watch-player-tools{margin-top:14px;display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}

/* ===== Halaman Kursus Saya ===== */
.ks-shell{width:min(1180px,calc(100% - 32px));display:flex;flex-direction:column;gap:20px}
.ks-anim{opacity:0;transform:translateY(16px);animation:dbFadeUp 560ms var(--ease) forwards;animation-delay:var(--anim-delay,0ms)}
.ks-crumbs{display:flex;align-items:center;gap:8px;font-size:0.84rem;color:var(--muted)}
.ks-crumbs a{color:var(--text2);font-weight:600}
.ks-crumbs a:hover{color:var(--accent)}
.ks-crumbs-here{color:var(--text);font-weight:700}
.ks-hero{
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:22px 28px;
  padding:26px 28px;border-radius:var(--r-2xl);
  background:linear-gradient(135deg,rgba(214,26,163,0.08),rgba(37,99,235,0.06) 60%,transparent);
  position:relative;overflow:hidden;
}
.ks-hero::before{
  content:'';position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,rgba(214,26,163,0.25),transparent 65%);pointer-events:none;
}
.ks-hero-text{min-width:0;flex:1 1 280px;position:relative;z-index:1}
.ks-hero-kicker{margin:0 0 6px;font-size:0.72rem;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted)}
.ks-hero-title{margin:0 0 6px;font-family:var(--font-head);font-size:clamp(1.4rem,1.8vw + 0.6rem,2rem);font-weight:800;letter-spacing:-0.03em;line-height:1.1}
.ks-hero-lead{margin:0;font-size:0.92rem;color:var(--text2);line-height:1.6;max-width:54ch}
.ks-hero-stats{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px;position:relative;z-index:1;
}
.ks-hero-stats li{
  min-width:96px;padding:12px 14px;border-radius:var(--r-lg);
  background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;gap:4px;align-items:center;
}
.ks-stat-num{font-family:var(--font-head);font-size:1.4rem;font-weight:800;letter-spacing:-0.03em;line-height:1;color:var(--text)}
.ks-stat-lbl{font-size:0.7rem;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted)}

.ks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.ks-card{
  display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-xl);
  background:var(--surface);border:1px solid var(--border);
  box-shadow:0 6px 20px rgba(2,6,23,0.05);
  transition:transform 240ms var(--ease),box-shadow 240ms var(--ease),border-color 240ms var(--ease);
}
.ks-card:hover{transform:translateY(-4px);border-color:var(--border2);box-shadow:0 18px 36px rgba(2,6,23,0.1)}
.ks-card-cover{
  position:relative;aspect-ratio:16/9;
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent2) 60%,#7c3aed 100%);
  display:flex;align-items:center;justify-content:center;color:#fff;
}
.ks-card-cover::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 30% 20%,rgba(255,255,255,0.25),transparent 55%);
}
.ks-card-cover-play{
  position:relative;z-index:1;width:54px;height:54px;border-radius:50%;
  background:rgba(255,255,255,0.95);color:var(--accent);display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;padding-left:4px;box-shadow:0 10px 24px rgba(0,0,0,0.2);
  transition:transform 240ms var(--ease);
}
.ks-card:hover .ks-card-cover-play{transform:scale(1.12)}
.ks-card-cover-tag{
  position:absolute;top:12px;left:12px;z-index:1;padding:4px 10px;border-radius:999px;
  background:rgba(0,0,0,0.35);color:#fff;font-size:0.72rem;font-weight:700;letter-spacing:0.04em;backdrop-filter:blur(4px);
}
.ks-card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:10px;flex:1}
.ks-card-title{margin:0;font-family:var(--font-head);font-size:1rem;font-weight:800;letter-spacing:-0.02em;line-height:1.3;color:var(--text)}
.ks-card-desc{margin:0;font-size:0.84rem;color:var(--text2);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.ks-card-meta{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:0.78rem;color:var(--muted)}
.ks-card-meta li{display:inline-flex;align-items:center;gap:5px}
.ks-card-cta{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:6px}

.ks-empty{padding:48px 24px;text-align:center;border-radius:var(--r-2xl)}
.ks-empty-art{display:flex;justify-content:center;color:var(--accent);margin-bottom:14px}
.ks-empty-title{margin:0 0 8px;font-family:var(--font-head);font-size:1.1rem;font-weight:800;letter-spacing:-0.02em}
.ks-empty-text{margin:0 auto 18px;font-size:0.9rem;color:var(--muted);max-width:46ch;line-height:1.55}
.ks-empty-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.dash-hero{
  display:flex;flex-wrap:wrap;gap:22px;align-items:flex-end;justify-content:space-between;
  padding:26px 28px;border-radius:var(--r-2xl);
}
.dash-hero-title{font-size:clamp(1.35rem,2vw + 0.5rem,1.85rem);margin:0 0 8px;font-family:var(--font-head);font-weight:800;letter-spacing:-0.03em;line-height:1.15}
.dash-hero-lead{margin:0;max-width:52ch;font-size:0.92rem;color:var(--text2);line-height:1.7}
.dash-hero-stats{display:flex;flex-wrap:wrap;gap:14px}
.dash-mini{
  min-width:100px;padding:12px 14px;border-radius:var(--r-lg);
  background:rgba(2,6,23,0.03);border:1px solid var(--border);text-align:center;
}
html[data-theme="dark"] .dash-mini{background:rgba(255,255,255,0.04)}
.dash-mini-val{display:block;font-family:var(--font-head);font-size:1.45rem;font-weight:800;letter-spacing:-0.03em}
.dash-mini-lbl{display:block;font-size:0.72rem;color:var(--muted);margin-top:4px;text-transform:uppercase;letter-spacing:0.06em}
.dash-panel{padding:22px 24px}
.dash-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
@media(max-width:640px){.dash-form-grid{grid-template-columns:1fr}}
.dash-subhead{font-size:0.88rem;font-weight:700;margin:0 0 6px;font-family:var(--font-head)}
.dash-hint{font-size:0.78rem;color:var(--muted);margin:6px 0 0}
.dash-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
@media(max-width:960px){.dash-two{grid-template-columns:1fr}}
.dash-empty{text-align:center;padding:36px 16px;color:var(--muted)}
.dash-empty-ico{font-size:2.2rem;margin-bottom:10px;line-height:1}
.dash-course-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.dash-course-row{
  display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;
  padding:16px 0;border-bottom:1px solid var(--border);
}
.dash-course-row:last-child{border-bottom:none}
.dash-course-info{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.dash-course-meta{font-size:0.78rem;color:var(--muted)}
.dash-course-actions{display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}
@media(max-width:960px){
  .dash-layout{grid-template-columns:1fr}
  .dash-side{position:static;display:grid;grid-template-columns:1fr auto;align-items:start;gap:16px}
  .dash-nav{flex-direction:row;flex-wrap:wrap;border-top:none;padding-top:0;grid-column:1/-1}
  .dash-navlink{white-space:nowrap}
  .dash-admincta{grid-column:1/-1}
}

.dash-shell-v2{width:min(1180px,calc(100% - 40px))}
.dash-shell-v2 .dash-hero{border:1px solid var(--border);box-shadow:var(--shadow-md)}
.dash-shell-v2 .dash-panel{border:1px solid var(--border)}

/* Ikon Google kecil (badge admin, dll.) */
.ico-google-badge{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle}
.ico-google-badge svg{display:block;width:100%;height:100%}

/* ——— Admin panel (rombak UI) ——— */
.adm-shell{width:min(1280px,calc(100% - 40px))}
.adm-migrate-banner{border-radius:var(--r-xl);margin-bottom:18px}
.adm-top{
  display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;justify-content:space-between;
  padding:20px 22px;border-radius:var(--r-2xl);margin-bottom:16px;
}
.adm-top-main{min-width:0;flex:1}
.adm-top-kicker{
  font-size:0.72rem;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted);margin:0 0 6px;
}
.adm-top-title{
  font-family:var(--font-head);font-size:clamp(1.2rem,1.5vw + 0.5rem,1.6rem);
  font-weight:800;letter-spacing:-0.03em;margin:0 0 6px;line-height:1.15;
}
.adm-top-desc{margin:0;max-width:52ch;font-size:0.88rem;color:var(--text2);line-height:1.6}
.adm-top-aside{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right}
.adm-top-rev{padding:12px 16px;border-radius:var(--r-xl);border:1px solid var(--border);background:rgba(2,6,23,0.02);min-width:200px}
html[data-theme="dark"] .adm-top-rev{background:rgba(255,255,255,0.04)}
.adm-top-rev-lbl{display:block;font-size:0.68rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.adm-top-rev-val{font-family:var(--font-head);font-size:clamp(1rem,1.8vw,1.28rem);font-weight:800;letter-spacing:-0.03em}
.adm-tabs{
  display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;margin-bottom:22px;border-radius:var(--r-xl);
  align-items:center;
}
.adm-tabs.adm-tabs-scroll{
  flex-wrap:nowrap;margin-bottom:18px;padding-bottom:6px;
}
.adm-tabs-scroll{
  flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;
  padding-bottom:4px;margin-bottom:18px;
}
.adm-tabs-scroll::-webkit-scrollbar{height:6px}
.adm-tabs-scroll::-webkit-scrollbar-thumb{background:rgba(2,6,23,0.15);border-radius:999px}
html[data-theme="dark"] .adm-tabs-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.12)}
.adm-tabs-scroll .adm-tab{flex-shrink:0}
@media(min-width:900px){
  .adm-tabs-scroll{position:sticky;top:80px;z-index:30;padding-top:10px;padding-bottom:10px;margin-top:-4px}
}
.adm-tab{
  padding:9px 14px;border-radius:var(--r-full);font-size:0.82rem;font-weight:700;
  color:var(--text2);transition:background 160ms var(--ease),color 160ms;
}
.adm-tab:hover{background:rgba(2,6,23,0.05);color:var(--text)}
html[data-theme="dark"] .adm-tab:hover{background:rgba(255,255,255,0.06)}
.adm-tab.is-active{
  background:linear-gradient(135deg,rgba(214,26,163,0.14),rgba(37,99,235,0.1));
  color:var(--text);border:1px solid var(--border2);
}
.adm-kpi-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
@media(max-width:900px){.adm-kpi-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.adm-kpi-row{grid-template-columns:1fr}}
.adm-kpi{padding:16px 18px;border-radius:var(--r-xl);display:flex;flex-direction:column;gap:4px}
.adm-kpi-lbl{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted)}
.adm-kpi-val{font-family:var(--font-head);font-size:1.55rem;font-weight:800;letter-spacing:-0.03em;line-height:1.1}
.adm-kpi-sub{font-size:0.78rem;color:var(--text2)}
.adm-kpi-accent{background:linear-gradient(145deg,rgba(214,26,163,0.08),rgba(56,189,248,0.06))}
.adm-kpi-money{font-size:1.15rem !important}
.adm-range-bar{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding:12px 16px;border-radius:var(--r-xl);margin-bottom:18px;
}
.adm-range-lbl{font-size:0.82rem;font-weight:600;color:var(--text2)}
.adm-range-select{max-width:160px;padding:9px 12px;font-size:0.86rem}
.adm-range-hint{flex:1;min-width:200px;font-size:0.78rem;color:var(--muted);line-height:1.45}
.adm-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media(max-width:960px){.adm-chart-grid{grid-template-columns:1fr}}
.adm-chart-card{padding:18px 20px}
.adm-chart-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:space-between}
.adm-chart-head h2{margin:0;font-size:1rem}
.adm-chart-caption{margin:0 0 10px;font-size:0.78rem;color:var(--muted)}
.adm-chart-canvas{position:relative;height:220px;width:100%}
.adm-chart-canvas-tall{height:280px}
.adm-mini-server{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:16px 18px;border-radius:var(--r-xl);margin-top:4px;
}
@media(max-width:768px){.adm-mini-server{grid-template-columns:1fr}}
.adm-mini-cell{display:flex;flex-direction:column;gap:4px}
.adm-mini-lbl{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--muted)}
.adm-user-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,400px);gap:20px;align-items:start}
@media(max-width:1024px){.adm-user-grid{grid-template-columns:1fr}}
.adm-panel-list{min-width:0}
.adm-panel-detail{position:sticky;top:88px}
@media(max-width:1024px){.adm-panel-detail{position:static}}
.adm-table-head h2{font-size:1.05rem}
.adm-table-wrap{border-radius:var(--r-lg);overflow:hidden}
.adm-table{width:100%;border-collapse:collapse;font-size:0.86rem}
.adm-table thead th{
  text-align:left;padding:10px 12px;font-size:0.68rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;
  color:var(--muted);background:rgba(2,6,23,0.03);border-bottom:1px solid var(--border);
}
html[data-theme="dark"] .adm-table thead th{background:rgba(255,255,255,0.04)}
.adm-table tbody td{padding:11px 12px;border-bottom:1px solid var(--border);vertical-align:middle;color:var(--text2)}
.adm-table tbody tr:hover td{background:rgba(2,6,23,0.02);color:var(--text)}
html[data-theme="dark"] .adm-table tbody tr:hover td{background:rgba(255,255,255,0.03)}
.adm-table tbody tr.is-active td{background:rgba(214,26,163,0.08)}
.adm-th-n{width:48px}.adm-th-act{width:100px;text-align:right}
.adm-th-act,.adm-table td:last-child{text-align:right}
.adm-td-muted{color:var(--muted);font-variant-numeric:tabular-nums;font-size:0.82rem}
.adm-td-name{font-weight:700;font-size:0.9rem;color:var(--text)}
.adm-td-email{font-size:0.8rem;word-break:break-all;max-width:240px}
.adm-verify-cell{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.adm-google-wrap{display:inline-flex;align-items:center;vertical-align:middle}
.adm-google-pill{
  display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 6px;border-radius:999px;
  font-size:0.76rem;font-weight:700;background:rgba(56,189,248,0.1);border:1px solid rgba(56,189,248,0.22);color:var(--text2);
}
.adm-mail-tests-wrap{margin-top:20px}
.adm-mail-tests-form{margin-top:4px}
.adm-mail-tests-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px;
}
@media(max-width:1100px){.adm-mail-tests-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.adm-mail-tests-grid{grid-template-columns:1fr}}
.adm-mail-card{
  padding:16px 18px;border-radius:var(--r-xl);display:flex;flex-direction:column;gap:0;min-height:100%;
}
.adm-mail-card-title{margin:0 0 6px;font-size:0.98rem;font-weight:800;letter-spacing:-0.02em;color:var(--text)}
.adm-mail-card-desc{margin:0 0 12px;font-size:0.8rem;line-height:1.5;color:var(--muted)}
.adm-mail-card-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.adm-mail-tests-all{border:1px solid var(--border)}

/* ——— UI refresh (kurang “template AI”, lebih solid & rapi) ——— */
.ui-panel{
  background:var(--surface);
  border:1px solid var(--border);
  box-shadow:0 8px 22px rgba(2,6,23,0.06);
  border-radius:var(--r-xl);
}
.ui-panel-strong{
  background:var(--surface);
  border:1px solid var(--border2);
  box-shadow:0 14px 36px rgba(2,6,23,0.08);
  border-radius:var(--r-2xl);
}
html[data-theme="dark"] .ui-panel,
html[data-theme="dark"] .ui-panel-strong{
  box-shadow:0 12px 32px rgba(0,0,0,0.35);
}

.brand-lockup{align-items:center;gap:12px;text-decoration:none;color:inherit}
.brand-text-stack{display:flex;flex-direction:column;gap:1px;line-height:1.1;min-width:0}
.brand-text-title{
  font-family:var(--font-head);font-weight:800;font-size:1.02rem;letter-spacing:-0.03em;
  color:rgba(17,24,39,0.92);white-space:nowrap;
}
.brand-text-sub{font-size:0.72rem;font-weight:600;color:var(--muted);letter-spacing:0.04em;text-transform:uppercase}
html[data-theme="dark"] .brand-text-title{color:rgba(234,242,255,0.96)}
@media(max-width:420px){
  .brand-text-sub{display:none}
  .brand-text-title{font-size:0.92rem}
}

.auth-devnote{
  padding:14px 16px;border-radius:var(--r-lg);margin-bottom:18px;font-size:0.84rem;line-height:1.55;color:var(--text2);
  border:1px dashed rgba(234,179,8,0.45);background:rgba(250,204,21,0.08);
}
.auth-devnote strong{display:block;margin-bottom:6px;color:var(--text);font-size:0.78rem;letter-spacing:0.06em;text-transform:uppercase}
.auth-devnote code{font-size:0.78rem;background:rgba(2,6,23,0.06);padding:2px 6px;border-radius:6px}
html[data-theme="dark"] .auth-devnote{border-color:rgba(250,204,21,0.35);background:rgba(250,204,21,0.06)}

.auth-foot-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:16px;font-size:0.88rem}
.auth-foot-note{margin-top:10px;font-size:0.8rem;line-height:1.55;text-align:left}

.modal-overlay{
  position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(15,23,42,0.45);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity 200ms var(--ease);
}
.modal-overlay.is-open{opacity:1;pointer-events:auto}
.modal-card{max-width:420px;width:100%;padding:22px 22px 20px;border-radius:var(--r-xl)}
.modal-title{margin:0 0 8px;font-size:1.2rem;font-family:var(--font-head);font-weight:800;letter-spacing:-0.02em}
.modal-desc{margin:0 0 14px;font-size:0.88rem;line-height:1.55}
.modal-recap{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:10px}
.modal-recap li{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:var(--r-md);background:rgba(2,6,23,0.03);border:1px solid var(--border)}
.modal-recap strong{font-size:0.72rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--muted)}
.modal-recap span{font-size:0.92rem;font-weight:600;color:var(--text);word-break:break-word}
.modal-count{margin:0 0 14px;font-size:0.82rem}
.modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:480px){.modal-actions{grid-template-columns:1fr}}

.section-tight{padding:48px 0 64px}

.dash-hero{
  display:flex;flex-direction:column;gap:18px;
  padding:22px 22px 20px;border-radius:var(--r-2xl);
}
@media(min-width:900px){
  .dash-hero{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(0,0.8fr);
    grid-template-rows:auto auto;
    gap:18px 22px;
    align-items:start;
  }
  .dash-hero-copy{grid-column:1;grid-row:1}
  .dash-hero-stats{grid-column:2;grid-row:1 / span 2;justify-content:flex-end}
  .dash-quick{grid-column:1;grid-row:2}
}
.dash-quick{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;
}
@media(max-width:720px){.dash-quick{grid-template-columns:1fr}}
.dash-qcard{
  display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:var(--r-lg);
  border:1px solid var(--border);background:rgba(2,6,23,0.02);text-decoration:none;color:inherit;
  transition:border-color 180ms,transform 180ms var(--ease),background 180ms;
}
.dash-qcard:hover{border-color:rgba(14,165,233,0.45);background:rgba(14,165,233,0.06);transform:translateY(-1px)}
html[data-theme="dark"] .dash-qcard{background:rgba(255,255,255,0.04)}
.dash-qcard-k{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted)}
.dash-qcard-t{font-size:0.9rem;font-weight:700;color:var(--text)}

.dash-course-row{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;
  padding:16px 4px;border-bottom:1px solid var(--border);
}
.co-paypulse::after{display:none}

.adm-devtools-hint{margin:12px 0 0;font-size:0.78rem;line-height:1.55;color:var(--muted)}
