:root{--bg:#f5f7fb;--card:#fff;--text:#152238;--muted:#6f7d90;--primary:#2457e6;--primary2:#3e7bfa;--line:#e7ecf3;--ok:#19a974;--warn:#f2a93b;--danger:#df4a5d;--shadow:0 12px 36px rgba(23,41,77,.08)}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text)}a{color:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:#fff;border-right:1px solid var(--line);padding:22px 16px;z-index:40;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;padding:0 8px 24px}.brand-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--primary),#7c56f5);color:#fff;display:grid;place-items:center;font-weight:900;font-size:21px}.brand b{display:block}.brand span{display:block;color:var(--muted);font-size:12px;margin-top:2px}.sidebar nav{display:grid;gap:6px}.nav-item{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:12px;text-decoration:none;color:#526075;font-weight:650;font-size:14px}.nav-item:hover,.nav-item.active{background:#eef4ff;color:#174bcf}.nav-dot{width:9px;height:9px;border:2px solid currentColor;border-radius:50%}.sidebar-foot{margin-top:auto;padding:14px 10px;border-top:1px solid var(--line);display:grid;gap:4px}.sidebar-foot .small{font-size:11px;color:var(--muted)}.sidebar-foot a{font-size:13px;color:var(--danger);margin-top:5px}.main{margin-left:250px;min-height:100vh}.topbar{height:76px;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 28px;position:sticky;top:0;z-index:30}.page-title{font-weight:800;font-size:19px}.page-sub{font-size:12px;color:var(--muted);margin-top:3px}.version{margin-left:auto;font-size:12px;color:var(--muted);background:#f2f5f9;padding:7px 10px;border-radius:10px}.hamb{display:none;border:0;background:#f2f5f9;border-radius:10px;padding:9px 11px;font-size:18px}.content{padding:26px}.grid{display:grid;gap:18px}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 1px 2px rgba(20,32,55,.02)}.stat{display:flex;justify-content:space-between;align-items:flex-start}.stat .num{font-size:30px;font-weight:850;margin-top:7px}.muted{color:var(--muted)}.small{font-size:12px}.badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:750;background:#eef4ff;color:#2457e6}.badge.ok{background:#e8f8f1;color:#11845b}.badge.warn{background:#fff6e5;color:#b8750b}.section-title{display:flex;justify-content:space-between;align-items:center;margin:26px 0 12px}.section-title h2{font-size:17px;margin:0}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:11px;padding:10px 14px;background:var(--primary);color:#fff;text-decoration:none;font-weight:700;cursor:pointer}.btn.secondary{background:#eef2f7;color:#33435a}.btn.danger{background:#fff0f1;color:#c83449}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:16px}table{border-collapse:collapse;width:100%;min-width:650px}th,td{padding:13px 15px;border-bottom:1px solid var(--line);text-align:left;font-size:13px}th{color:#6c798c;font-size:11px;text-transform:uppercase;letter-spacing:.04em;background:#fbfcfe}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:750;color:#526075}.field input,.field select,.field textarea{width:100%;border:1px solid #dce3ed;border-radius:11px;padding:11px 12px;font:inherit;background:#fff;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:#6f94f1;box-shadow:0 0 0 3px #edf3ff}.alert{padding:12px 14px;border-radius:12px;margin-bottom:15px;font-size:13px}.alert.success{background:#eaf8f2;color:#11704f}.alert.error{background:#fff0f2;color:#a52f41}.alert.info{background:#edf4ff;color:#234ea8}.habit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.habit{border:1px solid var(--line);border-radius:16px;padding:15px;display:flex;gap:12px;align-items:center}.habit input{width:20px;height:20px}.habit .icon{width:38px;height:38px;border-radius:12px;background:#eef4ff;display:grid;place-items:center;font-weight:850;color:var(--primary)}.progressbar{height:10px;background:#edf1f6;border-radius:999px;overflow:hidden}.progressbar>i{display:block;height:100%;background:linear-gradient(90deg,var(--primary),#62a1ff);border-radius:inherit}.hero{background:linear-gradient(135deg,#153b9f,#2f67ef 58%,#7657ef);color:#fff;border-radius:24px;padding:28px;box-shadow:var(--shadow)}.hero h1{margin:0 0 8px;font-size:27px}.hero p{margin:0;color:#dbe6ff;max-width:720px}.login-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 20%,#dce8ff,transparent 35%),var(--bg)}.login-card{width:min(430px,100%);background:#fff;border-radius:24px;padding:28px;box-shadow:var(--shadow);border:1px solid var(--line)}.login-card .logo{width:54px;height:54px;border-radius:17px;background:linear-gradient(135deg,var(--primary),#7957f2);color:#fff;display:grid;place-items:center;font-weight:900;font-size:24px;margin-bottom:18px}.login-card h1{font-size:22px;margin:0 0 6px}.login-card p{margin:0 0 22px;color:var(--muted);font-size:13px}.upload-zone{border:2px dashed #cdd7e5;border-radius:16px;padding:24px;text-align:center;background:#fbfcff}.update-status{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center}.mobile-nav{display:none}@media(max-width:980px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:1fr 1fr}.sidebar{transform:translateX(-105%);transition:.2s}.menu-open .sidebar{transform:none;box-shadow:var(--shadow)}.main{margin-left:0}.hamb{display:block}}@media(max-width:640px){.content{padding:16px 14px 86px}.topbar{height:68px;padding:0 14px}.page-title{font-size:16px}.page-sub{max-width:210px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.grid-4,.grid-3,.grid-2,.form-grid,.habit-grid{grid-template-columns:1fr}.hero{padding:20px;border-radius:18px}.hero h1{font-size:22px}.card{padding:16px;border-radius:15px}.stat .num{font-size:26px}.version{font-size:10px}.sidebar{width:280px}}
/* KAIH v1.0.1 */
.menu-overlay{display:none}.nav-icon{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:#f4f7fb;font-size:14px;flex:0 0 28px}.nav-item.active .nav-icon{background:#dfeaff}.brand span{max-width:155px;line-height:1.35}.user-chip{display:flex;gap:10px;align-items:center}.user-chip>div:last-child{display:grid}.user-chip span{font-size:10px;color:var(--muted)}.avatar{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#dfe9ff,#efe8ff);display:grid;place-items:center;color:#2457e6;font-weight:850}.avatar.sm{width:34px;height:34px;border-radius:11px}.logout{text-decoration:none}.top-actions{margin-left:auto;display:flex;gap:8px;align-items:center}.role-pill{font-size:11px;font-weight:750;background:#eef4ff;color:#2457e6;padding:7px 10px;border-radius:10px}.version{margin-left:0}.hero.admin-hero{display:flex;justify-content:space-between;align-items:center;gap:25px}.hero-kicker,.eyebrow{font-size:10px;letter-spacing:.12em;font-weight:850}.hero-kicker{color:#bcd1ff;display:block;margin-bottom:9px}.hero-score{min-width:190px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:17px 20px;display:grid;text-align:right}.hero-score span,.hero-score small{font-size:11px;color:#dbe6ff}.hero-score strong{font-size:30px;line-height:1.15}.stat-grid{margin-top:18px}.stat-card{display:flex;gap:14px;align-items:center}.stat-icon{width:44px;height:44px;border-radius:14px;background:#eef4ff;color:#2457e6;display:grid;place-items:center;font-size:20px}.stat-note{font-size:10px;color:var(--muted)}.dashboard-panels{margin-top:18px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.card-head h3{margin:3px 0 0}.eyebrow{color:#8a98ab}.habit-bars{display:grid;gap:13px}.habit-label{display:flex;justify-content:space-between;gap:12px;font-size:12px;margin-bottom:6px}.habit-label b{font-size:11px;color:#6f7d90}.student-list{display:grid}.student-item{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid var(--line)}.student-item:last-child{border-bottom:0}.student-meta{display:grid;gap:2px;min-width:0}.student-meta b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.student-meta span{font-size:11px;color:var(--muted)}.student-score{margin-left:auto;font-weight:850;font-size:12px;background:#eef8f4;color:#11845b;padding:6px 9px;border-radius:9px}.text-link{font-size:11px;color:#2457e6;text-decoration:none;font-weight:750}.empty-state{text-align:center;display:grid;justify-items:center;gap:5px;padding:28px;color:var(--muted)}.empty-state>div{font-size:28px}.empty-state b{color:var(--text)}.empty-state span{font-size:11px}.quick-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:17px;text-decoration:none;display:grid;gap:5px;transition:.18s}.quick-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:#d7e2f4}.quick-card>span{width:36px;height:36px;border-radius:11px;background:#f1f5ff;color:#2457e6;display:grid;place-items:center;margin-bottom:4px}.quick-card b{font-size:13px}.quick-card small{font-size:10px;color:var(--muted);line-height:1.45}.page-intro{margin-bottom:18px}.page-intro h1{font-size:24px;margin:5px 0}.page-intro p{margin:0;color:var(--muted);font-size:13px}.soft-card{background:linear-gradient(145deg,#fff,#f7f9ff)}.big-icon{font-size:28px;margin-bottom:18px}.academic-value{font-size:30px;font-weight:850;margin:7px 0 10px}
@media(max-width:980px){.menu-open .menu-overlay{display:block;position:fixed;inset:0;background:rgba(15,25,45,.28);z-index:35}.hero.admin-hero{align-items:stretch}.hero-score{min-width:170px}.quick-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.role-pill{display:none}.hero.admin-hero{display:grid}.hero-score{text-align:left;min-width:0}.stat-grid{grid-template-columns:repeat(2,1fr)}.stat-card{padding:14px;gap:10px}.stat-icon{width:36px;height:36px;border-radius:11px}.stat-card .num{font-size:23px}.quick-grid{grid-template-columns:repeat(2,1fr);gap:10px}.quick-card{padding:14px}.dashboard-panels{grid-template-columns:1fr}.page-intro h1{font-size:21px}}
/* KAIH v1.0.3 */
.split-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:18px}.intro-actions{display:flex;gap:9px;flex-wrap:wrap}.compact-stats{margin-bottom:18px}.management-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px}.management-card{min-width:0}.mini-search{display:flex;gap:8px;margin-bottom:14px}.mini-search input{min-width:0;flex:1;border:1px solid #dce3ed;border-radius:11px;padding:10px 12px;font:inherit}.btn.ghost{background:transparent;color:#607086;border:1px solid var(--line)}.teacher-list,.class-list{display:grid}.teacher-row,.class-card-row{display:flex;align-items:center;gap:11px;padding:12px 0;border-bottom:1px solid var(--line)}.teacher-row:last-child,.class-card-row:last-child{border-bottom:0}.teacher-main,.class-main{min-width:0;display:grid;gap:2px;flex:1}.teacher-main b,.class-main b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.teacher-main span,.class-main span,.class-main small{font-size:11px;color:var(--muted)}.class-symbol{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#eef4ff;color:#2457e6;flex:0 0 38px}.row-actions{display:flex;gap:5px;align-items:center}.row-actions form{margin:0}.icon-btn{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#536177;display:grid;place-items:center;cursor:pointer;font:inherit}.icon-btn:hover{background:#f5f8fc;color:#2457e6}.danger-icon{color:#cc4050}.modal{display:none;position:fixed;inset:0;z-index:100}.modal.show{display:block}.modal-backdrop{position:absolute;inset:0;background:rgba(18,29,49,.48);backdrop-filter:blur(3px)}.modal-card{position:relative;width:min(540px,calc(100% - 28px));max-height:calc(100vh - 28px);overflow:auto;margin:14px auto;background:#fff;border-radius:22px;padding:24px;box-shadow:0 28px 80px rgba(16,28,50,.24)}.modal-lg{width:min(900px,calc(100% - 28px))}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:20px}.modal-head h3{margin:5px 0 0;font-size:21px}.modal-x{border:0;width:40px;height:40px;border-radius:12px;background:#f3f6fa;color:#637187;font-size:21px;cursor:pointer}.modal-foot{position:sticky;bottom:-24px;background:#fff;border-top:1px solid var(--line);margin:20px -24px -24px;padding:14px 24px;display:flex;justify-content:flex-end;gap:9px;z-index:3}.modal-card .field+.field{margin-top:13px}.modal-card .form-grid .field+.field{margin-top:0}.password-wrap{display:flex;position:relative}.password-wrap input{padding-right:48px}.password-toggle{position:absolute;right:5px;top:5px;bottom:5px;width:38px;border:0;border-radius:9px;background:#f2f5f9;cursor:pointer}.modal-open{overflow:hidden}
@media(max-width:980px){.management-grid{grid-template-columns:1fr}.split-intro{align-items:flex-start}}
@media(max-width:640px){.split-intro{display:grid}.intro-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.intro-actions .btn{width:100%}.mini-search{display:grid;grid-template-columns:1fr auto}.mini-search .ghost{display:none}.teacher-row,.class-card-row{align-items:flex-start}.teacher-row>.badge{display:none}.row-actions{flex-wrap:wrap;justify-content:flex-end}.modal-card{padding:18px;margin:8px auto;max-height:calc(100vh - 16px);width:min(100% - 16px,540px);border-radius:18px}.modal-lg{width:min(100% - 16px,900px)}.modal-foot{bottom:-18px;margin:18px -18px -18px;padding:12px 18px}.modal-head{margin-bottom:16px}.modal-head h3{font-size:19px}}
/* KAIH v1.0.5 - Student Experience */
.student-hero{display:flex;justify-content:space-between;gap:18px;align-items:center}.student-hero .hero-score{text-align:center;min-width:150px}.student-stats{margin-top:18px}.student-stat{display:flex;gap:12px;align-items:center}.student-stat .stat-icon{flex:0 0 42px}.student-stat strong{display:block;font-size:24px;line-height:1.1;margin:2px 0}.habit-today{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.habit-card{border:1px solid var(--line);border-radius:17px;padding:14px;background:#fff;display:grid;gap:10px;transition:.18s}.habit-card.done{border-color:#bfe8d7;background:#f5fcf9}.habit-card-top{display:flex;gap:11px;align-items:center}.habit-card .habit-check{margin-left:auto;width:24px;height:24px;accent-color:var(--primary)}.habit-card textarea{width:100%;min-height:66px;resize:vertical;border:1px solid #dce3ed;border-radius:11px;padding:10px;font:inherit;font-size:12px}.habit-desc{font-size:10px;color:var(--muted)}.student-section-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.student-section-head h2,.student-section-head h3{margin:0}.day-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.day-box{padding:12px 8px;border-radius:13px;background:#f7f9fc;text-align:center;display:grid;gap:3px}.day-box strong{font-size:16px}.day-box span{font-size:9px;color:var(--muted)}.day-box.complete{background:#eaf8f2;color:#11845b}.day-box.partial{background:#fff6e5;color:#a66b08}.reflection-mood{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mood-option{position:relative}.mood-option input{position:absolute;opacity:0;pointer-events:none}.mood-option span{display:grid;place-items:center;gap:4px;border:1px solid var(--line);border-radius:14px;padding:14px;cursor:pointer;font-size:12px}.mood-option span b{font-size:24px}.mood-option input:checked+span{border-color:#7a9cf4;background:#eef4ff;color:#174bcf}.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.portfolio-card{overflow:hidden;padding:0}.portfolio-media{height:150px;background:#f1f4f9;display:grid;place-items:center;color:#8a98ab}.portfolio-media img{width:100%;height:100%;object-fit:cover}.portfolio-body{padding:15px}.portfolio-body h3{margin:0 0 6px;font-size:14px}.portfolio-body p{font-size:11px;line-height:1.5}.student-profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.profile-field{background:#f8fafc;border:1px solid var(--line);border-radius:13px;padding:13px}.profile-field span{display:block;font-size:10px;color:var(--muted);margin-bottom:4px}.profile-field b{font-size:13px}.mobile-nav.student-mobile-nav{display:none}.student-greeting{font-size:11px;color:#dbe6ff;margin-bottom:5px}.score-ring{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#fff var(--score),rgba(255,255,255,.18) 0);position:relative}.score-ring:after{content:"";position:absolute;inset:7px;border-radius:50%;background:rgba(41,82,220,.94)}.score-ring>div{position:relative;z-index:1;text-align:center}.score-ring strong{font-size:20px}.score-ring span{display:block;font-size:9px;color:#dbe6ff}
@media(max-width:640px){body.student-role .content{padding-bottom:94px}.student-hero{display:grid}.student-hero .hero-score{display:none}.student-stats{grid-template-columns:repeat(2,1fr)}.student-stat{padding:13px}.student-stat strong{font-size:21px}.habit-today,.portfolio-grid,.student-profile-grid{grid-template-columns:1fr}.day-strip{gap:5px}.day-box{padding:9px 4px}.day-box strong{font-size:14px}.mobile-nav.student-mobile-nav{position:fixed;left:8px;right:8px;bottom:8px;height:68px;background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:0 12px 35px rgba(19,37,70,.15);border-radius:20px;z-index:45;display:grid;grid-template-columns:repeat(5,1fr);padding:6px}.student-mobile-nav a{text-decoration:none;display:grid;place-items:center;align-content:center;gap:2px;border-radius:14px;color:#78869a;font-size:9px;font-weight:700}.student-mobile-nav a .mn-icon{font-size:18px;line-height:1}.student-mobile-nav a.active{background:#eef4ff;color:#2457e6}.reflection-mood{gap:7px}.mood-option span{padding:11px 7px}}

/* KAIH v1.0.8 — Teacher monitoring */
.teacher-hero{display:flex;align-items:center;justify-content:space-between;gap:28px}.hero-eyebrow{color:rgba(255,255,255,.78)}.hero-score{min-width:180px;padding:18px 22px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.12);border-radius:22px;text-align:right}.hero-score span,.hero-score small{display:block;color:rgba(255,255,255,.8);font-size:12px}.hero-score strong{display:block;color:#fff;font-size:34px;line-height:1.1;margin:4px 0}.teacher-dashboard-grid{margin-top:18px;align-items:start}.card-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.text-link{font-size:13px;font-weight:750;text-decoration:none;color:var(--primary)}.class-summary-list,.student-watch-list{display:grid;gap:10px;margin-top:14px}.class-summary-item{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:var(--text);transition:.2s}.class-summary-item:hover{border-color:#b9c8f8;transform:translateY(-1px)}.class-summary-item div:nth-child(2){display:grid;gap:2px}.class-summary-item span{font-size:12px;color:var(--muted)}.class-summary-item strong{font-size:13px}.class-badge{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#eef3ff;color:var(--primary);font-weight:850}.student-watch-item{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid var(--line)}.student-watch-item:last-child{border-bottom:0}.student-watch-main{flex:1;min-width:0}.student-watch-main b,.student-watch-main span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.student-watch-main span{font-size:12px;color:var(--muted);margin-top:2px}.empty-state.compact{min-height:170px}.teacher-filter{display:grid;grid-template-columns:minmax(280px,1fr) 220px auto auto auto;gap:10px;align-items:center;margin-bottom:16px}.filter-count{font-size:13px;color:var(--muted);white-space:nowrap}.student-monitor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.student-monitor-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow-sm)}.smc-top{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center}.smc-top h3{margin:0 0 3px;font-size:16px}.smc-top span:not(.badge){font-size:12px;color:var(--muted)}.smc-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:15px 0 11px}.smc-metrics div{padding:9px 10px;border-radius:12px;background:var(--surface-2);display:grid;gap:2px}.smc-metrics span{font-size:11px;color:var(--muted)}.smc-metrics b{font-size:13px}.smc-actions{display:flex;justify-content:flex-end;margin-top:12px}.empty-wide{grid-column:1/-1}.modal-xl{width:min(1000px,calc(100vw - 40px))}.teacher-detail-body{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:0 24px 24px;max-height:65vh;overflow:auto}.teacher-detail-body h4{margin:0 0 12px}.habit-mini-list{display:grid;gap:8px}.habit-mini-item{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:14px}.habit-mini-item.done{background:#f1fbf6;border-color:#cdeedb}.habit-mini-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#eef3ff}.habit-mini-item div b,.habit-mini-item div small{display:block}.habit-mini-item small{color:var(--muted);font-size:11px;margin-top:2px}.reflection-preview{padding:14px;border-radius:16px;background:var(--surface-2)}.reflection-preview b{display:block;margin:10px 0}.reflection-preview p{font-size:12px;margin:7px 0;line-height:1.5}.portfolio-mini-list{display:grid;gap:8px}.portfolio-mini-list>div{border:1px solid var(--line);border-radius:13px;padding:11px}.portfolio-mini-list b,.portfolio-mini-list span{display:block}.portfolio-mini-list span{font-size:11px;color:var(--muted);margin-top:2px}.portfolio-mini-list p{font-size:12px;margin:6px 0 0;color:var(--muted)}.report-score{padding:14px 18px;border-radius:18px;background:#eef3ff;min-width:160px}.report-score span,.report-score small{display:block;font-size:11px;color:var(--muted)}.report-score strong{display:block;font-size:27px;color:var(--primary);margin:2px 0}.report-filter{display:flex;gap:10px;align-items:center;margin-bottom:16px}.report-filter select{min-width:180px}.report-progress{display:flex;align-items:center;gap:9px;min-width:180px}.report-progress .progressbar{flex:1}.report-progress b{font-size:12px;min-width:36px;text-align:right}
@media(max-width:900px){.student-monitor-grid{grid-template-columns:1fr}.teacher-filter{grid-template-columns:1fr 1fr auto}.teacher-filter .searchbox{grid-column:1/-1}.teacher-filter .filter-count{grid-column:1/-1}.teacher-detail-body{grid-template-columns:1fr}.teacher-hero{align-items:flex-start}.teacher-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.teacher-hero{display:block}.hero-score{margin-top:18px;text-align:left;min-width:0}.teacher-stats{grid-template-columns:1fr 1fr}.teacher-dashboard-grid{grid-template-columns:1fr}.teacher-filter,.report-filter{display:grid;grid-template-columns:1fr}.teacher-filter>*{grid-column:auto!important}.teacher-filter .btn,.report-filter .btn{width:100%}.smc-top{grid-template-columns:42px 1fr}.smc-top>.badge{grid-column:2;justify-self:start}.smc-metrics{grid-template-columns:1fr 1fr 1fr}.teacher-detail-body{padding:0 16px 20px;max-height:none}.teacher-detail-modal .modal-card{width:100%;height:100%;max-height:none;border-radius:0}.report-score{margin-top:12px}.report-filter select{min-width:0;width:100%}.teacher-report-table table,.teacher-report-table thead,.teacher-report-table tbody,.teacher-report-table tr,.teacher-report-table th,.teacher-report-table td{display:block}.teacher-report-table thead{display:none}.teacher-report-table tr{margin:10px;border:1px solid var(--line);border-radius:16px;padding:12px}.teacher-report-table td{border:0;padding:5px 0}.report-progress{min-width:0}.smc-metrics b{font-size:12px}}

/* KAIH v1.1.0 — Education UI Redesign */
:root{
  --bg:#f4f8ff;--card:#fff;--text:#10244a;--muted:#7484a3;--primary:#2d68eb;--primary2:#6a5cf6;
  --line:#e7eef9;--surface-2:#f7faff;--shadow-sm:0 6px 18px rgba(34,76,150,.07);--shadow:0 16px 44px rgba(35,76,151,.11)
}
body{background:linear-gradient(180deg,#f8fbff 0,#f3f7fd 100%);color:var(--text)}
.sidebar{width:262px;padding:20px 14px;background:rgba(255,255,255,.97);box-shadow:8px 0 30px rgba(40,79,145,.04)}
.main{margin-left:262px}.content{padding:28px 30px 38px}.topbar{height:78px;padding:0 30px;background:rgba(255,255,255,.92);box-shadow:0 2px 14px rgba(49,76,126,.035)}
.brand-premium{text-decoration:none;color:inherit;padding:0 8px 22px}.brand-emblem{width:54px;height:54px;border-radius:18px;background:linear-gradient(145deg,#2477f1,#7254ef);box-shadow:0 12px 24px rgba(63,95,224,.25);display:grid;place-items:center;flex:0 0 54px;position:relative;overflow:hidden}.brand-emblem:before{content:"";position:absolute;inset:6px;border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.24),rgba(255,255,255,0))}.brand-emblem span{position:relative;color:#fff;font-weight:950;font-size:26px}.brand-premium b{font-size:19px;letter-spacing:.01em}.brand-premium span{font-size:11px;line-height:1.35;max-width:160px}
.sidebar nav{gap:7px}.nav-item{padding:8px 10px;border-radius:15px;font-size:13px;color:#30446d}.nav-item:hover{background:#f4f8ff;color:#1e57d4}.nav-item.active{background:linear-gradient(90deg,#eaf3ff,#f2f6ff);color:#1551d8;box-shadow:inset 3px 0 0 #2c67eb}.nav-icon.premium{width:40px;height:40px;flex:0 0 40px;padding:0;border-radius:13px;background:transparent;overflow:hidden;box-shadow:0 5px 12px rgba(48,86,169,.08)}.nav-icon.premium img{width:100%;height:100%;object-fit:cover;display:block}.nav-item.active .nav-icon.premium{background:transparent}
.sidebar-foot{padding:16px 10px 2px}.user-chip{padding:10px;border:1px solid var(--line);border-radius:16px;background:#fbfdff}.premium-avatar,.top-avatar{background:linear-gradient(145deg,#e9f2ff,#f0ebff);color:#255fe1;box-shadow:inset 0 0 0 1px #dde7fb}.user-chip small{font-size:9px;color:#9aa7bc;margin-top:1px}.logout{display:flex;align-items:center;gap:7px;padding:9px 8px;border-radius:10px}.logout:hover{background:#fff2f4}
.topbar-title{min-width:0}.page-title{font-size:20px;color:#10244a}.page-sub{font-size:11px}.top-actions{gap:9px}.top-user{display:flex;align-items:center;gap:8px;margin-right:4px}.top-user .top-avatar{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;font-size:12px;font-weight:850}.top-user>div:last-child{display:grid}.top-user b{font-size:11px;line-height:1.1}.top-user span{font-size:9px;color:var(--muted);margin-top:3px}.role-pill{background:#edf4ff;color:#245fdc}.version{background:#f5f7fb;border:1px solid #edf0f5}
.card{border-color:#e4ebf6;border-radius:20px;box-shadow:var(--shadow-sm)}.btn{border-radius:13px;box-shadow:0 8px 18px rgba(45,104,235,.18)}.btn.secondary{box-shadow:none}.field input,.field select,.field textarea{border-color:#dfe7f2;border-radius:13px;background:#fff}.table-wrap{border-radius:20px;border-color:#e5edf7;box-shadow:var(--shadow-sm)}
.edu-hero{min-height:226px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);overflow:hidden;border-radius:24px;background:linear-gradient(120deg,#e5f3ff 0%,#d8efff 48%,#ecf4ff 100%);box-shadow:var(--shadow-sm);position:relative;margin-bottom:18px;border:1px solid #dcecff}.edu-hero:before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-90px;top:-140px;background:radial-gradient(circle,#b9ddff 0,rgba(185,221,255,0) 70%)}.edu-hero-copy{padding:30px 34px;position:relative;z-index:2}.edu-hero .hero-kicker{color:#4781d8;margin-bottom:8px}.edu-hero h1{font-size:31px;line-height:1.1;margin:0 0 10px;color:#12317b}.edu-hero h1 em{font-style:normal;color:#2f68e6}.edu-hero p{max-width:670px;font-size:14px;line-height:1.55;color:#3e5d93;margin:0}.hero-quote{display:inline-flex;margin-top:19px;padding:11px 16px;border-radius:14px;background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.85);color:#25477f;font-size:12px;font-weight:650;box-shadow:0 8px 20px rgba(66,107,165,.06)}.edu-hero-visual{position:relative;min-height:226px}.hero-icon{position:absolute;border-radius:28px;overflow:hidden;box-shadow:0 18px 35px rgba(44,79,151,.17);transform:rotate(-3deg)}.hero-icon img{display:block;width:100%;height:100%;object-fit:cover}.hero-icon-student{width:150px;height:150px;right:145px;bottom:-6px}.hero-icon-teacher{width:128px;height:128px;right:34px;bottom:24px;transform:rotate(4deg)}.hero-school-badge{position:absolute;right:85px;top:24px;padding:10px 16px;border-radius:14px;background:linear-gradient(145deg,#2578eb,#3d62d7);color:#fff;font-size:15px;font-weight:850;box-shadow:0 12px 28px rgba(42,95,195,.22);text-align:center}.hero-school-badge small{font-size:8px;font-weight:600;opacity:.9}
.edu-stat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:18px}.edu-stat{min-width:0;background:#fff;border:1px solid #e4ecf7;border-radius:18px;padding:14px;display:flex;align-items:center;gap:12px;text-decoration:none;box-shadow:var(--shadow-sm);transition:.18s}.edu-stat:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.edu-stat-icon{width:54px;height:54px;border-radius:16px;overflow:hidden;flex:0 0 54px;box-shadow:0 6px 16px rgba(59,93,161,.1)}.edu-stat-icon img{width:100%;height:100%;object-fit:cover}.edu-stat>div{min-width:0;display:grid}.edu-stat small{font-size:10px;color:var(--muted)}.edu-stat strong{font-size:24px;line-height:1.05;margin:3px 0;color:#0f285c}.edu-stat span:not(.edu-stat-icon){font-size:9px;color:#8a99b2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.edu-dashboard-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}.edu-progress-card,.edu-activity-card{min-height:320px}.edu-progress-body{display:grid;grid-template-columns:170px 1fr;gap:24px;align-items:center}.edu-ring{--score:0;width:136px;height:136px;margin:auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#28c992 calc(var(--score)*1%),#edf3fa 0);position:relative}.edu-ring:after{content:"";position:absolute;inset:15px;border-radius:50%;background:#fff}.edu-ring>div{z-index:1;text-align:center}.edu-ring strong{display:block;font-size:29px;color:#143b88}.edu-ring span{font-size:10px;color:var(--muted)}.premium-bars{gap:11px}.premium-bars .habit-label span{display:flex;align-items:center;gap:8px}.premium-bars .habit-label img{width:24px;height:24px;border-radius:8px;object-fit:cover}.premium-bars .progressbar{height:7px}.premium-bars .progressbar i{background:linear-gradient(90deg,#2e78f4,#6d5cf4)}.mini-premium-icon{width:38px;height:38px;border-radius:12px;overflow:hidden;flex:0 0 38px}.mini-premium-icon img{width:100%;height:100%;object-fit:cover}.premium-list .student-item{padding:12px 0}.edu-empty img{width:72px;height:72px;border-radius:20px;object-fit:cover;box-shadow:0 8px 18px rgba(57,91,160,.12)}
.edu-section-title{margin-top:20px}.edu-quick-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.edu-quick-card{background:#fff;border:1px solid #e4ecf7;border-radius:18px;padding:16px 12px;text-decoration:none;display:grid;justify-items:center;text-align:center;gap:5px;box-shadow:var(--shadow-sm);transition:.18s}.edu-quick-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.edu-quick-card img{width:62px;height:62px;border-radius:18px;object-fit:cover;margin-bottom:2px}.edu-quick-card b{font-size:12px;color:#15305f}.edu-quick-card small{font-size:9px;line-height:1.4;color:var(--muted)}
.student-mobile-nav .mn-icon{width:30px;height:30px;border-radius:9px;overflow:hidden}.student-mobile-nav .mn-icon img{width:100%;height:100%;object-fit:cover;display:block}.student-mobile-nav a{gap:1px}
.role-siswa .nav-icon.premium,.role-guru .nav-icon.premium,.role-admin .nav-icon.premium{box-shadow:0 5px 12px rgba(48,86,169,.08)}
@media(max-width:1200px){.edu-stat-grid{grid-template-columns:repeat(3,1fr)}.edu-quick-grid{grid-template-columns:repeat(3,1fr)}.edu-hero{grid-template-columns:1fr 320px}.hero-icon-student{right:120px}.hero-icon-teacher{right:20px}}
@media(max-width:980px){.main{margin-left:0}.sidebar{width:286px}.edu-hero{grid-template-columns:1fr}.edu-hero-visual{display:none}.edu-dashboard-grid{grid-template-columns:1fr}.edu-stat-grid{grid-template-columns:repeat(2,1fr)}.top-user{display:none}}
@media(max-width:640px){.content{padding:16px 14px 92px}.topbar{padding:0 14px}.role-pill{display:none}.edu-hero{min-height:0;border-radius:20px}.edu-hero-copy{padding:22px 20px}.edu-hero h1{font-size:24px}.edu-hero p{font-size:12px}.hero-quote{font-size:10px;margin-top:14px}.edu-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.edu-stat{padding:10px;gap:8px}.edu-stat-icon{width:44px;height:44px;flex-basis:44px;border-radius:13px}.edu-stat strong{font-size:20px}.edu-dashboard-grid{gap:12px}.edu-progress-body{grid-template-columns:1fr}.edu-ring{width:112px;height:112px}.edu-ring strong{font-size:24px}.edu-quick-grid{grid-template-columns:repeat(2,1fr);gap:9px}.edu-quick-card{padding:12px 8px}.edu-quick-card img{width:54px;height:54px}.nav-icon.premium{width:38px;height:38px;flex-basis:38px}.brand-emblem{width:48px;height:48px;flex-basis:48px}.brand-emblem span{font-size:23px}.page-title{font-size:16px}.version{font-size:9px;padding:6px 8px}}

/* KAIH v1.1.1 — premium education brand mark */
.brand-emblem{background:transparent;box-shadow:0 10px 24px rgba(45,93,190,.14);border-radius:17px;overflow:hidden}
.brand-emblem:before{display:none}
.brand-emblem img{width:100%;height:100%;object-fit:cover;display:block;border-radius:17px}
.login-card .logo.logo-premium{background:transparent;padding:0;overflow:hidden;box-shadow:0 10px 24px rgba(45,93,190,.14)}
.login-card .logo.logo-premium img{width:100%;height:100%;object-fit:cover;display:block;border-radius:17px}

/* KAIH v1.1.2 - Education Management Pages */
.edu-page-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);min-height:205px;overflow:hidden;border:1px solid #d9eaff;border-radius:26px;background:linear-gradient(120deg,#eff8ff 0%,#e2f2ff 48%,#eef4ff 100%);box-shadow:0 14px 40px rgba(57,92,145,.08);margin-bottom:18px}
.edu-page-hero:after{content:"";position:absolute;width:330px;height:330px;border-radius:50%;right:-80px;top:-150px;background:radial-gradient(circle,rgba(68,154,255,.22),rgba(68,154,255,0) 70%)}
.edu-page-copy{padding:27px 30px;position:relative;z-index:2;align-self:center}.edu-page-copy h1{font-size:34px;line-height:1.05;margin:7px 0 9px;color:#10264a}.edu-page-copy p{max-width:680px;color:#617697;margin:0;line-height:1.55}.hero-actions-inline{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}.hero-actions-inline .btn{box-shadow:none}
.edu-page-art{position:relative;min-height:205px;display:flex;align-items:center;justify-content:center;z-index:1}.edu-page-art .art-glow{position:absolute;width:250px;height:160px;border-radius:50%;background:rgba(255,255,255,.7);filter:blur(8px)}.edu-page-art .art-main{position:relative;width:138px;height:138px;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(29,79,160,.14));z-index:2}.edu-page-art .art-float{position:absolute;width:60px;height:60px;object-fit:contain;z-index:3;filter:drop-shadow(0 10px 15px rgba(29,79,160,.12))}.edu-page-art .art-float.one{right:40px;top:28px}.edu-page-art .art-float.two{left:34px;bottom:26px}.edu-page-art .art-copy{position:absolute;right:30px;bottom:23px;font-size:13px;line-height:1.35;color:#2255bb;text-align:right;font-weight:700;transform:rotate(-3deg);z-index:4}.edu-page-art .art-board{position:absolute;right:18px;top:28px;padding:13px 16px;border-radius:15px;background:linear-gradient(145deg,#176346,#218860);color:#fff;font-size:13px;line-height:1.4;box-shadow:0 12px 24px rgba(21,93,66,.2);transform:rotate(2deg);z-index:1}.teacher-art .art-main{margin-right:75px;width:150px;height:150px}
.edu-stat-grid{gap:14px;margin-bottom:18px}.edu-stat-card{display:flex;align-items:center;gap:14px;padding:17px 20px;min-height:100px;border-color:#e0e8f4;box-shadow:0 8px 24px rgba(26,58,107,.05)}.edu-stat-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,#f5f9ff,#eaf3ff);flex:0 0 58px}.edu-stat-icon img{width:48px;height:48px;object-fit:contain}.edu-stat-card>div:last-child{display:grid}.edu-stat-card span{font-size:12px;color:#7890ae}.edu-stat-card strong{font-size:28px;line-height:1.1;color:#0e2549;margin:2px 0}.edu-stat-card small{font-size:11px;color:#7d90aa}
.edu-data-card,.premium-management-card{padding:0;overflow:hidden;border-color:#dee7f3;box-shadow:0 10px 28px rgba(26,58,107,.055)}.edu-card-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 22px 12px}.edu-card-head h3{margin:4px 0 0;font-size:20px;color:#132b50}.count-pill{display:inline-flex;align-items:center;justify-content:center;padding:7px 12px;border-radius:999px;background:#eef4ff;color:#2159d7;font-weight:800;font-size:12px}
.modern-toolbar{margin:0 20px 14px;padding:12px 0 14px;border:0;border-bottom:1px solid #e7edf6;border-radius:0;background:transparent;box-shadow:none}.modern-filter{grid-template-columns:minmax(320px,1fr) 180px 180px auto auto}.modern-search{height:46px}.modern-search input{height:44px}.filter-result{font-size:12px;color:#7d8da5;margin-top:10px}.premium-table{border:0;border-radius:0;box-shadow:none}.premium-table table{border-collapse:separate;border-spacing:0}.premium-table thead th{background:#f8fbff;color:#60738e;font-size:11px;letter-spacing:.03em;padding:12px 16px}.premium-table tbody td{padding:13px 16px}.premium-table tbody tr:hover{background:#fbfdff}.student-avatar-premium,.teacher-avatar-art{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#f6f9ff,#eaf2ff);flex:0 0 44px;box-shadow:0 6px 15px rgba(34,81,154,.07)}.student-avatar-premium img,.teacher-avatar-art img{width:38px;height:38px;object-fit:contain}.link-button{display:block;border:0;background:transparent;color:#2864df;padding:0;margin:2px 0 0;font-size:11px;cursor:pointer;text-align:left}.table-main-text{font-size:12px}.class-chip,.username-chip{display:inline-flex;padding:5px 8px;border-radius:9px;background:#f0f5ff;color:#2b5bc8;font-size:11px;font-weight:750}.username-chip{background:#f7f9fc;color:#52647c;font-family:inherit}.premium-actions{opacity:.88}.premium-actions .icon-btn{border-color:#e3e9f3;background:#fbfcff}.premium-empty{min-height:230px}.premium-empty img{width:70px;height:70px;object-fit:contain;margin-bottom:8px}.premium-empty .btn{margin-top:12px}.premium-pagination{padding:14px 20px 18px;border-top:1px solid #edf1f7}
.premium-management-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:16px}.premium-management-card .edu-card-head{padding-bottom:14px}.premium-mini-search{padding:0 20px 15px;margin:0;display:grid;grid-template-columns:minmax(0,1fr) auto auto}.premium-teacher-list,.premium-class-list{padding:0 18px 14px}.premium-teacher-row{padding:12px 10px;border:1px solid transparent;border-radius:16px;margin-bottom:6px}.premium-teacher-row:hover{background:#f8fbff;border-color:#e7eef8}.premium-class-row{border:1px solid #e8eef7;border-radius:16px;padding:12px 11px;margin-bottom:9px;background:linear-gradient(90deg,#fbfdff,#fff)}.premium-class-row:hover{border-color:#cfdcf2;box-shadow:0 8px 20px rgba(30,66,120,.06)}.premium-class-symbol{width:44px;height:44px;border-radius:14px;overflow:hidden;background:#eef4ff}.premium-class-symbol img{width:38px;height:38px;object-fit:contain}.premium-class-row.tone-2 .premium-class-symbol{background:#eefbf4}.premium-class-row.tone-3 .premium-class-symbol{background:#fff7e9}.premium-class-row.tone-4 .premium-class-symbol{background:#f4efff}.premium-class-row.tone-5 .premium-class-symbol{background:#fff0f2}.premium-class-row .class-main small{margin-top:1px}
@media(max-width:1100px){.edu-page-hero{grid-template-columns:1fr 300px}.edu-page-art .art-copy{display:none}.modern-filter{grid-template-columns:minmax(240px,1fr) 160px 160px auto}.premium-management-grid{grid-template-columns:1fr}}
@media(max-width:760px){.edu-page-hero{display:block;min-height:0}.edu-page-copy{padding:22px 20px}.edu-page-copy h1{font-size:29px}.edu-page-art{min-height:130px}.edu-page-art .art-main{width:100px;height:100px}.teacher-art .art-main{margin-right:70px;width:110px;height:110px}.edu-page-art .art-board{right:12px;top:18px;font-size:11px}.edu-page-art .art-float{width:48px;height:48px}.hero-actions-inline{display:grid;grid-template-columns:1fr 1fr}.hero-actions-inline .btn:last-child:nth-child(3){grid-column:1/-1}.edu-stat-grid{grid-template-columns:1fr 1fr!important}.edu-stat-card{padding:14px;min-height:88px}.edu-stat-icon{width:48px;height:48px;flex-basis:48px}.edu-stat-icon img{width:40px;height:40px}.edu-stat-card strong{font-size:23px}.modern-toolbar{margin:0 14px 12px}.modern-filter{display:grid;grid-template-columns:1fr 1fr}.modern-filter .modern-search{grid-column:1/-1}.modern-filter .btn{width:100%}.filter-result{grid-column:1/-1}.edu-card-head{padding:18px 16px 10px}.premium-mini-search{padding:0 14px 13px;grid-template-columns:1fr auto}.premium-mini-search .search-box{grid-column:1/-1}.premium-teacher-list,.premium-class-list{padding:0 12px 12px}.premium-teacher-row{align-items:flex-start}.premium-teacher-row>.badge{display:inline-flex}.premium-teacher-row .row-actions{width:100%;justify-content:flex-end}.premium-class-row{align-items:flex-start}.premium-table tbody td{padding:7px 0}.premium-table tr{padding:13px!important}.premium-pagination{padding:12px 14px 16px}.student-avatar-premium{width:40px;height:40px;flex-basis:40px}.student-avatar-premium img{width:34px;height:34px}}
@media(max-width:430px){.edu-stat-grid{grid-template-columns:1fr!important}.hero-actions-inline{grid-template-columns:1fr}.hero-actions-inline .btn:last-child:nth-child(3){grid-column:auto}.edu-page-art .art-board{display:none}.teacher-art .art-main{margin-right:0}.modern-filter{grid-template-columns:1fr}.modern-filter>*{grid-column:1!important}.premium-teacher-row>.badge{margin-left:55px}.premium-teacher-row .row-actions{margin-left:55px}}


/* KAIH v1.1.3 - management UI polish + reliable filter layout */
.role-admin .modern-toolbar{
  margin:0 20px 14px;
  padding:14px 0 16px;
  border-bottom:1px solid #e7edf6;
}
.role-admin .modern-filter{
  display:grid;
  grid-template-columns:minmax(340px,1fr) 180px 180px auto auto;
  gap:10px;
  align-items:center;
  width:100%;
}
.role-admin .modern-search{
  display:flex;
  align-items:center;
  gap:10px;
  height:46px;
  padding:0 14px;
  border:1px solid #dce5f1;
  border-radius:14px;
  background:#fff;
  box-shadow:0 4px 14px rgba(24,62,120,.035);
  min-width:0;
}
.role-admin .modern-search span{color:#4c6d9d;font-size:16px;flex:0 0 auto}
.role-admin .modern-search input{
  width:100%;
  min-width:0;
  height:42px;
  border:0!important;
  outline:0;
  box-shadow:none!important;
  background:transparent;
  padding:0;
  font:inherit;
  color:#223554;
}
.role-admin .modern-filter select{
  height:46px;
  width:100%;
  border:1px solid #dce5f1;
  border-radius:14px;
  padding:0 38px 0 13px;
  background:#fff;
  color:#32445f;
  font:inherit;
  outline:none;
}
.role-admin .modern-filter select:focus,
.role-admin .modern-search:focus-within{
  border-color:#73a0ff;
  box-shadow:0 0 0 3px rgba(64,116,235,.11);
}
.role-admin .modern-filter .btn{height:46px;white-space:nowrap;padding:0 18px;border-radius:13px}
.role-admin .modern-filter .btn.ghost{background:#f5f8fc;color:#51657f;border:1px solid #e4eaf3}
.role-admin .filter-result{margin-top:10px;padding-left:2px}

/* make empty data areas feel intentional, not like broken tables */
.role-admin .premium-table .premium-empty{padding:34px 18px 38px}
.role-admin .premium-table .premium-empty img{width:78px;height:78px}
.role-admin .premium-table thead th{height:44px;vertical-align:middle}
.role-admin .edu-data-card{border-radius:22px}
.role-admin .edu-card-head{padding:22px 22px 10px}
.role-admin .count-pill{box-shadow:inset 0 0 0 1px rgba(52,101,210,.05)}

/* polished management stats */
.role-admin .edu-stat-card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.role-admin .edu-stat-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(26,58,107,.08);border-color:#d4e0f1}

@media(max-width:1180px){
  .role-admin .modern-filter{grid-template-columns:minmax(260px,1fr) 155px 155px auto}
  .role-admin .modern-filter .btn.ghost{grid-column:auto}
}
@media(max-width:820px){
  .role-admin .modern-toolbar{margin:0 14px 12px}
  .role-admin .modern-filter{grid-template-columns:1fr 1fr;gap:9px}
  .role-admin .modern-search{grid-column:1/-1}
  .role-admin .modern-filter .btn{width:100%}
  .role-admin .filter-result{padding-left:0}
}
@media(max-width:520px){
  .role-admin .modern-filter{grid-template-columns:1fr}
  .role-admin .modern-filter>*{grid-column:1!important}
  .role-admin .modern-search,.role-admin .modern-filter select,.role-admin .modern-filter .btn{height:48px}
  .role-admin .edu-page-copy h1{font-size:26px}
  .role-admin .edu-card-head{padding:17px 15px 10px}
}

/* =========================================================
   KAIH v1.1.5 - Premium Academic Year & Reports UI
   ========================================================= */
.role-admin .academy-hero{position:relative;overflow:hidden;border:1px solid #d8e8fb;background:linear-gradient(112deg,#eef8ff 0%,#e6f2ff 52%,#f8fbff 100%);border-radius:28px;padding:28px 30px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:20px;box-shadow:0 16px 40px rgba(49,88,145,.06)}
.role-admin .academy-hero:after{content:"";position:absolute;width:230px;height:230px;border-radius:50%;right:-72px;top:-100px;background:radial-gradient(circle,rgba(79,133,255,.18),rgba(79,133,255,0) 70%)}
.role-admin .academy-hero-copy{position:relative;z-index:2;max-width:760px}.role-admin .academy-hero-copy h1{font-size:32px;line-height:1.08;margin:5px 0 9px;color:#0c2d63}.role-admin .academy-hero-copy p{margin:0;color:#637a9b;font-size:15px;line-height:1.65}.role-admin .academy-hero-art{position:relative;z-index:2;display:flex;align-items:center;gap:14px;padding-right:18px}.role-admin .academy-hero-art img{width:98px;height:98px;object-fit:contain;filter:drop-shadow(0 16px 22px rgba(40,88,160,.18))}.role-admin .academy-badge{padding:9px 13px;border-radius:999px;background:rgba(255,255,255,.85);border:1px solid #dbe9fb;font-size:12px;font-weight:800;color:#2865d8;box-shadow:0 8px 22px rgba(42,83,150,.08)}
.role-admin .academy-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.role-admin .academy-actions .btn{border-radius:14px;min-height:46px;padding:0 18px;box-shadow:0 9px 22px rgba(40,100,230,.15)}
.role-admin .academy-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:20px}.role-admin .academy-stat{background:#fff;border:1px solid #e0e8f3;border-radius:22px;padding:18px 20px;display:flex;align-items:center;gap:14px;min-height:104px;box-shadow:0 10px 28px rgba(38,67,113,.05)}.role-admin .academy-stat-icon{width:58px;height:58px;border-radius:18px;background:#f2f7ff;display:grid;place-items:center;flex:0 0 auto}.role-admin .academy-stat-icon img{width:44px;height:44px;object-fit:contain}.role-admin .academy-stat-label{font-size:12px;color:#7a8eaa;margin-bottom:4px}.role-admin .academy-stat-value{font-size:26px;font-weight:900;color:#0c2d63;line-height:1.05}.role-admin .academy-stat-note{font-size:11px;color:#7185a0;margin-top:5px}
.role-admin .academy-panel{background:#fff;border:1px solid #e0e8f3;border-radius:24px;box-shadow:0 12px 32px rgba(37,69,118,.055);overflow:hidden}.role-admin .academy-panel-head{padding:22px 24px 14px;display:flex;align-items:center;justify-content:space-between;gap:16px}.role-admin .academy-panel-head h2,.role-admin .academy-panel-head h3{margin:3px 0 0;color:#102f60}.role-admin .academy-panel-body{padding:0 24px 24px}.role-admin .academy-table{border:1px solid #e4ebf5;border-radius:18px;overflow:hidden}.role-admin .academy-table table{margin:0}.role-admin .academy-table th{background:#f8fbff;color:#60738f;font-size:11px;letter-spacing:.035em}.role-admin .academy-table td{vertical-align:middle}.role-admin .academy-period{display:flex;align-items:center;gap:12px}.role-admin .academy-period-icon{width:42px;height:42px;border-radius:13px;background:#eef5ff;display:grid;place-items:center}.role-admin .academy-period-icon img{width:32px;height:32px;object-fit:contain}.role-admin .academy-status{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;font-size:11px;font-weight:800;background:#eafaf1;color:#14945a}.role-admin .academy-status.archive{background:#f1f4f8;color:#70819a}.role-admin .academy-help{margin-top:16px;border:1px dashed #cddced;background:linear-gradient(135deg,#f8fbff,#fff);border-radius:20px;padding:17px 19px;display:flex;align-items:flex-start;gap:12px}.role-admin .academy-help img{width:42px;height:42px;object-fit:contain}.role-admin .academy-help h3{font-size:14px;margin:1px 0 4px;color:#153a72}.role-admin .academy-help p{margin:0;color:#7185a0;font-size:12px;line-height:1.55}
.role-admin .report-hero{background:linear-gradient(115deg,#1747b8 0%,#2e6eef 55%,#6b54ed 100%);border-radius:28px;padding:28px 30px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px;box-shadow:0 18px 42px rgba(41,78,178,.18);overflow:hidden;position:relative}.role-admin .report-hero:after{content:"";position:absolute;inset:auto -50px -100px auto;width:260px;height:260px;background:radial-gradient(circle,rgba(255,255,255,.22),rgba(255,255,255,0) 68%);border-radius:50%}.role-admin .report-hero h1{margin:4px 0 8px;font-size:32px}.role-admin .report-hero p{margin:0;max-width:780px;color:rgba(255,255,255,.84);line-height:1.6}.role-admin .report-hero-art{position:relative;z-index:2;display:flex;align-items:center;gap:12px}.role-admin .report-hero-art img{width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 16px 24px rgba(8,28,85,.22))}.role-admin .report-chip{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);padding:9px 12px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
.role-admin .report-toolbar{display:grid;grid-template-columns:minmax(190px,1fr) 210px 210px auto auto;gap:10px;align-items:center;padding:16px 18px;background:#fff;border:1px solid #e0e8f3;border-radius:20px;margin-bottom:16px;box-shadow:0 10px 28px rgba(35,65,111,.045)}.role-admin .report-toolbar input,.role-admin .report-toolbar select{height:46px;border:1px solid #dce5f1;border-radius:13px;padding:0 13px;background:#fff;color:#273d5c;font:inherit;min-width:0}.role-admin .report-toolbar .btn{height:46px;border-radius:13px;white-space:nowrap}.role-admin .report-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:16px}.role-admin .report-card{background:#fff;border:1px solid #e0e8f3;border-radius:20px;padding:16px 17px;display:flex;align-items:center;gap:12px;box-shadow:0 9px 25px rgba(39,69,116,.045)}.role-admin .report-card img{width:48px;height:48px;object-fit:contain}.role-admin .report-card .value{font-size:23px;font-weight:900;color:#0c2d63}.role-admin .report-card .label{font-size:11px;color:#7a8eaa}.role-admin .report-card .note{font-size:10px;color:#7185a0;margin-top:3px}.role-admin .report-score{display:flex;align-items:center;gap:10px;min-width:210px}.role-admin .report-score .progressbar{height:9px;flex:1;background:#edf2f8;border-radius:999px;overflow:hidden}.role-admin .report-score .progressbar i{height:100%;display:block;border-radius:999px;background:linear-gradient(90deg,#2e70ef,#6a55ed)}.role-admin .report-empty{text-align:center;padding:54px 20px;color:#7386a2}.role-admin .report-empty img{width:76px;height:76px;object-fit:contain;margin-bottom:8px}.role-admin .report-empty strong{display:block;color:#173762;font-size:15px;margin-bottom:5px}
@media(max-width:1050px){.role-admin .academy-stats{grid-template-columns:1fr 1fr}.role-admin .report-summary{grid-template-columns:1fr 1fr}.role-admin .report-toolbar{grid-template-columns:1fr 1fr}.role-admin .report-toolbar .btn{width:100%}.role-admin .report-hero-art{display:none}}
@media(max-width:700px){.role-admin .academy-hero,.role-admin .report-hero{border-radius:22px;padding:22px 18px}.role-admin .academy-hero-copy h1,.role-admin .report-hero h1{font-size:27px}.role-admin .academy-hero-art{display:none}.role-admin .academy-stats,.role-admin .report-summary{grid-template-columns:1fr}.role-admin .academy-panel-head{padding:18px 16px 10px;align-items:flex-start}.role-admin .academy-panel-body{padding:0 14px 16px}.role-admin .academy-table{overflow-x:auto}.role-admin .report-toolbar{grid-template-columns:1fr;padding:13px}.role-admin .report-score{min-width:170px}.role-admin .academy-actions .btn{width:100%}}
@media print{.sidebar,.topbar,.report-toolbar,.no-print{display:none!important}.main{margin-left:0!important}.content{padding:0!important}.report-hero{color:#111!important;background:#fff!important;box-shadow:none!important;border:1px solid #ddd!important}.role-admin .academy-panel{box-shadow:none!important}}
.edu-page-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);min-height:205px;overflow:hidden;border:1px solid #d9eaff;border-radius:26px;background:linear-gradient(120deg,#eff8ff 0%,#e2f2ff 48%,#eef4ff 100%);box-shadow:0 14px 40px rgba(57,92,145,.08);margin-bottom:18px}
.edu-page-hero:after{content:"";position:absolute;width:330px;height:330px;border-radius:50%;right:-80px;top:-150px;background:radial-gradient(circle,rgba(68,154,255,.22),rgba(68,154,255,0) 70%)}
.edu-page-copy{padding:27px 30px;position:relative;z-index:2;align-self:center}.edu-page-copy h1{font-size:34px;line-height:1.05;margin:7px 0 9px;color:#10264a}.edu-page-copy p{max-width:680px;color:#617697;margin:0;line-height:1.55}.hero-actions-inline{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}.hero-actions-inline .btn{box-shadow:none}
.edu-page-art{position:relative;min-height:205px;display:flex;align-items:center;justify-content:center;z-index:1}.edu-page-art .art-glow{position:absolute;width:250px;height:160px;border-radius:50%;background:rgba(255,255,255,.7);filter:blur(8px)}.edu-page-art .art-main{position:relative;width:138px;height:138px;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(29,79,160,.14));z-index:2}.edu-page-art .art-float{position:absolute;width:60px;height:60px;object-fit:contain;z-index:3;filter:drop-shadow(0 10px 15px rgba(29,79,160,.12))}.edu-page-art .art-float.one{right:40px;top:28px}.edu-page-art .art-float.two{left:34px;bottom:26px}.edu-page-art .art-copy{position:absolute;right:30px;bottom:23px;font-size:13px;line-height:1.35;color:#2255bb;text-align:right;font-weight:700;transform:rotate(-3deg);z-index:4}.edu-page-art .art-board{position:absolute;right:18px;top:28px;padding:13px 16px;border-radius:15px;background:linear-gradient(145deg,#176346,#218860);color:#fff;font-size:13px;line-height:1.4;box-shadow:0 12px 24px rgba(21,93,66,.2);transform:rotate(2deg);z-index:1}.teacher-art .art-main{margin-right:75px;width:150px;height:150px}
.edu-stat-grid{gap:14px;margin-bottom:18px}.edu-stat-card{display:flex;align-items:center;gap:14px;padding:17px 20px;min-height:100px;border-color:#e0e8f4;box-shadow:0 8px 24px rgba(26,58,107,.05)}.edu-stat-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,#f5f9ff,#eaf3ff);flex:0 0 58px}.edu-stat-icon img{width:48px;height:48px;object-fit:contain}.edu-stat-card>div:last-child{display:grid}.edu-stat-card span{font-size:12px;color:#7890ae}.edu-stat-card strong{font-size:28px;line-height:1.1;color:#0e2549;margin:2px 0}.edu-stat-card small{font-size:11px;color:#7d90aa}
.edu-data-card,.premium-management-card{padding:0;overflow:hidden;border-color:#dee7f3;box-shadow:0 10px 28px rgba(26,58,107,.055)}.edu-card-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 22px 12px}.edu-card-head h3{margin:4px 0 0;font-size:20px;color:#132b50}.count-pill{display:inline-flex;align-items:center;justify-content:center;padding:7px 12px;border-radius:999px;background:#eef4ff;color:#2159d7;font-weight:800;font-size:12px}
.modern-toolbar{margin:0 20px 14px;padding:12px 0 14px;border:0;border-bottom:1px solid #e7edf6;border-radius:0;background:transparent;box-shadow:none}.modern-filter{grid-template-columns:minmax(320px,1fr) 180px 180px auto auto}.modern-search{height:46px}.modern-search input{height:44px}.filter-result{font-size:12px;color:#7d8da5;margin-top:10px}.premium-table{border:0;border-radius:0;box-shadow:none}.premium-table table{border-collapse:separate;border-spacing:0}.premium-table thead th{background:#f8fbff;color:#60738e;font-size:11px;letter-spacing:.03em;padding:12px 16px}.premium-table tbody td{padding:13px 16px}.premium-table tbody tr:hover{background:#fbfdff}.student-avatar-premium,.teacher-avatar-art{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#f6f9ff,#eaf2ff);flex:0 0 44px;box-shadow:0 6px 15px rgba(34,81,154,.07)}.student-avatar-premium img,.teacher-avatar-art img{width:38px;height:38px;object-fit:contain}.link-button{display:block;border:0;background:transparent;color:#2864df;padding:0;margin:2px 0 0;font-size:11px;cursor:pointer;text-align:left}.table-main-text{font-size:12px}.class-chip,.username-chip{display:inline-flex;padding:5px 8px;border-radius:9px;background:#f0f5ff;color:#2b5bc8;font-size:11px;font-weight:750}.username-chip{background:#f7f9fc;color:#52647c;font-family:inherit}.premium-actions{opacity:.88}.premium-actions .icon-btn{border-color:#e3e9f3;background:#fbfcff}.premium-empty{min-height:230px}.premium-empty img{width:70px;height:70px;object-fit:contain;margin-bottom:8px}.premium-empty .btn{margin-top:12px}.premium-pagination{padding:14px 20px 18px;border-top:1px solid #edf1f7}
.premium-management-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:16px}.premium-management-card .edu-card-head{padding-bottom:14px}.premium-mini-search{padding:0 20px 15px;margin:0;display:grid;grid-template-columns:minmax(0,1fr) auto auto}.premium-teacher-list,.premium-class-list{padding:0 18px 14px}.premium-teacher-row{padding:12px 10px;border:1px solid transparent;border-radius:16px;margin-bottom:6px}.premium-teacher-row:hover{background:#f8fbff;border-color:#e7eef8}.premium-class-row{border:1px solid #e8eef7;border-radius:16px;padding:12px 11px;margin-bottom:9px;background:linear-gradient(90deg,#fbfdff,#fff)}.premium-class-row:hover{border-color:#cfdcf2;box-shadow:0 8px 20px rgba(30,66,120,.06)}.premium-class-symbol{width:44px;height:44px;border-radius:14px;overflow:hidden;background:#eef4ff}.premium-class-symbol img{width:38px;height:38px;object-fit:contain}.premium-class-row.tone-2 .premium-class-symbol{background:#eefbf4}.premium-class-row.tone-3 .premium-class-symbol{background:#fff7e9}.premium-class-row.tone-4 .premium-class-symbol{background:#f4efff}.premium-class-row.tone-5 .premium-class-symbol{background:#fff0f2}.premium-class-row .class-main small{margin-top:1px}
@media(max-width:1100px){.edu-page-hero{grid-template-columns:1fr 300px}.edu-page-art .art-copy{display:none}.modern-filter{grid-template-columns:minmax(240px,1fr) 160px 160px auto}.premium-management-grid{grid-template-columns:1fr}}
@media(max-width:760px){.edu-page-hero{display:block;min-height:0}.edu-page-copy{padding:22px 20px}.edu-page-copy h1{font-size:29px}.edu-page-art{min-height:130px}.edu-page-art .art-main{width:100px;height:100px}.teacher-art .art-main{margin-right:70px;width:110px;height:110px}.edu-page-art .art-board{right:12px;top:18px;font-size:11px}.edu-page-art .art-float{width:48px;height:48px}.hero-actions-inline{display:grid;grid-template-columns:1fr 1fr}.hero-actions-inline .btn:last-child:nth-child(3){grid-column:1/-1}.edu-stat-grid{grid-template-columns:1fr 1fr!important}.edu-stat-card{padding:14px;min-height:88px}.edu-stat-icon{width:48px;height:48px;flex-basis:48px}.edu-stat-icon img{width:40px;height:40px}.edu-stat-card strong{font-size:23px}.modern-toolbar{margin:0 14px 12px}.modern-filter{display:grid;grid-template-columns:1fr 1fr}.modern-filter .modern-search{grid-column:1/-1}.modern-filter .btn{width:100%}.filter-result{grid-column:1/-1}.edu-card-head{padding:18px 16px 10px}.premium-mini-search{padding:0 14px 13px;grid-template-columns:1fr auto}.premium-mini-search .search-box{grid-column:1/-1}.premium-teacher-list,.premium-class-list{padding:0 12px 12px}.premium-teacher-row{align-items:flex-start}.premium-teacher-row>.badge{display:inline-flex}.premium-teacher-row .row-actions{width:100%;justify-content:flex-end}.premium-class-row{align-items:flex-start}.premium-table tbody td{padding:7px 0}.premium-table tr{padding:13px!important}.premium-pagination{padding:12px 14px 16px}.student-avatar-premium{width:40px;height:40px;flex-basis:40px}.student-avatar-premium img{width:34px;height:34px}}
@media(max-width:430px){.edu-stat-grid{grid-template-columns:1fr!important}.hero-actions-inline{grid-template-columns:1fr}.hero-actions-inline .btn:last-child:nth-child(3){grid-column:auto}.edu-page-art .art-board{display:none}.teacher-art .art-main{margin-right:0}.modern-filter{grid-template-columns:1fr}.modern-filter>*{grid-column:1!important}.premium-teacher-row>.badge{margin-left:55px}.premium-teacher-row .row-actions{margin-left:55px}}


/* KAIH v1.1.3 - management UI polish + reliable filter layout */
.role-admin .modern-toolbar{
  margin:0 20px 14px;
  padding:14px 0 16px;
  border-bottom:1px solid #e7edf6;
}
.role-admin .modern-filter{
  display:grid;
  grid-template-columns:minmax(340px,1fr) 180px 180px auto auto;
  gap:10px;
  align-items:center;
  width:100%;
}
.role-admin .modern-search{
  display:flex;
  align-items:center;
  gap:10px;
  height:46px;
  padding:0 14px;
  border:1px solid #dce5f1;
  border-radius:14px;
  background:#fff;
  box-shadow:0 4px 14px rgba(24,62,120,.035);
  min-width:0;
}
.role-admin .modern-search span{color:#4c6d9d;font-size:16px;flex:0 0 auto}
.role-admin .modern-search input{
  width:100%;
  min-width:0;
  height:42px;
  border:0!important;
  outline:0;
  box-shadow:none!important;
  background:transparent;
  padding:0;
  font:inherit;
  color:#223554;
}
.role-admin .modern-filter select{
  height:46px;
  width:100%;
  border:1px solid #dce5f1;
  border-radius:14px;
  padding:0 38px 0 13px;
  background:#fff;
  color:#32445f;
  font:inherit;
  outline:none;
}
.role-admin .modern-filter select:focus,
.role-admin .modern-search:focus-within{
  border-color:#73a0ff;
  box-shadow:0 0 0 3px rgba(64,116,235,.11);
}
.role-admin .modern-filter .btn{height:46px;white-space:nowrap;padding:0 18px;border-radius:13px}
.role-admin .modern-filter .btn.ghost{background:#f5f8fc;color:#51657f;border:1px solid #e4eaf3}
.role-admin .filter-result{margin-top:10px;padding-left:2px}

/* make empty data areas feel intentional, not like broken tables */
.role-admin .premium-table .premium-empty{padding:34px 18px 38px}
.role-admin .premium-table .premium-empty img{width:78px;height:78px}
.role-admin .premium-table thead th{height:44px;vertical-align:middle}
.role-admin .edu-data-card{border-radius:22px}
.role-admin .edu-card-head{padding:22px 22px 10px}
.role-admin .count-pill{box-shadow:inset 0 0 0 1px rgba(52,101,210,.05)}

/* polished management stats */
.role-admin .edu-stat-card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.role-admin .edu-stat-card:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(26,58,107,.08);border-color:#d4e0f1}

@media(max-width:1180px){
  .role-admin .modern-filter{grid-template-columns:minmax(260px,1fr) 155px 155px auto}
  .role-admin .modern-filter .btn.ghost{grid-column:auto}
}
@media(max-width:820px){
  .role-admin .modern-toolbar{margin:0 14px 12px}
  .role-admin .modern-filter{grid-template-columns:1fr 1fr;gap:9px}
  .role-admin .modern-search{grid-column:1/-1}
  .role-admin .modern-filter .btn{width:100%}
  .role-admin .filter-result{padding-left:0}
}
@media(max-width:520px){
  .role-admin .modern-filter{grid-template-columns:1fr}
  .role-admin .modern-filter>*{grid-column:1!important}
  .role-admin .modern-search,.role-admin .modern-filter select,.role-admin .modern-filter .btn{height:48px}
  .role-admin .edu-page-copy h1{font-size:26px}
  .role-admin .edu-card-head{padding:17px 15px 10px}
}

/* KAIH v1.1.4 - premium Data Siswa hero action buttons */
.role-admin .student-hero-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:10px;
  margin-top:20px;
}
.role-admin .premium-file-action{
  appearance:none;
  -webkit-appearance:none;
  min-width:190px;
  min-height:64px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:10px 14px 10px 10px;
  border:1px solid rgba(77,118,174,.13);
  border-radius:16px;
  background:rgba(255,255,255,.78);
  color:#17345f;
  text-decoration:none;
  font:inherit;
  text-align:left;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(28,73,137,.075), inset 0 1px 0 rgba(255,255,255,.72);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.role-admin .premium-file-action:hover{
  transform:translateY(-2px);
  border-color:rgba(52,104,199,.23);
  box-shadow:0 12px 28px rgba(28,73,137,.12), inset 0 1px 0 rgba(255,255,255,.8);
}
.role-admin .premium-file-action:active{transform:translateY(0)}
.role-admin .premium-file-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:linear-gradient(145deg,#f3f7ff,#e4efff);
  box-shadow:0 6px 15px rgba(42,91,168,.08);
}
.role-admin .premium-file-icon img{width:37px;height:37px;object-fit:contain}
.role-admin .premium-file-copy{display:grid;gap:2px;line-height:1.15}
.role-admin .premium-file-copy b{font-size:14px;color:#17345f;white-space:nowrap}
.role-admin .premium-file-copy small{font-size:10px;color:#7890ad;white-space:nowrap}
.role-admin .import-action{
  background:linear-gradient(145deg,rgba(245,255,250,.92),rgba(236,251,244,.92));
  border-color:rgba(47,170,111,.12);
}
.role-admin .import-action .premium-file-icon{background:linear-gradient(145deg,#ecfbf3,#daf5e7)}
.role-admin .student-add-action{
  min-height:64px;
  padding:0 20px 0 12px;
  gap:10px;
  border-radius:16px;
  background:linear-gradient(135deg,#2764eb,#3579f4);
  box-shadow:0 10px 24px rgba(39,100,235,.23);
}
.role-admin .student-add-action:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(39,100,235,.29)}
.role-admin .student-add-plus{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
  background:rgba(255,255,255,.16);font-size:23px;line-height:1;font-weight:500;
}
@media(max-width:760px){
  .role-admin .student-hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .role-admin .premium-file-action{min-width:0;width:100%;min-height:60px;padding:9px 11px}
  .role-admin .student-add-action{grid-column:1/-1;width:100%;min-height:58px}
  .role-admin .premium-file-copy b{font-size:13px}.role-admin .premium-file-copy small{font-size:9px}
}
@media(max-width:430px){
  .role-admin .student-hero-actions{grid-template-columns:1fr}
  .role-admin .student-add-action{grid-column:auto}
}


/* =========================================================
   KAIH v1.1.11 — SVG Icon System
   SVG handles optical centering; wrappers keep original layout sizing.
   ========================================================= */

/* SVG UI icons: no PNG baseline/padding issue, but do not force wrapper geometry globally. */
.nav-icon img,
.edu-stat-icon img,
.academy-stat-icon img,
.academy-period-icon img,
.teacher-action-icon img,
.teacher-scene-chip-icon img,
.premium-file-icon img,
.mini-premium-icon img,
.mn-icon img,
.class-symbol img,
.teacher-avatar-art img,
.student-avatar-premium img,
.habit-label img,
.edu-quick-card > img,
.brand-emblem img,
.logo-premium img {
  display:block;
  object-fit:contain;
  object-position:center;
  margin:0 auto;
  vertical-align:middle;
}

/* Navigation uses a compact balanced SVG size, preserving existing premium tile. */
.nav-icon{display:grid;place-items:center;overflow:visible}
.nav-icon img{width:24px;height:24px;max-width:24px;max-height:24px}
.nav-item.active .nav-icon img{width:25px;height:25px}

/* Dashboard and summary icons remain centered without changing their card dimensions. */
.edu-stat-icon,
.academy-stat-icon,
.academy-period-icon,
.teacher-action-icon,
.teacher-scene-chip-icon,
.premium-file-icon,
.class-symbol,
.mini-premium-icon,
.mn-icon {display:grid;place-items:center}

.edu-stat-icon img{width:34px;height:34px}
.academy-stat-icon img{width:32px;height:32px}
.academy-period-icon img{width:32px;height:32px}
.teacher-action-icon img{width:34px;height:34px}
.teacher-scene-chip-icon img{width:26px;height:26px}
.premium-file-icon img{width:30px;height:30px}
.class-symbol img{width:32px;height:32px}
.mini-premium-icon img{width:24px;height:24px}
.mn-icon img{width:24px;height:24px}

/* Keep illustration-size teacher/student art untouched; only SVG list avatars get controlled sizing. */
.teacher-avatar-art img[src$=".svg"],
.student-avatar-premium img[src$=".svg"]{width:34px;height:34px}

/* Brand logo SVG has exact viewBox so no special transform is necessary. */
.brand-emblem{display:grid;place-items:center}
.brand-emblem img{width:34px;height:34px}
.logo-premium img{width:64px;height:64px}

/* Habit labels and quick access icons */
.habit-label img{width:22px;height:22px}
.edu-quick-card > img{width:46px;height:46px}

/* SVGs must stay crisp and must never receive legacy PNG transform nudges. */
img[src$=".svg"]{image-rendering:auto;transform:none}

@media(max-width:760px){
  .nav-icon img{width:23px;height:23px;max-width:23px;max-height:23px}
  .edu-stat-icon img{width:31px;height:31px}
  .teacher-action-icon img{width:31px;height:31px}
  .premium-file-icon img{width:28px;height:28px}
}

/* KAIH v1.1.15 — dashboard visual rebuild from approved mockup */
.role-admin{background:#f5f9ff;color:#0d2d6c}
.role-admin .sidebar{width:245px;padding:18px 14px 16px;background:#fff;border-right:1px solid #e6eef9;box-shadow:none}
.role-admin .main{margin-left:245px;background:#f6faff}
.role-admin .content{padding:18px 24px 30px}
.role-admin .brand-premium{padding:2px 8px 17px;gap:11px;text-decoration:none}
.role-admin .brand-emblem{width:54px;height:54px;flex:0 0 54px;border:0;box-shadow:none;background:transparent;border-radius:15px;overflow:hidden}
.role-admin .brand-emblem img{width:100%;height:100%;display:block;object-fit:cover;border-radius:15px}
.role-admin .brand-premium b{font-size:23px;line-height:1;color:#0f3274;letter-spacing:.01em}
.role-admin .brand-premium span{font-size:10px;line-height:1.35;color:#5574ad;margin-top:5px;max-width:125px}
.role-admin .sidebar nav{gap:4px}
.role-admin .nav-item{min-height:48px;padding:6px 9px;border-radius:14px;gap:10px;font-size:12px;font-weight:750;color:#173a77}
.role-admin .nav-item.active{background:linear-gradient(90deg,#edf4ff,#f4f8ff);color:#1260ea;box-shadow:inset 3px 0 0 #2369f2}
.role-admin .nav-icon.premium{width:38px;height:38px;flex:0 0 38px;padding:0;border-radius:12px;background:transparent;box-shadow:none;overflow:hidden}
.role-admin .nav-icon.premium img{width:100%;height:100%;display:block;object-fit:cover;border-radius:12px}
.role-admin .sidebar-foot{padding:14px 6px 2px;border-top:1px solid #e9eff8}
.role-admin .user-chip{background:#f7faff;border:1px solid #e6eef9;border-radius:14px;padding:10px}
.role-admin .logout{font-size:11px;color:#ff3950}

.role-admin .topbar-modern{height:64px;padding:0 24px;background:#fff;border-bottom:1px solid #e7eef8;box-shadow:0 2px 10px rgba(45,88,150,.04);gap:12px}
.role-admin .admin-hamb{display:grid;width:38px;height:38px;padding:0;place-items:center;border:1px solid #dce8fb;background:#f3f8ff;color:#1464ea;border-radius:11px;font-size:17px}
.role-admin .top-search{width:min(500px,50vw);height:38px;border-radius:12px;background:#f3f7fd;display:flex;align-items:center;gap:8px;padding:0 12px;color:#7692c5}
.role-admin .top-search>span{font-size:21px;line-height:1;transform:rotate(-18deg)}
.role-admin .top-search input{width:100%;border:0;background:transparent;outline:none;color:#274a82;font:inherit;font-size:11px}
.role-admin .top-search input::placeholder{color:#8da1c5}
.role-admin .top-actions{margin-left:auto;display:flex;align-items:center;gap:10px}
.role-admin .notify-btn{position:relative;width:38px;height:38px;border:0;border-radius:12px;background:#f3f7fd;color:#2665db;font-size:17px;display:grid;place-items:center;cursor:pointer}
.role-admin .notify-btn b{position:absolute;right:-3px;top:-5px;min-width:18px;height:18px;border-radius:10px;padding:0 4px;background:#ff3b55;color:#fff;border:2px solid #fff;font-size:9px;line-height:14px}
.role-admin .top-user{display:flex!important;align-items:center;gap:8px;margin:0}
.role-admin .top-user .top-avatar{width:38px;height:38px;border-radius:12px;background:#eff5ff;color:#1464ea;box-shadow:inset 0 0 0 1px #dfe9fb}
.role-admin .top-user b{font-size:11px;color:#12356f}.role-admin .top-user span{font-size:9px;color:#7990b7}
.role-admin .top-chevron{color:#0e387a;font-size:19px;margin-left:4px}

.dash15-hero{height:182px;border-radius:20px;overflow:hidden;position:relative;background:linear-gradient(100deg,#dff2ff 0%,#def3ff 38%,#d6edff 100%);border:1px solid #dcecfb;box-shadow:0 8px 24px rgba(45,91,157,.06);margin-bottom:14px}
.dash15-hero-copy{position:relative;z-index:2;width:54%;padding:25px 30px}
.dash15-hero-copy h1{margin:0;color:#12377b;font-size:31px;line-height:1.05;letter-spacing:-.025em}.dash15-hero-copy h1 span{color:#2a69ef}
.dash15-hero-copy p{margin:10px 0 0;max-width:620px;color:#345e98;font-size:12px;line-height:1.55}
.dash15-hero-art{position:absolute;right:0;top:0;bottom:0;width:64%;background-image:linear-gradient(90deg,#def3ff 0%,rgba(222,243,255,.84) 7%,rgba(222,243,255,0) 23%),url('../images/illustrations/admin-hero-children.jpg');background-size:auto 100%,cover;background-position:left center,center center;background-repeat:no-repeat}

.dash15-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:14px}
.dash15-stat{min-width:0;min-height:88px;background:#fff;border:1px solid #e4ecf7;border-radius:16px;padding:10px 12px;display:flex;align-items:center;gap:9px;text-decoration:none;box-shadow:0 5px 16px rgba(41,80,139,.045);transition:.18s}
.dash15-stat:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(41,80,139,.09)}
.dash15-stat-icon{width:55px;height:55px;flex:0 0 55px;border-radius:14px;overflow:hidden;background:#f2f8ff;display:flex;align-items:center;justify-content:center}
.dash15-stat-icon img{width:100%;height:100%;display:block;object-fit:cover;border-radius:14px}
.dash15-stat-copy{display:grid;min-width:0;line-height:1.08}.dash15-stat-copy small{font-size:9px;color:#5f7cad}.dash15-stat-copy strong{font-size:23px;color:#0d3278;margin:4px 0 3px}.dash15-stat-copy em{font-size:8.5px;color:#7d93b8;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.dash15-main-grid{display:grid;grid-template-columns:1.35fr .95fr;gap:12px}
.dash15-panel{background:#fff;border:1px solid #e4ecf7;border-radius:18px;box-shadow:0 6px 20px rgba(41,80,139,.045);min-height:300px;padding:16px}
.dash15-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.dash15-panel-head>div>span,.dash15-section-kicker{display:block;color:#5578b2;font-size:9px;letter-spacing:.08em;font-weight:800}.dash15-panel-head h2{margin:4px 0 0;color:#0c3173;font-size:18px}.dash15-panel-head>b{padding:6px 10px;border-radius:999px;background:#e8f8ef;color:#06985d;font-size:9px}.dash15-panel-head>a{color:#1763eb;text-decoration:none;font-size:10px;font-weight:750;margin-top:4px}
.dash15-progress-body{display:grid;grid-template-columns:180px 1fr;align-items:center;gap:20px;min-height:235px;padding-top:8px}
.dash15-ring{--score:0;width:134px;height:134px;margin:auto;border-radius:50%;background:conic-gradient(#2e72f2 calc(var(--score)*1%),#edf3fb 0);display:grid;place-items:center;position:relative}.dash15-ring:after{content:"";position:absolute;inset:14px;background:#fff;border-radius:50%}.dash15-ring>div{position:relative;z-index:2;text-align:center}.dash15-ring strong{display:block;color:#123d8d;font-size:31px;line-height:1}.dash15-ring small{display:block;color:#7d91b4;font-size:10px;margin-top:5px}
.dash15-habits{display:grid;gap:7px}.dash15-habit-row{display:grid;gap:4px}.dash15-habit-title{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#244c88;font-size:10px}.dash15-habit-title>span{display:flex;align-items:center;gap:7px;min-width:0}.dash15-habit-title img{width:21px;height:21px;display:block;object-fit:cover;border-radius:7px}.dash15-habit-title b{font-size:9px;color:#5f78a2}.dash15-track{height:6px;background:#eaf0f8;border-radius:999px;overflow:hidden}.dash15-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2e72f2,#78a6ff)}
.dash15-activity-panel{display:flex;flex-direction:column}.dash15-empty{flex:1;display:grid;place-items:center;align-content:center;text-align:center;padding:10px}.dash15-empty img{width:180px;height:128px;object-fit:cover;object-position:center;border-radius:22px;margin-bottom:2px}.dash15-empty b{font-size:16px;color:#0d3174}.dash15-empty span{font-size:10px;line-height:1.45;color:#7991b8;margin-top:6px}.dash15-student-list{display:grid;margin-top:12px}.dash15-student-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #edf2f8}.dash15-student-row:last-child{border-bottom:0}.dash15-student-avatar{width:38px;height:38px;flex:0 0 38px;border-radius:11px;overflow:hidden}.dash15-student-avatar img{width:100%;height:100%;object-fit:cover}.dash15-student-row>span:nth-child(2){display:grid;min-width:0}.dash15-student-row b{font-size:10px;color:#183d78}.dash15-student-row small{font-size:8px;color:#8397b6}.dash15-student-row em{margin-left:auto;font-style:normal;padding:5px 7px;border-radius:9px;background:#e9f8ef;color:#07955b;font-size:9px;font-weight:800}

.dash15-quick-section{margin-top:12px}.dash15-section-kicker{margin:0 0 7px 2px}.dash15-quick-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.dash15-quick-grid>a{background:#fff;border:1px solid #e4ecf7;border-radius:15px;min-height:112px;padding:8px 8px 10px;text-decoration:none;display:grid;justify-items:center;text-align:center;align-content:center;box-shadow:0 5px 15px rgba(41,80,139,.04);transition:.18s}.dash15-quick-grid>a:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(41,80,139,.09)}.dash15-quick-grid img{width:58px;height:58px;object-fit:cover;border-radius:14px;margin-bottom:1px}.dash15-quick-grid b{font-size:10px;color:#113776}.dash15-quick-grid small{font-size:8px;color:#7d92b5;line-height:1.35;margin-top:2px}

@media(max-width:1250px){.dash15-stats{grid-template-columns:repeat(3,1fr)}.dash15-quick-grid{grid-template-columns:repeat(3,1fr)}.dash15-hero-copy{width:60%}.dash15-hero-art{width:58%}.dash15-main-grid{grid-template-columns:1fr}}
@media(max-width:980px){.role-admin .main{margin-left:0}.role-admin .sidebar{width:286px}.role-admin .top-search{width:min(520px,60vw)}.dash15-hero-copy{width:72%}.dash15-hero-art{opacity:.72;width:55%}.dash15-progress-body{grid-template-columns:150px 1fr}}
@media(max-width:700px){.role-admin .content{padding:12px 12px 88px}.role-admin .topbar-modern{height:60px;padding:0 12px}.role-admin .top-search{flex:1;width:auto}.role-admin .top-user>div:last-child,.role-admin .top-chevron{display:none}.dash15-hero{height:210px}.dash15-hero-copy{width:100%;padding:22px 20px;background:linear-gradient(90deg,rgba(225,244,255,.96) 0%,rgba(225,244,255,.88) 55%,rgba(225,244,255,.18) 100%)}.dash15-hero-copy h1{font-size:27px}.dash15-hero-copy p{font-size:11px;max-width:80%}.dash15-hero-art{width:100%;opacity:.62;background-image:linear-gradient(90deg,#def3ff 0%,rgba(222,243,255,.75) 25%,rgba(222,243,255,0) 52%),url('../images/illustrations/admin-hero-children.jpg')}.dash15-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dash15-stat{padding:8px;min-height:78px}.dash15-stat-icon{width:46px;height:46px;flex-basis:46px}.dash15-stat-copy strong{font-size:20px}.dash15-progress-body{grid-template-columns:1fr}.dash15-ring{width:112px;height:112px}.dash15-main-grid{gap:10px}.dash15-panel{padding:13px}.dash15-panel-head h2{font-size:15px}.dash15-quick-grid{grid-template-columns:repeat(2,1fr);gap:8px}.dash15-quick-grid>a{min-height:105px}.dash15-empty img{width:150px;height:108px}}
@media(max-width:430px){.role-admin .top-search input{font-size:9px}.role-admin .notify-btn{display:none}.dash15-hero{height:190px}.dash15-hero-copy h1{font-size:24px}.dash15-hero-copy p{max-width:88%;font-size:10px}.dash15-stats{grid-template-columns:1fr 1fr}.dash15-stat-icon{width:42px;height:42px;flex-basis:42px}.dash15-quick-grid img{width:52px;height:52px}}

/* KAIH v1.1.16 — Data Siswa approved visual polish */
.role-admin .student-page-hero{min-height:238px;padding:30px 34px;background:linear-gradient(110deg,#eef9ff 0%,#e6f4ff 52%,#d9ecff 100%);border:1px solid #d8e9fb;border-radius:26px;overflow:hidden}
.role-admin .student-page-hero .edu-page-copy{position:relative;z-index:2;max-width:650px}
.role-admin .student-page-hero .edu-page-copy h1{font-size:38px;line-height:1.04;letter-spacing:-1.2px;margin:7px 0 10px;color:#0d326c}
.role-admin .student-page-hero .edu-page-copy p{font-size:15px;line-height:1.6;max-width:620px;color:#58779e}
.role-admin .student-page-hero .student-art{right:20px;bottom:0;width:390px;height:220px}
.role-admin .student-page-hero .student-art .art-main{width:148px;height:148px;right:74px;bottom:26px;filter:drop-shadow(0 14px 18px rgba(40,92,170,.14))}
.role-admin .student-page-hero .student-art .art-float.one{width:44px;height:44px;right:18px;top:18px}
.role-admin .student-page-hero .student-art .art-float.two{width:48px;height:48px;left:38px;bottom:32px}
.role-admin .student-page-hero .student-art .art-copy{right:0;bottom:20px;font-size:13px;line-height:1.25;color:#1553bd;text-align:right}
.role-admin .student-hero-actions{margin-top:18px;gap:10px}
.role-admin .premium-file-action{min-width:184px;min-height:62px;border-radius:15px}
.role-admin .premium-file-icon{width:44px;height:44px;flex-basis:44px;border-radius:13px}
.role-admin .premium-file-icon img{width:34px;height:34px;display:block;object-fit:contain}
.role-admin .student-add-action{min-height:62px;border-radius:15px;padding-right:22px}
.role-admin .student-summary{gap:14px;margin-top:16px;max-width:760px}
.role-admin .student-summary .edu-stat-card{min-height:104px;padding:17px 18px;border-radius:20px}
.role-admin .student-summary .edu-stat-icon{width:54px;height:54px;flex:0 0 54px;border-radius:16px;display:grid;place-items:center}
.role-admin .student-summary .edu-stat-icon img{width:43px;height:43px;display:block;object-fit:contain}
.role-admin .edu-data-card{margin-top:16px;border-radius:24px;overflow:hidden}
.role-admin .student-toolbar{padding-top:4px}
.role-admin .modern-search,.role-admin .modern-filter select{border-radius:13px;background:#fff}
.role-admin .student-table .student-avatar-premium{display:grid;place-items:center;overflow:hidden}
.role-admin .student-table .student-avatar-premium img{width:31px;height:31px;object-fit:contain;display:block}
.role-admin .premium-empty img{width:72px;height:72px;object-fit:contain;display:block;margin:0 auto 12px}
@media(max-width:1100px){.role-admin .student-page-hero .student-art{opacity:.52;right:-35px}.role-admin .student-page-hero .edu-page-copy{max-width:620px}}
@media(max-width:760px){.role-admin .student-page-hero{padding:24px 20px;min-height:auto}.role-admin .student-page-hero .student-art{display:none}.role-admin .student-page-hero .edu-page-copy h1{font-size:31px}.role-admin .student-summary{max-width:none}.role-admin .student-summary .edu-stat-card{min-height:92px}}

/* =========================================================
   KAIH v1.1.18 — Data Siswa summary card proportion fix
   Keep the three cards horizontal and spacious on desktop.
   ========================================================= */
.role-admin .student-summary{
  width:min(100%,980px);
  max-width:980px;
  display:grid;
  grid-template-columns:repeat(3,minmax(250px,1fr)) !important;
  gap:16px;
  margin-top:18px;
  margin-bottom:18px;
}
.role-admin .student-summary .edu-stat-card{
  min-width:0;
  min-height:112px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:16px;
  border-radius:20px;
}
.role-admin .student-summary .edu-stat-icon{
  width:62px;
  height:62px;
  flex:0 0 62px;
  border-radius:18px;
}
.role-admin .student-summary .edu-stat-icon img{
  width:50px;
  height:50px;
  object-fit:contain;
}
.role-admin .student-summary .edu-stat-card>div:last-child{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  line-height:1.2;
}
.role-admin .student-summary .edu-stat-card span{
  font-size:12px;
  line-height:1.25;
  white-space:nowrap;
}
.role-admin .student-summary .edu-stat-card strong{
  font-size:29px;
  line-height:1;
  margin:5px 0 6px;
}
.role-admin .student-summary .edu-stat-card small{
  font-size:11px;
  line-height:1.3;
  white-space:normal;
}
@media(max-width:1180px){
  .role-admin .student-summary{
    width:100%;
    max-width:none;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .role-admin .student-summary .edu-stat-card{padding:16px;gap:12px}
  .role-admin .student-summary .edu-stat-icon{width:54px;height:54px;flex-basis:54px}
  .role-admin .student-summary .edu-stat-icon img{width:43px;height:43px}
}
@media(max-width:820px){
  .role-admin .student-summary{
    grid-template-columns:1fr !important;
    gap:10px;
  }
  .role-admin .student-summary .edu-stat-card{
    min-height:88px;
    padding:14px 16px;
  }
  .role-admin .student-summary .edu-stat-card span,
  .role-admin .student-summary .edu-stat-card small{white-space:normal}
}

/* KAIH v1.1.26 — Premium Admin Topbar */
.role-admin .topbar-premium{
  min-height:74px;height:74px;padding:0 28px 0 24px;background:rgba(255,255,255,.94);
  border-bottom:1px solid #e8eef8;box-shadow:0 5px 18px rgba(27,67,124,.045);
  display:flex;align-items:center;justify-content:space-between;gap:24px;backdrop-filter:blur(14px);
  position:sticky;top:0;z-index:80
}
.role-admin .topbar-left{display:flex;align-items:center;gap:14px;min-width:0;flex:1}
.role-admin .premium-hamb{width:44px;height:44px;min-width:44px;border:1px solid #dbe7f7;border-radius:13px;background:#f7faff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:0;box-shadow:none;transition:.2s ease}
.role-admin .premium-hamb:hover{background:#eef5ff;border-color:#c9dcf7;transform:translateY(-1px)}
.role-admin .premium-hamb span{display:block;width:16px;height:2px;border-radius:999px;background:#1766df;margin:0;line-height:0;font-size:0}
.role-admin .premium-search{height:44px;width:min(540px,48vw);display:flex;align-items:center;gap:10px;background:#f5f8fd;border:1px solid transparent;border-radius:14px;padding:0 13px;transition:.2s ease;position:relative}
.role-admin .premium-search:focus-within{background:#fff;border-color:#bdd5fb;box-shadow:0 0 0 4px rgba(47,111,239,.08)}
.role-admin .premium-search .search-svg{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:#6e8ab5;stroke-width:1.9;stroke-linecap:round}
.role-admin .premium-search input{width:100%;height:100%;border:0!important;outline:0!important;background:transparent!important;padding:0!important;box-shadow:none!important;color:#173f78;font-size:13px}
.role-admin .premium-search input::placeholder{color:#91a4c2;opacity:1}
.role-admin .search-hint{display:inline-flex;align-items:center;justify-content:center;height:24px;padding:0 8px;border-radius:7px;background:#fff;border:1px solid #e2eaf5;color:#91a1b9;font-size:9px;font-weight:800;letter-spacing:.02em;white-space:nowrap}
.role-admin .premium-actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.role-admin .premium-notify{width:42px;height:42px;border:1px solid #e0e9f6;background:#f7faff;border-radius:13px;display:grid;place-items:center;position:relative;padding:0;cursor:pointer;transition:.2s ease}
.role-admin .premium-notify:hover{background:#eef5ff;border-color:#cbdcf5;transform:translateY(-1px)}
.role-admin .premium-notify svg{width:18px;height:18px;fill:none;stroke:#326fdc;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.role-admin .premium-notify b{position:absolute;right:-5px;top:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#ff3855;color:#fff;border:2px solid #fff;display:flex;align-items:center;justify-content:center;font-size:9px;line-height:1;font-weight:900;box-shadow:0 4px 10px rgba(255,56,85,.22)}
.role-admin .top-divider{width:1px;height:30px;background:#e9eef6;margin:0 2px}
.role-admin .profile-control{height:48px;display:flex;align-items:center;gap:10px;border:0;background:transparent;border-radius:14px;padding:3px 7px 3px 4px;cursor:pointer;transition:.2s ease;text-align:left}
.role-admin .profile-control:hover{background:#f6f9fe}
.role-admin .premium-top-avatar{width:42px;height:42px;min-width:42px;border-radius:13px;background:linear-gradient(145deg,#eef4ff,#dfeaff);border:1px solid #d7e3f6;color:#1d63d4;display:grid;place-items:center;font-size:15px;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.role-admin .profile-copy{display:flex;flex-direction:column;min-width:105px;line-height:1.15}
.role-admin .profile-copy b{font-size:12px;font-weight:850;color:#0c3477;white-space:nowrap;max-width:150px;overflow:hidden;text-overflow:ellipsis}
.role-admin .profile-copy small{margin-top:4px;font-size:9.5px;color:#8195b3;font-weight:500}
.role-admin .profile-chevron{width:16px;height:16px;fill:none;stroke:#173f78;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-left:2px}
@media(max-width:1100px){.role-admin .premium-search{width:min(460px,44vw)}.role-admin .profile-copy{display:none}.role-admin .profile-control{gap:4px}.role-admin .top-divider{display:none}}
@media(max-width:760px){.role-admin .topbar-premium{height:66px;min-height:66px;padding:0 14px;gap:10px}.role-admin .topbar-left{gap:9px}.role-admin .premium-hamb{width:40px;height:40px;min-width:40px;border-radius:12px}.role-admin .premium-search{height:40px;width:auto;flex:1;border-radius:12px}.role-admin .search-hint{display:none}.role-admin .premium-actions{gap:7px}.role-admin .premium-notify{width:40px;height:40px;border-radius:12px}.role-admin .premium-top-avatar{width:40px;height:40px;min-width:40px;border-radius:12px}.role-admin .profile-chevron{display:none}.role-admin .profile-control{padding:0}}
@media(max-width:520px){.role-admin .topbar-premium{padding:0 10px}.role-admin .premium-search{padding:0 10px}.role-admin .premium-search input{font-size:12px}.role-admin .premium-notify{display:none}}

/* =========================================================
   KAIH v1.1.30 — Mobile drawer below sticky topbar
   Prevent sidebar from being covered by the search/header bar.
   ========================================================= */
@media (max-width:980px){
  body.role-admin.menu-open{overflow:hidden}
  .role-admin .sidebar{
    top:74px !important;
    bottom:0 !important;
    height:calc(100dvh - 74px) !important;
    max-height:calc(100dvh - 74px) !important;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    z-index:70 !important;
    border-top:1px solid #e8eef8;
    box-shadow:10px 18px 32px rgba(19,52,102,.14) !important;
  }
  .role-admin.menu-open .menu-overlay{
    display:block;
    position:fixed;
    left:0;
    right:0;
    top:74px !important;
    bottom:0;
    background:rgba(17,36,68,.32);
    backdrop-filter:blur(2px);
    z-index:60 !important;
  }
  .role-admin .topbar-premium{z-index:80 !important}
}
@media (max-width:760px){
  .role-admin .sidebar{
    top:66px !important;
    height:calc(100dvh - 66px) !important;
    max-height:calc(100dvh - 66px) !important;
    padding-top:14px;
  }
  .role-admin.menu-open .menu-overlay{top:66px !important}
}

/* =========================================================
   KAIH v1.1.32 — Mobile dashboard hero refinement (cumulative)
   Keeps v1.1.30 drawer-under-header fix intact.
   ========================================================= */
@media (max-width:700px){
  .role-admin .dash15-hero{
    height:268px;
    border-radius:22px;
    overflow:hidden;
    position:relative;
    background:linear-gradient(180deg,#e6f5ff 0%,#d9efff 54%,#d2eaff 100%);
    box-shadow:0 12px 30px rgba(43,92,164,.10);
  }
  .role-admin .dash15-hero:before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(237,248,255,.99) 0%,rgba(237,248,255,.97) 42%,rgba(237,248,255,.72) 58%,rgba(237,248,255,.08) 78%,rgba(237,248,255,0) 100%);
  }
  .role-admin .dash15-hero-copy{
    position:relative;
    z-index:3;
    width:100%;
    padding:24px 22px 0;
    background:none;
  }
  .role-admin .dash15-hero-copy h1{
    font-size:29px;
    line-height:1.04;
    letter-spacing:-.035em;
    max-width:320px;
    text-shadow:0 1px 0 rgba(255,255,255,.6);
  }
  .role-admin .dash15-hero-copy p{
    margin-top:11px;
    max-width:330px;
    font-size:11.5px;
    line-height:1.58;
    color:#2f5b94;
  }
  .role-admin .dash15-hero-art{
    z-index:0;
    width:100%;
    height:100%;
    inset:0;
    opacity:1;
    background-image:url('../images/illustrations/admin-hero-children.jpg');
    background-size:cover;
    background-position:center 62%;
    background-repeat:no-repeat;
  }
}
@media (max-width:430px){
  .role-admin .dash15-hero{height:252px;border-radius:20px}
  .role-admin .dash15-hero-copy{padding:21px 18px 0}
  .role-admin .dash15-hero-copy h1{font-size:27px;max-width:290px}
  .role-admin .dash15-hero-copy p{max-width:300px;font-size:10.5px;line-height:1.55}
  .role-admin .dash15-hero-art{background-size:cover;background-position:center 66%}
}


/* KAIH v1.1.40 - functional admin topbar */
.role-admin .premium-search{margin:0}
.role-admin .premium-search .search-hint{
  appearance:none;border:1px solid #d7e2f2;background:#fff;color:#6f87ab;
  border-radius:9px;padding:4px 10px;font:900 10px/1.1 inherit;cursor:pointer;
  transform:rotate(-9deg);box-shadow:0 2px 5px rgba(27,68,123,.08);transition:.18s ease
}
.role-admin .premium-search .search-hint:hover{color:#1f65df;border-color:#b9d0f4;background:#f7fbff;transform:rotate(-5deg)}
.role-admin .top-popover-wrap{position:relative;display:flex;align-items:center}
.role-admin .top-popover{
  position:absolute;right:0;top:calc(100% + 12px);z-index:140;width:360px;
  border:1px solid #dce8f6;background:#fff;border-radius:18px;
  box-shadow:0 22px 55px rgba(30,61,106,.18);overflow:hidden
}
.role-admin .top-popover[hidden]{display:none!important}
.role-admin .popover-head{padding:16px 17px 13px;border-bottom:1px solid #edf2f8;background:linear-gradient(180deg,#fff,#fbfdff)}
.role-admin .popover-head b{display:block;color:#103f79;font-size:13px}
.role-admin .popover-head span{display:block;color:#8498b6;font-size:10px;margin-top:3px}
.role-admin .notification-list{padding:7px}
.role-admin .notification-item{display:grid;grid-template-columns:10px 1fr 16px;gap:10px;align-items:center;padding:11px 9px;border-radius:12px;color:inherit;text-decoration:none}
.role-admin .notification-item:hover{background:#f4f8fe}
.role-admin .notification-dot{width:8px;height:8px;border-radius:99px;background:#2f72ea;box-shadow:0 0 0 4px #e8f1ff}
.role-admin .notification-item b{display:block;color:#183f72;font-size:11px;line-height:1.35}
.role-admin .notification-item small{display:block;color:#8496af;font-size:9.5px;line-height:1.45;margin-top:2px}
.role-admin .notification-arrow{font-size:20px;color:#9bacc2}
.role-admin .notification-empty{padding:24px 16px;text-align:center;color:#7f94b0;display:flex;flex-direction:column;align-items:center;gap:4px}
.role-admin .notification-empty>span{width:34px;height:34px;border-radius:12px;background:#eaf8f0;color:#26905a;display:grid;place-items:center;font-weight:900;margin-bottom:4px}
.role-admin .notification-empty b{font-size:12px;color:#31567e}
.role-admin .notification-empty small{font-size:10px}
.role-admin .profile-popover{width:280px;padding:8px}
.role-admin .profile-menu-head{display:flex;align-items:center;gap:10px;padding:10px 9px 13px;border-bottom:1px solid #edf2f8;margin-bottom:5px}
.role-admin .profile-menu-head .avatar{width:38px;height:38px;min-width:38px;border-radius:12px}
.role-admin .profile-menu-head b{display:block;font-size:12px;color:#123d76}
.role-admin .profile-menu-head small{display:block;font-size:9.5px;color:#8ca0bb;margin-top:2px}
.role-admin .profile-popover>a{display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:center;text-decoration:none;color:#1c477c;border-radius:11px;padding:9px}
.role-admin .profile-popover>a:hover{background:#f4f8fe}
.role-admin .profile-popover>a>span{width:30px;height:30px;border-radius:10px;background:#edf4ff;display:grid;place-items:center;color:#2769dd;font-weight:900}
.role-admin .profile-popover>a b{display:block;font-size:11px}
.role-admin .profile-popover>a small{display:block;color:#8a9db7;font-size:9px;margin-top:2px}
.role-admin .profile-popover>a.profile-logout{color:#a43e4c}
.role-admin .profile-popover>a.profile-logout>span{background:#fff0f2;color:#dd4259}
.role-admin .profile-control[aria-expanded="true"],.role-admin .premium-notify[aria-expanded="true"]{background:#eef5ff}
@media(max-width:760px){
  .role-admin .top-popover{position:fixed;left:12px;right:12px;top:72px;width:auto;max-width:none}
  .role-admin .profile-popover{left:auto;right:12px;width:min(280px,calc(100vw - 24px))}
}


/* KAIH v1.1.43 - Premium Login */
.login-page.login-premium{
  min-height:100vh;display:grid;place-items:center;padding:28px 18px;overflow:auto;
  background:
    radial-gradient(circle at 8% 16%,rgba(135,187,255,.24) 0 10%,transparent 28%),
    radial-gradient(circle at 91% 23%,rgba(191,218,255,.25) 0 11%,transparent 29%),
    radial-gradient(circle at 86% 92%,rgba(126,179,255,.18) 0 12%,transparent 31%),
    linear-gradient(145deg,#f4f8ff 0%,#ffffff 47%,#eef5ff 100%);
}
.login-premium .login-card{
  width:min(520px,100%);padding:42px 44px 32px;border-radius:30px;border:1px solid rgba(215,228,247,.9);
  background:rgba(255,255,255,.96);box-shadow:0 28px 70px rgba(36,75,135,.15);
  position:relative;overflow:hidden;
}
.login-premium .login-card:before{
  content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-92px;top:-102px;
  background:radial-gradient(circle,#eaf3ff 0%,rgba(234,243,255,0) 70%);pointer-events:none
}
.login-premium .login-brand-icon{
  width:112px;height:112px;margin:0 auto 18px;display:block;filter:drop-shadow(0 10px 16px rgba(46,112,231,.14))
}
.login-premium .login-title{text-align:center;margin-bottom:30px}
.login-premium .login-title h1{font-size:34px;line-height:1.08;margin:0;color:#193a67;font-weight:900;letter-spacing:-.035em}
.login-premium .login-title h1 span{color:#2f6df0}
.login-premium .login-title p{margin:10px auto 0;max-width:420px;color:#7187a8;font-size:15px;line-height:1.55}
.login-premium .alert{margin:0 0 18px}
.login-premium .field{gap:8px}
.login-premium .field+.field{margin-top:16px!important}
.login-premium .field label{font-size:13px;color:#294a75;font-weight:850}
.login-premium .login-input-wrap{position:relative}
.login-premium .login-input-wrap>svg{
  position:absolute;left:17px;top:50%;transform:translateY(-50%);width:23px;height:23px;
  fill:none;stroke:#2f78ef;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;z-index:2
}
.login-premium .field input{
  height:58px;border-radius:16px;padding:0 52px 0 54px;background:linear-gradient(180deg,#f7fbff,#f1f7ff);
  border:1px solid #cfe0f6;color:#17385f;font-size:15px;font-weight:650;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)
}
.login-premium .field input:focus{
  border-color:#6ea5f5;box-shadow:0 0 0 4px rgba(72,132,238,.10),inset 0 1px 0 #fff;background:#fff
}
.login-premium .password-toggle{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;border-radius:11px;
  background:transparent;color:#758aa8;display:grid;place-items:center;cursor:pointer
}
.login-premium .password-toggle:hover{background:#eaf2ff;color:#276ce1}
.login-premium .password-toggle svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.login-premium .login-submit{
  width:100%;height:58px;margin-top:22px;border-radius:17px;background:linear-gradient(90deg,#2961ed 0%,#2f77f3 55%,#2d98f3 100%);
  box-shadow:0 13px 25px rgba(40,103,231,.22);font-size:16px;font-weight:900;gap:12px;transition:.2s ease
}
.login-premium .login-submit:hover{transform:translateY(-1px);box-shadow:0 16px 30px rgba(40,103,231,.28)}
.login-premium .login-submit svg{width:21px;height:21px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.login-premium .login-version{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:26px;color:#8aa0bd;font-size:12px}
.login-premium .login-version:before,.login-premium .login-version:after{content:"";height:1px;width:72px;background:#dce7f6}
@media(max-width:600px){
  .login-page.login-premium{padding:18px 14px}
  .login-premium .login-card{padding:32px 20px 24px;border-radius:24px}
  .login-premium .login-brand-icon{width:92px;height:92px;margin-bottom:14px}
  .login-premium .login-title{margin-bottom:24px}
  .login-premium .login-title h1{font-size:28px}
  .login-premium .login-title p{font-size:13px}
  .login-premium .field input{height:54px;border-radius:15px}
  .login-premium .login-submit{height:54px;border-radius:15px}
}


/* KAIH v1.1.48 - Premium Student Dashboard */
.student-dashboard-v148{display:grid;gap:16px}
.student-welcome-v148{min-height:205px;border-radius:24px;overflow:hidden;position:relative;padding:28px 30px;display:grid;grid-template-columns:minmax(0,1fr) 340px 220px;align-items:center;gap:18px;background:linear-gradient(135deg,#e8f5ff 0%,#d7eaff 48%,#cfe7ff 100%);border:1px solid #d3e7fb;box-shadow:0 12px 32px rgba(47,91,148,.08)}
.student-welcome-v148:before{content:"";position:absolute;width:420px;height:250px;left:39%;top:-50px;transform:rotate(-16deg);background:linear-gradient(135deg,rgba(255,255,255,.45),rgba(255,255,255,0));border-radius:50%}
.welcome-copy,.welcome-art,.welcome-side{position:relative;z-index:1}.welcome-kicker{display:block;color:#204a7d;font-size:15px;font-weight:750;margin-bottom:5px}.welcome-copy h1{font-size:31px;line-height:1.08;margin:0;color:#123b75;letter-spacing:-.035em}.welcome-copy h1 span{font-size:28px}.welcome-copy p{margin:11px 0 0;color:#3c638f;line-height:1.6;font-size:12.5px;max-width:510px}
.welcome-art{height:180px;display:flex;align-items:flex-end;justify-content:center}.student-portrait{width:150px;height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;filter:drop-shadow(0 15px 18px rgba(49,90,137,.18))}.portrait-head{font-size:78px;line-height:.88}.portrait-body{font-size:70px;margin-top:-14px}.speech-bubble{position:absolute;right:-8px;top:12px;width:150px;padding:14px;border-radius:20px;background:#fff;color:#375a86;font-size:10.5px;line-height:1.5;font-weight:750;box-shadow:0 8px 20px rgba(61,103,159,.11)}.speech-bubble:after{content:"";position:absolute;left:24px;bottom:-10px;border:10px solid transparent;border-top-color:#fff;border-bottom:0}
.welcome-side{display:grid;gap:12px}.welcome-date-card,.welcome-motivation{min-height:73px;padding:15px;border-radius:18px;background:rgba(255,255,255,.84);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 20px rgba(63,101,151,.06);position:relative}.welcome-date-card span{display:block;color:#214870;font-weight:850;font-size:12px}.welcome-date-card b{display:block;color:#6b85a5;font-size:10px;margin-top:4px}.welcome-date-card i{position:absolute;right:14px;top:20px;font-style:normal;font-size:22px}.welcome-motivation{display:flex;align-items:center;gap:12px}.welcome-motivation i{font-style:normal;font-size:29px}.welcome-motivation b{font-size:11px;line-height:1.5;color:#31537d}
.student-stats-v148{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.student-stat-card{min-height:105px;position:relative;border-radius:19px;background:#fff;border:1px solid #e2eaf4;padding:17px;display:grid;grid-template-columns:50px 1fr;gap:13px;align-items:center;box-shadow:0 8px 24px rgba(38,73,116,.055)}.student-stat-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:21px;font-weight:900}.student-stat-card.green .student-stat-icon{background:#ddf7e9;color:#19a566}.student-stat-card.blue .student-stat-icon{background:#e3f1ff;color:#2a7be7}.student-stat-card.purple .student-stat-icon{background:#efe5ff;color:#8c52df}.student-stat-card.orange .student-stat-icon{background:#fff0cf;color:#eb8b17}.student-stat-card span{display:block;font-size:10.5px;color:#274b76;font-weight:800}.student-stat-card strong{display:block;font-size:24px;color:#173f78;line-height:1;margin-top:5px}.student-stat-card small{display:block;color:#8598b1;font-size:9px;margin-top:6px}.student-stat-card small b{color:#1fa96b}.stat-progress{position:absolute;left:79px;right:18px;bottom:10px;height:4px;background:#edf2f7;border-radius:999px}.stat-progress i{display:block;height:100%;border-radius:inherit;background:#22b66e}
.student-dashboard-grid-v148{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(330px,.8fr);gap:16px}.student-dashboard-left,.student-dashboard-right{display:grid;gap:16px;align-content:start}.student-panel-v148{background:#fff;border:1px solid #e0e9f4;border-radius:21px;box-shadow:0 8px 24px rgba(38,72,112,.055);overflow:hidden}.student-panel-head-v148{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19px 20px 12px}.student-panel-head-v148 h2{margin:0;color:#163f75;font-size:16px}.student-panel-head-v148>span,.student-panel-head-v148 a{font-size:9.5px;color:#7a90ac;text-decoration:none}.student-panel-head-v148 a{color:#2870df;font-weight:850}
.habit-list-v148{margin:0 18px;border:1px solid #e2eaf5;border-radius:14px;overflow:hidden}.habit-row-v148{min-height:47px;padding:8px 10px;display:grid;grid-template-columns:22px 25px 29px 1fr auto;gap:8px;align-items:center;border-bottom:1px solid #edf2f7}.habit-row-v148:last-child{border-bottom:0}.habit-check-v148{width:18px;height:18px;border:1.5px solid #9eb3cd;border-radius:5px;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:900}.habit-row-v148.is-done .habit-check-v148{background:#18ae68;border-color:#18ae68}.habit-no-v148{width:25px;height:25px;border-radius:8px;background:#f0f5fb;color:#476a95;display:grid;place-items:center;font-size:9px;font-weight:900}.habit-emoji-v148{font-size:17px}.habit-row-v148>b{color:#294e79;font-size:10.5px}.habit-status-v148{padding:6px 10px;border-radius:999px;font-size:8.5px;font-weight:850}.habit-status-v148.done{background:#def7e9;color:#178c56}.habit-status-v148.pending{background:#fff0f1;color:#d45462}.student-save-journal-v148{margin:15px 18px 17px;min-height:44px;border-radius:11px;background:linear-gradient(90deg,#2968ed,#2f86f5);display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;font-size:11px;font-weight:900;box-shadow:0 8px 18px rgba(46,111,232,.20)}
.activity-panel-v148{padding-bottom:5px}.activity-row-v148{min-height:61px;margin:0 18px;display:grid;grid-template-columns:37px 1fr auto;gap:10px;align-items:center;border-bottom:1px solid #edf2f7}.activity-row-v148:last-child{border-bottom:0}.activity-icon-v148{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-weight:900;font-size:15px}.activity-icon-v148.portfolio{background:#eee5ff;color:#8c51db}.activity-icon-v148.reflection{background:#e3f1ff;color:#2878e5}.activity-icon-v148.habit{background:#def8e9;color:#1da663}.activity-row-v148 b{display:block;color:#284a74;font-size:10px}.activity-row-v148 small{display:block;margin-top:4px;color:#8093ac;font-size:8.7px}.activity-row-v148 time{font-size:8px;color:#8ca0b8;white-space:nowrap}
.quick-panel-v148{padding-bottom:17px}.student-quick-grid-v148{padding:0 18px;display:grid;grid-template-columns:1fr 1fr;gap:9px}.student-quick-grid-v148 a{min-height:62px;border:1px solid #e5edf6;border-radius:13px;background:#fbfdff;text-decoration:none;padding:10px;display:flex;align-items:center;gap:10px}.student-quick-grid-v148 i{font-style:normal;width:34px;height:34px;border-radius:11px;background:#eaf2ff;color:#2d72e3;display:grid;place-items:center;font-size:16px;font-weight:900}.student-quick-grid-v148 b{display:block;color:#2a4c77;font-size:9.5px}.student-quick-grid-v148 small{display:block;color:#899bb1;font-size:8px;margin-top:3px}
.student-tip-v148{padding:17px 18px;border-radius:19px;background:linear-gradient(135deg,#fff8f7,#fff0f2);border:1px solid #f7dfe2;display:flex;gap:12px;align-items:flex-start}.tip-icon{width:40px;height:40px;border-radius:13px;background:#fff0c9;display:grid;place-items:center;font-size:20px;flex:0 0 auto}.student-tip-v148 b{color:#df4557;font-size:11px}.student-tip-v148 p{margin:5px 0 0;color:#4c6484;font-size:9.5px;line-height:1.55}
.student-motivation-v148{min-height:150px;border-radius:21px;background:linear-gradient(135deg,#e7f4ff,#d9ebff);border:1px solid #d6e8fb;display:grid;grid-template-columns:130px 1fr 70px;align-items:end;gap:12px;padding:18px 20px;overflow:hidden;position:relative}.motivation-character{font-size:88px;line-height:1;filter:drop-shadow(0 10px 13px rgba(45,84,130,.14))}.motivation-copy{align-self:center}.motivation-copy h3{margin:0;color:#163f77;font-size:17px}.motivation-copy p{margin:6px 0;color:#57769a;font-size:10px;line-height:1.5}.motivation-copy blockquote{margin:9px 0 0;padding:9px 12px;border:1px solid rgba(255,255,255,.9);border-radius:12px;background:rgba(255,255,255,.45);color:#2870d9;font-size:9.5px;font-style:italic;line-height:1.45}.paper-plane{align-self:center;font-size:45px;color:#44a7ef;transform:rotate(-20deg)}
.student-empty-v148{padding:28px;text-align:center;color:#8ba0b8;font-size:10px}
@media(max-width:1180px){.student-welcome-v148{grid-template-columns:1fr 280px}.welcome-side{display:none}.student-stats-v148{grid-template-columns:repeat(2,1fr)}}
@media(max-width:950px){.student-dashboard-grid-v148{grid-template-columns:1fr}.student-welcome-v148{grid-template-columns:1fr 230px}.welcome-art{height:150px}.student-portrait{transform:scale(.86)}}
@media(max-width:700px){.student-dashboard-v148{gap:12px}.student-welcome-v148{grid-template-columns:1fr;min-height:auto;padding:21px 18px;border-radius:20px}.welcome-art{display:none}.welcome-copy h1{font-size:25px}.welcome-copy p{font-size:11px}.student-stats-v148{grid-template-columns:1fr 1fr;gap:10px}.student-stat-card{min-height:98px;padding:14px;grid-template-columns:42px 1fr}.student-stat-icon{width:42px;height:42px}.student-stat-card strong{font-size:21px}.stat-progress{left:68px}.student-panel-v148{border-radius:17px}.habit-list-v148{margin:0 12px}.habit-row-v148{grid-template-columns:20px 23px 25px 1fr;gap:6px}.habit-status-v148{grid-column:4;justify-self:start;padding:4px 8px}.student-save-journal-v148{margin:13px 12px 14px}.student-motivation-v148{grid-template-columns:78px 1fr;padding:15px}.motivation-character{font-size:58px}.paper-plane{display:none}.student-quick-grid-v148{grid-template-columns:1fr 1fr;padding:0 12px}.activity-row-v148{margin:0 12px}.student-panel-head-v148{padding:16px 14px 10px}}
@media(max-width:430px){.student-stats-v148{grid-template-columns:1fr}.student-quick-grid-v148{grid-template-columns:1fr}.student-motivation-v148{grid-template-columns:1fr}.motivation-character{display:none}.activity-row-v148{grid-template-columns:34px 1fr}.activity-row-v148 time{grid-column:2}.habit-row-v148>b{font-size:9.5px}}


/* KAIH v1.1.49 - Student Dashboard Visual Match */
.student-dashboard-v148{gap:18px}
.student-welcome-v148{
  min-height:230px;
  grid-template-columns:minmax(0,1.05fr) 390px 215px;
  padding:26px 28px 24px;
  border-radius:22px;
  background:
    radial-gradient(circle at 62% 42%,rgba(255,255,255,.44) 0 21%,transparent 22%),
    linear-gradient(135deg,#e7f4ff 0%,#d6ebff 46%,#cce5ff 100%);
}
.welcome-copy{align-self:center}
.welcome-copy h1{font-size:34px}
.welcome-copy p{max-width:470px;font-size:12px}
.welcome-art{height:210px;align-self:end;overflow:visible}
.student-hero-character{
  position:absolute;
  width:245px;
  height:auto;
  left:50%;
  bottom:-26px;
  transform:translateX(-50%);
  filter:drop-shadow(0 18px 16px rgba(50,84,128,.16));
}
.speech-bubble{
  width:154px;
  right:-2px;
  top:14px;
  padding:15px 14px;
  font-size:10px;
  line-height:1.55;
  border-radius:20px;
}
.hero-star{position:absolute;color:#f2bb28;font-size:22px;line-height:1}
.hero-star-one{right:10px;bottom:52px}
.hero-star-two{left:32px;top:28px;color:#66a9ef}
.welcome-side{gap:10px}
.welcome-date-card,.welcome-motivation{min-height:80px;border-radius:17px}
.student-stats-v148{gap:16px}
.student-stat-card{min-height:114px;border-radius:18px;padding:18px;grid-template-columns:54px 1fr}
.student-stat-icon{width:52px;height:52px;border-radius:16px;font-size:22px}
.student-stat-card strong{font-size:26px}
.student-dashboard-grid-v148{gap:18px;grid-template-columns:minmax(0,1.38fr) minmax(340px,.82fr)}
.student-panel-v148{border-radius:20px}
.student-panel-head-v148{padding:20px 20px 14px}
.student-panel-head-v148 h2{font-size:17px}
.habit-list-v148{margin:0 20px;border-radius:13px}
.habit-row-v148{min-height:50px;padding:7px 10px;grid-template-columns:22px 27px 32px 1fr auto}
.habit-check-v148{width:19px;height:19px}
.habit-no-v148{width:26px;height:26px}
.habit-emoji-v148{font-size:18px}
.habit-row-v148>b{font-size:10.8px}
.habit-status-v148{min-width:104px;text-align:center;padding:6px 10px}
.student-save-journal-v148{margin:16px 20px 18px;min-height:48px;border-radius:12px}
.activity-row-v148{min-height:67px}
.activity-icon-v148{width:39px;height:39px;border-radius:12px}
.student-quick-grid-v148{gap:10px}
.student-quick-grid-v148 a{min-height:66px}
.student-tip-v148{min-height:82px}
.student-motivation-v148{
  min-height:170px;
  grid-template-columns:145px 1fr 76px;
  padding:18px 24px;
  background:linear-gradient(135deg,#e6f4ff 0%,#d8ebff 62%,#cfe7ff 100%);
}
.motivation-character{align-self:end;height:150px;display:flex;align-items:flex-end}
.motivation-character img{width:140px;height:auto;display:block;filter:drop-shadow(0 12px 14px rgba(46,86,132,.16))}
.motivation-copy h3{font-size:18px}
.motivation-copy p{font-size:10.5px}
.motivation-copy blockquote{font-size:9.8px;background:rgba(255,255,255,.65)}
.paper-plane{font-size:48px}
@media(max-width:1180px){
  .student-welcome-v148{grid-template-columns:1fr 320px}
  .student-hero-character{width:215px}
  .speech-bubble{right:-10px;width:142px}
}
@media(max-width:950px){
  .student-welcome-v148{grid-template-columns:1fr 250px}
  .student-hero-character{width:190px;bottom:-18px}
  .speech-bubble{display:none}
}
@media(max-width:700px){
  .student-welcome-v148{min-height:auto;grid-template-columns:1fr;padding:22px 18px}
  .welcome-art{display:none}
  .student-dashboard-grid-v148{grid-template-columns:1fr}
  .student-motivation-v148{grid-template-columns:95px 1fr;padding:16px}
  .motivation-character{height:108px}
  .motivation-character img{width:92px}
}


/* KAIH v1.1.50 - Hero matched to approved reference */
.student-welcome-v150{
  position:relative;
  min-height:286px;
  border-radius:26px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(390px,1.2fr) 360px 235px;
  align-items:center;
  gap:18px;
  padding:26px 28px 26px 34px;
  background:
    radial-gradient(circle at 56% 34%,rgba(255,255,255,.54) 0 18%,rgba(255,255,255,.18) 19% 35%,transparent 36%),
    linear-gradient(135deg,#e5f3ff 0%,#d8ecff 48%,#cbe5ff 100%);
  border:1px solid #d1e5f8;
  box-shadow:0 13px 32px rgba(44,83,133,.08);
}
.student-welcome-v150:before{
  content:"";
  position:absolute;
  width:520px;height:260px;
  left:24%;bottom:-160px;
  border-radius:50%;
  background:rgba(255,255,255,.22);
  transform:rotate(-15deg);
}
.student-welcome-v150:after{
  content:"";
  position:absolute;
  width:330px;height:210px;
  left:46%;top:-110px;
  border-radius:50%;
  background:rgba(255,255,255,.25);
}
.welcome-left-v150{position:relative;z-index:3;align-self:center;max-width:570px}
.welcome-kicker-v150{display:block;color:#183f71;font-size:17px;font-weight:850;margin-bottom:6px}
.welcome-left-v150 h1{margin:0;color:#10396e;font-size:39px;line-height:1.04;letter-spacing:-.04em;font-weight:900}
.wave-v150{font-size:31px;display:inline-block;transform:translateY(-1px)}
.welcome-left-v150 p{margin:15px 0 0;color:#345e8e;font-size:13px;line-height:1.7}
.welcome-dot-v150{color:#2f74e8;font-size:18px;font-weight:900;margin-right:4px}
.welcome-character-v150{position:relative;z-index:2;height:260px;align-self:end;display:flex;justify-content:center;overflow:visible}
.welcome-character-v150 img{position:absolute;width:265px;height:auto;bottom:-28px;left:50%;transform:translateX(-50%);filter:drop-shadow(0 18px 18px rgba(40,72,111,.15))}
.welcome-bubble-v150{
  position:absolute;
  z-index:4;
  right:236px;
  top:42px;
  width:178px;
  padding:18px 18px;
  border-radius:24px;
  background:#fff;
  color:#143c6d;
  font-size:11px;
  line-height:1.55;
  font-weight:850;
  box-shadow:0 10px 22px rgba(51,84,126,.10);
}
.welcome-bubble-v150:after{
  content:"";position:absolute;left:30px;bottom:-14px;
  border:14px solid transparent;border-top-color:#fff;border-bottom:0;
}
.spark-v150{position:absolute;z-index:3;color:#f5b91e;line-height:1;font-size:25px}
.spark-v150.s1{right:30px;bottom:66px}
.spark-v150.s2{left:30px;top:83px}
.spark-v150.s3{left:56px;top:54px;color:#4f9bef;font-size:17px}
.welcome-side-v150{position:relative;z-index:4;display:grid;gap:14px}
.side-card-v150{
  min-height:86px;
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 17px;
  border-radius:20px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(255,255,255,.98);
  box-shadow:0 8px 21px rgba(47,79,119,.06);
}
.side-icon-v150{
  width:42px;height:42px;flex:0 0 42px;
  border-radius:13px;
  display:grid;place-items:center;
  background:#eef5ff;
  font-size:23px;
}
.side-card-v150 b{display:block;color:#173d6e;font-size:13px;line-height:1.4}
.side-card-v150 small{display:block;margin-top:4px;color:#7b91aa;font-size:10px;font-weight:650}
.side-card-v150.motivation .side-icon-v150{background:#eff9ee;font-size:27px}

/* prevent obsolete v148 hero from affecting new hero */
.student-welcome-v150 .welcome-copy,
.student-welcome-v150 .welcome-art,
.student-welcome-v150 .welcome-side{all:unset}

@media(max-width:1220px){
  .student-welcome-v150{grid-template-columns:minmax(330px,1fr) 300px 215px;min-height:270px}
  .welcome-left-v150 h1{font-size:34px}
  .welcome-character-v150 img{width:235px}
  .welcome-bubble-v150{right:216px;width:160px}
}
@media(max-width:1030px){
  .student-welcome-v150{grid-template-columns:1fr 280px;min-height:250px}
  .welcome-side-v150{display:none}
  .welcome-bubble-v150{right:28px;top:34px}
}
@media(max-width:760px){
  .student-welcome-v150{display:block;min-height:auto;padding:23px 20px;border-radius:21px}
  .welcome-left-v150{max-width:none}
  .welcome-left-v150 h1{font-size:29px}
  .welcome-left-v150 p{font-size:11.5px;line-height:1.6}
  .welcome-character-v150{height:170px;margin-top:10px}
  .welcome-character-v150 img{width:185px;bottom:-22px}
  .welcome-bubble-v150{display:none}
  .spark-v150.s1{right:18%;bottom:40px}.spark-v150.s2{left:18%;top:38px}
}
@media(max-width:450px){
  .student-welcome-v150{padding:21px 17px 0}
  .welcome-kicker-v150{font-size:14px}
  .welcome-left-v150 h1{font-size:26px}
  .welcome-left-v150 p br{display:none}
}


/* KAIH v1.1.51 - Hero + stats polish */
.student-welcome-v150{
  min-height:270px;
  grid-template-columns:minmax(420px,1.15fr) 330px 230px;
  gap:10px;
  padding:24px 30px 22px 36px;
  border-radius:24px;
  background:
    radial-gradient(circle at 57% 38%,rgba(255,255,255,.58) 0 18%,rgba(255,255,255,.22) 19% 31%,transparent 32%),
    linear-gradient(135deg,#e8f4ff 0%,#d9edff 46%,#cde7ff 100%);
}
.welcome-left-v150{max-width:590px}
.welcome-kicker-v150{font-size:16px;margin-bottom:5px}
.welcome-left-v150 h1{font-size:38px}
.welcome-left-v150 p{margin-top:13px;font-size:12.5px;line-height:1.65}
.welcome-character-v150{height:250px}
.hero-boy-inline-v151{
  position:absolute;
  width:250px;
  height:auto;
  left:50%;
  bottom:-26px;
  transform:translateX(-50%);
}
.welcome-bubble-v150{
  top:38px;
  right:228px;
  width:176px;
  padding:16px 17px;
  font-size:10.8px;
  border-radius:22px;
}
.side-card-v150{min-height:82px;border-radius:18px}
.side-card-v150 b{font-size:12.5px}
.side-card-v150 small{font-size:9.5px}

/* Stats */
.student-stats-v151{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.stat151{
  min-height:112px;
  position:relative;
  display:grid;
  grid-template-columns:58px 1fr;
  align-items:center;
  gap:14px;
  padding:17px 18px;
  border-radius:18px;
  background:#fff;
  border:1px solid #e0e9f4;
  box-shadow:0 8px 22px rgba(38,72,112,.055);
  overflow:hidden;
}
.stat151:after{
  content:"";
  position:absolute;
  width:86px;height:86px;border-radius:50%;
  right:-34px;top:-38px;
  opacity:.45;
}
.stat151.green:after{background:#e4f8ee}
.stat151.blue:after{background:#e4f0ff}
.stat151.purple:after{background:#f0e7ff}
.stat151.orange:after{background:#fff1d8}
.stat151-icon{
  width:54px;height:54px;border-radius:16px;
  display:grid;place-items:center;
  font-size:24px;font-weight:900;
  position:relative;z-index:1;
}
.stat151.green .stat151-icon{background:#ddf7e9;color:#18a764}
.stat151.blue .stat151-icon{background:#e1efff;color:#2e79e5}
.stat151.purple .stat151-icon{background:#efe4ff;color:#8c55df}
.stat151.orange .stat151-icon{background:#fff0cf;color:#ed9019}
.stat151-main{min-width:0;position:relative;z-index:1}
.stat151-main>span{display:block;color:#284d78;font-size:10.5px;font-weight:850;margin-bottom:4px}
.stat151-number{color:#153e76;font-size:27px;font-weight:900;line-height:1}
.stat151-number small{font-size:16px;color:#54759b;font-weight:800}
.stat151-meta{
  margin-top:7px;
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:8.7px;color:#8599b3;white-space:nowrap;
}
.stat151-meta b{font-size:8.5px}
.stat151.green .stat151-meta b{color:#19a668}
.stat151.blue .stat151-meta b{color:#2d73d7}
.stat151.purple .stat151-meta b{color:#8454ce}
.stat151.orange .stat151-meta b{color:#df8414}
.stat151-bar{
  height:4px;border-radius:999px;background:#edf2f7;margin-top:7px;overflow:hidden;
}
.stat151-bar i{display:block;height:100%;border-radius:inherit;background:#22b36c}

/* Main content proportions */
.student-dashboard-grid-v148{
  grid-template-columns:minmax(0,1.42fr) minmax(345px,.82fr);
}
.habit-panel-v148,.activity-panel-v148,.quick-panel-v148{
  box-shadow:0 9px 24px rgba(36,70,112,.05);
}
.habit-row-v148{min-height:48px}
.student-panel-head-v148 h2{font-size:16px}

@media(max-width:1220px){
  .student-welcome-v150{grid-template-columns:minmax(340px,1fr) 290px 210px}
  .hero-boy-inline-v151{width:222px}
  .student-stats-v151{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:1030px){
  .student-welcome-v150{grid-template-columns:1fr 260px}
  .welcome-side-v150{display:none}
  .welcome-bubble-v150{right:24px}
}
@media(max-width:760px){
  .student-welcome-v150{display:block;padding:21px 18px 0;min-height:auto}
  .welcome-left-v150 h1{font-size:28px}
  .welcome-left-v150 p{font-size:11px}
  .welcome-character-v150{height:170px}
  .hero-boy-inline-v151{width:176px;bottom:-18px}
  .welcome-bubble-v150{display:none}
  .student-stats-v151{grid-template-columns:1fr 1fr;gap:10px}
  .stat151{min-height:104px;padding:14px;grid-template-columns:48px 1fr}
  .stat151-icon{width:46px;height:46px;border-radius:14px;font-size:21px}
  .stat151-number{font-size:23px}
  .stat151-meta{font-size:8px}
}
@media(max-width:440px){
  .student-stats-v151{grid-template-columns:1fr}
  .stat151{min-height:92px}
}


/* KAIH v1.1.52 - Premium icon system + dashboard lower panels */
.stat151-icon.premium,
.activity-icon-v148.premium,
.student-quick-grid-v148.premium i{
  position:relative;
  overflow:hidden;
}
.stat151-icon.premium:after,
.activity-icon-v148.premium:after,
.student-quick-grid-v148.premium i:after{
  content:"";
  position:absolute;
  width:70%;height:45%;
  left:12%;top:6%;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,0));
  pointer-events:none;
}
.stat151-icon.premium svg,
.activity-icon-v148.premium svg,
.student-quick-grid-v148.premium i svg{
  width:24px;height:24px;
  fill:none;stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
  position:relative;z-index:1;
}
.stat151.green .stat151-icon.premium{background:linear-gradient(145deg,#d9f8e8,#bff0d5);color:#10ad66;box-shadow:0 8px 18px rgba(19,172,103,.17)}
.stat151.blue .stat151-icon.premium{background:linear-gradient(145deg,#e6f3ff,#cce7ff);color:#2d7df0;box-shadow:0 8px 18px rgba(45,125,240,.15)}
.stat151.purple .stat151-icon.premium{background:linear-gradient(145deg,#f1e8ff,#ddcaff);color:#8c4cf0;box-shadow:0 8px 18px rgba(140,76,240,.15)}
.stat151.orange .stat151-icon.premium{background:linear-gradient(145deg,#fff1d2,#ffdda0);color:#f08b17;box-shadow:0 8px 18px rgba(240,139,23,.16)}
.stat151.orange .stat151-icon.premium svg{fill:currentColor;stroke:none}

/* Activity list */
.activity-panel-v148 .student-panel-head-v148{padding-bottom:8px}
.activity-row-v148{min-height:72px}
.activity-icon-v148.premium{width:42px;height:42px;border-radius:13px}
.activity-icon-v148.premium svg{width:21px;height:21px}
.activity-icon-v148.premium.reflection{background:linear-gradient(145deg,#e6f4ff,#cbe8ff);color:#2f80ee;box-shadow:0 7px 15px rgba(47,128,238,.13)}
.activity-icon-v148.premium.habit{background:linear-gradient(145deg,#e2faed,#c7f2da);color:#15a962;box-shadow:0 7px 15px rgba(21,169,98,.13)}
.activity-icon-v148.premium.portfolio{background:linear-gradient(145deg,#f1e8ff,#decaff);color:#8950e8;box-shadow:0 7px 15px rgba(137,80,232,.13)}
.activity-row-v148 b{font-size:10.6px}
.activity-row-v148 small{font-size:8.8px}

/* Premium quick access tiles */
.student-quick-grid-v148.premium{grid-template-columns:1fr 1fr;gap:11px}
.student-quick-grid-v148.premium a{
  min-height:96px;
  position:relative;
  overflow:hidden;
  padding:14px 14px;
  border-radius:16px;
  display:grid;
  grid-template-columns:46px 1fr 30px;
  align-items:center;
  gap:10px;
  border:1px solid #dde9f5;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.student-quick-grid-v148.premium a:before{
  content:"";position:absolute;width:105px;height:105px;border-radius:50%;
  right:-45px;bottom:-50px;opacity:.58;
}
.student-quick-grid-v148.premium .quick-reflection{background:linear-gradient(135deg,#fbfdff,#eef7ff)}
.student-quick-grid-v148.premium .quick-reflection:before{background:#d8ebff}
.student-quick-grid-v148.premium .quick-portfolio{background:linear-gradient(135deg,#fdfbff,#f2ecff)}
.student-quick-grid-v148.premium .quick-portfolio:before{background:#e1d2ff}
.student-quick-grid-v148.premium .quick-progress{background:linear-gradient(135deg,#fbfffd,#ecfaf3)}
.student-quick-grid-v148.premium .quick-progress:before{background:#cef2df}
.student-quick-grid-v148.premium .quick-education{background:linear-gradient(135deg,#fffdf9,#fff5e8)}
.student-quick-grid-v148.premium .quick-education:before{background:#ffe7bc}
.student-quick-grid-v148.premium a:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(45,79,123,.09);border-color:#bfd4ef}
.student-quick-grid-v148.premium i{width:46px;height:46px;border-radius:14px;z-index:1}
.student-quick-grid-v148.premium i svg{width:23px;height:23px}
.student-quick-grid-v148.premium .quick-reflection i{background:linear-gradient(145deg,#e4f2ff,#c9e5ff);color:#2f7df0;box-shadow:0 7px 15px rgba(47,125,240,.13)}
.student-quick-grid-v148.premium .quick-portfolio i{background:linear-gradient(145deg,#f0e6ff,#dcc7ff);color:#8a4eec;box-shadow:0 7px 15px rgba(138,78,236,.13)}
.student-quick-grid-v148.premium .quick-progress i{background:linear-gradient(145deg,#dcf8e9,#bfeecf);color:#13a95f;box-shadow:0 7px 15px rgba(19,169,95,.13)}
.student-quick-grid-v148.premium .quick-education i{background:linear-gradient(145deg,#fff0cf,#ffd88e);color:#ed8a0e;box-shadow:0 7px 15px rgba(237,138,14,.14)}
.student-quick-grid-v148.premium span{z-index:1;min-width:0}
.student-quick-grid-v148.premium b{font-size:10.5px}
.student-quick-grid-v148.premium small{font-size:8.5px;margin-top:4px}
.student-quick-grid-v148.premium em{
  width:29px;height:29px;border-radius:50%;background:#fff;color:#315a8c;
  display:grid;place-items:center;font-style:normal;font-size:15px;font-weight:900;z-index:2;
  box-shadow:0 4px 11px rgba(35,69,111,.08)
}

/* Motivation banner */
.student-motivation-v152{
  min-height:192px;
  position:relative;
  overflow:hidden;
  border-radius:22px;
  display:grid;
  grid-template-columns:170px minmax(0,1fr) 135px;
  align-items:center;
  gap:18px;
  padding:18px 25px 0 18px;
  background:
    radial-gradient(circle at 68% 35%,rgba(255,255,255,.34) 0 16%,transparent 17%),
    linear-gradient(135deg,#e7f4ff 0%,#d8ecff 58%,#cfe7ff 100%);
  border:1px solid #d5e8fa;
  box-shadow:0 9px 24px rgba(40,74,116,.05);
}
.student-motivation-v152:after{
  content:"";position:absolute;width:330px;height:150px;right:-75px;bottom:-90px;
  border-radius:50%;background:rgba(255,255,255,.25);transform:rotate(-12deg);
}
.motivation-character-v152{height:178px;align-self:end;position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:center}
.motivation-boy-v152{width:165px;height:auto;display:block;filter:drop-shadow(0 12px 16px rgba(42,79,124,.16))}
.motivation-copy-v152{position:relative;z-index:2;align-self:center}
.motivation-copy-v152 h3{margin:0;color:#143f79;font-size:21px;letter-spacing:-.02em}
.motivation-copy-v152 p{margin:7px 0 0;color:#55749a;font-size:10.8px;line-height:1.55}
.motivation-copy-v152 blockquote{
  margin:11px 0 0;padding:11px 14px;border-radius:14px;
  border:1px solid rgba(255,255,255,.95);background:rgba(255,255,255,.55);
  color:#2770dc;font-size:10px;font-style:italic;line-height:1.5
}
.motivation-plane-v152{position:relative;z-index:2;align-self:center}
.motivation-plane-v152 svg{width:118px;height:auto;overflow:visible}
.motivation-plane-v152 .route{fill:none;stroke:#33a4ee;stroke-width:3;stroke-linecap:round;stroke-dasharray:6 8}
.motivation-plane-v152 .plane{fill:#2699ec}
.motivation-plane-v152 .plane-fold{fill:none;stroke:#1477ca;stroke-width:2;stroke-linejoin:round}

@media(max-width:900px){
  .student-quick-grid-v148.premium a{min-height:88px}
  .student-motivation-v152{grid-template-columns:125px 1fr 90px;min-height:170px}
  .motivation-character-v152{height:150px}.motivation-boy-v152{width:135px}
  .motivation-plane-v152 svg{width:82px}
}
@media(max-width:700px){
  .student-quick-grid-v148.premium{grid-template-columns:1fr 1fr}
  .student-quick-grid-v148.premium a{grid-template-columns:42px 1fr 28px;padding:12px}
  .student-quick-grid-v148.premium i{width:42px;height:42px}
  .student-motivation-v152{grid-template-columns:105px 1fr;padding:14px 14px 0}
  .motivation-character-v152{height:135px}.motivation-boy-v152{width:118px}
  .motivation-plane-v152{display:none}
  .motivation-copy-v152 h3{font-size:17px}
}
@media(max-width:440px){
  .student-quick-grid-v148.premium{grid-template-columns:1fr}
  .student-motivation-v152{grid-template-columns:1fr;padding:17px}
  .motivation-character-v152{display:none}
}


/* KAIH v1.1.53 - Student premium icon system matching Super Admin quality */
.student-role .sidebar{
  background:#fff;
  border-right:1px solid #e5edf7;
}
.student-role .brand-premium{
  padding:22px 17px 18px;
}
.student-role .brand-emblem{
  width:48px;height:48px;border-radius:14px;
  background:linear-gradient(145deg,#edf6ff,#e3efff);
  box-shadow:0 8px 18px rgba(44,94,167,.10);
}
.student-role .sidebar nav{padding:4px 10px 12px}
.student-role .nav-item{
  min-height:48px;
  border-radius:13px;
  padding:8px 11px;
  gap:11px;
  color:#173f73;
  font-size:11px;
  font-weight:800;
}
.student-role .nav-item .nav-icon.premium{
  width:36px;height:36px;flex:0 0 36px;border-radius:11px;
  display:grid;place-items:center;
  background:#f5f9ff;
  border:1px solid #e5eef9;
  box-shadow:0 5px 13px rgba(38,78,131,.06);
  color:#3977e6;
  position:relative;
  overflow:hidden;
}
.student-role .nav-item .nav-icon.premium:after{
  content:"";position:absolute;left:6px;top:4px;width:24px;height:13px;border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,0));
}
.student-role .nav-item .nav-icon.premium svg{
  width:20px;height:20px;position:relative;z-index:1;
  fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;
}
.student-role .nav-item:nth-child(2) .nav-icon{color:#15a965;background:linear-gradient(145deg,#effcf5,#def7e9)}
.student-role .nav-item:nth-child(3) .nav-icon{color:#347af0;background:linear-gradient(145deg,#eff6ff,#dfeeff)}
.student-role .nav-item:nth-child(4) .nav-icon{color:#347af0;background:linear-gradient(145deg,#eff6ff,#dfeeff)}
.student-role .nav-item:nth-child(5) .nav-icon{color:#ef8c18;background:linear-gradient(145deg,#fff8eb,#ffedcf)}
.student-role .nav-item:nth-child(6) .nav-icon{color:#3977e6;background:linear-gradient(145deg,#f0f6ff,#e2edff)}
.student-role .nav-item:nth-child(7) .nav-icon{color:#3977e6;background:linear-gradient(145deg,#f0f6ff,#e3efff)}
.student-role .nav-item.active{
  background:linear-gradient(90deg,#edf5ff,#eaf2ff);
  color:#1462d5;
  box-shadow:inset 3px 0 0 #2e71ef;
}
.student-role .nav-item.active .nav-icon{
  background:linear-gradient(145deg,#dceaff,#c9ddff);
  border-color:#c5d9f8;
  box-shadow:0 7px 16px rgba(46,113,239,.15);
}

/* Premium student topbar */
.student-topbar-v153{
  min-height:68px;
  padding:0 22px;
  display:flex;
  align-items:center;
  gap:14px;
  background:#fff;
  border-bottom:1px solid #e5edf6;
}
.student-hamb-v153{
  width:42px;height:42px;border-radius:12px;border:1px solid #dce8f6;background:#f8fbff;
  display:none;place-items:center;padding:0 11px;gap:4px;
}
.student-hamb-v153 span{display:block;height:2px;background:#2b6fe5;border-radius:999px}
.student-top-search-v153{
  height:42px;
  width:min(520px,48vw);
  border-radius:12px;
  background:linear-gradient(180deg,#f8fbff,#f2f7fd);
  border:1px solid #e0e9f4;
  display:flex;align-items:center;gap:9px;padding:0 13px;
}
.student-top-search-v153 svg{width:18px;height:18px;fill:none;stroke:#6c86a6;stroke-width:1.9}
.student-top-search-v153 input{border:0;outline:0;background:transparent;width:100%;font-size:10.5px;color:#294f7c}
.student-top-actions-v153{margin-left:auto;display:flex;align-items:center;gap:12px}
.student-bell-v153{
  width:40px;height:40px;border-radius:12px;border:1px solid #dce8f6;background:#f8fbff;
  display:grid;place-items:center;position:relative;color:#2c70e6;
}
.student-bell-v153 svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.student-bell-v153 i{position:absolute;right:7px;top:6px;width:6px;height:6px;border-radius:50%;background:#ff485a;box-shadow:0 0 0 2px #fff}
.student-top-user-v153{display:flex;align-items:center;gap:9px}
.student-top-avatar-v153{
  width:38px;height:38px;border-radius:12px;
  background:linear-gradient(145deg,#f0f4ff,#e7e9ff);color:#2d64d7;
  display:grid;place-items:center;font-size:13px;font-weight:900;
  border:1px solid #dbe4f7;
}
.student-top-user-v153 b{display:block;color:#173d70;font-size:10px}
.student-top-user-v153 span{display:block;color:#8699b0;font-size:8.5px;margin-top:2px}
.student-version-v153{padding:8px 10px;border-radius:10px;background:#f4f7fb;color:#8193aa;font-size:9px}

/* Habit icons */
.premium-habit-icon{
  width:30px;height:30px;border-radius:10px;display:grid;place-items:center;
  background:linear-gradient(145deg,#eff6ff,#e1eeff);
  color:#2d75e7;border:1px solid #dce8f6;box-shadow:0 5px 12px rgba(45,117,231,.08)
}
.premium-habit-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.habit-row-v148:nth-child(1) .premium-habit-icon{color:#f2a10c;background:linear-gradient(145deg,#fff8e5,#ffedbb)}
.habit-row-v148:nth-child(2) .premium-habit-icon{color:#8959cf;background:linear-gradient(145deg,#f7efff,#e9dcff)}
.habit-row-v148:nth-child(3) .premium-habit-icon{color:#2778ea;background:linear-gradient(145deg,#eff6ff,#dfeeff)}
.habit-row-v148:nth-child(4) .premium-habit-icon{color:#e94f5b;background:linear-gradient(145deg,#fff1f3,#ffdce1)}
.habit-row-v148:nth-child(5) .premium-habit-icon{color:#2f75e4;background:linear-gradient(145deg,#edf5ff,#dcecff)}
.habit-row-v148:nth-child(6) .premium-habit-icon{color:#265fd0;background:linear-gradient(145deg,#edf3ff,#dde8ff)}
.habit-row-v148:nth-child(7) .premium-habit-icon{color:#2f6bd6;background:linear-gradient(145deg,#edf5ff,#dfeeff)}

/* Premium blue journal CTA */
.premium-journal-cta{gap:11px}
.premium-journal-cta svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.premium-journal-cta span{flex:0 1 auto}
.premium-journal-cta b{margin-left:auto;font-size:17px}

/* Tip icon */
.premium-tip-icon{
  background:linear-gradient(145deg,#fff3ce,#ffdf8e)!important;
  color:#ee9b15;
  box-shadow:0 7px 15px rgba(238,155,21,.14)
}
.premium-tip-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Extra polish to match premium mockup */
.student-dashboard-v148{gap:16px}
.student-panel-v148{border-color:#dfe8f3}
.student-panel-head-v148 h2{font-size:16.5px}
.activity-panel-v148,.quick-panel-v148{border-radius:20px}
.student-quick-grid-v148.premium a{box-shadow:0 7px 18px rgba(40,75,119,.045)}
.student-tip-v148{border-radius:18px}
.student-motivation-v152{border-radius:20px}
.stat151{border-radius:17px}

/* Mobile */
@media(max-width:980px){
  .student-hamb-v153{display:flex;flex-direction:column}
  .student-top-search-v153{width:min(460px,55vw)}
}
@media(max-width:700px){
  .student-topbar-v153{min-height:62px;padding:0 12px}
  .student-top-search-v153{display:none}
  .student-top-actions-v153{gap:8px}
  .student-top-user-v153 div:last-child{display:none}
  .student-version-v153{display:none}
  .student-mobile-nav .mn-icon.premium{
    width:30px;height:30px;border-radius:10px;background:#f2f7ff;display:grid;place-items:center;color:#3575e6
  }
  .student-mobile-nav .mn-icon.premium svg{
    width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round
  }
}


/* KAIH v1.1.54 - Student Dashboard closer to approved mockup */
.student-hero-v154{
  position:relative;
  min-height:286px;
  border-radius:24px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(390px,1.05fr) 360px 220px;
  align-items:center;
  gap:16px;
  padding:24px 28px 20px 34px;
  background:
    radial-gradient(circle at 56% 42%,rgba(255,255,255,.62) 0 18%,rgba(255,255,255,.20) 19% 34%,transparent 35%),
    linear-gradient(135deg,#e6f3ff 0%,#d8ecff 46%,#cce6ff 100%);
  border:1px solid #d1e5f8;
  box-shadow:0 12px 30px rgba(45,84,134,.07);
}
.student-hero-v154:before{
  content:"";position:absolute;width:520px;height:210px;border-radius:50%;
  left:-70px;bottom:-115px;background:rgba(255,255,255,.22);transform:rotate(-12deg);
}
.student-hero-v154:after{
  content:"";position:absolute;width:300px;height:160px;border-radius:50%;
  right:18%;bottom:-95px;background:rgba(255,255,255,.18);
}
.student-hero-copy-v154{position:relative;z-index:3;max-width:560px}
.student-hero-copy-v154>span{display:block;color:#153e72;font-size:17px;font-weight:850;margin-bottom:5px}
.student-hero-copy-v154 h1{margin:0;color:#123a70;font-size:38px;line-height:1.04;letter-spacing:-.04em;font-weight:900}
.student-hero-copy-v154 h1 em{font-style:normal;font-size:29px}
.student-hero-copy-v154 p{margin:14px 0 0;color:#355f8e;font-size:12.5px;line-height:1.65}
.student-hero-copy-v154 p b{color:#2f75ed;font-size:17px;margin-right:4px}

.student-hero-visual-v154{height:254px;position:relative;z-index:2;align-self:end}
.student-hero-person-v154{position:absolute;left:50%;bottom:-22px;transform:translateX(-50%);width:240px;height:250px}
.person-face{position:absolute;left:74px;top:42px;width:100px;height:108px;border-radius:48% 48% 46% 46%;background:linear-gradient(180deg,#ffd8ba,#efa77f);box-shadow:0 8px 18px rgba(92,65,53,.12)}
.person-hair{position:absolute;left:62px;top:22px;width:125px;height:76px;border-radius:60% 50% 42% 56%;background:linear-gradient(145deg,#4a3226,#18110d);transform:rotate(-5deg);z-index:2}
.person-hair:before,.person-hair:after{content:"";position:absolute;background:#2a1d17;border-radius:60%}
.person-hair:before{width:70px;height:35px;left:-9px;top:26px;transform:rotate(-20deg)}
.person-hair:after{width:72px;height:34px;right:-7px;top:20px;transform:rotate(24deg)}
.person-face{z-index:3}.person-face .eye{position:absolute;top:43px;width:11px;height:14px;border-radius:50%;background:#2a211d}.person-face .eye:after{content:"";position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;left:2px;top:2px}.person-face .eye.left{left:24px}.person-face .eye.right{right:24px}
.person-face .smile{position:absolute;left:35px;bottom:22px;width:30px;height:14px;border-bottom:4px solid #aa4246;border-radius:0 0 20px 20px}
.person-neck{position:absolute;left:101px;top:135px;width:40px;height:36px;border-radius:14px;background:#efaa82;z-index:1}
.person-body{position:absolute;left:48px;top:152px;width:150px;height:105px;z-index:1}
.person-body .vest{position:absolute;inset:0;border-radius:42px 42px 10px 10px;background:linear-gradient(145deg,#3c5068,#172638)}
.person-body .shirt{position:absolute;left:38px;top:-1px;width:76px;height:65px;background:#fff;clip-path:polygon(0 0,100% 0,76% 100%,24% 100%);z-index:2}
.person-body .tie{position:absolute;left:68px;top:17px;width:18px;height:58px;background:#2f73db;clip-path:polygon(50% 0,100% 18%,72% 100%,28% 100%,0 18%);z-index:3}
.person-arm.thumb{position:absolute;left:12px;top:145px;width:80px;height:36px;border-radius:25px;background:linear-gradient(180deg,#ffd8ba,#efa77f);transform:rotate(-30deg);z-index:4}
.thumb-hand{position:absolute;left:-12px;top:-30px;font-size:48px;transform:rotate(20deg)}
.person-books{position:absolute;right:2px;bottom:4px;width:70px;height:78px;z-index:4}
.person-books i,.person-books b{position:absolute;border-radius:6px;display:block}.person-books i{width:56px;height:68px;right:6px;bottom:0;background:#315d9e;transform:rotate(-8deg)}.person-books b{width:51px;height:60px;left:0;bottom:1px;background:#d74d61;transform:rotate(7deg)}
.person-bag{position:absolute;right:19px;top:164px;width:60px;height:82px;border-radius:18px;background:#26394d;z-index:0}
.hero-spark{position:absolute;z-index:6;color:#f4b51a;font-size:25px}.hero-spark.hs1{right:20px;bottom:52px}.hero-spark.hs2{left:10px;top:94px}.hero-spark.hs3{left:38px;top:58px;color:#5aa2f0;font-size:17px}

.student-hero-quote-v154{
  position:absolute;z-index:5;right:234px;top:44px;width:180px;padding:17px 18px;border-radius:22px;
  background:#fff;color:#153e72;font-size:10.8px;line-height:1.55;font-weight:850;
  box-shadow:0 9px 22px rgba(50,83,126,.09)
}
.student-hero-quote-v154:after{content:"";position:absolute;left:30px;bottom:-13px;border:13px solid transparent;border-top-color:#fff;border-bottom:0}

.student-hero-side-v154{position:relative;z-index:4;display:grid;gap:13px}
.hero-side-card-v154{
  min-height:84px;border-radius:18px;background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.98);
  box-shadow:0 8px 20px rgba(49,82,122,.06);display:flex;align-items:center;gap:13px;padding:14px 16px
}
.hero-side-icon-v154{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;flex:0 0 44px;position:relative;overflow:hidden}
.hero-side-icon-v154:after{content:"";position:absolute;width:28px;height:14px;border-radius:50%;top:4px;left:7px;background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0))}
.hero-side-icon-v154 svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;position:relative;z-index:1}
.hero-side-icon-v154.calendar{color:#2e7ae8;background:linear-gradient(145deg,#e9f4ff,#cee7ff);box-shadow:0 7px 14px rgba(46,122,232,.12)}
.hero-side-icon-v154.sprout{color:#27a65c;background:linear-gradient(145deg,#eff9e9,#dff1d5);box-shadow:0 7px 14px rgba(39,166,92,.12)}
.hero-side-card-v154 b{display:block;color:#173d70;font-size:12.5px;line-height:1.45}
.hero-side-card-v154 small{display:block;margin-top:4px;color:#7c91aa;font-size:9.5px;font-weight:650}

/* closer stat card proportions */
.student-stats-v151{gap:13px}
.stat151{min-height:106px;padding:15px 16px;border-radius:17px}
.stat151-icon{width:52px;height:52px}
.stat151-number{font-size:26px}
.stat151-meta{margin-top:6px}
.stat151-meta b{white-space:nowrap}

/* improve overall density */
.student-dashboard-grid-v148{gap:15px}
.habit-list-v148{margin:0 16px}
.student-panel-head-v148{padding:17px 17px 11px}
.activity-row-v148{margin:0 16px}
.student-quick-grid-v148.premium{padding:0 14px 14px}
.student-tip-v148{padding:15px 16px}
.student-motivation-v152{min-height:176px}

@media(max-width:1180px){
  .student-hero-v154{grid-template-columns:minmax(340px,1fr) 300px 210px;min-height:270px}
  .student-hero-person-v154{transform:translateX(-50%) scale(.9);transform-origin:bottom center}
  .student-hero-quote-v154{right:210px;width:160px}
}
@media(max-width:980px){
  .student-hero-v154{grid-template-columns:1fr 260px}
  .student-hero-side-v154{display:none}
  .student-hero-quote-v154{right:26px}
}
@media(max-width:700px){
  .student-hero-v154{display:block;min-height:auto;padding:21px 18px 0}
  .student-hero-copy-v154 h1{font-size:28px}
  .student-hero-copy-v154 p{font-size:11px}
  .student-hero-visual-v154{height:170px;margin-top:8px}
  .student-hero-person-v154{transform:translateX(-50%) scale(.64);transform-origin:bottom center}
  .student-hero-quote-v154{display:none}
}


/* KAIH v1.1.55 - Premium Student Hero Reference Asset */
.student-hero-v155{
  position:relative;
  min-height:300px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(430px,1.05fr) 370px 230px;
  gap:14px;
  align-items:center;
  padding:26px 30px 22px 34px;
  border:1px solid #d4e7f9;
  border-radius:24px;
  background:
    radial-gradient(circle at 57% 36%,rgba(255,255,255,.58) 0 18%,rgba(255,255,255,.17) 19% 35%,transparent 36%),
    linear-gradient(135deg,#e8f5ff 0%,#d8ecff 48%,#cce6ff 100%);
  box-shadow:0 12px 30px rgba(43,80,127,.07);
}
.student-hero-v155:before{
  content:"";position:absolute;width:540px;height:230px;left:-90px;bottom:-145px;
  border-radius:50%;background:rgba(255,255,255,.22);transform:rotate(-13deg);
}
.student-hero-v155:after{
  content:"";position:absolute;width:360px;height:180px;right:14%;bottom:-110px;
  border-radius:50%;background:rgba(255,255,255,.17);
}
.student-hero-copy-v155{position:relative;z-index:4;max-width:610px}
.student-hero-copy-v155>span{display:block;color:#173f73;font-size:17px;font-weight:850;margin-bottom:5px}
.student-hero-copy-v155 h1{margin:0;color:#103b73;font-size:40px;line-height:1.03;letter-spacing:-.04em;font-weight:900}
.student-hero-copy-v155 h1 em{font-style:normal;font-size:30px}
.student-hero-copy-v155 p{margin:14px 0 0;color:#345e8c;font-size:12.5px;line-height:1.65}
.student-hero-copy-v155 p b{color:#2f73e9;font-size:17px;margin-right:4px}
.student-hero-copy-v155 blockquote{
  display:inline-block;margin:14px 0 0;padding:11px 15px;border:1px solid rgba(255,255,255,.95);
  border-radius:14px;background:rgba(255,255,255,.48);color:#2770dc;font-size:10px;font-style:italic;line-height:1.5
}
.student-hero-character-v155{height:278px;position:relative;z-index:3;align-self:end}
.student-hero-character-v155 img{
  position:absolute;width:290px;max-width:none;height:auto;left:50%;bottom:-30px;transform:translateX(-50%);
  filter:drop-shadow(0 17px 17px rgba(42,74,111,.17))
}
.student-hero-character-v155 .spark{position:absolute;z-index:5;color:#f5b71b;font-size:26px}
.student-hero-character-v155 .spark.one{right:12px;bottom:66px}
.student-hero-character-v155 .spark.two{left:13px;top:105px}
.student-hero-character-v155 .spark.three{left:38px;top:69px;color:#67a6ef;font-size:18px}
.student-hero-quote-v155{
  position:absolute;z-index:6;right:238px;top:44px;width:186px;padding:17px 18px;border-radius:23px;background:#fff;
  color:#153d70;font-size:10.8px;line-height:1.55;font-weight:850;box-shadow:0 10px 22px rgba(49,83,125,.09)
}
.student-hero-quote-v155:after{
  content:"";position:absolute;left:31px;bottom:-13px;border:13px solid transparent;border-top-color:#fff;border-bottom:0
}
.student-hero-side-v155{position:relative;z-index:5;display:grid;gap:13px}
.student-side-card-v155{
  min-height:86px;padding:14px 16px;border-radius:19px;background:rgba(255,255,255,.93);
  border:1px solid rgba(255,255,255,.98);box-shadow:0 8px 20px rgba(48,81,121,.06);
  display:flex;align-items:center;gap:13px
}
.student-side-icon-v155{
  width:44px;height:44px;flex:0 0 44px;border-radius:13px;display:grid;place-items:center;position:relative;overflow:hidden
}
.student-side-icon-v155 svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;position:relative;z-index:1}
.student-side-icon-v155.calendar{color:#2f79e8;background:linear-gradient(145deg,#e7f3ff,#cee6ff)}
.student-side-icon-v155.sprout{color:#2aa45f;background:linear-gradient(145deg,#eff9ea,#dff2d7)}
.student-side-card-v155 b{display:block;color:#173d6e;font-size:12.5px;line-height:1.45}
.student-side-card-v155 small{display:block;margin-top:4px;color:#7e92a9;font-size:9.5px}

/* More compact premium statistics */
.student-stats-v151{gap:12px}
.stat151{min-height:108px;padding:15px 15px;grid-template-columns:54px 1fr}
.stat151-icon{width:50px;height:50px;border-radius:15px}
.stat151-number{font-size:27px}
.stat151-main>span{font-size:10.5px}
.stat151-meta{font-size:8.4px}

/* Dashboard page density aligned with reference */
.student-dashboard-v148{gap:15px}
.student-dashboard-grid-v148{gap:14px;grid-template-columns:minmax(0,1.38fr) minmax(335px,.82fr)}
.student-panel-v148{border-radius:19px}
.student-panel-head-v148{padding:17px 18px 11px}
.habit-list-v148{margin:0 16px}
.activity-row-v148{margin:0 16px}
.student-quick-grid-v148.premium{padding:0 14px 14px}
.student-motivation-v152{min-height:174px}

@media(max-width:1220px){
  .student-hero-v155{grid-template-columns:minmax(350px,1fr) 300px 210px;min-height:278px}
  .student-hero-character-v155 img{width:252px}
  .student-hero-quote-v155{right:212px;width:160px}
}
@media(max-width:1000px){
  .student-hero-v155{grid-template-columns:1fr 270px}
  .student-hero-side-v155{display:none}
  .student-hero-quote-v155{right:24px}
}
@media(max-width:700px){
  .student-hero-v155{display:block;min-height:auto;padding:21px 18px 0}
  .student-hero-copy-v155 h1{font-size:29px}
  .student-hero-copy-v155 p{font-size:11px}
  .student-hero-copy-v155 blockquote{display:none}
  .student-hero-character-v155{height:178px;margin-top:6px}
  .student-hero-character-v155 img{width:188px;bottom:-18px}
  .student-hero-quote-v155{display:none}
}


/* KAIH v1.1.56 - Premium Motivation Banner */
.student-motivation-v156{
  min-height:190px;
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:210px minmax(0,1fr) 150px;
  align-items:center;
  gap:18px;
  padding:18px 28px 0 18px;
  border-radius:22px;
  border:1px solid #d4e8fb;
  background:
    radial-gradient(circle at 70% 34%,rgba(255,255,255,.52) 0 18%,transparent 19%),
    linear-gradient(135deg,#eaf6ff 0%,#d9ecff 55%,#cfe7ff 100%);
  box-shadow:0 10px 28px rgba(39,75,119,.06);
}
.student-motivation-v156:before{
  content:"";
  position:absolute;
  width:420px;height:185px;
  right:-120px;bottom:-108px;
  border-radius:50%;
  background:rgba(255,255,255,.28);
  transform:rotate(-12deg);
}
.student-motivation-v156:after{
  content:"";
  position:absolute;
  width:260px;height:120px;
  left:28%;top:-72px;
  border-radius:50%;
  background:rgba(255,255,255,.22);
}
.motivation-visual-v156{
  align-self:end;
  height:176px;
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.motivation-visual-v156 img{
  width:185px;
  height:auto;
  display:block;
  transform:translateY(5px);
  filter:drop-shadow(0 14px 18px rgba(45,82,125,.17));
}
.motivation-burst-v156{
  position:absolute;
  color:#f3b51d;
  line-height:1;
  font-size:22px;
}
.motivation-burst-v156.one{left:18px;top:48px}
.motivation-burst-v156.two{right:16px;top:28px;color:#6ca5ea;font-size:16px}

.motivation-content-v156{
  position:relative;
  z-index:3;
  align-self:center;
  max-width:650px;
}
.motivation-kicker-v156{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 9px;
  border-radius:999px;
  background:rgba(255,255,255,.68);
  border:1px solid rgba(255,255,255,.95);
  color:#3f74ad;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
}
.motivation-content-v156 h3{
  margin:7px 0 0;
  color:#143d72;
  font-size:22px;
  line-height:1.1;
  letter-spacing:-.025em;
}
.motivation-content-v156 p{
  margin:7px 0 0;
  color:#58789d;
  font-size:10.8px;
  line-height:1.55;
}
.motivation-content-v156 blockquote{
  margin:12px 0 0;
  min-height:58px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 14px;
  border-radius:15px;
  background:rgba(255,255,255,.66);
  border:1px solid rgba(255,255,255,.98);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
  color:#246fd9;
  font-size:10.2px;
  font-style:italic;
  line-height:1.5;
}
.quote-mark-v156{
  font-size:34px;
  line-height:1;
  color:#68a3ef;
  font-family:Georgia,serif;
  font-style:normal;
  margin-top:-6px;
}
.motivation-decoration-v156{
  position:relative;
  z-index:3;
  align-self:center;
  justify-self:end;
}
.motivation-decoration-v156 svg{
  width:130px;
  height:auto;
  overflow:visible;
}
.motivation-decoration-v156 .route{
  fill:none;
  stroke:#2e9fea;
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:7 9;
}
.motivation-decoration-v156 .plane{
  fill:#2497ea;
}
.motivation-decoration-v156 .fold{
  fill:none;
  stroke:#126fc3;
  stroke-width:2.2;
  stroke-linejoin:round;
}

@media(max-width:900px){
  .student-motivation-v156{
    grid-template-columns:150px minmax(0,1fr) 100px;
    min-height:172px;
    padding:15px 20px 0 12px;
  }
  .motivation-visual-v156{height:155px}
  .motivation-visual-v156 img{width:150px}
  .motivation-decoration-v156 svg{width:88px}
  .motivation-content-v156 h3{font-size:19px}
}
@media(max-width:700px){
  .student-motivation-v156{
    grid-template-columns:112px 1fr;
    min-height:160px;
    padding:14px 14px 0 10px;
    border-radius:18px;
  }
  .motivation-visual-v156{height:140px}
  .motivation-visual-v156 img{width:118px}
  .motivation-decoration-v156{display:none}
  .motivation-kicker-v156{font-size:7px}
  .motivation-content-v156 h3{font-size:17px}
  .motivation-content-v156 p{font-size:9.5px}
  .motivation-content-v156 blockquote{font-size:8.8px;padding:9px 10px}
}
@media(max-width:440px){
  .student-motivation-v156{
    grid-template-columns:1fr;
    padding:17px;
    min-height:auto;
  }
  .motivation-visual-v156{display:none}
}


/* KAIH v1.1.57 - Premium Aktivitas Terbaru */
.activity-panel-v157{
  position:relative;
  overflow:hidden;
  border:1px solid #dfe9f5;
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 28px rgba(38,73,117,.055);
  padding:0 18px 6px;
}
.activity-panel-v157:before{
  content:"";
  position:absolute;
  width:210px;height:150px;
  right:-90px;top:-90px;
  border-radius:50%;
  background:linear-gradient(145deg,rgba(231,242,255,.72),rgba(255,255,255,0));
  pointer-events:none;
}
.activity-head-v157{
  min-height:86px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:15px 0 11px;
  position:relative;
  z-index:1;
}
.activity-title-v157{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.activity-title-icon-v157{
  width:46px;height:46px;flex:0 0 46px;
  border-radius:14px;
  display:grid;place-items:center;
  color:#2d7dee;
  background:linear-gradient(145deg,#e8f4ff,#cfe8ff);
  box-shadow:0 8px 17px rgba(45,125,238,.14);
  position:relative;
  overflow:hidden;
}
.activity-title-icon-v157:after{
  content:"";
  position:absolute;
  width:32px;height:15px;
  left:7px;top:4px;border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,0));
}
.activity-title-icon-v157 svg{
  width:23px;height:23px;
  fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
  position:relative;z-index:1;
}
.activity-title-v157 h2{
  margin:0;
  color:#143d74;
  font-size:18px;
  line-height:1.1;
  letter-spacing:-.02em;
}
.activity-title-v157 p{
  margin:5px 0 0;
  color:#8195ae;
  font-size:9.3px;
  line-height:1.4;
}
.activity-see-all-v157{
  text-decoration:none;
  color:#1468e8;
  font-size:10px;
  font-weight:900;
  white-space:nowrap;
  position:relative;z-index:1;
}
.activity-see-all-v157 span{font-size:14px;margin-left:4px}

.activity-row-v157{
  min-height:78px;
  display:grid;
  grid-template-columns:50px minmax(0,1fr) auto 34px;
  align-items:center;
  gap:12px;
  text-decoration:none;
  border-top:1px solid #eaf0f6;
  position:relative;
  z-index:1;
  transition:background .16s ease,transform .16s ease;
}
.activity-row-v157:hover{
  background:linear-gradient(90deg,rgba(247,251,255,.95),rgba(255,255,255,.7));
}
.activity-icon-v157{
  width:46px;height:46px;border-radius:14px;
  display:grid;place-items:center;
  position:relative;overflow:hidden;
}
.activity-icon-v157:after{
  content:"";position:absolute;
  left:7px;top:4px;width:31px;height:15px;border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,0));
}
.activity-icon-v157 svg{
  width:23px;height:23px;
  fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
  position:relative;z-index:1;
}
.activity-icon-v157.reflection{
  color:#2f81ef;
  background:linear-gradient(145deg,#e7f4ff,#cde8ff);
  box-shadow:0 8px 18px rgba(47,129,239,.13);
}
.activity-icon-v157.habit{
  color:#14a863;
  background:linear-gradient(145deg,#e1faed,#c6f2db);
  box-shadow:0 8px 18px rgba(20,168,99,.13);
}
.activity-icon-v157.portfolio{
  color:#8950e9;
  background:linear-gradient(145deg,#f2e9ff,#decaff);
  box-shadow:0 8px 18px rgba(137,80,233,.13);
}
.activity-copy-v157{min-width:0}
.activity-copy-v157 b{
  display:block;
  color:#173f74;
  font-size:10.7px;
  line-height:1.35;
  font-weight:850;
}
.activity-copy-v157 small{
  display:block;
  margin-top:4px;
  color:#7d92ad;
  font-size:8.6px;
  line-height:1.4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.activity-time-v157{
  min-height:30px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  color:#7289a8;
  background:#f3f7fc;
  font-size:8.8px;
  white-space:nowrap;
}
.activity-row-v157.habit .activity-time-v157{
  color:#15945b;
  background:#e8f8ef;
}
.activity-row-v157.portfolio .activity-time-v157{
  color:#8250cf;
  background:#f2ebff;
}
.activity-time-v157 svg{
  width:15px;height:15px;
  fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
}
.activity-arrow-v157{
  width:31px;height:31px;border-radius:50%;
  display:grid;place-items:center;
  color:#126ae8;
  background:#fff;
  border:1px solid #e4ecf5;
  box-shadow:0 5px 13px rgba(38,73,117,.07);
  font-size:22px;
  line-height:1;
  transition:transform .16s ease,box-shadow .16s ease;
}
.activity-row-v157:hover .activity-arrow-v157{
  transform:translateX(2px);
  box-shadow:0 7px 16px rgba(38,73,117,.11);
}
.activity-empty-v157{
  min-height:110px;
  border-top:1px solid #eaf0f6;
  display:flex;align-items:center;justify-content:center;gap:12px;
  color:#6f86a4;
}
.activity-empty-v157 b{display:block;color:#274b78;font-size:10.5px}
.activity-empty-v157 small{display:block;margin-top:4px;font-size:8.8px}

@media(max-width:700px){
  .activity-panel-v157{padding:0 13px 5px;border-radius:18px}
  .activity-head-v157{min-height:72px}
  .activity-title-icon-v157{width:40px;height:40px;flex-basis:40px}
  .activity-title-v157 h2{font-size:16px}
  .activity-title-v157 p{display:none}
  .activity-row-v157{
    min-height:72px;
    grid-template-columns:43px minmax(0,1fr) 30px;
    gap:9px;
  }
  .activity-icon-v157{width:40px;height:40px;border-radius:12px}
  .activity-time-v157{
    grid-column:2;
    justify-self:start;
    min-height:24px;
    padding:0 8px;
    font-size:7.7px;
    margin-top:-7px;
  }
  .activity-arrow-v157{
    grid-column:3;
    grid-row:1 / span 2;
    width:29px;height:29px;
  }
}


/* KAIH v1.1.58 - Aktivitas Terbaru hover consistency fix */
.activity-row-v157{
  border-radius:0 !important;
  border-left:0 !important;
  border-right:0 !important;
  box-shadow:none !important;
}
.activity-row-v157:hover{
  background:linear-gradient(90deg,rgba(246,250,255,.72),rgba(255,255,255,0)) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.activity-row-v157:focus,
.activity-row-v157:focus-visible{
  outline:none !important;
  box-shadow:inset 3px 0 0 #7aa9ef !important;
  border-radius:0 !important;
}
.activity-row-v157:hover .activity-copy-v157 b{
  color:#1264cf;
}
.activity-row-v157:hover .activity-arrow-v157{
  transform:translateX(2px);
}


/* KAIH v1.1.59 - Aktivitas alignment & row consistency */
.activity-row-v157{
  grid-template-columns:46px minmax(150px,1fr) 118px 32px !important;
  column-gap:12px !important;
  min-height:76px !important;
  padding:0 !important;
}

.activity-icon-v157{
  width:44px !important;
  height:44px !important;
  border-radius:13px !important;
}

.activity-copy-v157{
  min-width:0 !important;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-self:stretch;
}

.activity-copy-v157 b{
  display:block;
  max-width:100%;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  line-height:1.25 !important;
}

.activity-copy-v157 small{
  display:block;
  max-width:100%;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  line-height:1.35 !important;
}

.activity-time-v157{
  width:118px !important;
  min-width:118px !important;
  max-width:118px !important;
  min-height:31px !important;
  padding:0 10px !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  font-size:8.7px !important;
}

.activity-arrow-v157{
  width:31px !important;
  height:31px !important;
  min-width:31px !important;
  margin-left:0 !important;
}

@media(max-width:760px){
  .activity-row-v157{
    grid-template-columns:42px minmax(0,1fr) 30px !important;
    grid-template-rows:auto auto !important;
    column-gap:10px !important;
    row-gap:1px !important;
    min-height:74px !important;
    padding:8px 0 !important;
  }

  .activity-icon-v157{
    width:40px !important;
    height:40px !important;
    grid-row:1 / span 2 !important;
  }

  .activity-copy-v157{
    grid-column:2 !important;
    grid-row:1 !important;
    align-self:end !important;
  }

  .activity-time-v157{
    grid-column:2 !important;
    grid-row:2 !important;
    width:auto !important;
    min-width:0 !important;
    max-width:max-content !important;
    min-height:23px !important;
    padding:0 8px !important;
    justify-self:start !important;
    margin:2px 0 0 !important;
  }

  .activity-arrow-v157{
    grid-column:3 !important;
    grid-row:1 / span 2 !important;
    align-self:center !important;
  }
}


/* KAIH v1.1.60 - Premium Achievement Icon */
.activity-icon-v157.habit{
  width:44px !important;
  height:44px !important;
  border-radius:15px !important;
  color:#0ca866 !important;
  background:
    radial-gradient(circle at 50% 42%,rgba(255,255,255,.98) 0 31%,transparent 32%),
    linear-gradient(145deg,#e9fff4 0%,#c9f6df 100%) !important;
  border:1px solid rgba(88,214,153,.25);
  box-shadow:
    0 8px 18px rgba(20,168,99,.13),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}
.activity-icon-v157.habit:before{
  content:"";
  position:absolute;
  width:28px;
  height:28px;
  border-radius:10px;
  background:linear-gradient(145deg,#31d58b,#0caf68);
  box-shadow:
    0 6px 12px rgba(12,168,102,.22),
    inset 0 1px 1px rgba(255,255,255,.42);
  transform:rotate(45deg);
  z-index:1;
}
.activity-icon-v157.habit:after{
  content:"";
  position:absolute;
  width:34px;
  height:17px;
  left:5px;
  top:3px;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,0));
  z-index:3;
  pointer-events:none;
}
.activity-icon-v157.habit svg{
  width:20px !important;
  height:20px !important;
  color:#fff !important;
  stroke:#fff !important;
  stroke-width:2.4 !important;
  position:relative;
  z-index:4 !important;
  filter:drop-shadow(0 1px 1px rgba(0,99,59,.14));
}
.activity-row-v157.habit:hover .activity-icon-v157.habit{
  transform:translateY(-1px);
  box-shadow:
    0 10px 22px rgba(20,168,99,.18),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}


/* KAIH v1.1.61 - Real Premium Achievement Medal */
.activity-icon-v157.habit{
  width:46px !important;
  height:46px !important;
  border-radius:15px !important;
  display:grid !important;
  place-items:center !important;
  color:inherit !important;
  background:
    radial-gradient(circle at 30% 22%,rgba(255,255,255,.95),rgba(255,255,255,0) 38%),
    linear-gradient(145deg,#ecfff6 0%,#d3f8e5 100%) !important;
  border:1px solid rgba(53,201,129,.24) !important;
  box-shadow:
    0 9px 20px rgba(16,168,96,.14),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  overflow:visible !important;
}
.activity-icon-v157.habit:before,
.activity-icon-v157.habit:after{
  content:none !important;
  display:none !important;
}
.activity-icon-v157.habit .achievement-medal-svg{
  width:31px !important;
  height:31px !important;
  display:block !important;
  fill:none;
  stroke:none !important;
  filter:
    drop-shadow(0 3px 5px rgba(11,137,77,.16))
    drop-shadow(0 1px 1px rgba(255,255,255,.7));
  transform:translateY(-1px);
  transition:transform .18s ease,filter .18s ease;
}
.activity-row-v157.habit:hover .activity-icon-v157.habit .achievement-medal-svg{
  transform:translateY(-2px) scale(1.04);
  filter:
    drop-shadow(0 5px 8px rgba(11,137,77,.22))
    drop-shadow(0 1px 1px rgba(255,255,255,.8));
}
.activity-row-v157.habit:hover .activity-icon-v157.habit{
  box-shadow:
    0 11px 23px rgba(16,168,96,.18),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}


/* KAIH v1.1.62 - Centered Premium Achievement Medal */
.activity-icon-v157.habit{
  width:48px !important;
  height:48px !important;
  border-radius:15px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  overflow:visible !important;
  background:
    radial-gradient(circle at 50% 40%,rgba(255,255,255,.98) 0 34%,transparent 35%),
    linear-gradient(145deg,#F0FFF8 0%,#D8FAE8 100%) !important;
  border:1px solid rgba(87,216,154,.28) !important;
  box-shadow:
    0 8px 18px rgba(21,170,100,.12),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}

.activity-icon-v157.habit .achievement-medal-svg{
  width:36px !important;
  height:36px !important;
  display:block !important;
  margin:0 !important;
  transform:none !important;
  position:static !important;
  filter:drop-shadow(0 3px 5px rgba(12,142,82,.16));
}

.activity-row-v157.habit:hover .activity-icon-v157.habit .achievement-medal-svg{
  transform:scale(1.04) !important;
}

.activity-row-v157.habit .activity-copy-v157{
  padding-left:2px;
}


/* KAIH v1.1.63 - Premium 7 Kebiasaan Check-in */
.habit-page-v163{display:grid;gap:16px;padding-bottom:95px}
.habit-hero-v163{
  min-height:185px;
  border-radius:23px;
  border:1px solid #d7e7f7;
  background:
    radial-gradient(circle at 78% 38%,rgba(255,255,255,.55) 0 17%,transparent 18%),
    linear-gradient(135deg,#edf7ff 0%,#e2f1ff 52%,#d8ebff 100%);
  box-shadow:0 10px 28px rgba(43,79,123,.06);
  padding:25px 27px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  overflow:hidden;
  position:relative;
}
.habit-hero-v163:after{
  content:"";position:absolute;width:280px;height:150px;right:-80px;bottom:-95px;border-radius:50%;
  background:rgba(255,255,255,.27);transform:rotate(-14deg)
}
.habit-hero-copy-v163{position:relative;z-index:2;max-width:650px}
.habit-kicker-v163{
  display:inline-flex;align-items:center;min-height:25px;padding:0 9px;border-radius:999px;
  background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.95);
  color:#557da7;font-size:8px;font-weight:900;letter-spacing:.09em
}
.habit-hero-copy-v163 h1{margin:8px 0 0;color:#123c72;font-size:29px;letter-spacing:-.035em}
.habit-hero-copy-v163 p{margin:8px 0 0;color:#617fa2;font-size:10.8px;line-height:1.55;max-width:590px}
.habit-date-v163{margin-top:13px;display:inline-flex;align-items:center;gap:7px;color:#4f7196;font-size:9.5px;font-weight:750}
.habit-date-v163 svg{width:17px;height:17px;fill:none;stroke:#3677e3;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.habit-progress-v163{position:relative;z-index:2;display:flex;align-items:center;gap:14px;min-width:260px}
.habit-progress-ring-v163{
  width:92px;height:92px;border-radius:50%;padding:8px;display:grid;place-items:center;
  background:conic-gradient(#20b86e calc(var(--progress) * 3.6),#e7eff8 0);
  box-shadow:0 8px 20px rgba(31,148,94,.12)
}
.habit-progress-ring-v163>div{width:76px;height:76px;border-radius:50%;background:#fff;display:grid;place-items:center;align-content:center}
.habit-progress-ring-v163 strong{color:#164273;font-size:23px;line-height:1}.habit-progress-ring-v163 strong small{font-size:12px;color:#7189a5}.habit-progress-ring-v163 span{font-size:8px;color:#8094ad;margin-top:4px}
.habit-progress-copy-v163 b{display:block;color:#17446f;font-size:11px}.habit-progress-copy-v163 span{display:block;color:#8295ac;font-size:8.8px;margin-top:5px;max-width:130px;line-height:1.45}

.habit-grid-v163{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.habit-item-v163{
  position:relative;overflow:hidden;border:1px solid #e1e9f3;border-radius:20px;background:#fff;padding:16px;
  box-shadow:0 8px 22px rgba(40,73,114,.045);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease
}
.habit-item-v163:before{content:"";position:absolute;width:115px;height:90px;border-radius:50%;right:-47px;top:-48px;opacity:.48}
.habit-item-v163.habit-1:before{background:#fff0b9}.habit-item-v163.habit-2:before{background:#eadfff}.habit-item-v163.habit-3:before{background:#dcecff}.habit-item-v163.habit-4:before{background:#ffe0e3}.habit-item-v163.habit-5:before{background:#e1edff}.habit-item-v163.habit-6:before{background:#dcf2ff}.habit-item-v163.habit-7:before{background:#e2eaff}
.habit-item-v163.done{border-color:#bdebd2;background:linear-gradient(180deg,#fbfffd,#f5fcf8);box-shadow:0 9px 24px rgba(24,157,90,.07)}
.habit-item-head-v163{display:grid;grid-template-columns:50px 1fr auto;gap:12px;align-items:center;position:relative;z-index:2}
.habit-icon-v163{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;position:relative;overflow:hidden;border:1px solid #e1eaf5;background:#f5f9ff;color:#3479e6;box-shadow:0 6px 15px rgba(45,91,151,.07)}
.habit-icon-v163:after{content:"";position:absolute;width:34px;height:17px;left:7px;top:4px;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,0))}
.habit-icon-v163 svg{width:23px;height:23px;position:relative;z-index:1;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.habit-1 .habit-icon-v163{color:#eaa20c;background:linear-gradient(145deg,#fff9e9,#ffedbd)}.habit-2 .habit-icon-v163{color:#8653d7;background:linear-gradient(145deg,#f7efff,#e9dcff)}.habit-3 .habit-icon-v163{color:#2778e8;background:linear-gradient(145deg,#eef6ff,#dcecff)}.habit-4 .habit-icon-v163{color:#e75462;background:linear-gradient(145deg,#fff1f3,#ffdce1)}.habit-5 .habit-icon-v163{color:#3478e4;background:linear-gradient(145deg,#eef5ff,#dceaff)}.habit-6 .habit-icon-v163{color:#315fd3;background:linear-gradient(145deg,#edf3ff,#dce7ff)}.habit-7 .habit-icon-v163{color:#3269d8;background:linear-gradient(145deg,#edf4ff,#dfeaff)}
.habit-title-v163 span{display:block;color:#8b9db3;font-size:7.8px;font-weight:850;text-transform:uppercase;letter-spacing:.055em}.habit-title-v163 h3{margin:3px 0 0;color:#173f73;font-size:14px;line-height:1.2}.habit-title-v163 p{margin:4px 0 0;color:#7d91aa;font-size:8.8px;line-height:1.35}
.habit-toggle-v163{cursor:pointer;position:relative;z-index:3}.habit-toggle-v163 input{position:absolute;opacity:0;pointer-events:none}.toggle-track-v163{width:43px;height:25px;border-radius:999px;background:#e8eef5;border:1px solid #d8e2ed;display:block;position:relative;transition:.18s ease}.toggle-track-v163 i{width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 3px 8px rgba(40,68,104,.18);position:absolute;left:2px;top:2px;transition:.18s ease}.habit-toggle-v163 input:checked+.toggle-track-v163{background:#20b76e;border-color:#20b76e}.habit-toggle-v163 input:checked+.toggle-track-v163 i{transform:translateX(18px)}.habit-toggle-v163 input:focus-visible+.toggle-track-v163{outline:3px solid rgba(43,113,231,.12);outline-offset:2px}

.habit-note-v163{margin-top:14px;padding-top:12px;border-top:1px solid #edf2f7;position:relative;z-index:2}.habit-note-label-v163{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}.habit-note-label-v163>span{display:flex;align-items:center;gap:6px;color:#526f92;font-size:8.6px;font-weight:800}.habit-note-label-v163 svg{width:14px;height:14px;fill:none;stroke:#4f7ab4;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.habit-note-label-v163 small{font-size:7.8px;color:#a0afc2}.habit-note-v163 textarea{width:100%;min-height:63px;max-height:120px;resize:vertical;border:1px solid #dce6f2;border-radius:12px;background:#f9fbfe;padding:10px 11px;color:#294b72;font:inherit;font-size:9.5px;line-height:1.45;outline:none}.habit-note-v163 textarea:focus{background:#fff;border-color:#8eb3f1;box-shadow:0 0 0 3px rgba(53,112,225,.08)}.habit-note-v163 textarea::placeholder{color:#a0afc1}
.habit-status-line-v163{margin-top:9px;display:flex;align-items:center;gap:6px;color:#9aa9ba;font-size:8px;position:relative;z-index:2}.habit-status-dot-v163{width:7px;height:7px;border-radius:50%;background:#c7d2df}.habit-item-v163.done .habit-status-line-v163{color:#148653}.habit-item-v163.done .habit-status-dot-v163{background:#20b76e;box-shadow:0 0 0 4px rgba(32,183,110,.10)}

.habit-savebar-v163{
  position:sticky;bottom:12px;z-index:20;margin-top:16px;min-height:78px;padding:12px 14px 12px 16px;border-radius:19px;
  background:rgba(255,255,255,.94);border:1px solid #dce7f3;box-shadow:0 14px 36px rgba(37,71,112,.14);
  backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:space-between;gap:15px
}
.habit-save-info-v163{display:flex;align-items:center;gap:11px}.habit-save-icon-v163{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#e9f3ff,#d8e9ff);color:#3476df;box-shadow:0 6px 14px rgba(52,118,223,.11)}.habit-save-icon-v163 svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.habit-save-info-v163 b{display:block;color:#173f72;font-size:11px}.habit-save-info-v163 span{display:block;color:#8295ad;font-size:8.5px;margin-top:4px}
.habit-save-btn-v163{min-width:155px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:10px;font-weight:900;box-shadow:0 9px 18px rgba(45,109,232,.2)}.habit-save-btn-v163 svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:900px){.habit-hero-v163{align-items:flex-start}.habit-grid-v163{grid-template-columns:1fr}.habit-progress-v163{min-width:230px}}
@media(max-width:700px){
  .habit-page-v163{padding-bottom:88px}.habit-hero-v163{display:block;min-height:auto;padding:20px 17px;border-radius:19px}.habit-hero-copy-v163 h1{font-size:25px}.habit-progress-v163{margin-top:17px}.habit-progress-ring-v163{width:78px;height:78px}.habit-progress-ring-v163>div{width:64px;height:64px}.habit-grid-v163{gap:11px}.habit-item-v163{padding:13px;border-radius:17px}.habit-item-head-v163{grid-template-columns:44px 1fr auto;gap:10px}.habit-icon-v163{width:42px;height:42px;border-radius:12px}.habit-icon-v163 svg{width:20px;height:20px}.habit-title-v163 h3{font-size:12.5px}.habit-note-v163 textarea{min-height:55px}.habit-savebar-v163{bottom:68px;min-height:68px;border-radius:16px;padding:10px 11px}.habit-save-icon-v163{display:none}.habit-save-info-v163 span{display:none}.habit-save-btn-v163{min-width:135px;height:40px}}
@media(max-width:430px){.habit-savebar-v163{display:grid;grid-template-columns:1fr}.habit-save-btn-v163{width:100%}.habit-save-info-v163{justify-content:center}}


/* KAIH v1.1.64 - Premium Progress Dashboard */
.progress-page-v164{display:grid;gap:16px;padding-bottom:24px}
.progress-hero-v164{
  position:relative;overflow:hidden;min-height:190px;border-radius:24px;padding:28px 30px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:linear-gradient(135deg,#1f4db7 0%,#2e69ed 55%,#7058ec 100%);
  box-shadow:0 14px 34px rgba(47,88,191,.18)
}
.progress-hero-v164:before{content:"";position:absolute;width:420px;height:220px;right:10%;top:-130px;border-radius:50%;background:rgba(255,255,255,.10)}
.progress-hero-v164:after{content:"";position:absolute;width:300px;height:150px;right:-80px;bottom:-90px;border-radius:50%;background:rgba(255,255,255,.08)}
.progress-hero-copy-v164{position:relative;z-index:2;max-width:700px}.progress-kicker-v164{display:inline-flex;min-height:25px;align-items:center;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);color:#dbe8ff;font-size:8px;font-weight:900;letter-spacing:.1em}.progress-hero-copy-v164 h1{margin:10px 0 0;color:#fff;font-size:30px;letter-spacing:-.035em}.progress-hero-copy-v164 p{margin:8px 0 0;color:#dfe9ff;font-size:11px;line-height:1.55}.progress-hero-badges-v164{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.progress-hero-badges-v164 span{min-height:28px;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.16);color:#eef4ff;font-size:8.5px;display:inline-flex;align-items:center;gap:6px}.progress-hero-badges-v164 i{width:7px;height:7px;border-radius:50%;background:#80efb8;box-shadow:0 0 0 4px rgba(128,239,184,.12)}.progress-hero-badges-v164 b{color:#fff}
.progress-hero-visual-v164{position:relative;z-index:2;min-width:140px;display:grid;place-items:center}.progress-ring-v164{width:122px;height:122px;border-radius:50%;padding:10px;display:grid;place-items:center;background:conic-gradient(#8de6ff calc(var(--progress)*1%),rgba(255,255,255,.18) 0);box-shadow:0 12px 28px rgba(19,47,115,.22)}.progress-ring-v164>div{width:100%;height:100%;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px);display:grid;place-items:center;align-content:center}.progress-ring-v164 strong{color:#fff;font-size:28px;line-height:1}.progress-ring-v164 span{color:#dce8ff;font-size:8px;margin-top:5px}.progress-spark-v164{position:absolute;color:#ffcf48;font-size:20px}.progress-spark-v164.one{right:-4px;top:7px}.progress-spark-v164.two{left:3px;bottom:12px;color:#b9d8ff;font-size:15px}

.progress-stats-v164{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.progress-stat-v164{min-height:108px;position:relative;overflow:hidden;border:1px solid #e0e9f4;border-radius:19px;background:#fff;box-shadow:0 8px 24px rgba(37,72,115,.055);padding:16px 17px;display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:13px}.progress-stat-v164:after{content:"";position:absolute;width:100px;height:80px;border-radius:50%;right:-38px;top:-34px;opacity:.45}.progress-stat-v164.blue:after{background:#e4f0ff}.progress-stat-v164.purple:after{background:#eee5ff}.progress-stat-v164.green:after{background:#e1f6eb}.progress-stat-icon-v164{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;position:relative;z-index:1}.progress-stat-icon-v164 svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.progress-stat-v164.blue .progress-stat-icon-v164{background:linear-gradient(145deg,#e7f3ff,#d0e7ff);color:#2e78e5}.progress-stat-v164.purple .progress-stat-icon-v164{background:linear-gradient(145deg,#f2eaff,#ddccff);color:#8b55e2}.progress-stat-v164.green .progress-stat-icon-v164{background:linear-gradient(145deg,#e7faef,#caefd9);color:#18a760}.progress-stat-v164 small{display:block;color:#8497ae;font-size:8.6px}.progress-stat-v164 strong{display:block;color:#173f73;font-size:24px;line-height:1;margin-top:3px}.progress-stat-v164 span{display:block;color:#8b9db2;font-size:8px;margin-top:5px}.progress-stat-chip-v164{position:relative;z-index:1;align-self:end;justify-self:end;color:#356da9;background:#f3f7fc;border-radius:999px;padding:5px 8px;font-size:7.5px;white-space:nowrap}.progress-stat-v164.green .progress-stat-chip-v164{color:#168652;background:#eaf8f0}.progress-stat-v164.purple .progress-stat-chip-v164{color:#7d4fc9;background:#f3edff}

.progress-main-v164{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:15px}.progress-card-v164{border:1px solid #e0e9f4;border-radius:20px;background:#fff;box-shadow:0 8px 24px rgba(38,72,114,.05);padding:18px}.progress-card-head-v164{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.progress-card-kicker-v164{display:block;color:#8a9bb1;font-size:7.5px;font-weight:900;letter-spacing:.08em}.progress-card-head-v164 h2{margin:4px 0 0;color:#173f73;font-size:17px}.progress-card-head-v164 p{margin:5px 0 0;color:#899bb0;font-size:8.6px}.progress-mini-badge-v164{padding:6px 9px;border-radius:999px;background:#edf5ff;color:#2c6fda;font-size:8px;font-weight:850;white-space:nowrap}

.timeline-list-v164{display:grid;gap:7px}.timeline-row-v164{min-height:48px;display:grid;grid-template-columns:42px minmax(0,1fr) 46px;gap:10px;align-items:center;padding:4px 6px;border-radius:12px}.timeline-row-v164.today{background:#f7fbff;border:1px solid #e4edf8}.timeline-date-v164{width:38px;height:38px;border-radius:11px;background:#f2f6fb;display:grid;place-items:center;align-content:center;color:#56718f}.timeline-date-v164 b{font-size:11px;line-height:1}.timeline-date-v164 span{font-size:7px;text-transform:uppercase;margin-top:2px}.timeline-label-v164{display:flex;align-items:center;justify-content:space-between;color:#6f86a4;font-size:8.5px}.timeline-label-v164 b{color:#304f75}.timeline-bar-v164{height:7px;border-radius:999px;background:#edf2f7;overflow:hidden;margin-top:5px}.timeline-bar-v164 i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2e69e9,#65a5ff)}.timeline-percent-v164{justify-self:end;min-width:40px;height:26px;border-radius:999px;display:grid;place-items:center;font-size:7.8px;font-weight:900}.timeline-percent-v164.high{color:#148653;background:#e8f8ef}.timeline-percent-v164.medium{color:#2f6fd5;background:#edf4ff}.timeline-percent-v164.low{color:#8191a5;background:#f1f4f7}

.habit-progress-list-v164{display:grid;gap:10px}.habit-progress-item-v164{display:grid;grid-template-columns:46px 1fr;gap:11px;align-items:center;padding:9px 10px;border-radius:14px;background:#fbfdff;border:1px solid #edf2f7}.habit-progress-icon-v164{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#eef5ff;color:#3478e5}.habit-progress-icon-v164 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.habit-progress-item-v164.habit-1 .habit-progress-icon-v164{color:#e7a00b;background:#fff6df}.habit-progress-item-v164.habit-2 .habit-progress-icon-v164{color:#8754d7;background:#f3eaff}.habit-progress-item-v164.habit-3 .habit-progress-icon-v164{color:#2878e6;background:#eaf3ff}.habit-progress-item-v164.habit-4 .habit-progress-icon-v164{color:#e3505e;background:#fff0f2}.habit-progress-item-v164.habit-5 .habit-progress-icon-v164{color:#3377e1;background:#edf4ff}.habit-progress-item-v164.habit-6 .habit-progress-icon-v164{color:#315fcf;background:#eef2ff}.habit-progress-item-v164.habit-7 .habit-progress-icon-v164{color:#3267d4;background:#eef3ff}.habit-progress-label-v164{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.habit-progress-label-v164 b{display:block;color:#284b76;font-size:9.4px}.habit-progress-label-v164 span{display:block;color:#8b9cb0;font-size:7.7px;margin-top:3px}.habit-progress-label-v164 strong{color:#31577f;font-size:9px}.habit-progress-bar-v164{height:6px;border-radius:999px;background:#eaf0f6;overflow:hidden;margin-top:7px}.habit-progress-bar-v164 i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2e6ee7,#65a5ff)}
.progress-insight-v164{margin-top:14px;padding:12px;border-radius:14px;background:linear-gradient(135deg,#fff9e9,#fffdf7);border:1px solid #f4e7c8;display:flex;gap:10px}.progress-insight-icon-v164{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#fff0c8;color:#e99514;flex:0 0 auto}.progress-insight-icon-v164 svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.progress-insight-v164 b{display:block;color:#8b641f;font-size:9px}.progress-insight-v164 p{margin:4px 0 0;color:#8d7b5b;font-size:8px;line-height:1.5}

@media(max-width:950px){.progress-main-v164{grid-template-columns:1fr}.progress-stats-v164{grid-template-columns:1fr 1fr}.progress-stat-v164:last-child{grid-column:1/-1}}
@media(max-width:700px){.progress-hero-v164{min-height:auto;padding:21px 18px;border-radius:20px}.progress-hero-copy-v164 h1{font-size:25px}.progress-hero-visual-v164{display:none}.progress-stats-v164{grid-template-columns:1fr}.progress-stat-v164:last-child{grid-column:auto}.progress-card-v164{padding:14px;border-radius:17px}.timeline-row-v164{grid-template-columns:38px minmax(0,1fr) 42px}.progress-card-head-v164{display:block}.progress-mini-badge-v164{display:inline-flex;margin-top:9px}.habit-progress-item-v164{grid-template-columns:42px 1fr}.habit-progress-icon-v164{width:38px;height:38px}}


/* KAIH v1.1.65 - Premium Progress Stat Cards */
.progress-stats-v165{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.progress-stat-v165{
  min-height:128px;
  position:relative;
  overflow:hidden;
  border-radius:20px;
  border:1px solid #dfe8f3;
  background:#fff;
  box-shadow:0 9px 24px rgba(37,72,114,.055);
  padding:17px 18px 15px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:12px;
}
.progress-stat-v165:before{
  content:"";
  position:absolute;
  width:130px;
  height:92px;
  border-radius:50%;
  right:-46px;
  top:-40px;
  opacity:.58;
}
.progress-stat-v165.blue:before{background:#e5f0ff}
.progress-stat-v165.purple:before{background:#eee5ff}
.progress-stat-v165.green:before{background:#e3f6ec}

.progress-stat-main-v165{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:62px 1fr;
  gap:14px;
  align-items:center;
}
.progress-stat-icon-v165{
  width:58px;
  height:58px;
  border-radius:17px;
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
}
.progress-stat-icon-v165:after{
  content:"";
  position:absolute;
  left:8px;
  top:5px;
  width:40px;
  height:20px;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,0));
}
.progress-stat-icon-v165 svg{
  width:31px;
  height:31px;
  position:relative;
  z-index:1;
}
.progress-stat-v165.blue .progress-stat-icon-v165{
  background:linear-gradient(145deg,#e6f3ff,#cce7ff);
  box-shadow:0 8px 18px rgba(46,122,232,.15);
}
.progress-stat-v165.purple .progress-stat-icon-v165{
  background:linear-gradient(145deg,#f1e8ff,#decaff);
  box-shadow:0 8px 18px rgba(137,80,233,.15);
}
.progress-stat-v165.green .progress-stat-icon-v165{
  background:linear-gradient(145deg,#e4faee,#c9f1da);
  box-shadow:0 8px 18px rgba(19,169,96,.14);
}

.progress-stat-copy-v165 small{
  display:block;
  color:#7f93aa;
  font-size:9px;
}
.progress-stat-copy-v165 strong{
  display:block;
  margin-top:2px;
  color:#153f76;
  font-size:27px;
  line-height:1;
  letter-spacing:-.02em;
}
.progress-stat-copy-v165 span{
  display:block;
  margin-top:6px;
  color:#879ab0;
  font-size:8.5px;
}

.progress-stat-bottom-v165{
  position:relative;
  z-index:2;
  align-self:flex-end;
  min-height:30px;
  padding:0 10px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:8.5px;
  font-weight:900;
  white-space:nowrap;
}
.progress-stat-v165.blue .progress-stat-bottom-v165{
  background:#edf5ff;color:#2368cc;
}
.progress-stat-v165.purple .progress-stat-bottom-v165{
  background:#f3ecff;color:#7d4ac8;
}
.progress-stat-v165.green .progress-stat-bottom-v165{
  background:#e9f8ef;color:#148453;
}
.progress-stat-mini-icon-v165{
  width:22px;height:22px;border-radius:8px;
  display:grid;place-items:center;
}
.progress-stat-mini-icon-v165 svg{
  width:14px;height:14px;
  fill:none;stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.progress-stat-mini-icon-v165.blue{background:#dcecff;color:#2d78e9}
.progress-stat-mini-icon-v165.purple{background:#eadcff;color:#8a53df}
.progress-stat-mini-icon-v165.green{background:#d5f1e0;color:#12945a}

.progress-stat-watermark-v165{
  position:absolute;
  right:14px;
  top:12px;
  width:28px;
  height:28px;
  opacity:.13;
  z-index:1;
}
.progress-stat-watermark-v165 svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.progress-stat-v165.blue .progress-stat-watermark-v165{color:#3f83eb}
.progress-stat-v165.purple .progress-stat-watermark-v165{color:#9457e8}
.progress-stat-v165.green .progress-stat-watermark-v165{color:#1a9b5e}

@media(max-width:950px){
  .progress-stats-v165{grid-template-columns:1fr 1fr}
  .progress-stat-v165:last-child{grid-column:1/-1}
}
@media(max-width:700px){
  .progress-stats-v165{grid-template-columns:1fr}
  .progress-stat-v165:last-child{grid-column:auto}
  .progress-stat-v165{min-height:116px;padding:15px}
  .progress-stat-main-v165{grid-template-columns:54px 1fr}
  .progress-stat-icon-v165{width:52px;height:52px;border-radius:15px}
  .progress-stat-icon-v165 svg{width:28px;height:28px}
}


/* KAIH v1.1.66 - Premium Reflection Dashboard */
.reflection-page-v166{padding-bottom:24px}
.reflection-grid-v166{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr);gap:15px}
.reflection-form-card-v166,.reflection-history-v166{border:1px solid #e0e9f4;border-radius:21px;background:#fff;box-shadow:0 9px 25px rgba(38,72,114,.052);overflow:hidden}
.reflection-form-hero-v166{min-height:150px;position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px 18px;background:linear-gradient(135deg,#fff 0%,#fbfcff 62%,#f2f4ff 100%);border-bottom:1px solid #edf2f7}
.reflection-form-copy-v166{position:relative;z-index:2}.reflection-kicker-v166{display:block;color:#8296ad;font-size:8px;font-weight:900;letter-spacing:.11em}.reflection-form-copy-v166 h1{margin:7px 0 0;color:#143d73;font-size:28px;letter-spacing:-.035em}.reflection-form-copy-v166 p{margin:8px 0 0;color:#5d80ac;font-size:10.4px;line-height:1.55}
.reflection-hero-art-v166{position:relative;width:190px;height:112px;flex:0 0 190px}.reflection-note-v166{position:absolute;right:35px;top:12px;width:90px;height:90px;border-radius:18px;background:linear-gradient(145deg,#f2f4ff,#dfe6ff);box-shadow:0 10px 20px rgba(75,90,157,.12);transform:rotate(5deg)}.reflection-note-v166:before{content:"";position:absolute;inset:9px;border-radius:12px;background:#fff}.reflection-note-v166 .ring{position:absolute;top:-8px;width:9px;height:22px;border-radius:999px;background:#8aa7ef;z-index:3}.reflection-note-v166 .r1{left:22px}.reflection-note-v166 .r2{right:22px}.note-face{position:absolute;z-index:3;left:50%;top:17px;transform:translateX(-50%);font-size:28px}.reflection-note-v166 i{position:absolute;z-index:3;left:23px;height:4px;border-radius:999px;background:#cdd9f3}.reflection-note-v166 .l1{width:44px;top:57px}.reflection-note-v166 .l2{width:38px;top:67px}.reflection-note-v166 .l3{width:30px;top:77px}.reflection-pencil-v166{position:absolute;right:10px;top:38px;width:18px;height:82px;border-radius:7px;background:linear-gradient(180deg,#ffd34f,#f0a91d);transform:rotate(30deg);box-shadow:0 7px 14px rgba(183,126,20,.16)}.reflection-pencil-v166:after{content:"";position:absolute;bottom:-10px;left:3px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:13px solid #d89762}.reflection-spark-v166{position:absolute;color:#f4b51d;font-size:20px}.reflection-spark-v166.s1{left:21px;bottom:18px}.reflection-spark-v166.s2{right:0;top:8px;color:#8f72e9;font-size:15px}.reflection-bubble-v166{position:absolute;left:-20px;top:13px;padding:8px 11px;border-radius:13px;background:#f3f1ff;color:#715bb4;font-size:8px;line-height:1.35;font-weight:800}

.reflection-form-v166{padding:18px 22px 20px}.reflection-question-v166{margin-bottom:16px}.reflection-label-v166{display:flex;align-items:flex-start;gap:9px}.reflection-label-icon-v166{width:29px;height:29px;border-radius:9px;display:grid;place-items:center;flex:0 0 29px}.reflection-label-icon-v166.mood{background:#fff1cf;font-size:16px}.reflection-label-icon-v166 svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.reflection-label-v166 b{display:block;color:#214771;font-size:10.4px}.reflection-label-v166 small{display:block;color:#8b9cb1;font-size:8.2px;margin-top:3px}
.reflection-moods-v166{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.reflection-mood-v166{min-height:86px;position:relative;border:1px solid #dde7f3;border-radius:15px;background:#fff;display:grid;place-items:center;align-content:center;gap:5px;cursor:pointer;transition:.17s ease}.reflection-mood-v166 input{position:absolute;opacity:0;pointer-events:none}.reflection-mood-v166:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(37,72,114,.06)}.reflection-mood-v166.selected{border-color:#4e88ef;background:linear-gradient(145deg,#f4f8ff,#eaf2ff);box-shadow:0 8px 18px rgba(55,114,225,.09)}.reflection-mood-check-v166{position:absolute;right:8px;top:8px;width:19px;height:19px;border-radius:50%;background:#2f73e7;color:#fff;display:none;place-items:center;font-size:9px;font-weight:900}.reflection-mood-v166.selected .reflection-mood-check-v166{display:grid}.reflection-mood-emoji-v166{font-size:26px}.reflection-mood-v166 b{color:#264c78;font-size:9.5px}.reflection-mood-v166.selected b{color:#1e63d4}

.reflection-field-v166{margin-top:14px}.reflection-field-v166.green .reflection-label-icon-v166{background:#e7f8ef;color:#1ba966}.reflection-field-v166.red .reflection-label-icon-v166{background:#fff0f2;color:#e24e60}.reflection-field-v166.yellow .reflection-label-icon-v166{background:#fff5d9;color:#e99a18}.reflection-textarea-v166{position:relative;margin-top:8px}.reflection-textarea-v166 textarea{width:100%;min-height:78px;max-height:150px;resize:vertical;border:1px solid #dbe5f1;border-radius:13px;background:#fff;padding:11px 12px 22px;color:#294c74;font:inherit;font-size:9.5px;line-height:1.5;outline:none}.reflection-textarea-v166 textarea:focus{border-color:#8db1ee;box-shadow:0 0 0 3px rgba(54,112,224,.08)}.reflection-textarea-v166 textarea::placeholder{color:#a1afc0}.reflection-counter-v166{position:absolute;right:10px;bottom:7px;color:#8ea0b5;font-size:7.5px}
.reflection-form-footer-v166{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}.reflection-save-v166{min-width:165px;height:43px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:10px;font-weight:900;box-shadow:0 9px 18px rgba(47,110,232,.2)}.reflection-save-v166 svg{width:17px;height:17px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.reflection-mini-quote-v166{display:flex;align-items:center;gap:8px;padding:9px 11px;border-radius:12px;background:#eef4ff;color:#3472d8}.reflection-mini-quote-v166>span{font-size:17px}.reflection-mini-quote-v166 p{margin:0;font-size:7.7px;line-height:1.45;font-style:italic}

.reflection-side-v166{display:grid;gap:14px;align-content:start}.reflection-history-v166{padding:0 18px 16px}.reflection-history-head-v166{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:12px}.reflection-history-title-v166{display:flex;align-items:center;gap:10px}.reflection-history-icon-v166{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#e7f3ff,#d1e8ff);color:#2e79e6;box-shadow:0 7px 15px rgba(46,121,230,.12)}.reflection-history-icon-v166 svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.reflection-history-title-v166 h2{margin:0;color:#173f73;font-size:16px}.reflection-history-title-v166 p{margin:4px 0 0;color:#8699b0;font-size:8px}.reflection-history-badge-v166{padding:6px 9px;border-radius:999px;background:#edf5ff;color:#2e6fd6;font-size:7.8px;font-weight:850}
.reflection-timeline-v166{position:relative;padding-left:20px}.reflection-timeline-v166:before{content:"";position:absolute;left:5px;top:10px;bottom:18px;width:2px;background:#e4ebf4}.reflection-history-item-v166{position:relative;margin-bottom:10px}.reflection-timeline-dot-v166{position:absolute;left:-20px;top:23px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid #2f73e8;z-index:2}.reflection-history-card-v166{border:1px solid #e0e9f4;border-radius:15px;background:#fff;padding:12px 13px;box-shadow:0 6px 16px rgba(38,72,114,.035)}.reflection-history-top-v166{display:grid;grid-template-columns:36px 1fr auto;gap:9px;align-items:center}.reflection-history-mood-v166{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#fff0ce;font-size:18px}.reflection-history-date-v166 b{display:block;color:#1e4674;font-size:9.5px}.reflection-history-date-v166 span{display:none}.reflection-feeling-v166{padding:5px 9px;border-radius:999px;font-size:7.7px;font-weight:900}.reflection-feeling-v166.senang{background:#e6f8ee;color:#168755}.reflection-feeling-v166.biasa{background:#edf4ff;color:#2d69ca}.reflection-feeling-v166.sedih{background:#fff0f2;color:#d54c5d}.reflection-history-card-v166>p{margin:9px 0 0;color:#587394;font-size:8.6px;line-height:1.45}.reflection-history-meta-v166{display:flex;gap:14px;flex-wrap:wrap;margin-top:9px;padding-top:8px;border-top:1px solid #edf2f7}.reflection-history-meta-v166 span{font-size:7.6px;color:#7c91aa}.reflection-history-meta-v166 i{font-style:normal;margin-right:4px}
.reflection-empty-v166{padding:35px 20px;text-align:center;color:#8094ad}.reflection-empty-v166>span{font-size:28px}.reflection-empty-v166 b{display:block;margin-top:7px;color:#365779;font-size:10px}.reflection-empty-v166 p{margin:5px 0 0;font-size:8px}

.reflection-growth-v166{min-height:108px;border-radius:18px;border:1px solid #cdebdc;background:linear-gradient(135deg,#effbf4,#e6f8ed);display:grid;grid-template-columns:52px 1fr 190px;gap:12px;align-items:center;padding:14px 16px;box-shadow:0 7px 18px rgba(32,128,78,.045)}.reflection-growth-icon-v166{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#ddf7e8,#bfeecf);color:#15a55f;box-shadow:0 7px 15px rgba(21,165,95,.12)}.reflection-growth-icon-v166 svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.reflection-growth-copy-v166 b{display:block;color:#22533b;font-size:9.5px}.reflection-growth-copy-v166 p{margin:4px 0 0;color:#678b78;font-size:7.8px;line-height:1.45}.reflection-growth-progress-v166{padding:10px;border-radius:13px;background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.95)}.reflection-growth-bar-v166{height:7px;border-radius:999px;background:#e2eee7;overflow:hidden}.reflection-growth-bar-v166 i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1db86e,#55d696)}.reflection-growth-progress-v166 span{display:block;margin-top:7px;color:#4c785e;font-size:7.3px}

@media(max-width:980px){.reflection-grid-v166{grid-template-columns:1fr}.reflection-side-v166{grid-template-columns:1fr 1fr}.reflection-growth-v166{grid-template-columns:46px 1fr}.reflection-growth-progress-v166{grid-column:1/-1}}
@media(max-width:700px){.reflection-form-hero-v166{min-height:auto;padding:20px 17px}.reflection-form-copy-v166 h1{font-size:25px}.reflection-hero-art-v166{display:none}.reflection-form-v166{padding:15px}.reflection-moods-v166{gap:8px}.reflection-mood-v166{min-height:76px}.reflection-form-footer-v166{display:grid}.reflection-save-v166{width:100%}.reflection-mini-quote-v166{justify-content:center}.reflection-side-v166{grid-template-columns:1fr}.reflection-history-v166{padding:0 13px 13px}.reflection-history-head-v166{min-height:68px}.reflection-growth-v166{grid-template-columns:42px 1fr}.reflection-growth-icon-v166{width:40px;height:40px;border-radius:12px}}
@media(max-width:430px){.reflection-moods-v166{grid-template-columns:1fr}.reflection-mood-v166{min-height:64px;grid-template-columns:42px 1fr;justify-content:start;padding:0 14px}.reflection-mood-emoji-v166{font-size:22px}.reflection-history-top-v166{grid-template-columns:34px 1fr}.reflection-feeling-v166{grid-column:2;justify-self:start}.reflection-history-meta-v166{gap:8px}}


/* KAIH v1.1.67 - Premium Portfolio Dashboard */
.portfolio-page-v167{display:grid;gap:16px;padding-bottom:24px}
.portfolio-hero-v167{
  position:relative;
  min-height:118px;
  display:grid;
  grid-template-columns:minmax(300px,1fr) 190px 180px minmax(430px,1.15fr);
  align-items:center;
  gap:16px;
  padding:14px 20px;
}
.portfolio-hero-copy-v167{position:relative;z-index:2}
.portfolio-kicker-v167{display:block;color:#8296ad;font-size:8px;font-weight:900;letter-spacing:.1em}
.portfolio-hero-copy-v167 h1{margin:6px 0 0;color:#143d73;font-size:28px;letter-spacing:-.035em}
.portfolio-hero-copy-v167 p{margin:6px 0 0;color:#607fa3;font-size:10.5px}
.portfolio-hero-quote-v167{min-height:62px;border-radius:17px;background:linear-gradient(145deg,#f8fbff,#f2f4ff);border:1px solid #e8edf7;padding:11px 13px;display:flex;align-items:flex-start;gap:8px;color:#5f7394;box-shadow:0 6px 16px rgba(42,72,113,.035)}.portfolio-hero-quote-v167>span{color:#5fa4eb;font-size:18px}.portfolio-hero-quote-v167 p{margin:0;font-size:8.5px;line-height:1.45;font-weight:750}
.portfolio-hero-art-v167{height:96px;position:relative}.folder-v167{position:absolute;left:24px;top:19px;width:100px;height:68px;transform:rotate(4deg)}.folder-back{position:absolute;left:7px;top:2px;width:85px;height:60px;border-radius:10px;background:linear-gradient(145deg,#767eea,#555bc9);box-shadow:0 10px 18px rgba(73,79,176,.16)}.folder-front{position:absolute;left:0;bottom:0;width:102px;height:55px;border-radius:11px;background:linear-gradient(145deg,#ffb52e,#f18b1c);box-shadow:0 8px 16px rgba(230,145,24,.15)}.folder-front:before{content:"";position:absolute;left:14px;top:-10px;width:42px;height:18px;border-radius:8px 8px 0 0;background:#f5a228}.folder-v167 .photo{position:absolute;width:43px;height:34px;border:4px solid #fff;border-radius:6px;background:linear-gradient(145deg,#8ec9ff,#3b89e8);box-shadow:0 5px 12px rgba(42,88,147,.15)}.folder-v167 .photo.one{left:20px;top:15px;transform:rotate(-9deg)}.folder-v167 .photo.two{right:5px;top:12px;transform:rotate(8deg)}.camera-v167{position:absolute;right:5px;bottom:5px;width:51px;height:35px;border-radius:9px;background:linear-gradient(145deg,#397bd8,#285aab);box-shadow:0 7px 14px rgba(40,91,169,.16)}.camera-v167>span{position:absolute;left:9px;top:-6px;width:20px;height:8px;border-radius:5px 5px 0 0;background:#4c89dc}.camera-v167>i{position:absolute;right:8px;top:8px;width:19px;height:19px;border-radius:50%;border:5px solid #eaf4ff;background:#184c8d}.portfolio-spark-v167{position:absolute;color:#df6ad2;font-size:18px}.portfolio-spark-v167.s1{right:2px;top:4px}.portfolio-spark-v167.s2{left:3px;top:43px;color:#5ca4eb;font-size:13px}
.portfolio-benefits-v167{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px;border-radius:18px;background:#fff;border:1px solid #e1eaf5;box-shadow:0 7px 20px rgba(38,72,114,.045)}.portfolio-benefit-v167{min-height:66px;display:flex;align-items:center;gap:9px;padding:8px 9px;border-right:1px solid #edf2f7}.portfolio-benefit-v167:last-child{border-right:0}.portfolio-benefit-v167>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:0 0 38px}.portfolio-benefit-v167 svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.portfolio-benefit-v167.green>span{background:#e6f8ee;color:#16a55f}.portfolio-benefit-v167.blue>span{background:#e8f2ff;color:#2e78e8}.portfolio-benefit-v167.purple>span{background:#f1e9ff;color:#8a54df}.portfolio-benefit-v167 b{color:#355578;font-size:8.5px;line-height:1.35}

.portfolio-layout-v167{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr);gap:15px}.portfolio-form-card-v167,.portfolio-impact-v167,.portfolio-latest-v167{border:1px solid #e0e9f4;border-radius:20px;background:#fff;box-shadow:0 9px 24px rgba(38,72,114,.05)}
.portfolio-form-card-v167{padding:18px}.portfolio-form-head-v167{display:flex;align-items:center;gap:12px;margin-bottom:18px}.portfolio-form-icon-v167{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#3379f0,#155de0);color:#fff;box-shadow:0 8px 17px rgba(31,102,227,.2)}.portfolio-form-icon-v167 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.portfolio-form-head-v167 h2{margin:0;color:#173f73;font-size:17px}.portfolio-form-head-v167 p{margin:4px 0 0;color:#8295ad;font-size:8.8px}
.portfolio-form-v167{display:grid;gap:14px}.portfolio-field-top-v167{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px}.portfolio-field-top-v167 label{color:#355578;font-size:9.5px;font-weight:850}.portfolio-field-top-v167 label b{color:#e74f60}.portfolio-field-top-v167 label small{font-weight:700;color:#8fa0b4}.portfolio-field-top-v167>span{color:#8296ae;font-size:7.8px}
.portfolio-input-wrap-v167,.portfolio-textarea-wrap-v167{position:relative}.portfolio-input-wrap-v167>span,.portfolio-textarea-wrap-v167>span{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:10px;background:#edf4ff;color:#3776df;display:grid;place-items:center}.portfolio-textarea-wrap-v167>span{top:11px;transform:none}.portfolio-input-wrap-v167 svg,.portfolio-textarea-wrap-v167 svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.portfolio-input-wrap-v167 input{width:100%;height:46px;border:1px solid #dce6f2;border-radius:13px;padding:0 12px 0 54px;color:#2b4d73;font:inherit;font-size:9.8px;outline:none}.portfolio-textarea-wrap-v167 textarea{width:100%;min-height:118px;max-height:220px;resize:vertical;border:1px solid #dce6f2;border-radius:13px;padding:12px 12px 12px 54px;color:#2b4d73;font:inherit;font-size:9.5px;line-height:1.5;outline:none}.portfolio-input-wrap-v167 input:focus,.portfolio-textarea-wrap-v167 textarea:focus{border-color:#8eb2ee;box-shadow:0 0 0 3px rgba(54,112,224,.08)}
.portfolio-tip-v167{display:flex;gap:10px;padding:11px 12px;border-radius:13px;background:linear-gradient(135deg,#edf7ff,#e6f2ff);border:1px solid #dcebf8}.portfolio-tip-v167>span{width:34px;height:34px;flex:0 0 34px;border-radius:10px;background:#fff;color:#3479e7;display:grid;place-items:center;box-shadow:0 5px 12px rgba(52,121,231,.08)}.portfolio-tip-v167 svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.portfolio-tip-v167 b{display:block;color:#285486;font-size:9px}.portfolio-tip-v167 p{margin:4px 0 0;color:#6583a6;font-size:8.2px;line-height:1.45}
.portfolio-upload-v167{min-height:118px;border:1.5px dashed #9fc2f5;border-radius:14px;background:linear-gradient(180deg,#fbfdff,#f5f9ff);display:grid;place-items:center;align-content:center;text-align:center;padding:14px;cursor:pointer;transition:.18s ease}.portfolio-upload-v167 input{display:none}.portfolio-upload-v167:hover,.portfolio-upload-v167.dragging{border-color:#4b89ec;background:#eef6ff}.portfolio-upload-v167.has-file{border-style:solid;border-color:#73b9e9;background:#f0fbff}.portfolio-upload-icon-v167{width:40px;height:40px;border-radius:12px;background:#e7f2ff;color:#3479e6;display:grid;place-items:center;margin-bottom:7px}.portfolio-upload-icon-v167 svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.portfolio-upload-v167>b{color:#2a4f7b;font-size:9.3px}.portfolio-upload-v167 p{margin:3px 0 0;color:#8095ad;font-size:8px}.portfolio-upload-v167 small{margin-top:8px;padding:5px 8px;border-radius:999px;background:#eaf1fa;color:#6f86a4;font-size:7.5px}
.portfolio-form-actions-v167{display:flex;gap:9px;align-items:center}.portfolio-submit-v167{min-width:190px;height:43px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:9.8px;font-weight:900;box-shadow:0 9px 18px rgba(47,110,232,.2)}.portfolio-submit-v167 svg{width:17px;height:17px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.portfolio-reset-v167{height:43px;min-width:72px;border-radius:12px;font-size:9px}

.portfolio-side-v167{display:grid;gap:14px;align-content:start}.portfolio-impact-v167{padding:17px}.portfolio-impact-head-v167{display:grid;grid-template-columns:46px 1fr 85px;gap:11px;align-items:center}.portfolio-impact-icon-v167{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#fff3d8,#ffe1a3);color:#e89b17;box-shadow:0 7px 15px rgba(232,155,23,.13)}.portfolio-impact-icon-v167 svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.portfolio-impact-head-v167 h3{margin:0;color:#183f72;font-size:14px}.portfolio-impact-head-v167 p{margin:5px 0 0;color:#738ba8;font-size:8.4px;line-height:1.45}.portfolio-impact-plant-v167 svg{width:76px;height:auto}
.portfolio-stats-v167{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:13px}.portfolio-stats-v167 article{min-height:64px;border:1px solid #e4ecf5;border-radius:13px;background:#fbfdff;padding:8px;display:flex;align-items:center;gap:9px}.portfolio-stats-v167 article>span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:0 0 34px}.portfolio-stats-v167 article>span.blue{background:#e8f2ff;color:#2e78e7}.portfolio-stats-v167 article>span.orange{background:#fff1d5;color:#ed9414}.portfolio-stats-v167 svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.portfolio-stats-v167 strong{display:block;color:#173f72;font-size:12px}.portfolio-stats-v167 small{display:block;color:#8799af;font-size:7.5px;margin-top:2px}

.portfolio-latest-v167{padding:0 17px 12px}.portfolio-latest-head-v167{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #edf2f7}.portfolio-latest-title-v167{display:flex;align-items:center;gap:10px}.portfolio-latest-title-v167>span{width:37px;height:37px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#3277ed,#185edc);color:#fff;box-shadow:0 7px 15px rgba(31,101,224,.18)}.portfolio-latest-title-v167 svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.portfolio-latest-title-v167 h2{margin:0;color:#173f73;font-size:15px}.portfolio-count-v167{padding:5px 8px;border-radius:999px;background:#edf5ff;color:#2c70d9;font-size:7.7px;font-weight:850}
.portfolio-list-v167{display:grid}.portfolio-item-v167{min-height:88px;display:grid;grid-template-columns:76px minmax(0,1fr) 95px;gap:11px;align-items:center;padding:11px 0;border-bottom:1px solid #edf2f7}.portfolio-item-v167:last-child{border-bottom:0}.portfolio-thumb-v167{width:72px;height:64px;border-radius:11px;overflow:hidden;background:#eef3f8;display:grid;place-items:center}.portfolio-thumb-v167 img{width:100%;height:100%;object-fit:cover}.portfolio-thumb-v167>span{width:38px;height:38px;border-radius:11px;background:#e8f2ff;color:#3379e7;display:grid;place-items:center}.portfolio-thumb-v167 svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.portfolio-item-copy-v167 h3{margin:0;color:#173f73;font-size:10px}.portfolio-item-copy-v167 p{margin:5px 0 0;color:#738ba7;font-size:8px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.portfolio-item-meta-v167{display:grid;justify-items:end;gap:8px}.portfolio-item-meta-v167 time{color:#6582a4;font-size:7.8px}.portfolio-item-meta-v167 button{width:30px;height:30px;border-radius:9px;border:1px solid #f0dce0;background:#fff7f8;color:#dd5362;display:grid;place-items:center;cursor:pointer}.portfolio-item-meta-v167 button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.portfolio-empty-v167{min-height:190px;display:grid;place-items:center;align-content:center;text-align:center;color:#8295ad}.portfolio-empty-v167>span{width:52px;height:52px;border-radius:15px;background:#edf5ff;color:#397be6;display:grid;place-items:center}.portfolio-empty-v167 svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8}.portfolio-empty-v167 b{margin-top:9px;color:#365879;font-size:10px}.portfolio-empty-v167 p{margin:5px 0 0;font-size:8px}

@media(max-width:1150px){.portfolio-hero-v167{grid-template-columns:1fr 180px 170px}.portfolio-benefits-v167{grid-column:1/-1}.portfolio-layout-v167{grid-template-columns:1fr}.portfolio-side-v167{grid-template-columns:1fr 1fr}.portfolio-latest-v167{grid-column:1/-1}}
@media(max-width:800px){.portfolio-hero-v167{grid-template-columns:1fr 160px}.portfolio-hero-quote-v167{display:none}.portfolio-hero-art-v167{justify-self:end}.portfolio-benefits-v167{grid-template-columns:1fr}.portfolio-benefit-v167{border-right:0;border-bottom:1px solid #edf2f7}.portfolio-benefit-v167:last-child{border-bottom:0}.portfolio-side-v167{grid-template-columns:1fr}.portfolio-latest-v167{grid-column:auto}}
@media(max-width:700px){.portfolio-hero-v167{display:block;padding:14px 4px}.portfolio-hero-art-v167{display:none}.portfolio-benefits-v167{margin-top:13px}.portfolio-form-card-v167{padding:14px;border-radius:17px}.portfolio-form-head-v167 h2{font-size:15px}.portfolio-textarea-wrap-v167 textarea{min-height:100px}.portfolio-form-actions-v167{display:grid;grid-template-columns:1fr auto}.portfolio-submit-v167{min-width:0;width:100%}.portfolio-impact-head-v167{grid-template-columns:42px 1fr}.portfolio-impact-plant-v167{display:none}.portfolio-stats-v167{grid-template-columns:1fr}.portfolio-item-v167{grid-template-columns:58px minmax(0,1fr) 70px}.portfolio-thumb-v167{width:56px;height:50px}.portfolio-item-meta-v167 time{font-size:7px}}
@media(max-width:430px){.portfolio-form-actions-v167{grid-template-columns:1fr}.portfolio-reset-v167{width:100%}.portfolio-item-v167{grid-template-columns:52px minmax(0,1fr)}.portfolio-item-meta-v167{grid-column:2;display:flex;justify-content:space-between;width:100%;justify-items:stretch}.portfolio-thumb-v167{width:50px;height:46px}}


/* KAIH v1.1.68 - Premium Education Dashboard */
.education-page-v168{display:grid;gap:16px;padding-bottom:24px}
.education-hero-v168{
  min-height:230px;position:relative;overflow:hidden;display:grid;
  grid-template-columns:minmax(0,1.2fr) 320px;align-items:center;gap:24px;
  padding:28px 30px;border-radius:24px;
  background:linear-gradient(135deg,#1e4db5 0%,#2d6be9 55%,#7258ee 100%);
  box-shadow:0 14px 34px rgba(47,88,190,.18)
}
.education-hero-v168:before{content:"";position:absolute;width:520px;height:260px;border-radius:50%;right:8%;top:-155px;background:rgba(255,255,255,.09)}
.education-hero-v168:after{content:"";position:absolute;width:360px;height:180px;border-radius:50%;left:-80px;bottom:-110px;background:rgba(255,255,255,.07)}
.education-hero-copy-v168{position:relative;z-index:2;max-width:720px}.education-kicker-v168{display:inline-flex;min-height:25px;align-items:center;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);color:#dbe7ff;font-size:8px;font-weight:900;letter-spacing:.1em}.education-hero-copy-v168 h1{margin:10px 0 0;color:#fff;font-size:31px;letter-spacing:-.035em}.education-hero-copy-v168 p{margin:9px 0 0;color:#e0e9ff;font-size:11px;line-height:1.6;max-width:650px}.education-hero-actions-v168{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}.education-primary-v168,.education-secondary-v168{min-height:40px;padding:0 14px;border-radius:11px;display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-size:9px;font-weight:900}.education-primary-v168{background:#fff;color:#235fcf;box-shadow:0 8px 18px rgba(19,49,118,.18)}.education-secondary-v168{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff}.education-primary-v168 svg,.education-secondary-v168 svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.education-hero-visual-v168{height:180px;position:relative;z-index:2;display:grid;place-items:center}.education-book-v168{position:relative;width:190px;height:125px;filter:drop-shadow(0 15px 17px rgba(18,47,115,.22))}.book-left,.book-right{position:absolute;top:18px;width:93px;height:105px;background:linear-gradient(145deg,#fff,#dfeaff);border:5px solid rgba(255,255,255,.55)}.book-left{left:4px;border-radius:16px 6px 12px 18px;transform:rotate(-5deg)}.book-right{right:4px;border-radius:6px 16px 18px 12px;transform:rotate(5deg)}.book-left:after,.book-right:after{content:"";position:absolute;width:43px;height:6px;border-radius:999px;background:#7ea3ee;top:26px}.book-left:after{left:22px}.book-right:after{right:22px}.book-line{position:absolute;height:5px;border-radius:999px;background:#a9c1ef;z-index:2}.book-line.one{width:52px;left:24px;top:65px;transform:rotate(-5deg)}.book-line.two{width:48px;right:24px;top:64px;transform:rotate(5deg)}.book-line.three{width:58px;right:18px;top:83px;transform:rotate(5deg)}.education-badge-v168{position:absolute;right:18px;bottom:6px;width:66px;height:66px;border-radius:19px;background:linear-gradient(145deg,#ffca48,#ed9818);display:grid;place-items:center;align-content:center;color:#fff;box-shadow:0 10px 18px rgba(214,137,22,.23);transform:rotate(5deg)}.education-badge-v168 span{font-size:24px;line-height:1;font-weight:900}.education-badge-v168 small{font-size:7px;margin-top:3px}.education-spark-v168{position:absolute;color:#ffd34b;font-size:22px}.education-spark-v168.s1{left:15px;top:32px}.education-spark-v168.s2{right:2px;top:15px;color:#cadcff;font-size:15px}

.education-summary-v168{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.education-summary-v168 article{min-height:86px;border:1px solid #e0e9f4;border-radius:17px;background:#fff;box-shadow:0 8px 22px rgba(37,72,114,.05);display:flex;align-items:center;gap:11px;padding:13px 14px}.education-summary-v168 article>span{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;flex:0 0 44px}.education-summary-v168 article>span.green{background:linear-gradient(145deg,#e5faee,#c9f0d9);color:#18a45f}.education-summary-v168 article>span.blue{background:linear-gradient(145deg,#e7f3ff,#cee7ff);color:#2e77e5}.education-summary-v168 article>span.purple{background:linear-gradient(145deg,#f1e9ff,#ddcaff);color:#8b54df}.education-summary-v168 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.education-summary-v168 b{display:block;color:#214771;font-size:9.7px}.education-summary-v168 small{display:block;color:#8295ad;font-size:7.9px;line-height:1.45;margin-top:4px}

.education-content-v168{border:1px solid #e0e9f4;border-radius:21px;background:#fff;box-shadow:0 9px 25px rgba(38,72,114,.05);padding:19px}.education-section-head-v168{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}.education-section-kicker-v168{display:block;color:#8799af;font-size:7.5px;font-weight:900;letter-spacing:.09em}.education-section-head-v168 h2{margin:4px 0 0;color:#173f73;font-size:18px}.education-section-head-v168 p{margin:5px 0 0;color:#8799af;font-size:8.7px}.education-count-v168{padding:6px 9px;border-radius:999px;background:#edf5ff;color:#2d6fd7;font-size:7.8px;font-weight:850}
.education-grid-v168{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.education-card-v168{position:relative;overflow:hidden;min-height:188px;border:1px solid #e4ebf4;border-radius:17px;background:#fbfdff;padding:14px;transition:transform .17s ease,box-shadow .17s ease,border-color .17s ease}.education-card-v168:after{content:"";position:absolute;width:110px;height:90px;border-radius:50%;right:-42px;top:-45px;opacity:.52}.education-card-v168.habit-1:after{background:#fff0c0}.education-card-v168.habit-2:after{background:#eee2ff}.education-card-v168.habit-3:after{background:#ddecff}.education-card-v168.habit-4:after{background:#ffe3e6}.education-card-v168.habit-5:after{background:#e0ecff}.education-card-v168.habit-6:after{background:#dcf2ff}.education-card-v168.habit-7:after{background:#e5ebff}.education-card-v168:hover{transform:translateY(-2px);box-shadow:0 10px 23px rgba(37,72,114,.075);border-color:#cfddec}.education-card-top-v168{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.education-number-v168{color:#9aabc0;font-size:8px;font-weight:900;letter-spacing:.08em}.education-icon-v168{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:#edf5ff;color:#3378e4;box-shadow:0 6px 14px rgba(45,91,151,.08)}.education-icon-v168 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.education-card-v168.habit-1 .education-icon-v168{background:#fff5db;color:#e89f0d}.education-card-v168.habit-2 .education-icon-v168{background:#f4eaff;color:#8654d5}.education-card-v168.habit-3 .education-icon-v168{background:#eaf3ff;color:#2b77e5}.education-card-v168.habit-4 .education-icon-v168{background:#fff0f2;color:#e34f5d}.education-card-v168.habit-5 .education-icon-v168{background:#edf4ff;color:#3378e0}.education-card-v168.habit-6 .education-icon-v168{background:#edf4ff;color:#315fd0}.education-card-v168.habit-7 .education-icon-v168{background:#eef3ff;color:#3268d5}.education-card-v168 h3{position:relative;z-index:2;margin:9px 0 0;color:#173f73;font-size:13px}.education-short-v168{position:relative;z-index:2;margin:5px 0 0;color:#8195ad;font-size:8.5px;line-height:1.45}.education-detail-v168{position:relative;z-index:2;margin-top:10px;display:flex;gap:7px;padding:9px 10px;border-radius:11px;background:#fff;border:1px solid #edf2f7}.education-detail-icon-v168{color:#5d9ce9;font-size:13px;line-height:1}.education-detail-v168 p{margin:0;color:#607b9b;font-size:7.9px;line-height:1.45}.education-card-link-v168{position:relative;z-index:2;margin-top:10px;display:flex;align-items:center;justify-content:space-between;text-decoration:none;color:#2b6fd8;font-size:8.3px;font-weight:900}.education-card-link-v168 b{width:26px;height:26px;border-radius:50%;background:#edf5ff;display:grid;place-items:center;font-size:13px}

.education-motivation-v168{min-height:86px;border:1px solid #cfe8dc;border-radius:18px;background:linear-gradient(135deg,#f0fbf5,#e8f8ef);display:grid;grid-template-columns:46px 1fr auto;gap:11px;align-items:center;padding:13px 15px}.education-motivation-icon-v168{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#fff2cc,#ffd982);color:#e79a16;box-shadow:0 7px 15px rgba(231,154,22,.12)}.education-motivation-icon-v168 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.education-motivation-v168 b{display:block;color:#28553e;font-size:9.5px}.education-motivation-v168 p{margin:4px 0 0;color:#678b78;font-size:7.9px;line-height:1.45}.education-motivation-v168>a{text-decoration:none;min-height:34px;padding:0 11px;border-radius:10px;background:#fff;color:#1a9159;display:inline-flex;align-items:center;gap:7px;font-size:8px;font-weight:900;box-shadow:0 5px 12px rgba(42,107,72,.06)}

@media(max-width:1050px){.education-hero-v168{grid-template-columns:1fr 260px}.education-summary-v168{grid-template-columns:1fr 1fr}.education-summary-v168 article:last-child{grid-column:1/-1}}
@media(max-width:760px){.education-hero-v168{display:block;min-height:auto;padding:21px 18px;border-radius:20px}.education-hero-copy-v168 h1{font-size:26px}.education-hero-visual-v168{display:none}.education-summary-v168{grid-template-columns:1fr}.education-summary-v168 article:last-child{grid-column:auto}.education-content-v168{padding:14px;border-radius:18px}.education-grid-v168{grid-template-columns:1fr}.education-motivation-v168{grid-template-columns:42px 1fr}.education-motivation-v168>a{grid-column:1/-1;justify-self:stretch;justify-content:center}}


/* KAIH v1.1.69 - Premium Student Profile */
.profile-page-v169{display:grid;gap:16px;padding-bottom:24px}
.profile-hero-v169{
  min-height:160px;position:relative;overflow:hidden;display:grid;
  grid-template-columns:minmax(0,1.05fr) 320px minmax(340px,.85fr);
  align-items:center;gap:18px;padding:20px 24px;border-radius:22px;
  border:1px solid #dce8f5;
  background:
    radial-gradient(circle at 62% 40%,rgba(255,255,255,.58) 0 17%,transparent 18%),
    linear-gradient(135deg,#eef6ff 0%,#e6efff 54%,#e3eaff 100%);
  box-shadow:0 9px 25px rgba(39,73,116,.05)
}
.profile-hero-v169:before{content:"";position:absolute;width:360px;height:165px;border-radius:50%;left:32%;bottom:-110px;background:rgba(255,255,255,.25);transform:rotate(-11deg)}
.profile-hero-copy-v169{position:relative;z-index:2;max-width:610px}.profile-kicker-v169{display:block;color:#7f95ad;font-size:8px;font-weight:900;letter-spacing:.11em}.profile-hero-copy-v169 h1{margin:7px 0 0;color:#153d73;font-size:30px;letter-spacing:-.035em}.profile-hero-copy-v169 p{margin:7px 0 0;color:#6482a6;font-size:10.5px;line-height:1.55;max-width:550px}
.profile-hero-art-v169{height:130px;position:relative;z-index:2;display:grid;place-items:center}.profile-idcard-v169{position:relative;width:205px;height:112px;border-radius:17px;background:linear-gradient(145deg,#6ba8ff,#4c68ef);box-shadow:0 13px 24px rgba(58,91,190,.2);transform:rotate(4deg)}.profile-id-avatar-v169{position:absolute;left:22px;top:26px;width:56px;height:56px;border-radius:50%;background:linear-gradient(145deg,#f7fbff,#cddcff);box-shadow:inset 0 -8px 14px rgba(70,99,174,.12)}.profile-id-avatar-v169:before{content:"";position:absolute;left:18px;top:9px;width:20px;height:20px;border-radius:50%;background:#fff}.profile-id-avatar-v169:after{content:"";position:absolute;left:8px;bottom:6px;width:40px;height:23px;border-radius:50% 50% 15px 15px;background:#fff}.profile-id-line-v169{position:absolute;right:24px;height:7px;border-radius:999px;background:rgba(255,255,255,.72)}.profile-id-line-v169.one{width:74px;top:31px}.profile-id-line-v169.two{width:58px;top:49px}.profile-id-line-v169.three{width:39px;top:67px}.profile-edit-badge-v169{position:absolute;right:33px;bottom:4px;width:48px;height:48px;border-radius:50%;background:#fff;color:#5b63e8;display:grid;place-items:center;box-shadow:0 8px 17px rgba(60,84,158,.14)}.profile-edit-badge-v169 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.profile-spark-v169{position:absolute;color:#538ff1;font-size:23px}.profile-spark-v169.one{left:16px;top:45px}.profile-spark-v169.two{right:30px;top:5px;color:#8eb4f4;font-size:15px}
.profile-hero-quote-v169{position:relative;z-index:2;min-height:86px;padding:15px 18px;border-radius:18px;background:rgba(255,255,255,.63);border:1px solid rgba(255,255,255,.95);display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:start;box-shadow:0 7px 18px rgba(47,77,120,.04)}.quote-mark-v169{font-family:Georgia,serif;color:#3479eb;font-size:28px;line-height:1}.profile-hero-quote-v169 p{margin:6px 0 0;color:#405e84;font-size:9px;line-height:1.5;font-weight:700}.profile-hero-quote-v169 i{position:absolute;left:45px;bottom:14px;width:70px;height:3px;border-radius:999px;background:linear-gradient(90deg,#2e74e9,#d8e5f7)}

.profile-card-v169{border:1px solid #e0e9f4;border-radius:21px;background:#fff;box-shadow:0 9px 25px rgba(38,72,114,.05);padding:18px}.profile-card-head-v169{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.profile-card-title-v169{display:flex;align-items:center;gap:11px}.profile-main-icon-v169{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#e8f2ff,#d4e6ff);color:#2e72df;box-shadow:0 7px 15px rgba(46,114,223,.12)}.profile-main-icon-v169 svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.profile-card-title-v169 h2{margin:0;color:#173f73;font-size:16px}.profile-card-title-v169 p{margin:4px 0 0;color:#8799af;font-size:8.2px}
.profile-admin-note-v169{min-height:52px;max-width:365px;padding:9px 12px;border-radius:14px;background:linear-gradient(135deg,#eef5ff,#e7f1ff);display:flex;align-items:center;gap:9px;border:1px solid #dde9f7}.profile-admin-note-v169>span{width:31px;height:31px;border-radius:9px;background:#2f75e6;color:#fff;display:grid;place-items:center;flex:0 0 31px;box-shadow:0 6px 12px rgba(47,117,230,.14)}.profile-admin-note-v169 svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.profile-admin-note-v169 p{margin:0;color:#34639c;font-size:8px;line-height:1.4;font-weight:750}

.profile-grid-v169{display:grid;grid-template-columns:1fr 1fr;gap:9px}.profile-item-v169{min-height:70px;border:1px solid #e4ebf4;border-radius:14px;background:#fbfdff;padding:10px 12px;display:flex;align-items:center;gap:10px;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.profile-item-v169:hover{transform:translateY(-1px);border-color:#d2deed;box-shadow:0 7px 17px rgba(38,72,114,.045)}.profile-item-v169.wide{grid-column:1/2}.profile-item-v169.full{grid-column:1/-1}.profile-item-icon-v169{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;flex:0 0 38px;position:relative;overflow:hidden}.profile-item-icon-v169:after{content:"";position:absolute;width:27px;height:13px;left:5px;top:3px;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,0))}.profile-item-icon-v169 svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;position:relative;z-index:1}.profile-item-v169.blue .profile-item-icon-v169{background:linear-gradient(145deg,#e7f2ff,#d0e6ff);color:#2f77e5}.profile-item-v169.green .profile-item-icon-v169{background:linear-gradient(145deg,#e5f9ed,#caefd9);color:#18a65f}.profile-item-v169.purple .profile-item-icon-v169{background:linear-gradient(145deg,#f1e8ff,#decaff);color:#8a54df}.profile-item-v169.orange .profile-item-icon-v169{background:linear-gradient(145deg,#fff3db,#ffe1a4);color:#e99216}.profile-item-v169 small{display:block;color:#8296ad;font-size:8px}.profile-item-v169 b{display:block;margin-top:3px;color:#173f73;font-size:10px;line-height:1.3}

.profile-help-v169{margin-top:14px;min-height:68px;padding:10px 12px;border-radius:15px;background:linear-gradient(135deg,#f6faff,#eef5ff);border:1px solid #dfe9f6;display:grid;grid-template-columns:40px 1fr auto 24px;gap:10px;align-items:center}.profile-help-icon-v169{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#e8f2ff,#d3e7ff);color:#3277e5;box-shadow:0 6px 13px rgba(50,119,229,.1)}.profile-help-icon-v169 svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.profile-help-copy-v169 b{display:block;color:#2b5f9c;font-size:8.8px}.profile-help-copy-v169 p{margin:3px 0 0;color:#8195ad;font-size:7.7px}.profile-contact-v169{min-height:36px;padding:0 11px;border-radius:10px;background:#fff;color:#2c67bd;border:1px solid #dbe7f4;text-decoration:none;display:inline-flex;align-items:center;gap:7px;font-size:8px;font-weight:900;box-shadow:0 5px 12px rgba(38,72,114,.04)}.profile-contact-v169 svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.profile-help-arrow-v169{color:#2d75e2;font-size:21px;text-align:center}

@media(max-width:1050px){.profile-hero-v169{grid-template-columns:1fr 260px}.profile-hero-quote-v169{grid-column:1/-1}.profile-card-head-v169{align-items:flex-start}.profile-admin-note-v169{max-width:330px}}
@media(max-width:760px){.profile-hero-v169{display:block;min-height:auto;padding:20px 17px;border-radius:19px}.profile-hero-copy-v169 h1{font-size:26px}.profile-hero-art-v169{display:none}.profile-hero-quote-v169{margin-top:13px}.profile-card-v169{padding:14px;border-radius:18px}.profile-card-head-v169{display:grid}.profile-admin-note-v169{max-width:none}.profile-grid-v169{grid-template-columns:1fr}.profile-item-v169.wide,.profile-item-v169.full{grid-column:auto}.profile-help-v169{grid-template-columns:38px 1fr}.profile-contact-v169{grid-column:1/-1;justify-self:stretch;justify-content:center}.profile-help-arrow-v169{display:none}}


/* =========================================================
   KAIH v1.1.70 - ADMIN DATA SISWA ISOLATION / REGRESSION FIX
   Student-page styles must never disturb Super Admin pages.
   ========================================================= */

.role-admin .content{
  padding:24px 26px !important;
}

/* Page hero */
.role-admin .edu-page-hero.student-hero{
  min-height:190px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.2fr) 330px !important;
  align-items:center !important;
  overflow:hidden !important;
  border-radius:24px !important;
  background:linear-gradient(135deg,#f8fbff 0%,#eff6ff 58%,#eaf2ff 100%) !important;
  border:1px solid #dfe9f5 !important;
  box-shadow:0 10px 28px rgba(35,70,113,.055) !important;
  margin:0 0 16px !important;
}
.role-admin .edu-page-hero.student-hero .edu-page-copy{
  padding:28px 30px !important;
}
.role-admin .edu-page-hero.student-hero .eyebrow{
  display:block !important;
  color:#7087a4 !important;
  font-size:10px !important;
  font-weight:900 !important;
  letter-spacing:.09em !important;
}
.role-admin .edu-page-hero.student-hero h1{
  margin:7px 0 6px !important;
  font-size:31px !important;
  line-height:1.08 !important;
  color:#143d73 !important;
  letter-spacing:-.03em !important;
}
.role-admin .edu-page-hero.student-hero p{
  margin:0 !important;
  color:#7187a3 !important;
  font-size:12px !important;
}
.role-admin .edu-page-hero.student-hero .hero-actions-inline{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:9px !important;
  margin-top:18px !important;
}
.role-admin .edu-page-hero.student-hero .premium-file-action,
.role-admin .edu-page-hero.student-hero .student-add-action{
  min-height:42px !important;
  border-radius:12px !important;
}
.role-admin .edu-page-hero.student-hero .edu-page-art{
  position:relative !important;
  min-height:190px !important;
  overflow:hidden !important;
}
.role-admin .edu-page-hero.student-hero .edu-page-art .art-main{
  position:absolute !important;
  width:138px !important;
  height:138px !important;
  object-fit:contain !important;
  right:82px !important;
  bottom:13px !important;
}
.role-admin .edu-page-hero.student-hero .edu-page-art .art-float{
  position:absolute !important;
  width:48px !important;
  height:48px !important;
  object-fit:contain !important;
}
.role-admin .edu-page-hero.student-hero .edu-page-art .art-float.one{
  right:41px !important;
  top:27px !important;
}
.role-admin .edu-page-hero.student-hero .edu-page-art .art-float.two{
  left:39px !important;
  bottom:31px !important;
}
.role-admin .edu-page-hero.student-hero .art-copy{
  position:absolute !important;
  left:31px !important;
  top:30px !important;
  color:#69809d !important;
  font-size:11px !important;
  line-height:1.4 !important;
}

/* Summary stats */
.role-admin .edu-stat-grid.student-summary{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:14px !important;
  margin:0 0 16px !important;
}
.role-admin .student-summary .edu-stat-card{
  min-height:104px !important;
  padding:16px 17px !important;
  display:flex !important;
  align-items:center !important;
  gap:13px !important;
  border-radius:18px !important;
  background:#fff !important;
  border:1px solid #e0e9f4 !important;
  box-shadow:0 8px 22px rgba(35,70,113,.05) !important;
}
.role-admin .student-summary .edu-stat-icon{
  width:54px !important;
  height:54px !important;
  flex:0 0 54px !important;
  border-radius:16px !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  background:linear-gradient(145deg,#edf5ff,#dcecff) !important;
}
.role-admin .student-summary .edu-stat-icon img{
  display:block !important;
  width:42px !important;
  height:42px !important;
  max-width:42px !important;
  max-height:42px !important;
  object-fit:contain !important;
}
.role-admin .student-summary .edu-stat-card span{
  display:block !important;
  color:#687f9c !important;
  font-size:10px !important;
}
.role-admin .student-summary .edu-stat-card strong{
  display:block !important;
  margin-top:2px !important;
  color:#173f73 !important;
  font-size:25px !important;
  line-height:1 !important;
}
.role-admin .student-summary .edu-stat-card small{
  display:block !important;
  margin-top:5px !important;
  color:#8a9bb0 !important;
  font-size:8px !important;
}

/* Main data card */
.role-admin .edu-data-card{
  padding:0 !important;
  overflow:hidden !important;
  border-radius:22px !important;
  border:1px solid #dfe8f3 !important;
  background:#fff !important;
  box-shadow:0 10px 28px rgba(35,70,113,.055) !important;
}
.role-admin .edu-data-card .edu-card-head{
  min-height:76px !important;
  padding:17px 20px 12px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
}
.role-admin .edu-data-card .edu-card-head h3{
  margin:4px 0 0 !important;
  font-size:20px !important;
  color:#143d73 !important;
}
.role-admin .edu-data-card .edu-card-head .eyebrow{
  color:#7b90a9 !important;
  font-size:9px !important;
  font-weight:900 !important;
  letter-spacing:.09em !important;
}
.role-admin .edu-data-card .count-pill{
  min-height:31px !important;
  padding:0 11px !important;
  display:inline-flex !important;
  align-items:center !important;
  border-radius:999px !important;
  background:#edf4ff !important;
  color:#2567d8 !important;
  font-size:10px !important;
  font-weight:850 !important;
}

/* Toolbar */
.role-admin .student-toolbar.modern-toolbar{
  margin:0 18px 13px !important;
  padding:0 0 13px !important;
  border-bottom:1px solid #e9eef5 !important;
}
.role-admin .student-filter.modern-filter{
  display:grid !important;
  grid-template-columns:minmax(300px,1fr) 160px 160px auto auto !important;
  gap:9px !important;
  align-items:center !important;
}
.role-admin .student-filter .search-box.modern-search{
  position:relative !important;
  height:42px !important;
  border:1px solid #dce6f2 !important;
  border-radius:12px !important;
  background:#fff !important;
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:0 11px !important;
}
.role-admin .student-filter .modern-search input{
  width:100% !important;
  height:40px !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  font-size:11px !important;
}
.role-admin .student-filter select{
  width:100% !important;
  height:42px !important;
  border:1px solid #dce6f2 !important;
  border-radius:12px !important;
  background:#fff !important;
  padding:0 10px !important;
  font-size:10px !important;
}
.role-admin .student-filter .btn{
  min-height:42px !important;
  padding:0 14px !important;
  border-radius:11px !important;
  white-space:nowrap !important;
}
.role-admin .student-toolbar .filter-result{
  margin-top:9px !important;
  color:#8193aa !important;
  font-size:9px !important;
}

/* Table: force a compact desktop database layout */
.role-admin .student-table.premium-table{
  width:100% !important;
  overflow-x:auto !important;
  border:0 !important;
  border-radius:0 !important;
}
.role-admin .student-table.premium-table table{
  width:100% !important;
  min-width:980px !important;
  table-layout:auto !important;
  border-collapse:collapse !important;
  border-spacing:0 !important;
}
.role-admin .student-table.premium-table thead th{
  height:43px !important;
  padding:10px 13px !important;
  background:#f8fbff !important;
  border-bottom:1px solid #e5edf6 !important;
  color:#627691 !important;
  font-size:9px !important;
  font-weight:850 !important;
  text-transform:uppercase !important;
  letter-spacing:.035em !important;
  vertical-align:middle !important;
  white-space:nowrap !important;
}
.role-admin .student-table.premium-table tbody tr{
  height:auto !important;
  min-height:0 !important;
  padding:0 !important;
  background:#fff !important;
}
.role-admin .student-table.premium-table tbody tr:hover{
  background:#fbfdff !important;
}
.role-admin .student-table.premium-table tbody td{
  height:70px !important;
  min-height:70px !important;
  max-height:70px !important;
  padding:10px 13px !important;
  border-bottom:1px solid #edf2f7 !important;
  color:#25476f !important;
  font-size:9.5px !important;
  vertical-align:middle !important;
  white-space:nowrap !important;
}

/* CRITICAL regression guard: avatars can never expand the row */
.role-admin .student-table .student-name{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-width:160px !important;
}
.role-admin .student-table .student-avatar-premium{
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  max-width:44px !important;
  min-height:44px !important;
  max-height:44px !important;
  flex:0 0 44px !important;
  overflow:hidden !important;
  border-radius:13px !important;
  display:grid !important;
  place-items:center !important;
  background:linear-gradient(145deg,#f5f9ff,#e8f1ff) !important;
}
.role-admin .student-table .student-avatar-premium img,
.role-admin .student-table .student-avatar-premium picture,
.role-admin .student-table .student-avatar-premium svg{
  display:block !important;
  width:36px !important;
  height:36px !important;
  max-width:36px !important;
  max-height:36px !important;
  min-width:0 !important;
  min-height:0 !important;
  object-fit:contain !important;
}
.role-admin .student-table .student-name b{
  display:block !important;
  font-size:10px !important;
  line-height:1.25 !important;
  color:#173f73 !important;
}
.role-admin .student-table .link-button{
  display:block !important;
  margin:2px 0 0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#256ce0 !important;
  font-size:8px !important;
  text-align:left !important;
}
.role-admin .student-table .small{
  font-size:8px !important;
}
.role-admin .student-table .class-chip,
.role-admin .student-table .username-chip{
  display:inline-flex !important;
  align-items:center !important;
  min-height:25px !important;
  padding:0 8px !important;
  border-radius:8px !important;
  font-size:8.5px !important;
}
.role-admin .student-table .badge{
  min-height:25px !important;
  padding:0 8px !important;
  align-items:center !important;
  font-size:8.5px !important;
}

/* Actions */
.role-admin .student-table .row-actions.premium-actions{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  gap:5px !important;
  opacity:1 !important;
  white-space:nowrap !important;
}
.role-admin .student-table .row-actions form{
  display:inline-flex !important;
  margin:0 !important;
  padding:0 !important;
}
.role-admin .student-table .icon-btn{
  width:31px !important;
  height:31px !important;
  min-width:31px !important;
  max-width:31px !important;
  min-height:31px !important;
  max-height:31px !important;
  padding:0 !important;
  border:1px solid #e1e9f3 !important;
  border-radius:9px !important;
  background:#fbfdff !important;
  color:#356fd4 !important;
  display:grid !important;
  place-items:center !important;
  font-size:13px !important;
  line-height:1 !important;
}
.role-admin .student-table .icon-btn.danger-icon{
  background:#fff7f8 !important;
  border-color:#f2dfe3 !important;
  color:#db5362 !important;
}

/* Pagination */
.role-admin .premium-pagination{
  min-height:58px !important;
  padding:11px 18px 14px !important;
  border-top:1px solid #edf2f7 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}
.role-admin .premium-pagination>div{
  display:flex !important;
  gap:5px !important;
  flex-wrap:wrap !important;
}
.role-admin .premium-pagination .page-btn{
  width:31px !important;
  height:31px !important;
  border-radius:9px !important;
  display:grid !important;
  place-items:center !important;
  text-decoration:none !important;
  border:1px solid #e0e8f2 !important;
  background:#fff !important;
  color:#486482 !important;
  font-size:9px !important;
  font-weight:800 !important;
}
.role-admin .premium-pagination .page-btn.active{
  background:#2f70e7 !important;
  color:#fff !important;
  border-color:#2f70e7 !important;
  box-shadow:0 6px 13px rgba(47,112,231,.18) !important;
}

/* Defensive: student UI components must never leak into admin */
.role-admin .student-hero-v155,
.role-admin .student-hero-v154,
.role-admin .student-welcome-v150,
.role-admin .student-stats-v151,
.role-admin .activity-panel-v157,
.role-admin .student-motivation-v156,
.role-admin .reflection-page-v166,
.role-admin .portfolio-page-v167,
.role-admin .education-page-v168,
.role-admin .profile-page-v169{
  font-size:inherit !important;
}

/* Responsive Data Siswa */
@media(max-width:1100px){
  .role-admin .student-filter.modern-filter{
    grid-template-columns:minmax(260px,1fr) 145px 145px auto !important;
  }
  .role-admin .student-filter.modern-filter .btn.ghost{
    grid-column:auto !important;
  }
}
@media(max-width:760px){
  .role-admin .content{padding:16px 13px 84px !important}
  .role-admin .edu-page-hero.student-hero{
    display:block !important;
    min-height:auto !important;
    border-radius:19px !important;
  }
  .role-admin .edu-page-hero.student-hero .edu-page-copy{padding:20px 17px !important}
  .role-admin .edu-page-hero.student-hero .edu-page-art{display:none !important}
  .role-admin .edu-stat-grid.student-summary{grid-template-columns:1fr !important}
  .role-admin .student-filter.modern-filter{grid-template-columns:1fr 1fr !important}
  .role-admin .student-filter .modern-search{grid-column:1/-1 !important}
  .role-admin .student-filter .btn{width:100% !important}
  .role-admin .student-table.premium-table table{min-width:920px !important}
  .role-admin .premium-pagination{align-items:flex-start !important;flex-direction:column !important}
}


/* =========================================================
   KAIH v1.1.71 - ADMIN DATA SISWA HARD ISOLATION
   ========================================================= */
.role-admin .admin-students-v171{
  width:100%;
  min-width:0;
}

.role-admin .admin-students-v171 .edu-page-hero.student-hero{
  min-height:176px !important;
  margin-bottom:14px !important;
}

.role-admin .admin-students-v171 .edu-stat-grid.student-summary{
  margin-bottom:14px !important;
}

.role-admin .admin-students-v171 .edu-data-card{
  width:100% !important;
  min-width:0 !important;
}

/* toolbar */
.role-admin .admin-students-v171 .student-toolbar{
  margin:0 16px 12px !important;
}
.role-admin .admin-students-v171 .student-filter{
  display:grid !important;
  grid-template-columns:minmax(320px,1fr) 165px 165px auto auto !important;
  gap:9px !important;
  align-items:center !important;
}

/* table reset */
.role-admin .admin-students-v171 .student-table{
  width:100% !important;
  max-width:100% !important;
  overflow-x:auto !important;
}
.role-admin .admin-students-v171 .student-table table{
  width:100% !important;
  min-width:1020px !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
}
.role-admin .admin-students-v171 .student-table th:nth-child(1){width:26% !important}
.role-admin .admin-students-v171 .student-table th:nth-child(2){width:14% !important}
.role-admin .admin-students-v171 .student-table th:nth-child(3){width:10% !important}
.role-admin .admin-students-v171 .student-table th:nth-child(4){width:18% !important}
.role-admin .admin-students-v171 .student-table th:nth-child(5){width:13% !important}
.role-admin .admin-students-v171 .student-table th:nth-child(6){width:8% !important}
.role-admin .admin-students-v171 .student-table th:nth-child(7){width:11% !important}

.role-admin .admin-students-v171 .student-table thead th{
  height:42px !important;
  padding:10px 12px !important;
  font-size:8.5px !important;
  background:#f8fbff !important;
  color:#627793 !important;
  border-bottom:1px solid #e4ecf5 !important;
}

.role-admin .admin-students-v171 .student-table tbody tr{
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  background:#fff !important;
}
.role-admin .admin-students-v171 .student-table tbody td{
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  padding:9px 12px !important;
  font-size:9px !important;
  vertical-align:middle !important;
  border-bottom:1px solid #edf2f7 !important;
  overflow:hidden !important;
}
.role-admin .admin-students-v171 .student-table tbody tr:hover{
  background:#fbfdff !important;
}

/* student identity */
.role-admin .admin-students-v171 .student-name{
  min-width:0 !important;
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}
.role-admin .admin-students-v171 .student-avatar-v171{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  max-width:46px !important;
  min-height:46px !important;
  max-height:46px !important;
  flex:0 0 46px !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  border-radius:14px !important;
  background:linear-gradient(145deg,#f6f9ff,#eaf2ff) !important;
  border:1px solid #e3ebf6 !important;
  box-shadow:0 5px 13px rgba(38,78,131,.06) !important;
}
.role-admin .admin-students-v171 .student-avatar-v171 svg{
  display:block !important;
  width:40px !important;
  height:40px !important;
  max-width:40px !important;
  max-height:40px !important;
}
.role-admin .admin-students-v171 .student-name>div:last-child{
  min-width:0 !important;
}
.role-admin .admin-students-v171 .student-name b{
  display:block !important;
  max-width:170px !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  text-overflow:ellipsis !important;
  font-size:9.5px !important;
  line-height:1.25 !important;
}
.role-admin .admin-students-v171 .link-button{
  display:block !important;
  margin-top:2px !important;
  color:#2b6fdc !important;
  font-size:7.8px !important;
  line-height:1.1 !important;
}

/* compact secondary cells */
.role-admin .admin-students-v171 .table-main-text,
.role-admin .admin-students-v171 .student-table td>b{
  font-size:9px !important;
  line-height:1.2 !important;
}
.role-admin .admin-students-v171 .student-table .small{
  margin-top:2px !important;
  font-size:7.7px !important;
  line-height:1.15 !important;
}
.role-admin .admin-students-v171 .class-chip,
.role-admin .admin-students-v171 .username-chip,
.role-admin .admin-students-v171 .badge{
  min-height:24px !important;
  height:24px !important;
  padding:0 8px !important;
  display:inline-flex !important;
  align-items:center !important;
  border-radius:8px !important;
  font-size:7.8px !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

/* action buttons */
.role-admin .admin-students-v171 .row-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:5px !important;
  width:100% !important;
}
.role-admin .admin-students-v171 .row-actions form{
  display:inline-flex !important;
  margin:0 !important;
}
.role-admin .admin-students-v171 .icon-btn{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  max-width:30px !important;
  min-height:30px !important;
  max-height:30px !important;
  padding:0 !important;
  border-radius:9px !important;
  display:grid !important;
  place-items:center !important;
  font-size:12px !important;
  line-height:1 !important;
}

/* pagination */
.role-admin .admin-students-v171 .premium-pagination{
  min-height:58px !important;
  padding:12px 16px 14px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}
.role-admin .admin-students-v171 .page-btn{
  width:31px !important;
  height:31px !important;
  border-radius:9px !important;
}

/* make sure no generic student page image rule can affect admin student database */
.role-admin .admin-students-v171 img{
  max-width:100% !important;
  height:auto !important;
}
.role-admin .admin-students-v171 .student-table img{
  display:none !important;
}

@media(max-width:900px){
  .role-admin .admin-students-v171 .student-filter{
    grid-template-columns:1fr 1fr !important;
  }
  .role-admin .admin-students-v171 .student-filter .modern-search{
    grid-column:1/-1 !important;
  }
  .role-admin .admin-students-v171 .student-table table{
    min-width:980px !important;
  }
}


/* =========================================================
   KAIH v1.1.72 - PREMIUM DATA SISWA REFERENCE MATCH
   ========================================================= */
.role-admin .admin-students-v171{
  display:grid;
  gap:14px;
}

/* hero */
.role-admin .admin-students-v171 .edu-page-hero.student-page-hero{
  min-height:205px !important;
  border-radius:22px !important;
  background:
    radial-gradient(circle at 66% 48%,rgba(255,255,255,.62) 0 17%,transparent 18%),
    linear-gradient(135deg,#eef8ff 0%,#e6f3ff 48%,#d9ecff 100%) !important;
  border:1px solid #dbeaf8 !important;
  box-shadow:0 11px 28px rgba(39,74,118,.055) !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 470px !important;
}
.role-admin .admin-students-v171 .edu-page-copy{
  padding:26px 30px !important;
}
.role-admin .admin-students-v171 .edu-page-copy h1{
  font-size:34px !important;
}
.role-admin .admin-students-v171 .student-hero-actions{
  gap:8px !important;
  margin-top:16px !important;
}
.role-admin .admin-students-v171 .premium-file-action{
  min-height:48px !important;
  padding:7px 11px !important;
  border-radius:12px !important;
  background:#fff !important;
  border:1px solid #e0eaf5 !important;
  box-shadow:0 6px 14px rgba(42,77,119,.045) !important;
}
.role-admin .admin-students-v171 .template-action{background:linear-gradient(145deg,#f1fff7,#e7fbef) !important}
.role-admin .admin-students-v171 .import-action{background:linear-gradient(145deg,#f8f3ff,#f0e9ff) !important}
.role-admin .admin-students-v171 .student-add-action{
  min-height:48px !important;
  padding:0 17px !important;
  border-radius:12px !important;
  box-shadow:0 9px 18px rgba(47,110,232,.2) !important;
}

.role-admin .admin-students-v171 .student-art-v172{
  position:relative !important;
  min-height:205px !important;
  overflow:hidden !important;
}
.admin-student-hero-figure-v172{
  position:absolute;left:66px;bottom:0;width:150px;height:170px;
}
.admin-student-face-v172{
  position:absolute;left:43px;top:48px;width:66px;height:72px;border-radius:46% 46% 44% 44%;
  background:linear-gradient(180deg,#ffd7b8,#efa67e);z-index:3;
}
.admin-student-face-v172:before,.admin-student-face-v172:after{
  content:"";position:absolute;top:31px;width:7px;height:9px;border-radius:50%;background:#2f241f;
}
.admin-student-face-v172:before{left:17px}.admin-student-face-v172:after{right:17px}
.admin-student-cap-v172{
  position:absolute;left:23px;top:22px;width:110px;height:50px;background:#264c8e;clip-path:polygon(0 35%,50% 0,100% 35%,50% 66%);z-index:4;
}
.admin-student-cap-v172:after{
  content:"";position:absolute;right:17px;top:21px;width:3px;height:45px;background:#e3a519;border-radius:999px;
}
.admin-student-body-v172{
  position:absolute;left:20px;bottom:0;width:115px;height:76px;border-radius:45px 45px 10px 10px;background:linear-gradient(145deg,#5fb5ff,#2b73d5);
}
.admin-student-body-v172:before{
  content:"";position:absolute;left:38px;top:0;width:40px;height:49px;background:#fff;clip-path:polygon(0 0,100% 0,73% 100%,27% 100%);
}
.admin-student-tie-v172{
  position:absolute;left:70px;bottom:16px;width:13px;height:52px;background:#2c62c9;clip-path:polygon(50% 0,100% 18%,70% 100%,30% 100%,0 18%);
}
.admin-id-card-v172{
  position:absolute;left:205px;top:52px;width:122px;height:91px;border-radius:14px;background:rgba(255,255,255,.72);
  border:1px solid rgba(255,255,255,.95);box-shadow:0 8px 18px rgba(48,82,123,.08);transform:rotate(2deg);
}
.admin-id-avatar-v172{
  position:absolute;left:13px;top:17px;width:39px;height:39px;border-radius:11px;background:#dceaff;
}
.admin-id-avatar-v172:before{
  content:"";position:absolute;left:12px;top:7px;width:15px;height:15px;border-radius:50%;background:#70a7f3;
}
.admin-id-avatar-v172:after{
  content:"";position:absolute;left:7px;bottom:5px;width:25px;height:15px;border-radius:50% 50% 8px 8px;background:#70a7f3;
}
.admin-id-card-v172 i{
  position:absolute;right:14px;height:5px;border-radius:999px;background:#bfd4f3;
}
.admin-id-card-v172 i:nth-of-type(1){top:27px;width:43px}
.admin-id-card-v172 i:nth-of-type(2){top:42px;width:53px}
.admin-id-card-v172 i:nth-of-type(3){top:57px;width:35px}
.admin-hero-spark-v172{position:absolute;color:#397ff0;font-size:19px}
.admin-hero-spark-v172.one{left:205px;top:27px}
.admin-hero-spark-v172.two{left:246px;top:38px;color:#f2b416;font-size:24px}
.admin-hero-quote-v172{
  position:absolute;right:16px;top:35px;width:150px;min-height:116px;padding:15px 14px;border-radius:16px;
  background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.96);box-shadow:0 7px 17px rgba(46,77,118,.04);
}
.admin-hero-quote-v172>b{font-family:Georgia,serif;color:#3579e6;font-size:29px;line-height:1}
.admin-hero-quote-v172 p{margin:3px 0 0;color:#355879;font-size:8.5px;line-height:1.45;font-weight:750}
.admin-hero-quote-v172 i{position:absolute;left:16px;bottom:12px;width:42px;height:3px;border-radius:999px;background:#2f78e7}

/* 4 stats */
.role-admin .admin-stats-v172{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;
}
.role-admin .admin-stat-v172{
  min-height:92px;border:1px solid #e0e9f4;border-radius:17px;background:#fff;padding:13px 14px;
  box-shadow:0 8px 22px rgba(38,72,114,.05);display:flex;align-items:center;gap:11px;
}
.admin-stat-icon-v172{
  width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex:0 0 48px;position:relative;overflow:hidden;
}
.admin-stat-icon-v172:after{
  content:"";position:absolute;left:6px;top:4px;width:34px;height:16px;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,0));
}
.admin-stat-icon-v172 svg{width:28px;height:28px;position:relative;z-index:1;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.admin-stat-v172.blue .admin-stat-icon-v172{background:linear-gradient(145deg,#e7f3ff,#d0e7ff);color:#2f79e7}
.admin-stat-v172.green .admin-stat-icon-v172{background:linear-gradient(145deg,#e5f9ed,#c9efd9);color:#16a65f}
.admin-stat-v172.purple .admin-stat-icon-v172{background:linear-gradient(145deg,#f1e8ff,#ddcaff);color:#8b54df}
.admin-stat-v172 small{display:block;color:#8296ad;font-size:8.3px}
.admin-stat-v172 strong{display:block;margin-top:2px;color:#173f73;font-size:22px;line-height:1}
.admin-stat-v172 p{margin:5px 0 0;color:#8b9db2;font-size:7.5px}

/* filter card */
.role-admin .admin-student-database-v172{
  padding:0 !important;border-radius:20px !important;
}
.admin-filter-head-v172{
  min-height:72px;padding:13px 16px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.admin-filter-title-v172{display:flex;align-items:center;gap:10px}
.admin-filter-icon-v172{
  width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#e7f3ff,#d2e8ff);color:#2e78e7;
  box-shadow:0 6px 13px rgba(46,120,231,.1)
}
.admin-filter-icon-v172 svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.admin-filter-title-v172 h3{margin:0;color:#173f73;font-size:15px}
.admin-filter-title-v172 p{margin:4px 0 0;color:#8799af;font-size:8px}
.admin-reset-filter-v172{
  min-height:34px;padding:0 10px;border-radius:10px;background:#edf5ff;color:#2d70d7;text-decoration:none;display:inline-flex;align-items:center;gap:6px;
  font-size:8px;font-weight:850;border:1px solid #dce8f6
}
.admin-reset-filter-v172 svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.role-admin .admin-toolbar-v172{margin:0 15px 0 !important;padding:0 0 11px !important}
.role-admin .admin-students-v171 .student-filter{
  grid-template-columns:minmax(320px,1fr) 160px 160px 105px !important;
}
.admin-search-icon-v172 svg{width:16px;height:16px;fill:none;stroke:#6482a5;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.admin-apply-filter-v172{display:flex !important;align-items:center !important;justify-content:center !important;gap:6px !important}
.admin-apply-filter-v172 svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.admin-filter-meta-v172{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;color:#758ca7;font-size:8px}
.admin-page-size-v172{color:#8296ad}.admin-page-size-v172 b{display:inline-grid;place-items:center;min-width:31px;height:27px;margin:0 4px;border:1px solid #dce6f2;border-radius:8px;background:#fff;color:#294f7a}

/* table exact-like */
.role-admin .admin-table-v172 table{min-width:1080px !important}
.role-admin .admin-table-v172 th.check-col,.role-admin .admin-table-v172 td.check-col{width:34px !important;text-align:center !important}
.role-admin .admin-table-v172 th.no-col,.role-admin .admin-table-v172 td.no-col{width:38px !important;text-align:center !important}
.role-admin .admin-table-v172 th:nth-child(3){width:18% !important}
.role-admin .admin-table-v172 th:nth-child(4){width:13% !important}
.role-admin .admin-table-v172 th:nth-child(5){width:9% !important}
.role-admin .admin-table-v172 th:nth-child(6){width:17% !important}
.role-admin .admin-table-v172 th:nth-child(7){width:12% !important}
.role-admin .admin-table-v172 th:nth-child(8){width:9% !important}
.role-admin .admin-table-v172 th:nth-child(9){width:12% !important}
.role-admin .admin-table-v172 input[type="checkbox"]{width:14px;height:14px;accent-color:#2f73e7}
.role-admin .admin-table-v172 tbody tr,.role-admin .admin-table-v172 tbody td{height:63px !important;min-height:63px !important;max-height:63px !important}
.role-admin .admin-table-v172 .student-avatar-v171{width:38px !important;height:38px !important;min-width:38px !important;max-width:38px !important;min-height:38px !important;max-height:38px !important;border-radius:12px !important}
.role-admin .admin-table-v172 .student-avatar-v171 svg{width:34px !important;height:34px !important;max-width:34px !important;max-height:34px !important}
.row-number-v172{font-size:8.5px;color:#3e5d83}
.role-admin .admin-table-v172 .badge.ok{background:#e6f8ee !important;color:#148453 !important}
.status-dot-v172{width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:5px;display:inline-block}
.role-admin .admin-table-v172 .icon-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.view-action-v172,.edit-action-v172,.reset-action-v172{background:#f4f8ff !important;border-color:#deE9f7 !important;color:#2e73df !important}
.delete-action-v172{background:#fff5f6 !important;color:#e34e60 !important}

/* pagination */
.admin-pagination-v172 .page-arrow-v172{font-size:17px !important}

/* tips */
.admin-tip-v172{
  min-height:66px;padding:10px 13px;border-radius:16px;border:1px solid #dfe9f5;background:linear-gradient(135deg,#f7fbff,#f0f6ff);
  display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center
}
.admin-tip-icon-v172{width:39px;height:39px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#fff3c9,#ffdf83);color:#e99a17;box-shadow:0 6px 13px rgba(233,154,23,.1)}
.admin-tip-icon-v172 svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.admin-tip-v172 div{color:#37639a;font-size:8.3px}.admin-tip-v172 div b{color:#2368d4}.admin-tip-v172 small{display:block;margin-top:3px;color:#8498af;font-size:7.3px}
.admin-tip-v172>a{min-height:34px;padding:0 11px;border-radius:10px;background:#fff;border:1px solid #dbe7f4;color:#2c67bd;text-decoration:none;display:inline-flex;align-items:center;font-size:8px;font-weight:900}

/* responsive */
@media(max-width:1180px){
  .role-admin .admin-stats-v172{grid-template-columns:1fr 1fr}
  .role-admin .admin-students-v171 .edu-page-hero.student-page-hero{grid-template-columns:1fr 390px !important}
}
@media(max-width:820px){
  .role-admin .admin-students-v171 .edu-page-hero.student-page-hero{display:block !important}
  .role-admin .admin-students-v171 .student-art-v172{display:none !important}
  .role-admin .admin-stats-v172{grid-template-columns:1fr}
  .role-admin .admin-students-v171 .student-filter{grid-template-columns:1fr 1fr !important}
  .role-admin .admin-students-v171 .student-filter .modern-search{grid-column:1/-1 !important}
  .admin-filter-meta-v172{align-items:flex-start;flex-direction:column}
  .admin-tip-v172{grid-template-columns:39px 1fr}
  .admin-tip-v172>a{grid-column:1/-1;justify-content:center}
}


/* =========================================================
   KAIH v1.1.73 - DATA SISWA PROPORTION & TABLE REFINEMENT
   Match the approved reference more closely.
   ========================================================= */

/* Main page rhythm */
.role-admin .admin-students-v171{
  gap:12px !important;
}

/* Hero proportions */
.role-admin .admin-students-v171 .edu-page-hero.student-page-hero{
  min-height:188px !important;
  grid-template-columns:minmax(0,1fr) 430px !important;
}
.role-admin .admin-students-v171 .edu-page-copy{
  padding:24px 28px !important;
}
.role-admin .admin-students-v171 .edu-page-copy h1{
  font-size:31px !important;
}
.role-admin .admin-students-v171 .edu-page-copy p{
  max-width:560px !important;
  font-size:10.5px !important;
  line-height:1.5 !important;
}
.role-admin .admin-students-v171 .student-hero-actions{
  margin-top:14px !important;
}
.role-admin .admin-students-v171 .premium-file-action,
.role-admin .admin-students-v171 .student-add-action{
  min-height:44px !important;
}

/* hero artwork */
.role-admin .admin-students-v171 .student-art-v172{
  min-height:188px !important;
}
.admin-student-hero-figure-v172{
  left:44px !important;
  bottom:-1px !important;
  transform:scale(.92);
  transform-origin:bottom center;
}
.admin-id-card-v172{
  left:177px !important;
  top:51px !important;
  width:116px !important;
  height:86px !important;
}
.admin-hero-quote-v172{
  right:18px !important;
  top:33px !important;
  width:142px !important;
  min-height:108px !important;
  padding:13px !important;
}
.admin-hero-quote-v172 p{
  font-size:8px !important;
}

/* Stats more compact and closer to reference */
.role-admin .admin-stats-v172{
  gap:10px !important;
}
.role-admin .admin-stat-v172{
  min-height:82px !important;
  padding:11px 13px !important;
  gap:10px !important;
  border-radius:16px !important;
}
.admin-stat-icon-v172{
  width:44px !important;
  height:44px !important;
  flex-basis:44px !important;
  border-radius:13px !important;
}
.admin-stat-icon-v172 svg{
  width:25px !important;
  height:25px !important;
}
.admin-stat-v172 small{
  font-size:7.8px !important;
}
.admin-stat-v172 strong{
  font-size:20px !important;
}
.admin-stat-v172 p{
  margin-top:4px !important;
  font-size:7px !important;
}

/* Filter card */
.role-admin .admin-student-database-v172{
  border-radius:18px !important;
}
.admin-filter-head-v172{
  min-height:62px !important;
  padding:12px 14px 8px !important;
}
.admin-filter-icon-v172{
  width:35px !important;
  height:35px !important;
}
.admin-filter-title-v172 h3{
  font-size:13.5px !important;
}
.admin-filter-title-v172 p{
  font-size:7.5px !important;
}
.role-admin .admin-toolbar-v172{
  margin:0 14px !important;
  padding-bottom:10px !important;
}
.role-admin .admin-students-v171 .student-filter{
  grid-template-columns:minmax(310px,1fr) 150px 150px 100px !important;
  gap:8px !important;
}
.role-admin .admin-students-v171 .student-filter .modern-search,
.role-admin .admin-students-v171 .student-filter select,
.role-admin .admin-students-v171 .student-filter .btn{
  height:39px !important;
  min-height:39px !important;
}
.role-admin .admin-students-v171 .student-filter .modern-search input{
  height:37px !important;
  font-size:9.5px !important;
}
.role-admin .admin-students-v171 .student-filter select{
  font-size:8.5px !important;
}
.admin-filter-meta-v172{
  margin-top:8px !important;
  font-size:7.5px !important;
}

/* TABLE — explicit readable proportions */
.role-admin .admin-table-v172{
  overflow-x:auto !important;
}
.role-admin .admin-table-v172 table{
  width:100% !important;
  min-width:1040px !important;
  table-layout:auto !important;
  border-collapse:collapse !important;
}

/* reset percentage widths from earlier versions */
.role-admin .admin-table-v172 th,
.role-admin .admin-table-v172 td{
  width:auto !important;
}

.role-admin .admin-table-v172 th.check-col,
.role-admin .admin-table-v172 td.check-col{
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
}
.role-admin .admin-table-v172 th.no-col,
.role-admin .admin-table-v172 td.no-col{
  width:38px !important;
  min-width:38px !important;
  max-width:38px !important;
}
.role-admin .admin-table-v172 th:nth-child(3),
.role-admin .admin-table-v172 td:nth-child(3){
  min-width:180px !important;
}
.role-admin .admin-table-v172 th:nth-child(4),
.role-admin .admin-table-v172 td:nth-child(4){
  min-width:115px !important;
}
.role-admin .admin-table-v172 th:nth-child(5),
.role-admin .admin-table-v172 td:nth-child(5){
  min-width:90px !important;
}
.role-admin .admin-table-v172 th:nth-child(6),
.role-admin .admin-table-v172 td:nth-child(6){
  min-width:160px !important;
}
.role-admin .admin-table-v172 th:nth-child(7),
.role-admin .admin-table-v172 td:nth-child(7){
  min-width:120px !important;
}
.role-admin .admin-table-v172 th:nth-child(8),
.role-admin .admin-table-v172 td:nth-child(8){
  min-width:78px !important;
}
.role-admin .admin-table-v172 th:nth-child(9),
.role-admin .admin-table-v172 td:nth-child(9){
  min-width:145px !important;
}

.role-admin .admin-table-v172 thead th{
  height:40px !important;
  padding:9px 10px !important;
  font-size:7.8px !important;
  line-height:1.1 !important;
  letter-spacing:.025em !important;
  white-space:nowrap !important;
}

.role-admin .admin-table-v172 tbody tr,
.role-admin .admin-table-v172 tbody td{
  height:60px !important;
  min-height:60px !important;
  max-height:60px !important;
}
.role-admin .admin-table-v172 tbody td{
  padding:8px 10px !important;
  font-size:8.4px !important;
  white-space:nowrap !important;
}

/* Student name should be fully readable */
.role-admin .admin-table-v172 .student-name{
  gap:9px !important;
}
.role-admin .admin-table-v172 .student-avatar-v171{
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  max-width:36px !important;
  min-height:36px !important;
  max-height:36px !important;
}
.role-admin .admin-table-v172 .student-avatar-v171 svg{
  width:32px !important;
  height:32px !important;
  max-width:32px !important;
  max-height:32px !important;
}
.role-admin .admin-table-v172 .student-name b{
  max-width:none !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
  font-size:8.7px !important;
}
.role-admin .admin-table-v172 .link-button{
  font-size:7px !important;
  margin-top:1px !important;
}

/* Secondary info */
.role-admin .admin-table-v172 td>b,
.role-admin .admin-table-v172 .table-main-text{
  font-size:8.1px !important;
}
.role-admin .admin-table-v172 .small{
  font-size:6.8px !important;
  color:#7187a3 !important;
}
.role-admin .admin-table-v172 .class-chip,
.role-admin .admin-table-v172 .username-chip,
.role-admin .admin-table-v172 .badge{
  height:23px !important;
  min-height:23px !important;
  padding:0 7px !important;
  font-size:7px !important;
  border-radius:7px !important;
}

/* Actions closer to reference */
.role-admin .admin-table-v172 .row-actions{
  gap:4px !important;
}
.role-admin .admin-table-v172 .icon-btn{
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  max-width:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  border-radius:8px !important;
}
.role-admin .admin-table-v172 .icon-btn svg{
  width:13px !important;
  height:13px !important;
}

/* Pagination/footer */
.role-admin .admin-pagination-v172{
  min-height:52px !important;
  padding:9px 14px 11px !important;
}
.role-admin .admin-pagination-v172 .page-btn{
  width:29px !important;
  height:29px !important;
  font-size:8px !important;
}
.admin-tip-v172{
  min-height:58px !important;
  padding:8px 11px !important;
  border-radius:14px !important;
}
.admin-tip-icon-v172{
  width:35px !important;
  height:35px !important;
}
.admin-tip-v172 div{
  font-size:7.6px !important;
}
.admin-tip-v172 small{
  font-size:6.8px !important;
}

/* Keep page visually centered on wide desktop */
@media(min-width:1400px){
  .role-admin .admin-students-v171{
    max-width:1320px;
    margin:0 auto;
  }
}

@media(max-width:900px){
  .role-admin .admin-table-v172 table{
    min-width:1040px !important;
  }
}


/* =========================================================
   KAIH v1.1.74 - DATA SISWA EXACT REFERENCE MATCH
   Dedicated scope: .admin-students-reference-v174 only
   ========================================================= */

.role-admin .admin-students-reference-v174{
  max-width:1280px !important;
  margin:0 auto !important;
  gap:12px !important;
}

/* HERO */
.role-admin .admin-students-reference-v174 .edu-page-hero.student-page-hero{
  min-height:196px !important;
  grid-template-columns:minmax(0,1fr) 470px !important;
  border-radius:22px !important;
  border:1px solid #d9e9f8 !important;
  background:
    radial-gradient(circle at 66% 46%,rgba(255,255,255,.66) 0 17%,transparent 18%),
    linear-gradient(135deg,#eff8ff 0%,#e7f3ff 50%,#d9ecff 100%) !important;
  box-shadow:0 10px 26px rgba(39,74,118,.055) !important;
  overflow:hidden !important;
}
.role-admin .admin-students-reference-v174 .edu-page-copy{
  padding:25px 28px !important;
}
.role-admin .admin-students-reference-v174 .edu-page-copy .eyebrow{
  font-size:8.5px !important;
  letter-spacing:.11em !important;
  color:#6f88a7 !important;
}
.role-admin .admin-students-reference-v174 .edu-page-copy h1{
  margin-top:7px !important;
  font-size:33px !important;
  line-height:1.05 !important;
  color:#153f74 !important;
}
.role-admin .admin-students-reference-v174 .edu-page-copy p{
  max-width:560px !important;
  margin-top:7px !important;
  font-size:10px !important;
  line-height:1.5 !important;
  color:#6582a3 !important;
}
.role-admin .admin-students-reference-v174 .student-hero-actions{
  gap:8px !important;
  margin-top:15px !important;
}
.role-admin .admin-students-reference-v174 .premium-file-action{
  min-width:146px !important;
  min-height:47px !important;
  padding:7px 11px !important;
}
.role-admin .admin-students-reference-v174 .premium-file-action .action-icon{
  width:35px !important;
  height:35px !important;
  border-radius:10px !important;
}
.role-admin .admin-students-reference-v174 .student-add-action{
  min-width:146px !important;
  min-height:47px !important;
  border-radius:12px !important;
  font-size:9px !important;
}

/* Hero artwork positioning */
.role-admin .admin-students-reference-v174 .student-art-v172{
  min-height:196px !important;
}
.role-admin .admin-students-reference-v174 .admin-student-hero-figure-v172{
  left:42px !important;
  bottom:-2px !important;
  transform:scale(.94) !important;
}
.role-admin .admin-students-reference-v174 .admin-id-card-v172{
  left:185px !important;
  top:53px !important;
  width:116px !important;
  height:84px !important;
}
.role-admin .admin-students-reference-v174 .admin-hero-quote-v172{
  right:18px !important;
  top:34px !important;
  width:150px !important;
  min-height:112px !important;
  padding:14px !important;
}
.role-admin .admin-students-reference-v174 .admin-hero-quote-v172 p{
  font-size:8px !important;
  line-height:1.45 !important;
}

/* STATS */
.role-admin .admin-students-reference-v174 .admin-stats-v172{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
}
.role-admin .admin-students-reference-v174 .admin-stat-v172{
  min-height:88px !important;
  padding:12px 13px !important;
  border-radius:16px !important;
}
.role-admin .admin-students-reference-v174 .admin-stat-icon-v172{
  width:46px !important;
  height:46px !important;
  flex:0 0 46px !important;
  border-radius:13px !important;
}
.role-admin .admin-students-reference-v174 .admin-stat-icon-v172 svg{
  width:26px !important;
  height:26px !important;
}
.role-admin .admin-students-reference-v174 .admin-stat-v172 small{
  font-size:7.7px !important;
}
.role-admin .admin-students-reference-v174 .admin-stat-v172 strong{
  font-size:21px !important;
}
.role-admin .admin-students-reference-v174 .admin-stat-v172 p{
  font-size:7px !important;
}

/* FILTER CARD */
.role-admin .admin-students-reference-v174 .admin-student-database-v172{
  overflow:hidden !important;
  border-radius:18px !important;
  border:1px solid #dfe8f3 !important;
  box-shadow:0 9px 24px rgba(38,72,114,.05) !important;
}
.role-admin .admin-students-reference-v174 .admin-filter-head-v172{
  min-height:60px !important;
  padding:11px 14px 7px !important;
  position:relative !important;
}
.role-admin .admin-students-reference-v174 .admin-filter-count-v174{
  position:absolute !important;
  right:14px !important;
  top:12px !important;
  min-height:28px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  background:#edf5ff !important;
  color:#2468d5 !important;
  display:inline-flex !important;
  align-items:center !important;
  font-size:7.5px !important;
  font-weight:900 !important;
}
.role-admin .admin-students-reference-v174 .admin-filter-title-v172 h3{
  font-size:13.5px !important;
}
.role-admin .admin-students-reference-v174 .admin-filter-title-v172 p{
  font-size:7.5px !important;
}
.role-admin .admin-students-reference-v174 .admin-reset-filter-v172{
  margin-right:74px !important;
}
.role-admin .admin-students-reference-v174 .student-toolbar{
  margin:0 14px !important;
}
.role-admin .admin-students-reference-v174 .student-filter{
  grid-template-columns:minmax(320px,1fr) 150px 150px 100px !important;
  gap:8px !important;
}
.role-admin .admin-students-reference-v174 .modern-search,
.role-admin .admin-students-reference-v174 .student-filter select,
.role-admin .admin-students-reference-v174 .student-filter .btn{
  height:39px !important;
  min-height:39px !important;
  border-radius:10px !important;
}
.role-admin .admin-students-reference-v174 .modern-search input{
  font-size:9px !important;
}
.role-admin .admin-students-reference-v174 .student-filter select{
  font-size:8px !important;
}
.role-admin .admin-students-reference-v174 .admin-filter-meta-v172{
  padding-bottom:2px !important;
}

/* TABLE */
.role-admin .admin-students-reference-v174 .admin-table-v172 table{
  min-width:1020px !important;
  table-layout:fixed !important;
}
.role-admin .admin-students-reference-v174 .admin-table-v172 th,
.role-admin .admin-students-reference-v174 .admin-table-v172 td{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.role-admin .admin-students-reference-v174 .admin-table-v172 thead th{
  height:38px !important;
  padding:8px 9px !important;
  font-size:7.4px !important;
  background:#f8fbff !important;
}
.role-admin .admin-students-reference-v174 .admin-table-v172 tbody tr,
.role-admin .admin-students-reference-v174 .admin-table-v172 tbody td{
  height:58px !important;
  min-height:58px !important;
  max-height:58px !important;
}
.role-admin .admin-students-reference-v174 .admin-table-v172 tbody td{
  padding:7px 9px !important;
  font-size:8px !important;
}

/* Exact column balance */
.role-admin .admin-students-reference-v174 .admin-table-v172 th.check-col,
.role-admin .admin-students-reference-v174 .admin-table-v172 td.check-col{width:32px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th.no-col,
.role-admin .admin-students-reference-v174 .admin-table-v172 td.no-col{width:36px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th:nth-child(3),
.role-admin .admin-students-reference-v174 .admin-table-v172 td:nth-child(3){width:170px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th:nth-child(4),
.role-admin .admin-students-reference-v174 .admin-table-v172 td:nth-child(4){width:115px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th:nth-child(5),
.role-admin .admin-students-reference-v174 .admin-table-v172 td:nth-child(5){width:88px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th:nth-child(6),
.role-admin .admin-students-reference-v174 .admin-table-v172 td:nth-child(6){width:150px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th:nth-child(7),
.role-admin .admin-students-reference-v174 .admin-table-v172 td:nth-child(7){width:112px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th:nth-child(8),
.role-admin .admin-students-reference-v174 .admin-table-v172 td:nth-child(8){width:82px !important}
.role-admin .admin-students-reference-v174 .admin-table-v172 th:nth-child(9),
.role-admin .admin-students-reference-v174 .admin-table-v172 td:nth-child(9){width:136px !important}

/* Student cell */
.role-admin .admin-students-reference-v174 .student-name{
  gap:8px !important;
}
.role-admin .admin-students-reference-v174 .student-avatar-v171{
  width:35px !important;
  height:35px !important;
  min-width:35px !important;
  max-width:35px !important;
  min-height:35px !important;
  max-height:35px !important;
}
.role-admin .admin-students-reference-v174 .student-avatar-v171 svg{
  width:31px !important;
  height:31px !important;
}
.role-admin .admin-students-reference-v174 .student-name b{
  font-size:8.4px !important;
}
.role-admin .admin-students-reference-v174 .link-button{
  font-size:6.8px !important;
}
.role-admin .admin-students-reference-v174 .small{
  font-size:6.7px !important;
}
.role-admin .admin-students-reference-v174 .class-chip,
.role-admin .admin-students-reference-v174 .username-chip,
.role-admin .admin-students-reference-v174 .badge{
  height:22px !important;
  min-height:22px !important;
  font-size:6.9px !important;
}

/* Action icons */
.role-admin .admin-students-reference-v174 .row-actions{
  gap:4px !important;
}
.role-admin .admin-students-reference-v174 .icon-btn{
  width:27px !important;
  height:27px !important;
  min-width:27px !important;
  max-width:27px !important;
  min-height:27px !important;
  max-height:27px !important;
}

/* footer */
.role-admin .admin-students-reference-v174 .admin-pagination-v172{
  min-height:50px !important;
  padding:8px 13px 10px !important;
}
.role-admin .admin-students-reference-v174 .page-btn{
  width:28px !important;
  height:28px !important;
}
.role-admin .admin-students-reference-v174 + .admin-tip-v172,
.role-admin .admin-students-reference-v174 .admin-tip-v172{
  min-height:56px !important;
}

/* desktop reference scale */
@media(min-width:1200px){
  .role-admin .admin-students-reference-v174{
    zoom:1;
  }
}

@media(max-width:1180px){
  .role-admin .admin-students-reference-v174 .edu-page-hero.student-page-hero{
    grid-template-columns:1fr 400px !important;
  }
}

@media(max-width:820px){
  .role-admin .admin-students-reference-v174{
    max-width:none !important;
  }
  .role-admin .admin-students-reference-v174 .edu-page-hero.student-page-hero{
    display:block !important;
  }
  .role-admin .admin-students-reference-v174 .student-art-v172{
    display:none !important;
  }
  .role-admin .admin-students-reference-v174 .admin-stats-v172{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   KAIH v1.1.75 - DATA SISWA HERO REFINEMENT
   Fix overlap / spacing / illustration balance
   ========================================================= */

.role-admin .admin-students-reference-v174 .edu-page-hero.student-page-hero{
  min-height:184px !important;
  grid-template-columns:minmax(0,1.08fr) 500px !important;
  background:
    radial-gradient(circle at 68% 48%,rgba(255,255,255,.60) 0 16%,transparent 17%),
    linear-gradient(135deg,#eef8ff 0%,#e8f4ff 48%,#dceeff 100%) !important;
}

.role-admin .admin-students-reference-v174 .edu-page-copy{
  padding:25px 28px 24px !important;
}

.role-admin .admin-students-reference-v174 .student-art-v172{
  min-height:184px !important;
  position:relative !important;
}

/* Main student character — centered and slightly more premium */
.role-admin .admin-students-reference-v174 .admin-student-hero-figure-v172{
  left:55px !important;
  bottom:-2px !important;
  width:165px !important;
  height:176px !important;
  transform:scale(.96) !important;
  transform-origin:bottom center !important;
}

.role-admin .admin-students-reference-v174 .admin-student-face-v172{
  left:49px !important;
  top:47px !important;
  width:68px !important;
  height:73px !important;
  border-radius:46% 46% 44% 44% !important;
  background:linear-gradient(180deg,#ffd8b8,#efaa80) !important;
  box-shadow:inset 0 -7px 10px rgba(208,116,70,.08) !important;
}

.role-admin .admin-students-reference-v174 .admin-student-cap-v172{
  left:25px !important;
  top:18px !important;
  width:116px !important;
  height:53px !important;
  background:linear-gradient(145deg,#315ea8,#173a72) !important;
  filter:drop-shadow(0 5px 7px rgba(27,57,107,.16)) !important;
}

.role-admin .admin-students-reference-v174 .admin-student-body-v172{
  left:22px !important;
  width:121px !important;
  height:78px !important;
  background:linear-gradient(145deg,#62b7ff,#2e78db) !important;
  box-shadow:0 9px 18px rgba(43,111,207,.16) !important;
}

/* ID card moved left of quote, never overlaps */
.role-admin .admin-students-reference-v174 .admin-id-card-v172{
  left:210px !important;
  top:55px !important;
  width:112px !important;
  height:82px !important;
  transform:rotate(-2deg) !important;
  z-index:2 !important;
  background:rgba(255,255,255,.82) !important;
  border:1px solid rgba(255,255,255,.98) !important;
  box-shadow:0 8px 18px rgba(45,79,120,.08) !important;
}

/* Quote placed cleanly at far right */
.role-admin .admin-students-reference-v174 .admin-hero-quote-v172{
  right:20px !important;
  left:auto !important;
  top:39px !important;
  width:160px !important;
  min-height:108px !important;
  padding:15px 15px 16px !important;
  z-index:4 !important;
  background:rgba(255,255,255,.80) !important;
  border:1px solid rgba(255,255,255,.98) !important;
  box-shadow:0 9px 20px rgba(42,75,117,.06) !important;
  backdrop-filter:blur(5px) !important;
}

.role-admin .admin-students-reference-v174 .admin-hero-quote-v172>b{
  display:block !important;
  font-size:25px !important;
  height:17px !important;
  color:#2f76e7 !important;
}

.role-admin .admin-students-reference-v174 .admin-hero-quote-v172 p{
  margin-top:6px !important;
  font-size:7.8px !important;
  line-height:1.48 !important;
  color:#315578 !important;
}

.role-admin .admin-students-reference-v174 .admin-hero-quote-v172 i{
  width:38px !important;
  bottom:11px !important;
}

/* Decorative sparkles better placed */
.role-admin .admin-students-reference-v174 .admin-hero-spark-v172.one{
  left:203px !important;
  top:33px !important;
  font-size:17px !important;
}
.role-admin .admin-students-reference-v174 .admin-hero-spark-v172.two{
  left:340px !important;
  top:28px !important;
  font-size:21px !important;
}

/* Make action buttons less oversized */
.role-admin .admin-students-reference-v174 .premium-file-action{
  min-width:138px !important;
  min-height:45px !important;
}
.role-admin .admin-students-reference-v174 .student-add-action{
  min-width:142px !important;
  min-height:45px !important;
}

/* Keep copy visually balanced */
.role-admin .admin-students-reference-v174 .edu-page-copy h1{
  font-size:31px !important;
}
.role-admin .admin-students-reference-v174 .edu-page-copy p{
  max-width:535px !important;
}

@media(max-width:1180px){
  .role-admin .admin-students-reference-v174 .edu-page-hero.student-page-hero{
    grid-template-columns:1fr 420px !important;
  }
  .role-admin .admin-students-reference-v174 .admin-hero-quote-v172{
    width:145px !important;
  }
  .role-admin .admin-students-reference-v174 .admin-id-card-v172{
    left:176px !important;
  }
  .role-admin .admin-students-reference-v174 .admin-hero-spark-v172.two{
    left:286px !important;
  }
}


/* =========================================================
   KAIH v1.1.76 - DATA SISWA HERO EXACT MATCH
   Target: latest approved reference only
   ========================================================= */

.role-admin .admin-students-hero-v176 .edu-page-hero.student-page-hero{
  min-height:190px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.03fr) 475px !important;
  align-items:center !important;
  border-radius:20px !important;
  overflow:hidden !important;
  border:1px solid #d9e9f8 !important;
  background:
    radial-gradient(circle at 66% 48%,rgba(255,255,255,.58) 0 18%,transparent 19%),
    linear-gradient(135deg,#edf8ff 0%,#e6f3ff 48%,#d9ecff 100%) !important;
  box-shadow:0 10px 27px rgba(43,78,120,.055) !important;
}

/* LEFT COPY */
.role-admin .admin-students-hero-v176 .edu-page-copy{
  padding:24px 26px 22px !important;
}
.role-admin .admin-students-hero-v176 .edu-page-copy .eyebrow{
  display:block !important;
  margin:0 !important;
  color:#6f87a5 !important;
  font-size:8px !important;
  font-weight:900 !important;
  letter-spacing:.11em !important;
}
.role-admin .admin-students-hero-v176 .edu-page-copy h1{
  margin:7px 0 0 !important;
  color:#143d73 !important;
  font-size:32px !important;
  line-height:1.04 !important;
  letter-spacing:-.035em !important;
}
.role-admin .admin-students-hero-v176 .edu-page-copy p{
  margin:8px 0 0 !important;
  max-width:560px !important;
  color:#6583a5 !important;
  font-size:10px !important;
  line-height:1.5 !important;
}
.role-admin .admin-students-hero-v176 .student-hero-actions{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin-top:15px !important;
}

/* BUTTONS EXACT PROPORTION */
.role-admin .admin-students-hero-v176 .premium-file-action{
  min-width:126px !important;
  min-height:43px !important;
  height:43px !important;
  padding:6px 10px !important;
  border-radius:11px !important;
  box-shadow:0 5px 13px rgba(38,72,114,.045) !important;
}
.role-admin .admin-students-hero-v176 .template-action{
  background:linear-gradient(145deg,#effff7,#e4faed) !important;
}
.role-admin .admin-students-hero-v176 .import-action{
  background:linear-gradient(145deg,#fbf6ff,#f1e9ff) !important;
}
.role-admin .admin-students-hero-v176 .premium-file-action .action-icon{
  width:31px !important;
  height:31px !important;
  min-width:31px !important;
  max-width:31px !important;
  border-radius:9px !important;
}
.role-admin .admin-students-hero-v176 .premium-file-action strong{
  font-size:8.7px !important;
  line-height:1.15 !important;
}
.role-admin .admin-students-hero-v176 .premium-file-action small{
  font-size:6.8px !important;
  line-height:1.15 !important;
}
.role-admin .admin-students-hero-v176 .student-add-action{
  min-width:132px !important;
  min-height:43px !important;
  height:43px !important;
  padding:0 14px !important;
  border-radius:11px !important;
  font-size:8.5px !important;
  box-shadow:0 8px 17px rgba(47,110,232,.19) !important;
}

/* RIGHT ART AREA */
.role-admin .admin-students-hero-v176 .student-art-v172{
  position:relative !important;
  min-height:190px !important;
  height:190px !important;
  overflow:hidden !important;
}

/* Strong white spotlight exactly behind the character */
.role-admin .admin-students-hero-v176 .student-art-v172:before{
  content:"" !important;
  position:absolute !important;
  left:42px !important;
  top:10px !important;
  width:250px !important;
  height:170px !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.56) !important;
  filter:blur(1px) !important;
  display:block !important;
}

/* Character */
.role-admin .admin-students-hero-v176 .admin-student-hero-figure-v172{
  left:62px !important;
  bottom:-2px !important;
  width:155px !important;
  height:170px !important;
  transform:scale(.95) !important;
  transform-origin:bottom center !important;
  z-index:3 !important;
}
.role-admin .admin-students-hero-v176 .admin-student-cap-v172{
  left:24px !important;
  top:18px !important;
  width:112px !important;
  height:51px !important;
  background:linear-gradient(145deg,#315da6,#1b3d75) !important;
  filter:drop-shadow(0 4px 6px rgba(27,57,107,.15)) !important;
}
.role-admin .admin-students-hero-v176 .admin-student-face-v172{
  left:46px !important;
  top:48px !important;
  width:65px !important;
  height:70px !important;
}
.role-admin .admin-students-hero-v176 .admin-student-body-v172{
  left:21px !important;
  width:115px !important;
  height:75px !important;
  background:linear-gradient(145deg,#62b7ff,#2f78db) !important;
  box-shadow:0 8px 17px rgba(43,111,207,.15) !important;
}
.role-admin .admin-students-hero-v176 .admin-student-tie-v172{
  left:67px !important;
  bottom:15px !important;
}

/* ID card directly beside student */
.role-admin .admin-students-hero-v176 .admin-id-card-v172{
  left:196px !important;
  top:53px !important;
  width:118px !important;
  height:88px !important;
  border-radius:13px !important;
  transform:rotate(1deg) !important;
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(255,255,255,.98) !important;
  box-shadow:0 8px 18px rgba(47,79,120,.07) !important;
  z-index:2 !important;
}
.role-admin .admin-students-hero-v176 .admin-id-avatar-v172{
  width:37px !important;
  height:37px !important;
  left:13px !important;
  top:18px !important;
}
.role-admin .admin-students-hero-v176 .admin-id-card-v172 i:nth-of-type(1){top:27px !important;width:39px !important}
.role-admin .admin-students-hero-v176 .admin-id-card-v172 i:nth-of-type(2){top:42px !important;width:48px !important}
.role-admin .admin-students-hero-v176 .admin-id-card-v172 i:nth-of-type(3){top:57px !important;width:33px !important}

/* Sparkles */
.role-admin .admin-students-hero-v176 .admin-hero-spark-v172.one{
  left:182px !important;
  top:22px !important;
  font-size:16px !important;
  color:#3a7fe9 !important;
  z-index:4 !important;
}
.role-admin .admin-students-hero-v176 .admin-hero-spark-v172.two{
  left:227px !important;
  top:29px !important;
  font-size:21px !important;
  color:#f3b316 !important;
  z-index:4 !important;
}

/* Quote card flush-right like reference */
.role-admin .admin-students-hero-v176 .admin-hero-quote-v172{
  top:31px !important;
  right:17px !important;
  left:auto !important;
  width:160px !important;
  min-height:117px !important;
  padding:14px 15px 15px !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.74) !important;
  border:1px solid rgba(255,255,255,.98) !important;
  box-shadow:0 8px 18px rgba(42,75,117,.05) !important;
  backdrop-filter:blur(4px) !important;
  z-index:5 !important;
}
.role-admin .admin-students-hero-v176 .admin-hero-quote-v172>b{
  display:block !important;
  height:17px !important;
  font-size:25px !important;
  color:#3278e8 !important;
}
.role-admin .admin-students-hero-v176 .admin-hero-quote-v172 p{
  margin:5px 0 0 !important;
  color:#315578 !important;
  font-size:7.8px !important;
  line-height:1.48 !important;
  font-weight:760 !important;
}
.role-admin .admin-students-hero-v176 .admin-hero-quote-v172 i{
  left:15px !important;
  bottom:11px !important;
  width:41px !important;
  height:3px !important;
  border-radius:999px !important;
}

/* Prevent all previous hero rules from re-expanding on desktop */
@media(min-width:1181px){
  .role-admin .admin-students-hero-v176 .edu-page-hero.student-page-hero{
    grid-template-columns:minmax(0,1.03fr) 475px !important;
  }
}

/* Tablet */
@media(max-width:1180px){
  .role-admin .admin-students-hero-v176 .edu-page-hero.student-page-hero{
    grid-template-columns:1fr 405px !important;
  }
  .role-admin .admin-students-hero-v176 .admin-student-hero-figure-v172{
    left:30px !important;
  }
  .role-admin .admin-students-hero-v176 .admin-id-card-v172{
    left:160px !important;
  }
  .role-admin .admin-students-hero-v176 .admin-hero-quote-v172{
    width:145px !important;
  }
}

/* Mobile: art hidden, copy remains compact */
@media(max-width:820px){
  .role-admin .admin-students-hero-v176 .edu-page-hero.student-page-hero{
    display:block !important;
    min-height:auto !important;
  }
  .role-admin .admin-students-hero-v176 .student-art-v172{
    display:none !important;
  }
  .role-admin .admin-students-hero-v176 .student-hero-actions{
    flex-wrap:wrap !important;
  }
}


/* =========================================================
   KAIH v1.1.77 - HERO ILLUSTRATION REBUILD
   Real inline SVG illustration; no more CSS-built student.
   ========================================================= */

.role-admin .admin-students-hero-v177 .edu-page-hero.student-page-hero{
  min-height:188px !important;
  grid-template-columns:minmax(0,1fr) 520px !important;
  align-items:center !important;
}

.role-admin .admin-students-hero-v177 .student-art-v177{
  position:relative !important;
  height:188px !important;
  min-height:188px !important;
  overflow:hidden !important;
  display:block !important;
}

.role-admin .admin-students-hero-v177 .student-art-v177:before,
.role-admin .admin-students-hero-v177 .student-art-v177:after{
  content:none !important;
  display:none !important;
}

.role-admin .admin-students-hero-v177 .student-hero-svg-v177{
  position:absolute !important;
  left:4px !important;
  top:0 !important;
  width:420px !important;
  height:188px !important;
  display:block !important;
  overflow:visible !important;
}

/* Hide legacy CSS-drawn art if stale rules still exist */
.role-admin .admin-students-hero-v177 .admin-student-hero-figure-v172,
.role-admin .admin-students-hero-v177 .admin-id-card-v172,
.role-admin .admin-students-hero-v177 .admin-hero-spark-v172{
  display:none !important;
}

.role-admin .admin-students-hero-v177 .admin-hero-quote-v177{
  position:absolute !important;
  right:18px !important;
  top:30px !important;
  width:168px !important;
  min-height:120px !important;
  padding:15px 15px 16px !important;
  border-radius:16px !important;
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(255,255,255,.98) !important;
  box-shadow:0 9px 20px rgba(42,75,117,.055) !important;
  backdrop-filter:blur(6px) !important;
  z-index:4 !important;
}

.role-admin .admin-students-hero-v177 .admin-hero-quote-v177>b{
  display:block !important;
  height:19px !important;
  font-family:Georgia,serif !important;
  font-size:28px !important;
  line-height:1 !important;
  color:#3278E8 !important;
}

.role-admin .admin-students-hero-v177 .admin-hero-quote-v177 p{
  margin:6px 0 0 !important;
  color:#315578 !important;
  font-size:8.2px !important;
  line-height:1.5 !important;
  font-weight:760 !important;
}

.role-admin .admin-students-hero-v177 .admin-hero-quote-v177 i{
  position:absolute !important;
  left:15px !important;
  bottom:12px !important;
  width:42px !important;
  height:3px !important;
  border-radius:999px !important;
  background:#2F78E7 !important;
}

/* left side refined */
.role-admin .admin-students-hero-v177 .edu-page-copy{
  padding:24px 28px !important;
}
.role-admin .admin-students-hero-v177 .edu-page-copy h1{
  font-size:32px !important;
}
.role-admin .admin-students-hero-v177 .edu-page-copy p{
  max-width:560px !important;
}
.role-admin .admin-students-hero-v177 .student-hero-actions{
  margin-top:14px !important;
}

/* exact compact buttons */
.role-admin .admin-students-hero-v177 .premium-file-action{
  min-width:128px !important;
  height:43px !important;
  min-height:43px !important;
}
.role-admin .admin-students-hero-v177 .student-add-action{
  min-width:132px !important;
  height:43px !important;
  min-height:43px !important;
}

@media(max-width:1180px){
  .role-admin .admin-students-hero-v177 .edu-page-hero.student-page-hero{
    grid-template-columns:1fr 440px !important;
  }
  .role-admin .admin-students-hero-v177 .student-hero-svg-v177{
    width:360px !important;
  }
  .role-admin .admin-students-hero-v177 .admin-hero-quote-v177{
    width:150px !important;
  }
}

@media(max-width:820px){
  .role-admin .admin-students-hero-v177 .edu-page-hero.student-page-hero{
    display:block !important;
    min-height:auto !important;
  }
  .role-admin .admin-students-hero-v177 .student-art-v177{
    display:none !important;
  }
}


/* =========================================================
   KAIH v1.1.78 - RASTER HERO EXACT MATCH
   Uses approved generated hero artwork as image, not SVG.
   Functional buttons remain real clickable elements.
   ========================================================= */

.role-admin .admin-students-hero-v178 .admin-student-hero-image-v178{
  position:relative !important;
  width:100% !important;
  overflow:hidden !important;
  border-radius:20px !important;
  box-shadow:0 10px 28px rgba(43,78,120,.06) !important;
  background:#eaf5ff !important;
}

.role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
  display:block !important;
  width:100% !important;
  height:auto !important;
  border-radius:20px !important;
  object-fit:contain !important;
}

/* Clickable overlays precisely align to the visible buttons in the artwork */
.role-admin .admin-students-hero-v178 .admin-student-hero-hotspots-v178{
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  z-index:5 !important;
}

.role-admin .admin-students-hero-v178 .hero-hotspot-v178{
  position:absolute !important;
  top:62.5% !important;
  height:17.5% !important;
  border:0 !important;
  border-radius:12px !important;
  background:transparent !important;
  box-shadow:none !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  color:transparent !important;
  font-size:0 !important;
  text-decoration:none !important;
  padding:0 !important;
  outline:none !important;
}

.role-admin .admin-students-hero-v178 .hero-hotspot-v178.template{
  left:5.0% !important;
  width:14.7% !important;
}
.role-admin .admin-students-hero-v178 .hero-hotspot-v178.import{
  left:20.4% !important;
  width:14.8% !important;
}
.role-admin .admin-students-hero-v178 .hero-hotspot-v178.add{
  left:35.8% !important;
  width:15.0% !important;
}

/* Tiny focus ring only when keyboard navigating */
.role-admin .admin-students-hero-v178 .hero-hotspot-v178:focus-visible{
  box-shadow:0 0 0 3px rgba(47,112,231,.35) !important;
}

/* Prevent all legacy hero rules from affecting this raster hero */
.role-admin .admin-students-hero-v178 .edu-page-hero,
.role-admin .admin-students-hero-v178 .student-art-v172,
.role-admin .admin-students-hero-v178 .student-art-v177,
.role-admin .admin-students-hero-v178 .edu-page-copy,
.role-admin .admin-students-hero-v178 .student-hero-actions{
  display:none !important;
}

/* Desktop height closer to the approved mockup */
@media(min-width:1181px){
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-v178{
    max-height:320px !important;
  }
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    max-height:320px !important;
    object-fit:cover !important;
    object-position:center !important;
  }
}

/* Tablet: keep the same artwork */
@media(max-width:1180px){
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-v178{
    border-radius:18px !important;
  }
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    border-radius:18px !important;
  }
}

/* Mobile: artwork remains readable; actions become visible real buttons below */
@media(max-width:700px){
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-v178{
    overflow:visible !important;
    background:transparent !important;
    box-shadow:none !important;
  }
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    border-radius:16px !important;
    box-shadow:0 8px 22px rgba(43,78,120,.06) !important;
  }

  .role-admin .admin-students-hero-v178 .admin-student-hero-hotspots-v178{
    position:static !important;
    margin-top:10px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178{
    position:static !important;
    width:auto !important;
    height:40px !important;
    min-height:40px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:9px !important;
    font-weight:900 !important;
    color:#2b67c6 !important;
    background:#fff !important;
    border:1px solid #dce7f4 !important;
    border-radius:10px !important;
  }
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.add{
    grid-column:1/-1 !important;
    color:#fff !important;
    background:#2f70e7 !important;
    border-color:#2f70e7 !important;
  }
}


/* =========================================================
   KAIH v1.1.79 - DATA SISWA READABILITY
   Fewer rows, larger text, roomier table
   ========================================================= */

.role-admin .admin-students-hero-v178 .admin-table-v172 thead th{
  height:42px !important;
  padding:10px 11px !important;
  font-size:8.3px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 tbody tr,
.role-admin .admin-students-hero-v178 .admin-table-v172 tbody td{
  height:68px !important;
  min-height:68px !important;
  max-height:68px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 tbody td{
  padding:9px 11px !important;
  font-size:9px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .student-avatar-v171{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  max-width:40px !important;
  min-height:40px !important;
  max-height:40px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .student-avatar-v171 svg{
  width:36px !important;
  height:36px !important;
  max-width:36px !important;
  max-height:36px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .student-name b{
  font-size:9.4px !important;
  line-height:1.28 !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .link-button{
  font-size:7.4px !important;
  margin-top:2px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 td>b,
.role-admin .admin-students-hero-v178 .admin-table-v172 .table-main-text{
  font-size:8.8px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .small{
  font-size:7.4px !important;
  line-height:1.2 !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .class-chip,
.role-admin .admin-students-hero-v178 .admin-table-v172 .username-chip,
.role-admin .admin-students-hero-v178 .admin-table-v172 .badge{
  height:24px !important;
  min-height:24px !important;
  padding:0 8px !important;
  font-size:7.6px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .icon-btn{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  max-width:30px !important;
  min-height:30px !important;
  max-height:30px !important;
}

.role-admin .admin-students-hero-v178 .admin-table-v172 .icon-btn svg{
  width:14px !important;
  height:14px !important;
}

.role-admin .admin-students-hero-v178 .admin-filter-meta-v172{
  font-size:8px !important;
}

.role-admin .admin-students-hero-v178 .admin-page-size-v172 b{
  min-width:34px !important;
  height:29px !important;
  font-size:8px !important;
}

.role-admin .admin-students-hero-v178 .admin-pagination-v172{
  min-height:54px !important;
  padding:10px 14px 12px !important;
}

@media(max-width:900px){
  .role-admin .admin-students-hero-v178 .admin-table-v172 table{
    min-width:1080px !important;
  }
}


/* =========================================================
   KAIH v1.1.80 - PREMIUM STUDENT DETAIL MODAL
   ========================================================= */

.role-admin #detailModal .modal-backdrop{
  background:rgba(29,47,72,.46) !important;
  backdrop-filter:blur(5px) !important;
}

.role-admin #detailModal .student-detail-modal-v180{
  width:min(720px,calc(100vw - 30px)) !important;
  max-width:720px !important;
  max-height:calc(100vh - 30px) !important;
  overflow:auto !important;
  padding:0 !important;
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,.8) !important;
  background:#fff !important;
  box-shadow:0 28px 70px rgba(24,45,73,.24) !important;
}

.student-detail-close-v180{
  position:absolute !important;
  top:15px !important;
  right:15px !important;
  width:40px !important;
  height:40px !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.88) !important;
  border:1px solid rgba(220,230,243,.85) !important;
  color:#607893 !important;
  z-index:4 !important;
  box-shadow:0 6px 15px rgba(35,67,107,.06) !important;
}

.student-detail-hero-v180{
  min-height:150px;
  padding:22px 24px;
  display:flex;
  align-items:center;
  gap:17px;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 5%,rgba(255,255,255,.58) 0 20%,transparent 21%),
    linear-gradient(135deg,#edf7ff 0%,#e4f1ff 58%,#ddeaff 100%);
  border-bottom:1px solid #dfe9f4;
}
.student-detail-hero-v180:after{
  content:"";
  position:absolute;
  width:190px;
  height:95px;
  right:-40px;
  bottom:-60px;
  border-radius:50%;
  background:rgba(255,255,255,.28);
}

.student-detail-avatar-v180{
  width:88px;
  height:88px;
  border-radius:22px;
  display:grid;
  place-items:center;
  flex:0 0 88px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(255,255,255,.96);
  box-shadow:0 10px 24px rgba(45,82,132,.11);
  position:relative;
  z-index:2;
}
.student-detail-avatar-v180 svg{
  width:76px;
  height:76px;
  display:block;
}

.student-detail-title-v180{
  position:relative;
  z-index:2;
  min-width:0;
}
.student-detail-eyebrow-v180{
  display:block;
  color:#7188a5;
  font-size:8px;
  font-weight:900;
  letter-spacing:.11em;
}
.student-detail-title-v180 h3{
  margin:6px 0 0;
  color:#153f75;
  font-size:24px;
  letter-spacing:-.025em;
  line-height:1.1;
}
.student-detail-badges-v180{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin-top:10px;
}
.student-detail-badge-v180{
  min-height:26px;
  padding:0 9px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  font-size:8px;
  font-weight:900;
}
.student-detail-badge-v180.class{
  background:#e8f1ff;
  color:#2d6fd7;
}
.student-detail-badge-v180.status{
  background:#e5f8ed;
  color:#168352;
}
.student-detail-badge-v180.status:before{
  content:"";
  width:6px;height:6px;border-radius:50%;
  background:currentColor;
  margin-right:5px;
}
.student-detail-badge-v180.status.off{
  background:#fff1f2;
  color:#d84e5f;
}

.student-detail-body-v180{
  padding:19px 22px 20px;
}
.student-detail-section-title-v180{
  display:flex;
  align-items:center;
  gap:9px;
}
.student-detail-section-title-v180>span{
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  background:linear-gradient(145deg,#e8f2ff,#d4e7ff);
  color:#2e73df;
}
.student-detail-section-title-v180>span.parent{
  background:linear-gradient(145deg,#fff3dc,#ffe2aa);
  color:#e79516;
}
.student-detail-section-title-v180 svg{
  width:18px;height:18px;
  fill:none;stroke:currentColor;
  stroke-width:1.85;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.student-detail-section-title-v180 b{
  display:block;
  color:#244b77;
  font-size:10px;
}
.student-detail-section-title-v180 small{
  display:block;
  color:#8a9cb1;
  font-size:7.7px;
  margin-top:2px;
}

.student-detail-grid-v180{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:12px;
}
.student-detail-item-v180{
  min-height:64px;
  border:1px solid #e4ebf4;
  border-radius:13px;
  background:#fbfdff;
  padding:9px 10px;
  display:flex;
  align-items:center;
  gap:9px;
}
.student-detail-item-icon-v180{
  width:34px;height:34px;
  flex:0 0 34px;
  border-radius:10px;
  display:grid;place-items:center;
  background:linear-gradient(145deg,#edf5ff,#dcecff);
  color:#3478e4;
}
.student-detail-item-icon-v180 svg{
  width:17px;height:17px;
  fill:none;stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.student-detail-item-v180 small,
.student-detail-parent-item-v180 small{
  display:block;
  color:#8396ad;
  font-size:7.7px;
}
.student-detail-item-v180 b,
.student-detail-parent-item-v180 b{
  display:block;
  margin-top:3px;
  color:#173f73;
  font-size:9.4px;
  line-height:1.3;
  word-break:break-word;
}

.student-detail-parent-v180{
  margin-top:16px;
  padding-top:15px;
  border-top:1px solid #edf2f7;
}
.student-detail-parent-grid-v180{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:11px;
}
.student-detail-parent-item-v180{
  min-height:56px;
  padding:9px 11px;
  border-radius:12px;
  background:#fffaf1;
  border:1px solid #f2e8d5;
}
.student-detail-parent-item-v180.wide{
  grid-column:1/-1;
}

.student-detail-foot-v180{
  min-height:65px;
  padding:10px 20px;
  border-top:1px solid #e7edf5;
  background:#fbfcfe;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.student-detail-close-btn-v180{
  min-width:90px !important;
  height:39px !important;
  border-radius:11px !important;
}

@media(max-width:600px){
  .role-admin #detailModal .student-detail-modal-v180{
    border-radius:20px !important;
  }
  .student-detail-hero-v180{
    min-height:130px;
    padding:18px 16px;
  }
  .student-detail-avatar-v180{
    width:70px;height:70px;flex-basis:70px;border-radius:18px;
  }
  .student-detail-avatar-v180 svg{width:62px;height:62px}
  .student-detail-title-v180 h3{font-size:19px}
  .student-detail-body-v180{padding:15px}
  .student-detail-grid-v180,
  .student-detail-parent-grid-v180{
    grid-template-columns:1fr;
  }
  .student-detail-parent-item-v180.wide{
    grid-column:auto;
  }
}


/* =========================================================
   KAIH v1.1.81 - MOBILE HERO RESPONSIVE FIX
   Fix Data Siswa raster hero buttons escaping on mobile
   ========================================================= */

@media(max-width:700px){

  .role-admin .admin-students-hero-v178 .admin-student-hero-image-v178{
    overflow:hidden !important;
    background:#eaf5ff !important;
    border-radius:16px !important;
    box-shadow:0 8px 22px rgba(43,78,120,.06) !important;
    padding:0 !important;
  }

  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    display:block !important;
    width:100% !important;
    height:auto !important;
    border-radius:16px !important;
    box-shadow:none !important;
  }

  /* hide desktop click overlays completely on mobile */
  .role-admin .admin-students-hero-v178 .admin-student-hero-hotspots-v178{
    position:static !important;
    inset:auto !important;
    margin:0 !important;
    padding:10px 10px 11px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    background:#fff !important;
    border-top:1px solid #e3ebf5 !important;
    pointer-events:auto !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178{
    position:static !important;
    top:auto !important;
    left:auto !important;
    width:100% !important;
    height:40px !important;
    min-height:40px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:10px !important;
    border:1px solid #dce7f4 !important;
    background:#f8fbff !important;
    color:#2c68c8 !important;
    font-size:9px !important;
    font-weight:900 !important;
    line-height:1 !important;
    text-align:center !important;
    box-shadow:none !important;
    pointer-events:auto !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.template{
    grid-column:auto !important;
    background:linear-gradient(145deg,#effff7,#e8faef) !important;
    color:#17885a !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.import{
    grid-column:auto !important;
    background:linear-gradient(145deg,#faf5ff,#f1e9ff) !important;
    color:#7448c7 !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.add{
    grid-column:1/-1 !important;
    color:#fff !important;
    background:#2f70e7 !important;
    border-color:#2f70e7 !important;
    box-shadow:0 6px 14px rgba(47,112,231,.16) !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178 span{
    display:block !important;
    color:inherit !important;
    font-size:inherit !important;
  }

  /* keep hero readable on narrow phones */
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    min-height:150px !important;
    object-fit:cover !important;
    object-position:center !important;
  }
}

@media(max-width:430px){
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    min-height:138px !important;
    object-position:center !important;
  }

  .role-admin .admin-students-hero-v178 .admin-student-hero-hotspots-v178{
    padding:9px !important;
    gap:7px !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178{
    height:38px !important;
    min-height:38px !important;
    font-size:8.5px !important;
  }
}


/* =========================================================
   KAIH v1.1.82 - MOBILE RASTER HERO FINAL FIX
   Keep the approved banner intact; use invisible hotspots only.
   ========================================================= */

@media(max-width:700px){

  .role-admin .admin-students-hero-v178 .admin-student-hero-image-v178{
    position:relative !important;
    overflow:hidden !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:15px !important;
    background:#eaf5ff !important;
    box-shadow:0 7px 18px rgba(43,78,120,.06) !important;
  }

  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center !important;
    border-radius:15px !important;
    box-shadow:none !important;
  }

  /* IMPORTANT: no second visible button row on mobile */
  .role-admin .admin-students-hero-v178 .admin-student-hero-hotspots-v178{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    pointer-events:none !important;
    z-index:5 !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178{
    position:absolute !important;
    top:62.5% !important;
    height:17.5% !important;
    min-height:0 !important;
    width:auto !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    border-radius:10px !important;
    background:transparent !important;
    box-shadow:none !important;
    color:transparent !important;
    font-size:0 !important;
    line-height:0 !important;
    pointer-events:auto !important;
    opacity:1 !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.template{
    left:5.0% !important;
    width:14.7% !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.import{
    left:20.4% !important;
    width:14.8% !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.add{
    left:35.8% !important;
    width:15.0% !important;
    grid-column:auto !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178 span{
    display:none !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178:focus-visible{
    outline:2px solid rgba(47,112,231,.55) !important;
    outline-offset:-2px !important;
  }
}

@media(max-width:430px){
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-v178,
  .role-admin .admin-students-hero-v178 .admin-student-hero-image-bg-v178{
    border-radius:13px !important;
  }
}


/* =========================================================
   KAIH v1.1.83 - MOBILE HERO HOTSPOT VISUAL RESET
   Hotspots clickable, but 100% invisible.
   ========================================================= */
@media (max-width:700px){
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.template,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.import,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.add,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178:hover,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.template:hover,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.import:hover,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178.add:hover,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178:active{
    background:transparent !important;
    background-image:none !important;
    border:0 !important;
    box-shadow:none !important;
    color:transparent !important;
    text-shadow:none !important;
    outline:0 !important;
    opacity:1 !important;
    -webkit-appearance:none !important;
    appearance:none !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178::before,
  .role-admin .admin-students-hero-v178 .hero-hotspot-v178::after{
    display:none !important;
    content:none !important;
  }

  .role-admin .admin-students-hero-v178 .hero-hotspot-v178 *{
    visibility:hidden !important;
    opacity:0 !important;
  }
}


/* =========================================================
   KAIH v1.1.89 - MOBILE DATA SISWA CARD TABLE
   Mobile-first redesign: no horizontal table scrolling.
   ========================================================= */

@media (max-width:700px){

  .role-admin .admin-students-v171 .admin-student-database-v172{
    border-radius:18px !important;
    overflow:hidden !important;
  }

  .role-admin .admin-students-v171 .admin-filter-head-v172{
    min-height:auto !important;
    padding:14px 14px 10px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172{
    align-items:flex-start !important;
  }

  .role-admin .admin-students-v171 .admin-filter-icon-v172{
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;
    border-radius:12px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 h3{
    font-size:14px !important;
    line-height:1.2 !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 p{
    font-size:8px !important;
    line-height:1.45 !important;
    margin-top:4px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-count-v174{
    position:static !important;
    margin-left:auto !important;
    align-self:flex-start !important;
  }

  .role-admin .admin-students-v171 .admin-toolbar-v172{
    margin:0 !important;
    padding:0 14px 14px !important;
  }

  .role-admin .admin-students-v171 .student-filter{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:9px !important;
  }

  .role-admin .admin-students-v171 .student-filter .modern-search{
    grid-column:1/-1 !important;
    height:44px !important;
    min-height:44px !important;
    border-radius:12px !important;
    padding:0 12px !important;
  }

  .role-admin .admin-students-v171 .student-filter .modern-search input{
    height:42px !important;
    font-size:10px !important;
  }

  .role-admin .admin-students-v171 .student-filter select{
    height:42px !important;
    min-height:42px !important;
    border-radius:11px !important;
    font-size:9px !important;
    padding:0 10px !important;
  }

  .role-admin .admin-students-v171 .student-filter .btn{
    grid-column:1/-1 !important;
    height:43px !important;
    min-height:43px !important;
    border-radius:11px !important;
    font-size:10px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-meta-v172{
    margin-top:10px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    flex-direction:row !important;
    gap:8px !important;
    font-size:7.7px !important;
  }

  .role-admin .admin-students-v171 .admin-page-size-v172{
    display:inline-flex !important;
    align-items:center !important;
    white-space:nowrap !important;
  }

  /* Replace wide desktop table with mobile cards */
  .role-admin .admin-students-v171 .admin-table-v172{
    overflow:visible !important;
    padding:0 12px 12px !important;
    background:#f8fbff !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 table,
  .role-admin .admin-students-v171 .admin-table-v172 thead,
  .role-admin .admin-students-v171 .admin-table-v172 tbody,
  .role-admin .admin-students-v171 .admin-table-v172 tr,
  .role-admin .admin-students-v171 .admin-table-v172 th,
  .role-admin .admin-students-v171 .admin-table-v172 td{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 table{
    display:block !important;
    min-width:0 !important;
    table-layout:auto !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 thead{
    display:none !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody{
    display:grid !important;
    gap:10px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody tr{
    position:relative !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    gap:10px !important;
    align-items:start !important;
    padding:13px !important;
    border:1px solid #e1eaf4 !important;
    border-radius:15px !important;
    background:#fff !important;
    box-shadow:0 5px 16px rgba(38,72,114,.035) !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody td{
    display:block !important;
    padding:0 !important;
    border:0 !important;
    overflow:visible !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody td.check-col,
  .role-admin .admin-students-v171 .admin-table-v172 tbody td.no-col{
    display:none !important;
  }

  /* Student identity */
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(3){
    grid-column:1 !important;
    grid-row:1 !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .student-name{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .student-avatar-v171{
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    max-width:46px !important;
    min-height:46px !important;
    max-height:46px !important;
    border-radius:13px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .student-avatar-v171 svg{
    width:41px !important;
    height:41px !important;
    max-width:41px !important;
    max-height:41px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .student-name b{
    font-size:10.5px !important;
    line-height:1.25 !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .link-button{
    font-size:7.8px !important;
    margin-top:3px !important;
  }

  /* Actions */
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(9){
    grid-column:2 !important;
    grid-row:1 !important;
    align-self:center !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .row-actions{
    gap:4px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .icon-btn{
    width:29px !important;
    height:29px !important;
    min-width:29px !important;
    max-width:29px !important;
    min-height:29px !important;
    max-height:29px !important;
    border-radius:9px !important;
  }

  /* Info chips as 2-column grid */
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(4),
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(5),
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(6),
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(7),
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(8){
    padding:9px 10px !important;
    border:1px solid #edf2f7 !important;
    border-radius:11px !important;
    background:#fbfdff !important;
    overflow:hidden !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(4){
    grid-column:1 !important;
    grid-row:2 !important;
  }
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(5){
    grid-column:2 !important;
    grid-row:2 !important;
    min-width:108px !important;
  }
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(6){
    grid-column:1 !important;
    grid-row:3 !important;
  }
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(7){
    grid-column:2 !important;
    grid-row:3 !important;
    min-width:108px !important;
  }
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(8){
    grid-column:1/-1 !important;
    grid-row:4 !important;
    display:flex !important;
    align-items:center !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(4)::before,
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(5)::before,
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(6)::before,
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(7)::before,
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(8)::before{
    display:block !important;
    margin-bottom:4px !important;
    color:#8799af !important;
    font-size:6.8px !important;
    font-weight:850 !important;
    text-transform:uppercase !important;
    letter-spacing:.04em !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(4)::before{content:"NIS / NISN"}
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(5)::before{content:"Kelas"}
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(6)::before{content:"Orang Tua / Wali"}
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(7)::before{content:"Akun"}
  .role-admin .admin-students-v171 .admin-table-v172 tbody td:nth-child(8)::before{
    content:"Status";
    margin-right:8px !important;
    margin-bottom:0 !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 tbody td>b,
  .role-admin .admin-students-v171 .admin-table-v172 .table-main-text{
    font-size:8.7px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .small{
    font-size:7.2px !important;
    margin-top:2px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .class-chip,
  .role-admin .admin-students-v171 .admin-table-v172 .username-chip,
  .role-admin .admin-students-v171 .admin-table-v172 .badge{
    font-size:7.4px !important;
    height:23px !important;
    min-height:23px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172::-webkit-scrollbar{
    display:none !important;
  }

  /* Pagination */
  .role-admin .admin-students-v171 .admin-pagination-v172{
    min-height:auto !important;
    padding:12px 14px 14px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    flex-direction:row !important;
    gap:10px !important;
    background:#fff !important;
  }

  .role-admin .admin-students-v171 .admin-pagination-v172>span{
    font-size:7.3px !important;
  }

  .role-admin .admin-students-v171 .admin-pagination-v172>div{
    gap:5px !important;
  }

  .role-admin .admin-students-v171 .admin-pagination-v172 .page-btn{
    width:31px !important;
    height:31px !important;
    border-radius:9px !important;
    font-size:8px !important;
  }
}

@media (max-width:430px){
  .role-admin .admin-students-v171 .admin-table-v172 tbody tr{
    padding:11px !important;
    gap:8px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .student-avatar-v171{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    max-width:42px !important;
    min-height:42px !important;
    max-height:42px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .student-avatar-v171 svg{
    width:38px !important;
    height:38px !important;
  }

  .role-admin .admin-students-v171 .admin-table-v172 .icon-btn{
    width:27px !important;
    height:27px !important;
    min-width:27px !important;
    max-width:27px !important;
    min-height:27px !important;
    max-height:27px !important;
  }

  .role-admin .admin-students-v171 .admin-pagination-v172{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
}


/* =========================================================
   KAIH v1.1.90 - PREMIUM MOBILE FILTER EXACT MATCH
   ========================================================= */

.filter-label-mobile-v190{display:none}
.mobile-select-copy-v190,.mobile-result-icon-v190{display:none}

/* Desktop keeps existing layout */
@media(min-width:701px){
  .mobile-select-card-v190{display:contents}
}

/* Mobile premium panel */
@media(max-width:700px){

  .role-admin .admin-students-v171 .admin-student-database-v172{
    border-radius:22px !important;
    background:#fff !important;
    border:1px solid #dce7f4 !important;
    box-shadow:0 12px 28px rgba(35,70,113,.065) !important;
  }

  .role-admin .admin-students-v171 .admin-filter-head-v172{
    padding:16px 17px 13px !important;
    display:flex !important;
    align-items:center !important;
    gap:11px !important;
    border-bottom:0 !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172{
    min-width:0 !important;
    flex:1 !important;
    align-items:center !important;
  }

  .role-admin .admin-students-v171 .admin-filter-icon-v172{
    width:48px !important;
    height:48px !important;
    flex:0 0 48px !important;
    border-radius:15px !important;
    background:linear-gradient(145deg,#e9f4ff,#d6e9ff) !important;
    color:#2d76e4 !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 6px 14px rgba(46,118,228,.08) !important;
  }

  .role-admin .admin-students-v171 .admin-filter-icon-v172 svg{
    width:24px !important;
    height:24px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 h3{
    font-size:17px !important;
    line-height:1.12 !important;
    letter-spacing:-.02em !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 p{
    margin-top:4px !important;
    font-size:8.7px !important;
    line-height:1.4 !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-reset-v190{
    margin:0 !important;
    min-height:36px !important;
    padding:0 11px !important;
    border-radius:11px !important;
    background:#edf5ff !important;
    border:0 !important;
    color:#2e72dc !important;
    font-size:8.5px !important;
    font-weight:900 !important;
    gap:6px !important;
    flex:0 0 auto !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-reset-v190 svg{
    width:15px !important;
    height:15px !important;
  }

  .role-admin .admin-students-v171 .admin-toolbar-v172{
    margin:0 !important;
    padding:0 17px 16px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-filter-v190{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }

  /* Search */
  .role-admin .admin-students-v171 .mobile-search-v190{
    grid-column:1/-1 !important;
    position:relative !important;
    min-height:54px !important;
    height:54px !important;
    border-radius:15px !important;
    border:1px solid #cfe0f3 !important;
    background:#fff !important;
    padding:0 52px 0 14px !important;
    box-shadow:0 5px 14px rgba(42,78,121,.035) !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190 .admin-search-icon-v172 svg{
    width:20px !important;
    height:20px !important;
    stroke:#35587f !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190 input{
    height:52px !important;
    font-size:11px !important;
    color:#294a70 !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190 input::placeholder{
    color:#617a99 !important;
    opacity:1 !important;
  }

  .mobile-search-clear-v190{
    position:absolute !important;
    right:13px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:29px !important;
    height:29px !important;
    border-radius:50% !important;
    display:grid !important;
    place-items:center !important;
    text-decoration:none !important;
    background:#eef1f5 !important;
    color:#8190a3 !important;
    font-size:18px !important;
    line-height:1 !important;
  }

  /* Select cards */
  .role-admin .admin-students-v171 .mobile-select-card-v190{
    position:relative !important;
    min-width:0 !important;
    min-height:74px !important;
    padding:10px 42px 9px 56px !important;
    border-radius:15px !important;
    border:1px solid #cfe0f3 !important;
    background:#fff !important;
    box-shadow:0 5px 14px rgba(42,78,121,.03) !important;
    display:block !important;
    overflow:hidden !important;
  }

  .mobile-select-icon-v190{
    position:absolute !important;
    left:10px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:37px !important;
    height:37px !important;
    border-radius:11px !important;
    display:grid !important;
    place-items:center !important;
    background:linear-gradient(145deg,#e9f4ff,#d9ebff) !important;
    color:#2f74dd !important;
    pointer-events:none !important;
    z-index:2 !important;
  }

  .mobile-select-icon-v190.purple{
    background:linear-gradient(145deg,#f1edff,#e0d8ff) !important;
    color:#5f56d9 !important;
  }

  .mobile-select-icon-v190 svg{
    width:20px !important;
    height:20px !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.8 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
  }

  .mobile-select-copy-v190{
    position:absolute !important;
    left:56px !important;
    top:12px !important;
    display:block !important;
    pointer-events:none !important;
    z-index:2 !important;
  }

  .mobile-select-copy-v190 small{
    color:#6d85a4 !important;
    font-size:8px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190 select{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:74px !important;
    border:0 !important;
    border-radius:15px !important;
    outline:0 !important;
    background:transparent !important;
    padding:28px 35px 7px 56px !important;
    color:#173f73 !important;
    font-size:11px !important;
    font-weight:850 !important;
    appearance:auto !important;
    box-shadow:none !important;
    z-index:1 !important;
  }

  /* Apply Filter */
  .role-admin .admin-students-v171 .mobile-apply-v190{
    grid-column:1/-1 !important;
    min-height:54px !important;
    height:54px !important;
    margin-top:1px !important;
    border-radius:15px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    background:linear-gradient(135deg,#3479f0,#2868e7) !important;
    box-shadow:0 10px 21px rgba(47,112,231,.20) !important;
    font-size:13px !important;
  }

  .role-admin .admin-students-v171 .mobile-apply-v190 svg{
    width:20px !important;
    height:20px !important;
  }

  .filter-label-desktop-v190{display:none !important}
  .filter-label-mobile-v190{display:inline !important}

  /* Meta footer */
  .role-admin .admin-students-v171 .mobile-filter-meta-v190{
    margin:13px 0 0 !important;
    padding:12px 13px !important;
    min-height:59px !important;
    border-radius:14px !important;
    background:linear-gradient(145deg,#f7fbff,#f2f7fd) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    flex-direction:row !important;
    gap:10px !important;
  }

  .mobile-result-v190{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    min-width:0 !important;
    color:#567499 !important;
    font-size:8.5px !important;
  }

  .mobile-result-icon-v190{
    width:30px !important;
    height:30px !important;
    border-radius:9px !important;
    display:grid !important;
    place-items:center !important;
    flex:0 0 30px !important;
    background:#e5f1ff !important;
    color:#2e73df !important;
  }

  .mobile-result-icon-v190 svg{
    width:16px !important;
    height:16px !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.8 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172{
    display:flex !important;
    align-items:center !important;
    gap:5px !important;
    color:#7188a5 !important;
    font-size:8px !important;
    white-space:nowrap !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172 b{
    min-width:38px !important;
    height:35px !important;
    margin:0 !important;
    border-radius:10px !important;
    background:#fff !important;
    border:1px solid #d4e1f0 !important;
    color:#173f73 !important;
    font-size:10px !important;
  }
}

@media(max-width:430px){
  .role-admin .admin-students-v171 .admin-filter-head-v172{
    padding:14px 13px 11px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-icon-v172{
    width:43px !important;height:43px !important;flex-basis:43px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 h3{
    font-size:15px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-reset-v190{
    padding:0 9px !important;
    font-size:7.8px !important;
  }

  .role-admin .admin-students-v171 .admin-toolbar-v172{
    padding:0 13px 13px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190{
    min-height:69px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190 select{
    min-height:69px !important;
    font-size:10.5px !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190{
    align-items:flex-start !important;
    flex-direction:column !important;
  }
}


/* =========================================================
   KAIH v1.1.91 - FILTER RESPONSIVE CLEANUP
   Fix desktop exploded select icons + mobile spacing/alignment.
   ========================================================= */

/* DESKTOP / TABLET */
@media(min-width:701px){

  .role-admin .admin-students-v171 .admin-filter-head-v172{
    min-height:64px !important;
    padding:12px 16px 10px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172{
    align-items:center !important;
  }

  .role-admin .admin-students-v171 .admin-filter-icon-v172{
    width:38px !important;
    height:38px !important;
    flex:0 0 38px !important;
    border-radius:11px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 h3{
    font-size:14px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 p{
    font-size:7.6px !important;
    margin-top:3px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-reset-v190{
    margin:0 !important;
    min-height:34px !important;
    padding:0 10px !important;
    border-radius:10px !important;
    background:#edf5ff !important;
    color:#2f70d8 !important;
    border:1px solid #dce8f6 !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:6px !important;
    font-size:8px !important;
    font-weight:850 !important;
  }

  .role-admin .admin-students-v171 .admin-toolbar-v172{
    margin:0 16px !important;
    padding-bottom:12px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-filter-v190{
    display:grid !important;
    grid-template-columns:minmax(360px,1fr) 160px 160px 110px !important;
    gap:9px !important;
    align-items:center !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190{
    grid-column:auto !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 42px 0 12px !important;
    border-radius:11px !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190 input{
    height:40px !important;
    font-size:9.3px !important;
  }

  .role-admin .admin-students-v171 .mobile-search-clear-v190{
    width:26px !important;
    height:26px !important;
    right:8px !important;
    font-size:15px !important;
  }

  /* IMPORTANT: on desktop these wrappers behave like normal compact select boxes.
     Hide the decorative mobile icons entirely so they cannot blow up. */
  .role-admin .admin-students-v171 .mobile-select-card-v190{
    position:relative !important;
    min-height:42px !important;
    height:42px !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
    display:block !important;
  }

  .role-admin .admin-students-v171 .mobile-select-icon-v190,
  .role-admin .admin-students-v171 .mobile-select-copy-v190{
    display:none !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190 select{
    position:static !important;
    inset:auto !important;
    width:100% !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 34px 0 11px !important;
    border:1px solid #dce6f2 !important;
    border-radius:11px !important;
    background:#fff !important;
    color:#294c73 !important;
    font-size:8.6px !important;
    font-weight:700 !important;
    box-shadow:none !important;
    appearance:auto !important;
  }

  .role-admin .admin-students-v171 .mobile-apply-v190{
    grid-column:auto !important;
    height:42px !important;
    min-height:42px !important;
    margin:0 !important;
    border-radius:11px !important;
    font-size:9px !important;
    gap:6px !important;
  }

  .filter-label-desktop-v190{display:inline !important}
  .filter-label-mobile-v190{display:none !important}

  .role-admin .admin-students-v171 .mobile-filter-meta-v190{
    min-height:42px !important;
    padding:8px 0 0 !important;
    margin-top:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
  }

  .role-admin .admin-students-v171 .mobile-result-v190{
    gap:0 !important;
    font-size:7.7px !important;
  }

  .role-admin .admin-students-v171 .mobile-result-icon-v190{
    display:none !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172{
    font-size:7.7px !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172 b{
    min-width:33px !important;
    height:28px !important;
    font-size:8px !important;
    border-radius:8px !important;
  }
}

/* MOBILE */
@media(max-width:700px){

  .role-admin .admin-students-v171 .admin-filter-head-v172{
    min-height:auto !important;
    padding:15px 14px 12px !important;
    gap:9px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172{
    align-items:center !important;
  }

  .role-admin .admin-students-v171 .admin-filter-icon-v172{
    width:44px !important;
    height:44px !important;
    flex:0 0 44px !important;
    border-radius:13px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 h3{
    font-size:15px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 p{
    margin-top:3px !important;
    font-size:7.7px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-reset-v190{
    min-height:34px !important;
    padding:0 9px !important;
    font-size:7.6px !important;
    border-radius:10px !important;
  }

  .role-admin .admin-students-v171 .admin-toolbar-v172{
    padding:0 14px 14px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-filter-v190{
    grid-template-columns:1fr 1fr !important;
    gap:9px !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190{
    min-height:50px !important;
    height:50px !important;
    border-radius:13px !important;
    padding:0 45px 0 12px !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190 input{
    height:48px !important;
    font-size:10px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190{
    min-height:66px !important;
    height:66px !important;
    padding:0 !important;
    border-radius:13px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-icon-v190{
    left:9px !important;
    width:34px !important;
    height:34px !important;
    border-radius:10px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-icon-v190 svg{
    width:18px !important;
    height:18px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-copy-v190{
    left:51px !important;
    top:10px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-copy-v190 small{
    font-size:7.3px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190 select{
    min-height:66px !important;
    height:66px !important;
    padding:23px 29px 6px 51px !important;
    font-size:10px !important;
    line-height:1.1 !important;
  }

  .role-admin .admin-students-v171 .mobile-apply-v190{
    min-height:49px !important;
    height:49px !important;
    border-radius:13px !important;
    font-size:11px !important;
    margin-top:0 !important;
  }

  .role-admin .admin-students-v171 .mobile-apply-v190 svg{
    width:17px !important;
    height:17px !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190{
    margin-top:10px !important;
    min-height:52px !important;
    padding:9px 10px !important;
    border-radius:12px !important;
    gap:8px !important;
  }

  .mobile-result-v190{
    gap:7px !important;
    font-size:7.7px !important;
  }

  .mobile-result-icon-v190{
    width:27px !important;
    height:27px !important;
    flex:0 0 27px !important;
    border-radius:8px !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172{
    gap:4px !important;
    font-size:7.2px !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172 b{
    min-width:34px !important;
    height:31px !important;
    border-radius:9px !important;
    font-size:9px !important;
  }
}

/* Small phones */
@media(max-width:430px){
  .role-admin .admin-students-v171 .admin-filter-head-v172{
    padding:13px 12px 10px !important;
  }

  .role-admin .admin-students-v171 .admin-filter-title-v172 h3{
    font-size:14px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-reset-v190{
    padding:0 8px !important;
    font-size:7px !important;
  }

  .role-admin .admin-students-v171 .admin-toolbar-v172{
    padding:0 12px 12px !important;
  }

  .role-admin .admin-students-v171 .mobile-premium-filter-v190{
    grid-template-columns:1fr !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190,
  .role-admin .admin-students-v171 .mobile-apply-v190,
  .role-admin .admin-students-v171 .mobile-select-card-v190{
    grid-column:1 !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190{
    flex-direction:column !important;
    align-items:stretch !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172{
    justify-content:space-between !important;
  }
}


/* =========================================================
   KAIH v1.1.92 - MOBILE FILTER SELECTS INLINE
   Keep Kelas + Status in one row even on small phones.
   ========================================================= */

@media(max-width:430px){

  .role-admin .admin-students-v171 .mobile-premium-filter-v190{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:8px !important;
  }

  .role-admin .admin-students-v171 .mobile-search-v190,
  .role-admin .admin-students-v171 .mobile-apply-v190{
    grid-column:1/-1 !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190{
    grid-column:auto !important;
    min-width:0 !important;
    min-height:64px !important;
    height:64px !important;
    padding:0 !important;
    border-radius:12px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-icon-v190{
    left:8px !important;
    width:31px !important;
    height:31px !important;
    border-radius:9px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-icon-v190 svg{
    width:16px !important;
    height:16px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-copy-v190{
    left:46px !important;
    top:9px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-copy-v190 small{
    font-size:6.8px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190 select{
    min-height:64px !important;
    height:64px !important;
    padding:22px 26px 6px 46px !important;
    font-size:9.2px !important;
    font-weight:850 !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    overflow:hidden !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190{
    flex-direction:column !important;
    align-items:stretch !important;
  }

  .role-admin .admin-students-v171 .mobile-filter-meta-v190 .admin-page-size-v172{
    justify-content:space-between !important;
  }
}

/* Extra-tight phones */
@media(max-width:360px){

  .role-admin .admin-students-v171 .mobile-premium-filter-v190{
    gap:6px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190{
    min-height:60px !important;
    height:60px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-icon-v190{
    width:28px !important;
    height:28px !important;
    left:7px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-copy-v190{
    left:41px !important;
  }

  .role-admin .admin-students-v171 .mobile-select-card-v190 select{
    min-height:60px !important;
    height:60px !important;
    padding-left:41px !important;
    padding-right:22px !important;
    font-size:8.6px !important;
  }
}


/* =========================================================
   KAIH v1.1.93 - FORCE MOBILE SELECTS SAME ROW
   Explicit grid placement to override older mobile rules.
   ========================================================= */
@media(max-width:700px){

  .role-admin .admin-students-v171 form.mobile-premium-filter-v190{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    grid-auto-flow:row !important;
    column-gap:8px !important;
    row-gap:9px !important;
    align-items:stretch !important;
  }

  .role-admin .admin-students-v171 form.mobile-premium-filter-v190 > .mobile-search-v190{
    grid-column:1 / 3 !important;
    grid-row:1 !important;
  }

  .role-admin .admin-students-v171 form.mobile-premium-filter-v190 > .class-select-v190{
    grid-column:1 / 2 !important;
    grid-row:2 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
  }

  .role-admin .admin-students-v171 form.mobile-premium-filter-v190 > .status-select-v190{
    grid-column:2 / 3 !important;
    grid-row:2 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
  }

  .role-admin .admin-students-v171 form.mobile-premium-filter-v190 > .mobile-apply-v190{
    grid-column:1 / 3 !important;
    grid-row:3 !important;
  }

  .role-admin .admin-students-v171 .class-select-v190,
  .role-admin .admin-students-v171 .status-select-v190{
    display:block !important;
    box-sizing:border-box !important;
  }
}


/* =========================================================
   KAIH v1.1.95 - PREMIUM BRAND FOR SISWA & GURU
   Match approved book + gold-star branding.
   ========================================================= */

/* only student + guru roles */
.role-siswa .brand-premium,
.role-guru .brand-premium,
.student-role .brand-premium{
  display:flex !important;
  align-items:center !important;
  gap:13px !important;
  padding:18px 16px 20px !important;
  min-height:86px !important;
  text-decoration:none !important;
}

.role-siswa .brand-emblem,
.role-guru .brand-emblem,
.student-role .brand-emblem{
  width:58px !important;
  height:58px !important;
  flex:0 0 58px !important;
  border-radius:18px !important;
  overflow:hidden !important;
  background:
    url("../brand/kaih-book-star-premium.jpg") center/cover no-repeat !important;
  border:1px solid #e0ecfb !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 10px 22px rgba(48,94,171,.14) !important;
  position:relative !important;
}

.role-siswa .brand-emblem:after,
.role-guru .brand-emblem:after,
.student-role .brand-emblem:after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  border-radius:inherit !important;
  background:linear-gradient(145deg,rgba(255,255,255,.17),transparent 52%) !important;
  pointer-events:none !important;
}

.role-siswa .brand-emblem img,
.role-guru .brand-emblem img,
.student-role .brand-emblem img,
.role-siswa .brand-emblem span,
.role-guru .brand-emblem span,
.student-role .brand-emblem span{
  opacity:0 !important;
  visibility:hidden !important;
}

.role-siswa .brand-premium > div:last-child,
.role-guru .brand-premium > div:last-child,
.student-role .brand-premium > div:last-child{
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}

.role-siswa .brand-premium b,
.role-guru .brand-premium b,
.student-role .brand-premium b{
  margin:0 !important;
  color:#0c3478 !important;
  font-size:22px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:-.02em !important;
}

.role-siswa .brand-premium span,
.role-guru .brand-premium span,
.student-role .brand-premium span{
  display:block !important;
  max-width:150px !important;
  margin-top:6px !important;
  color:#6d84a6 !important;
  font-size:10px !important;
  line-height:1.42 !important;
  font-weight:500 !important;
}

/* Restore text span visibility while keeping emblem internals hidden */
.role-siswa .brand-premium > span,
.role-guru .brand-premium > span,
.student-role .brand-premium > span,
.role-siswa .brand-premium > div:last-child span,
.role-guru .brand-premium > div:last-child span,
.student-role .brand-premium > div:last-child span{
  opacity:1 !important;
  visibility:visible !important;
}

@media(max-width:640px){
  .role-siswa .brand-premium,
  .role-guru .brand-premium,
  .student-role .brand-premium{
    padding:16px 15px 18px !important;
    gap:12px !important;
  }

  .role-siswa .brand-emblem,
  .role-guru .brand-emblem,
  .student-role .brand-emblem{
    width:54px !important;
    height:54px !important;
    flex-basis:54px !important;
    border-radius:17px !important;
  }

  .role-siswa .brand-premium b,
  .role-guru .brand-premium b,
  .student-role .brand-premium b{
    font-size:21px !important;
  }

  .role-siswa .brand-premium span,
  .role-guru .brand-premium span,
  .student-role .brand-premium span{
    font-size:9.5px !important;
    max-width:140px !important;
  }
}


/* =========================================================
   KAIH v1.1.96 - STUDENT DASHBOARD MOBILE REFLOW
   Fix squeezed columns, blank hamburger, and card widths.
   ========================================================= */

@media(max-width:760px){

  /* Topbar */
  .student-topbar-v153{
    min-height:62px !important;
    padding:0 12px !important;
    gap:9px !important;
  }

  .student-hamb-v153{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    width:42px !important;
    height:42px !important;
    flex:0 0 42px !important;
    padding:0 !important;
    gap:4px !important;
  }

  .student-hamb-v153 span{
    width:17px !important;
    height:2px !important;
    flex:0 0 2px !important;
    background:#2b6fe5 !important;
  }

  .student-top-search-v153{
    display:none !important;
  }

  .student-top-actions-v153{
    margin-left:auto !important;
    gap:8px !important;
  }

  .student-top-user-v153 div:last-child,
  .student-version-v153{
    display:none !important;
  }

  /* Entire dashboard must be one clean mobile column */
  .student-dashboard-v148{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
  }

  .student-dashboard-grid-v148{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
  }

  .student-dashboard-left,
  .student-dashboard-right{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
  }

  .student-panel-v148,
  .activity-panel-v157,
  .quick-panel-v148,
  .student-tip-v148,
  .student-motivation-v152{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  /* Hero */
  .student-hero-v155{
    width:100% !important;
    min-height:330px !important;
    display:block !important;
    padding:22px 18px 0 !important;
    border-radius:21px !important;
  }

  .student-hero-copy-v155{
    max-width:none !important;
    position:relative !important;
    z-index:5 !important;
  }

  .student-hero-copy-v155>span{
    font-size:15px !important;
  }

  .student-hero-copy-v155 h1{
    font-size:30px !important;
  }

  .student-hero-copy-v155 h1 em{
    font-size:25px !important;
  }

  .student-hero-copy-v155 p{
    margin-top:11px !important;
    font-size:10.5px !important;
    line-height:1.55 !important;
    max-width:94% !important;
  }

  .student-hero-character-v155{
    height:180px !important;
    margin-top:2px !important;
  }

  .student-hero-character-v155 img{
    width:190px !important;
    left:50% !important;
    bottom:-18px !important;
    transform:translateX(-50%) !important;
  }

  .student-hero-quote-v155,
  .student-hero-side-v155{
    display:none !important;
  }

  /* Stat cards stay 2 columns, but readable */
  .student-stats-v151{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
  }

  .stat151{
    min-width:0 !important;
    min-height:105px !important;
    padding:13px !important;
    grid-template-columns:44px minmax(0,1fr) !important;
    gap:10px !important;
    border-radius:16px !important;
    overflow:hidden !important;
  }

  .stat151-icon{
    width:43px !important;
    height:43px !important;
    border-radius:13px !important;
  }

  .stat151-main{
    min-width:0 !important;
  }

  .stat151-main>span{
    font-size:9px !important;
    white-space:normal !important;
  }

  .stat151-number{
    font-size:23px !important;
  }

  .stat151-meta{
    font-size:7.5px !important;
    white-space:normal !important;
  }

  /* Habits panel */
  .student-panel-head-v148{
    padding:15px 14px 10px !important;
  }

  .student-panel-head-v148 h2{
    font-size:15px !important;
  }

  .habit-list-v148{
    width:auto !important;
    margin:0 12px !important;
  }

  .habit-row-v148{
    min-height:48px !important;
    padding:7px 8px !important;
    grid-template-columns:20px 24px 28px minmax(0,1fr) !important;
    gap:6px !important;
  }

  .habit-row-v148>b{
    min-width:0 !important;
    font-size:9.3px !important;
    white-space:normal !important;
    line-height:1.25 !important;
  }

  .habit-status-v148{
    grid-column:4 !important;
    justify-self:start !important;
    min-width:0 !important;
    padding:4px 8px !important;
    font-size:7.3px !important;
  }

  .student-save-journal-v148{
    width:auto !important;
    margin:12px 12px 14px !important;
    min-height:44px !important;
    padding:0 12px !important;
    text-align:center !important;
    font-size:9.5px !important;
    line-height:1.25 !important;
  }

  .student-save-journal-v148 b{
    margin-left:6px !important;
  }

  /* Activity panel */
  .activity-panel-v157{
    padding:0 13px 5px !important;
  }

  .activity-head-v157{
    min-height:68px !important;
  }

  .activity-title-v157 h2{
    font-size:15px !important;
  }

  .activity-see-all-v157{
    font-size:8.5px !important;
  }

  .activity-row-v157{
    width:100% !important;
    min-width:0 !important;
    grid-template-columns:40px minmax(0,1fr) 29px !important;
    grid-template-rows:auto auto !important;
    min-height:72px !important;
    column-gap:9px !important;
    padding:8px 0 !important;
  }

  .activity-copy-v157{
    min-width:0 !important;
  }

  .activity-copy-v157 b{
    font-size:9.5px !important;
  }

  .activity-copy-v157 small{
    font-size:7.6px !important;
  }

  .activity-time-v157{
    width:auto !important;
    min-width:0 !important;
    max-width:max-content !important;
    min-height:23px !important;
    font-size:7.4px !important;
  }

  /* Quick access */
  .student-quick-grid-v148,
  .student-quick-grid-v148.premium{
    width:auto !important;
    padding:0 12px 13px !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }

  .student-quick-grid-v148 a{
    min-width:0 !important;
    min-height:74px !important;
  }

  /* Motivation card should never collapse to the thin left strip */
  .student-motivation-v152{
    min-height:145px !important;
    display:grid !important;
    grid-template-columns:86px minmax(0,1fr) !important;
    padding:14px !important;
    overflow:hidden !important;
  }

  .student-motivation-v152 .motivation-character{
    height:108px !important;
    min-width:0 !important;
  }

  .student-motivation-v152 .motivation-character img{
    width:86px !important;
    max-width:86px !important;
  }

  .student-motivation-v152 .motivation-copy{
    min-width:0 !important;
  }

  .student-motivation-v152 .motivation-copy h3{
    font-size:15px !important;
  }

  .student-motivation-v152 .motivation-copy p{
    font-size:8.7px !important;
  }

  .student-motivation-v152 .motivation-copy blockquote{
    font-size:8px !important;
    padding:8px 9px !important;
  }

  .student-motivation-v152 .paper-plane{
    display:none !important;
  }

  /* Bottom app nav */
  body.student-role .content{
    padding-bottom:96px !important;
  }

  .mobile-nav.student-mobile-nav{
    left:10px !important;
    right:10px !important;
    bottom:10px !important;
    height:64px !important;
    padding:5px !important;
    border-radius:19px !important;
    z-index:80 !important;
  }

  .student-mobile-nav a{
    min-width:0 !important;
    font-size:8px !important;
  }

  .student-mobile-nav .mn-icon.premium{
    width:28px !important;
    height:28px !important;
    border-radius:9px !important;
  }
}

@media(max-width:390px){
  .student-hero-v155{
    min-height:315px !important;
    padding-left:15px !important;
    padding-right:15px !important;
  }

  .student-hero-copy-v155 h1{
    font-size:28px !important;
  }

  .student-hero-character-v155 img{
    width:176px !important;
  }

  .stat151{
    padding:11px !important;
    gap:8px !important;
    grid-template-columns:40px minmax(0,1fr) !important;
  }

  .stat151-icon{
    width:40px !important;
    height:40px !important;
  }

  .student-quick-grid-v148,
  .student-quick-grid-v148.premium{
    gap:7px !important;
  }
}


/* =========================================================
   KAIH v1.1.97 - FUNCTIONAL SISWA/GURU TOPBAR
   ========================================================= */

.role-member-topbar{
  position:sticky;
  top:0;
  z-index:55;
  min-height:72px;
  padding:0 26px;
  display:flex;
  align-items:center;
  gap:14px;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid #e6edf6;
  backdrop-filter:blur(14px);
}

.role-member-hamb{
  display:none;
}

.role-search-wrap{
  position:relative;
  width:min(650px,58vw);
  height:48px;
  display:flex;
  align-items:center;
  border:1px solid #dce6f2;
  border-radius:14px;
  background:#f7faff;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}

.role-search-wrap:focus-within{
  background:#fff;
  border-color:#b8d2f5;
  box-shadow:0 8px 22px rgba(47,112,231,.08);
}

.role-search-svg{
  width:18px;
  height:18px;
  margin-left:15px;
  flex:0 0 18px;
  fill:none;
  stroke:#6683a7;
  stroke-width:1.8;
  stroke-linecap:round;
}

.role-search-input{
  width:100%;
  height:46px;
  padding:0 14px 0 10px;
  border:0;
  outline:0;
  background:transparent;
  color:#264d78;
  font:inherit;
  font-size:11px;
}

.role-search-input::placeholder{color:#8495aa}

.role-search-results{
  position:absolute;
  left:0;
  right:0;
  top:56px;
  padding:7px;
  border:1px solid #dfe8f3;
  border-radius:15px;
  background:#fff;
  box-shadow:0 18px 45px rgba(25,54,91,.16);
  z-index:100;
}

.role-search-results[hidden]{display:none!important}

.role-search-item{
  min-height:54px;
  padding:8px 10px;
  border-radius:11px;
  display:flex;
  align-items:center;
  gap:9px;
  color:#173f73;
  text-decoration:none;
}
.role-search-item:hover{background:#f2f7ff}
.role-search-item-icon{
  width:31px;height:31px;border-radius:9px;
  display:grid;place-items:center;
  flex:0 0 31px;
  background:#e9f3ff;color:#2f73df;font-weight:900;
}
.role-search-item b{display:block;font-size:9.5px}
.role-search-item small{display:block;margin-top:2px;color:#8497ae;font-size:7.5px}
.role-search-empty{padding:14px;text-align:center;color:#8396ad;font-size:8.5px}

.role-member-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
}

.role-member-bell{position:relative}
.role-notice-badge{
  position:absolute;
  right:-4px;
  top:-5px;
  min-width:17px;
  height:17px;
  padding:0 4px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#ff5465;
  border:2px solid #fff;
  color:#fff;
  font-size:6.5px;
  line-height:1;
}
.role-member-bell>i{display:none!important}

.role-notification-popover{
  width:350px;
  right:0;
  left:auto;
  padding:0;
  overflow:hidden;
  border-radius:17px;
}

.role-notice-head{
  padding:14px 15px 11px;
  border-bottom:1px solid #e8eef6;
}
.role-notice-head b{display:block;color:#173f73;font-size:11px}
.role-notice-head span{display:block;margin-top:3px;color:#8597ad;font-size:7.5px}

.role-notice-list{padding:6px}
.role-notice-item{
  min-height:62px;
  padding:9px 8px;
  border-radius:11px;
  display:grid;
  grid-template-columns:9px minmax(0,1fr) 18px;
  align-items:start;
  gap:8px;
  text-decoration:none;
}
.role-notice-item:hover{background:#f7faff}
.role-notice-dot{
  width:8px;height:8px;border-radius:50%;
  margin-top:5px;background:#3d7fea;
}
.role-notice-item.tone-purple .role-notice-dot{background:#8b5ae6}
.role-notice-item.tone-warn .role-notice-dot{background:#eda71a}
.role-notice-item b{display:block;color:#21466f;font-size:9px;line-height:1.3}
.role-notice-item small{display:block;margin-top:3px;color:#8193a9;font-size:7.4px;line-height:1.4}
.role-notice-arrow{color:#6e8eb4;font-size:18px;line-height:1}
.role-notice-empty{padding:20px 14px;text-align:center}
.role-notice-empty>span{
  width:34px;height:34px;margin:0 auto 7px;border-radius:50%;
  display:grid;place-items:center;background:#e4f8ed;color:#18a464;font-weight:900
}
.role-notice-empty b{display:block;color:#244a75;font-size:9.5px}
.role-notice-empty small{display:block;margin-top:3px;color:#8799ae;font-size:7.5px}

.role-member-user{
  display:flex;
  align-items:center;
  gap:8px;
}
.role-member-user>div:last-child b{display:block;color:#173f73;font-size:9px}
.role-member-user>div:last-child span{display:block;margin-top:1px;color:#899aaf;font-size:7px}

@media(max-width:760px){
  .role-member-topbar{
    min-height:64px;
    padding:0 11px;
    gap:8px;
  }

  .role-member-hamb{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    border:1px solid #dce7f4!important;
    border-radius:11px!important;
    background:#f7fbff!important;
  }
  .role-member-hamb span{
    display:block!important;
    width:16px!important;height:2px!important;
    border-radius:999px!important;background:#3477e4!important;
  }

  .role-search-wrap{
    flex:1;
    width:auto;
    height:42px;
    border-radius:11px;
  }
  .role-search-svg{width:16px;height:16px;margin-left:11px}
  .role-search-input{height:40px;padding-right:8px;font-size:9px}
  .role-search-results{
    position:fixed;
    left:10px;
    right:10px;
    top:70px;
    width:auto;
    max-height:60vh;
    overflow:auto;
  }

  .role-member-actions{margin-left:0;gap:7px}
  .role-member-user>div:last-child,
  .student-version-v153{display:none!important}
  .role-notification-popover{
    position:fixed!important;
    top:70px!important;
    left:10px!important;
    right:10px!important;
    width:auto!important;
    max-height:70vh;
    overflow:auto;
  }
}

@media(max-width:430px){
  .role-member-topbar{padding:0 9px}
  .role-member-hamb{width:38px!important;height:38px!important;flex-basis:38px!important}
  .role-search-wrap{height:40px}
  .role-search-input{height:38px;font-size:8.6px}
  .role-member-user .avatar{width:36px!important;height:36px!important;min-width:36px!important}
}


/* =========================================================
   KAIH v1.1.98 - ROLE TOPBAR POPOVER + ACCOUNT MENU FIX
   ========================================================= */

/* Generic popover behavior for Siswa/Guru (admin had its own scoped rules). */
.role-member-topbar .top-popover-wrap{
  position:relative;
  display:flex;
  align-items:center;
}

.role-member-topbar .top-popover{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  z-index:120;
  background:#fff;
  border:1px solid #dfe8f3;
  box-shadow:0 20px 50px rgba(24,49,82,.16);
}

.role-member-topbar .top-popover[hidden]{
  display:none !important;
}

/* Notifications */
.role-member-topbar .role-notification-popover{
  width:350px !important;
  left:auto !important;
  right:0 !important;
  top:calc(100% + 10px) !important;
}

.role-member-topbar .role-notification-wrap{
  position:relative !important;
}

/* Account control */
.role-account-button{
  appearance:none;
  border:0;
  background:transparent;
  padding:4px 6px;
  border-radius:12px;
  cursor:pointer;
  transition:background .18s ease,box-shadow .18s ease;
}
.role-account-button:hover,
.role-account-button[aria-expanded="true"]{
  background:#f4f8ff;
  box-shadow:inset 0 0 0 1px #e0eaf6;
}

.role-account-chevron{
  width:15px;
  height:15px;
  margin-left:2px;
  fill:none;
  stroke:#7890ad;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .18s ease;
}
.role-account-button[aria-expanded="true"] .role-account-chevron{
  transform:rotate(180deg);
}

.role-account-popover{
  width:270px;
  padding:7px;
  overflow:hidden;
  border-radius:16px;
}

.role-account-head{
  padding:10px 9px 12px;
  display:flex;
  align-items:center;
  gap:9px;
  border-bottom:1px solid #e9eef5;
}
.role-account-head .avatar{
  width:38px;height:38px;min-width:38px;
  display:grid;place-items:center;
  border-radius:11px;
  background:#e9efff;
  color:#315fcd;
  font-weight:900;
}
.role-account-head b{
  display:block;
  color:#173f73;
  font-size:9.5px;
}
.role-account-head span{
  display:block;
  margin-top:2px;
  color:#899aaf;
  font-size:7.2px;
}

.role-account-links{
  padding-top:6px;
}
.role-account-links>a{
  min-height:52px;
  padding:8px 9px;
  border-radius:11px;
  display:flex;
  align-items:center;
  gap:9px;
  color:#234b78;
  text-decoration:none;
}
.role-account-links>a:hover{
  background:#f3f7fd;
}
.role-account-link-icon{
  width:31px;height:31px;flex:0 0 31px;
  border-radius:9px;
  display:grid;place-items:center;
  background:#eaf3ff;
  font-size:13px;
}
.role-account-links b{
  display:block;
  font-size:8.8px;
}
.role-account-links small{
  display:block;
  margin-top:2px;
  color:#889aaf;
  font-size:7px;
}
.role-account-links>a.logout{
  color:#d84c5d;
}
.role-account-links>a.logout .role-account-link-icon{
  background:#fff0f2;
}

/* Version is intentionally removed from member topbar. */
.role-member-topbar .student-version-v153{
  display:none !important;
}

@media(max-width:760px){
  .role-member-topbar .role-notification-popover,
  .role-member-topbar .role-account-popover{
    position:fixed !important;
    top:70px !important;
    left:10px !important;
    right:10px !important;
    width:auto !important;
    max-height:70vh !important;
    overflow:auto !important;
  }

  .role-account-button{
    padding:2px !important;
  }
  .role-account-button>div:last-of-type,
  .role-account-chevron{
    display:none !important;
  }
}


/* =========================================================
   KAIH v1.1.99 - PREMIUM GURU DASHBOARD
   ========================================================= */
.guru-dashboard-v199{
  display:grid;
  gap:16px;
}
.guru-hero-v199{
  position:relative;
  min-height:245px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr) 230px;
  align-items:stretch;
  border-radius:24px;
  background:linear-gradient(135deg,#1e55c8 0%,#3378f3 57%,#6954eb 100%);
  box-shadow:0 18px 38px rgba(39,83,164,.14);
}
.guru-hero-copy-v199{
  position:relative;
  z-index:3;
  padding:32px 0 30px 34px;
  color:#fff;
}
.guru-eyebrow-v199{
  font-size:9px;
  font-weight:900;
  letter-spacing:.13em;
  opacity:.82;
}
.guru-hero-copy-v199 h1{
  margin:8px 0 6px;
  font-size:31px;
  line-height:1.08;
  letter-spacing:-.03em;
}
.guru-hero-copy-v199 h1 em{font-style:normal;font-size:26px}
.guru-hero-copy-v199 p{
  max-width:520px;
  margin:0;
  font-size:12px;
  line-height:1.5;
  color:rgba(255,255,255,.92);
}
.guru-hero-copy-v199 blockquote{
  width:min(410px,90%);
  margin:19px 0 0;
  padding:11px 13px;
  border-radius:10px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.88);
  font-size:8px;
  line-height:1.45;
}
.guru-hero-art-v199{
  position:relative;
  min-width:0;
}
.guru-hero-art-v199:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(38,95,216,.7),rgba(38,95,216,0) 25%,rgba(63,78,220,.12));
  z-index:2;
}
.guru-hero-art-v199 img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.guru-participation-v199{
  align-self:center;
  justify-self:end;
  width:205px;
  margin-right:18px;
  padding:18px 15px;
  border-radius:20px;
  text-align:center;
  color:#fff;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(7px);
  z-index:4;
}
.guru-participation-v199>span{font-size:9px}
.guru-ring-v199{
  width:92px;height:92px;margin:9px auto 7px;border-radius:50%;
  background:conic-gradient(#28c68a calc(var(--pct)*1%),rgba(255,255,255,.22) 0);
  display:grid;place-items:center;
}
.guru-ring-v199:before{
  content:"";position:absolute;
}
.guru-ring-v199>div{
  width:72px;height:72px;border-radius:50%;
  display:grid;place-content:center;background:#fff;color:#173f73;
}
.guru-ring-v199 strong{font-size:20px;line-height:1}
.guru-ring-v199 small{margin-top:4px;font-size:6px;color:#748aa6}
.guru-participation-v199>b{display:block;font-size:9px}
.guru-participation-v199>small{display:block;margin-top:4px;font-size:7px;line-height:1.4;color:rgba(255,255,255,.8)}

.guru-stats-v199{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.guru-stat-v199{
  min-height:94px;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  padding:14px;
  border:1px solid #e0e8f3;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 22px rgba(35,70,113,.05);
}
.guru-stat-icon-v199{
  width:52px;height:52px;border-radius:15px;display:grid;place-items:center;
  font-size:22px;background:#e8f2ff;color:#2d74df;
}
.guru-stat-v199.green .guru-stat-icon-v199{background:#e3f8ec;color:#18a764}
.guru-stat-v199.purple .guru-stat-icon-v199{background:#efe5ff;color:#8a4ff0}
.guru-stat-v199.orange .guru-stat-icon-v199{background:#fff0d8;color:#ee8a1b}
.guru-stat-v199 span{display:block;color:#8295ad;font-size:8px}
.guru-stat-v199 strong{display:block;margin-top:2px;color:#153f73;font-size:24px;line-height:1}
.guru-stat-v199 small{display:block;margin-top:4px;color:#8193aa;font-size:7px}
.guru-stat-chip-v199{
  align-self:end;
  margin-bottom:3px;
  padding:5px 7px;border-radius:999px;background:#edf7f1;color:#178654;
  font-size:6.8px;white-space:nowrap;
}

.guru-main-grid-v199{
  display:grid;
  grid-template-columns:1.1fr .92fr .92fr;
  gap:14px;
  align-items:start;
}
.guru-column-v199{display:grid;gap:14px}
.guru-card-v199{
  overflow:hidden;
  border:1px solid #e0e8f3;
  border-radius:19px;
  background:#fff;
  box-shadow:0 8px 22px rgba(35,70,113,.045);
}
.guru-card-head-v199{
  min-height:70px;
  padding:14px 16px 10px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.guru-card-head-v199 span{font-size:7.4px;font-weight:900;letter-spacing:.09em;color:#8a9bb0}
.guru-card-head-v199 h2{margin:4px 0 0;color:#153f73;font-size:16px}
.guru-card-head-v199 a,.guru-card-head-v199>b{
  color:#286ee4;text-decoration:none;font-size:8px;white-space:nowrap;
}
.guru-class-list-v199{padding:0 12px 13px}
.guru-class-row-v199{
  min-height:67px;padding:9px 10px;
  display:grid;grid-template-columns:44px minmax(0,1fr) auto 18px;gap:9px;align-items:center;
  border:1px solid #e6edf6;border-radius:14px;text-decoration:none;color:#1f4775;
}
.guru-class-row-v199+.guru-class-row-v199{margin-top:8px}
.guru-class-badge-v199{
  width:44px;height:44px;border-radius:13px;display:grid;place-items:center;
  background:#e8f0ff;color:#2f69dc;font-weight:900;font-size:15px;
}
.guru-class-copy-v199 b{display:block;font-size:10px}
.guru-class-copy-v199 span{display:block;margin-top:3px;color:#8294aa;font-size:7.5px}
.guru-class-row-v199>strong{font-size:8.5px}
.guru-class-row-v199>i{font-style:normal;font-size:20px;color:#4381e9}

.guru-watch-list-v199,.guru-activity-list-v199{padding:0 12px 12px}
.guru-watch-row-v199{
  min-height:54px;display:grid;grid-template-columns:34px minmax(0,1fr) auto 16px;gap:8px;align-items:center;
  padding:7px 0;border-bottom:1px solid #edf1f6;text-decoration:none;color:#1e4775;
}
.guru-watch-row-v199:last-child{border-bottom:0}
.guru-avatar-v199{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#e9edff;color:#335fd5;font-weight:900}
.guru-watch-row-v199 b{display:block;font-size:9px}
.guru-watch-row-v199 span:not(.guru-score-v199){display:block;margin-top:2px;color:#8496ac;font-size:7px}
.guru-score-v199{min-width:35px;padding:5px 6px;border-radius:999px;text-align:center;font-size:7px;font-weight:900}
.guru-score-v199.ok{background:#e3f8ec;color:#138355}
.guru-score-v199.warn{background:#fff3d9;color:#b77b17}
.guru-score-v199.off{background:#fff0f1;color:#d15161}
.guru-watch-row-v199>i{font-style:normal;color:#4982e4;font-size:18px}

.guru-activity-row-v199{
  min-height:52px;display:grid;grid-template-columns:36px minmax(0,1fr);gap:9px;align-items:center;
  padding:7px 0;border-bottom:1px solid #edf1f6;
}
.guru-activity-row-v199:last-child{border-bottom:0}
.guru-activity-icon-v199{
  width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#e7f7ef;color:#12a264;font-weight:900
}
.guru-activity-icon-v199.reflection{background:#efe7ff;color:#8654e4}
.guru-activity-icon-v199.portfolio{background:#fff0db;color:#e88d1d}
.guru-activity-row-v199 b{display:block;color:#214870;font-size:8.5px}
.guru-activity-row-v199 span{display:block;margin-top:3px;color:#899aaf;font-size:7px}

.guru-chart-card-v199{padding-bottom:12px}
.guru-chart-v199{
  height:190px;padding:14px 14px 8px;
  display:grid;grid-template-columns:repeat(7,1fr);gap:8px;align-items:end;
}
.guru-bar-item-v199{text-align:center;display:grid;grid-template-rows:18px 1fr 19px;height:100%;align-items:end}
.guru-bar-item-v199 strong{font-size:7px;color:#27569a}
.guru-bar-track-v199{
  height:130px;border-radius:8px 8px 4px 4px;background:#edf3fb;display:flex;align-items:end;overflow:hidden;
}
.guru-bar-track-v199 i{display:block;width:100%;min-height:4px;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#70abff,#3f79e8)}
.guru-bar-item-v199 span{font-size:6.5px;color:#8395ab}

.guru-quick-grid-v199{
  padding:0 12px 13px;
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
}
.guru-quick-grid-v199 a{
  min-height:74px;padding:10px;border:1px solid #e4ebf5;border-radius:13px;text-decoration:none;color:#224a77;background:#fbfdff;
}
.guru-quick-grid-v199 span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#e8f3ff;margin-bottom:7px}
.guru-quick-grid-v199 b{display:block;font-size:8.5px}
.guru-quick-grid-v199 small{display:block;margin-top:3px;color:#8799ae;font-size:6.8px}

.guru-tip-v199{
  min-height:115px;padding:16px;border-radius:18px;display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;
  border:1px solid #f2ddbe;background:linear-gradient(135deg,#fff9ef,#fff2dd);
}
.guru-tip-v199>div:first-child{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#ffe6ad;font-size:19px}
.guru-tip-v199 b{color:#c76a12;font-size:9px}
.guru-tip-v199 p{margin:5px 0 0;color:#765b3f;font-size:7.6px;line-height:1.55}
.guru-empty-v199{padding:22px;text-align:center;color:#8799ae;font-size:8px}

@media(max-width:1180px){
  .guru-hero-v199{grid-template-columns:1fr 340px}
  .guru-participation-v199{grid-column:1/-1;width:auto;margin:0 18px 18px;display:flex;align-items:center;gap:12px;text-align:left}
  .guru-ring-v199{width:70px;height:70px;margin:0}.guru-ring-v199>div{width:54px;height:54px}
  .guru-main-grid-v199{grid-template-columns:1fr 1fr}.guru-column-v199:last-child{grid-column:1/-1;grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .guru-dashboard-v199{gap:12px}
  .guru-hero-v199{display:block;min-height:0}
  .guru-hero-copy-v199{padding:24px 18px 12px}
  .guru-hero-copy-v199 h1{font-size:26px}
  .guru-hero-copy-v199 p{font-size:10px}
  .guru-hero-copy-v199 blockquote{display:none}
  .guru-hero-art-v199{height:180px}
  .guru-participation-v199{margin:0 12px 12px;padding:12px;display:grid;grid-template-columns:62px 1fr;grid-template-rows:auto auto auto}
  .guru-participation-v199>span{grid-column:2}
  .guru-ring-v199{grid-row:1/4;grid-column:1}
  .guru-participation-v199>b,.guru-participation-v199>small{text-align:left}
  .guru-stats-v199{grid-template-columns:1fr 1fr;gap:9px}
  .guru-stat-v199{min-height:95px;grid-template-columns:43px minmax(0,1fr);padding:11px;gap:8px}
  .guru-stat-icon-v199{width:43px;height:43px;border-radius:12px;font-size:18px}
  .guru-stat-chip-v199{grid-column:2;justify-self:start;margin:0}
  .guru-main-grid-v199{grid-template-columns:1fr;gap:12px}
  .guru-column-v199:last-child{grid-column:auto;grid-template-columns:1fr}
  .guru-card-head-v199{min-height:64px;padding:12px 13px 9px}
  .guru-card-head-v199 h2{font-size:14px}
  .guru-class-row-v199{grid-template-columns:40px minmax(0,1fr) auto 14px}
  .guru-class-badge-v199{width:40px;height:40px;border-radius:12px}
  .guru-chart-v199{height:170px;padding-left:10px;padding-right:10px;gap:5px}
  .guru-bar-track-v199{height:110px}
}


/* =========================================================
   KAIH v1.2.0 - MODERN GURU DATA SISWA + PERKEMBANGAN
   ========================================================= */

.guru-students-v200,.guru-report-v200{display:grid;gap:14px}

.guru-students-head-v200,.guru-report-head-v200{
  min-height:128px;
  padding:22px 24px;
  border:1px solid #dce7f4;
  border-radius:21px;
  background:
    radial-gradient(circle at 78% 20%,rgba(255,255,255,.8),transparent 22%),
    linear-gradient(135deg,#eef8ff,#e8f3ff 56%,#dfeeff);
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  box-shadow:0 10px 28px rgba(42,78,120,.055);
}
.guru-students-head-v200 h1,.guru-report-head-v200 h1{
  margin:6px 0 5px;color:#153f73;font-size:28px;letter-spacing:-.03em;
}
.guru-students-head-v200 p,.guru-report-head-v200 p{
  margin:0;max-width:650px;color:#6d86a5;font-size:10px;line-height:1.5;
}
.guru-students-head-badge-v200,.guru-report-score-v200{
  min-width:150px;padding:15px 17px;border-radius:16px;background:rgba(255,255,255,.78);
  border:1px solid rgba(255,255,255,.95);text-align:right;
  box-shadow:0 8px 20px rgba(47,82,125,.055);
}
.guru-students-head-badge-v200 span,.guru-report-score-v200 span{display:block;color:#8095ad;font-size:7.5px}
.guru-students-head-badge-v200 strong,.guru-report-score-v200 strong{
  display:block;margin-top:3px;color:#2d69df;font-size:24px;line-height:1
}
.guru-report-score-v200 small{display:block;margin-top:5px;color:#8295ac;font-size:7px}

.guru-student-stats-v200,.guru-report-stats-v200{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px
}
.guru-student-stats-v200 article,.guru-report-stats-v200 article{
  min-height:88px;padding:12px 13px;border:1px solid #e1e9f4;border-radius:17px;background:#fff;
  display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;align-items:center;
  box-shadow:0 7px 19px rgba(38,72,114,.04)
}
.guru-student-stats-v200 .icon,.guru-report-stats-v200 article>span{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:#e7f2ff;color:#2d75e2;font-size:18px;font-weight:900
}
.guru-student-stats-v200 .green,.guru-report-stats-v200 .green{background:#e4f8ed!important;color:#17a264!important}
.guru-student-stats-v200 .purple,.guru-report-stats-v200 .purple{background:#efe6ff!important;color:#8752e8!important}
.guru-student-stats-v200 .orange,.guru-report-stats-v200 .orange{background:#fff0d9!important;color:#ea8a1b!important}
.guru-student-stats-v200 small,.guru-report-stats-v200 small{display:block;color:#8496ad;font-size:7.5px}
.guru-student-stats-v200 strong,.guru-report-stats-v200 strong{display:block;margin-top:2px;color:#153f73;font-size:20px;line-height:1}
.guru-student-stats-v200 em,.guru-report-stats-v200 em{display:block;margin-top:5px;color:#8496ad;font-size:6.8px;font-style:normal}

.guru-student-filter-card-v200,.guru-report-filter-card-v200{
  padding:13px;border:1px solid #e0e8f3;border-radius:18px;background:#fff;
  box-shadow:0 8px 22px rgba(35,70,113,.04)
}
.guru-student-filter-title-v200,.guru-report-filter-title-v200{
  display:flex;align-items:center;gap:9px;margin-bottom:10px
}
.guru-student-filter-title-v200>span,.guru-report-filter-title-v200>span{
  width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#e8f3ff;color:#2e72dd;font-size:15px
}
.guru-student-filter-title-v200 b,.guru-report-filter-title-v200 b{display:block;color:#1a4677;font-size:10px}
.guru-student-filter-title-v200 small,.guru-report-filter-title-v200 small{display:block;margin-top:2px;color:#8a9baf;font-size:7px}

.guru-student-filter-v200,.guru-report-filter-v200{
  display:grid;grid-template-columns:minmax(340px,1fr) 180px 110px auto auto;gap:8px;align-items:center
}
.guru-report-filter-v200{grid-template-columns:180px 180px 110px auto}
.guru-student-filter-v200 .searchbox{
  min-height:42px;border:1px solid #dce6f2;border-radius:11px;background:#fbfdff;display:flex;align-items:center;padding:0 11px
}
.guru-student-filter-v200 .searchbox span{color:#6c87a8;margin-right:7px}
.guru-student-filter-v200 .searchbox input{
  width:100%;height:40px;border:0;outline:0;background:transparent;color:#294c73;font-size:9px
}
.guru-student-filter-v200 select,.guru-report-filter-v200 select{
  height:42px;border:1px solid #dce6f2;border-radius:11px;background:#fff;padding:0 10px;color:#294c73;font-size:8.5px
}
.guru-student-filter-v200 .btn,.guru-report-filter-v200 .btn{
  height:42px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;font-size:8.8px
}
.guru-student-filter-v200 .filter-count,.guru-report-filter-v200 .filter-count{
  justify-self:end;padding:6px 9px;border-radius:999px;background:#edf5ff;color:#2e6fd8;font-size:7.5px;font-weight:900
}

.guru-student-grid-v200{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.guru-student-card-v200{
  border:1px solid #e1e9f3!important;border-radius:18px!important;
  box-shadow:0 8px 22px rgba(35,70,113,.045)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.guru-student-card-v200:hover{
  transform:translateY(-2px);border-color:#cdddf2!important;box-shadow:0 14px 30px rgba(35,70,113,.08)!important
}
.guru-student-card-v200 .smc-top{padding-bottom:10px}
.guru-student-card-v200 .avatar{
  width:42px!important;height:42px!important;min-width:42px!important;border-radius:12px!important;background:#e9edff!important;color:#335fd5!important
}
.guru-student-card-v200 h3{font-size:11px!important}
.guru-student-card-v200 .smc-top span{font-size:7.5px!important}
.guru-student-card-v200 .smc-metrics{gap:7px!important}
.guru-student-card-v200 .smc-metrics>div{
  min-height:48px;padding:8px 9px!important;border-radius:11px!important;background:#f8fbff!important
}
.guru-student-card-v200 .smc-metrics span{font-size:6.8px!important}
.guru-student-card-v200 .smc-metrics b{font-size:8.8px!important}
.guru-student-card-v200 .progressbar{height:7px!important;margin-top:8px!important}
.guru-student-card-v200 .smc-actions .btn{height:34px!important;border-radius:10px!important;font-size:8px!important}

/* Report table */
.guru-report-table-v200{
  border-radius:18px!important;border:1px solid #e0e8f3!important;background:#fff!important;
  box-shadow:0 8px 22px rgba(35,70,113,.045)!important;overflow:hidden!important
}
.guru-report-table-v200 table{width:100%;border-collapse:separate;border-spacing:0}
.guru-report-table-v200 thead th{
  height:44px;padding:10px 13px!important;background:#f7faff!important;color:#6f86a5!important;
  font-size:7.4px!important;letter-spacing:.04em;border-bottom:1px solid #e5ecf5!important
}
.guru-report-table-v200 tbody td{
  height:56px;padding:9px 13px!important;border-bottom:1px solid #edf2f7!important;color:#264a74!important;font-size:8.5px!important
}
.guru-report-table-v200 tbody tr:last-child td{border-bottom:0!important}
.guru-report-table-v200 tbody tr:hover td{background:#fbfdff}
.guru-report-student-v200{display:flex;align-items:center;gap:8px}
.guru-report-student-v200>span{
  width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#e9edff;color:#335fd5;font-weight:900;font-size:8px
}
.guru-report-student-v200 b{font-size:9px}
.guru-report-table-v200 .badge{
  min-height:24px!important;padding:0 8px!important;border-radius:999px!important;background:#edf3ff!important;color:#2d68d5!important;font-size:7px!important
}
.guru-report-table-v200 .report-progress{
  display:grid!important;grid-template-columns:minmax(130px,1fr) 40px!important;gap:9px!important;align-items:center!important
}
.guru-report-table-v200 .progressbar{height:7px!important;background:#edf2f7!important}
.guru-report-table-v200 .report-progress>b{font-size:8px!important;color:#173f73!important}

/* Responsive */
@media(max-width:980px){
  .guru-student-stats-v200,.guru-report-stats-v200{grid-template-columns:1fr 1fr}
  .guru-student-filter-v200{grid-template-columns:1fr 1fr}
  .guru-student-filter-v200 .searchbox{grid-column:1/-1}
  .guru-report-filter-v200{grid-template-columns:1fr 1fr}
  .guru-report-filter-v200 .btn{grid-column:1/-1}
}
@media(max-width:700px){
  .guru-students-head-v200,.guru-report-head-v200{
    min-height:auto;padding:18px;border-radius:18px;display:block
  }
  .guru-students-head-v200 h1,.guru-report-head-v200 h1{font-size:23px}
  .guru-students-head-badge-v200,.guru-report-score-v200{
    margin-top:12px;min-width:0;text-align:left;display:inline-block
  }
  .guru-student-stats-v200,.guru-report-stats-v200{grid-template-columns:1fr 1fr;gap:8px}
  .guru-student-stats-v200 article,.guru-report-stats-v200 article{
    min-height:84px;grid-template-columns:40px minmax(0,1fr);padding:10px;gap:8px
  }
  .guru-student-stats-v200 .icon,.guru-report-stats-v200 article>span{width:40px;height:40px;border-radius:12px}
  .guru-student-filter-v200,.guru-report-filter-v200{grid-template-columns:1fr 1fr}
  .guru-student-filter-v200 .searchbox{grid-column:1/-1}
  .guru-student-filter-v200 .btn,.guru-report-filter-v200 .btn{grid-column:1/-1}
  .guru-student-filter-v200 .filter-count,.guru-report-filter-v200 .filter-count{grid-column:1/-1;justify-self:start}
  .guru-student-grid-v200{grid-template-columns:1fr}
  .guru-report-table-v200{overflow-x:auto!important}
  .guru-report-table-v200 table{min-width:760px}
}


/* =========================================================
   KAIH v1.2.1 - GURU DASHBOARD PREMIUM MOBILE POLISH + ICONS
   ========================================================= */

/* Premium SVG icon normalization */
.guru-stat-icon-v199 img,
.guru-quick-grid-v199 img,
.guru-activity-icon-v199 img,
.guru-tip-v199 img,
.guru-class-badge-v199 img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

/* Desktop enhancements */
.guru-stat-icon-v199{
  padding:8px !important;
  background:linear-gradient(145deg,#f3f8ff,#e6f1ff) !important;
  border:1px solid rgba(63,121,225,.08);
}
.guru-stat-v199.green .guru-stat-icon-v199,
.guru-stat-v199.purple .guru-stat-icon-v199,
.guru-stat-v199.orange .guru-stat-icon-v199{
  background:linear-gradient(145deg,#f6faff,#eaf3ff) !important;
  color:inherit !important;
}

.guru-class-badge-v199{
  position:relative;
  padding:7px !important;
  background:linear-gradient(145deg,#f0f6ff,#e2eeff) !important;
}
.guru-class-badge-v199 img{width:100%;height:100%}
.guru-class-badge-v199 small{
  position:absolute;
  right:-4px;
  bottom:-4px;
  min-width:18px;
  height:18px;
  padding:0 4px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#2f72e6;
  color:#fff;
  border:2px solid #fff;
  font-size:6px;
  font-weight:900;
}

.guru-quick-grid-v199 a{
  position:relative;
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.guru-quick-grid-v199 a:hover{
  transform:translateY(-2px);
  border-color:#cfdff4;
  box-shadow:0 10px 22px rgba(41,82,132,.08);
}
.guru-quick-grid-v199 a>span{
  padding:6px;
}
.guru-quick-grid-v199 a>i{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  font-style:normal;
  color:#5d83b7;
  font-size:18px;
}

.guru-activity-icon-v199{
  padding:7px !important;
  background:#edf7f2 !important;
}
.guru-activity-icon-v199.reflection{background:#f4efff !important}
.guru-activity-icon-v199.portfolio{background:#fff5e7 !important}

.guru-tip-v199>div:first-child{
  padding:8px;
  background:#fff0c9 !important;
}
.guru-tip-v199>div:first-child img{width:100%;height:100%}

/* MOBILE */
@media(max-width:760px){

  .guru-dashboard-v199{
    gap:11px !important;
  }

  .guru-hero-v199{
    border-radius:20px !important;
    box-shadow:0 12px 28px rgba(39,83,164,.12) !important;
  }

  .guru-hero-copy-v199{
    padding:20px 16px 10px !important;
  }

  .guru-eyebrow-v199{
    font-size:8px !important;
  }

  .guru-hero-copy-v199 h1{
    margin-top:7px !important;
    font-size:24px !important;
  }

  .guru-hero-copy-v199 p{
    max-width:96% !important;
    font-size:9px !important;
    line-height:1.45 !important;
  }

  .guru-hero-art-v199{
    height:165px !important;
  }

  .guru-hero-art-v199 img{
    object-position:center 42% !important;
  }

  .guru-participation-v199{
    min-height:80px !important;
    margin:0 10px 10px !important;
    padding:9px 11px !important;
    border-radius:15px !important;
    grid-template-columns:58px minmax(0,1fr) !important;
    column-gap:10px !important;
  }

  .guru-ring-v199{
    width:58px !important;
    height:58px !important;
  }
  .guru-ring-v199>div{
    width:46px !important;
    height:46px !important;
  }
  .guru-ring-v199 strong{font-size:15px !important}
  .guru-participation-v199>span{font-size:7px !important}
  .guru-participation-v199>b{font-size:7.6px !important}
  .guru-participation-v199>small{font-size:6.2px !important}

  /* Stats: premium balanced 2x2 */
  .guru-stats-v199{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .guru-stat-v199{
    min-height:100px !important;
    padding:11px !important;
    border-radius:16px !important;
    grid-template-columns:43px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    column-gap:8px !important;
  }

  .guru-stat-icon-v199{
    width:43px !important;
    height:43px !important;
    padding:7px !important;
    border-radius:12px !important;
  }

  .guru-stat-v199 span{font-size:7.2px !important}
  .guru-stat-v199 strong{font-size:20px !important}
  .guru-stat-v199 small{font-size:6.3px !important;line-height:1.35 !important}
  .guru-stat-chip-v199{
    grid-column:2 !important;
    justify-self:start !important;
    padding:4px 6px !important;
    font-size:6px !important;
  }

  /* Main sections */
  .guru-main-grid-v199,
  .guru-column-v199{
    gap:11px !important;
  }

  .guru-card-v199{
    border-radius:17px !important;
    box-shadow:0 7px 18px rgba(35,70,113,.04) !important;
  }

  .guru-card-head-v199{
    min-height:61px !important;
    padding:12px 12px 8px !important;
  }

  .guru-card-head-v199 span{font-size:6.5px !important}
  .guru-card-head-v199 h2{font-size:13px !important}
  .guru-card-head-v199 a,
  .guru-card-head-v199>b{font-size:6.8px !important}

  .guru-class-list-v199{
    padding:0 9px 10px !important;
  }
  .guru-class-row-v199{
    min-height:66px !important;
    padding:8px !important;
    grid-template-columns:42px minmax(0,1fr) auto 12px !important;
    gap:7px !important;
    border-radius:13px !important;
  }
  .guru-class-badge-v199{
    width:42px !important;
    height:42px !important;
  }
  .guru-class-copy-v199 b{font-size:9px !important}
  .guru-class-copy-v199 span{font-size:6.5px !important}
  .guru-class-row-v199>strong{font-size:7px !important}

  /* Chart less bulky */
  .guru-chart-v199{
    height:150px !important;
    padding:7px 9px 6px !important;
    gap:4px !important;
  }
  .guru-bar-track-v199{
    height:94px !important;
  }
  .guru-bar-item-v199{
    grid-template-rows:15px 1fr 16px !important;
  }
  .guru-bar-item-v199 strong{font-size:6px !important}
  .guru-bar-item-v199 span{font-size:5.8px !important}

  /* Student watch list */
  .guru-watch-list-v199,
  .guru-activity-list-v199{
    padding:0 10px 10px !important;
  }
  .guru-watch-row-v199{
    min-height:51px !important;
    grid-template-columns:32px minmax(0,1fr) auto 12px !important;
    gap:7px !important;
    padding:6px 0 !important;
  }
  .guru-avatar-v199{
    width:32px !important;
    height:32px !important;
    border-radius:9px !important;
    font-size:8px !important;
  }
  .guru-watch-row-v199 b{font-size:8px !important}
  .guru-watch-row-v199 span:not(.guru-score-v199){font-size:6.3px !important}
  .guru-score-v199{min-width:32px !important;font-size:6.2px !important}

  /* Quick action cards become richer */
  .guru-quick-grid-v199{
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
    padding:0 10px 11px !important;
  }
  .guru-quick-grid-v199 a{
    min-height:82px !important;
    padding:9px !important;
    border-radius:13px !important;
    background:linear-gradient(145deg,#fff,#f8fbff) !important;
  }
  .guru-quick-grid-v199 a>span{
    width:36px !important;
    height:36px !important;
    padding:6px !important;
    border-radius:10px !important;
    margin-bottom:6px !important;
  }
  .guru-quick-grid-v199 b{font-size:7.6px !important}
  .guru-quick-grid-v199 small{font-size:6px !important;padding-right:13px}
  .guru-quick-grid-v199 a>i{right:8px;font-size:15px}

  /* Activity list */
  .guru-activity-row-v199{
    min-height:53px !important;
    grid-template-columns:36px minmax(0,1fr) !important;
    gap:8px !important;
    padding:7px 0 !important;
  }
  .guru-activity-icon-v199{
    width:36px !important;
    height:36px !important;
    padding:7px !important;
    border-radius:10px !important;
  }
  .guru-activity-row-v199 b{font-size:7.6px !important;line-height:1.35 !important}
  .guru-activity-row-v199 span{font-size:6.2px !important}

  /* Tip card */
  .guru-tip-v199{
    min-height:92px !important;
    padding:12px !important;
    grid-template-columns:38px minmax(0,1fr) !important;
    gap:9px !important;
    border-radius:16px !important;
  }
  .guru-tip-v199>div:first-child{
    width:38px !important;
    height:38px !important;
    padding:7px !important;
    border-radius:10px !important;
  }
  .guru-tip-v199 b{font-size:7.8px !important}
  .guru-tip-v199 p{font-size:6.5px !important;line-height:1.45 !important}
}

@media(max-width:390px){
  .guru-hero-copy-v199 h1{font-size:22px !important}
  .guru-hero-art-v199{height:152px !important}
  .guru-stat-v199{padding:10px !important}
  .guru-stat-icon-v199{width:40px !important;height:40px !important}
}


/* =========================================================
   KAIH v1.2.2 - GURU DATA SISWA PREMIUM REFERENCE MATCH
   ========================================================= */

.guru-students-hero-v202{
  position:relative;
  min-height:235px;
  overflow:hidden;
  border-radius:22px;
  border:1px solid #dce8f5;
  background:#dff0ff;
  box-shadow:0 12px 30px rgba(42,78,120,.07);
}
.guru-students-hero-bg-v202{
  display:block;
  width:100%;
  height:235px;
  object-fit:cover;
  object-position:center;
}
.guru-students-hero-overlay-v202{
  position:absolute;
  inset:0 auto 0 0;
  width:52%;
  padding:28px 0 24px 28px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(90deg,rgba(231,246,255,.98) 0%,rgba(231,246,255,.9) 60%,rgba(231,246,255,0) 100%);
}
.guru-students-hero-overlay-v202 h1{
  margin:7px 0 5px;
  color:#123f78;
  font-size:30px;
  letter-spacing:-.03em;
}
.guru-students-hero-overlay-v202 p{
  max-width:470px;
  margin:0;
  color:#55779f;
  font-size:10px;
  line-height:1.5;
}
.guru-students-hero-count-v202{
  width:195px;
  margin-top:17px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:15px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(255,255,255,.98);
  box-shadow:0 8px 20px rgba(36,72,117,.07);
}
.guru-students-hero-count-v202 img{
  width:36px;height:36px;object-fit:contain;
}
.guru-students-hero-count-v202 small{display:block;color:#8296ad;font-size:7px}
.guru-students-hero-count-v202 strong{display:block;margin-top:2px;color:#1a4b83;font-size:14px}

/* icon normalization */
.guru-student-stats-v200 .icon{
  padding:8px !important;
  background:linear-gradient(145deg,#f5f9ff,#e8f2ff) !important;
}
.guru-student-stats-v200 .icon img{
  width:100%;height:100%;object-fit:contain;display:block
}
.guru-filter-icon-v202{
  padding:7px;
}
.guru-filter-icon-v202 img{
  width:100%;height:100%;display:block;object-fit:contain
}

/* Cards */
.guru-student-card-v200{
  padding:13px !important;
}
.guru-student-card-v200 .smc-top{
  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:9px !important;
}
.guru-student-card-v200 .smc-top>.avatar{
  grid-column:1 !important;
}
.guru-student-card-v200 .smc-top>div:nth-child(2){
  grid-column:2 !important;
  min-width:0 !important;
}
.guru-student-card-v200 .smc-top>.badge{
  grid-column:3 !important;
  justify-self:end !important;
  align-self:start !important;
}
.guru-student-card-v200 .smc-metrics{
  margin-top:8px !important;
}
.guru-metrics-v202>div{
  position:relative;
  padding:8px 8px 8px 34px !important;
}
.guru-metrics-v202 i{
  position:absolute;
  left:7px;
  top:50%;
  transform:translateY(-50%);
  width:22px;height:22px;border-radius:7px;
  display:grid;place-items:center;
  background:#eef5ff;
}
.guru-metrics-v202 i img{
  width:18px;height:18px;object-fit:contain
}
.guru-student-card-v200 .smc-actions .btn{
  display:inline-flex !important;
  align-items:center !important;
  gap:4px !important;
}
.detail-arrow-v202{
  font-size:14px;
  line-height:1;
  color:#5084d9;
}

/* mobile exact polish */
@media(max-width:700px){

  .guru-students-v200{
    gap:10px !important;
  }

  .guru-students-hero-v202{
    min-height:255px !important;
    border-radius:19px !important;
  }

  .guru-students-hero-bg-v202{
    height:255px !important;
    object-position:center !important;
  }

  .guru-students-hero-overlay-v202{
    width:100% !important;
    padding:18px 16px 14px !important;
    justify-content:flex-start !important;
    background:linear-gradient(180deg,rgba(235,247,255,.97) 0%,rgba(235,247,255,.83) 43%,rgba(235,247,255,0) 72%) !important;
  }

  .guru-students-hero-overlay-v202 .eyebrow{
    font-size:7px !important;
  }

  .guru-students-hero-overlay-v202 h1{
    margin:5px 0 4px !important;
    font-size:24px !important;
  }

  .guru-students-hero-overlay-v202 p{
    max-width:78% !important;
    font-size:8.3px !important;
    line-height:1.42 !important;
  }

  .guru-students-hero-count-v202{
    width:150px !important;
    min-height:54px !important;
    margin-top:12px !important;
    padding:8px 9px !important;
    gap:8px !important;
    border-radius:13px !important;
  }
  .guru-students-hero-count-v202 img{
    width:31px !important;
    height:31px !important;
  }
  .guru-students-hero-count-v202 small{font-size:6px !important}
  .guru-students-hero-count-v202 strong{font-size:12px !important}

  .guru-student-stats-v200{
    gap:7px !important;
  }

  .guru-student-stats-v200 article{
    min-height:82px !important;
    padding:9px !important;
    grid-template-columns:38px minmax(0,1fr) !important;
    gap:7px !important;
    border-radius:14px !important;
  }

  .guru-student-stats-v200 .icon{
    width:38px !important;
    height:38px !important;
    border-radius:11px !important;
    padding:6px !important;
  }

  .guru-student-stats-v200 small{font-size:6.5px !important}
  .guru-student-stats-v200 strong{font-size:18px !important}
  .guru-student-stats-v200 em{font-size:5.8px !important;line-height:1.3 !important}

  .guru-student-filter-card-v200{
    padding:10px !important;
    border-radius:16px !important;
  }

  .guru-student-filter-title-v200{
    margin-bottom:8px !important;
  }
  .guru-student-filter-title-v200>span{
    width:32px !important;
    height:32px !important;
    border-radius:9px !important;
  }
  .guru-student-filter-title-v200 b{font-size:9px !important}
  .guru-student-filter-title-v200 small{font-size:6px !important}

  .guru-student-filter-v200{
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
  }

  .guru-student-filter-v200 .searchbox{
    grid-column:1/-1 !important;
    min-height:40px !important;
    border-radius:10px !important;
  }

  .guru-student-filter-v200 select{
    height:40px !important;
    border-radius:10px !important;
    font-size:7.8px !important;
  }

  .guru-student-filter-v200 .btn{
    grid-column:auto !important;
    height:40px !important;
    border-radius:10px !important;
    font-size:7.8px !important;
  }

  .guru-student-filter-v200 .filter-count{
    grid-column:1/-1 !important;
    justify-self:start !important;
    margin-top:2px !important;
    font-size:6.5px !important;
  }

  .guru-student-grid-v200{
    gap:9px !important;
  }

  .guru-student-card-v200{
    padding:11px !important;
    border-radius:16px !important;
  }

  .guru-student-card-v200 .smc-top{
    grid-template-columns:40px minmax(0,1fr) auto !important;
    gap:8px !important;
  }

  .guru-student-card-v200 .smc-top>.avatar{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    border-radius:11px !important;
  }

  .guru-student-card-v200 h3{
    font-size:9.8px !important;
  }
  .guru-student-card-v200 .smc-top span{
    font-size:6.5px !important;
  }

  .guru-student-card-v200 .smc-top>.badge{
    font-size:6px !important;
    padding:4px 6px !important;
  }

  .guru-metrics-v202{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:5px !important;
  }

  .guru-metrics-v202>div{
    min-height:53px !important;
    padding:7px 6px 7px 30px !important;
    border-radius:10px !important;
  }

  .guru-metrics-v202 i{
    left:6px !important;
    width:19px !important;
    height:19px !important;
  }
  .guru-metrics-v202 i img{
    width:16px !important;
    height:16px !important;
  }
  .guru-metrics-v202 span{font-size:5.8px !important}
  .guru-metrics-v202 b{font-size:7.6px !important}

  .guru-student-card-v200 .progressbar{
    margin-top:7px !important;
    height:6px !important;
  }

  .guru-student-card-v200 .smc-actions{
    margin-top:8px !important;
  }

  .guru-student-card-v200 .smc-actions .btn{
    height:31px !important;
    min-height:31px !important;
    padding:0 9px !important;
    border-radius:9px !important;
    font-size:7px !important;
  }
}


/* =========================================================
   KAIH v1.2.3 - GURU DATA SISWA REFINED PREMIUM UI
   Cleaner hero, stronger hierarchy, better card readability.
   ========================================================= */

/* New hero: real UI content on left, clean illustration on right */
.guru-students-hero-v203{
  min-height:220px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);
  align-items:stretch;
  border:1px solid #dce8f5;
  border-radius:24px;
  background:
    radial-gradient(circle at 36% 15%,rgba(255,255,255,.86),transparent 25%),
    linear-gradient(135deg,#edf8ff 0%,#e2f1ff 58%,#d5eaff 100%);
  box-shadow:0 14px 34px rgba(35,76,128,.075);
}
.guru-students-hero-copy-v203{
  padding:29px 20px 27px 31px;
  align-self:center;
  position:relative;
  z-index:2;
}
.guru-students-hero-copy-v203 h1{
  margin:7px 0 6px;
  color:#123f78;
  font-size:30px;
  line-height:1.05;
  letter-spacing:-.035em;
}
.guru-students-hero-copy-v203 p{
  max-width:565px;
  margin:0;
  color:#58799f;
  font-size:10.5px;
  line-height:1.55;
}
.guru-students-hero-meta-v203{
  margin-top:18px;
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}
.guru-students-hero-meta-v203>div{
  min-width:145px;
  min-height:56px;
  padding:8px 11px;
  display:flex;
  align-items:center;
  gap:9px;
  border:1px solid rgba(255,255,255,.98);
  border-radius:14px;
  background:rgba(255,255,255,.86);
  box-shadow:0 8px 20px rgba(38,73,116,.06);
}
.guru-students-hero-meta-v203 img{
  width:34px;height:34px;object-fit:contain;flex:0 0 34px;
}
.guru-students-hero-meta-v203 small{
  display:block;color:#8296ad;font-size:6.8px
}
.guru-students-hero-meta-v203 strong{
  display:block;margin-top:2px;color:#173f73;font-size:12.5px
}
.guru-students-hero-art-v203{
  min-width:0;
  position:relative;
  overflow:hidden;
}
.guru-students-hero-art-v203:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:38%;
  z-index:2;
  background:linear-gradient(90deg,#e2f1ff 0%,rgba(226,241,255,.66) 42%,rgba(226,241,255,0) 100%);
}
.guru-students-hero-art-v203 img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

/* Better stat cards */
.guru-student-stats-v200 article{
  min-height:94px !important;
  grid-template-columns:50px minmax(0,1fr) !important;
  gap:11px !important;
  padding:13px 14px !important;
}
.guru-student-stats-v200 .icon{
  width:50px !important;
  height:50px !important;
  border-radius:15px !important;
  padding:8px !important;
}
.guru-student-stats-v200 small{
  font-size:7.8px !important;
}
.guru-student-stats-v200 strong{
  font-size:22px !important;
}
.guru-student-stats-v200 em{
  font-size:7px !important;
}

/* Filter panel stronger hierarchy */
.guru-student-filter-card-v200{
  padding:14px 15px !important;
  border-radius:19px !important;
}
.guru-student-filter-title-v200{
  margin-bottom:11px !important;
}
.guru-student-filter-title-v200 b{
  font-size:10.5px !important;
}
.guru-student-filter-title-v200 small{
  font-size:7.2px !important;
}
.guru-student-filter-v200{
  grid-template-columns:minmax(360px,1fr) 180px 110px auto auto !important;
}
.guru-student-filter-v200 .searchbox,
.guru-student-filter-v200 select,
.guru-student-filter-v200 .btn{
  height:44px !important;
}
.guru-student-filter-v200 .searchbox{
  min-height:44px !important;
  border-radius:12px !important;
}
.guru-student-filter-v200 .searchbox input{
  height:42px !important;
  font-size:9.3px !important;
}
.guru-student-filter-v200 select{
  border-radius:12px !important;
  font-size:8.8px !important;
}
.guru-student-filter-v200 .btn{
  border-radius:12px !important;
  font-size:8.8px !important;
}

/* Student cards: clearer, denser, premium */
.guru-student-grid-v200{
  gap:13px !important;
}
.guru-student-card-v200{
  padding:14px !important;
  border-radius:19px !important;
}
.guru-student-card-v200 .smc-top{
  grid-template-columns:46px minmax(0,1fr) auto !important;
  gap:10px !important;
}
.guru-student-card-v200 .smc-top>.avatar{
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  border-radius:13px !important;
  font-size:12px !important;
}
.guru-student-card-v200 h3{
  font-size:11px !important;
  line-height:1.2 !important;
}
.guru-student-card-v200 .smc-top span{
  font-size:7.4px !important;
}
.guru-student-card-v200 .smc-top>.badge{
  min-height:24px !important;
  padding:0 8px !important;
  border-radius:999px !important;
  font-size:6.7px !important;
}
.guru-metrics-v202{
  margin-top:9px !important;
  display:grid !important;
  grid-template-columns:1.15fr .95fr .9fr !important;
  gap:7px !important;
}
.guru-metrics-v202>div{
  min-height:58px !important;
  padding:8px 8px 8px 36px !important;
  border-radius:12px !important;
  background:linear-gradient(145deg,#f9fbfe,#f4f8fd) !important;
}
.guru-metrics-v202 i{
  width:24px !important;
  height:24px !important;
  left:8px !important;
  border-radius:8px !important;
}
.guru-metrics-v202 i img{
  width:20px !important;
  height:20px !important;
}
.guru-metrics-v202 span{
  display:block !important;
  color:#8799ae !important;
  font-size:6.7px !important;
  line-height:1.2 !important;
}
.guru-metrics-v202 b{
  display:block !important;
  margin-top:3px !important;
  color:#173f73 !important;
  font-size:8.7px !important;
}
.guru-student-card-v200 .progressbar{
  height:7px !important;
  border-radius:999px !important;
  background:#ebf0f6 !important;
}
.guru-student-card-v200 .progressbar i{
  border-radius:999px !important;
  background:linear-gradient(90deg,#2e71e5,#68a8ff) !important;
}
.guru-student-card-v200 .smc-actions{
  margin-top:9px !important;
}
.guru-detail-btn-v203{
  min-height:35px !important;
  padding:0 11px !important;
  border-radius:10px !important;
  background:#f2f6fb !important;
  border:1px solid #e1e9f3 !important;
  color:#294d75 !important;
}
.guru-detail-btn-v203:hover{
  background:#eaf2ff !important;
  color:#225fbd !important;
}

/* Mobile: make it app-like, not desktop cards squeezed into phone */
@media(max-width:700px){

  .guru-students-v200{
    gap:9px !important;
  }

  .guru-students-hero-v203{
    min-height:330px !important;
    display:block !important;
    border-radius:19px !important;
  }

  .guru-students-hero-copy-v203{
    position:relative !important;
    z-index:3 !important;
    padding:18px 15px 8px !important;
    min-height:154px !important;
    background:
      linear-gradient(180deg,rgba(239,248,255,.98) 0%,rgba(239,248,255,.92) 72%,rgba(239,248,255,0) 100%) !important;
  }

  .guru-students-hero-copy-v203 h1{
    font-size:23px !important;
    margin:5px 0 4px !important;
  }

  .guru-students-hero-copy-v203 p{
    max-width:95% !important;
    font-size:8.2px !important;
    line-height:1.45 !important;
  }

  .guru-students-hero-meta-v203{
    margin-top:10px !important;
    gap:6px !important;
  }

  .guru-students-hero-meta-v203>div{
    min-width:0 !important;
    min-height:49px !important;
    flex:1 1 0 !important;
    padding:7px 8px !important;
    border-radius:12px !important;
  }

  .guru-students-hero-meta-v203 img{
    width:28px !important;
    height:28px !important;
    flex-basis:28px !important;
  }

  .guru-students-hero-meta-v203 small{font-size:5.8px !important}
  .guru-students-hero-meta-v203 strong{font-size:10.5px !important}

  .guru-students-hero-art-v203{
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    height:190px !important;
  }

  .guru-students-hero-art-v203:before{
    inset:0 !important;
    width:auto !important;
    height:60px !important;
    background:linear-gradient(180deg,#e7f4ff 0%,rgba(231,244,255,0) 100%) !important;
  }

  .guru-students-hero-art-v203 img{
    object-position:center 48% !important;
  }

  .guru-student-stats-v200{
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
  }

  .guru-student-stats-v200 article{
    min-height:83px !important;
    padding:9px !important;
    grid-template-columns:39px minmax(0,1fr) !important;
    gap:7px !important;
    border-radius:14px !important;
  }

  .guru-student-stats-v200 .icon{
    width:39px !important;
    height:39px !important;
    padding:6px !important;
    border-radius:11px !important;
  }

  .guru-student-stats-v200 small{font-size:6px !important}
  .guru-student-stats-v200 strong{font-size:17px !important}
  .guru-student-stats-v200 em{font-size:5.6px !important;line-height:1.3 !important}

  .guru-student-filter-card-v200{
    padding:10px !important;
    border-radius:15px !important;
  }

  .guru-student-filter-v200{
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
  }

  .guru-student-filter-v200 .searchbox{
    grid-column:1/-1 !important;
  }

  .guru-student-filter-v200 select{
    width:100% !important;
  }

  .guru-student-filter-v200 .btn{
    grid-column:auto !important;
  }

  .guru-student-filter-v200 .filter-count{
    grid-column:1/-1 !important;
    justify-self:start !important;
  }

  .guru-student-grid-v200{
    gap:8px !important;
  }

  .guru-student-card-v200{
    padding:10px !important;
    border-radius:15px !important;
  }

  .guru-student-card-v200 .smc-top{
    grid-template-columns:39px minmax(0,1fr) auto !important;
    gap:7px !important;
  }

  .guru-student-card-v200 .smc-top>.avatar{
    width:39px !important;
    height:39px !important;
    min-width:39px !important;
    border-radius:11px !important;
    font-size:9px !important;
  }

  .guru-student-card-v200 h3{
    font-size:9.1px !important;
  }

  .guru-student-card-v200 .smc-top span{
    font-size:6.2px !important;
  }

  .guru-student-card-v200 .smc-top>.badge{
    min-height:21px !important;
    padding:0 6px !important;
    font-size:5.8px !important;
  }

  .guru-metrics-v202{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:5px !important;
    margin-top:7px !important;
  }

  .guru-metrics-v202>div{
    min-height:49px !important;
    padding:6px 5px 6px 27px !important;
    border-radius:9px !important;
  }

  .guru-metrics-v202 i{
    width:17px !important;
    height:17px !important;
    left:5px !important;
  }

  .guru-metrics-v202 i img{
    width:14px !important;
    height:14px !important;
  }

  .guru-metrics-v202 span{
    font-size:5.2px !important;
  }

  .guru-metrics-v202 b{
    font-size:6.8px !important;
  }

  .guru-student-card-v200 .progressbar{
    height:5px !important;
    margin-top:6px !important;
  }

  .guru-student-card-v200 .smc-actions{
    margin-top:7px !important;
  }

  .guru-detail-btn-v203{
    min-height:30px !important;
    padding:0 8px !important;
    border-radius:9px !important;
    font-size:6.3px !important;
  }
}


/* =========================================================
   KAIH v1.2.4 - GURU DATA SISWA MOBILE LAYOUT HOTFIX
   Fix hero illustration escaping its card and overlapping stats/filter.
   ========================================================= */

@media(max-width:700px){

  .guru-students-v200{
    width:100% !important;
    min-width:0 !important;
    display:grid !important;
    gap:10px !important;
  }

  /* Critical: keep all hero children inside the hero itself */
  .guru-students-hero-v203{
    position:relative !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 168px !important;
    min-height:0 !important;
    height:auto !important;
    overflow:hidden !important;
    border-radius:19px !important;
  }

  .guru-students-hero-copy-v203{
    position:relative !important;
    inset:auto !important;
    z-index:3 !important;
    min-height:0 !important;
    padding:17px 15px 12px !important;
    background:
      linear-gradient(180deg,#eef8ff 0%,#e9f5ff 100%) !important;
  }

  .guru-students-hero-copy-v203 h1{
    margin:5px 0 4px !important;
    font-size:23px !important;
    line-height:1.08 !important;
  }

  .guru-students-hero-copy-v203 p{
    max-width:100% !important;
    margin:0 !important;
    font-size:8.2px !important;
    line-height:1.45 !important;
  }

  .guru-students-hero-meta-v203{
    margin-top:10px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
  }

  .guru-students-hero-meta-v203>div{
    width:100% !important;
    min-width:0 !important;
    min-height:48px !important;
    padding:7px 8px !important;
    gap:7px !important;
    border-radius:12px !important;
    box-sizing:border-box !important;
  }

  .guru-students-hero-meta-v203 img{
    width:27px !important;
    height:27px !important;
    flex:0 0 27px !important;
  }

  .guru-students-hero-meta-v203 small{
    font-size:5.8px !important;
  }

  .guru-students-hero-meta-v203 strong{
    font-size:10.2px !important;
  }

  .guru-students-hero-art-v203{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:100% !important;
    height:168px !important;
    min-height:168px !important;
    overflow:hidden !important;
    z-index:1 !important;
  }

  .guru-students-hero-art-v203:before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    width:auto !important;
    height:auto !important;
    z-index:2 !important;
    background:
      linear-gradient(180deg,#e9f5ff 0%,rgba(233,245,255,0) 24%) !important;
    pointer-events:none !important;
  }

  .guru-students-hero-art-v203 img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center 49% !important;
    transform:none !important;
  }

  /* Make the summary cards start cleanly after hero */
  .guru-student-stats-v200{
    position:relative !important;
    z-index:1 !important;
    margin:0 !important;
    clear:both !important;
  }

  .guru-student-filter-card-v200{
    position:relative !important;
    z-index:1 !important;
    margin:0 !important;
    clear:both !important;
  }

  .guru-student-grid-v200{
    position:relative !important;
    z-index:1 !important;
    margin:0 !important;
    clear:both !important;
  }
}

/* Smaller phones */
@media(max-width:390px){
  .guru-students-hero-v203{
    grid-template-rows:auto 154px !important;
  }

  .guru-students-hero-art-v203{
    height:154px !important;
    min-height:154px !important;
  }

  .guru-students-hero-copy-v203{
    padding:15px 13px 11px !important;
  }

  .guru-students-hero-copy-v203 h1{
    font-size:21px !important;
  }

  .guru-students-hero-meta-v203{
    gap:6px !important;
  }
}


/* =========================================================
   KAIH v1.2.5 - GURU DATA SISWA EXACT REFERENCE LAYOUT
   ========================================================= */

/* Hero */
.guru-students-hero-v203{
  min-height:230px !important;
  grid-template-columns:minmax(0,1.03fr) minmax(420px,.97fr) !important;
  border-radius:23px !important;
}
.guru-students-hero-copy-v203{
  padding:28px 18px 26px 29px !important;
}
.guru-students-hero-copy-v203 h1{
  font-size:31px !important;
}
.guru-students-hero-copy-v203 p{
  max-width:560px !important;
  font-size:10.5px !important;
}
.guru-students-hero-art-v203{
  min-height:230px !important;
}
.guru-students-hero-art-v203 img{
  object-position:center 46% !important;
}

/* Summary */
.guru-student-stats-v200{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:10px !important;
}
.guru-student-stats-v200 article{
  min-height:88px !important;
  border-radius:17px !important;
  padding:12px 13px !important;
}
.guru-student-stats-v200 .icon{
  width:46px !important;height:46px !important;border-radius:13px !important;
}
.guru-student-stats-v200 strong{font-size:21px !important}

/* Filter */
.guru-student-filter-card-v205{
  padding:14px;
  border:1px solid #e0e8f3;
  border-radius:19px;
  background:#fff;
  box-shadow:0 8px 22px rgba(35,70,113,.045);
}
.guru-student-filter-title-v205{
  display:flex;align-items:center;gap:10px;margin-bottom:11px;
}
.guru-student-filter-title-v205>span{
  width:37px;height:37px;padding:7px;border-radius:11px;
  display:grid;place-items:center;background:#eaf3ff;
}
.guru-student-filter-title-v205 img{width:100%;height:100%;object-fit:contain}
.guru-student-filter-title-v205 b{display:block;color:#174578;font-size:10.5px}
.guru-student-filter-title-v205 small{display:block;margin-top:2px;color:#899baf;font-size:7px}

.guru-student-filter-v205{
  display:grid;
  grid-template-columns:minmax(320px,1fr) 170px 150px 112px 94px;
  gap:8px;
  align-items:center;
}
.guru-search-v205{
  position:relative;height:43px;border:1px solid #dce6f2;border-radius:11px;
  display:flex;align-items:center;padding:0 10px;background:#fff;
}
.guru-search-v205>span{color:#6a86a8;margin-right:7px}
.guru-search-v205 input{
  width:100%;height:41px;border:0;outline:0;background:transparent;color:#294c73;font-size:9px
}
.guru-search-v205>a{
  width:24px;height:24px;border-radius:50%;display:grid;place-items:center;text-decoration:none;
  color:#8394a9;background:#edf1f5;font-size:14px;
}
.guru-student-filter-v205>select{
  height:43px;border:1px solid #dce6f2;border-radius:11px;background:#fff;
  padding:0 10px;color:#294c73;font-size:8.6px;
}
.guru-student-filter-v205 .btn{
  height:43px;border-radius:11px;font-size:8.6px;display:flex;align-items:center;justify-content:center;gap:6px
}
.guru-apply-v205{background:linear-gradient(135deg,#3479ef,#2868e7)!important;box-shadow:0 8px 18px rgba(47,112,231,.16)!important}
.guru-reset-v205{background:#edf3fb!important;color:#2f6fcf!important;border-color:#e0e8f3!important}
.guru-filter-bottom-v205{
  grid-column:1/-1;
  min-height:40px;padding-top:10px;border-top:1px solid #edf2f7;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.guru-filter-bottom-v205>span{font-size:7.5px;color:#6683a4}
.guru-filter-bottom-v205>span b{color:#1f5fb6}
.guru-filter-bottom-v205 label{display:flex;align-items:center;gap:6px;color:#7d91aa;font-size:7.4px}
.guru-filter-bottom-v205 label select{
  height:31px;border:1px solid #dce6f2;border-radius:9px;padding:0 8px;background:#fff;color:#294c73;font-size:7.6px
}

/* Student rows */
.guru-student-list-v205{
  display:grid;
  gap:10px;
}
.guru-student-row-v205{
  min-height:112px;
  padding:12px 14px;
  display:grid;
  grid-template-columns:minmax(220px,1.45fr) minmax(155px,.95fr) minmax(135px,.78fr) minmax(120px,.72fr) 98px;
  gap:11px;
  align-items:center;
  border:1px solid #e0e8f3;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 22px rgba(35,70,113,.042);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.guru-student-row-v205:hover{
  transform:translateY(-2px);
  border-color:#cfdef1;
  box-shadow:0 14px 30px rgba(35,70,113,.075);
}
.guru-student-main-v205{
  min-width:0;display:grid;grid-template-columns:54px minmax(0,1fr);gap:10px;align-items:center;
}
.guru-student-avatar-v205{
  width:54px;height:54px;border-radius:17px;display:block;object-fit:cover;
  box-shadow:0 6px 16px rgba(49,87,138,.08);
}
.guru-student-name-v205{min-width:0}
.guru-student-name-v205 h3{
  margin:0;color:#173f73;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.guru-student-name-v205>span{
  display:block;margin-top:4px;color:#8295ad;font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.guru-check-badge-v205{
  display:inline-flex;margin-top:6px;min-height:22px;padding:0 7px;border-radius:999px;
  align-items:center;font-size:6.4px;font-weight:900;
}
.guru-check-badge-v205.ok{background:#e2f8ec;color:#168557}
.guru-check-badge-v205.warn{background:#fff3da;color:#ad7517}
.guru-check-badge-v205.off{background:#fff0f2;color:#cf5060}

.guru-student-metric-v205{
  position:relative;min-height:66px;padding:10px 9px 9px 41px;border-radius:13px;
  background:linear-gradient(145deg,#fbfdff,#f5f9fd);border:1px solid #edf2f7;
}
.guru-student-metric-v205 i{
  position:absolute;left:8px;top:10px;width:26px;height:26px;padding:4px;border-radius:8px;
  display:grid;place-items:center;background:#eaf3ff
}
.guru-student-metric-v205.green i{background:#e7f8ef}
.guru-student-metric-v205.orange i{background:#fff0db}
.guru-student-metric-v205.purple i{background:#f2eaff}
.guru-student-metric-v205 i img{width:100%;height:100%;object-fit:contain}
.guru-student-metric-v205>span{display:block;color:#8497ae;font-size:6.6px;line-height:1.25}
.guru-student-metric-v205>strong{display:block;margin-top:4px;color:#173f73;font-size:10px}
.mini-progress-v205{
  height:5px;margin-top:8px;border-radius:999px;background:#e8eef5;overflow:hidden
}
.mini-progress-v205 b{
  display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#3174e7,#5da3ff)
}

.guru-detail-v205{
  min-height:42px;padding:0 10px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;gap:7px;
  border:1px solid #e0e9f4;background:#f4f8fd;color:#2763b7;text-decoration:none;
  font-size:7.6px;font-weight:850;
}
.guru-detail-v205 b{font-size:16px;line-height:1;color:#4b81d8}
.guru-detail-v205:hover{background:#eaf3ff}

/* Pagination */
.guru-pagination-v205{
  min-height:64px;padding:12px 14px;border:1px solid #e0e8f3;border-radius:17px;background:#fff;
  display:grid;grid-template-columns:36px 1fr auto 36px;gap:10px;align-items:center;
  box-shadow:0 8px 22px rgba(35,70,113,.04)
}
.guru-pagination-v205>a{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;text-decoration:none;
  border:1px solid #dfe8f3;background:#f5f8fc;color:#3c73c7;font-size:18px
}
.guru-pagination-v205>a.disabled{pointer-events:none;opacity:.38}
.guru-pagination-v205>span{color:#8295ad;font-size:7.5px}
.guru-pagination-v205 select{
  height:36px;border:1px solid #dce6f2;border-radius:10px;background:#fff;padding:0 8px;color:#375776;font-size:7.5px
}

/* Tablet */
@media(max-width:1100px){
  .guru-student-row-v205{
    grid-template-columns:minmax(210px,1.3fr) 1fr 1fr;
  }
  .guru-student-metric-v205.purple{grid-column:2}
  .guru-detail-v205{grid-column:3}
}

/* Phone */
@media(max-width:700px){

  .guru-students-v200{gap:9px!important}

  /* Single banner closer to approved reference */
  .guru-students-hero-v203{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto 170px!important;
    min-height:0!important;
    overflow:hidden!important;
    border-radius:18px!important;
  }
  .guru-students-hero-copy-v203{
    padding:16px 14px 10px!important;
  }
  .guru-students-hero-copy-v203 h1{font-size:22px!important}
  .guru-students-hero-copy-v203 p{font-size:7.8px!important;line-height:1.42!important}
  .guru-students-hero-meta-v203{
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;margin-top:9px!important
  }
  .guru-students-hero-meta-v203>div{
    min-width:0!important;min-height:46px!important;padding:6px 7px!important;border-radius:11px!important
  }
  .guru-students-hero-meta-v203 img{width:25px!important;height:25px!important;flex-basis:25px!important}
  .guru-students-hero-meta-v203 small{font-size:5.4px!important}
  .guru-students-hero-meta-v203 strong{font-size:9.5px!important}
  .guru-students-hero-art-v203{
    position:relative!important;height:170px!important;min-height:170px!important
  }
  .guru-students-hero-art-v203 img{
    width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 48%!important
  }

  .guru-student-stats-v200{
    grid-template-columns:1fr 1fr!important;gap:7px!important
  }
  .guru-student-stats-v200 article{
    min-height:78px!important;padding:8px!important;grid-template-columns:36px minmax(0,1fr)!important;gap:6px!important
  }
  .guru-student-stats-v200 .icon{width:36px!important;height:36px!important;padding:5px!important;border-radius:10px!important}
  .guru-student-stats-v200 small{font-size:5.8px!important}
  .guru-student-stats-v200 strong{font-size:16px!important}
  .guru-student-stats-v200 em{font-size:5.2px!important}

  .guru-student-filter-card-v205{padding:10px;border-radius:15px}
  .guru-student-filter-title-v205{margin-bottom:8px}
  .guru-student-filter-title-v205>span{width:32px;height:32px;border-radius:9px}
  .guru-student-filter-title-v205 b{font-size:8.8px}
  .guru-student-filter-title-v205 small{font-size:5.8px}

  .guru-student-filter-v205{
    grid-template-columns:1fr 1fr!important;gap:7px!important
  }
  .guru-search-v205{
    grid-column:1/-1;height:39px;border-radius:10px
  }
  .guru-search-v205 input{height:37px;font-size:7.6px}
  .guru-student-filter-v205>select{
    height:39px;border-radius:10px;font-size:7px;padding:0 8px
  }
  .guru-student-filter-v205 .btn{
    height:39px;border-radius:10px;font-size:7px
  }
  .guru-reset-v205{grid-column:1/-1}
  .guru-filter-bottom-v205{
    padding-top:8px;min-height:34px;gap:7px
  }
  .guru-filter-bottom-v205>span{font-size:6px}
  .guru-filter-bottom-v205 label{font-size:6px}
  .guru-filter-bottom-v205 label select{height:28px;font-size:6px}

  .guru-student-list-v205{gap:8px}
  .guru-student-row-v205{
    min-height:0;
    padding:10px;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "main detail"
      "metric1 metric1"
      "metric2 metric3";
    gap:7px;
    border-radius:15px;
  }
  .guru-student-main-v205{grid-area:main;grid-template-columns:40px minmax(0,1fr);gap:7px}
  .guru-student-avatar-v205{width:40px;height:40px;border-radius:12px}
  .guru-student-name-v205 h3{font-size:8.8px}
  .guru-student-name-v205>span{font-size:5.9px}
  .guru-check-badge-v205{min-height:19px;margin-top:4px;padding:0 5px;font-size:5.3px}

  .guru-student-metric-v205{
    min-height:50px;
    padding:7px 6px 6px 28px;
    border-radius:9px
  }
  .guru-student-metric-v205:nth-of-type(2){grid-area:metric1}
  .guru-student-metric-v205:nth-of-type(3){grid-area:metric2}
  .guru-student-metric-v205:nth-of-type(4){grid-area:metric3}
  .guru-student-metric-v205 i{left:5px;top:7px;width:18px;height:18px;padding:3px;border-radius:6px}
  .guru-student-metric-v205>span{font-size:5.1px}
  .guru-student-metric-v205>strong{margin-top:2px;font-size:6.8px}
  .mini-progress-v205{height:4px;margin-top:5px}

  .guru-detail-v205{
    grid-area:detail;
    align-self:start;
    min-height:30px;
    padding:0 7px;
    border-radius:9px;
    font-size:5.9px;
    gap:3px;
  }
  .guru-detail-v205 b{font-size:12px}

  .guru-pagination-v205{
    min-height:55px;padding:9px;border-radius:14px;
    grid-template-columns:30px 1fr 30px;gap:7px
  }
  .guru-pagination-v205>a{width:30px;height:30px;border-radius:9px}
  .guru-pagination-v205>span{font-size:5.8px}
  .guru-pagination-v205 label{display:none}
}

/* Very small phones */
@media(max-width:380px){
  .guru-student-filter-v205{
    grid-template-columns:1fr!important
  }
  .guru-search-v205,
  .guru-reset-v205,
  .guru-filter-bottom-v205{
    grid-column:1!important
  }
  .guru-filter-bottom-v205{
    flex-direction:column;align-items:flex-start
  }
}


/* =========================================================
   KAIH v1.2.6 - GURU DATA SISWA REFERENCE-MATCH REFINEMENT
   Focus: proportions, whitespace, row density, hero composition.
   ========================================================= */

/* Desktop / wide */
.guru-students-v200{
  gap:12px !important;
}

.guru-students-hero-v203{
  min-height:242px !important;
  grid-template-columns:42% 58% !important;
  background:linear-gradient(135deg,#eaf6ff 0%,#dff0ff 52%,#d4eaff 100%) !important;
  border-radius:22px !important;
  box-shadow:0 10px 28px rgba(46,83,127,.065) !important;
}
.guru-students-hero-copy-v203{
  padding:30px 12px 28px 30px !important;
}
.guru-students-hero-copy-v203 h1{
  font-size:32px !important;
  margin:7px 0 7px !important;
}
.guru-students-hero-copy-v203 p{
  max-width:440px !important;
  font-size:10px !important;
  line-height:1.5 !important;
}
.guru-students-hero-meta-v203{
  margin-top:18px !important;
}
.guru-students-hero-meta-v203>div{
  min-width:160px !important;
  min-height:60px !important;
  border-radius:15px !important;
}
.guru-students-hero-art-v203{
  min-height:242px !important;
}
.guru-students-hero-art-v203:before{
  width:30% !important;
}
.guru-students-hero-art-v203 img{
  object-position:center !important;
}

/* stat cards */
.guru-student-stats-v200{
  gap:9px !important;
}
.guru-student-stats-v200 article{
  min-height:84px !important;
  padding:11px 12px !important;
  border-radius:16px !important;
}
.guru-student-stats-v200 .icon{
  width:45px !important;
  height:45px !important;
  padding:7px !important;
}
.guru-student-stats-v200 small{font-size:7px !important}
.guru-student-stats-v200 strong{font-size:20px !important}
.guru-student-stats-v200 em{font-size:6.3px !important}

/* filter closer to reference: one clean panel, less tall */
.guru-student-filter-card-v205{
  padding:12px 14px 11px !important;
  border-radius:17px !important;
}
.guru-student-filter-title-v205{
  margin-bottom:9px !important;
}
.guru-student-filter-title-v205>span{
  width:34px !important;
  height:34px !important;
  border-radius:10px !important;
}
.guru-student-filter-title-v205 b{font-size:9.8px !important}
.guru-student-filter-title-v205 small{font-size:6.6px !important}

.guru-student-filter-v205{
  grid-template-columns:minmax(300px,1fr) 165px 145px 105px 88px !important;
  gap:7px !important;
}
.guru-search-v205,
.guru-student-filter-v205>select,
.guru-student-filter-v205 .btn{
  height:40px !important;
  min-height:40px !important;
  border-radius:10px !important;
}
.guru-search-v205 input{height:38px !important;font-size:8.6px !important}
.guru-student-filter-v205>select{font-size:8px !important}
.guru-student-filter-v205 .btn{font-size:8px !important}
.guru-filter-bottom-v205{
  min-height:35px !important;
  padding-top:8px !important;
}

/* student rows - reference is wide, low, very clean */
.guru-student-list-v205{
  gap:9px !important;
}
.guru-student-row-v205{
  min-height:102px !important;
  padding:10px 12px !important;
  grid-template-columns:minmax(215px,1.35fr) minmax(150px,.92fr) minmax(130px,.75fr) minmax(112px,.68fr) 92px !important;
  gap:9px !important;
  border-radius:17px !important;
}
.guru-student-main-v205{
  grid-template-columns:50px minmax(0,1fr) !important;
  gap:9px !important;
}
.guru-student-avatar-v205{
  width:50px !important;
  height:50px !important;
  border-radius:50% !important;
  border:3px solid #f3f7fc !important;
  box-shadow:0 5px 14px rgba(45,82,128,.10) !important;
}
.guru-student-name-v205 h3{
  font-size:9.8px !important;
}
.guru-student-name-v205>span{
  font-size:6.6px !important;
}
.guru-check-badge-v205{
  min-height:20px !important;
  margin-top:5px !important;
  font-size:5.9px !important;
}

.guru-student-metric-v205{
  min-height:61px !important;
  padding:9px 8px 8px 37px !important;
  border-radius:12px !important;
}
.guru-student-metric-v205 i{
  left:7px !important;
  top:9px !important;
  width:24px !important;
  height:24px !important;
}
.guru-student-metric-v205>span{font-size:6.1px !important}
.guru-student-metric-v205>strong{font-size:9px !important}
.mini-progress-v205{height:4px !important;margin-top:7px !important}

.guru-detail-v205{
  min-height:38px !important;
  border-radius:10px !important;
  font-size:7px !important;
  background:#f3f7fc !important;
}

/* Mobile exacting */
@media(max-width:700px){

  body.role-guru .content{
    padding-left:9px !important;
    padding-right:9px !important;
  }

  .guru-students-v200{
    gap:8px !important;
  }

  .guru-students-hero-v203{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 150px !important;
    min-height:0 !important;
    border-radius:17px !important;
    overflow:hidden !important;
  }

  .guru-students-hero-copy-v203{
    padding:15px 13px 9px !important;
  }

  .guru-students-hero-copy-v203 .eyebrow{
    font-size:6.5px !important;
  }

  .guru-students-hero-copy-v203 h1{
    font-size:21px !important;
    margin:5px 0 4px !important;
  }

  .guru-students-hero-copy-v203 p{
    max-width:100% !important;
    font-size:7.2px !important;
    line-height:1.4 !important;
  }

  .guru-students-hero-meta-v203{
    margin-top:8px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
  }

  .guru-students-hero-meta-v203>div{
    min-width:0 !important;
    min-height:44px !important;
    padding:6px 7px !important;
    gap:6px !important;
    border-radius:11px !important;
  }

  .guru-students-hero-meta-v203 img{
    width:24px !important;
    height:24px !important;
    flex-basis:24px !important;
  }

  .guru-students-hero-meta-v203 small{font-size:5px !important}
  .guru-students-hero-meta-v203 strong{font-size:9px !important}

  .guru-students-hero-art-v203{
    position:relative !important;
    height:150px !important;
    min-height:150px !important;
  }

  .guru-students-hero-art-v203:before{
    height:32px !important;
    background:linear-gradient(180deg,#e7f4ff 0%,rgba(231,244,255,0) 100%) !important;
  }

  .guru-students-hero-art-v203 img{
    object-fit:cover !important;
    object-position:center 50% !important;
  }

  /* stats 2x2, compact */
  .guru-student-stats-v200{
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
  }

  .guru-student-stats-v200 article{
    min-height:72px !important;
    padding:8px !important;
    grid-template-columns:34px minmax(0,1fr) !important;
    gap:6px !important;
    border-radius:13px !important;
  }

  .guru-student-stats-v200 .icon{
    width:34px !important;
    height:34px !important;
    padding:5px !important;
    border-radius:10px !important;
  }

  .guru-student-stats-v200 small{font-size:5.2px !important}
  .guru-student-stats-v200 strong{font-size:15px !important}
  .guru-student-stats-v200 em{font-size:4.8px !important}

  /* filter */
  .guru-student-filter-card-v205{
    padding:9px !important;
    border-radius:14px !important;
  }

  .guru-student-filter-title-v205{
    margin-bottom:7px !important;
  }

  .guru-student-filter-title-v205>span{
    width:30px !important;
    height:30px !important;
    padding:6px !important;
  }

  .guru-student-filter-title-v205 b{font-size:8.2px !important}
  .guru-student-filter-title-v205 small{font-size:5.2px !important}

  .guru-student-filter-v205{
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
  }

  .guru-search-v205{
    grid-column:1/-1 !important;
    height:37px !important;
    min-height:37px !important;
  }

  .guru-search-v205 input{
    height:35px !important;
    font-size:6.9px !important;
  }

  .guru-student-filter-v205>select,
  .guru-student-filter-v205 .btn{
    height:37px !important;
    min-height:37px !important;
    font-size:6.5px !important;
  }

  .guru-reset-v205{
    grid-column:auto !important;
  }

  .guru-filter-bottom-v205{
    grid-column:1/-1 !important;
    min-height:29px !important;
    padding-top:6px !important;
  }

  .guru-filter-bottom-v205>span,
  .guru-filter-bottom-v205 label{
    font-size:5.4px !important;
  }

  .guru-filter-bottom-v205 label select{
    height:25px !important;
    font-size:5.4px !important;
  }

  /* cards like app rows */
  .guru-student-list-v205{
    gap:7px !important;
  }

  .guru-student-row-v205{
    min-height:0 !important;
    padding:9px !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "main detail"
      "metric1 metric1"
      "metric2 metric3" !important;
    gap:6px !important;
    border-radius:14px !important;
  }

  .guru-student-main-v205{
    grid-area:main !important;
    grid-template-columns:38px minmax(0,1fr) !important;
    gap:7px !important;
  }

  .guru-student-avatar-v205{
    width:38px !important;
    height:38px !important;
    border-radius:50% !important;
    border-width:2px !important;
  }

  .guru-student-name-v205 h3{
    font-size:8px !important;
  }

  .guru-student-name-v205>span{
    font-size:5.4px !important;
  }

  .guru-check-badge-v205{
    min-height:17px !important;
    margin-top:3px !important;
    padding:0 5px !important;
    font-size:4.8px !important;
  }

  .guru-student-metric-v205{
    min-height:45px !important;
    padding:6px 5px 5px 25px !important;
    border-radius:8px !important;
  }

  .guru-student-metric-v205:nth-of-type(2){grid-area:metric1 !important}
  .guru-student-metric-v205:nth-of-type(3){grid-area:metric2 !important}
  .guru-student-metric-v205:nth-of-type(4){grid-area:metric3 !important}

  .guru-student-metric-v205 i{
    left:5px !important;
    top:6px !important;
    width:16px !important;
    height:16px !important;
    padding:2px !important;
    border-radius:5px !important;
  }

  .guru-student-metric-v205>span{font-size:4.6px !important}
  .guru-student-metric-v205>strong{font-size:6.3px !important;margin-top:2px !important}
  .mini-progress-v205{height:3px !important;margin-top:4px !important}

  .guru-detail-v205{
    grid-area:detail !important;
    align-self:start !important;
    min-height:28px !important;
    padding:0 6px !important;
    border-radius:8px !important;
    font-size:5.2px !important;
    gap:2px !important;
  }

  .guru-detail-v205 b{font-size:11px !important}

  .guru-pagination-v205{
    min-height:50px !important;
    padding:8px !important;
    border-radius:13px !important;
    grid-template-columns:28px 1fr 28px !important;
    gap:6px !important;
  }

  .guru-pagination-v205>a{
    width:28px !important;
    height:28px !important;
    border-radius:8px !important;
  }

  .guru-pagination-v205>span{
    font-size:5.2px !important;
  }
}

/* keep 2-column filter even on 351px */
@media(max-width:380px){
  .guru-student-filter-v205{
    grid-template-columns:1fr 1fr !important;
  }
  .guru-search-v205,
  .guru-filter-bottom-v205{
    grid-column:1/-1 !important;
  }
}


/* =========================================================
   KAIH v1.2.7 - PREMIUM GURU STUDENT DETAIL MODAL
   ========================================================= */

.guru-detail-modal-v207 .modal-backdrop{
  background:rgba(25,39,61,.55)!important;
  backdrop-filter:blur(7px)!important;
}

.guru-detail-card-v207{
  width:min(1080px,calc(100% - 34px))!important;
  max-height:calc(100vh - 34px)!important;
  padding:0!important;
  overflow:hidden!important;
  margin:17px auto!important;
  border-radius:24px!important;
  border:1px solid rgba(255,255,255,.9)!important;
  box-shadow:0 34px 90px rgba(16,30,51,.30)!important;
  background:#f7faff!important;
}

/* Header */
.guru-detail-hero-v207{
  position:relative;
  min-height:122px;
  padding:20px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  background:
    radial-gradient(circle at 72% 14%,rgba(255,255,255,.8),transparent 22%),
    linear-gradient(135deg,#edf8ff 0%,#e4f1ff 58%,#d9eaff 100%);
  border-bottom:1px solid #dce8f4;
}
.guru-detail-profile-v207{
  display:grid;
  grid-template-columns:68px minmax(0,1fr);
  gap:14px;
  align-items:center;
}
.guru-detail-profile-v207>img{
  width:68px;height:68px;border-radius:21px;object-fit:cover;
  border:4px solid rgba(255,255,255,.95);
  box-shadow:0 10px 24px rgba(52,91,140,.14);
}
.guru-detail-profile-v207 h3{
  margin:5px 0 4px;
  color:#123e73;
  font-size:24px;
  letter-spacing:-.025em;
}
.guru-detail-profile-v207 p{
  margin:0;color:#6d86a5;font-size:9px
}
.guru-detail-badges-v207{
  margin-top:9px;
  display:flex;flex-wrap:wrap;gap:6px;
}
.guru-detail-badges-v207 span{
  min-height:24px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;
  font-size:6.7px;font-weight:850;
}
.guru-detail-badges-v207 .class{background:#e9f2ff;color:#2f69cf}
.guru-detail-badges-v207 .habit{background:#e4f8ec;color:#18875a}

.guru-detail-close-v207{
  width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center;
  text-decoration:none;
  color:#66809f;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(255,255,255,.95);
  font-size:23px;
  line-height:1;
  box-shadow:0 6px 16px rgba(47,81,125,.07);
}
.guru-detail-close-v207:hover{
  background:#fff;color:#2d6fd7
}

/* Body */
.guru-detail-content-v207{
  max-height:calc(100vh - 230px);
  overflow:auto;
  padding:18px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:14px;
}
.guru-detail-panel-v207{
  background:#fff;
  border:1px solid #e1e9f3;
  border-radius:18px;
  padding:15px;
  box-shadow:0 7px 20px rgba(36,71,113,.04);
}
.guru-detail-section-head-v207{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.guru-detail-section-head-v207>div>span{
  display:block;color:#8b9cb0;font-size:6.5px;font-weight:900;letter-spacing:.09em
}
.guru-detail-section-head-v207 h4{
  margin:4px 0 0;color:#173f73;font-size:15px
}
.guru-detail-section-head-v207>b{
  padding:5px 8px;border-radius:999px;background:#eef5ff;color:#2d6fd5;font-size:6.8px
}

/* Habits */
.guru-detail-habit-list-v207{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.guru-detail-habit-v207{
  min-height:66px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) 28px;
  gap:9px;
  align-items:center;
  padding:9px 10px;
  border:1px solid #e4ebf4;
  border-radius:13px;
  background:#fff;
}
.guru-detail-habit-v207.done{
  border-color:#bfe8d5;
  background:linear-gradient(145deg,#f8fffb,#effaf5);
}
.guru-detail-habit-icon-v207{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(145deg,#edf5ff,#e4efff);
  color:#2d6fd7;font-size:16px;
}
.guru-detail-habit-v207.done .guru-detail-habit-icon-v207{
  background:linear-gradient(145deg,#e5f9ee,#d7f3e5);
  color:#16955f;
}
.guru-detail-habit-copy-v207{min-width:0}
.guru-detail-habit-copy-v207 b{
  display:block;color:#173f73;font-size:9.5px
}
.guru-detail-habit-copy-v207 small{
  display:block;margin-top:3px;color:#8093aa;font-size:7.2px;line-height:1.35
}
.guru-detail-habit-state-v207{
  width:28px;height:28px;border-radius:9px;display:grid;place-items:center;
  background:#f4f7fb;color:#8b9aab;font-size:13px;
}
.guru-detail-habit-v207.done .guru-detail-habit-state-v207{
  background:#e2f8ec;color:#16865a
}

/* Right side */
.guru-detail-side-v207{
  display:grid;
  gap:14px;
  align-content:start;
}
.guru-reflection-card-v207{
  display:grid;
  gap:8px;
}
.guru-reflection-top-v207{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding-bottom:8px;border-bottom:1px solid #edf2f7;
}
.guru-reflection-top-v207 .date{
  padding:5px 8px;border-radius:999px;background:#edf4ff;color:#2f6fd7;font-size:6.8px;font-weight:850
}
.guru-reflection-top-v207 .mood{
  padding:5px 8px;border-radius:999px;background:#fff4dd;color:#b77518;font-size:6.8px;font-weight:850
}
.guru-reflection-item-v207{
  min-height:58px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:8px;
  padding:9px;
  border-radius:12px;
  background:#f8fbff;
  border:1px solid #edf2f7;
}
.guru-reflection-item-v207 i{
  width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
  font-style:normal;font-weight:900;
  background:#e7f7ef;color:#15965e;
}
.guru-reflection-item-v207.challenge i{background:#fff0db;color:#d9871e}
.guru-reflection-item-v207.plan i{background:#eaf2ff;color:#2f71df}
.guru-reflection-item-v207 small{
  display:block;color:#8496ad;font-size:6.4px
}
.guru-reflection-item-v207 p{
  margin:3px 0 0;color:#315478;font-size:7.6px;line-height:1.45
}

/* Portfolio */
.guru-portfolio-list-v207{
  display:grid;gap:8px
}
.guru-portfolio-item-v207{
  min-height:70px;
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  gap:9px;
  align-items:center;
  padding:9px;
  border:1px solid #e5ecf4;
  border-radius:13px;
  background:#fff;
}
.guru-portfolio-icon-v207{
  width:40px;height:40px;border-radius:11px;display:grid;place-items:center;
  background:#f0e8ff;color:#824fe3;font-size:16px
}
.guru-portfolio-item-v207 b{display:block;color:#173f73;font-size:9px}
.guru-portfolio-item-v207 span{display:block;margin-top:2px;color:#8496ad;font-size:6.4px}
.guru-portfolio-item-v207 p{
  margin:4px 0 0;color:#6f86a2;font-size:7px;line-height:1.4;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}

.guru-detail-empty-v207{
  min-height:120px;display:grid;place-items:center;align-content:center;text-align:center;
  color:#8496ad
}
.guru-detail-empty-v207>span{
  width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#edf5ff;color:#3776dc;font-size:17px
}
.guru-detail-empty-v207 b{margin-top:7px;color:#385a7d;font-size:8.5px}
.guru-detail-empty-v207 small{margin-top:3px;font-size:6.8px}

/* Footer */
.guru-detail-foot-v207{
  min-height:68px;
  padding:12px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:#fff;
  border-top:1px solid #e1e9f3;
}
.guru-detail-foot-v207>div span{
  display:block;color:#8a9baf;font-size:6.4px
}
.guru-detail-foot-v207>div b{
  display:block;margin-top:2px;color:#315478;font-size:8px
}
.guru-detail-foot-v207 .btn{
  min-width:92px;height:38px;border-radius:11px;font-size:8px
}

/* Tablet */
@media(max-width:900px){
  .guru-detail-content-v207{
    grid-template-columns:1fr;
  }
  .guru-detail-side-v207{
    grid-template-columns:1fr 1fr;
  }
}

/* Mobile */
@media(max-width:640px){
  .guru-detail-card-v207{
    width:calc(100% - 14px)!important;
    max-height:calc(100vh - 14px)!important;
    margin:7px auto!important;
    border-radius:18px!important;
  }

  .guru-detail-hero-v207{
    min-height:104px;
    padding:14px;
    align-items:flex-start;
  }

  .guru-detail-profile-v207{
    grid-template-columns:52px minmax(0,1fr);
    gap:10px;
  }

  .guru-detail-profile-v207>img{
    width:52px;height:52px;border-radius:16px;border-width:3px;
  }

  .guru-detail-profile-v207 h3{
    font-size:18px;
    margin-top:4px;
  }

  .guru-detail-profile-v207 p{
    font-size:6.6px;
    line-height:1.4;
  }

  .guru-detail-badges-v207{
    margin-top:6px;
  }

  .guru-detail-badges-v207 span{
    min-height:20px;
    padding:0 6px;
    font-size:5.5px;
  }

  .guru-detail-close-v207{
    width:34px;height:34px;border-radius:10px;font-size:19px;
    flex:0 0 34px;
  }

  .guru-detail-content-v207{
    max-height:calc(100vh - 198px);
    padding:10px;
    grid-template-columns:1fr;
    gap:9px;
  }

  .guru-detail-side-v207{
    grid-template-columns:1fr;
    gap:9px;
  }

  .guru-detail-panel-v207{
    padding:11px;
    border-radius:15px;
  }

  .guru-detail-section-head-v207{
    min-height:40px;
    margin-bottom:7px;
  }

  .guru-detail-section-head-v207 h4{
    font-size:12px;
  }

  .guru-detail-section-head-v207>div>span{
    font-size:5.5px;
  }

  .guru-detail-section-head-v207>b{
    font-size:5.7px;
  }

  .guru-detail-habit-list-v207{
    gap:6px;
  }

  .guru-detail-habit-v207{
    min-height:55px;
    grid-template-columns:36px minmax(0,1fr) 24px;
    gap:7px;
    padding:7px 8px;
    border-radius:11px;
  }

  .guru-detail-habit-icon-v207{
    width:36px;height:36px;border-radius:10px;font-size:13px
  }

  .guru-detail-habit-copy-v207 b{font-size:8px}
  .guru-detail-habit-copy-v207 small{font-size:6px}
  .guru-detail-habit-state-v207{width:24px;height:24px;border-radius:8px;font-size:11px}

  .guru-reflection-item-v207{
    min-height:52px;
    grid-template-columns:27px minmax(0,1fr);
    gap:7px;
    padding:7px;
    border-radius:10px;
  }

  .guru-reflection-item-v207 i{
    width:27px;height:27px;border-radius:8px;
  }

  .guru-reflection-item-v207 small{font-size:5.5px}
  .guru-reflection-item-v207 p{font-size:6.5px}

  .guru-portfolio-item-v207{
    min-height:60px;
    grid-template-columns:34px minmax(0,1fr);
    gap:7px;
    padding:7px;
    border-radius:11px;
  }

  .guru-portfolio-icon-v207{
    width:34px;height:34px;border-radius:9px;font-size:14px
  }

  .guru-portfolio-item-v207 b{font-size:7.5px}
  .guru-portfolio-item-v207 span{font-size:5.5px}
  .guru-portfolio-item-v207 p{font-size:6px}

  .guru-detail-foot-v207{
    min-height:58px;
    padding:9px 12px;
  }

  .guru-detail-foot-v207 .btn{
    min-width:78px;height:34px;font-size:7px
  }
}


/* =========================================================
   KAIH v1.2.8 - PREMIUM ICON STUDENT DETAIL REFERENCE MATCH
   ========================================================= */

.guru-detail-card-v207{
  width:min(1180px,calc(100% - 34px))!important;
}

.guru-detail-hero-v207{
  min-height:155px!important;
  padding:22px 25px!important;
  background:
    radial-gradient(circle at 76% 10%,rgba(255,255,255,.82),transparent 19%),
    radial-gradient(circle at 92% 25%,rgba(255,255,255,.38),transparent 24%),
    linear-gradient(135deg,#edf8ff 0%,#e3f2ff 56%,#d6e9ff 100%)!important;
}

.guru-detail-quote-v208{
  margin-left:auto;
  margin-right:52px;
  align-self:center;
  max-width:310px;
}
.guru-detail-quote-v208 i{
  display:block;
  width:34px;height:4px;border-radius:999px;
  margin-bottom:9px;
  background:#2f72e6;
}
.guru-detail-quote-v208 p{
  margin:0;
  color:#52739a;
  font-size:10px;
  line-height:1.55;
  font-style:italic;
}

.guru-detail-content-v207{
  max-height:calc(100vh - 244px)!important;
  padding:17px!important;
  grid-template-columns:minmax(0,1fr) minmax(0,.98fr)!important;
  gap:14px!important;
}

.guru-detail-panel-v207{
  border-radius:18px!important;
  padding:14px!important;
}

.guru-detail-section-head-v207{
  min-height:50px!important;
  margin-bottom:9px!important;
}

.guru-detail-title-v208{
  display:flex;
  align-items:center;
  gap:10px;
}
.guru-detail-title-v208>i{
  width:42px;height:42px;padding:7px;border-radius:12px;
  display:grid;place-items:center;
  background:#eef5ff;
  flex:0 0 42px;
}
.guru-detail-title-v208>i img{
  width:100%;height:100%;object-fit:contain;display:block
}
.guru-detail-title-v208>span{display:block}
.guru-detail-title-v208 small{
  display:block;color:#8598ae;font-size:6.3px;font-weight:900;letter-spacing:.08em
}
.guru-detail-title-v208 h4{
  margin:4px 0 0!important;
  font-size:15px!important;
}

.guru-detail-habit-list-v207{gap:7px!important}
.guru-detail-habit-v207{
  min-height:61px!important;
  grid-template-columns:42px minmax(0,1fr) 30px!important;
  padding:8px 9px!important;
  border-radius:12px!important;
}
.guru-detail-habit-icon-v207{
  padding:7px!important;
}
.guru-detail-habit-icon-v207 img{
  width:100%;height:100%;object-fit:contain;display:block
}
.guru-detail-habit-v207.done .guru-detail-habit-icon-v207{
  background:linear-gradient(145deg,#e9f9f1,#dff5e9)!important;
}

.guru-reflection-card-v207{gap:7px!important}
.guru-reflection-item-v207{
  min-height:60px!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  gap:9px!important;
  padding:9px!important;
}
.guru-reflection-item-v207 i{
  width:34px!important;height:34px!important;padding:5px!important;
  background:transparent!important;
}
.guru-reflection-item-v207 i img{
  width:100%;height:100%;object-fit:contain;display:block
}
.guru-reflection-item-v207.good{
  background:linear-gradient(145deg,#f7fffb,#eef9f4)!important;
}
.guru-reflection-item-v207.challenge{
  background:linear-gradient(145deg,#fffaf2,#fff4e7)!important;
}
.guru-reflection-item-v207.plan{
  background:linear-gradient(145deg,#f7fbff,#eff6ff)!important;
}

.guru-portfolio-item-v207{
  min-height:82px!important;
  grid-template-columns:50px minmax(0,1fr) 18px!important;
}
.guru-portfolio-item-v207:after{
  content:"›";
  color:#2f73e6;
  font-size:22px;
  align-self:center;
}
.guru-portfolio-icon-v207{
  width:50px!important;height:50px!important;padding:8px!important;
  background:#f1e8ff!important;
}
.guru-portfolio-icon-v207 img{
  width:100%;height:100%;object-fit:contain;display:block
}

.guru-detail-foot-v207{
  min-height:70px!important;
  padding:11px 20px!important;
}

.guru-detail-lastseen-v208{
  display:flex;align-items:center;gap:9px
}
.guru-detail-lastseen-v208>img{
  width:28px;height:28px;object-fit:contain
}
.guru-detail-lastseen-v208 small{
  display:block;color:#8799ae;font-size:6.2px
}
.guru-detail-lastseen-v208 b{
  display:block;margin-top:2px;color:#315478;font-size:8px
}
.guru-detail-foot-actions-v208{
  display:flex;align-items:center;gap:8px
}
.guru-download-v208{
  min-height:39px;padding:0 14px;border-radius:11px;
  display:inline-flex;align-items:center;gap:7px;
  border:1px solid #dce7f4;background:#f3f7fc;color:#2865bd;
  font-size:7.8px;font-weight:850;cursor:pointer
}
.guru-download-v208 img{
  width:17px;height:17px
}
.guru-download-v208:hover{background:#eaf3ff}

.guru-close-btn-v208{
  min-width:92px!important;height:39px!important;
  border-radius:11px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;
  background:linear-gradient(135deg,#3479ef,#2868e7)!important;
  border:0!important;color:#fff!important;
}
.guru-close-btn-v208 span{color:#fff!important}

@media(max-width:900px){
  .guru-detail-quote-v208{display:none}
}

@media(max-width:640px){
  .guru-detail-hero-v207{
    min-height:108px!important;
    padding:13px!important;
  }
  .guru-detail-title-v208>i{
    width:36px;height:36px;flex-basis:36px;padding:6px;border-radius:10px
  }
  .guru-detail-title-v208 small{font-size:5.3px}
  .guru-detail-title-v208 h4{font-size:11.5px!important}

  .guru-detail-habit-v207{
    min-height:53px!important;
    grid-template-columns:35px minmax(0,1fr) 23px!important;
    gap:7px!important;
    padding:7px!important;
  }
  .guru-detail-habit-icon-v207{
    width:35px!important;height:35px!important;padding:6px!important
  }

  .guru-reflection-item-v207{
    min-height:51px!important;
    grid-template-columns:27px minmax(0,1fr)!important;
    gap:7px!important;padding:7px!important
  }
  .guru-reflection-item-v207 i{
    width:27px!important;height:27px!important;padding:4px!important
  }

  .guru-portfolio-item-v207{
    min-height:60px!important;
    grid-template-columns:35px minmax(0,1fr) 13px!important
  }
  .guru-portfolio-icon-v207{
    width:35px!important;height:35px!important;padding:6px!important
  }

  .guru-detail-foot-v207{
    min-height:60px!important;padding:8px 10px!important
  }
  .guru-detail-lastseen-v208>img{width:23px;height:23px}
  .guru-detail-lastseen-v208 small{font-size:5px}
  .guru-detail-lastseen-v208 b{font-size:6.4px}
  .guru-download-v208{
    min-height:34px;padding:0 8px;font-size:6px
  }
  .guru-download-v208 img{width:14px;height:14px}
  .guru-close-btn-v208{
    min-width:68px!important;height:34px!important;font-size:6.4px!important
  }
}

@media print{
  body *{visibility:hidden!important}
  .guru-detail-modal-v207,
  .guru-detail-modal-v207 *{visibility:visible!important}
  .guru-detail-modal-v207{
    position:absolute!important;inset:0!important;background:#fff!important
  }
  .guru-detail-card-v207{
    position:static!important;width:100%!important;max-height:none!important;margin:0!important;
    box-shadow:none!important;border:0!important
  }
  .guru-detail-content-v207{
    max-height:none!important;overflow:visible!important
  }
  .guru-detail-close-v207,
  .guru-detail-foot-actions-v208{display:none!important}
}


/* =========================================================
   KAIH v1.2.10 - GURU PERKEMBANGAN TRUE PREMIUM REDESIGN
   ========================================================= */
.guru-progress-v210{display:grid;gap:14px}

/* Hero */
.guru-progress-hero-v210{
  position:relative;
  min-height:230px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr);
  align-items:stretch;
  border:1px solid #d5e6f5;
  border-radius:25px;
  background:
    radial-gradient(circle at 35% 15%,rgba(255,255,255,.9),transparent 24%),
    linear-gradient(135deg,#edf8ff 0%,#e2f2ff 56%,#d2e8ff 100%);
  box-shadow:0 15px 36px rgba(42,80,129,.08);
}
.guru-progress-copy-v210{
  position:relative;z-index:4;
  padding:32px 22px 28px 32px;
  align-self:center;
}
.guru-progress-copy-v210 h1{
  margin:7px 0 6px;color:#113f76;font-size:32px;line-height:1.05;letter-spacing:-.035em
}
.guru-progress-copy-v210 p{
  margin:0;max-width:520px;color:#5d7da3;font-size:10.5px;line-height:1.55
}
.guru-progress-hero-chips-v210{
  display:flex;gap:7px;flex-wrap:wrap;margin-top:16px
}
.guru-progress-hero-chips-v210 span{
  min-height:27px;padding:0 9px;border-radius:999px;display:inline-flex;align-items:center;
  background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.95);
  color:#2b67be;font-size:6.8px;font-weight:850;
  box-shadow:0 6px 14px rgba(40,78,128,.05)
}
.guru-progress-art-v210{
  position:relative;overflow:hidden
}
.guru-progress-art-v210:before{
  content:"";position:absolute;inset:0 auto 0 0;width:38%;z-index:2;
  background:linear-gradient(90deg,#e2f2ff 0%,rgba(226,242,255,.65) 48%,rgba(226,242,255,0) 100%)
}
.guru-progress-art-v210 img{
  width:100%;height:100%;display:block;object-fit:cover;object-position:center
}
.guru-progress-score-v210{
  position:absolute;right:22px;top:22px;z-index:5;
  width:150px;min-height:116px;padding:15px;
  border-radius:18px;background:rgba(255,255,255,.88);
  border:1px solid rgba(255,255,255,.98);
  box-shadow:0 12px 26px rgba(37,76,127,.10);backdrop-filter:blur(7px)
}
.guru-progress-score-v210 span{display:block;color:#8295ab;font-size:7px}
.guru-progress-score-v210 strong{display:block;margin-top:4px;color:#2f70e4;font-size:29px;line-height:1}
.guru-progress-score-v210 small{display:block;margin-top:5px;color:#8194aa;font-size:6.5px}
.guru-progress-score-track-v210{
  height:5px;margin-top:12px;border-radius:999px;background:#e8eef6;overflow:hidden
}
.guru-progress-score-track-v210 i{
  display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2f72ea,#68aaff)
}

/* stats */
.guru-progress-stats-v210{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px
}
.guru-progress-stats-v210 article{
  min-height:92px;padding:12px 13px;
  display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:center;
  border:1px solid #dfe8f3;border-radius:18px;background:#fff;
  box-shadow:0 8px 22px rgba(35,70,113,.045)
}
.guru-progress-stats-v210 .icon{
  width:48px;height:48px;padding:6px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(145deg,#f5f9ff,#e8f2ff)
}
.guru-progress-stats-v210 .icon img{width:100%;height:100%;object-fit:contain}
.guru-progress-stats-v210 small{display:block;color:#8497ad;font-size:7px}
.guru-progress-stats-v210 strong{display:block;margin-top:2px;color:#153f73;font-size:21px;line-height:1}
.guru-progress-stats-v210 em{display:block;margin-top:5px;color:#8799ae;font-size:6.4px;font-style:normal}

/* filter */
.guru-progress-filter-v210{
  padding:13px 14px;
  border:1px solid #dfe8f3;border-radius:19px;background:#fff;
  box-shadow:0 8px 22px rgba(35,70,113,.04)
}
.guru-progress-filter-title-v210{
  display:flex;align-items:center;gap:9px;margin-bottom:10px
}
.guru-progress-filter-title-v210>span{
  width:36px;height:36px;padding:7px;border-radius:11px;display:grid;place-items:center;background:#eaf3ff
}
.guru-progress-filter-title-v210 img{width:100%;height:100%;object-fit:contain}
.guru-progress-filter-title-v210 b{display:block;color:#174578;font-size:10px}
.guru-progress-filter-title-v210 small{display:block;margin-top:2px;color:#899baf;font-size:6.8px}
.guru-progress-filter-v210 form{
  display:grid;grid-template-columns:180px 180px 108px 88px auto;gap:8px;align-items:end
}
.field-v210 label{display:block;margin:0 0 5px 2px;color:#8395ab;font-size:6.5px}
.field-v210 select{
  width:100%;height:42px;border:1px solid #d8e4f1;border-radius:11px;background:#fff;
  padding:0 10px;color:#274b73;font-size:8px
}
.guru-progress-filter-v210 .btn{
  height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:8px
}
.guru-progress-apply-v210{
  background:linear-gradient(135deg,#3479ef,#2868e7)!important;
  box-shadow:0 8px 18px rgba(47,112,231,.17)!important
}
.guru-progress-reset-v210{
  background:#eef3f9!important;color:#2c68bf!important;border-color:#e0e8f2!important
}
.guru-progress-count-v210{
  justify-self:end;align-self:center;padding:6px 9px;border-radius:999px;background:#edf5ff;color:#2f6fd7;font-size:6.8px;font-weight:850
}

/* table card */
.guru-progress-table-card-v210{
  overflow:hidden;border:1px solid #dfe8f3;border-radius:20px;background:#fff;
  box-shadow:0 10px 26px rgba(35,70,113,.045)
}
.guru-progress-table-head-v210{
  min-height:66px;padding:13px 15px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  border-bottom:1px solid #e6edf5;background:linear-gradient(180deg,#fff,#fbfdff)
}
.guru-progress-table-head-v210 span{display:block;color:#8798ad;font-size:6.4px;font-weight:900;letter-spacing:.08em}
.guru-progress-table-head-v210 h2{margin:4px 0 0;color:#173f73;font-size:14px}
.guru-progress-table-head-v210>small{color:#8799ae;font-size:6.6px}
.guru-progress-table-scroll-v210{overflow-x:auto}
.guru-progress-table-card-v210 table{width:100%;border-collapse:separate;border-spacing:0}
.guru-progress-table-card-v210 th{
  height:43px;padding:9px 12px;background:#f6f9fd;color:#6c839f;
  font-size:6.8px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;text-align:left;
  border-bottom:1px solid #e4ebf4
}
.guru-progress-table-card-v210 td{
  height:61px;padding:9px 12px;color:#274b73;font-size:8px;border-bottom:1px solid #edf2f7
}
.guru-progress-table-card-v210 tbody tr:last-child td{border-bottom:0}
.guru-progress-table-card-v210 tbody tr{transition:background .16s ease}
.guru-progress-table-card-v210 tbody tr:hover td{background:#fbfdff}
.guru-progress-student-v210{
  min-width:180px;display:grid;grid-template-columns:38px minmax(0,1fr);gap:8px;align-items:center
}
.guru-progress-student-v210 img{
  width:38px;height:38px;border-radius:50%;object-fit:cover;border:2px solid #f2f6fb;
  box-shadow:0 5px 12px rgba(47,84,132,.08)
}
.guru-progress-student-v210 b{display:block;color:#173f73;font-size:8.5px}
.guru-progress-student-v210 small{display:block;margin-top:2px;color:#8597ad;font-size:6px}
.guru-progress-class-v210{
  min-height:23px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;
  background:#edf3ff;color:#2d67d1;font-size:6.4px;font-weight:850
}
.guru-progress-table-card-v210 td>b{color:#173f73}
.guru-progress-table-card-v210 td>span:not(.guru-progress-class-v210):not(.guru-progress-reflection-v210){color:#8194aa}
.guru-progress-reflection-v210{
  min-height:23px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;
  background:#f0e8ff;color:#7d52d9;font-size:6.3px;font-weight:850
}
.guru-progress-meter-v210{
  min-width:230px;display:grid;grid-template-columns:minmax(120px,1fr) 42px;gap:8px;align-items:center
}
.guru-progress-meter-v210>div{
  height:7px;border-radius:999px;background:#eaf0f6;overflow:hidden
}
.guru-progress-meter-v210 i{
  display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2f72ea,#65a7ff)
}
.guru-progress-meter-v210>b{
  text-align:right;color:#173f73;font-size:7.5px
}
.guru-progress-meter-v210>b.good{color:#167b55}
.guru-progress-meter-v210>b.mid{color:#c48321}
.guru-progress-meter-v210>b.low{color:#d25060}

/* responsive */
@media(max-width:1050px){
  .guru-progress-hero-v210{grid-template-columns:1fr 360px}
  .guru-progress-score-v210{right:16px;top:16px;width:135px}
  .guru-progress-stats-v210{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .guru-progress-v210{gap:9px}
  .guru-progress-hero-v210{
    min-height:330px;display:block;border-radius:19px
  }
  .guru-progress-copy-v210{
    padding:18px 15px 10px;min-height:155px
  }
  .guru-progress-copy-v210 h1{font-size:23px}
  .guru-progress-copy-v210 p{max-width:92%;font-size:7.8px}
  .guru-progress-hero-chips-v210{margin-top:9px}
  .guru-progress-hero-chips-v210 span{min-height:22px;font-size:5.5px}
  .guru-progress-art-v210{
    position:absolute;left:0;right:0;bottom:0;height:185px
  }
  .guru-progress-art-v210:before{
    inset:0;width:auto;height:45px;background:linear-gradient(180deg,#e7f4ff,rgba(231,244,255,0))
  }
  .guru-progress-art-v210 img{object-position:center 48%}
  .guru-progress-score-v210{
    top:auto;bottom:10px;right:10px;width:118px;min-height:82px;padding:10px;border-radius:14px
  }
  .guru-progress-score-v210 strong{font-size:22px}
  .guru-progress-score-v210 span,.guru-progress-score-v210 small{font-size:5.5px}

  .guru-progress-stats-v210{grid-template-columns:1fr 1fr;gap:7px}
  .guru-progress-stats-v210 article{
    min-height:78px;padding:8px;grid-template-columns:36px minmax(0,1fr);gap:7px;border-radius:14px
  }
  .guru-progress-stats-v210 .icon{width:36px;height:36px;padding:5px;border-radius:10px}
  .guru-progress-stats-v210 small{font-size:5.4px}
  .guru-progress-stats-v210 strong{font-size:16px}
  .guru-progress-stats-v210 em{font-size:4.9px}

  .guru-progress-filter-v210{padding:10px;border-radius:15px}
  .guru-progress-filter-title-v210{margin-bottom:8px}
  .guru-progress-filter-v210 form{grid-template-columns:1fr 1fr;gap:7px}
  .guru-progress-filter-v210 .btn{height:38px}
  .guru-progress-count-v210{grid-column:1/-1;justify-self:start}
  .field-v210 select{height:38px;font-size:6.6px}
  .field-v210 label{font-size:5.5px}

  .guru-progress-table-card-v210{border-radius:16px}
  .guru-progress-table-head-v210{min-height:58px;padding:11px}
  .guru-progress-table-head-v210 h2{font-size:12px}
  .guru-progress-table-head-v210>small{display:none}
  .guru-progress-table-card-v210 table{min-width:760px}
}


/* =========================================================
   KAIH v1.2.11 - PREMIUM PROGRESS SUMMARY CARDS
   Match approved premium reference cards
   ========================================================= */
.guru-progress-stats-v211{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.guru-progress-stats-v211 article{
  position:relative;
  min-height:118px;
  overflow:hidden;
  display:grid;
  grid-template-columns:64px minmax(0,1fr) 88px;
  gap:13px;
  align-items:center;
  padding:16px 17px;
  border:1px solid #dce7f3;
  border-radius:22px;
  background:
    radial-gradient(circle at 92% 24%,rgba(255,255,255,.95),transparent 22%),
    linear-gradient(145deg,#ffffff 0%,#fbfdff 100%);
  box-shadow:0 11px 28px rgba(37,73,118,.06);
}

.guru-progress-stats-v211 article.green{
  background:linear-gradient(145deg,#ffffff 0%,#f9fffc 100%);
}
.guru-progress-stats-v211 article.purple{
  background:linear-gradient(145deg,#ffffff 0%,#fdfaff 100%);
}
.guru-progress-stats-v211 article.orange{
  background:linear-gradient(145deg,#ffffff 0%,#fffdf8 100%);
}

.guru-progress-stat-icon-v211{
  width:64px;
  height:64px;
  flex:0 0 64px;
  border-radius:20px;
  display:grid;
  place-items:center;
  background:#f6f9ff;
}
.guru-progress-stat-icon-v211 img{
  width:64px;
  height:64px;
  display:block;
  object-fit:contain;
}

.guru-progress-stat-copy-v211{
  position:relative;
  z-index:2;
  min-width:0;
}
.guru-progress-stat-copy-v211 span{
  display:block;
  color:#5d7697;
  font-size:9px;
}
.guru-progress-stat-copy-v211 strong{
  display:block;
  margin-top:4px;
  color:#0d3e78;
  font-size:29px;
  line-height:1;
  letter-spacing:-.025em;
}
.guru-progress-stat-copy-v211 small{
  display:block;
  margin-top:8px;
  color:#8194aa;
  font-size:7.5px;
}

.guru-progress-mini-chart-v211,
.guru-progress-mini-bars-v211,
.guru-progress-spark-v211{
  align-self:end;
  justify-self:end;
  width:82px;
  height:54px;
  opacity:.68;
}

.guru-progress-mini-chart-v211{
  display:flex;
  align-items:end;
  justify-content:flex-end;
  gap:5px;
}
.guru-progress-mini-chart-v211 i{
  width:11px;
  border-radius:6px 6px 3px 3px;
  background:linear-gradient(180deg,#7db5ff,#4e86ee);
}
.guru-progress-mini-chart-v211 i:nth-child(1){height:18px}
.guru-progress-mini-chart-v211 i:nth-child(2){height:26px}
.guru-progress-mini-chart-v211 i:nth-child(3){height:36px}
.guru-progress-mini-chart-v211 i:nth-child(4){height:49px}

.guru-progress-mini-bars-v211{
  display:flex;
  align-items:end;
  justify-content:flex-end;
  gap:7px;
}
.guru-progress-mini-bars-v211 i{
  width:14px;
  border-radius:6px 6px 3px 3px;
}
.guru-progress-mini-bars-v211.green i{
  background:linear-gradient(180deg,#8ae2bf,#55cfa2);
}
.guru-progress-mini-bars-v211.green i:nth-child(1){height:20px}
.guru-progress-mini-bars-v211.green i:nth-child(2){height:33px}
.guru-progress-mini-bars-v211.green i:nth-child(3){height:49px}

.guru-progress-mini-bars-v211.orange i{
  background:linear-gradient(180deg,#ffd58c,#f7b453);
}
.guru-progress-mini-bars-v211.orange i:nth-child(1){height:18px}
.guru-progress-mini-bars-v211.orange i:nth-child(2){height:30px}
.guru-progress-mini-bars-v211.orange i:nth-child(3){height:50px}

.guru-progress-spark-v211{
  display:grid;
  place-items:center;
  color:#9a72ef;
}
.guru-progress-spark-v211 svg{
  width:100%;
  height:100%;
  overflow:visible;
}

/* Responsive */
@media(max-width:1100px){
  .guru-progress-stats-v211{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:700px){
  .guru-progress-stats-v211{
    grid-template-columns:1fr 1fr;
    gap:7px;
  }

  .guru-progress-stats-v211 article{
    min-height:92px;
    grid-template-columns:44px minmax(0,1fr);
    grid-template-rows:auto auto;
    gap:8px;
    padding:10px;
    border-radius:16px;
  }

  .guru-progress-stat-icon-v211,
  .guru-progress-stat-icon-v211 img{
    width:44px;
    height:44px;
    border-radius:14px;
  }

  .guru-progress-stat-copy-v211 span{
    font-size:6px;
  }

  .guru-progress-stat-copy-v211 strong{
    font-size:18px;
  }

  .guru-progress-stat-copy-v211 small{
    margin-top:4px;
    font-size:5.3px;
  }

  .guru-progress-mini-chart-v211,
  .guru-progress-mini-bars-v211,
  .guru-progress-spark-v211{
    grid-column:1/-1;
    width:100%;
    height:22px;
    margin-top:-4px;
    justify-self:stretch;
    opacity:.38;
  }

  .guru-progress-mini-chart-v211,
  .guru-progress-mini-bars-v211{
    justify-content:flex-end;
  }

  .guru-progress-mini-chart-v211 i,
  .guru-progress-mini-bars-v211 i{
    width:7px!important;
  }

  .guru-progress-mini-chart-v211 i:nth-child(1),
  .guru-progress-mini-bars-v211 i:nth-child(1){height:7px!important}
  .guru-progress-mini-chart-v211 i:nth-child(2),
  .guru-progress-mini-bars-v211 i:nth-child(2){height:12px!important}
  .guru-progress-mini-chart-v211 i:nth-child(3),
  .guru-progress-mini-bars-v211 i:nth-child(3){height:17px!important}
  .guru-progress-mini-chart-v211 i:nth-child(4){height:21px!important}
}


/* =========================================================
   KAIH v1.2.12 - GURU PROGRESS TABLE READABILITY
   Fokus: keterbacaan teks, kontras, spacing, hierarki visual.
   ========================================================= */

.guru-progress-table-card-v210{
  border-radius:20px !important;
  background:#fff !important;
}

/* Head area lebih jelas */
.guru-progress-table-head-v210{
  min-height:74px !important;
  padding:16px 18px !important;
}
.guru-progress-table-head-v210 span{
  font-size:7px !important;
  color:#7288a2 !important;
  letter-spacing:.10em !important;
}
.guru-progress-table-head-v210 h2{
  margin-top:5px !important;
  font-size:17px !important;
  line-height:1.2 !important;
  color:#123f73 !important;
}
.guru-progress-table-head-v210>small{
  font-size:7px !important;
  color:#8a9caf !important;
}

/* Table typography */
.guru-progress-table-card-v210 th{
  height:48px !important;
  padding:11px 14px !important;
  color:#607a98 !important;
  font-size:7.5px !important;
  font-weight:900 !important;
  letter-spacing:.055em !important;
  background:#f5f8fc !important;
}

.guru-progress-table-card-v210 td{
  min-height:70px !important;
  height:70px !important;
  padding:11px 14px !important;
  color:#284d76 !important;
  font-size:8.6px !important;
  line-height:1.35 !important;
}

/* Student identity */
.guru-progress-student-v210{
  min-width:210px !important;
  grid-template-columns:46px minmax(0,1fr) !important;
  gap:10px !important;
}
.guru-progress-student-v210 img{
  width:46px !important;
  height:46px !important;
  border:3px solid #f1f6fb !important;
  box-shadow:0 5px 14px rgba(47,84,132,.09) !important;
}
.guru-progress-student-v210 b{
  font-size:9.5px !important;
  font-weight:850 !important;
  color:#123f73 !important;
}
.guru-progress-student-v210 small{
  margin-top:3px !important;
  font-size:6.7px !important;
  color:#8194aa !important;
}

/* Class badge */
.guru-progress-class-v210{
  min-height:28px !important;
  padding:0 10px !important;
  font-size:7px !important;
  border-radius:999px !important;
  background:#edf3ff !important;
  color:#2c67cf !important;
  font-weight:900 !important;
}

/* Numeric columns */
.guru-progress-table-card-v210 td>b{
  font-size:9px !important;
  color:#173f73 !important;
  font-weight:900 !important;
}
.guru-progress-table-card-v210 td>span:not(.guru-progress-class-v210):not(.guru-progress-reflection-v210){
  color:#7e91a8 !important;
  font-size:7.2px !important;
}

/* Reflection badge */
.guru-progress-reflection-v210{
  min-height:27px !important;
  padding:0 9px !important;
  font-size:6.8px !important;
  background:#f0e8ff !important;
  color:#7a4ed7 !important;
  font-weight:900 !important;
}

/* Progress meter */
.guru-progress-meter-v210{
  min-width:300px !important;
  grid-template-columns:minmax(180px,1fr) 48px !important;
  gap:10px !important;
}
.guru-progress-meter-v210>div{
  height:9px !important;
  background:#e8eef5 !important;
}
.guru-progress-meter-v210 i{
  background:linear-gradient(90deg,#2f72ea,#68aaff) !important;
}
.guru-progress-meter-v210>b{
  font-size:8.5px !important;
  font-weight:900 !important;
}
.guru-progress-meter-v210>b.good{
  color:#16845b !important;
}
.guru-progress-meter-v210>b.mid{
  color:#c18420 !important;
}
.guru-progress-meter-v210>b.low{
  color:#d24b5b !important;
}

/* Hover lebih halus tapi membantu scanning */
.guru-progress-table-card-v210 tbody tr:hover td{
  background:#f9fbfe !important;
}

/* Zebra subtle untuk bantu keterbacaan baris panjang */
.guru-progress-table-card-v210 tbody tr:nth-child(even) td{
  background:#fcfdff;
}
.guru-progress-table-card-v210 tbody tr:nth-child(even):hover td{
  background:#f8fbff;
}

/* Responsive readability */
@media(max-width:700px){
  .guru-progress-table-head-v210{
    min-height:64px !important;
    padding:12px !important;
  }
  .guru-progress-table-head-v210 h2{
    font-size:14px !important;
  }
  .guru-progress-table-card-v210 table{
    min-width:840px !important;
  }
  .guru-progress-table-card-v210 th{
    font-size:6.6px !important;
    padding:9px 11px !important;
  }
  .guru-progress-table-card-v210 td{
    height:64px !important;
    padding:9px 11px !important;
    font-size:7.8px !important;
  }
  .guru-progress-student-v210{
    min-width:190px !important;
    grid-template-columns:40px minmax(0,1fr) !important;
  }
  .guru-progress-student-v210 img{
    width:40px !important;
    height:40px !important;
  }
  .guru-progress-student-v210 b{
    font-size:8.4px !important;
  }
  .guru-progress-student-v210 small{
    font-size:5.9px !important;
  }
  .guru-progress-meter-v210{
    min-width:245px !important;
    grid-template-columns:minmax(150px,1fr) 42px !important;
  }
}


/* =========================================================
   KAIH v1.2.13 - GURU STUDENT ROW PREMIUM POLISH
   Fokus: visual hierarchy, whitespace, metric cards, CTA.
   ========================================================= */

.guru-student-list-v205{
  gap:12px !important;
}

.guru-student-row-v205{
  position:relative;
  min-height:118px !important;
  padding:14px 16px !important;
  grid-template-columns:minmax(245px,1.35fr) minmax(190px,.95fr) minmax(160px,.78fr) minmax(145px,.72fr) 110px !important;
  gap:12px !important;
  border:1px solid #dce7f3 !important;
  border-radius:20px !important;
  background:
    radial-gradient(circle at 2% 10%,rgba(243,248,255,.95),transparent 18%),
    linear-gradient(145deg,#fff 0%,#fbfdff 100%) !important;
  box-shadow:0 10px 26px rgba(35,70,113,.055) !important;
  overflow:hidden !important;
}

.guru-student-row-v205:before{
  content:"";
  position:absolute;
  left:0;
  top:16px;
  bottom:16px;
  width:3px;
  border-radius:0 6px 6px 0;
  background:linear-gradient(180deg,#4b8ef3,#78b5ff);
  opacity:.9;
}

.guru-student-row-v205:hover{
  transform:translateY(-2px) !important;
  border-color:#c9daef !important;
  box-shadow:0 16px 36px rgba(35,70,113,.09) !important;
}

/* identity */
.guru-student-main-v205{
  grid-template-columns:58px minmax(0,1fr) !important;
  gap:12px !important;
}

.guru-student-avatar-v205{
  width:58px !important;
  height:58px !important;
  border-radius:18px !important;
  border:3px solid #fff !important;
  outline:1px solid #e3ebf5 !important;
  box-shadow:0 8px 18px rgba(46,84,132,.10) !important;
}

.guru-student-name-v205 h3{
  font-size:11.5px !important;
  font-weight:900 !important;
  color:#123f73 !important;
  letter-spacing:-.01em !important;
}

.guru-student-meta-v213{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:5px !important;
  margin-top:4px !important;
  color:#7d91aa !important;
  font-size:7px !important;
}

.guru-student-meta-v213 b{
  color:#4f73a4 !important;
  font-size:7px !important;
}

.guru-student-meta-v213 i{
  width:3px;
  height:3px;
  border-radius:50%;
  background:#a8b7c9;
}

.guru-check-badge-v205{
  margin-top:7px !important;
  min-height:24px !important;
  padding:0 8px !important;
  font-size:6.3px !important;
  border:1px solid transparent;
}
.guru-check-badge-v205.ok{
  background:#e4f8ed !important;
  color:#16845b !important;
  border-color:#d4f1e2 !important;
}
.guru-check-badge-v205.warn{
  background:#fff3da !important;
  color:#ae7719 !important;
  border-color:#f8e6bc !important;
}
.guru-check-badge-v205.off{
  background:#fff0f2 !important;
  color:#cf5060 !important;
  border-color:#f6dce0 !important;
}

/* metrics */
.guru-student-metric-v205{
  min-height:78px !important;
  padding:11px 10px 10px 46px !important;
  border:1px solid #e8eef6 !important;
  border-radius:15px !important;
  background:linear-gradient(145deg,#fbfdff,#f6f9fd) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9) !important;
}

.guru-student-metric-v205 i{
  left:10px !important;
  top:12px !important;
  width:28px !important;
  height:28px !important;
  padding:5px !important;
  border-radius:9px !important;
  background:#eaf3ff !important;
}

.guru-student-metric-v205.green i{
  background:#e8f8f0 !important;
}
.guru-student-metric-v205.orange i{
  background:#fff2de !important;
}
.guru-student-metric-v205.purple i{
  background:#f2eaff !important;
}

.guru-student-metric-v205>span{
  font-size:6.7px !important;
  color:#8396ad !important;
  line-height:1.2 !important;
}

.guru-student-metric-v205>strong{
  margin-top:4px !important;
  font-size:10.5px !important;
  color:#143f73 !important;
  line-height:1.1 !important;
}

.mini-progress-v205{
  height:6px !important;
  margin-top:10px !important;
  background:#e8eef5 !important;
  border-radius:999px !important;
}

.mini-progress-v205 b{
  background:linear-gradient(90deg,#2e72e8,#68aaff) !important;
  border-radius:999px !important;
}

/* CTA */
.guru-detail-v205{
  min-height:44px !important;
  padding:0 10px 0 13px !important;
  border-radius:12px !important;
  border:1px solid #dce7f3 !important;
  background:linear-gradient(145deg,#f8fbff,#eef5fd) !important;
  color:#245da9 !important;
  box-shadow:0 5px 12px rgba(46,84,132,.05) !important;
  font-size:7.5px !important;
  font-weight:900 !important;
  transition:all .18s ease !important;
}

.guru-detail-v205:hover{
  background:linear-gradient(135deg,#3479ef,#2868e7) !important;
  color:#fff !important;
  border-color:#2d70e7 !important;
  box-shadow:0 9px 18px rgba(47,112,231,.18) !important;
}

.guru-detail-arrow-v213{
  width:22px;
  height:22px;
  border-radius:7px;
  display:grid;
  place-items:center;
  background:#e8f1ff;
  color:#3475dc !important;
  font-size:14px !important;
  transition:all .18s ease;
}

.guru-detail-v205:hover .guru-detail-arrow-v213{
  background:rgba(255,255,255,.18);
  color:#fff !important;
  transform:translateX(2px);
}

/* Responsive */
@media(max-width:1100px){
  .guru-student-row-v205{
    grid-template-columns:minmax(220px,1.25fr) 1fr 1fr !important;
  }
}

@media(max-width:700px){
  .guru-student-list-v205{
    gap:8px !important;
  }

  .guru-student-row-v205{
    min-height:0 !important;
    padding:10px !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "main detail"
      "metric1 metric1"
      "metric2 metric3" !important;
    gap:6px !important;
    border-radius:15px !important;
  }

  .guru-student-row-v205:before{
    top:10px;
    bottom:10px;
    width:2px;
  }

  .guru-student-main-v205{
    grid-area:main !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:7px !important;
  }

  .guru-student-avatar-v205{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
    border-width:2px !important;
  }

  .guru-student-name-v205 h3{
    font-size:8.7px !important;
  }

  .guru-student-meta-v213{
    gap:3px !important;
    margin-top:2px !important;
    font-size:5.3px !important;
  }
  .guru-student-meta-v213 b{
    font-size:5.3px !important;
  }

  .guru-check-badge-v205{
    min-height:18px !important;
    margin-top:4px !important;
    padding:0 5px !important;
    font-size:4.8px !important;
  }

  .guru-student-metric-v205{
    min-height:48px !important;
    padding:6px 5px 5px 27px !important;
    border-radius:9px !important;
  }
  .guru-student-metric-v205 i{
    left:5px !important;
    top:6px !important;
    width:17px !important;
    height:17px !important;
    padding:3px !important;
    border-radius:6px !important;
  }
  .guru-student-metric-v205>span{
    font-size:4.7px !important;
  }
  .guru-student-metric-v205>strong{
    margin-top:2px !important;
    font-size:6.5px !important;
  }
  .mini-progress-v205{
    height:3px !important;
    margin-top:4px !important;
  }

  .guru-detail-v205{
    grid-area:detail !important;
    align-self:start !important;
    min-height:29px !important;
    padding:0 5px 0 7px !important;
    border-radius:8px !important;
    font-size:5.3px !important;
    gap:3px !important;
  }

  .guru-detail-arrow-v213{
    width:16px;
    height:16px;
    border-radius:5px;
    font-size:10px !important;
  }
}


/* =========================================================
   KAIH v1.2.14 - GURU STUDENT ROW ALIGNMENT FIX
   Desktop: semua elemen satu baseline, proporsi kolom seimbang.
   ========================================================= */
@media (min-width:1101px){
  .guru-student-row-v205{
    min-height:112px !important;
    display:grid !important;
    grid-template-columns:
      minmax(320px,1.42fr)
      minmax(250px,.96fr)
      minmax(205px,.78fr)
      minmax(190px,.72fr)
      132px !important;
    align-items:center !important;
    column-gap:14px !important;
    padding:14px 18px !important;
  }

  .guru-student-main-v205{
    align-self:center !important;
    display:grid !important;
    grid-template-columns:58px minmax(0,1fr) !important;
    align-items:center !important;
    gap:13px !important;
    min-height:72px !important;
  }

  .guru-student-avatar-v205{
    align-self:center !important;
    margin:0 !important;
  }

  .guru-student-name-v205{
    align-self:center !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-height:68px !important;
  }

  .guru-student-name-v205 h3{
    margin:0 !important;
    line-height:1.18 !important;
  }

  .guru-student-meta-v213{
    margin-top:5px !important;
    min-height:12px !important;
  }

  .guru-check-badge-v205{
    align-self:flex-start !important;
    margin-top:7px !important;
  }

  .guru-student-metric-v205{
    align-self:center !important;
    width:100% !important;
    height:78px !important;
    min-height:78px !important;
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    padding:10px 12px 10px 48px !important;
  }

  .guru-student-metric-v205 i{
    top:50% !important;
    transform:translateY(-50%) !important;
  }

  .guru-student-metric-v205>span{
    display:block !important;
    min-height:12px !important;
    margin:0 !important;
  }

  .guru-student-metric-v205>strong{
    display:block !important;
    min-height:16px !important;
    margin-top:3px !important;
  }

  .guru-student-metric-v205 .mini-progress-v205{
    width:100% !important;
    margin-top:8px !important;
  }

  .guru-detail-v205{
    align-self:center !important;
    justify-self:stretch !important;
    width:100% !important;
    height:48px !important;
    min-height:48px !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    margin:0 !important;
  }
}

/* Tablet: tetap terstruktur, metric tidak loncat */
@media (min-width:701px) and (max-width:1100px){
  .guru-student-row-v205{
    grid-template-columns:minmax(260px,1.15fr) repeat(3,minmax(160px,1fr)) !important;
    align-items:center !important;
  }
  .guru-detail-v205{
    grid-column:1/-1 !important;
    justify-self:end !important;
    width:120px !important;
  }
}


/* =========================================================
   KAIH v1.2.15 - STUDENT ROW PREMIUM REFERENCE MATCH
   Dibuat mengikuti mockup yang disetujui:
   font lebih besar, icon lebih menonjol, alignment satu garis.
   ========================================================= */

@media (min-width:1101px){

  .guru-student-row-v205{
    min-height:132px !important;
    grid-template-columns:
      minmax(360px,1.42fr)
      minmax(300px,1.05fr)
      minmax(245px,.84fr)
      minmax(220px,.78fr)
      154px !important;
    column-gap:16px !important;
    padding:18px 20px !important;
    border-radius:22px !important;
    background:
      radial-gradient(circle at 1% 12%,rgba(239,247,255,.9),transparent 18%),
      linear-gradient(145deg,#fff 0%,#fbfdff 100%) !important;
  }

  /* profile */
  .guru-student-main-v205{
    grid-template-columns:72px minmax(0,1fr) !important;
    gap:16px !important;
    min-height:86px !important;
  }

  .guru-student-avatar-v205{
    width:72px !important;
    height:72px !important;
    border-radius:50% !important;
    border:4px solid #fff !important;
    outline:1px solid #dfe9f4 !important;
    box-shadow:0 9px 22px rgba(47,84,132,.12) !important;
  }

  .guru-student-name-v205{
    min-height:82px !important;
  }

  .guru-student-name-v205 h3{
    font-size:14px !important;
    line-height:1.15 !important;
    letter-spacing:-.015em !important;
  }

  .guru-student-meta-v213{
    margin-top:7px !important;
    gap:6px !important;
    font-size:8.5px !important;
  }

  .guru-student-meta-v213 b{
    font-size:8.5px !important;
  }

  .guru-check-badge-v205{
    min-height:30px !important;
    margin-top:9px !important;
    padding:0 11px !important;
    font-size:8px !important;
    border-radius:999px !important;
    box-shadow:0 4px 10px rgba(28,142,94,.06) !important;
  }

  /* metric cards */
  .guru-student-metric-v205{
    height:94px !important;
    min-height:94px !important;
    padding:14px 14px 13px 68px !important;
    border-radius:18px !important;
    background:linear-gradient(145deg,#fbfdff,#f4f8fd) !important;
    border:1px solid #dfe8f3 !important;
  }

  .guru-student-metric-v205 i{
    left:16px !important;
    top:50% !important;
    width:40px !important;
    height:40px !important;
    padding:7px !important;
    border-radius:13px !important;
    transform:translateY(-50%) !important;
    box-shadow:0 5px 12px rgba(48,87,137,.06) !important;
  }

  .guru-student-metric-v205>span{
    min-height:auto !important;
    color:#7389a3 !important;
    font-size:8.4px !important;
    line-height:1.15 !important;
  }

  .guru-student-metric-v205>strong{
    min-height:auto !important;
    margin-top:6px !important;
    color:#0d3f79 !important;
    font-size:14px !important;
    line-height:1.05 !important;
  }

  .mini-progress-v205{
    height:7px !important;
    margin-top:13px !important;
  }

  /* detail button */
  .guru-detail-v205{
    height:58px !important;
    min-height:58px !important;
    padding:0 12px 0 17px !important;
    border-radius:16px !important;
    font-size:9px !important;
    gap:11px !important;
    background:linear-gradient(145deg,#f8fbff,#edf5ff) !important;
  }

  .guru-detail-arrow-v213{
    width:28px !important;
    height:28px !important;
    border-radius:9px !important;
    font-size:17px !important;
  }
}

/* tablet */
@media (min-width:701px) and (max-width:1100px){
  .guru-student-row-v205{
    min-height:124px !important;
    padding:15px !important;
  }

  .guru-student-main-v205{
    grid-template-columns:62px minmax(0,1fr) !important;
  }

  .guru-student-avatar-v205{
    width:62px !important;
    height:62px !important;
    border-radius:50% !important;
  }

  .guru-student-name-v205 h3{
    font-size:12px !important;
  }

  .guru-student-meta-v213,
  .guru-student-meta-v213 b{
    font-size:7.4px !important;
  }

  .guru-student-metric-v205{
    min-height:84px !important;
  }

  .guru-student-metric-v205>span{
    font-size:7.5px !important;
  }

  .guru-student-metric-v205>strong{
    font-size:12px !important;
  }
}

/* mobile tetap compact tapi lebih mudah dibaca */
@media (max-width:700px){
  .guru-student-row-v205{
    padding:11px !important;
  }

  .guru-student-main-v205{
    grid-template-columns:46px minmax(0,1fr) !important;
    gap:8px !important;
  }

  .guru-student-avatar-v205{
    width:46px !important;
    height:46px !important;
    border-radius:50% !important;
  }

  .guru-student-name-v205 h3{
    font-size:9.4px !important;
  }

  .guru-student-meta-v213,
  .guru-student-meta-v213 b{
    font-size:5.8px !important;
  }

  .guru-check-badge-v205{
    min-height:20px !important;
    font-size:5.4px !important;
  }

  .guru-student-metric-v205{
    min-height:51px !important;
  }

  .guru-student-metric-v205>span{
    font-size:5.1px !important;
  }

  .guru-student-metric-v205>strong{
    font-size:7.2px !important;
  }
}


/* =========================================================
   KAIH v1.2.16 - LIHAT DETAIL VISIBILITY FIX
   Pastikan tombol detail selalu terlihat di desktop/tablet/mobile.
   ========================================================= */
.guru-student-row-v205 .guru-detail-v205{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  position:relative !important;
  z-index:3 !important;
  overflow:visible !important;
  text-decoration:none !important;
  color:#075ccf !important;
  background:linear-gradient(145deg,#f8fbff 0%,#eaf3ff 100%) !important;
  border:1px solid #d7e6f8 !important;
  box-shadow:0 7px 18px rgba(37,105,190,.07) !important;
}

.guru-student-row-v205 .guru-detail-v205 span{
  display:inline-block !important;
  visibility:visible !important;
  opacity:1 !important;
  white-space:nowrap !important;
  color:#075ccf !important;
  font-weight:800 !important;
}

.guru-student-row-v205 .guru-detail-v205 b{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  width:28px !important;
  height:28px !important;
  border-radius:9px !important;
  color:#1269df !important;
  background:#e6f1ff !important;
  font-size:17px !important;
  line-height:1 !important;
}

@media (min-width:1101px){
  .guru-student-row-v205{
    grid-template-columns:
      minmax(350px,1.38fr)
      minmax(285px,1.03fr)
      minmax(230px,.82fr)
      minmax(205px,.74fr)
      minmax(142px,154px) !important;
  }

  .guru-student-row-v205 .guru-detail-v205{
    width:100% !important;
    min-width:142px !important;
    max-width:154px !important;
    justify-self:end !important;
  }
}

@media (min-width:701px) and (max-width:1100px){
  .guru-student-row-v205 .guru-detail-v205{
    display:flex !important;
    width:132px !important;
    min-width:132px !important;
    min-height:46px !important;
  }
}

@media (max-width:700px){
  .guru-student-row-v205 .guru-detail-v205{
    display:flex !important;
    width:auto !important;
    min-width:92px !important;
    min-height:34px !important;
    height:34px !important;
    padding:0 7px 0 10px !important;
    border-radius:10px !important;
    font-size:6.2px !important;
    justify-self:end !important;
  }

  .guru-student-row-v205 .guru-detail-v205 span{
    display:inline-block !important;
    font-size:6.2px !important;
  }

  .guru-student-row-v205 .guru-detail-v205 b{
    width:20px !important;
    height:20px !important;
    border-radius:7px !important;
    font-size:12px !important;
  }
}


/* =========================================================
   KAIH v1.2.17 - LIHAT DETAIL CLIPPED / GRID OVERFLOW FIX
   Penyebab: total min-width kolom melebihi area konten sehingga
   kolom aksi terdorong keluar dan terpotong di sisi kanan.
   ========================================================= */

@media (min-width:1101px){
  .guru-student-row-v205{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    overflow:visible !important;

    /* Kolom dibuat fleksibel agar CTA selalu masuk viewport */
    grid-template-columns:
      minmax(260px,1.30fr)
      minmax(210px,1fr)
      minmax(185px,.82fr)
      minmax(165px,.76fr)
      128px !important;

    column-gap:12px !important;
    padding:16px 16px !important;
  }

  .guru-student-main-v205,
  .guru-student-metric-v205{
    min-width:0 !important;
  }

  .guru-student-name-v205,
  .guru-student-name-v205 h3,
  .guru-student-meta-v213{
    min-width:0 !important;
    max-width:100% !important;
  }

  .guru-student-name-v205 h3{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  .guru-student-meta-v213{
    overflow:hidden !important;
    white-space:nowrap !important;
  }

  .guru-student-metric-v205{
    width:auto !important;
    max-width:100% !important;
    padding-left:58px !important;
  }

  .guru-student-metric-v205 i{
    left:12px !important;
    width:36px !important;
    height:36px !important;
  }

  .guru-student-row-v205 .guru-detail-v205{
    display:flex !important;
    position:relative !important;
    z-index:5 !important;
    width:128px !important;
    min-width:128px !important;
    max-width:128px !important;
    height:52px !important;
    min-height:52px !important;
    padding:0 9px 0 12px !important;
    justify-self:end !important;
    align-self:center !important;
    box-sizing:border-box !important;
  }

  .guru-student-row-v205 .guru-detail-v205 span{
    display:block !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    white-space:nowrap !important;
    text-align:center !important;
    font-size:8.3px !important;
  }

  .guru-student-row-v205 .guru-detail-v205 b{
    flex:0 0 24px !important;
    width:24px !important;
    height:24px !important;
    font-size:14px !important;
  }
}

/* Laptop sedang: kompres sedikit lagi sebelum pindah layout tablet */
@media (min-width:1101px) and (max-width:1366px){
  .guru-student-row-v205{
    grid-template-columns:
      minmax(230px,1.20fr)
      minmax(190px,.95fr)
      minmax(165px,.78fr)
      minmax(145px,.72fr)
      116px !important;
    gap:10px !important;
    padding:14px !important;
  }

  .guru-student-avatar-v205{
    width:60px !important;
    height:60px !important;
  }

  .guru-student-main-v205{
    grid-template-columns:60px minmax(0,1fr) !important;
    gap:10px !important;
  }

  .guru-student-metric-v205{
    height:88px !important;
    min-height:88px !important;
    padding-left:52px !important;
  }

  .guru-student-metric-v205 i{
    left:10px !important;
    width:32px !important;
    height:32px !important;
  }

  .guru-student-row-v205 .guru-detail-v205{
    width:116px !important;
    min-width:116px !important;
    max-width:116px !important;
    height:48px !important;
    min-height:48px !important;
  }
}


/* =========================================================
   KAIH v1.2.18 - STUDENT ROW EXACT PREMIUM ALIGNMENT
   Match approved reference screenshot.
   ========================================================= */

@media (min-width:1101px){
  .guru-student-row-v205{
    min-height:146px !important;
    grid-template-columns:
      minmax(390px,1.42fr)
      minmax(320px,1.05fr)
      minmax(270px,.88fr)
      minmax(245px,.82fr)
      180px !important;
    gap:18px !important;
    padding:18px 22px !important;
    border-radius:24px !important;
    overflow:hidden !important;
    background:
      radial-gradient(circle at 2% 12%,rgba(239,247,255,.88),transparent 18%),
      linear-gradient(145deg,#fff 0%,#fbfdff 100%) !important;
  }

  .guru-student-row-v205:before{
    top:18px !important;
    bottom:18px !important;
    width:4px !important;
    border-radius:0 8px 8px 0 !important;
  }

  .guru-student-main-v205{
    grid-template-columns:82px minmax(0,1fr) !important;
    gap:18px !important;
    min-height:96px !important;
    align-items:center !important;
  }

  .guru-student-avatar-v205{
    width:82px !important;
    height:82px !important;
    border-radius:50% !important;
    border:5px solid #fff !important;
    outline:1px solid #dbe7f4 !important;
    box-shadow:0 10px 25px rgba(45,82,132,.12) !important;
  }

  .guru-student-name-v205{
    min-height:90px !important;
    justify-content:center !important;
  }

  .guru-student-name-v205 h3{
    font-size:16px !important;
    line-height:1.15 !important;
    color:#103f77 !important;
    letter-spacing:-.02em !important;
  }

  .guru-student-meta-v213{
    margin-top:8px !important;
    gap:7px !important;
    font-size:9px !important;
    color:#6f86a2 !important;
  }

  .guru-student-meta-v213 b{
    font-size:9px !important;
    color:#4b6f9c !important;
  }

  .guru-check-badge-v205{
    min-height:34px !important;
    margin-top:10px !important;
    padding:0 13px !important;
    font-size:9px !important;
    border-radius:999px !important;
    font-weight:900 !important;
  }

  .guru-student-metric-v205{
    height:102px !important;
    min-height:102px !important;
    padding:15px 16px 14px 82px !important;
    border-radius:20px !important;
    border:1px solid #dce7f3 !important;
    background:linear-gradient(145deg,#fbfdff,#f3f8fd) !important;
  }

  .guru-student-metric-v205 i{
    left:18px !important;
    width:52px !important;
    height:52px !important;
    padding:0 !important;
    border-radius:17px !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .guru-student-metric-v205 i img{
    width:52px !important;
    height:52px !important;
  }

  .guru-student-metric-v205>span{
    font-size:10px !important;
    color:#6f86a2 !important;
    line-height:1.2 !important;
  }

  .guru-student-metric-v205>strong{
    margin-top:7px !important;
    font-size:17px !important;
    color:#0d3f78 !important;
    line-height:1 !important;
  }

  .mini-progress-v205{
    height:8px !important;
    margin-top:14px !important;
    background:#e5ecf4 !important;
  }

  .mini-progress-v205 b{
    background:linear-gradient(90deg,#2673ef,#4e96fa) !important;
  }

  .guru-student-row-v205 .guru-detail-v205{
    width:180px !important;
    min-width:180px !important;
    max-width:180px !important;
    height:66px !important;
    min-height:66px !important;
    border-radius:18px !important;
    padding:0 15px 0 20px !important;
    font-size:11px !important;
    background:linear-gradient(145deg,#f8fbff,#edf5ff) !important;
    border:1px solid #d6e5f7 !important;
  }

  .guru-student-row-v205 .guru-detail-v205 span{
    font-size:11px !important;
    font-weight:900 !important;
  }

  .guru-student-row-v205 .guru-detail-v205 b{
    width:32px !important;
    height:32px !important;
    flex-basis:32px !important;
    border-radius:10px !important;
    font-size:18px !important;
  }
}

/* Medium laptop: keep same visual, compress proportionally */
@media (min-width:1101px) and (max-width:1500px){
  .guru-student-row-v205{
    min-height:132px !important;
    grid-template-columns:
      minmax(300px,1.32fr)
      minmax(235px,1fr)
      minmax(200px,.82fr)
      minmax(185px,.78fr)
      138px !important;
    gap:12px !important;
    padding:16px !important;
  }

  .guru-student-main-v205{
    grid-template-columns:68px minmax(0,1fr) !important;
    gap:13px !important;
  }

  .guru-student-avatar-v205{
    width:68px !important;
    height:68px !important;
  }

  .guru-student-name-v205 h3{font-size:13px !important}
  .guru-student-meta-v213,
  .guru-student-meta-v213 b{font-size:7.5px !important}
  .guru-check-badge-v205{min-height:27px !important;font-size:7px !important}

  .guru-student-metric-v205{
    height:92px !important;
    min-height:92px !important;
    padding:13px 11px 12px 62px !important;
  }

  .guru-student-metric-v205 i{
    left:12px !important;
    width:40px !important;
    height:40px !important;
  }

  .guru-student-metric-v205 i img{
    width:40px !important;
    height:40px !important;
  }

  .guru-student-metric-v205>span{font-size:7.5px !important}
  .guru-student-metric-v205>strong{font-size:12.5px !important}

  .guru-student-row-v205 .guru-detail-v205{
    width:138px !important;
    min-width:138px !important;
    max-width:138px !important;
    height:52px !important;
    min-height:52px !important;
    padding:0 9px 0 12px !important;
  }

  .guru-student-row-v205 .guru-detail-v205 span{font-size:8px !important}
  .guru-student-row-v205 .guru-detail-v205 b{
    width:25px !important;
    height:25px !important;
    flex-basis:25px !important;
    font-size:14px !important;
  }
}

/* Mobile keeps premium icon treatment */
@media (max-width:700px){
  .guru-student-metric-v205 i{
    background:transparent !important;
    box-shadow:none !important;
    padding:0 !important;
  }

  .guru-student-metric-v205 i img{
    width:100% !important;
    height:100% !important;
  }
}


/* =========================================================
   KAIH v1.2.19 - STUDENT ROW SPACING & PROPORTION POLISH
   Fokus: rapikan whitespace, seimbangkan lebar metric,
   jaga tombol detail tetap terlihat penuh.
   ========================================================= */

@media (min-width:1101px){

  .guru-student-row-v205{
    min-height:138px !important;
    grid-template-columns:
      minmax(300px,1.08fr)
      repeat(3,minmax(210px,.92fr))
      146px !important;
    column-gap:12px !important;
    padding:16px 16px !important;
  }

  /* Area identitas dibuat lebih padat */
  .guru-student-main-v205{
    grid-template-columns:72px minmax(0,1fr) !important;
    gap:13px !important;
    min-height:88px !important;
  }

  .guru-student-avatar-v205{
    width:72px !important;
    height:72px !important;
  }

  .guru-student-name-v205{
    min-height:78px !important;
  }

  .guru-student-name-v205 h3{
    font-size:14px !important;
  }

  .guru-student-meta-v213,
  .guru-student-meta-v213 b{
    font-size:7.7px !important;
  }

  .guru-check-badge-v205{
    min-height:28px !important;
    margin-top:8px !important;
    padding:0 10px !important;
    font-size:7.4px !important;
  }

  /* Ketiga metric dibuat sama proporsinya */
  .guru-student-metric-v205{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:94px !important;
    min-height:94px !important;
    padding:13px 12px 12px 62px !important;
    border-radius:18px !important;
  }

  .guru-student-metric-v205 i{
    left:12px !important;
    width:40px !important;
    height:40px !important;
  }

  .guru-student-metric-v205 i img{
    width:40px !important;
    height:40px !important;
  }

  .guru-student-metric-v205>span{
    font-size:7.6px !important;
  }

  .guru-student-metric-v205>strong{
    margin-top:5px !important;
    font-size:13px !important;
  }

  .mini-progress-v205{
    margin-top:11px !important;
    height:7px !important;
  }

  /* CTA lebih rapih dan tidak terlalu lebar */
  .guru-student-row-v205 .guru-detail-v205{
    width:146px !important;
    min-width:146px !important;
    max-width:146px !important;
    height:54px !important;
    min-height:54px !important;
    padding:0 10px 0 14px !important;
    border-radius:15px !important;
  }

  .guru-student-row-v205 .guru-detail-v205 span{
    font-size:8.5px !important;
  }

  .guru-student-row-v205 .guru-detail-v205 b{
    width:26px !important;
    height:26px !important;
    flex-basis:26px !important;
    font-size:15px !important;
  }
}

/* Laptop 1101–1366: kompres lagi supaya tidak kepotong */
@media (min-width:1101px) and (max-width:1366px){
  .guru-student-row-v205{
    grid-template-columns:
      minmax(250px,1.04fr)
      repeat(3,minmax(175px,.9fr))
      126px !important;
    gap:10px !important;
    padding:14px !important;
  }

  .guru-student-main-v205{
    grid-template-columns:64px minmax(0,1fr) !important;
    gap:10px !important;
  }

  .guru-student-avatar-v205{
    width:64px !important;
    height:64px !important;
  }

  .guru-student-name-v205 h3{
    font-size:12.5px !important;
  }

  .guru-student-metric-v205{
    height:88px !important;
    min-height:88px !important;
    padding-left:54px !important;
  }

  .guru-student-metric-v205 i{
    left:10px !important;
    width:34px !important;
    height:34px !important;
  }

  .guru-student-metric-v205 i img{
    width:34px !important;
    height:34px !important;
  }

  .guru-student-metric-v205>span{
    font-size:6.8px !important;
  }

  .guru-student-metric-v205>strong{
    font-size:11.5px !important;
  }

  .guru-student-row-v205 .guru-detail-v205{
    width:126px !important;
    min-width:126px !important;
    max-width:126px !important;
    height:48px !important;
    min-height:48px !important;
  }
}

/* Tablet: jaga ritme spacing */
@media (min-width:701px) and (max-width:1100px){
  .guru-student-row-v205{
    gap:10px !important;
  }

  .guru-student-metric-v205{
    min-height:82px !important;
  }
}

/* Mobile: sedikit rapat tapi tetap nyaman */
@media (max-width:700px){
  .guru-student-row-v205{
    gap:6px !important;
    padding:10px !important;
  }

  .guru-student-main-v205{
    gap:7px !important;
  }

  .guru-student-metric-v205{
    min-height:48px !important;
  }
}


/* =========================================================
   KAIH v1.2.20 - PREMIUM FILTER & SEARCH REDESIGN
   ========================================================= */

.guru-student-filter-card-v220{
  padding:16px;
  border:1px solid #dce7f3;
  border-radius:22px;
  background:
    radial-gradient(circle at 92% 12%,rgba(245,250,255,.95),transparent 18%),
    linear-gradient(145deg,#fff 0%,#fcfdff 100%);
  box-shadow:0 11px 28px rgba(35,70,113,.05);
}

.guru-student-filter-head-v220{
  min-height:50px;
  margin-bottom:13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.guru-student-filter-title-v220{
  display:flex;
  align-items:center;
  gap:11px;
}

.guru-student-filter-title-v220>span{
  width:44px;
  height:44px;
  border-radius:14px;
  display:grid;
  place-items:center;
  flex:0 0 44px;
}

.guru-student-filter-title-v220 img{
  width:44px;
  height:44px;
  display:block;
}

.guru-student-filter-title-v220 b{
  display:block;
  color:#103f77;
  font-size:12px;
  line-height:1.15;
}

.guru-student-filter-title-v220 small{
  display:block;
  margin-top:4px;
  color:#8094aa;
  font-size:7px;
}

.guru-filter-summary-v220{
  min-width:106px;
  min-height:46px;
  padding:7px 12px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  border:1px solid #e1e9f3;
  border-radius:13px;
  background:#f7faff;
}

.guru-filter-summary-v220 strong{
  color:#1f64c5;
  font-size:15px;
  line-height:1;
}

.guru-filter-summary-v220 span{
  margin-top:3px;
  color:#8396ac;
  font-size:6px;
}

.guru-student-filter-v220{
  display:grid;
  grid-template-columns:minmax(360px,1.5fr) minmax(190px,.68fr) minmax(180px,.64fr) 152px 112px;
  gap:10px;
  align-items:stretch;
}

.guru-filter-control-v220{
  position:relative;
  min-height:62px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  gap:9px;
  align-items:center;
  padding:8px 11px;
  border:1px solid #dce6f2;
  border-radius:15px;
  background:#fff;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.guru-filter-control-v220:hover{
  border-color:#c9dbef;
  box-shadow:0 7px 18px rgba(46,84,132,.05);
}

.guru-filter-control-v220:focus-within{
  border-color:#8eb9f5;
  box-shadow:0 0 0 3px rgba(53,121,232,.08);
}

.guru-filter-control-v220>i{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
}

.guru-filter-control-v220>i img{
  width:38px;
  height:38px;
  display:block;
}

.guru-filter-control-v220 label,
.guru-filter-control-v220 span{
  display:block;
  color:#8396ac;
  font-size:6.4px;
  line-height:1;
}

.guru-filter-control-v220 input,
.guru-filter-control-v220 select{
  width:100%;
  height:26px;
  margin-top:3px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#173f73;
  font-size:8.8px;
  font-weight:700;
}

.guru-filter-control-v220 select{
  cursor:pointer;
}

.guru-filter-control-v220 .clear{
  position:absolute;
  right:8px;
  top:50%;
  width:24px;
  height:24px;
  transform:translateY(-50%);
  border-radius:8px;
  display:grid;
  place-items:center;
  text-decoration:none;
  background:#edf2f7;
  color:#6e86a2;
  font-size:13px;
}

.guru-filter-apply-v220,
.guru-filter-reset-v220{
  min-height:62px;
  border-radius:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-decoration:none;
  border:0;
  font-weight:900;
  cursor:pointer;
}

.guru-filter-apply-v220{
  background:linear-gradient(135deg,#377df0,#2868e7);
  color:#fff;
  box-shadow:0 10px 22px rgba(47,112,231,.19);
}

.guru-filter-apply-v220:hover{
  transform:translateY(-1px);
  box-shadow:0 13px 26px rgba(47,112,231,.23);
}

.guru-filter-apply-v220 img,
.guru-filter-reset-v220 img{
  width:27px;
  height:27px;
  object-fit:contain;
}

.guru-filter-apply-v220 img{
  filter:brightness(0) invert(1);
}

.guru-filter-apply-v220 span{
  color:#fff;
  font-size:8.5px;
}

.guru-filter-reset-v220{
  border:1px solid #dfe8f3;
  background:#f3f7fc;
  color:#3265a8;
}

.guru-filter-reset-v220 span{
  color:#3265a8;
  font-size:8px;
}

.guru-filter-bottom-v220{
  grid-column:1/-1;
  min-height:44px;
  margin-top:2px;
  padding-top:10px;
  border-top:1px solid #edf2f7;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.guru-filter-result-v220{
  display:flex;
  align-items:center;
  gap:5px;
  color:#7c90a8;
  font-size:7px;
}

.guru-filter-result-v220 .dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#3a83ef;
  box-shadow:0 0 0 4px #eaf3ff;
}

.guru-filter-result-v220 b{
  color:#205fae;
  font-size:7.5px;
}

.guru-filter-sort-v220{
  min-height:36px;
  padding:5px 7px 5px 6px;
  display:grid;
  grid-template-columns:28px auto minmax(120px,1fr);
  gap:6px;
  align-items:center;
  border:1px solid #dfe8f3;
  border-radius:11px;
  background:#f9fbfe;
}

.guru-filter-sort-v220 img{
  width:28px;
  height:28px;
}

.guru-filter-sort-v220>span{
  color:#8295ab;
  font-size:6.5px;
}

.guru-filter-sort-v220 select{
  height:26px;
  border:0;
  outline:0;
  background:transparent;
  color:#214b78;
  font-size:7.3px;
  font-weight:800;
}

/* Laptop */
@media(max-width:1366px) and (min-width:701px){
  .guru-student-filter-v220{
    grid-template-columns:minmax(300px,1.35fr) minmax(165px,.72fr) minmax(155px,.68fr) 132px 96px;
    gap:8px;
  }

  .guru-filter-control-v220{
    min-height:58px;
    grid-template-columns:34px minmax(0,1fr);
    gap:7px;
    padding:7px 9px;
  }

  .guru-filter-control-v220>i,
  .guru-filter-control-v220>i img{
    width:34px;
    height:34px;
  }

  .guru-filter-apply-v220,
  .guru-filter-reset-v220{
    min-height:58px;
  }
}

/* Mobile */
@media(max-width:700px){
  .guru-student-filter-card-v220{
    padding:10px;
    border-radius:16px;
  }

  .guru-student-filter-head-v220{
    min-height:42px;
    margin-bottom:8px;
  }

  .guru-student-filter-title-v220{
    gap:8px;
  }

  .guru-student-filter-title-v220>span,
  .guru-student-filter-title-v220 img{
    width:34px;
    height:34px;
  }

  .guru-student-filter-title-v220 b{
    font-size:9px;
  }

  .guru-student-filter-title-v220 small{
    font-size:5.4px;
  }

  .guru-filter-summary-v220{
    min-width:74px;
    min-height:38px;
    padding:5px 8px;
  }

  .guru-filter-summary-v220 strong{
    font-size:12px;
  }

  .guru-filter-summary-v220 span{
    font-size:4.8px;
  }

  .guru-student-filter-v220{
    grid-template-columns:1fr 1fr;
    gap:7px;
  }

  .guru-filter-control-v220.search{
    grid-column:1/-1;
  }

  .guru-filter-control-v220{
    min-height:52px;
    grid-template-columns:31px minmax(0,1fr);
    gap:6px;
    padding:6px 8px;
    border-radius:12px;
  }

  .guru-filter-control-v220>i,
  .guru-filter-control-v220>i img{
    width:31px;
    height:31px;
  }

  .guru-filter-control-v220 label,
  .guru-filter-control-v220 span{
    font-size:5px;
  }

  .guru-filter-control-v220 input,
  .guru-filter-control-v220 select{
    height:22px;
    font-size:6.5px;
  }

  .guru-filter-apply-v220,
  .guru-filter-reset-v220{
    min-height:42px;
    border-radius:11px;
  }

  .guru-filter-apply-v220 span,
  .guru-filter-reset-v220 span{
    font-size:6.2px;
  }

  .guru-filter-apply-v220 img,
  .guru-filter-reset-v220 img{
    width:22px;
    height:22px;
  }

  .guru-filter-bottom-v220{
    min-height:36px;
    padding-top:7px;
  }

  .guru-filter-result-v220{
    font-size:5.5px;
  }

  .guru-filter-sort-v220{
    grid-template-columns:22px auto minmax(85px,1fr);
    min-height:32px;
    gap:4px;
    padding:4px 5px;
  }

  .guru-filter-sort-v220 img{
    width:22px;
    height:22px;
  }

  .guru-filter-sort-v220>span{
    display:none;
  }

  .guru-filter-sort-v220 select{
    font-size:5.8px;
  }
}

@media(max-width:380px){
  .guru-student-filter-v220{
    grid-template-columns:1fr;
  }

  .guru-filter-control-v220.search,
  .guru-filter-bottom-v220{
    grid-column:1;
  }

  .guru-filter-bottom-v220{
    flex-direction:column;
    align-items:stretch;
  }

  .guru-filter-sort-v220{
    width:100%;
  }
}


/* =========================================================
   KAIH v1.2.21 - PREMIUM FILTER COMPACT POLISH
   Fokus: lebih rapat, tombol lebih clean, footer filter seimbang.
   ========================================================= */

.guru-student-filter-card-v220{
  padding:14px 15px 13px !important;
  border-radius:21px !important;
}

.guru-student-filter-head-v220{
  min-height:46px !important;
  margin-bottom:11px !important;
}

.guru-student-filter-title-v220>span,
.guru-student-filter-title-v220 img{
  width:40px !important;
  height:40px !important;
}

.guru-student-filter-title-v220{
  gap:10px !important;
}

.guru-student-filter-title-v220 b{
  font-size:11.5px !important;
}

.guru-student-filter-title-v220 small{
  margin-top:3px !important;
  font-size:6.7px !important;
}

.guru-filter-summary-v220{
  min-width:94px !important;
  min-height:42px !important;
  padding:6px 10px !important;
  border-radius:12px !important;
  background:linear-gradient(145deg,#fbfdff,#f2f7fd) !important;
}

.guru-filter-summary-v220 strong{
  font-size:14px !important;
}

.guru-filter-summary-v220 span{
  font-size:5.7px !important;
}

.guru-student-filter-v220{
  grid-template-columns:minmax(360px,1.55fr) minmax(190px,.72fr) minmax(180px,.68fr) 150px 108px !important;
  gap:9px !important;
}

/* control lebih pendek dan rata */
.guru-filter-control-v220{
  min-height:58px !important;
  grid-template-columns:36px minmax(0,1fr) !important;
  gap:8px !important;
  padding:7px 10px !important;
  border-radius:14px !important;
}

.guru-filter-control-v220>i,
.guru-filter-control-v220>i img{
  width:36px !important;
  height:36px !important;
}

.guru-filter-control-v220 label,
.guru-filter-control-v220 span{
  font-size:6.1px !important;
}

.guru-filter-control-v220 input,
.guru-filter-control-v220 select{
  height:24px !important;
  margin-top:2px !important;
  font-size:8.4px !important;
}

.guru-filter-apply-v220,
.guru-filter-reset-v220{
  min-height:58px !important;
  border-radius:14px !important;
}

.guru-filter-apply-v220{
  box-shadow:0 9px 20px rgba(47,112,231,.18) !important;
}

.guru-filter-apply-v220 img{
  width:22px !important;
  height:22px !important;
  filter:none !important;
}

.guru-filter-reset-v220 img{
  width:23px !important;
  height:23px !important;
}

.guru-filter-apply-v220 span{
  font-size:8.1px !important;
}

.guru-filter-reset-v220 span{
  font-size:7.8px !important;
}

/* footer jadi lebih kompak, tidak terlalu banyak ruang kosong */
.guru-filter-bottom-v220{
  min-height:38px !important;
  margin-top:0 !important;
  padding-top:8px !important;
}

.guru-filter-result-v220{
  font-size:6.7px !important;
}

.guru-filter-result-v220 .dot{
  width:6px !important;
  height:6px !important;
  box-shadow:0 0 0 3px #eaf3ff !important;
}

.guru-filter-result-v220 b{
  font-size:7px !important;
}

.guru-filter-sort-v220{
  min-height:34px !important;
  grid-template-columns:25px auto minmax(112px,1fr) !important;
  gap:5px !important;
  padding:4px 6px 4px 5px !important;
  border-radius:10px !important;
}

.guru-filter-sort-v220 img{
  width:25px !important;
  height:25px !important;
}

.guru-filter-sort-v220>span{
  font-size:6.2px !important;
}

.guru-filter-sort-v220 select{
  height:24px !important;
  font-size:7px !important;
}

/* laptop */
@media(max-width:1366px) and (min-width:701px){
  .guru-student-filter-v220{
    grid-template-columns:minmax(280px,1.4fr) minmax(155px,.74fr) minmax(145px,.7fr) 128px 92px !important;
    gap:7px !important;
  }

  .guru-filter-control-v220{
    min-height:54px !important;
    grid-template-columns:32px minmax(0,1fr) !important;
    padding:6px 8px !important;
  }

  .guru-filter-control-v220>i,
  .guru-filter-control-v220>i img{
    width:32px !important;
    height:32px !important;
  }

  .guru-filter-apply-v220,
  .guru-filter-reset-v220{
    min-height:54px !important;
  }
}

/* mobile */
@media(max-width:700px){
  .guru-student-filter-card-v220{
    padding:9px !important;
    border-radius:15px !important;
  }

  .guru-student-filter-head-v220{
    min-height:40px !important;
    margin-bottom:7px !important;
  }

  .guru-student-filter-title-v220>span,
  .guru-student-filter-title-v220 img{
    width:32px !important;
    height:32px !important;
  }

  .guru-student-filter-title-v220 b{
    font-size:8.6px !important;
  }

  .guru-student-filter-title-v220 small{
    font-size:5.1px !important;
  }

  .guru-filter-summary-v220{
    min-width:68px !important;
    min-height:36px !important;
    padding:4px 7px !important;
  }

  .guru-filter-summary-v220 strong{
    font-size:11px !important;
  }

  .guru-filter-summary-v220 span{
    font-size:4.5px !important;
  }

  .guru-student-filter-v220{
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
  }

  .guru-filter-control-v220.search{
    grid-column:1/-1 !important;
  }

  .guru-filter-control-v220{
    min-height:48px !important;
    grid-template-columns:28px minmax(0,1fr) !important;
    gap:5px !important;
    padding:5px 7px !important;
    border-radius:11px !important;
  }

  .guru-filter-control-v220>i,
  .guru-filter-control-v220>i img{
    width:28px !important;
    height:28px !important;
  }

  .guru-filter-control-v220 label,
  .guru-filter-control-v220 span{
    font-size:4.8px !important;
  }

  .guru-filter-control-v220 input,
  .guru-filter-control-v220 select{
    height:21px !important;
    font-size:6.2px !important;
  }

  .guru-filter-apply-v220,
  .guru-filter-reset-v220{
    min-height:39px !important;
    border-radius:10px !important;
  }

  .guru-filter-apply-v220 img,
  .guru-filter-reset-v220 img{
    width:19px !important;
    height:19px !important;
  }

  .guru-filter-apply-v220 span,
  .guru-filter-reset-v220 span{
    font-size:5.8px !important;
  }

  .guru-filter-bottom-v220{
    min-height:33px !important;
    padding-top:6px !important;
  }

  .guru-filter-sort-v220{
    min-height:29px !important;
    grid-template-columns:20px minmax(80px,1fr) !important;
    gap:4px !important;
    padding:3px 5px !important;
  }

  .guru-filter-sort-v220>span{
    display:none !important;
  }

  .guru-filter-sort-v220 img{
    width:20px !important;
    height:20px !important;
  }

  .guru-filter-sort-v220 select{
    font-size:5.5px !important;
  }
}


/* =========================================================
   KAIH v1.2.22 - GURU/SISWA MOBILE DRAWER BELOW HEADER
   Drawer tidak lagi tertutup sticky topbar.
   ========================================================= */
@media (max-width:980px){
  body:not(.role-admin).menu-open{
    overflow:hidden !important;
  }

  body:not(.role-admin) .role-member-topbar{
    position:sticky !important;
    top:0 !important;
    z-index:90 !important;
  }

  body:not(.role-admin) .sidebar{
    top:64px !important;
    bottom:0 !important;
    height:calc(100dvh - 64px) !important;
    max-height:calc(100dvh - 64px) !important;
    padding-top:14px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    overscroll-behavior:contain !important;
    z-index:80 !important;
    box-shadow:12px 20px 34px rgba(20,48,88,.16) !important;
    border-top:1px solid #e8eef7 !important;
  }

  body:not(.role-admin).menu-open .menu-overlay{
    display:block !important;
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    top:64px !important;
    bottom:0 !important;
    inset:auto 0 0 0 !important;
    height:calc(100dvh - 64px) !important;
    background:rgba(25,47,76,.30) !important;
    backdrop-filter:blur(2px) !important;
    z-index:70 !important;
  }

  /* brand tetap utuh di area drawer, tidak naik ke balik header */
  body:not(.role-admin) .sidebar .brand{
    flex:0 0 auto !important;
  }
}

@media (max-width:430px){
  body:not(.role-admin) .sidebar{
    top:64px !important;
    height:calc(100dvh - 64px) !important;
    max-height:calc(100dvh - 64px) !important;
  }

  body:not(.role-admin).menu-open .menu-overlay{
    top:64px !important;
    height:calc(100dvh - 64px) !important;
  }
}


/* =========================================================
   KAIH v1.2.23 - GURU HERO PREMIUM REDESIGN
   Hero dibuat lebih menyatu, bukan 3 blok terpisah.
   ========================================================= */

.guru-hero-v223{
  position:relative;
  min-height:300px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);
  align-items:stretch;
  border-radius:28px;
  background:
    radial-gradient(circle at 76% 16%,rgba(255,255,255,.16),transparent 24%),
    linear-gradient(130deg,#184fbf 0%,#2f72eb 54%,#6655eb 100%);
  box-shadow:0 22px 48px rgba(34,76,156,.18);
}

.guru-hero-v223:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 14% 10%,rgba(255,255,255,.11),transparent 22%),
    linear-gradient(90deg,rgba(7,43,120,.14),transparent 34%,rgba(111,79,235,.07));
}

.guru-hero-bg-v223{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.guru-hero-bg-v223:before,
.guru-hero-bg-v223:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.10);
}
.guru-hero-bg-v223:before{
  width:260px;height:260px;left:-90px;bottom:-125px;
}
.guru-hero-bg-v223:after{
  width:180px;height:180px;right:190px;top:-85px;
}

.guru-hero-copy-v223{
  position:relative;
  z-index:4;
  align-self:center;
  padding:35px 30px 34px 38px;
  color:#fff;
}

.guru-eyebrow-v223{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(255,255,255,.11);
  border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.9);
  font-size:8px;
  font-weight:900;
  letter-spacing:.13em;
}

.guru-hero-copy-v223 h1{
  margin:12px 0 7px;
  color:#fff;
  font-size:37px;
  line-height:1.06;
  letter-spacing:-.035em;
}
.guru-hero-copy-v223 h1 em{
  font-style:normal;
  font-size:31px;
}
.guru-hero-copy-v223>p{
  max-width:575px;
  margin:0;
  color:rgba(255,255,255,.90);
  font-size:12px;
  line-height:1.55;
}

.guru-hero-meta-v223{
  margin-top:18px;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.guru-hero-meta-v223 span{
  min-height:30px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  gap:4px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.82);
  font-size:7px;
  backdrop-filter:blur(4px);
}
.guru-hero-meta-v223 b{
  color:#fff;
  font-size:8px;
}

.guru-hero-quote-v223{
  width:min(470px,92%);
  min-height:54px;
  margin-top:17px;
  padding:10px 13px;
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  gap:8px;
  align-items:center;
  border-radius:15px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
}
.guru-hero-quote-v223>span{
  color:#a9caff;
  font-family:Georgia,serif;
  font-size:30px;
  line-height:1;
}
.guru-hero-quote-v223 p{
  margin:0;
  color:rgba(255,255,255,.87);
  font-size:8px;
  line-height:1.45;
}

.guru-hero-art-v223{
  position:relative;
  min-width:0;
  z-index:2;
  overflow:hidden;
}
.guru-hero-art-v223 img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
  transform:scale(1.04);
}
.guru-hero-art-fade-v223{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,#2d6ee7 0%,rgba(45,110,231,.52) 10%,rgba(45,110,231,0) 28%),
    linear-gradient(180deg,rgba(24,79,191,.05),rgba(93,83,232,.14));
  pointer-events:none;
}

/* Floating participation card */
.guru-participation-v223{
  position:absolute;
  z-index:6;
  right:22px;
  top:22px;
  width:230px;
  min-height:224px;
  padding:15px;
  border-radius:22px;
  color:#fff;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.25);
  box-shadow:0 16px 34px rgba(36,50,137,.18);
  backdrop-filter:blur(12px);
}

.guru-participation-head-v223{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.guru-participation-head-v223 span{
  font-size:8px;
  color:rgba(255,255,255,.9);
}
.guru-participation-head-v223 b{
  min-height:23px;
  padding:0 8px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  font-size:6px;
  color:#fff;
}

.guru-participation-body-v223{
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:11px;
  align-items:center;
  margin-top:12px;
}

.guru-ring-v223{
  width:96px;
  height:96px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:conic-gradient(#29ce8b calc(var(--pct)*1%),rgba(255,255,255,.20) 0);
  box-shadow:0 8px 22px rgba(16,67,104,.14);
}
.guru-ring-v223>div{
  width:74px;
  height:74px;
  border-radius:50%;
  display:grid;
  place-content:center;
  text-align:center;
  background:rgba(255,255,255,.96);
  color:#173f73;
}
.guru-ring-v223 strong{
  font-size:21px;
  line-height:1;
}
.guru-ring-v223 small{
  margin-top:4px;
  color:#71879f;
  font-size:5.7px;
}

.guru-participation-copy-v223 b{
  display:block;
  color:#fff;
  font-size:9px;
  line-height:1.2;
}
.guru-participation-copy-v223 span{
  display:block;
  margin-top:5px;
  color:rgba(255,255,255,.78);
  font-size:6.4px;
  line-height:1.45;
}

.guru-participation-progress-v223{
  height:6px;
  margin-top:14px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.18);
}
.guru-participation-progress-v223 i{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#39d99b,#77e6bd);
}

/* Tablet */
@media(max-width:1100px){
  .guru-hero-v223{
    min-height:360px;
    grid-template-columns:1fr 410px;
  }
  .guru-hero-copy-v223{
    padding-right:18px;
  }
  .guru-participation-v223{
    top:auto;
    bottom:18px;
    right:18px;
    width:215px;
    min-height:190px;
  }
  .guru-participation-body-v223{
    grid-template-columns:82px minmax(0,1fr);
  }
  .guru-ring-v223{
    width:82px;height:82px;
  }
  .guru-ring-v223>div{
    width:64px;height:64px;
  }
}

/* Mobile */
@media(max-width:760px){
  .guru-hero-v223{
    min-height:0;
    display:block;
    border-radius:21px;
  }

  .guru-hero-copy-v223{
    padding:19px 15px 12px;
  }

  .guru-eyebrow-v223{
    min-height:22px;
    padding:0 8px;
    font-size:6px;
  }

  .guru-hero-copy-v223 h1{
    margin:8px 0 5px;
    font-size:25px;
  }

  .guru-hero-copy-v223 h1 em{
    font-size:21px;
  }

  .guru-hero-copy-v223>p{
    max-width:96%;
    font-size:8.3px;
    line-height:1.45;
  }

  .guru-hero-meta-v223{
    margin-top:10px;
    gap:5px;
  }

  .guru-hero-meta-v223 span{
    min-height:24px;
    padding:0 7px;
    font-size:5.3px;
  }

  .guru-hero-meta-v223 b{
    font-size:6px;
  }

  .guru-hero-quote-v223{
    width:100%;
    min-height:44px;
    margin-top:10px;
    padding:8px 9px;
    grid-template-columns:18px minmax(0,1fr);
    border-radius:12px;
  }

  .guru-hero-quote-v223>span{
    font-size:22px;
  }

  .guru-hero-quote-v223 p{
    font-size:5.9px;
  }

  .guru-hero-art-v223{
    height:175px;
  }

  .guru-hero-art-v223 img{
    object-position:center 44%;
    transform:scale(1.02);
  }

  .guru-hero-art-fade-v223{
    background:linear-gradient(180deg,#2f72ea 0%,rgba(47,114,234,0) 20%,rgba(93,83,232,.08));
  }

  .guru-participation-v223{
    position:relative;
    inset:auto;
    width:auto;
    min-height:94px;
    margin:0 10px 10px;
    padding:10px;
    border-radius:15px;
  }

  .guru-participation-head-v223{
    margin-bottom:7px;
  }

  .guru-participation-head-v223 span{
    font-size:6.5px;
  }

  .guru-participation-body-v223{
    grid-template-columns:62px minmax(0,1fr);
    gap:9px;
    margin-top:0;
  }

  .guru-ring-v223{
    width:62px;
    height:62px;
  }

  .guru-ring-v223>div{
    width:48px;
    height:48px;
  }

  .guru-ring-v223 strong{
    font-size:15px;
  }

  .guru-ring-v223 small{
    font-size:4.5px;
  }

  .guru-participation-copy-v223 b{
    font-size:7px;
  }

  .guru-participation-copy-v223 span{
    font-size:5.4px;
  }

  .guru-participation-progress-v223{
    height:4px;
    margin-top:8px;
  }
}


/* =========================================================
   KAIH v1.2.24 - GURU HERO MOBILE COMPACT FIX
   Desktop dipertahankan; mobile dibuat ringkas & proporsional.
   ========================================================= */
@media(max-width:760px){
  .guru-hero-v223{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 178px auto !important;
    min-height:0 !important;
    height:auto !important;
    border-radius:21px !important;
    overflow:hidden !important;
  }

  .guru-hero-copy-v223{
    grid-row:1;
    padding:17px 18px 13px !important;
  }

  .guru-eyebrow-v223{
    min-height:22px !important;
    font-size:6px !important;
  }

  .guru-hero-copy-v223 h1{
    margin:8px 0 5px !important;
    font-size:25px !important;
    line-height:1.06 !important;
  }

  .guru-hero-copy-v223 h1 em{
    font-size:20px !important;
  }

  .guru-hero-copy-v223>p{
    max-width:100% !important;
    font-size:8px !important;
    line-height:1.45 !important;
  }

  .guru-hero-meta-v223{
    margin-top:10px !important;
    gap:5px !important;
  }

  .guru-hero-meta-v223 span{
    min-height:24px !important;
    padding:0 8px !important;
    font-size:5.4px !important;
  }

  .guru-hero-quote-v223{
    min-height:40px !important;
    margin-top:10px !important;
    padding:7px 9px !important;
    grid-template-columns:17px minmax(0,1fr) !important;
    border-radius:12px !important;
  }

  .guru-hero-quote-v223>span{
    font-size:20px !important;
  }

  .guru-hero-quote-v223 p{
    font-size:5.8px !important;
  }

  .guru-hero-art-v223{
    grid-row:2;
    height:178px !important;
    min-height:178px !important;
    overflow:hidden !important;
  }

  .guru-hero-art-v223 img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center 42% !important;
    transform:scale(1.015) !important;
  }

  .guru-hero-art-fade-v223{
    background:
      linear-gradient(180deg,rgba(47,114,234,.28) 0%,rgba(47,114,234,0) 20%,rgba(65,77,222,.18) 100%) !important;
  }

  .guru-participation-v223{
    grid-row:3;
    position:relative !important;
    inset:auto !important;
    width:auto !important;
    min-height:0 !important;
    margin:-15px 12px 12px !important;
    padding:10px 11px 9px !important;
    border-radius:16px !important;
    z-index:8 !important;
    background:rgba(94,96,231,.86) !important;
    border:1px solid rgba(255,255,255,.26) !important;
    box-shadow:0 10px 24px rgba(36,50,137,.16) !important;
    backdrop-filter:blur(12px) !important;
  }

  .guru-participation-head-v223{
    margin:0 0 6px !important;
  }

  .guru-participation-head-v223 span{
    font-size:6px !important;
  }

  .guru-participation-head-v223 b{
    min-height:19px !important;
    padding:0 7px !important;
    font-size:5px !important;
  }

  .guru-participation-body-v223{
    display:grid !important;
    grid-template-columns:58px minmax(0,1fr) !important;
    gap:9px !important;
    align-items:center !important;
    margin:0 !important;
  }

  .guru-ring-v223{
    width:58px !important;
    height:58px !important;
  }

  .guru-ring-v223>div{
    width:45px !important;
    height:45px !important;
  }

  .guru-ring-v223 strong{
    font-size:14px !important;
  }

  .guru-ring-v223 small{
    margin-top:2px !important;
    font-size:3.8px !important;
  }

  .guru-participation-copy-v223 b{
    font-size:6.7px !important;
  }

  .guru-participation-copy-v223 span{
    margin-top:3px !important;
    font-size:5px !important;
    line-height:1.35 !important;
  }

  .guru-participation-progress-v223{
    height:4px !important;
    margin-top:7px !important;
  }
}

/* HP sempit: jangan biarkan hero melebar/terpotong */
@media(max-width:390px){
  .guru-hero-copy-v223{
    padding-left:15px !important;
    padding-right:15px !important;
  }
  .guru-hero-copy-v223 h1{
    font-size:23px !important;
  }
  .guru-hero-meta-v223 span{
    padding:0 6px !important;
    font-size:5px !important;
  }
  .guru-hero-art-v223{
    height:165px !important;
    min-height:165px !important;
  }
  .guru-participation-v223{
    margin:-13px 9px 9px !important;
  }
}


/* =========================================================
   KAIH v1.2.25 - GURU HERO "TEACHER COMMAND CENTER"
   Match mockup approved: 35% text | 40% character | 25% stats.
   ========================================================= */

.guru-hero-v225{
  position:relative;
  min-height:318px;
  overflow:hidden;
  display:grid;
  grid-template-columns:34% 40% 26%;
  border-radius:28px;
  background:linear-gradient(120deg,#1551c4 0%,#2e73e9 45%,#5c57eb 100%);
  box-shadow:0 22px 52px rgba(38,78,155,.20);
}

.guru-hero-v225:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 8% 0%,rgba(255,255,255,.15),transparent 20%),
    radial-gradient(circle at 82% 10%,rgba(255,255,255,.11),transparent 24%);
}

.guru-hero-left-v225{
  position:relative;
  z-index:3;
  padding:34px 20px 30px 34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  color:#fff;
}

.guru-hero-badge-v225{
  width:max-content;
  min-height:35px;
  padding:0 12px 0 8px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.17);
  color:#fff;
  font-size:8px;
  font-weight:900;
  letter-spacing:.09em;
  backdrop-filter:blur(7px);
}
.guru-hero-badge-v225 img{
  width:25px;
  height:25px;
  padding:3px;
  border-radius:8px;
  background:rgba(255,255,255,.16);
}

.guru-hero-left-v225 h1{
  margin:15px 0 8px;
  color:#fff;
  font-size:39px;
  line-height:1.05;
  letter-spacing:-.04em;
}
.guru-hero-left-v225 h1 em{
  font-style:normal;
  font-size:31px;
}
.guru-hero-left-v225>p{
  max-width:500px;
  margin:0;
  color:rgba(255,255,255,.91);
  font-size:11px;
  line-height:1.6;
}

.guru-hero-quote-v225{
  width:min(450px,94%);
  min-height:70px;
  margin-top:20px;
  padding:12px 14px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  border-radius:17px;
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
}
.guru-hero-quote-v225>span{
  color:#c9ddff;
  font:34px/1 Georgia,serif;
}
.guru-hero-quote-v225 p{
  margin:0;
  color:#fff;
  font-size:8.5px;
  line-height:1.45;
  font-style:italic;
}
.guru-hero-quote-v225 small{
  align-self:end;
  color:rgba(255,255,255,.77);
  font-size:6.5px;
  white-space:nowrap;
}

/* Center visual: no card overlay */
.guru-hero-center-v225{
  position:relative;
  z-index:2;
  overflow:hidden;
  min-width:0;
}
.guru-hero-center-v225 img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 45%;
  transform:scale(1.045);
}
.guru-hero-center-shade-v225{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,#2e73e9 0%,rgba(46,115,233,.18) 15%,rgba(46,115,233,0) 30%),
    linear-gradient(270deg,#555bea 0%,rgba(85,91,234,.12) 13%,rgba(85,91,234,0) 26%);
}

/* Right integrated command panel */
.guru-hero-panel-v225{
  position:relative;
  z-index:4;
  margin:22px 22px 22px 0;
  padding:16px;
  display:flex;
  flex-direction:column;
  border-radius:24px;
  background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.11));
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 16px 36px rgba(37,50,136,.16);
  backdrop-filter:blur(14px);
  color:#fff;
}

.guru-hero-panel-head-v225{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:9px;
}
.guru-hero-panel-head-v225>div{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.guru-hero-panel-head-v225>div>img{
  width:34px;height:34px;padding:5px;border-radius:11px;
  background:rgba(255,255,255,.13);
}
.guru-hero-panel-head-v225 span{
  color:#fff;
  font-size:9px;
  font-weight:850;
}
.guru-hero-panel-head-v225>b{
  min-height:28px;
  padding:0 8px;
  display:flex;
  align-items:center;
  gap:5px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:6px;
  white-space:nowrap;
}
.guru-hero-panel-head-v225>b img{
  width:16px;height:16px;
}

.guru-hero-panel-main-v225{
  flex:1;
  display:grid;
  grid-template-columns:112px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:14px 0 13px;
}

.guru-ring-v225{
  width:112px;
  height:112px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:conic-gradient(#28d58c calc(var(--pct)*1%),rgba(255,255,255,.20) 0);
  box-shadow:0 10px 24px rgba(19,64,103,.15);
}
.guru-ring-v225>div{
  width:86px;
  height:86px;
  display:grid;
  place-content:center;
  text-align:center;
  border-radius:50%;
  background:rgba(23,87,197,.88);
  border:1px solid rgba(255,255,255,.14);
}
.guru-ring-v225 strong{
  color:#fff;
  font-size:27px;
  line-height:1;
}
.guru-ring-v225 small{
  margin-top:5px;
  color:rgba(255,255,255,.78);
  font-size:5.6px;
}

.guru-hero-panel-copy-v225 b{
  display:block;
  color:#fff;
  font-size:11px;
  line-height:1.2;
}
.guru-hero-panel-copy-v225 p{
  margin:7px 0 0;
  color:rgba(255,255,255,.79);
  font-size:7px;
  line-height:1.5;
}

.guru-hero-mini-stats-v225{
  padding-top:12px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
  border-top:1px solid rgba(255,255,255,.17);
}
.guru-hero-mini-stats-v225>div{
  min-height:54px;
  padding:7px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:6px;
  align-items:center;
  border-radius:13px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.12);
}
.guru-hero-mini-stats-v225 i{
  width:30px;height:30px;padding:4px;border-radius:9px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.14);
}
.guru-hero-mini-stats-v225 img{
  width:100%;height:100%;object-fit:contain;
}
.guru-hero-mini-stats-v225 b{
  display:block;color:#fff;font-size:12px;line-height:1
}
.guru-hero-mini-stats-v225 small{
  display:block;margin-top:3px;color:rgba(255,255,255,.72);font-size:5px;line-height:1.2
}

/* Tablet */
@media(max-width:1180px) and (min-width:761px){
  .guru-hero-v225{
    grid-template-columns:36% 38% 26%;
  }
  .guru-hero-left-v225{
    padding-left:26px;
  }
  .guru-hero-left-v225 h1{
    font-size:31px;
  }
  .guru-hero-panel-v225{
    margin-right:14px;
    padding:12px;
  }
  .guru-hero-panel-main-v225{
    grid-template-columns:88px minmax(0,1fr);
    gap:8px;
  }
  .guru-ring-v225{
    width:88px;height:88px;
  }
  .guru-ring-v225>div{
    width:68px;height:68px;
  }
  .guru-ring-v225 strong{font-size:21px}
  .guru-hero-mini-stats-v225>div{
    grid-template-columns:1fr;
    text-align:center;
  }
  .guru-hero-mini-stats-v225 i{
    justify-self:center;
  }
}

/* Mobile mockup: title -> image -> white stats command strip */
@media(max-width:760px){
  .guru-hero-v225{
    display:block;
    min-height:0;
    border-radius:21px;
    overflow:hidden;
  }

  .guru-hero-left-v225{
    padding:15px 14px 12px;
  }

  .guru-hero-badge-v225{
    min-height:25px;
    padding:0 8px 0 5px;
    gap:5px;
    font-size:5.5px;
  }
  .guru-hero-badge-v225 img{
    width:19px;height:19px;padding:2px;border-radius:6px;
  }

  .guru-hero-left-v225 h1{
    margin:8px 0 4px;
    font-size:24px;
  }
  .guru-hero-left-v225 h1 em{font-size:19px}
  .guru-hero-left-v225>p{
    font-size:7.4px;
    line-height:1.42;
  }

  .guru-hero-quote-v225{
    min-height:43px;
    width:100%;
    margin-top:9px;
    padding:7px 8px;
    grid-template-columns:18px minmax(0,1fr) auto;
    border-radius:11px;
  }
  .guru-hero-quote-v225>span{font-size:21px}
  .guru-hero-quote-v225 p{font-size:5.6px}
  .guru-hero-quote-v225 small{font-size:4.7px}

  .guru-hero-center-v225{
    height:170px;
  }
  .guru-hero-center-v225 img{
    object-position:center 43%;
    transform:scale(1.02);
  }
  .guru-hero-center-shade-v225{
    background:linear-gradient(180deg,#2e73e9 0%,rgba(46,115,233,0) 20%,rgba(85,91,234,.13));
  }

  .guru-hero-panel-v225{
    margin:-8px 8px 8px;
    padding:9px;
    border-radius:15px;
    color:#173f73;
    background:rgba(255,255,255,.95);
    border:1px solid rgba(255,255,255,.98);
    box-shadow:0 10px 24px rgba(31,72,129,.13);
    backdrop-filter:blur(11px);
  }

  .guru-hero-panel-head-v225{
    display:none;
  }

  .guru-hero-panel-main-v225{
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    gap:8px;
    padding:0 0 8px;
  }

  .guru-ring-v225{
    width:62px;height:62px;
  }
  .guru-ring-v225>div{
    width:48px;height:48px;
    background:#fff;
  }
  .guru-ring-v225 strong{
    color:#174477;
    font-size:15px;
  }
  .guru-ring-v225 small{
    color:#8093a8;
    font-size:3.7px;
  }

  .guru-hero-panel-copy-v225 b{
    color:#164374;
    font-size:7.2px;
  }
  .guru-hero-panel-copy-v225 p{
    margin-top:3px;
    color:#778ca4;
    font-size:5px;
  }

  .guru-hero-mini-stats-v225{
    padding-top:7px;
    gap:5px;
    border-top:1px solid #e9eef5;
  }
  .guru-hero-mini-stats-v225>div{
    min-height:39px;
    padding:5px;
    grid-template-columns:22px minmax(0,1fr);
    gap:4px;
    border-radius:9px;
    background:#f7faff;
    border:1px solid #ebf0f6;
  }
  .guru-hero-mini-stats-v225 i{
    width:22px;height:22px;padding:3px;border-radius:7px;
    background:#edf5ff;
  }
  .guru-hero-mini-stats-v225 b{
    color:#174477;
    font-size:8px;
  }
  .guru-hero-mini-stats-v225 small{
    margin-top:2px;
    color:#7f92a8;
    font-size:3.8px;
  }
}

@media(max-width:390px){
  .guru-hero-left-v225 h1{font-size:22px}
  .guru-hero-center-v225{height:158px}
  .guru-hero-mini-stats-v225>div{
    grid-template-columns:1fr;
    text-align:center;
  }
  .guru-hero-mini-stats-v225 i{justify-self:center}
}


/* =========================================================
   KAIH v1.2.26 - TEACHER COMMAND CENTER FINAL POLISH
   Desktop: panel kanan lebih lega & readable.
   Mobile: stats strip lebih premium, tidak terlalu tinggi.
   ========================================================= */

/* Desktop readability */
@media(min-width:1181px){
  .guru-hero-v225{
    grid-template-columns:34% 40% 26% !important;
    min-height:324px !important;
  }

  .guru-hero-left-v225{
    padding-left:36px !important;
  }

  .guru-hero-left-v225 h1{
    font-size:40px !important;
  }

  .guru-hero-left-v225>p{
    font-size:11.4px !important;
  }

  .guru-hero-center-v225 img{
    object-position:center 46% !important;
    transform:scale(1.025) !important;
  }

  .guru-hero-panel-v225{
    margin:20px 20px 20px 0 !important;
    padding:16px !important;
    border-radius:22px !important;
  }

  .guru-hero-panel-head-v225 span{
    font-size:9.4px !important;
  }

  .guru-hero-panel-main-v225{
    grid-template-columns:116px minmax(0,1fr) !important;
    gap:14px !important;
  }

  .guru-ring-v225{
    width:116px !important;
    height:116px !important;
  }

  .guru-ring-v225>div{
    width:89px !important;
    height:89px !important;
  }

  .guru-ring-v225 strong{
    font-size:28px !important;
  }

  .guru-hero-panel-copy-v225 b{
    font-size:11.5px !important;
  }

  .guru-hero-panel-copy-v225 p{
    font-size:7.4px !important;
  }

  .guru-hero-mini-stats-v225{
    gap:8px !important;
  }

  .guru-hero-mini-stats-v225>div{
    min-height:58px !important;
    padding:8px !important;
  }

  .guru-hero-mini-stats-v225 b{
    font-size:12.5px !important;
  }

  .guru-hero-mini-stats-v225 small{
    font-size:5.3px !important;
  }
}

/* Mobile: make white command strip slimmer and more premium */
@media(max-width:760px){
  .guru-hero-left-v225{
    padding:14px 14px 10px !important;
  }

  .guru-hero-left-v225 h1{
    font-size:23px !important;
  }

  .guru-hero-left-v225>p{
    font-size:7px !important;
  }

  .guru-hero-quote-v225{
    margin-top:8px !important;
    min-height:39px !important;
  }

  .guru-hero-center-v225{
    height:160px !important;
  }

  .guru-hero-center-v225 img{
    object-position:center 44% !important;
    transform:scale(1.01) !important;
  }

  .guru-hero-panel-v225{
    margin:-10px 8px 8px !important;
    padding:8px !important;
    border-radius:14px !important;
  }

  .guru-hero-panel-main-v225{
    grid-template-columns:56px minmax(0,1fr) !important;
    gap:7px !important;
    padding-bottom:7px !important;
  }

  .guru-ring-v225{
    width:56px !important;
    height:56px !important;
  }

  .guru-ring-v225>div{
    width:43px !important;
    height:43px !important;
  }

  .guru-ring-v225 strong{
    font-size:14px !important;
  }

  .guru-hero-panel-copy-v225 b{
    font-size:6.8px !important;
  }

  .guru-hero-panel-copy-v225 p{
    font-size:4.8px !important;
    line-height:1.35 !important;
  }

  .guru-hero-mini-stats-v225{
    padding-top:6px !important;
    gap:4px !important;
  }

  .guru-hero-mini-stats-v225>div{
    min-height:36px !important;
    padding:4px !important;
    grid-template-columns:20px minmax(0,1fr) !important;
    gap:4px !important;
  }

  .guru-hero-mini-stats-v225 i{
    width:20px !important;
    height:20px !important;
    padding:3px !important;
  }

  .guru-hero-mini-stats-v225 b{
    font-size:7.3px !important;
  }

  .guru-hero-mini-stats-v225 small{
    font-size:3.5px !important;
  }
}

@media(max-width:390px){
  .guru-hero-center-v225{
    height:150px !important;
  }

  .guru-hero-panel-v225{
    margin-top:-8px !important;
  }

  .guru-hero-mini-stats-v225>div{
    grid-template-columns:18px minmax(0,1fr) !important;
    text-align:left !important;
  }

  .guru-hero-mini-stats-v225 i{
    width:18px !important;
    height:18px !important;
  }
}

/* KAIH v1.2.33 — Admin dashboard mobile hero polish */
@media (max-width:700px){
  .dash15-hero{
    height:178px;
    border-radius:18px;
    margin-bottom:12px;
    box-shadow:0 7px 20px rgba(45,91,157,.055);
  }
  .dash15-hero-copy{
    width:100%;
    height:100%;
    padding:20px 18px 18px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    background:linear-gradient(90deg,rgba(230,247,255,.99) 0%,rgba(230,247,255,.97) 42%,rgba(230,247,255,.78) 58%,rgba(230,247,255,.16) 82%,rgba(230,247,255,0) 100%);
  }
  .dash15-hero-copy h1{
    max-width:58%;
    font-size:24px;
    line-height:1.03;
    letter-spacing:-.035em;
  }
  .dash15-hero-copy p{
    max-width:61%;
    margin-top:9px;
    font-size:10.2px;
    line-height:1.5;
  }
  .dash15-hero-art{
    width:70%;
    left:auto;
    right:-3%;
    opacity:.98;
    background-image:url('../images/illustrations/admin-hero-children.jpg');
    background-size:cover;
    background-position:68% center;
  }
}
@media (max-width:430px){
  .dash15-hero{
    height:168px;
    border-radius:17px;
  }
  .dash15-hero-copy{
    padding:17px 16px 15px;
    background:linear-gradient(90deg,rgba(230,247,255,1) 0%,rgba(230,247,255,.98) 45%,rgba(230,247,255,.76) 62%,rgba(230,247,255,.12) 88%,rgba(230,247,255,0) 100%);
  }
  .dash15-hero-copy h1{
    max-width:61%;
    font-size:22px;
    line-height:1.02;
  }
  .dash15-hero-copy p{
    max-width:60%;
    margin-top:8px;
    font-size:9.4px;
    line-height:1.48;
  }
  .dash15-hero-art{
    width:73%;
    right:-7%;
    background-position:69% center;
  }
}
@media (max-width:360px){
  .dash15-hero{height:158px}
  .dash15-hero-copy{padding:15px 14px 13px}
  .dash15-hero-copy h1{font-size:20px;max-width:64%}
  .dash15-hero-copy p{font-size:8.8px;max-width:62%;margin-top:7px}
  .dash15-hero-art{width:76%;right:-10%;background-position:70% center}
}

/* =========================================================
   KAIH v1.2.34 — Admin mobile hero definitive fix
   Uses equal/higher specificity than legacy v1.1.32 rules.
   ========================================================= */
@media (max-width:700px){
  body.role-admin .dash15-hero{
    height:190px !important;
    min-height:190px !important;
    border-radius:20px !important;
    overflow:hidden !important;
    margin-bottom:12px !important;
    background:#e9f6ff !important;
    box-shadow:0 8px 24px rgba(40,84,150,.07) !important;
  }
  body.role-admin .dash15-hero:before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    z-index:1 !important;
    pointer-events:none !important;
    background:linear-gradient(90deg,rgba(237,248,255,1) 0%,rgba(237,248,255,.98) 45%,rgba(237,248,255,.78) 62%,rgba(237,248,255,.25) 80%,rgba(237,248,255,0) 100%) !important;
  }
  body.role-admin .dash15-hero-copy{
    position:relative !important;
    z-index:3 !important;
    width:100% !important;
    height:100% !important;
    padding:22px 20px !important;
    background:none !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
  }
  body.role-admin .dash15-hero-copy h1{
    margin:0 !important;
    max-width:58% !important;
    font-size:25px !important;
    line-height:1.02 !important;
    letter-spacing:-.035em !important;
    text-shadow:none !important;
  }
  body.role-admin .dash15-hero-copy p{
    margin:10px 0 0 !important;
    max-width:62% !important;
    font-size:10px !important;
    line-height:1.48 !important;
    color:#315d94 !important;
  }
  body.role-admin .dash15-hero-art{
    position:absolute !important;
    z-index:0 !important;
    top:0 !important;
    right:-5% !important;
    bottom:0 !important;
    left:auto !important;
    width:75% !important;
    height:100% !important;
    opacity:1 !important;
    background-image:url('../images/illustrations/admin-hero-children.jpg') !important;
    background-size:cover !important;
    background-position:67% center !important;
    background-repeat:no-repeat !important;
  }
}
@media (max-width:430px){
  body.role-admin .dash15-hero{
    height:176px !important;
    min-height:176px !important;
    border-radius:18px !important;
  }
  body.role-admin .dash15-hero-copy{
    padding:18px 17px !important;
  }
  body.role-admin .dash15-hero-copy h1{
    max-width:60% !important;
    font-size:23px !important;
  }
  body.role-admin .dash15-hero-copy p{
    max-width:60% !important;
    margin-top:8px !important;
    font-size:9.2px !important;
    line-height:1.43 !important;
  }
  body.role-admin .dash15-hero-art{
    width:78% !important;
    right:-9% !important;
    background-position:68% center !important;
  }
}
@media (max-width:360px){
  body.role-admin .dash15-hero{height:166px !important;min-height:166px !important}
  body.role-admin .dash15-hero-copy{padding:16px 15px !important}
  body.role-admin .dash15-hero-copy h1{font-size:21px !important;max-width:63% !important}
  body.role-admin .dash15-hero-copy p{font-size:8.6px !important;max-width:61% !important;margin-top:7px !important}
  body.role-admin .dash15-hero-art{width:80% !important;right:-11% !important}
}

/* =========================================================
   KAIH v1.2.35 — Mobile hero composition fix
   Keep the character visible on the right while preserving
   a clean readable text zone on the left.
   ========================================================= */
@media (max-width:700px){
  body.role-admin .dash15-hero:before{
    z-index:2 !important;
    background:linear-gradient(90deg,
      rgba(237,248,255,1) 0%,
      rgba(237,248,255,.99) 30%,
      rgba(237,248,255,.88) 39%,
      rgba(237,248,255,.52) 48%,
      rgba(237,248,255,.14) 58%,
      rgba(237,248,255,0) 67%) !important;
  }
  body.role-admin .dash15-hero-copy{
    z-index:3 !important;
  }
  body.role-admin .dash15-hero-art{
    z-index:1 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:100% !important;
    opacity:1 !important;
    background-size:auto 115% !important;
    background-position:24% center !important;
    background-repeat:no-repeat !important;
  }
  body.role-admin .dash15-hero-copy h1{
    max-width:57% !important;
  }
  body.role-admin .dash15-hero-copy p{
    max-width:54% !important;
  }
}
@media (max-width:430px){
  body.role-admin .dash15-hero:before{
    background:linear-gradient(90deg,
      rgba(237,248,255,1) 0%,
      rgba(237,248,255,.99) 29%,
      rgba(237,248,255,.86) 38%,
      rgba(237,248,255,.46) 47%,
      rgba(237,248,255,.10) 57%,
      rgba(237,248,255,0) 65%) !important;
  }
  body.role-admin .dash15-hero-art{
    background-size:auto 120% !important;
    background-position:23% center !important;
  }
  body.role-admin .dash15-hero-copy h1{
    max-width:58% !important;
  }
  body.role-admin .dash15-hero-copy p{
    max-width:53% !important;
  }
}
@media (max-width:360px){
  body.role-admin .dash15-hero-art{
    background-size:auto 124% !important;
    background-position:22% center !important;
  }
  body.role-admin .dash15-hero-copy h1{max-width:60% !important}
  body.role-admin .dash15-hero-copy p{max-width:55% !important}
}

/* =========================================================
   KAIH v1.2.68 — Guru detail reflection premium polish
   ========================================================= */
.guru-detail-panel-v207.reflection{
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%) !important;
  border:1px solid #dce8f6 !important;
  border-radius:22px !important;
  padding:18px !important;
  box-shadow:0 12px 28px rgba(35,76,135,.06) !important;
}
.guru-detail-panel-v207.reflection .guru-detail-section-head-v207{
  margin-bottom:14px !important;
  padding-bottom:13px !important;
  border-bottom:1px solid #e8eef6 !important;
}
.guru-detail-panel-v207.reflection .guru-detail-title-v208{
  align-items:center !important;
  gap:11px !important;
}
.guru-detail-panel-v207.reflection .guru-detail-title-v208>i{
  width:48px !important;
  height:48px !important;
  flex:0 0 48px !important;
  border-radius:14px !important;
  padding:10px !important;
  background:linear-gradient(145deg,#f2e9ff,#e7ddff) !important;
  border:1px solid #e4d7ff !important;
  box-shadow:0 8px 18px rgba(117,78,215,.12) !important;
}
.guru-detail-panel-v207.reflection .guru-detail-title-v208>i img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
.guru-detail-panel-v207.reflection .guru-detail-title-v208 small{
  font-size:8px !important;
  line-height:1 !important;
  letter-spacing:.12em !important;
  font-weight:800 !important;
  color:#8b75bc !important;
}
.guru-detail-panel-v207.reflection .guru-detail-title-v208 h4{
  margin-top:5px !important;
  font-size:18px !important;
  line-height:1.15 !important;
  color:#173f73 !important;
}
.guru-reflection-card-v207{
  gap:10px !important;
}
.guru-reflection-top-v207{
  padding:0 0 4px !important;
  border:0 !important;
  align-items:center !important;
}
.guru-reflection-top-v207 .date,
.guru-reflection-top-v207 .mood{
  min-height:28px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 11px !important;
  border-radius:999px !important;
  font-size:8px !important;
  line-height:1 !important;
  font-weight:800 !important;
  border:1px solid transparent !important;
}
.guru-reflection-top-v207 .date{
  background:#edf5ff !important;
  color:#2b6fda !important;
  border-color:#dceaff !important;
}
.guru-reflection-top-v207 .mood{
  background:#fff5df !important;
  color:#a96b12 !important;
  border-color:#f8e6bc !important;
}
.guru-reflection-item-v207{
  min-height:76px !important;
  grid-template-columns:42px minmax(0,1fr) !important;
  align-items:center !important;
  gap:12px !important;
  padding:13px 14px !important;
  border-radius:16px !important;
  border:1px solid !important;
  box-shadow:0 4px 12px rgba(42,73,118,.025) !important;
}
.guru-reflection-item-v207.good{
  background:linear-gradient(135deg,#f2fcf7,#eefaf5) !important;
  border-color:#d7f0e3 !important;
}
.guru-reflection-item-v207.challenge{
  background:linear-gradient(135deg,#fff9ef,#fff6e8) !important;
  border-color:#f4e4c8 !important;
}
.guru-reflection-item-v207.plan{
  background:linear-gradient(135deg,#f1f7ff,#edf5ff) !important;
  border-color:#dbe8f8 !important;
}
.guru-reflection-item-v207 i{
  width:42px !important;
  height:42px !important;
  border-radius:13px !important;
  padding:8px !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55) !important;
}
.guru-reflection-item-v207.good i{background:#ddf7e9 !important;color:#15965e !important}
.guru-reflection-item-v207.challenge i{background:#fff0d7 !important;color:#e08b16 !important}
.guru-reflection-item-v207.plan i{background:#dfeeff !important;color:#2f71df !important}
.guru-reflection-item-v207 i img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
.guru-reflection-item-v207 small{
  font-size:8px !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  color:#8395aa !important;
}
.guru-reflection-item-v207 p{
  margin:5px 0 0 !important;
  font-size:10px !important;
  line-height:1.55 !important;
  color:#294e78 !important;
}
.guru-detail-foot-v207{
  min-height:72px !important;
  padding:12px 18px !important;
  background:rgba(255,255,255,.97) !important;
  border-top:1px solid #e2eaf4 !important;
  box-shadow:0 -8px 22px rgba(32,61,104,.045) !important;
}
.guru-detail-lastseen-v208{
  gap:10px !important;
}
.guru-detail-lastseen-v208>img{
  width:34px !important;
  height:34px !important;
}
.guru-detail-lastseen-v208 small{
  font-size:7px !important;
  color:#8a9bb0 !important;
}
.guru-detail-lastseen-v208 b{
  margin-top:3px !important;
  font-size:9px !important;
  color:#35587f !important;
}
.guru-download-v208,
.guru-close-btn-v208{
  min-height:42px !important;
  border-radius:13px !important;
}
.guru-download-v208{
  padding:0 16px !important;
  font-size:8px !important;
}
.guru-close-btn-v208{
  min-width:110px !important;
  font-size:8px !important;
}

@media(max-width:640px){
  .guru-detail-panel-v207.reflection{
    padding:14px !important;
    border-radius:18px !important;
  }
  .guru-detail-panel-v207.reflection .guru-detail-title-v208>i{
    width:40px !important;height:40px !important;flex-basis:40px !important;padding:8px !important;border-radius:12px !important;
  }
  .guru-detail-panel-v207.reflection .guru-detail-title-v208 small{font-size:7px !important}
  .guru-detail-panel-v207.reflection .guru-detail-title-v208 h4{font-size:15px !important}
  .guru-reflection-item-v207{
    min-height:68px !important;
    grid-template-columns:38px minmax(0,1fr) !important;
    gap:10px !important;
    padding:11px !important;
    border-radius:14px !important;
  }
  .guru-reflection-item-v207 i{width:38px !important;height:38px !important;padding:7px !important;border-radius:12px !important}
  .guru-reflection-item-v207 small{font-size:7px !important}
  .guru-reflection-item-v207 p{font-size:9px !important;line-height:1.45 !important}
  .guru-reflection-top-v207 .date,.guru-reflection-top-v207 .mood{min-height:25px !important;font-size:7px !important;padding:0 9px !important}
  .guru-detail-foot-v207{min-height:64px !important;padding:9px 12px !important}
  .guru-detail-lastseen-v208>img{width:28px !important;height:28px !important}
  .guru-detail-lastseen-v208 small{font-size:6px !important}
  .guru-detail-lastseen-v208 b{font-size:7.5px !important}
  .guru-download-v208,.guru-close-btn-v208{min-height:36px !important}
  .guru-download-v208{padding:0 10px !important;font-size:7px !important}
  .guru-close-btn-v208{min-width:84px !important;font-size:7px !important}
}

/* =========================================================
   KAIH v1.2.69 — Guru detail footer readability + print/PDF report fix
   ========================================================= */
.guru-detail-foot-actions-v208 .guru-download-v208,
.guru-detail-foot-actions-v208 .guru-close-btn-v208{
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}
.guru-detail-foot-actions-v208 .guru-download-v208{
  min-height:44px !important;
  padding:0 18px !important;
  gap:8px !important;
}
.guru-detail-foot-actions-v208 .guru-download-v208 img{
  width:18px !important;
  height:18px !important;
}
.guru-detail-foot-actions-v208 .guru-close-btn-v208{
  min-width:116px !important;
  height:44px !important;
}

@media(max-width:640px){
  .guru-detail-foot-actions-v208 .guru-download-v208,
  .guru-detail-foot-actions-v208 .guru-close-btn-v208{
    font-size:11px !important;
    font-weight:800 !important;
  }
  .guru-detail-foot-actions-v208 .guru-download-v208{
    min-height:40px !important;
    padding:0 12px !important;
  }
  .guru-detail-foot-actions-v208 .guru-download-v208 img{
    width:16px !important;
    height:16px !important;
  }
  .guru-detail-foot-actions-v208 .guru-close-btn-v208{
    min-width:88px !important;
    height:40px !important;
  }
}

@media print{
  @page{size:A4 portrait;margin:10mm}
  html,body{
    width:auto !important;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
    background:#fff !important;
    -webkit-print-color-adjust:exact !important;
    print-color-adjust:exact !important;
  }

  /* Remove normal application layout completely so hidden content does not create blank pages. */
  body > .app-shell > .sidebar,
  body > .app-shell > .menu-overlay,
  .role-member-topbar,
  .topbar,
  .guru-students-hero-v203,
  .guru-student-stats-v200,
  .guru-student-filter-card-v220,
  .guru-student-list-v205,
  .guru-pagination-v205,
  .alert,
  .guru-detail-modal-v207 > .modal-backdrop,
  .guru-detail-close-v207,
  .guru-detail-foot-actions-v208{
    display:none !important;
  }

  .app-shell,
  .main,
  .content,
  .guru-students-v200{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    background:#fff !important;
  }

  /* Print the opened student detail as a normal document, not as a fixed/scrolling modal. */
  .guru-detail-modal-v207{
    display:block !important;
    visibility:visible !important;
    position:static !important;
    inset:auto !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
    background:#fff !important;
  }
  .guru-detail-modal-v207,
  .guru-detail-modal-v207 *{
    visibility:visible !important;
  }
  .guru-detail-card-v207{
    display:block !important;
    position:static !important;
    width:100% !important;
    max-width:none !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:#fff !important;
  }
  .guru-detail-content-v207{
    display:grid !important;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;
    gap:12px !important;
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    padding:12px 0 0 !important;
    overflow:visible !important;
  }
  .guru-detail-side-v207{
    display:grid !important;
    gap:12px !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
  .guru-detail-hero-v207{
    min-height:112px !important;
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }
  .guru-detail-panel-v207,
  .guru-detail-habit-v207,
  .guru-reflection-item-v207,
  .guru-portfolio-item-v207,
  .teacher-note-panel-v1265,
  .teacher-note-history-item-v1265{
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }
  .guru-detail-foot-v207{
    display:none !important;
  }

  /* Make report text readable on paper. */
  .guru-detail-profile-v207 h3{font-size:20px !important}
  .guru-detail-profile-v207 p{font-size:9px !important}
  .guru-detail-title-v208 h4{font-size:13px !important}
  .guru-detail-title-v208 small{font-size:7px !important}
  .guru-detail-habit-copy-v207 b,
  .guru-portfolio-item-v207 b{font-size:9px !important}
  .guru-detail-habit-copy-v207 small,
  .guru-reflection-item-v207 p,
  .guru-portfolio-item-v207 p{font-size:8px !important}
}

/* =========================================================
   KAIH v1.2.70 — Guru detail footer button text readability
   ========================================================= */
.guru-detail-foot-actions-v208 .guru-download-v208,
.guru-detail-foot-actions-v208 .guru-close-btn-v208{
  font-size:15px !important;
  font-weight:800 !important;
  line-height:1 !important;
}
.guru-detail-foot-actions-v208 .guru-download-v208 span,
.guru-detail-foot-actions-v208 .guru-close-btn-v208 span{
  font-size:inherit !important;
  font-weight:inherit !important;
  line-height:1 !important;
}
.guru-detail-foot-actions-v208 .guru-download-v208{
  min-height:48px !important;
  padding:0 20px !important;
}
.guru-detail-foot-actions-v208 .guru-close-btn-v208{
  min-width:124px !important;
  height:48px !important;
}
@media(max-width:640px){
  .guru-detail-foot-actions-v208 .guru-download-v208,
  .guru-detail-foot-actions-v208 .guru-close-btn-v208{
    font-size:13px !important;
  }
  .guru-detail-foot-actions-v208 .guru-download-v208{
    min-height:44px !important;
    padding:0 14px !important;
  }
  .guru-detail-foot-actions-v208 .guru-close-btn-v208{
    min-width:96px !important;
    height:44px !important;
  }
}


/* =========================================================
   KAIH v1.2.71 — Guru detail footer typography polish
   ========================================================= */
.guru-detail-foot-actions-v208 .guru-download-v208,
.guru-detail-foot-actions-v208 .guru-close-btn-v208{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-size:14px !important;
  font-weight:650 !important;
  line-height:1.2 !important;
  letter-spacing:-.01em !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
}
.guru-detail-foot-actions-v208 .guru-close-btn-v208{font-weight:700 !important}
.guru-detail-foot-actions-v208 .guru-download-v208 span,
.guru-detail-foot-actions-v208 .guru-close-btn-v208 span{
  font-size:inherit !important;
  font-weight:inherit !important;
  line-height:inherit !important;
  letter-spacing:inherit !important;
}
.guru-detail-foot-actions-v208 .guru-download-v208 img{width:17px !important;height:17px !important}
@media(max-width:640px){
  .guru-detail-foot-actions-v208 .guru-download-v208,
  .guru-detail-foot-actions-v208 .guru-close-btn-v208{font-size:12.5px !important}
  .guru-detail-foot-actions-v208 .guru-download-v208 img{width:16px !important;height:16px !important}
}

/* =========================================================
   KAIH v1.2.72 — Clean read-only PDF report
   Remove interactive form controls from print/PDF and show saved teacher note.
   ========================================================= */
.guru-note-print-v272,
.guru-print-signature-v272,
.guru-print-footer-v272{display:none}

@media print{
  /* PDF must look like a report, never like an editable form. */
  .guru-note-form-v265,
  .guru-note-history-v265,
  .guru-note-save-v265,
  .guru-note-form-foot-v265,
  .guru-note-form-v265 textarea,
  button,
  input,
  select{
    display:none !important;
  }

  .guru-note-panel-v265{
    grid-column:1/-1 !important;
    display:block !important;
    margin:12px 0 0 !important;
    padding:16px 18px !important;
    border:1px solid #d6eadf !important;
    border-radius:14px !important;
    background:linear-gradient(180deg,#fbfffd 0%,#f5fbf8 100%) !important;
    box-shadow:none !important;
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }
  .guru-note-title-v265 p{display:none !important}
  .guru-note-title-v265 h4{font-size:14px !important}
  .guru-note-title-v265 small{font-size:7px !important}
  .guru-note-icon-v265{width:34px !important;height:34px !important;flex-basis:34px !important}
  .guru-note-icon-v265 svg{width:17px !important;height:17px !important}

  .guru-note-print-v272{
    display:block !important;
    margin-top:12px !important;
    padding:14px 15px !important;
    border:1px solid #dbe9e2 !important;
    border-radius:12px !important;
    background:#fff !important;
  }
  .guru-note-print-head-v272{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    margin-bottom:8px !important;
  }
  .guru-note-print-head-v272 span{
    color:#477565 !important;
    font-size:7px !important;
    font-weight:800 !important;
    letter-spacing:.08em !important;
  }
  .guru-note-print-head-v272 small{
    color:#809489 !important;
    font-size:7px !important;
  }
  .guru-note-print-v272 p{
    margin:0 !important;
    color:#233d33 !important;
    font-size:9px !important;
    line-height:1.6 !important;
    white-space:normal !important;
  }
  .guru-note-print-v272 p.empty{color:#84958e !important;font-style:italic !important}

  .guru-print-signature-v272{
    display:grid !important;
    grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr) !important;
    gap:18px !important;
    align-items:stretch !important;
    margin-top:14px !important;
    padding:14px 16px !important;
    border:1px solid #e2eaf4 !important;
    border-radius:14px !important;
    background:#fbfdff !important;
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }
  .guru-print-quote-v272{
    display:flex !important;
    align-items:center !important;
    min-height:74px !important;
    padding-left:14px !important;
    border-left:3px solid #3479e9 !important;
  }
  .guru-print-quote-v272 p{
    margin:0 !important;
    color:#244c7c !important;
    font-size:10px !important;
    line-height:1.55 !important;
    font-style:italic !important;
  }
  .guru-print-sign-v272{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:16px !important;
  }
  .guru-print-sign-v272>div{
    display:grid !important;
    align-content:end !important;
    text-align:center !important;
    min-height:74px !important;
    color:#42658f !important;
  }
  .guru-print-sign-v272 span{font-size:8px !important;font-weight:700 !important}
  .guru-print-sign-v272 i{
    display:block !important;
    height:34px !important;
    border-bottom:1px solid #aabbd0 !important;
    margin:0 10px 5px !important;
  }
  .guru-print-sign-v272 b{font-size:7px !important;font-weight:500 !important}

  .guru-print-footer-v272{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:16px !important;
    margin-top:12px !important;
    padding:8px 2px 0 !important;
    border-top:1px solid #edf1f5 !important;
    color:#71839a !important;
    font-size:7px !important;
  }
}

/* =========================================================
   KAIH v1.2.76 - Data Siswa hero artwork crop fix
   The approved banner artwork already contains its own left-side UI.
   Crop the artwork to the illustration side so the live HTML copy/stats
   are not duplicated inside the hero.
   ========================================================= */
@media (min-width:701px){
  .guru-students-hero-art-v203{
    overflow:hidden !important;
  }
  .guru-students-hero-art-v203 img{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    left:auto !important;
    width:170% !important;
    max-width:none !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:right center !important;
  }
  .guru-students-hero-art-v203:before{
    width:24% !important;
    background:linear-gradient(90deg,#dff0ff 0%,rgba(223,240,255,.80) 32%,rgba(223,240,255,0) 100%) !important;
  }
}
@media (max-width:700px){
  .guru-students-hero-art-v203{overflow:hidden !important}
  .guru-students-hero-art-v203 img{
    position:absolute !important;
    inset:0 0 0 auto !important;
    width:155% !important;
    max-width:none !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:right center !important;
  }
}

/* =========================================================
   KAIH v1.2.78 - GURU DASHBOARD HERO NO HIJAB (CUMULATIVE SAFE FIX)
   Keeps all v1.2.76+ Data Siswa / PDF / reflection styles intact.
   Only swaps the Guru Dashboard center artwork visually.
   ========================================================= */
.guru-hero-art-v199{
  background-image:url('../images/heroes/guru-dashboard-teachers-no-hijab-v1277.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
.guru-hero-art-v199 > img{
  opacity:0 !important;
  visibility:hidden !important;
}
.guru-hero-art-v199:before{
  background:linear-gradient(90deg,rgba(38,95,216,.72),rgba(38,95,216,0) 25%,rgba(63,78,220,.12)) !important;
}
@media(max-width:1180px){
  .guru-hero-art-v199{background-position:center 45% !important}
}
@media(max-width:760px){
  .guru-hero-art-v199{
    background-position:center 42% !important;
    background-size:cover !important;
  }
}

/* =========================================================
   KAIH v1.3.00 - Guru/Siswa use the single global brand logo.
   Removes legacy role-specific background logo override.
   ========================================================= */
.role-siswa .brand-emblem,
.role-guru .brand-emblem,
.student-role .brand-emblem{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.role-siswa .brand-emblem:after,
.role-guru .brand-emblem:after,
.student-role .brand-emblem:after{
  display:none !important;
}
.role-siswa .brand-emblem img.kaih-brand-logo,
.role-guru .brand-emblem img.kaih-brand-logo,
.student-role .brand-emblem img.kaih-brand-logo{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:contain !important;
  object-position:center !important;
  border-radius:18px !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* =========================================================
   KAIH v1.3.02 - Guru Perkembangan Hero composition fix
   Keep teacher fully visible; avoid over-zoom/cropped face.
   ========================================================= */
.guru-progress-art-v210{
  position:relative !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 70% 20%,rgba(255,255,255,.58),transparent 32%),
    linear-gradient(135deg,#dff1ff 0%,#d8eeff 58%,#cfe7fb 100%) !important;
}
.guru-progress-art-v210:before{
  width:30% !important;
  background:linear-gradient(90deg,#e2f2ff 0%,rgba(226,242,255,.72) 45%,rgba(226,242,255,0) 100%) !important;
}
.guru-progress-art-v210 img{
  position:absolute !important;
  right:0 !important;
  bottom:-70px !important;
  width:auto !important;
  height:150% !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:right bottom !important;
}
.guru-progress-score-v210{
  right:18px !important;
  top:18px !important;
}
@media(max-width:1050px){
  .guru-progress-art-v210 img{
    right:-12px !important;
    bottom:-58px !important;
    height:144% !important;
  }
}
@media(max-width:700px){
  .guru-progress-art-v210 img{
    right:0 !important;
    bottom:-70px !important;
    height:165% !important;
  }
  .guru-progress-art-v210:before{
    inset:0 !important;
    width:auto !important;
    height:55px !important;
    background:linear-gradient(180deg,#e7f4ff 0%,rgba(231,244,255,.12) 72%,rgba(231,244,255,0) 100%) !important;
  }
}

/* =========================================================
   KAIH v1.3.03 - Guru Perkembangan Hero Responsive Polish
   Desktop: teacher fully visible, score clear of face.
   Mobile: text > score > illustration, no overlap/cropping.
   ========================================================= */
.guru-progress-hero-v210{
  isolation:isolate !important;
}
.guru-progress-art-v210{
  min-width:0 !important;
  background:linear-gradient(135deg,#e5f4ff 0%,#d9efff 60%,#d3eafd 100%) !important;
}
.guru-progress-art-v210:before{
  z-index:2 !important;
  pointer-events:none !important;
}
.guru-progress-art-v210 img{
  position:absolute !important;
  z-index:1 !important;
  right:0 !important;
  bottom:-18% !important;
  width:auto !important;
  height:118% !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:right bottom !important;
}
.guru-progress-score-v210{
  box-sizing:border-box !important;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}

@media (min-width:1051px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,1fr) minmax(430px,38%) !important;
  }
  .guru-progress-art-v210 img{
    right:2px !important;
    bottom:-17% !important;
    height:117% !important;
  }
  .guru-progress-score-v210{
    top:18px !important;
    right:18px !important;
    width:148px !important;
    min-height:112px !important;
    padding:14px !important;
  }
}

@media (min-width:701px) and (max-width:1050px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,1fr) 350px !important;
  }
  .guru-progress-art-v210 img{
    right:-2px !important;
    bottom:-16% !important;
    height:116% !important;
  }
  .guru-progress-score-v210{
    top:16px !important;
    right:14px !important;
    width:132px !important;
    min-height:104px !important;
    padding:12px !important;
  }
}

@media(max-width:700px){
  .guru-progress-hero-v210{
    min-height:445px !important;
    display:block !important;
    border-radius:20px !important;
    overflow:hidden !important;
  }
  .guru-progress-copy-v210{
    position:relative !important;
    z-index:5 !important;
    min-height:0 !important;
    padding:18px 16px 12px !important;
  }
  .guru-progress-copy-v210 h1{
    margin-top:7px !important;
    font-size:24px !important;
    line-height:1.08 !important;
  }
  .guru-progress-copy-v210 p{
    max-width:100% !important;
    font-size:7.8px !important;
    line-height:1.55 !important;
  }
  .guru-progress-hero-chips-v210{
    margin-top:10px !important;
  }
  .guru-progress-art-v210{
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    height:190px !important;
    overflow:hidden !important;
  }
  .guru-progress-art-v210:before{
    inset:0 !important;
    width:auto !important;
    height:42px !important;
    background:linear-gradient(180deg,#e3f3ff 0%,rgba(227,243,255,.72) 36%,rgba(227,243,255,0) 100%) !important;
  }
  .guru-progress-art-v210 img{
    right:0 !important;
    bottom:-30px !important;
    width:auto !important;
    height:220px !important;
    max-width:none !important;
    object-fit:contain !important;
  }
  .guru-progress-score-v210{
    left:16px !important;
    right:16px !important;
    top:165px !important;
    bottom:auto !important;
    width:auto !important;
    min-height:88px !important;
    padding:11px 13px !important;
    border-radius:15px !important;
    z-index:7 !important;
  }
  .guru-progress-score-v210 strong{
    margin-top:3px !important;
    font-size:24px !important;
  }
  .guru-progress-score-v210 span,
  .guru-progress-score-v210 small{
    font-size:5.8px !important;
  }
  .guru-progress-score-track-v210{
    margin-top:9px !important;
  }
}

@media(max-width:420px){
  .guru-progress-hero-v210{
    min-height:430px !important;
  }
  .guru-progress-score-v210{
    top:158px !important;
  }
  .guru-progress-art-v210{
    height:180px !important;
  }
  .guru-progress-art-v210 img{
    height:208px !important;
    bottom:-28px !important;
  }
}

/* =========================================================
   KAIH v1.3.04 - Guru Perkembangan Hero Layout Final Polish
   Desktop: balanced copy/art, no excessive empty middle area.
   Mobile: true stacked layout; score and artwork no longer overlap.
   ========================================================= */
.guru-progress-hero-v210{
  min-height:286px !important;
  grid-template-columns:minmax(0,56%) minmax(0,44%) !important;
}
.guru-progress-copy-v210{
  padding:30px 28px 28px 40px !important;
}
.guru-progress-art-v210{
  min-width:0 !important;
  position:relative !important;
  overflow:hidden !important;
}
.guru-progress-art-v210 img{
  position:absolute !important;
  right:-4px !important;
  bottom:-38px !important;
  width:auto !important;
  height:128% !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:right bottom !important;
}
.guru-progress-score-v210{
  top:22px !important;
  right:22px !important;
  width:156px !important;
  min-height:116px !important;
  padding:15px !important;
}

@media (min-width:1200px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,58%) minmax(0,42%) !important;
  }
  .guru-progress-art-v210 img{
    right:0 !important;
    bottom:-34px !important;
    height:126% !important;
  }
}

@media (min-width:701px) and (max-width:1050px){
  .guru-progress-hero-v210{
    min-height:274px !important;
    grid-template-columns:minmax(0,54%) minmax(0,46%) !important;
  }
  .guru-progress-copy-v210{
    padding:27px 22px 25px 28px !important;
  }
  .guru-progress-copy-v210 h1{
    font-size:29px !important;
  }
  .guru-progress-art-v210 img{
    right:-8px !important;
    bottom:-28px !important;
    height:120% !important;
  }
  .guru-progress-score-v210{
    top:16px !important;
    right:14px !important;
    width:136px !important;
    min-height:104px !important;
    padding:12px !important;
  }
}

@media(max-width:700px){
  .guru-progress-hero-v210{
    min-height:0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto 220px !important;
    grid-template-areas:
      "copy"
      "score"
      "art" !important;
    align-items:stretch !important;
    gap:0 !important;
    overflow:hidden !important;
    border-radius:20px !important;
  }
  .guru-progress-copy-v210{
    grid-area:copy !important;
    position:relative !important;
    min-height:0 !important;
    padding:22px 18px 16px !important;
  }
  .guru-progress-copy-v210 h1{
    margin:7px 0 7px !important;
    font-size:27px !important;
    line-height:1.08 !important;
  }
  .guru-progress-copy-v210 p{
    max-width:100% !important;
    font-size:8.5px !important;
    line-height:1.55 !important;
  }
  .guru-progress-hero-chips-v210{
    margin-top:13px !important;
    gap:8px !important;
  }
  .guru-progress-score-v210{
    grid-area:score !important;
    position:relative !important;
    inset:auto !important;
    width:auto !important;
    min-height:0 !important;
    margin:0 18px 16px !important;
    padding:14px 16px !important;
    border-radius:17px !important;
    z-index:6 !important;
  }
  .guru-progress-score-v210 strong{
    margin-top:4px !important;
    font-size:29px !important;
  }
  .guru-progress-score-v210 span,
  .guru-progress-score-v210 small{
    font-size:6.5px !important;
  }
  .guru-progress-score-track-v210{
    margin-top:10px !important;
  }
  .guru-progress-art-v210{
    grid-area:art !important;
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:220px !important;
    overflow:hidden !important;
    background:linear-gradient(180deg,#dcefff 0%,#d3eafd 100%) !important;
  }
  .guru-progress-art-v210:before{
    inset:0 !important;
    width:100% !important;
    height:46px !important;
    background:linear-gradient(180deg,#dff1ff 0%,rgba(223,241,255,.72) 45%,rgba(223,241,255,0) 100%) !important;
  }
  .guru-progress-art-v210 img{
    position:absolute !important;
    right:-6px !important;
    bottom:-38px !important;
    width:auto !important;
    height:132% !important;
    max-width:none !important;
    object-fit:contain !important;
    object-position:right bottom !important;
  }
}

@media(max-width:420px){
  .guru-progress-copy-v210{
    padding:20px 16px 14px !important;
  }
  .guru-progress-copy-v210 h1{
    font-size:25px !important;
  }
  .guru-progress-score-v210{
    margin:0 16px 14px !important;
  }
  .guru-progress-hero-v210{
    grid-template-rows:auto auto 205px !important;
  }
  .guru-progress-art-v210{
    height:205px !important;
  }
  .guru-progress-art-v210 img{
    right:-14px !important;
    bottom:-34px !important;
    height:130% !important;
  }
}

/* =========================================================
   KAIH v1.3.05 - Guru Perkembangan Hero No-Collision Layout
   Desktop/tablet: copy, artwork, score are three real grid columns.
   Mobile: copy -> score -> artwork. No overlapping/absolute score card.
   ========================================================= */
.guru-progress-hero-v210{
  display:grid !important;
  grid-template-columns:minmax(0,56%) minmax(250px,28%) minmax(150px,16%) !important;
  grid-template-areas:"copy art score" !important;
  align-items:stretch !important;
  min-height:286px !important;
  overflow:hidden !important;
}
.guru-progress-copy-v210{
  grid-area:copy !important;
  position:relative !important;
  z-index:2 !important;
  min-width:0 !important;
  padding:30px 28px 28px 40px !important;
}
.guru-progress-art-v210{
  grid-area:art !important;
  position:relative !important;
  inset:auto !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;
  overflow:hidden !important;
  background:#dcefff !important;
}
.guru-progress-art-v210:before{
  content:"" !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:48px !important;
  height:auto !important;
  z-index:1 !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,#dcefff 0%,rgba(220,239,255,.78) 38%,rgba(220,239,255,0) 100%) !important;
}
.guru-progress-art-v210 img{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  object-position:58% center !important;
  transform:none !important;
}
.guru-progress-score-v210{
  grid-area:score !important;
  position:relative !important;
  inset:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  align-self:center !important;
  justify-self:stretch !important;
  width:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:20px 20px 20px 8px !important;
  padding:15px 15px 14px !important;
  border-radius:18px !important;
  z-index:4 !important;
  box-sizing:border-box !important;
}
.guru-progress-score-v210 strong{
  font-size:31px !important;
  line-height:1 !important;
}

@media (min-width:701px) and (max-width:1100px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,50%) minmax(230px,31%) minmax(135px,19%) !important;
    min-height:274px !important;
  }
  .guru-progress-copy-v210{
    padding:27px 20px 25px 28px !important;
  }
  .guru-progress-copy-v210 h1{
    font-size:29px !important;
  }
  .guru-progress-score-v210{
    margin:16px 14px 16px 6px !important;
    padding:12px !important;
    border-radius:16px !important;
  }
  .guru-progress-score-v210 strong{
    font-size:27px !important;
  }
  .guru-progress-art-v210 img{
    object-position:62% center !important;
  }
}

@media(max-width:700px){
  .guru-progress-hero-v210{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto 210px !important;
    grid-template-areas:
      "copy"
      "score"
      "art" !important;
    min-height:0 !important;
    gap:0 !important;
    overflow:hidden !important;
  }
  .guru-progress-copy-v210{
    grid-area:copy !important;
    padding:22px 18px 16px !important;
  }
  .guru-progress-score-v210{
    grid-area:score !important;
    position:relative !important;
    inset:auto !important;
    width:auto !important;
    margin:0 18px 16px !important;
    padding:14px 16px !important;
    align-self:stretch !important;
    justify-self:stretch !important;
    border-radius:17px !important;
  }
  .guru-progress-art-v210{
    grid-area:art !important;
    position:relative !important;
    width:100% !important;
    height:210px !important;
    overflow:hidden !important;
    background:#dcefff !important;
  }
  .guru-progress-art-v210:before{
    inset:0 !important;
    width:100% !important;
    height:34px !important;
    background:linear-gradient(180deg,#dcefff 0%,rgba(220,239,255,.72) 46%,rgba(220,239,255,0) 100%) !important;
  }
  .guru-progress-art-v210 img{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:60% 44% !important;
  }
}

@media(max-width:420px){
  .guru-progress-hero-v210{
    grid-template-rows:auto auto 195px !important;
  }
  .guru-progress-copy-v210{
    padding:20px 16px 14px !important;
  }
  .guru-progress-score-v210{
    margin:0 16px 14px !important;
  }
  .guru-progress-art-v210{
    height:195px !important;
  }
  .guru-progress-art-v210 img{
    object-position:62% 44% !important;
  }
}

/* =========================================================
   KAIH v1.3.06 - Guru Perkembangan Hero Premium Balanced Layout
   Real 3-column layout. No overlay/collision. Artwork uses contain.
   ========================================================= */
.guru-progress-hero-v210{
  display:grid !important;
  grid-template-columns:minmax(0,43%) minmax(290px,35%) minmax(205px,22%) !important;
  grid-template-areas:"copy art score" !important;
  min-height:320px !important;
  align-items:stretch !important;
  overflow:hidden !important;
  border-radius:26px !important;
  background:
    radial-gradient(circle at 31% 2%,rgba(255,255,255,.94),transparent 30%),
    linear-gradient(135deg,#eef9ff 0%,#e5f4ff 49%,#d8edff 100%) !important;
}
.guru-progress-copy-v210{
  grid-area:copy !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  position:relative !important;
  z-index:2 !important;
  min-width:0 !important;
  padding:36px 22px 34px 42px !important;
}
.guru-progress-copy-v210 .eyebrow{
  color:#8297ad !important;
  font-size:11px !important;
  letter-spacing:.105em !important;
  font-weight:900 !important;
}
.guru-progress-copy-v210 h1{
  margin:8px 0 8px !important;
  color:#0c447d !important;
  font-size:36px !important;
  line-height:1.04 !important;
  letter-spacing:-.04em !important;
}
.guru-progress-copy-v210 p{
  max-width:510px !important;
  color:#5d7ca1 !important;
  font-size:11.5px !important;
  line-height:1.6 !important;
}
.guru-progress-hero-chips-v210{margin-top:18px !important;gap:9px !important}
.guru-progress-hero-chips-v210 span{
  min-height:31px !important;
  padding:0 12px !important;
  font-size:7.5px !important;
  color:#165bb5 !important;
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(255,255,255,.98) !important;
  box-shadow:0 8px 20px rgba(48,91,141,.06) !important;
}
.guru-progress-art-v210{
  grid-area:art !important;
  position:relative !important;
  inset:auto !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;
  overflow:hidden !important;
  background:transparent !important;
}
.guru-progress-art-v210:before{
  content:"" !important;
  position:absolute !important;
  z-index:2 !important;
  inset:0 auto 0 0 !important;
  width:62px !important;
  height:auto !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,#e5f4ff 0%,rgba(229,244,255,.82) 34%,rgba(229,244,255,0) 100%) !important;
}
.guru-progress-art-v210 img{
  position:absolute !important;
  inset:12px 0 0 0 !important;
  width:100% !important;
  height:calc(100% - 12px) !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  transform:none !important;
  filter:drop-shadow(0 10px 20px rgba(36,77,126,.08)) !important;
}
.guru-progress-score-v210{
  grid-area:score !important;
  position:relative !important;
  inset:auto !important;
  align-self:center !important;
  justify-self:stretch !important;
  width:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:24px 24px 24px 10px !important;
  padding:20px !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.93) !important;
  border:1px solid rgba(255,255,255,.98) !important;
  box-shadow:0 18px 38px rgba(44,82,128,.11) !important;
  backdrop-filter:blur(10px) !important;
}
.guru-progress-score-head-v1306{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.guru-progress-score-head-v1306>div{min-width:0}
.guru-progress-score-v210 span{font-size:8px !important;color:#7d92a9 !important}
.guru-progress-score-v210 strong{margin-top:5px !important;font-size:36px !important;color:#2f70e4 !important}
.guru-progress-score-v210 small{margin-top:7px !important;font-size:7px !important;color:#7f93aa !important}
.guru-progress-score-icon-v1306{
  width:38px;height:38px;flex:0 0 38px;border-radius:50%;display:grid !important;place-items:center;
  background:#eaf4ff;color:#4b90ed !important
}
.guru-progress-score-icon-v1306 svg{width:20px;height:20px;display:block}
.guru-progress-score-track-v210{height:7px !important;margin-top:16px !important;background:#e8eef6 !important}
.guru-progress-score-note-v1306{
  margin-top:16px;padding:11px 12px;border-radius:13px;display:flex;align-items:center;gap:8px;
  background:linear-gradient(135deg,#eefaf4,#e8f7ef);color:#25845f
}
.guru-progress-score-note-v1306 span{font-size:14px !important;color:#2d9a6d !important;line-height:1}
.guru-progress-score-note-v1306 b{font-size:8px;line-height:1.35;font-weight:800}

@media(min-width:701px) and (max-width:1180px){
  .guru-progress-hero-v210{grid-template-columns:minmax(0,40%) minmax(270px,37%) minmax(190px,23%) !important;min-height:300px !important}
  .guru-progress-copy-v210{padding:30px 16px 28px 28px !important}
  .guru-progress-copy-v210 h1{font-size:31px !important}
  .guru-progress-copy-v210 p{font-size:10.5px !important}
  .guru-progress-score-v210{margin:20px 16px 20px 8px !important;padding:16px !important}
  .guru-progress-score-v210 strong{font-size:31px !important}
  .guru-progress-score-note-v1306{padding:9px 10px !important}
}

@media(max-width:700px){
  .guru-progress-hero-v210{
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto minmax(245px,auto) !important;
    grid-template-areas:"copy" "score" "art" !important;
    min-height:0 !important;
    border-radius:22px !important;
  }
  .guru-progress-copy-v210{padding:24px 20px 15px !important}
  .guru-progress-copy-v210 .eyebrow{font-size:10px !important}
  .guru-progress-copy-v210 h1{font-size:28px !important;margin-top:7px !important}
  .guru-progress-copy-v210 p{font-size:9px !important;max-width:100% !important}
  .guru-progress-hero-chips-v210{margin-top:14px !important}
  .guru-progress-hero-chips-v210 span{min-height:29px !important;font-size:7px !important}
  .guru-progress-score-v210{
    margin:0 20px 14px !important;
    padding:16px 17px !important;
    border-radius:18px !important;
  }
  .guru-progress-score-v210 strong{font-size:32px !important}
  .guru-progress-score-note-v1306{margin-top:12px !important}
  .guru-progress-art-v210{height:260px !important;min-height:260px !important}
  .guru-progress-art-v210:before{
    inset:0 !important;width:100% !important;height:38px !important;
    background:linear-gradient(180deg,#e5f4ff 0%,rgba(229,244,255,.74) 42%,rgba(229,244,255,0) 100%) !important
  }
  .guru-progress-art-v210 img{
    inset:0 !important;width:100% !important;height:100% !important;
    object-fit:contain !important;object-position:center bottom !important
  }
}

@media(max-width:420px){
  .guru-progress-copy-v210{padding:21px 17px 14px !important}
  .guru-progress-copy-v210 h1{font-size:26px !important}
  .guru-progress-score-v210{margin:0 17px 12px !important}
  .guru-progress-art-v210{height:235px !important;min-height:235px !important}
}

/* =========================================================
   KAIH v1.3.07 - Guru Perkembangan Hero Composition Polish
   Fix: artwork is an intentional card, no white bands, no collision.
   ========================================================= */
.guru-progress-hero-v210{
  grid-template-columns:minmax(0,42%) minmax(300px,34%) minmax(210px,24%) !important;
  min-height:330px !important;
}
.guru-progress-art-v210{
  align-self:stretch !important;
  margin:18px 0 !important;
  min-height:294px !important;
  border-radius:22px !important;
  overflow:hidden !important;
  background:#dcefff !important;
  box-shadow:0 14px 34px rgba(42,86,136,.10) !important;
}
.guru-progress-art-v210:before{
  inset:0 auto 0 0 !important;
  width:34px !important;
  height:auto !important;
  background:linear-gradient(90deg,rgba(229,244,255,.96) 0%,rgba(229,244,255,.54) 40%,rgba(229,244,255,0) 100%) !important;
}
.guru-progress-art-v210 img{
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  background:#dcefff !important;
}
.guru-progress-score-v210{
  margin:28px 26px 28px 18px !important;
}

@media(min-width:701px) and (max-width:1180px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,39%) minmax(270px,36%) minmax(190px,25%) !important;
    min-height:310px !important;
  }
  .guru-progress-art-v210{
    margin:16px 0 !important;
    min-height:278px !important;
  }
  .guru-progress-score-v210{margin:22px 18px 22px 12px !important}
}

@media(max-width:700px){
  .guru-progress-hero-v210{
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto auto !important;
    grid-template-areas:"copy" "score" "art" !important;
    min-height:0 !important;
    padding-bottom:16px !important;
  }
  .guru-progress-score-v210{
    margin:0 20px 16px !important;
  }
  .guru-progress-art-v210{
    width:min(360px,calc(100% - 40px)) !important;
    height:300px !important;
    min-height:0 !important;
    margin:0 auto !important;
    border-radius:20px !important;
    box-shadow:0 12px 28px rgba(42,86,136,.10) !important;
  }
  .guru-progress-art-v210:before{
    inset:0 !important;
    width:100% !important;
    height:28px !important;
    background:linear-gradient(180deg,rgba(229,244,255,.72) 0%,rgba(229,244,255,0) 100%) !important;
  }
  .guru-progress-art-v210 img{
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center top !important;
  }
}

@media(max-width:420px){
  .guru-progress-art-v210{
    width:calc(100% - 34px) !important;
    height:280px !important;
  }
}

/* =========================================================
   KAIH v1.3.08 - Guru Perkembangan Hero Artwork Final Fix
   Keep copy/score layout. Remove artwork band and show teacher cleanly.
   ========================================================= */
.guru-progress-art-v210{
  margin:0 !important;
  min-height:330px !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:#dcefff !important;
}
.guru-progress-art-v210:before{display:none !important;content:none !important}
.guru-progress-art-v210 img{
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 34% !important;
  border:0 !important;
  border-radius:0 !important;
  background:#dcefff !important;
  filter:none !important;
}
@media(min-width:701px) and (max-width:1180px){
  .guru-progress-art-v210{margin:0 !important;min-height:310px !important}
  .guru-progress-art-v210 img{object-position:center 32% !important}
}
@media(max-width:700px){
  .guru-progress-hero-v210{padding-bottom:0 !important}
  .guru-progress-art-v210{
    width:100% !important;
    height:300px !important;
    min-height:300px !important;
    margin:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }
  .guru-progress-art-v210:before{display:none !important;content:none !important}
  .guru-progress-art-v210 img{
    object-fit:cover !important;
    object-position:center 30% !important;
    border-radius:0 !important;
  }
}
@media(max-width:420px){
  .guru-progress-art-v210{width:100% !important;height:270px !important;min-height:270px !important}
  .guru-progress-art-v210 img{object-position:center 28% !important}
}

/* =========================================================
   KAIH v1.3.09 - Guru Perkembangan Hero Background Layout
   Teacher artwork is a CSS background, not a nested image.
   The visible KAIH logo always comes from the single master
   asset: assets/brand/kaih-logo.png
   ========================================================= */
.guru-progress-hero-v210{
  display:grid !important;
  grid-template-columns:minmax(0,44%) minmax(360px,32%) minmax(240px,24%) !important;
  grid-template-areas:"copy bg score" !important;
  min-height:350px !important;
  overflow:hidden !important;
  background:linear-gradient(90deg,#eef8ff 0%,#e7f5ff 48%,#d8efff 100%) !important;
}
.guru-progress-copy-v210{
  grid-area:copy !important;
  position:relative !important;
  z-index:4 !important;
  padding:54px 30px 46px 48px !important;
  align-self:center !important;
}
.guru-progress-bg-v1309{
  grid-area:bg !important;
  position:relative !important;
  z-index:1 !important;
  align-self:stretch !important;
  min-height:350px !important;
  overflow:hidden !important;
  background-image:
    linear-gradient(90deg,rgba(231,245,255,.98) 0%,rgba(231,245,255,.22) 15%,rgba(231,245,255,0) 34%),
    url('../images/heroes/guru-progress-hero-v1210.png') !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center 18% !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.guru-progress-bg-v1309::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,rgba(229,244,255,.34) 0%,rgba(229,244,255,0) 26%,rgba(229,244,255,0) 100%) !important;
}
.guru-progress-brand-v1309{
  position:absolute !important;
  z-index:3 !important;
  top:20px !important;
  left:20px !important;
  width:86px !important;
  height:86px !important;
  object-fit:contain !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.90) !important;
  padding:7px !important;
  box-shadow:0 10px 26px rgba(40,91,146,.12) !important;
}
.guru-progress-score-v210{
  grid-area:score !important;
  position:relative !important;
  z-index:5 !important;
  align-self:center !important;
  justify-self:stretch !important;
  margin:28px 28px 28px 18px !important;
}
/* Retire every old image-layout rule from previous hero revisions. */
.guru-progress-art-v210{display:none !important}

@media(min-width:701px) and (max-width:1180px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,40%) minmax(300px,35%) minmax(210px,25%) !important;
    min-height:320px !important;
  }
  .guru-progress-copy-v210{padding:38px 20px 34px 32px !important}
  .guru-progress-bg-v1309{
    min-height:320px !important;
    background-position:center 16% !important;
  }
  .guru-progress-brand-v1309{width:72px !important;height:72px !important;top:16px !important;left:16px !important}
  .guru-progress-score-v210{margin:22px 18px 22px 12px !important}
}

@media(max-width:700px){
  .guru-progress-hero-v210{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto 260px !important;
    grid-template-areas:"copy" "score" "bg" !important;
    min-height:0 !important;
    padding:0 !important;
    border-radius:22px !important;
    background:linear-gradient(180deg,#eef8ff 0%,#e6f5ff 55%,#d9efff 100%) !important;
  }
  .guru-progress-copy-v210{padding:24px 20px 15px !important}
  .guru-progress-score-v210{
    margin:0 20px 16px !important;
    width:auto !important;
  }
  .guru-progress-bg-v1309{
    min-height:260px !important;
    height:260px !important;
    width:100% !important;
    background-image:
      linear-gradient(180deg,rgba(228,244,255,.72) 0%,rgba(228,244,255,0) 24%),
      url('../images/heroes/guru-progress-hero-v1210.png') !important;
    background-size:cover !important;
    background-position:center 14% !important;
  }
  .guru-progress-bg-v1309::after{
    background:linear-gradient(180deg,rgba(228,244,255,.28) 0%,rgba(228,244,255,0) 28%) !important;
  }
  .guru-progress-brand-v1309{
    width:66px !important;
    height:66px !important;
    top:14px !important;
    left:16px !important;
    padding:6px !important;
    border-radius:15px !important;
  }
}

@media(max-width:420px){
  .guru-progress-hero-v210{grid-template-rows:auto auto 235px !important}
  .guru-progress-bg-v1309{height:235px !important;min-height:235px !important;background-position:center 12% !important}
  .guru-progress-brand-v1309{width:58px !important;height:58px !important;top:12px !important;left:14px !important}
}

/* =========================================================
   KAIH v1.3.10 - Guru Perkembangan Hero, Latest Artwork Background
   Use the latest teacher/classroom artwork as a true background.
   No nested illustration image and no overlapping logo card.
   ========================================================= */
.guru-progress-hero-v210{
  display:grid !important;
  grid-template-columns:minmax(0,44%) minmax(340px,32%) minmax(230px,24%) !important;
  grid-template-areas:"copy bg score" !important;
  min-height:360px !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:28px !important;
  background:linear-gradient(90deg,#eef8ff 0%,#e8f6ff 42%,#dbefff 100%) !important;
}
.guru-progress-copy-v210{
  grid-area:copy !important;
  align-self:center !important;
  position:relative !important;
  z-index:3 !important;
  padding:52px 34px 48px 50px !important;
}
.guru-progress-bg-v1310{
  grid-area:bg !important;
  position:relative !important;
  align-self:stretch !important;
  min-height:360px !important;
  overflow:hidden !important;
  background-image:
    linear-gradient(90deg,rgba(232,246,255,.96) 0%,rgba(232,246,255,.38) 11%,rgba(232,246,255,0) 28%),
    url('../images/heroes/guru-progress-bg-v1310.png') !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center 22% !important;
}
.guru-progress-bg-v1310::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,rgba(232,246,255,.22) 0%,rgba(232,246,255,0) 22%,rgba(232,246,255,0) 100%) !important;
}
.guru-progress-score-v210{
  grid-area:score !important;
  align-self:center !important;
  justify-self:stretch !important;
  position:relative !important;
  z-index:4 !important;
  margin:30px 30px 30px 20px !important;
}
.guru-progress-bg-v1309,
.guru-progress-brand-v1309,
.guru-progress-art-v210{display:none !important}

@media(min-width:701px) and (max-width:1180px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,40%) minmax(300px,35%) minmax(205px,25%) !important;
    min-height:330px !important;
  }
  .guru-progress-copy-v210{padding:40px 22px 36px 34px !important}
  .guru-progress-bg-v1310{
    min-height:330px !important;
    background-size:cover !important;
    background-position:center 20% !important;
  }
  .guru-progress-score-v210{margin:24px 18px 24px 12px !important}
}

@media(max-width:700px){
  .guru-progress-hero-v210{
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto 300px !important;
    grid-template-areas:"copy" "score" "bg" !important;
    min-height:0 !important;
    border-radius:22px !important;
    background:linear-gradient(180deg,#eef8ff 0%,#e9f6ff 56%,#dcefff 100%) !important;
  }
  .guru-progress-copy-v210{
    padding:24px 20px 16px !important;
  }
  .guru-progress-score-v210{
    width:auto !important;
    margin:0 20px 18px !important;
  }
  .guru-progress-bg-v1310{
    min-height:300px !important;
    height:300px !important;
    width:100% !important;
    background-image:
      linear-gradient(180deg,rgba(231,246,255,.64) 0%,rgba(231,246,255,0) 18%),
      url('../images/heroes/guru-progress-bg-v1310.png') !important;
    background-size:cover !important;
    background-position:center 18% !important;
  }
  .guru-progress-bg-v1310::after{
    background:linear-gradient(180deg,rgba(231,246,255,.18) 0%,rgba(231,246,255,0) 24%) !important;
  }
}
@media(max-width:420px){
  .guru-progress-hero-v210{grid-template-rows:auto auto 275px !important}
  .guru-progress-bg-v1310{
    min-height:275px !important;
    height:275px !important;
    background-position:center 16% !important;
  }
}


/* KAIH v1.3.11 - Hero Guru tanpa kartu capaian */
.guru-progress-hero-v210{
  grid-template-columns:minmax(0,46%) minmax(0,54%) !important;
  grid-template-areas:"copy bg" !important;
}
.guru-progress-score-v210{display:none !important;}
.guru-progress-bg-v1310{
  background-size:cover !important;
  background-position:center 24% !important;
}
@media(max-width:1100px) and (min-width:701px){
  .guru-progress-hero-v210{
    grid-template-columns:minmax(0,45%) minmax(0,55%) !important;
    grid-template-areas:"copy bg" !important;
  }
}
@media(max-width:700px){
  .guru-progress-hero-v210{
    grid-template-columns:1fr !important;
    grid-template-rows:auto 320px !important;
    grid-template-areas:"copy" "bg" !important;
  }
  .guru-progress-bg-v1310{
    min-height:320px !important;
    height:320px !important;
    background-size:cover !important;
    background-position:center 18% !important;
  }
}


/* =========================================================
   KAIH v1.3.12 - Guru Perkembangan Hero, premium final layout
   Inspired by approved mockup. Artwork is a true background;
   master KAIH logo remains an independent HTML asset.
   ========================================================= */
.role-guru .guru-progress-hero-v210{
  position:relative !important;
  display:grid !important;
  grid-template-columns:minmax(0,46%) minmax(0,54%) !important;
  grid-template-areas:"copy bg" !important;
  min-height:420px !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid #d7e9f8 !important;
  border-radius:30px !important;
  background:linear-gradient(110deg,#f2faff 0%,#e9f6ff 44%,#ddecfa 100%) !important;
  box-shadow:0 18px 46px rgba(35,83,130,.08) !important;
}
.role-guru .guru-progress-copy-v210{
  grid-area:copy !important;
  position:relative !important;
  z-index:3 !important;
  align-self:stretch !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  padding:38px 30px 34px 56px !important;
  background:linear-gradient(90deg,rgba(245,251,255,.98) 0%,rgba(242,250,255,.95) 78%,rgba(242,250,255,.16) 100%) !important;
}
.role-guru .guru-progress-logo-v1312{
  width:180px !important;
  max-width:48% !important;
  height:auto !important;
  object-fit:contain !important;
  display:block !important;
  margin:0 0 28px !important;
  filter:drop-shadow(0 8px 16px rgba(34,93,150,.10)) !important;
}
.role-guru .guru-progress-copy-v210 .eyebrow{
  color:#7f95ad !important;
  font-size:12px !important;
  letter-spacing:.12em !important;
  font-weight:900 !important;
}
.role-guru .guru-progress-copy-v210 h1{
  margin:10px 0 12px !important;
  font-size:clamp(38px,3vw,58px) !important;
  line-height:1.02 !important;
  letter-spacing:-.035em !important;
  color:#0a4c8f !important;
}
.role-guru .guru-progress-copy-v210 p{
  max-width:590px !important;
  margin:0 !important;
  color:#5277a0 !important;
  font-size:16px !important;
  line-height:1.65 !important;
}
.role-guru .guru-progress-hero-chips-v210{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  margin-top:24px !important;
}
.role-guru .guru-progress-hero-chips-v210 span{
  min-height:42px !important;
  display:inline-flex !important;
  align-items:center !important;
  padding:0 18px !important;
  border:1px solid rgba(255,255,255,.92) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.92) !important;
  color:#0757a6 !important;
  font-size:12px !important;
  font-weight:850 !important;
  box-shadow:0 8px 20px rgba(40,87,134,.06) !important;
}
.role-guru .guru-progress-tagline-v1312{
  margin-top:26px !important;
  color:#1267c7 !important;
  font-size:17px !important;
  line-height:1.25 !important;
  font-weight:750 !important;
  font-style:italic !important;
  transform:rotate(-3deg) !important;
  transform-origin:left center !important;
  width:max-content !important;
  max-width:80% !important;
}
.role-guru .guru-progress-tagline-v1312:after{
  content:"" !important;
  display:block !important;
  width:170px !important;
  height:3px !important;
  margin-top:7px !important;
  border-radius:999px !important;
  background:#1e73d6 !important;
  transform:skewX(-22deg) !important;
}
.role-guru .guru-progress-bg-v1310{
  grid-area:bg !important;
  display:block !important;
  position:relative !important;
  min-width:0 !important;
  min-height:420px !important;
  align-self:stretch !important;
  overflow:hidden !important;
  background-image:url('../images/heroes/guru-progress-bg-v1312.png') !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center 38% !important;
}
.role-guru .guru-progress-bg-v1310:before{
  content:"" !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:26% !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,rgba(236,248,255,.94),rgba(236,248,255,0)) !important;
}
.role-guru .guru-progress-bg-v1310:after{display:none !important}
.role-guru .guru-progress-score-v210,
.role-guru .guru-progress-brand-v1309,
.role-guru .guru-progress-bg-v1309,
.role-guru .guru-progress-art-v210{display:none !important}

@media(min-width:701px) and (max-width:1180px){
  .role-guru .guru-progress-hero-v210{grid-template-columns:minmax(0,44%) minmax(0,56%) !important;min-height:360px !important}
  .role-guru .guru-progress-copy-v210{padding:32px 22px 30px 34px !important}
  .role-guru .guru-progress-logo-v1312{width:145px !important;margin-bottom:20px !important}
  .role-guru .guru-progress-copy-v210 h1{font-size:38px !important}
  .role-guru .guru-progress-copy-v210 p{font-size:14px !important}
  .role-guru .guru-progress-tagline-v1312{font-size:15px !important;margin-top:20px !important}
  .role-guru .guru-progress-bg-v1310{min-height:360px !important;background-position:center 34% !important}
}

@media(max-width:700px){
  .role-guru .guru-progress-hero-v210{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 360px !important;
    grid-template-areas:"copy" "bg" !important;
    min-height:0 !important;
    border-radius:24px !important;
    background:linear-gradient(180deg,#f2faff 0%,#eaf6ff 55%,#dcedfb 100%) !important;
  }
  .role-guru .guru-progress-copy-v210{
    padding:24px 22px 22px !important;
    background:linear-gradient(180deg,rgba(246,251,255,.98),rgba(238,248,255,.94)) !important;
  }
  .role-guru .guru-progress-logo-v1312{
    width:132px !important;
    max-width:44% !important;
    margin:0 0 20px !important;
  }
  .role-guru .guru-progress-copy-v210 .eyebrow{font-size:11px !important}
  .role-guru .guru-progress-copy-v210 h1{font-size:34px !important;margin:8px 0 9px !important}
  .role-guru .guru-progress-copy-v210 p{font-size:13px !important;line-height:1.55 !important}
  .role-guru .guru-progress-hero-chips-v210{gap:10px !important;margin-top:18px !important}
  .role-guru .guru-progress-hero-chips-v210 span{min-height:38px !important;padding:0 14px !important;font-size:11px !important}
  .role-guru .guru-progress-tagline-v1312{display:none !important}
  .role-guru .guru-progress-bg-v1310{
    min-height:360px !important;
    height:360px !important;
    width:100% !important;
    background-size:cover !important;
    background-position:center 28% !important;
  }
  .role-guru .guru-progress-bg-v1310:before{
    inset:0 0 auto 0 !important;
    width:100% !important;
    height:20% !important;
    background:linear-gradient(180deg,rgba(234,247,255,.86),rgba(234,247,255,0)) !important;
  }
}
@media(max-width:430px){
  .role-guru .guru-progress-hero-v210{grid-template-rows:auto 330px !important}
  .role-guru .guru-progress-copy-v210{padding:22px 18px 20px !important}
  .role-guru .guru-progress-logo-v1312{width:118px !important;margin-bottom:17px !important}
  .role-guru .guru-progress-copy-v210 h1{font-size:31px !important}
  .role-guru .guru-progress-bg-v1310{min-height:330px !important;height:330px !important;background-position:53% 28% !important}
}

/* KAIH v1.3.20 — centralized 7 habit icons */
.habit-icon-v163 img{width:30px;height:30px;display:block;object-fit:contain;position:relative;z-index:1}
.habit-progress-icon-v164 img{width:27px;height:27px;display:block;object-fit:contain}
.education-icon-v168 img{width:29px;height:29px;display:block;object-fit:contain}
.guru-detail-habit-icon-v207 img{display:block;object-fit:contain;object-position:center}
@media(max-width:700px){.habit-icon-v163 img{width:27px;height:27px}.habit-progress-icon-v164 img{width:24px;height:24px}.education-icon-v168 img{width:27px;height:27px}}

/* v1.3.29 - avatar siswa mengikuti jenis kelamin */
.role-admin .admin-students-v171 .student-avatar-v171 img{display:block!important;width:40px!important;height:40px!important;max-width:40px!important;max-height:40px!important;object-fit:contain!important}
.role-admin .admin-students-hero-v178 .admin-table-v172 .student-avatar-v171 img{width:36px!important;height:36px!important;max-width:36px!important;max-height:36px!important;object-fit:contain!important}