@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=Nunito:wght@400;600;700;800;900&display=swap');

:root {
  --ink:#28344d;
  --muted:#70809d;
  --line:#e8e9f4;
  --white:#fff;
  --purple:#8b5cf6;
  --purple-2:#b985ff;
  --blue:#4f7cff;
  --pink:#ff6e9d;
  --rose:#ff758b;
  --mint:#4fd1c5;
  --green:#4fbf72;
  --orange:#ffb347;
  --yellow:#ffd65a;
  --shadow:0 15px 35px rgba(76,72,125,.10);
  --shadow-soft:0 8px 22px rgba(76,72,125,.08);
  --radius-xl:30px;
  --radius-lg:24px;
  --radius-md:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:'Nunito',sans-serif;background:#fbfbff;background-image:radial-gradient(#e9e7f7 1.2px,transparent 1.2px);background-size:22px 22px}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
.hidden{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Common */
.page-wrap{max-width:1450px;margin:0 auto;padding:22px}
.glass{background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-soft)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft)}
.card-pad{padding:22px}
.muted{color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:7px 12px;font-weight:800;font-size:.86rem}
.soft-purple{background:#f1eaff;color:#764bd7}.soft-blue{background:#e8f0ff;color:#3968e6}.soft-pink,.soft-rose{background:#ffe9f1;color:#eb527f}.soft-green{background:#e7f8ec;color:#2e9c55}.soft-orange{background:#fff0d8;color:#d9891b}.soft-cyan{background:#e4fbff;color:#058aa3}
.btn{border:0;border-radius:16px;padding:12px 18px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s ease;box-shadow:0 7px 15px rgba(66,67,107,.10)}
.btn:hover{transform:translateY(-2px);filter:saturate(1.06)}
.btn-primary{background:linear-gradient(135deg,#6d8cff,#596df8);color:#fff}.btn-pink{background:linear-gradient(135deg,#ff7ba6,#ff668c);color:#fff}.btn-purple{background:linear-gradient(135deg,#a871ff,#8358e9);color:#fff}.btn-green{background:linear-gradient(135deg,#5bcf7f,#39ac63);color:#fff}.btn-light{background:#f6f6fb;color:#5c6880;border:1px solid #e8e8f2;box-shadow:none}.btn-danger{background:#fff0f2;color:#db4260;border:1px solid #ffd5dc;box-shadow:none}
.section-title{display:flex;align-items:center;gap:10px;font-family:'Baloo 2',cursive;font-size:1.35rem;font-weight:800;margin:0 0 14px}.section-title small{font-family:'Nunito';font-size:.82rem;color:var(--muted);font-weight:700}
.progress{height:10px;background:#edf0f7;border-radius:999px;overflow:hidden}.progress>span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#6c8aff,#84a1ff)}
.progress.pink>span{background:linear-gradient(90deg,#ff6f9d,#ff9abc)}.progress.green>span{background:linear-gradient(90deg,#4cbd72,#8cdda4)}.progress.purple>span{background:linear-gradient(90deg,#8d5def,#bf8eff)}
.empty{padding:35px;text-align:center;color:var(--muted);background:#fff;border:1px dashed #dfe1ec;border-radius:22px}

/* Landing */
.landing{min-height:100vh;padding:18px 18px 35px;position:relative;overflow:hidden}
.landing:before,.landing:after{content:"";position:fixed;border-radius:50%;filter:blur(3px);z-index:-1;opacity:.45}.landing:before{width:360px;height:360px;background:#dbfff6;top:-100px;left:-80px}.landing:after{width:420px;height:420px;background:#ffe0ee;right:-120px;bottom:-130px}
.landing-top{max-width:1180px;margin:0 auto 14px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:flex;align-items:center;gap:11px;font-family:'Baloo 2';font-weight:800;font-size:1.2rem}.brand-mark{width:45px;height:45px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,#fff0f8,#eef6ff);border:2px solid white;box-shadow:var(--shadow-soft);font-size:1.45rem}.admin-link{padding:9px 14px;border-radius:999px;background:#fff8e7;color:#ca7b13;border:1px solid #ffe2ad;font-weight:900}
.hero-login{max-width:1180px;margin:0 auto 26px;border-radius:34px;overflow:hidden;box-shadow:0 20px 45px rgba(79,95,146,.13);border:4px solid rgba(255,255,255,.95);background:#fff}.hero-login img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;object-position:center}
.profile-grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.profile-card{position:relative;border-radius:30px;padding:28px;background:#fff;text-align:center;border:3px solid var(--accent-soft);box-shadow:0 12px 0 rgba(59,53,91,.06),0 26px 50px rgba(80,70,130,.08);transition:.25s ease;overflow:hidden}.profile-card:hover{transform:translateY(-7px)}.profile-card:before{content:"";position:absolute;inset:auto -60px -70px auto;width:160px;height:160px;border-radius:50%;background:var(--accent-soft);opacity:.55}.profile-avatar{width:86px;height:86px;margin:0 auto 12px;border-radius:28px;display:grid;place-items:center;font-size:3.4rem;background:var(--accent-soft);box-shadow:inset 0 0 0 6px rgba(255,255,255,.75)}.profile-card h2{font-family:'Baloo 2';margin:0;font-size:2rem;color:var(--accent)}.profile-stats{display:flex;justify-content:center;gap:12px;margin:12px 0 18px;flex-wrap:wrap}.profile-stat{background:#f8f8fc;border:1px solid #efeff7;border-radius:15px;padding:9px 13px;font-size:.87rem;font-weight:800}.profile-card .btn{width:100%;background:var(--accent);color:#fff;font-size:1rem}.landing-note{text-align:center;color:#7c8498;font-weight:700;margin-top:28px}

/* Modal */
.modal{position:fixed;inset:0;background:rgba(42,47,72,.42);backdrop-filter:blur(7px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:18px}.modal-box{width:min(430px,100%);background:#fff;border-radius:30px;padding:28px;box-shadow:0 30px 80px rgba(31,33,63,.25);border:3px solid var(--modal-soft,#eee);position:relative;animation:pop .24s ease}.modal-close{position:absolute;right:16px;top:16px;width:38px;height:38px;border-radius:50%;border:0;background:#f4f5fa;color:#65708a;font-weight:900}.modal-avatar{text-align:center;font-size:4rem}.modal-box h2{font-family:'Baloo 2';font-size:2rem;text-align:center;margin:3px 0}.modal-box p{text-align:center;margin:0 0 17px;color:var(--muted)}.field{display:flex;flex-direction:column;gap:7px}.field label{font-size:.88rem;font-weight:900;color:#4c5871}.input,.select,.textarea{width:100%;border:2px solid #e8e9f1;background:#fbfbfd;border-radius:16px;padding:12px 14px;outline:none;color:#364159;transition:.2s}.input:focus,.select:focus,.textarea:focus{border-color:#a694f4;box-shadow:0 0 0 4px #f0ecff}.textarea{min-height:110px;resize:vertical}.error-box,.success-box,.notice-box{padding:12px 14px;border-radius:15px;font-weight:800;margin:0 0 14px}.error-box{background:#fff0f3;color:#cf4162;border:1px solid #ffd4df}.success-box{background:#effaf1;color:#2d9c56;border:1px solid #cbefd5}.notice-box{background:#fff8e8;color:#9a741a;border:1px solid #f7e2a9}@keyframes pop{from{opacity:0;transform:scale(.94) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}

/* App shell */
.app-shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:20px 14px;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-right:1px solid #ededf6;display:flex;flex-direction:column;z-index:20}.sidebar-logo{display:flex;align-items:center;gap:10px;padding:0 9px 18px}.sidebar-logo strong{font-family:'Baloo 2';font-size:1.25rem}.side-nav{display:flex;flex-direction:column;gap:7px}.side-link{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:15px;font-weight:800;color:#69748d;transition:.2s}.side-link span:first-child{font-size:1.25rem}.side-link:hover,.side-link.active{background:#f1edff;color:#684ed7}.side-link.active{box-shadow:inset 0 0 0 1px #e1d7ff}.side-spacer{flex:1}.side-quote{padding:15px;border-radius:20px;background:linear-gradient(145deg,#fff2f7,#f2f5ff);font-size:.82rem;font-weight:800;line-height:1.45;color:#616c82;margin-bottom:12px}.content-shell{min-width:0}.topbar{position:sticky;top:0;z-index:15;height:74px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;background:rgba(251,251,255,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(232,232,243,.85)}.top-links{display:flex;gap:8px;align-items:center}.top-link{padding:9px 12px;border-radius:13px;font-weight:800;color:#68748d}.top-link:hover,.top-link.active{background:#f0ecff;color:#6b50d9}.student-chip{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e8e8f1;border-radius:999px;padding:6px 11px 6px 7px;box-shadow:var(--shadow-soft)}.student-chip .avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#f5f2ff;font-size:1.35rem}.student-chip strong{font-size:.88rem}.student-chip small{display:block;color:var(--muted);font-size:.72rem}.app-main{padding:18px 22px 35px;max-width:1500px;margin:0 auto}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:18px}.dashboard-main{min-width:0;display:flex;flex-direction:column;gap:18px}.dashboard-side{display:flex;flex-direction:column;gap:18px}.hero-mini{border-radius:28px;overflow:hidden;background:#fff;border:3px solid #fff;box-shadow:var(--shadow)}.hero-mini img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;object-position:center}
.student-summary{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);gap:16px}.welcome-card{padding:20px 22px;border-radius:24px;background:linear-gradient(135deg,#f2efff 0%,#eef7ff 52%,#fff1f6 100%);border:1px solid #e8e4fb;display:flex;align-items:center;gap:18px}.big-avatar{width:82px;height:82px;border-radius:26px;display:grid;place-items:center;font-size:3.3rem;background:rgba(255,255,255,.82);box-shadow:var(--shadow-soft);flex:0 0 auto}.welcome-card h1{font-family:'Baloo 2';font-size:1.7rem;margin:0 0 2px}.welcome-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.score-card{padding:18px;border-radius:24px;background:#fff;border:1px solid #eee9ff;display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;box-shadow:var(--shadow-soft)}.score-star{font-size:3rem;filter:drop-shadow(0 6px 6px rgba(255,184,34,.2))}.score-number{font-family:'Baloo 2';font-weight:800;font-size:1.8rem;color:#7a51d5}.score-card small{display:block;color:var(--muted);font-weight:700}.subject-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.subject-card{background:#fff;border:1px solid #ececf5;border-radius:20px;padding:16px 14px;box-shadow:var(--shadow-soft);transition:.22s;min-height:126px}.subject-card:hover{transform:translateY(-4px);border-color:var(--subject-color,#9fb5ff)}.subject-icon{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;font-size:1.7rem;background:var(--subject-soft,#edf2ff);margin-bottom:9px}.subject-card strong{display:block;font-size:.95rem}.subject-card small{display:block;color:var(--muted);font-size:.75rem;margin-top:4px}.lesson-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.lesson-card{border-radius:22px;padding:15px;background:#fff;border:1px solid #ebecf4;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;min-height:196px}.lesson-card .lesson-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.lesson-subject{font-weight:900;font-size:.78rem;color:var(--lesson-color,#5374da)}.lesson-card h3{font-size:.96rem;line-height:1.35;margin:8px 0 4px}.lesson-card p{font-size:.74rem;color:var(--muted);line-height:1.4;margin:0}.lesson-card .lesson-bottom{margin-top:auto;padding-top:11px}.lesson-percent{display:flex;justify-content:space-between;color:#778199;font-size:.72rem;font-weight:800;margin-bottom:6px}.lesson-card .btn{width:100%;padding:9px;margin-top:10px;border-radius:13px;font-size:.78rem}
.mission-card,.ranking-card{padding:18px}.mission-list{display:flex;flex-direction:column;gap:14px}.mission{display:grid;grid-template-columns:24px 1fr auto;gap:9px;align-items:center}.mission-check{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#eef2fa;color:#97a0b4;font-size:.75rem;font-weight:900}.mission.done .mission-check{background:#e3f8e9;color:#38a85c}.mission strong{font-size:.82rem}.mission small{display:block;color:var(--muted);font-size:.7rem}.mission-count{font-size:.74rem;font-weight:900;color:#67718a}.ranking-list{display:flex;flex-direction:column;gap:9px}.rank-row{display:grid;grid-template-columns:27px 38px 1fr auto;align-items:center;gap:8px;padding:8px 9px;border-radius:14px;background:#fafaff}.rank-no{font-weight:900;color:#7b8294}.rank-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f2effc;font-size:1.25rem}.rank-name{font-weight:900;font-size:.82rem}.rank-score{font-size:.76rem;font-weight:900;color:#7653ca}.reward-card{padding:18px;background:linear-gradient(135deg,#fff9e9,#fff2f6);border:1px solid #fbe4bc}.reward-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.badge{background:rgba(255,255,255,.82);border:1px solid #f0e7d7;border-radius:18px;padding:13px;text-align:center}.badge .badge-icon{font-size:2.1rem}.badge strong{display:block;font-size:.76rem;margin-top:4px}.badge small{font-size:.65rem;color:var(--muted)}

/* Syllabus */
.course-layout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:18px}.subject-sidebar{padding:15px;align-self:start;position:sticky;top:92px}.subject-filter{display:flex;align-items:center;gap:10px;padding:11px;border-radius:14px;font-weight:800;color:#647089;margin-bottom:5px}.subject-filter:hover,.subject-filter.active{background:#f3efff;color:#6d4ed5}.subject-filter .mini-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#fff;box-shadow:0 3px 9px rgba(59,65,97,.08)}.course-panel{display:flex;flex-direction:column;gap:15px}.course-head{padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:linear-gradient(135deg,#eff4ff,#fff0f6)}.course-head h1{font-family:'Baloo 2';margin:0;font-size:1.7rem}.chapter{overflow:hidden}.chapter-head{padding:15px 18px;background:#f8f9ff;border-bottom:1px solid #ececf5;display:flex;align-items:center;justify-content:space-between;gap:10px}.chapter-head h2{font-family:'Baloo 2';font-size:1.1rem;margin:0}.lesson-row{display:grid;grid-template-columns:42px 1fr auto;gap:13px;align-items:center;padding:14px 16px;border-bottom:1px solid #f0f0f5;transition:.18s}.lesson-row:last-child{border-bottom:0}.lesson-row:hover{background:#fbfbff}.lesson-state{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#f3f4fa;font-size:1.1rem}.lesson-row.done .lesson-state{background:#e8f9ee}.lesson-row h3{margin:0 0 3px;font-size:.95rem}.lesson-row p{margin:0;font-size:.74rem;color:var(--muted)}.lesson-action{display:flex;align-items:center;gap:8px}.mini-progress{width:80px}.complete-label{font-size:.72rem;font-weight:900;color:#2e9e56}

/* Lesson */
.lesson-page{min-height:100vh;padding:18px}.lesson-topbar{max-width:1280px;margin:0 auto 15px;padding:11px 14px;border-radius:20px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}.lesson-title{text-align:center;min-width:0}.lesson-title strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lesson-title small{color:var(--muted)}.lesson-layout{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px}.video-card{padding:14px;position:relative}.video-wrap{aspect-ratio:16/9;background:#111827;border-radius:20px;overflow:hidden;position:relative}.video-wrap>div{width:100%;height:100%}.timeline{height:28px;margin-top:11px;position:relative}.timeline-track{position:absolute;left:0;right:0;top:11px;height:8px;background:#eceef5;border-radius:999px;overflow:hidden}.timeline-fill{height:100%;width:0;background:linear-gradient(90deg,#708dff,#aa7df0)}.cue{position:absolute;top:6px;width:18px;height:18px;border-radius:50%;background:#ffd34e;border:3px solid #fff;box-shadow:0 2px 6px rgba(56,58,89,.18);transform:translateX(-50%);z-index:3}.video-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;color:var(--muted);font-size:.78rem;font-weight:800}.lesson-info{padding:18px;align-self:start;position:sticky;top:15px}.lesson-info h1{font-family:'Baloo 2';font-size:1.45rem;margin:5px 0 8px}.lesson-info p{font-size:.82rem;line-height:1.55;color:var(--muted)}.tip-box{padding:13px;background:#f5f1ff;border-radius:16px;color:#625786;font-size:.78rem;font-weight:700;line-height:1.5;margin-top:12px}.question-overlay,.complete-overlay{position:absolute;inset:14px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);z-index:10;border-radius:22px;display:flex;align-items:center;justify-content:center;padding:22px}.quiz-box{width:min(680px,100%);background:linear-gradient(145deg,#fff,#f8f5ff);border:2px solid #e8ddff;border-radius:26px;padding:24px;box-shadow:0 22px 55px rgba(76,59,126,.16)}.quiz-kicker{text-align:center;color:#8260d8;font-weight:900}.quiz-box h2{font-family:'Baloo 2';text-align:center;font-size:1.55rem;margin:5px 0 17px}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quiz-option{border:2px solid #e5e6f0;background:#fff;border-radius:16px;padding:12px 13px;text-align:left;font-weight:800;color:#46516a;transition:.18s}.quiz-option:hover{border-color:#aa8bf0;background:#faf7ff}.quiz-option.selected{border-color:#7f61db;background:#f1ebff}.quiz-option.correct{border-color:#45b96a;background:#ecfbf1}.quiz-option.wrong{border-color:#ef6f86;background:#fff0f3}.quiz-feedback{min-height:28px;text-align:center;font-weight:900;margin:13px 0 5px}.complete-box{text-align:center;width:min(520px,100%)}.complete-box .trophy{font-size:5rem;animation:bob 1.2s ease-in-out infinite alternate}.complete-box h2{font-family:'Baloo 2';font-size:2rem;color:#3aad66;margin:5px 0}.complete-box p{color:var(--muted);font-weight:700}.confetti-piece{position:fixed;width:10px;height:16px;border-radius:3px;z-index:2000;animation:confetti-fall 2.4s ease-out forwards}@keyframes confetti-fall{0%{transform:translateY(-8vh) rotate(0);opacity:1}100%{transform:translateY(110vh) rotate(720deg);opacity:0}}@keyframes bob{to{transform:translateY(-9px) rotate(2deg)}}

/* Admin */
.admin-body{background:#f7f8fc;background-image:none}.admin-login{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 10%,#eee7ff,transparent 38%),radial-gradient(circle at 80% 85%,#ffe8ef,transparent 35%),#f8f9ff}.admin-login-card{width:min(430px,100%);padding:28px}.admin-login-icon{width:74px;height:74px;margin:0 auto 10px;border-radius:24px;display:grid;place-items:center;font-size:2.8rem;background:#f0ebff}.admin-login h1{font-family:'Baloo 2';text-align:center;margin:0}.admin-shell{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}.admin-sidebar{background:#20263a;color:#c7ccdc;padding:20px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.admin-sidebar h2{font-family:'Baloo 2';color:#fff;margin:0 8px 18px}.admin-nav a{display:flex;gap:10px;padding:11px 12px;border-radius:13px;font-weight:800;margin:5px 0}.admin-nav a:hover,.admin-nav a.active{background:#343c57;color:#fff}.admin-main{min-width:0}.admin-top{height:68px;background:#fff;border-bottom:1px solid #e7e9f0;display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:10}.admin-content{padding:22px;max-width:1280px;margin:0 auto}.admin-grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:17px;align-items:start}.admin-form{padding:19px}.admin-form h2,.admin-table h2{font-family:'Baloo 2';font-size:1.25rem;margin:0 0 13px}.form-stack{display:flex;flex-direction:column;gap:12px}.admin-table{padding:18px;overflow:auto}.table{width:100%;border-collapse:collapse;font-size:.83rem}.table th,.table td{padding:11px 10px;border-bottom:1px solid #edf0f5;text-align:left;vertical-align:top}.table th{color:#69758c;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em}.table tr:hover td{background:#fbfbfe}.table .actions{white-space:nowrap;text-align:right}.inline-form{display:inline}.admin-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:17px}.admin-stat{padding:17px}.admin-stat strong{display:block;font-family:'Baloo 2';font-size:1.7rem}.admin-stat small{color:var(--muted);font-weight:800}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.helper{font-size:.74rem;color:var(--muted);line-height:1.45}.danger-note{font-size:.76rem;color:#b34d60;background:#fff2f4;border:1px solid #ffd7df;border-radius:12px;padding:10px}

/* Responsive */
.mobile-menu{display:none;border:0;background:#f1edff;color:#674bd1;border-radius:12px;width:40px;height:40px;font-size:1.2rem}
@media (max-width:1150px){.dashboard-grid{grid-template-columns:1fr}.dashboard-side{display:grid;grid-template-columns:1fr 1fr}.subject-grid{grid-template-columns:repeat(3,1fr)}.lesson-grid{grid-template-columns:repeat(2,1fr)}.lesson-layout{grid-template-columns:1fr}.lesson-info{position:static}.admin-grid{grid-template-columns:1fr}.admin-stat-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.topbar{padding:10px 14px}.top-links{display:none}.mobile-menu{display:grid;place-items:center}.app-main{padding:14px}.student-summary{grid-template-columns:1fr}.course-layout{grid-template-columns:1fr}.subject-sidebar{position:static;display:flex;overflow:auto;gap:6px;padding:10px}.subject-filter{min-width:max-content;margin:0}.subject-grid{grid-template-columns:repeat(2,1fr)}.admin-shell{grid-template-columns:1fr}.admin-sidebar{height:auto;position:static}.admin-nav{display:flex;overflow:auto;gap:4px}.admin-nav a{min-width:max-content}.admin-sidebar .side-spacer{display:none}}
@media (max-width:650px){.landing{padding:10px}.landing-top{padding:0 4px}.brand span:last-child{display:none}.hero-login{border-radius:24px;margin-bottom:18px}.profile-grid{grid-template-columns:1fr;gap:14px}.profile-card{padding:22px}.dashboard-side{display:flex}.subject-grid,.lesson-grid,.reward-badges{grid-template-columns:1fr 1fr}.welcome-card{align-items:flex-start}.big-avatar{width:68px;height:68px;font-size:2.7rem}.app-main{padding:10px}.topbar{height:66px}.student-chip strong{font-size:.77rem}.lesson-topbar{grid-template-columns:auto 1fr}.lesson-topbar>.pill{display:none}.lesson-layout{gap:10px}.lesson-page{padding:10px}.video-card{padding:9px}.question-overlay,.complete-overlay{inset:9px;padding:10px}.quiz-box{padding:17px}.quiz-options{grid-template-columns:1fr}.course-head{align-items:flex-start;flex-direction:column}.lesson-row{grid-template-columns:38px 1fr}.lesson-action{grid-column:2}.admin-content{padding:12px}.admin-stat-grid{grid-template-columns:1fr 1fr}.choice-grid{grid-template-columns:1fr}}

/* =========================================================
   V3 GLOSSY FAMILY UI — thiết kế bóng, nổi khối, pastel cute
   ========================================================= */
.glossy-body{background:#f8f8ff;background-image:radial-gradient(#e9e6fb 1px,transparent 1px);background-size:24px 24px}
.glossy-shell{grid-template-columns:205px minmax(0,1fr)}
.glossy-sidebar{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(251,249,255,.95));box-shadow:14px 0 34px rgba(95,83,150,.07);border-right:1px solid #eeeafa;padding:16px 12px}
.family-logo{display:flex;align-items:center;gap:9px;padding:7px 7px 18px}.family-logo-faces{display:flex;align-items:center}.family-logo-faces img{width:38px;height:38px;object-fit:cover;border-radius:14px;border:2px solid white;box-shadow:0 6px 12px rgba(95,71,145,.16)}.family-logo-faces img+img{margin-left:-11px}.family-logo strong{font-family:'Baloo 2';font-size:1.28rem;color:#6f4bd4}.family-logo strong span{color:#ff7aa1}.family-logo small{display:block;font-size:.63rem;color:#8690a5;font-weight:900}
.glossy-nav .side-link{border:1px solid transparent;box-shadow:none}.glossy-nav .side-link:hover,.glossy-nav .side-link.active{background:linear-gradient(145deg,#fff,#f0eaff);border-color:#e3d8ff;box-shadow:0 8px 18px rgba(115,83,190,.10),inset 0 1px 0 #fff}.glossy-nav .side-link.active{color:#6845df}.logout-link{color:#e54d6b;border:1px solid #ffdce5;background:#fff7f9}.bunny-note{margin:10px 4px 12px;padding:13px 10px;text-align:center;border-radius:22px;background:linear-gradient(160deg,#fff,#fff1f6);border:1px solid #f4dfeb;box-shadow:0 8px 20px rgba(167,104,141,.08),inset 0 1px 0 #fff;font-size:.75rem;color:#5f6680}.bunny-note .bunny-face{font-size:3.2rem;filter:drop-shadow(0 7px 7px rgba(110,83,154,.14))}.bunny-note strong{display:block}.bunny-note span{display:block;margin-top:6px}
.glossy-topbar{height:68px;padding:8px 20px;background:rgba(255,255,255,.90);border-bottom:1px solid #eeeaf7;box-shadow:0 6px 22px rgba(79,67,128,.04)}.glossy-topbar .top-link{border:1px solid transparent}.glossy-topbar .top-link.active,.glossy-topbar .top-link:hover{background:linear-gradient(145deg,#f7f2ff,#fff);border-color:#e6dcff;box-shadow:0 6px 14px rgba(91,68,147,.10),inset 0 1px 0 #fff}.top-actions{display:flex;align-items:center;gap:10px}.gem-pill{padding:9px 13px;border-radius:16px;background:linear-gradient(145deg,#f1ecff,#fff);border:1px solid #e5dbff;color:#7952da;font-weight:1000;box-shadow:0 7px 15px rgba(98,74,155,.10),inset 0 1px 0 #fff}.glossy-chip{box-shadow:0 7px 18px rgba(74,67,116,.09),inset 0 1px 0 #fff;background:linear-gradient(145deg,#fff,#fbfaff)}.avatar-img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 3px 10px rgba(102,80,151,.18)}
.glossy-main{padding:14px 18px 28px;max-width:1700px}.pro-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px}.pro-main,.pro-side{display:flex;flex-direction:column;gap:12px;min-width:0}.glossy-panel{position:relative;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(252,250,255,.95));border:1px solid rgba(224,220,241,.9);box-shadow:0 13px 30px rgba(71,62,120,.09),0 2px 4px rgba(71,62,120,.04),inset 0 1px 0 rgba(255,255,255,.95);border-radius:22px;overflow:hidden}.glossy-panel:after{content:"";position:absolute;left:10px;right:10px;top:3px;height:32%;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.28),transparent);pointer-events:none}
.family-hero{height:245px;background:radial-gradient(circle at 10% 25%,#e9f9ff 0 12%,transparent 32%),radial-gradient(circle at 90% 25%,#ffe8f2 0 13%,transparent 35%),linear-gradient(115deg,#dff8ff 0%,#eee8ff 45%,#ffe5ef 100%);border:3px solid #fff;display:grid;grid-template-columns:250px minmax(0,1fr) 230px;align-items:center;padding:0 24px}.family-hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff 2px,transparent 3px);background-size:56px 54px;opacity:.55}.hero-girl{position:relative;z-index:2;width:210px;height:210px;object-fit:cover;border-radius:42% 42% 48% 48%;filter:drop-shadow(0 15px 18px rgba(89,70,134,.18));border:5px solid rgba(255,255,255,.9);box-shadow:inset 0 0 0 2px rgba(255,255,255,.9)}.hero-tun{justify-self:start}.hero-lo{justify-self:end}.hero-copy{position:relative;z-index:3;text-align:center}.hero-kicker{display:inline-block;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.72);color:#8261d3;font-size:.68rem;font-weight:1000;letter-spacing:.12em;box-shadow:0 5px 12px rgba(88,69,132,.07)}.hero-copy h1{margin:4px 0 2px;font-family:'Baloo 2';line-height:.88;filter:drop-shadow(0 5px 0 rgba(255,255,255,.82))}.hero-copy h1 span,.hero-copy h1 strong{display:block}.hero-copy h1 span{font-size:3.05rem;color:#427fe9;-webkit-text-stroke:1px #fff}.hero-copy h1 strong{font-size:3.1rem;background:linear-gradient(90deg,#ff5f9b,#9b62ea,#ff9b46);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.65)}.hero-sub{display:inline-flex;gap:9px;align-items:center;padding:7px 16px;margin-top:9px;border-radius:999px;background:rgba(255,255,255,.78);color:#6d5a8f;font-size:.77rem;box-shadow:0 5px 14px rgba(84,67,126,.08)}.hero-sub b:first-child{color:#7551d8}.hero-sub b:last-child{color:#ee5d8d}.hero-sub i{font-style:normal;color:#55c5c7}.hero-copy p{margin:7px 0 0;font-size:.74rem;color:#715e91;font-weight:900}.float-deco{position:absolute;z-index:2;filter:drop-shadow(0 6px 7px rgba(83,67,118,.15));animation:floaty 3.2s ease-in-out infinite}.d1{left:25%;top:28px;font-size:1.6rem}.d2{left:7%;top:28px;font-size:2rem}.d3{right:22%;top:23px;font-size:2rem}.d4{right:7%;top:45px;font-size:1.8rem}@keyframes floaty{50%{transform:translateY(-8px) rotate(3deg)}}
.sister-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sister-card{--sister:#8b5cf6;--sister-soft:#efe8ff;display:grid;grid-template-columns:95px minmax(0,1fr) auto;gap:13px;align-items:center;padding:12px 14px;border-color:color-mix(in srgb,var(--sister) 22%,#fff)}.sister-card.is-current{box-shadow:0 14px 31px color-mix(in srgb,var(--sister) 14%,transparent),inset 0 1px 0 #fff}.sister-card>img{width:88px;height:88px;border-radius:50%;object-fit:cover;border:5px solid #fff;box-shadow:0 7px 17px color-mix(in srgb,var(--sister) 22%,transparent);background:var(--sister-soft)}.sister-title{display:flex;align-items:center;gap:8px}.sister-title h2{font-family:'Baloo 2';margin:0;color:var(--sister);font-size:1.5rem}.sister-title span{padding:4px 9px;border-radius:999px;background:var(--sister);color:#fff;font-weight:900;font-size:.66rem;box-shadow:0 5px 11px color-mix(in srgb,var(--sister) 23%,transparent)}.sister-info>small{display:block;color:#707b92;font-weight:800;margin-top:-2px}.sister-stats{display:flex;gap:7px;flex-wrap:wrap;margin:8px 0 7px}.sister-stats span{padding:6px 8px;border-radius:11px;background:linear-gradient(145deg,#fff,var(--sister-soft));border:1px solid color-mix(in srgb,var(--sister) 13%,#fff);font-size:.64rem;color:#69748b}.sister-stats b{color:var(--sister);font-size:.8rem}.glossy-progress{height:8px;box-shadow:inset 0 2px 4px rgba(87,80,126,.10)}.mini-go{align-self:center;padding:9px 12px;border-radius:13px;color:#fff;font-size:.7rem;font-weight:1000;box-shadow:0 7px 13px color-mix(in srgb,var(--sister) 26%,transparent);white-space:nowrap}.muted-go{background:#f4f2f8!important;color:#9394a5;box-shadow:none;max-width:120px;white-space:normal;text-align:center}
.subject-strip{padding:12px}.strip-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 2px 10px;position:relative;z-index:2}.strip-head h2{font-family:'Baloo 2';font-size:1.1rem;margin:0;color:#5e46c8}.strip-head h2 span{font-family:'Nunito';font-size:.64rem;padding:5px 9px;border-radius:999px;background:linear-gradient(145deg,#8d69ef,#b281ff);color:#fff;margin-left:5px;box-shadow:0 5px 10px rgba(114,81,188,.19)}.strip-head small{color:#8892a6;font-weight:800}.glossy-subject-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;position:relative;z-index:2}.glossy-subject{position:relative;isolation:isolate;min-width:0;padding:7px 6px 8px;text-align:center;border-radius:17px;background:linear-gradient(150deg,#fff,#fbfaff);border:1px solid #e7e3f3;box-shadow:0 8px 16px rgba(69,61,107,.07),inset 0 1px 0 #fff;transition:.2s ease}.glossy-subject:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 13px 23px rgba(72,62,118,.13),inset 0 1px 0 #fff}.subject-art-wrap{height:66px;border-radius:14px;overflow:hidden;margin-bottom:5px;position:relative}.subject-art-wrap:after{content:"";position:absolute;left:8%;right:8%;top:5px;height:33%;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.65),transparent);pointer-events:none}.subject-art-wrap img{width:100%;height:100%;object-fit:cover}.glossy-subject strong{display:block;font-size:.68rem;line-height:1.15;color:#43506b;min-height:31px}.glossy-subject small{display:block;color:#ee7a34;font-size:.56rem;font-weight:900;margin-top:3px}.sibling-subject{opacity:.82;cursor:default}.sibling-subject:hover{transform:none}
.reward-zone{padding:12px 14px;background:linear-gradient(135deg,#fff9ea,#fff4f7 42%,#f5f0ff)}.glossy-badges{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;position:relative;z-index:2}.glossy-badge{text-align:center;padding:8px;border-radius:16px;background:rgba(255,255,255,.72);border:1px solid rgba(235,222,203,.85);box-shadow:inset 0 1px 0 #fff}.glossy-badge div{width:54px;height:54px;margin:0 auto 4px;border-radius:50%;display:grid;place-items:center;font-size:2rem;background:radial-gradient(circle at 35% 25%,#fff,#ffe69c 40%,#ffa94d);border:4px solid #fff;box-shadow:0 8px 13px rgba(198,126,51,.18),inset 0 2px 5px rgba(255,255,255,.75)}.glossy-badge strong{display:block;font-size:.65rem}.glossy-badge small{font-size:.54rem;color:#8e8a9a}
.stat-ribbon{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.stat-tile{display:flex;align-items:center;gap:10px;padding:12px;border-radius:19px;border:1px solid #e5e3f0;box-shadow:0 9px 18px rgba(66,60,108,.08),inset 0 1px 0 #fff}.stat-tile>span{font-size:2rem;filter:drop-shadow(0 5px 6px rgba(72,60,110,.14))}.stat-tile small{display:block;font-size:.58rem;color:#7f899e;font-weight:900}.stat-tile strong{font-family:'Baloo 2';font-size:1.25rem}.stat-tile.blue{background:linear-gradient(145deg,#eef8ff,#fff)}.stat-tile.purple{background:linear-gradient(145deg,#f3edff,#fff)}.stat-tile.pink{background:linear-gradient(145deg,#fff0f5,#fff)}.stat-tile.violet{background:linear-gradient(145deg,#f0edff,#fff)}
.pro-side{position:relative}.side-gloss{padding:13px}.side-title{display:flex;align-items:center;justify-content:space-between;gap:8px;position:relative;z-index:2}.side-title h2{font-family:'Baloo 2';font-size:1.02rem;margin:0;color:#55458f}.side-title>a{font-size:.58rem;color:#7a5ada;font-weight:900}.task-row{position:relative;z-index:2;display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:7px;padding:9px 3px;border-bottom:1px solid #efedf6}.task-row:last-child{border-bottom:0}.task-check{font-size:1.15rem;color:#55b775}.task-row strong{font-size:.7rem}.task-row small{font-size:.6rem;color:#6f78a0;font-weight:900}.family-progress-row{position:relative;z-index:2;display:grid;grid-template-columns:1fr 100px 35px;align-items:center;gap:8px;margin:10px 0}.family-progress-row b{font-size:.62rem}.family-progress-row strong{font-size:.63rem;color:#6d53ce}.family-progress-row .progress{height:7px}
.science-quick{background:linear-gradient(160deg,#8a6dea 0,#7051db 22%,#fff 22.3%,#fff 100%);padding-top:0}.science-head{height:62px;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 14px;position:relative;z-index:2}.science-head div{display:flex;align-items:center;gap:7px}.science-head div span{font-size:1.4rem}.science-head strong{font-family:'Baloo 2';font-size:1rem}.science-head a{font-size:.57rem;font-weight:900}.science-tabs{margin:0 10px 8px;display:grid;grid-template-columns:1fr 1fr 1fr;border-radius:13px;background:#f6f3ff;padding:3px;position:relative;z-index:2}.science-tabs>*{text-align:center;padding:6px 3px;font-size:.6rem}.science-tabs b{background:#fff;border-radius:10px;color:#6a4ed5;box-shadow:0 3px 9px rgba(81,67,132,.09)}.science-list{max-height:420px;overflow:auto;padding:0 10px 7px;position:relative;z-index:2}.science-row{display:grid;grid-template-columns:24px 1fr 25px;align-items:center;gap:6px;padding:7px 4px;border-bottom:1px solid #efedf4}.science-row .no{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#f0edff;color:#7454d6;font-size:.55rem;font-weight:1000}.science-row strong{font-size:.61rem;line-height:1.2;display:block}.science-row small{display:block;font-size:.48rem;color:#a1a4b2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.science-action{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;font-size:.58rem}.science-action.ready{background:#e9f9ef;color:#39aa63}.science-action.locked{background:#f4f1fb;color:#9b8fb5}.science-go{display:block;margin:5px 10px 11px;text-align:center;padding:10px;border-radius:12px;background:linear-gradient(90deg,#7653dc,#936ff0);color:#fff;font-size:.68rem;font-weight:1000;box-shadow:0 7px 13px rgba(104,77,189,.24);position:relative;z-index:2}.science-go.disabled{background:#ece9f4;color:#9992aa;box-shadow:none;pointer-events:none}.continue-box>strong{display:block;margin:9px 0 2px;font-size:.8rem}.continue-box>small{display:block;color:#8a93a7;font-size:.64rem;margin-bottom:9px}.continue-box .btn{width:100%;margin-top:10px;font-size:.68rem;padding:9px}


/* Glossy catalog / syllabus */
.catalog-top{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin-bottom:14px}.catalog-top h1{font-family:'Baloo 2';font-size:1.8rem;margin:0;color:#514376}.catalog-top p{margin:3px 0 0;color:#8892a6;font-size:.8rem}.catalog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.catalog-card{border-radius:23px;background:linear-gradient(145deg,#fff,#fbfaff);border:1px solid #e7e3f1;box-shadow:0 13px 28px rgba(69,61,107,.09),inset 0 1px 0 #fff;overflow:hidden;transition:.22s}.catalog-card:hover{transform:translateY(-5px);box-shadow:0 18px 34px rgba(72,62,118,.14),inset 0 1px 0 #fff}.catalog-cover{height:150px;position:relative;overflow:hidden;background:#f5f3ff}.catalog-cover img{width:100%;height:100%;object-fit:cover}.catalog-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.35),transparent 45%,rgba(55,42,91,.03))}.catalog-body{padding:12px 13px 14px}.catalog-body strong{font-size:.84rem;display:block}.catalog-body p{font-size:.65rem;color:#8992a6;line-height:1.35;min-height:35px;margin:4px 0}.catalog-count{color:#ff7a2d;font-size:.64rem;font-weight:1000}.course-panel.glossy-course .chapter{box-shadow:0 8px 19px rgba(70,63,106,.06),inset 0 1px 0 #fff}.course-panel.glossy-course .chapter-head{background:linear-gradient(180deg,#fbfaff,#f7f6fc)!important}.lesson-subgroup{padding:10px 16px;background:linear-gradient(90deg,#f0ebff,#fff0f6);font-family:'Baloo 2';font-weight:900;color:#6f54ce;border-top:1px solid #e5dfff;border-bottom:1px solid #e8e1fa}.lesson-row.no-video{cursor:default}.lesson-row.no-video:hover{background:#fff}.lesson-state.glossy-state{box-shadow:0 5px 10px rgba(70,63,106,.10),inset 0 1px 0 #fff}.video-missing{padding:5px 9px;border-radius:999px;background:#f3f1f7;color:#9892a4;font-size:.65rem;font-weight:900}.video-ready{padding:5px 9px;border-radius:999px;background:#e9f8ef;color:#39a862;font-size:.65rem;font-weight:900}

/* Admin V3 quick editor */
.lesson-edit-details{min-width:310px}.lesson-edit-details summary{cursor:pointer;color:#6548cf;font-weight:900;font-size:.72rem}.lesson-edit-box{display:grid;grid-template-columns:1fr 90px;gap:7px;margin-top:8px;padding:9px;background:#f8f6ff;border-radius:12px}.lesson-edit-box .wide{grid-column:1/-1}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px}.status-dot.ready{background:#4fbe74;box-shadow:0 0 0 4px #e8f8ee}.status-dot.wait{background:#b8afc7;box-shadow:0 0 0 4px #f1eef5}
.video-placeholder{aspect-ratio:16/9;border-radius:20px;background:radial-gradient(circle at 50% 10%,#fff,transparent 35%),linear-gradient(145deg,#f0eaff,#eaf7ff 55%,#fff1f6);display:grid;place-items:center;text-align:center;padding:30px;border:2px dashed #d8d0ed}.video-placeholder .big{font-size:4rem;filter:drop-shadow(0 10px 12px rgba(81,66,126,.14))}.video-placeholder h2{font-family:'Baloo 2';font-size:1.6rem;margin:7px 0;color:#7053d0}.video-placeholder p{color:#7f889d;max-width:520px;margin:0 auto;line-height:1.5}

@media(max-width:1350px){.glossy-subject-grid{grid-template-columns:repeat(5,1fr)}.family-hero{grid-template-columns:190px 1fr 180px}.hero-girl{width:170px;height:170px}.hero-copy h1 span,.hero-copy h1 strong{font-size:2.5rem}.pro-layout{grid-template-columns:minmax(0,1fr) 310px}}
@media(max-width:1120px){.pro-layout{grid-template-columns:1fr}.pro-side{display:grid;grid-template-columns:1fr 1fr}.science-quick{grid-row:span 2}.glossy-subject-grid{grid-template-columns:repeat(4,1fr)}.catalog-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.glossy-shell{grid-template-columns:1fr}.glossy-sidebar{display:none}.family-hero{grid-template-columns:120px 1fr 110px;height:205px;padding:0 12px}.hero-girl{width:110px;height:145px;border-radius:32px}.hero-copy h1 span,.hero-copy h1 strong{font-size:2.05rem}.hero-sub{font-size:.64rem}.sister-cards{grid-template-columns:1fr}.glossy-subject-grid{grid-template-columns:repeat(3,1fr)}.stat-ribbon{grid-template-columns:1fr 1fr}.catalog-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.top-actions .gem-pill{display:none}.glossy-main{padding:9px}.family-hero{height:180px;grid-template-columns:75px 1fr 70px}.hero-girl{width:72px;height:108px;border-width:3px;border-radius:25px}.hero-copy h1 span,.hero-copy h1 strong{font-size:1.55rem}.hero-kicker,.hero-copy p{display:none}.hero-sub{font-size:.53rem;padding:5px 8px;gap:4px}.pro-side{display:flex}.glossy-subject-grid{grid-template-columns:repeat(2,1fr)}.subject-art-wrap{height:82px}.sister-card{grid-template-columns:72px 1fr}.sister-card>img{width:68px;height:68px}.sister-card .mini-go{grid-column:1/-1;justify-self:stretch;text-align:center}.glossy-badges{grid-template-columns:repeat(2,1fr)}.stat-ribbon{grid-template-columns:1fr}.catalog-grid{grid-template-columns:1fr}.catalog-cover{height:180px}.strip-head{align-items:flex-start;flex-direction:column}.family-progress-row{grid-template-columns:1fr 80px 32px}}
.glossy-landing{padding:14px 18px 35px}.login-hero{max-width:1180px;margin:0 auto 24px}.glossy-profile-grid{max-width:1000px}.glossy-profile{box-shadow:0 14px 28px rgba(69,61,107,.10),0 4px 0 rgba(99,83,143,.03),inset 0 1px 0 #fff}.glossy-profile:after{content:"";position:absolute;inset:5px 18px auto;height:34%;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.4),transparent);pointer-events:none}.profile-photo{position:relative;z-index:2;width:112px;height:112px;object-fit:cover;border-radius:50%;margin:0 auto 10px;border:6px solid #fff;box-shadow:0 11px 22px color-mix(in srgb,var(--accent) 22%,transparent)}

/* ==================== V6.3 • NHIỀU VIDEO TRONG MỘT BÀI ==================== */
.video-playlist-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin:2px 2px 12px}.video-playlist-head>div{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.video-playlist-head strong{font-family:'Baloo 2';font-size:1rem;color:#514376}.video-playlist-head small{color:#8d94a5;font-weight:800}.video-playlist{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin-bottom:12px}.video-playlist-item{display:grid;grid-template-columns:34px 1fr 26px;align-items:center;gap:8px;padding:9px 10px;border-radius:16px;background:linear-gradient(145deg,#fff,#fbf9ff);border:1px solid #e9e3f7;box-shadow:0 7px 17px rgba(78,63,126,.07),inset 0 1px 0 #fff;transition:.18s}.video-playlist-item:hover{transform:translateY(-2px);border-color:#cdbef5}.video-playlist-item.active{background:linear-gradient(145deg,#f2ecff,#fff3f8);border-color:#a889ef;box-shadow:0 9px 20px rgba(117,83,201,.15),inset 0 1px 0 #fff}.video-playlist-item.done{border-color:#bfe8cf}.video-order{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#8865ed,#b58cff);color:#fff;font-weight:1000;box-shadow:0 5px 10px rgba(105,76,192,.24)}.video-playlist-text{min-width:0}.video-playlist-text strong,.video-playlist-text small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-playlist-text strong{font-size:.76rem;color:#4f5670}.video-playlist-text small{font-size:.62rem;color:#9299aa;margin-top:2px}.video-check{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#f0ebff;color:#6f53d2;font-size:.7rem;font-weight:1000}.video-playlist-item.done .video-check{background:#e7f8ed;color:#36a75c}.single-video-title{display:flex;align-items:center;gap:8px;margin:2px 2px 10px;color:#54466f}.single-video-title span{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#f0ebff}.single-video-title strong{font-family:'Baloo 2';font-size:1rem}.multi-video-intro{margin-bottom:16px;background:linear-gradient(135deg,#f4efff,#fff7fb);border:1px solid #e6dcff}.video-edit-details summary{cursor:pointer;color:#6548cf;font-weight:900}.video-edit-box{min-width:280px;display:flex;flex-direction:column;gap:7px;margin-top:8px;padding:10px;background:#f8f6ff;border-radius:12px}.check-card{display:flex;align-items:center;gap:8px;min-height:44px;padding:9px 11px;border:1px solid #e4e6ef;border-radius:13px;background:#fff;font-size:.76rem;font-weight:800;color:#59647b}.check-card input{width:17px;height:17px;accent-color:#7659dd}.video-admin-grid .admin-table{min-width:0}
@media(max-width:760px){.video-playlist-head{align-items:flex-start;flex-direction:column}.video-playlist{grid-template-columns:1fr}.video-playlist-item{grid-template-columns:34px minmax(0,1fr) 26px}}