*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --bg:#f0f2f8;
  --surface:#ffffff;
  --card:#ffffff;
  --card-hover:#f8f9ff;
  --border:#e2e8f0;
  --border-strong:#cbd5e1;
  --primary:#7c3aed;
  --primary-light:#a78bfa;
  --primary-bg:#f3efff;
  --accent:#06b6d4;
  --success:#10b981;
  --success-bg:#ecfdf5;
  --warning:#f59e0b;
  --warning-bg:#fffbeb;
  --danger:#ef4444;
  --danger-bg:#fef2f2;
  --text:#1e293b;
  --text-muted:#64748b;
  --grad:linear-gradient(135deg,#7c3aed,#06b6d4);
  --shadow:0 2px 12px rgba(0,0,0,0.07);
  --shadow-md:0 4px 24px rgba(0,0,0,0.1);
}
body{font-family:'Noto Sans KR',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;}
.page{display:none;min-height:100vh;}
.page.active{display:flex;}

/* LOGIN */
#loginPage{align-items:center;justify-content:center;padding:20px;
  background:linear-gradient(135deg,#f0f2ff 0%,#faf5ff 50%,#ecfeff 100%);}
.login-box{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:24px;
  padding:48px 40px;
  width:100%;max-width:420px;
  box-shadow:var(--shadow-md);
}
.login-logo{text-align:center;margin-bottom:32px;}
.login-logo .icon{font-size:48px;margin-bottom:12px;}
.login-logo h1{font-size:22px;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.login-logo p{color:var(--text-muted);font-size:13px;margin-top:6px;}
.form-group{margin-bottom:16px;}
.form-group label{display:block;font-size:13px;color:var(--text-muted);margin-bottom:8px;font-weight:500;}
.form-group input{
  width:100%;padding:12px 16px;
  background:#f8fafc;border:1px solid var(--border);
  border-radius:12px;color:var(--text);
  font-family:inherit;font-size:15px;
  transition:border-color .2s,box-shadow .2s;outline:none;
}
.form-group input:focus{border-color:var(--primary-light);box-shadow:0 0 0 3px rgba(124,58,237,0.12);background:#fff;}
.class-type-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:8px 0 4px;}
.class-type-card{position:relative;display:flex;align-items:center;gap:10px;padding:14px 15px;border:2px solid var(--border-strong);border-radius:12px;background:#f8fafc;cursor:pointer;transition:all .18s;box-shadow:0 1px 4px rgba(15,23,42,0.04);}
.class-type-card input{position:absolute;opacity:0;pointer-events:none;}
.class-type-card:hover{transform:translateY(-1px);border-color:var(--primary-light);box-shadow:0 6px 18px rgba(15,23,42,0.08);}
.class-type-card:has(input:checked){background:var(--primary-bg);border-color:var(--primary);box-shadow:0 0 0 3px rgba(124,58,237,0.12),0 8px 22px rgba(124,58,237,0.16);}
.class-type-card:has(input:checked)::after{content:'선택됨';position:absolute;right:10px;top:8px;padding:2px 7px;border-radius:999px;background:var(--primary);color:#fff;font-size:10px;font-weight:900;}
.class-type-card-regular:has(input:checked){background:#ecfdf5;border-color:var(--success);box-shadow:0 0 0 3px rgba(16,185,129,0.14),0 8px 22px rgba(16,185,129,0.16);}
.class-type-card-regular:has(input:checked)::after{background:var(--success);}
.class-type-card-single:has(input:checked){background:#f0f9ff;border-color:#0ea5e9;box-shadow:0 0 0 3px rgba(14,165,233,0.13),0 8px 22px rgba(14,165,233,0.14);}
.class-type-card-single:has(input:checked)::after{background:#0ea5e9;}
.class-type-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#fff;font-size:18px;box-shadow:inset 0 0 0 1px var(--border);}
.class-type-text{display:flex;flex-direction:column;gap:2px;min-width:0;}
.class-type-text strong{font-size:14px;font-weight:900;color:var(--text);}
.class-type-text small{font-size:11px;font-weight:700;color:var(--text-muted);}
.btn{width:100%;padding:14px;border:none;border-radius:12px;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;}
.btn-primary{background:var(--grad);color:#fff;}
.btn-primary:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 8px 25px rgba(124,58,237,0.3);}
.login-hint{margin-top:20px;padding:14px;background:var(--primary-bg);border-radius:10px;border:1px solid rgba(124,58,237,0.15);}
.login-hint p{font-size:12px;color:var(--text-muted);line-height:1.9;}
.login-hint strong{color:var(--primary);}
.error-msg{color:var(--danger);font-size:13px;margin-top:8px;display:none;}
.remember-row{display:flex;align-items:center;margin:4px 0 12px;}
.remember-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:var(--text-muted);user-select:none;}
.remember-label input[type=checkbox]{display:none;}
.remember-check{width:18px;height:18px;border:2px solid var(--border-strong);border-radius:5px;background:#f8fafc;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;}
.remember-label input[type=checkbox]:checked+.remember-check{background:var(--primary);border-color:var(--primary);}
.remember-label input[type=checkbox]:checked+.remember-check::after{content:'✓';color:#fff;font-size:11px;font-weight:700;}

/* SIDEBAR */
.app-layout{flex-direction:row;width:100%;}
.sidebar{
  width:240px;min-height:100vh;background:var(--surface);
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;
  position:fixed;left:0;top:0;bottom:0;z-index:10;
  box-shadow:2px 0 8px rgba(0,0,0,0.04);
}
.sidebar-header{padding:24px 20px;border-bottom:1px solid var(--border);}
.sidebar-header .app-name{font-size:15px;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.sidebar-header .user-name{font-size:13px;color:var(--text-muted);margin-top:4px;}
.role-badge{display:inline-block;margin-top:8px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;}
.role-admin{background:var(--primary-bg);color:var(--primary);}
.role-student{background:rgba(6,182,212,0.1);color:var(--accent);}
.sidebar-nav{flex:1;padding:16px 12px;}
.nav-item{
  display:flex;align-items:center;gap:10px;
  padding:11px 14px;border-radius:10px;
  font-size:14px;color:var(--text-muted);
  cursor:pointer;transition:all .2s;margin-bottom:4px;
}
.nav-item:hover{background:#f8f9ff;color:var(--text);}
.nav-item.active{background:var(--primary-bg);color:var(--primary);font-weight:600;}
.sidebar-footer{padding:16px;border-top:1px solid var(--border);}
.logout-btn{
  width:100%;padding:10px;border:1px solid var(--border);
  border-radius:10px;background:transparent;
  color:var(--text-muted);font-family:inherit;font-size:13px;cursor:pointer;transition:all .2s;
}
.logout-btn:hover{border-color:var(--danger);color:var(--danger);background:var(--danger-bg);}

.main-content{margin-left:240px;flex:1;padding:32px;min-height:100vh;}

/* PANELS */
.panel{display:none;}
.panel.active{display:block;}
#a-panel-instructors.panel.active{display:flex;flex-direction:column;}
.panel-title{font-size:22px;font-weight:700;color:var(--text);margin-bottom:6px;}
.panel-sub{color:var(--text-muted);font-size:14px;margin-bottom:28px;}

/* CARDS */
.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:var(--shadow);}
.card+.card{margin-top:16px;}

/* STATS */
.stats-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin-bottom:24px;}
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px;text-align:center;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s;}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.stat-label{font-size:12px;color:var(--text-muted);margin-bottom:10px;font-weight:500;}
.stat-pct{font-size:32px;font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.stat-detail{font-size:11px;color:var(--text-muted);margin-top:4px;}
.progress-bar-wrap{height:6px;background:#e2e8f0;border-radius:99px;margin-top:10px;overflow:hidden;}
.progress-bar{height:100%;border-radius:99px;background:var(--grad);transition:width .6s ease;}

/* HOMEWORK LIST */
.hw-list{display:flex;flex-direction:column;gap:10px;}
.hw-item{
  display:flex;align-items:center;gap:14px;
  background:var(--surface);border:1px solid var(--border);
  border-radius:12px;padding:16px 18px;box-shadow:var(--shadow);transition:all .2s;
}
.hw-item:hover{box-shadow:var(--shadow-md);border-color:var(--border-strong);}
.hw-item.done{opacity:.65;}
.hw-item.done .hw-title{color:var(--text-muted);}
.hw-checkbox{
  width:22px;height:22px;border-radius:6px;border:2px solid var(--border-strong);
  background:transparent;cursor:pointer;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;transition:all .2s;
}
.hw-checkbox.checked{background:var(--success);border-color:var(--success);}
.hw-checkbox.checked::after{content:'✓';color:#fff;font-size:13px;font-weight:700;}
.hw-info{flex:1;}
.hw-title{font-size:15px;font-weight:500;margin-bottom:4px;}
.hw-meta{font-size:12px;color:var(--text-muted);}
.hw-badge{padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;}
.badge-done{background:var(--success-bg);color:var(--success);}
.badge-pending{background:var(--warning-bg);color:var(--warning);}
.submit-row{margin-top:20px;display:flex;justify-content:flex-end;}
.btn-submit{
  padding:12px 28px;border:none;border-radius:12px;
  background:var(--grad);color:#fff;font-family:inherit;
  font-size:14px;font-weight:700;cursor:pointer;transition:all .2s;
}
.btn-submit:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 6px 20px rgba(124,58,237,0.3);}

/* ADMIN GRID */
.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
@media(max-width:900px){.admin-grid{grid-template-columns:1fr;}}
.cost-analysis-grid{align-items:stretch;}
.cost-analysis-grid>.card{height:100%;min-height:330px;}
.cost-analysis-grid>.card+.card{margin-top:0;}
.cost-chart-card{display:flex;flex-direction:column;}
.cost-chart-card .cost-chart-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.cost-breakdown-card{display:flex;flex-direction:column;}
.cost-breakdown-card [id$="breakdown-list"]{flex:1;}
.section-title{font-size:15px;font-weight:700;margin-bottom:16px;color:var(--primary);}
.form-row{margin-bottom:14px;}
.form-row label{display:block;font-size:12px;color:var(--text-muted);margin-bottom:6px;font-weight:500;}
.form-row input,.form-row select,.form-row textarea{
  width:100%;padding:10px 14px;background:#f8fafc;
  border:1px solid var(--border);border-radius:10px;
  color:var(--text);font-family:inherit;font-size:14px;outline:none;transition:border-color .2s;
}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--primary-light);background:#fff;}
.btn-add{
  width:100%;padding:11px;border:none;border-radius:10px;
  background:var(--grad);color:#fff;font-family:inherit;
  font-size:14px;font-weight:700;cursor:pointer;transition:all .2s;
}
.btn-add:hover{opacity:.9;}

/* STUDENT TABLE */
.student-stat-table{width:100%;border-collapse:collapse;}
.student-stat-table th{padding:10px 14px;text-align:left;border-bottom:2px solid var(--border);font-size:12px;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px;}
.student-stat-table td{padding:12px 14px;border-bottom:1px solid var(--border);font-size:14px;}
.student-stat-table tbody tr{transition:background .15s;cursor:pointer;}
.student-stat-table tbody tr:hover{background:#f8f9ff;}
.student-stat-table tbody tr:last-child td{border-bottom:none;}
.pct-cell{font-weight:700;color:var(--primary);}
.student-name-cell{font-weight:600;display:flex;align-items:center;gap:8px;}
.student-avatar{width:32px;height:32px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;}
.click-hint{font-size:11px;color:var(--text-muted);font-weight:400;}

/* ADMIN HW ITEMS */
.admin-hw-item{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 14px;border-radius:10px;
  background:#f8fafc;border:1px solid var(--border);margin-bottom:8px;
  cursor:pointer;transition:all .2s;
}
.admin-hw-item:hover{background:var(--primary-bg);border-color:var(--primary-light);box-shadow:0 2px 8px rgba(124,58,237,0.1);}
.admin-hw-info{flex:1;}
.admin-hw-title{font-size:14px;font-weight:500;}
.admin-hw-meta{font-size:11px;color:var(--text-muted);margin-top:2px;}
.btn-del{background:var(--danger-bg);border:none;color:var(--danger);border-radius:8px;padding:5px 10px;cursor:pointer;font-size:12px;transition:background .2s;}
.btn-del:hover{background:#fecaca;}
.btn-edit-green{background:var(--success-bg);border:none;color:var(--success);border-radius:8px;padding:5px 10px;cursor:pointer;font-size:12px;transition:background .2s;}
.btn-edit-green:hover{background:#d1fae5;}
/* GROUP STATS */
.gs-period-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:20px;box-shadow:var(--shadow);}
.gs-period-label{font-size:15px;font-weight:700;color:var(--text);margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--border);}
.gs-group-block{margin-bottom:18px;}
.gs-group-header{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;margin-bottom:8px;}
.gs-group-name{font-size:13px;font-weight:700;flex:1;}
.gs-bar-wrap{display:flex;align-items:center;gap:8px;}
.gs-bar-bg{height:10px;background:#e2e8f0;border-radius:99px;overflow:hidden;width:120px;}
.gs-bar-fill{height:100%;border-radius:99px;transition:width .5s ease;}
.gs-pct{font-size:12px;font-weight:700;min-width:36px;text-align:right;}
.gs-count{font-size:11px;color:var(--text-muted);min-width:50px;text-align:right;}
.gs-student-row{display:flex;align-items:center;gap:10px;padding:8px 14px 8px 28px;border-radius:8px;transition:background .15s;}
.gs-student-row:hover{background:#f8f9ff;}
.gs-student-name{font-size:13px;font-weight:500;flex:1;}
.gs-student-bar-bg{height:7px;background:#e2e8f0;border-radius:99px;overflow:hidden;width:90px;}
.gs-student-bar-fill{height:100%;border-radius:99px;transition:width .5s ease;}
/* HW STUDENT MODAL */
.hw-student-row{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:12px;border:1px solid var(--border);
  background:#fafafa;margin-bottom:8px;transition:border-color .2s;
}
.hw-student-row:hover{border-color:var(--border-strong);}
.hw-student-avatar{width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;}
.hw-student-name{flex:1;font-size:14px;font-weight:600;}
.hw-toggle{width:30px;height:30px;border-radius:9px;border:2px solid var(--border-strong);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:15px;flex-shrink:0;}
.hw-toggle.done{background:var(--success);border-color:var(--success);color:#fff;}
.hw-toggle.pending{background:var(--surface);color:var(--text-muted);}
.hw-toggle:hover{transform:scale(1.12);}
.hw-modal-prog{height:8px;background:#e2e8f0;border-radius:99px;overflow:hidden;margin-bottom:20px;}
.hw-modal-prog-bar{height:100%;border-radius:99px;background:var(--grad);transition:width .5s ease;}
/* CATEGORY */
.cat-group-header{
  display:flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:12px;
  background:var(--primary-bg);border-left:4px solid var(--primary);
  margin:16px 0 10px;font-size:14px;font-weight:700;color:var(--primary);
}
.cat-group-header .cat-count{font-size:11px;font-weight:400;color:var(--text-muted);margin-left:auto;}

.hw-group-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  margin-bottom: 20px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.hw-group-header {
  padding: 14px 18px;
  font-size: 14px;
  font-weight: 700;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  border-left: 4px solid transparent;
}
.hw-group-body {
  padding: 10px 18px 18px;
}
.cat-tag{display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600;
  background:var(--primary-bg);color:var(--primary);margin-right:6px;}
.cat-tag.math{background:#fee2e2;color:#ef4444;}
.cat-manage-item{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;border-radius:8px;background:#f8fafc;
  border:1px solid var(--border);margin-bottom:6px;font-size:13px;
}
.cat-add-row{display:flex;gap:8px;margin-top:10px;}
.cat-add-row input{flex:1;padding:8px 12px;border:1px solid var(--border);border-radius:8px;
  font-family:inherit;font-size:13px;outline:none;background:#f8fafc;color:var(--text);}
.cat-add-row input:focus{border-color:var(--primary-light);background:#fff;}
.btn-cat-add{padding:8px 16px;border:none;border-radius:8px;background:var(--grad);
  color:#fff;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;}
/* STUDENT GROUPS */
.grp-member-wrap{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.grp-member-chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:20px;font-size:12px;font-weight:500;
  background:var(--primary-bg);border:1px solid rgba(124,58,237,0.2);color:var(--primary);
}
.grp-member-chip .chip-del{cursor:pointer;color:var(--text-muted);font-size:11px;line-height:1;
  background:none;border:none;padding:0 0 0 2px;}
.grp-member-chip .chip-del:hover{color:var(--danger);}
.grp-card{background:#f8fafc;border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:12px;}
.grp-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.grp-card-name{font-size:14px;font-weight:700;color:var(--primary);}
.grp-badge{display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600;
  background:rgba(6,182,212,0.1);color:var(--accent);margin-left:6px;}
.student-status-new{display:inline-flex;align-items:center;padding:2px 7px;border-radius:999px;
  background:#eff6ff;color:#2563eb;border:1px solid #bfdbfe;font-size:11px;font-weight:800;
  line-height:1.2;white-space:nowrap;}
.student-filter-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px;}
.sftab{padding:5px 12px;border-radius:16px;border:1px solid var(--border);background:var(--surface);
  font-family:inherit;font-size:12px;color:var(--text-muted);cursor:pointer;transition:all .15s;}
.sftab:hover{border-color:var(--primary-light);color:var(--primary);}
.sftab.active{background:var(--primary-bg);border-color:var(--primary-light);color:var(--primary);font-weight:600;}
#prog-filter-tabs .sftab.active{border-width:3px !important;}
.prog-filter-row{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
#prog-status-tabs,#prog-subject-tabs,#prog-instructor-tabs,#prog-filter-tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
#prog-status-tabs,.prog-sub-filter-stack{padding-right:8px;margin-right:2px;border-right:1px solid var(--border);}
#prog-status-tabs{flex-direction:column;align-items:flex-start;gap:4px;min-width:max-content;}
.prog-sub-filter-stack{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:max-content;}
#prog-subject-tabs,#prog-instructor-tabs{padding:0;margin:0;border:0;}
#prog-filter-tabs{flex:1;min-width:220px;}
.prog-filter-empty{font-size:12px;color:var(--text-muted);padding:6px 2px;}


/* PERIOD TABS */
.period-tabs{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap;}
.tab-btn{
  padding:7px 18px;border-radius:20px;border:1px solid var(--border);
  background:var(--surface);color:var(--text-muted);font-family:inherit;
  font-size:13px;cursor:pointer;transition:all .2s;
}
.tab-btn:hover{border-color:var(--primary-light);color:var(--primary);}
.tab-btn.active{background:var(--primary-bg);border-color:var(--primary-light);color:var(--primary);font-weight:600;}
.student-select-row{display:flex;gap:12px;align-items:center;margin-bottom:20px;flex-wrap:wrap;}
.student-select-row select{padding:8px 14px;background:#f8fafc;border:1px solid var(--border);border-radius:10px;color:var(--text);font-family:inherit;font-size:14px;outline:none;}

/* MONTHLY GRID */
.monthly-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;}
.month-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;text-align:center;box-shadow:var(--shadow);}
.month-label{font-size:12px;color:var(--text-muted);margin-bottom:8px;font-weight:500;}
.month-pct{font-size:24px;font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.empty-state{text-align:center;padding:40px;color:var(--text-muted);}
.empty-state .ei{font-size:40px;margin-bottom:12px;}

/* MULTI CHECK */
.multi-check-wrap{max-height:560px;overflow-y:auto;background:#f8fafc;border:1px solid var(--border);border-radius:10px;padding:10px;}
.multi-check-item{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:13px;cursor:pointer;color:var(--text);}
.multi-check-item input[type=checkbox]{accent-color:var(--primary);width:14px;height:14px;}

/* ── MODAL ── */
.modal-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(15,23,42,0.4);backdrop-filter:blur(4px);
  z-index:100;align-items:center;justify-content:center;padding:20px;
}
.modal-overlay.open{display:flex;}
.modal{
  background:var(--surface);border-radius:20px;
  box-shadow:0 20px 60px rgba(0,0,0,0.15);
  width:100%;max-width:660px;max-height:85vh;
  display:flex;flex-direction:column;overflow:hidden;
}
.modal-header{
  padding:24px 28px 20px;border-bottom:1px solid var(--border);
  display:flex;align-items:flex-start;justify-content:space-between;flex-shrink:0;
}
.modal-title{font-size:18px;font-weight:700;}
.modal-sub{font-size:13px;color:var(--text-muted);margin-top:4px;}
.modal-close{
  background:none;border:none;font-size:20px;cursor:pointer;
  color:var(--text-muted);padding:4px;border-radius:8px;
  transition:background .2s;line-height:1;
}
.modal-close:hover{background:#f1f5f9;}
.modal-body{padding:24px 28px;overflow-y:auto;flex:1;}

/* STUDENT DETAIL HW */
.detail-hw-item{
  display:flex;align-items:center;gap:14px;
  padding:14px 16px;border-radius:12px;
  border:1px solid var(--border);background:#fafafa;margin-bottom:10px;
  transition:border-color .2s;
}
.detail-hw-item:hover{border-color:var(--border-strong);}
.detail-hw-info{flex:1;}
.detail-hw-title{font-size:14px;font-weight:600;margin-bottom:3px;}
.detail-hw-meta{font-size:12px;color:var(--text-muted);}
.detail-pct-wrap{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.detail-pct-label{font-size:12px;color:var(--text-muted);}
.pct-toggle{
  width:28px;height:28px;border-radius:8px;border:2px solid var(--border-strong);
  background:transparent;cursor:pointer;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:14px;
}
.pct-toggle.done{background:var(--success);border-color:var(--success);color:#fff;}
.pct-toggle.pending{background:var(--surface);color:var(--text-muted);}
.pct-toggle:hover{transform:scale(1.1);}
.detail-status{
  display:inline-block;padding:4px 10px;border-radius:20px;
  font-size:11px;font-weight:700;white-space:nowrap;
}

/* OVERALL SUMMARY IN MODAL */
.modal-summary{
  display:flex;gap:12px;margin-bottom:20px;flex-wrap:wrap;
}
.msummary-card{
  flex:1;min-width:100px;background:var(--bg);
  border-radius:12px;padding:14px;text-align:center;
}
.msummary-label{font-size:11px;color:var(--text-muted);margin-bottom:6px;}
.msummary-val{font-size:22px;font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}

/* TOAST */
.toast{
  position:fixed;bottom:30px;right:30px;
  background:var(--success);color:#fff;
  padding:12px 20px;border-radius:10px;font-size:14px;font-weight:500;
  transform:translateY(80px);opacity:0;transition:all .3s;z-index:999;
  box-shadow:0 8px 24px rgba(16,185,129,0.35);
}
.toast.show{transform:translateY(0);opacity:1;}
.toast.warn{background:var(--warning);box-shadow:0 8px 24px rgba(245,158,11,0.35);}

/* CALENDAR & CLASS */
.calendar-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  background: #f8fafc;
  border-bottom: 1px solid var(--border);
}
.cal-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--text);
}
.cal-nav {
  display: flex;
  gap: 8px;
}
.cal-btn {
  width: 36px;
  height: 36px;
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition: all 0.2s;
}
.cal-btn:hover {
  background: var(--primary-bg);
  color: var(--primary);
  border-color: var(--primary-light);
}
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: var(--border);
  gap: 1px;
}
.cal-day-label {
  background: #f1f5f9;
  padding: 10px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
}
.cal-cell {
  background: #fff;
  min-height: 120px;
  padding: 8px;
  cursor: pointer;
  transition: background 0.15s;
}
.cal-cell:hover {
  background: #f8fafc;
}
.cal-cell.today {
  background: #fefce8;
}
.cal-cell.other-month {
  background: #f8fafc;
  color: #cbd5e1;
  pointer-events: none;
}
.cal-date {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 6px;
}
.cal-cell.sun .cal-date { color: var(--danger); }
.cal-cell.sat .cal-date { color: var(--accent); }

.class-mini {
  font-size: 11px;
  padding: 3px 6px;
  border-radius: 6px;
  background: var(--primary-bg);
  color: var(--primary);
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 1px solid rgba(124,58,237,0.15);
  font-weight: 500;
}
.schedule-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--border);
  margin-bottom: 10px;
}
.schedule-time {
  font-size: 13px;
  font-weight: 700;
  color: var(--primary);
  min-width: 90px;
}
.schedule-info { flex: 1; }
.schedule-title { font-size: 15px; font-weight: 600; }
.schedule-meta { font-size: 12px; color: var(--text-muted); margin-top: 2px; }

/* WEEKLY GRID */
.weekly-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.week-day-block {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow);
}
.week-day-header {
  padding: 12px 20px;
  background: #f8fafc;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 10px;
}
.week-day-name { font-size: 14px; font-weight: 700; color: var(--text); }
.week-day-date { font-size: 12px; color: var(--text-muted); }
.week-day-content { padding: 12px 20px; }
.week-empty { font-size: 12px; color: var(--text-muted); padding: 4px 0; }
.week-class-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px dashed var(--border);
}
.week-class-item:last-child { border-bottom: none; }
.week-class-time { font-size: 12px; font-weight: 700; color: var(--primary); min-width: 80px; }
.week-class-title { font-size: 13px; font-weight: 600; }
.week-class-meta { font-size: 11px; color: var(--text-muted); margin-left: auto; }

  /* Subject Chips */
  .subject-chip-group { display: flex; gap: 8px; flex-wrap: wrap; padding: 5px 0; }
  .subject-chip { 
    padding: 8px 16px; border-radius: 20px; border: 1px solid var(--border); 
    background: #fff; cursor: pointer; font-size: 13px; font-weight: 500;
    transition: all 0.2s; user-select: none; display: flex; align-items: center; gap: 6px;
  }
  .subject-chip input { display: none; }
  .subject-chip:hover { border-color: var(--primary-light); background: #fdfaff; }
  .subject-chip.active { background: var(--primary); color: #fff; border-color: var(--primary); box-shadow: 0 4px 10px rgba(124,58,237,0.2); }
  .subject-chip.math.active { background: #fee2e2; color: #ef4444; border-color: #fecaca; box-shadow: 0 4px 10px rgba(239,68,68,0.1); }

  /* Payment Toggle Row */
  .payment-toggle-row {
    background: #f8fafc; border: 1px solid var(--border); border-radius: 12px;
    padding: 12px 16px; display: flex; align-items: center; justify-content: space-between;
    margin: 10px 0; cursor: pointer; transition: all 0.2s;
  }
  .payment-toggle-row:hover { border-color: var(--primary-light); background: #fdfaff; }
  .payment-toggle-row.active { border-color: var(--primary); background: #f5f3ff; }
  .payment-toggle-label { display: flex; align-items: center; gap: 10px; font-weight: 700; color: var(--text); font-size: 14px; }
  .payment-toggle-row input { width: 20px; height: 20px; cursor: pointer; accent-color: var(--primary); }

  /* Payment Summary Cards */
  .payment-sum-card {
    background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 20px;
    display: flex; flex-direction: column; gap: 15px; grid-column: span 1;
  }
  .payment-sum-header { font-size: 14px; font-weight: 700; color: var(--primary); border-bottom: 2px solid var(--primary-bg); padding-bottom: 10px; margin-bottom: 5px; }
  .payment-sum-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .pay-stat-item { padding: 12px; border-radius: 12px; background: #f8fafc; text-align: center; }
  .pay-stat-val { font-size: 20px; font-weight: 800; margin-bottom: 4px; }
  .pay-stat-label { font-size: 11px; color: var(--text-muted); font-weight: 500; }
  .pay-stat-pct { margin-top: 10px; padding: 15px; border-radius: 12px; background: var(--grad); color: #fff; text-align: center; }
  .pay-stat-pct-val { font-size: 28px; font-weight: 900; line-height: 1; }
  .pay-stat-pct-label { font-size: 12px; opacity: 0.9; margin-top: 5px; }

  /* Financial Breakdown Styles */
  .pay-detail-container { margin-top: 5px; display: flex; flex-direction: column; gap: 12px; }
  .pay-detail-section { border-top: 1px solid var(--border); padding-top: 15px; }
  .pay-detail-section-title { font-size: 13px; font-weight: 800; color: var(--text); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
  .pay-detail-section-title-with-toggle { justify-content: space-between; gap: 10px; }
  .pay-detail-toggle-btn {
    flex: 0 0 auto; padding: 4px 10px; border: 1px solid var(--border); border-radius: 999px;
    background: #fff; color: var(--text-muted); font-size: 11px; font-weight: 800;
    cursor: pointer; transition: all 0.2s;
  }
  .pay-detail-toggle-btn:hover { border-color: var(--primary-light); color: var(--primary); background: var(--primary-bg); }
  .pay-detail-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 13px; }
  .pay-detail-label { color: var(--text-muted); display: flex; align-items: center; gap: 5px; }
  .pay-detail-val { font-weight: 700; color: var(--text); }
  .pay-detail-total-box { background: var(--primary-bg); padding: 12px; border-radius: 10px; border: 1px solid rgba(124,58,237,0.1); margin-top: 5px; }
  .pay-subject-item { display: grid; grid-template-columns: 60px 1fr; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px dashed var(--border); }
  .pay-subject-item:last-child { border-bottom: none; }
  .pay-subject-money { display: flex; justify-content: space-between; font-size: 12px; }

  /* Pending Payment List Styles */
  .pay-pending-list { display: flex; flex-direction: column; gap: 8px; margin-top: 5px; }
  .pay-pending-list.is-collapsed { display: none; }
  .instructor-pending-group { display: flex; flex-direction: column; gap: 8px; }
  .instructor-pending-group-title {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 6px 0 4px; border-bottom: 1px solid var(--border); margin-top: 8px;
    font-size: 11px; font-weight: 700;
  }
  .pay-pending-item {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 10px 12px; background: #fff; border: 1px solid var(--border);
    border-radius: 10px; transition: all 0.2s;
  }
  .pay-pending-item:hover { border-color: var(--danger-light); background: #fff5f5; }
  .pay-pending-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
  .pay-pending-name { font-size: 13px; font-weight: 700; color: var(--text); }
  .pay-pending-fee { font-size: 11px; color: var(--danger); font-weight: 600; }
  .pay-pending-subjects { display: flex; flex-direction: column; gap: 3px; margin-top: 2px; }
  .pay-pending-subject-row { display: flex; align-items: center; gap: 6px; min-height: 20px; flex-wrap: wrap; }
  .pay-pending-subject-row .cat-tag { padding: 1px 6px; font-size: 9px; margin: 0; flex: 0 0 auto; }
  .pay-pending-subject-badges { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; min-width: 0; }
  .pay-pending-subject-badges .grp-badge { padding: 1px 6px; font-size: 9px; line-height: 1.4; }
  .btn-check-pay {
    padding: 6px 12px; border: 1px solid var(--border); border-radius: 8px;
    background: #fff; color: var(--text-muted); font-size: 11px; font-weight: 700;
    cursor: pointer; transition: all 0.2s;
  }
  .btn-check-pay:hover { background: var(--success); color: #fff; border-color: var(--success); }

  /* CLASS PROGRESS MANAGEMENT */
  .progress-mgmt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  @media(max-width:900px) { .progress-mgmt-grid { grid-template-columns: 1fr; } }
  .prog-group-card {
    background: var(--surface); border: 1px solid var(--border); border-radius: 16px;
    padding: 0; overflow: hidden; box-shadow: var(--shadow); transition: transform .2s, box-shadow .2s;
  }
  .prog-group-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
  .prog-group-header {
    padding: 18px 20px; display: flex; align-items: center; justify-content: space-between;
    border-bottom: 1px solid var(--border);
  }
  .prog-group-title { font-size: 15px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
  .prog-group-badge { padding: 3px 10px; border-radius: 20px; font-size: 11px; font-weight: 700; }
  .prog-group-summary {
    padding: 14px 20px; display: flex; gap: 12px; align-items: center;
    background: #f8fafc; border-bottom: 1px solid var(--border);
  }
  .prog-summary-stat { text-align: center; flex: 1; }
  .prog-summary-val { font-size: 20px; font-weight: 900; }
  .prog-summary-label { font-size: 10px; color: var(--text-muted); margin-top: 2px; }
  .prog-topic-list { padding: 12px 20px; display: flex; flex-direction: column; gap: 8px; }
  .prog-topic-item {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 14px; border-radius: 10px; background: #f8fafc;
    border: 1px solid var(--border); transition: all .2s;
  }
  .prog-topic-item:hover { border-color: var(--primary-light); background: #fdfaff; }
  .prog-topic-info { flex: 1; }
  .prog-topic-title { font-size: 14px; font-weight: 500; }
  .prog-topic-meta { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
  .prog-topic-bar { width: 80px; height: 6px; background: #e2e8f0; border-radius: 99px; overflow: hidden; }
  .prog-topic-bar-fill { height: 100%; border-radius: 99px; transition: width .5s ease; }
  .prog-topic-pct { font-size: 12px; font-weight: 700; min-width: 36px; text-align: right; }
  .student-class-topic-badges { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
  .student-class-topic-badge { display:inline-flex; align-items:center; max-width:100%; padding:3px 8px; border-radius:999px; background:#f3f4f6; color:#000; border:1px solid #d1d5db; font-size:11px; font-weight:700; line-height:1.35; white-space:normal; box-shadow:0 1px 2px rgba(15,23,42,.08); }
  .student-class-topic-more { background:#f8fafc; color:#000; border-color:#d1d5db; }
  .prog-no-data {
    text-align: center; padding: 40px; color: var(--text-muted);
    font-size: 14px; background: #f8fafc; border-radius: 16px; border: 1px solid var(--border);
  }
  .prog-no-data .prog-icon { font-size: 40px; margin-bottom: 12px; }
  .student-progress-grid {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px; padding: 12px 14px; background: #fff;
  }
  .student-progress-pair-list {
    grid-column: 1 / -1; display: flex; flex-direction: column; gap: 8px;
  }
  .student-progress-pair-row {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px; align-items: stretch;
  }
  .student-progress-pair-row .admin-hw-item {
    height: 100%; margin-bottom: 0;
  }
  .student-progress-empty-cell {
    min-height: 100%; padding: 10px 14px; border-radius: 10px;
    border: 1px dashed var(--border); background: #f8fafc;
    color: var(--text-muted); font-size: 12px; display: flex; align-items: center; justify-content: center;
  }
  @media(max-width:760px) {
    .student-progress-grid,
    .student-progress-pair-row { grid-template-columns: 1fr; }
    .student-progress-pair-row { gap: 8px; }
  }
  /* Class Edit Modal */
  #classEditModal .modal { max-width: 500px; }
  .modal-form-row { margin-bottom: 16px; }
  .modal-form-row label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; color: var(--text); }
  .modal-form-row input[type="text"], .modal-form-row select, .modal-form-row textarea {
    width: 100%; padding: 10px; border-radius: 10px; border: 1px solid var(--border); background: #f8fafc; font-family: inherit; font-size: 14px; outline: none;
  }
  .salary-adjustment-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
  .salary-adjustment-row{display:grid;grid-template-columns:96px minmax(0,1fr) 34px;gap:6px;align-items:center}
  .salary-adjustment-row select,.salary-adjustment-row input{padding:8px 10px;border:1px solid var(--border);border-radius:8px;font-family:inherit;font-size:13px;outline:none;background:#f8fafc}
  .salary-adjustment-row button{height:34px;border:none;border-radius:8px;background:#fee2e2;color:#dc2626;font-weight:800;cursor:pointer}
  .salary-adjustment-add{margin-top:8px;padding:7px 10px;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--primary);font-family:inherit;font-size:12px;font-weight:800;cursor:pointer}
  .instructor-paid-auto{appearance:none;-webkit-appearance:none;width:18px;height:18px;border:1px solid #cbd5e1;border-radius:4px;background:#fff;cursor:default;position:relative;vertical-align:middle}
  .instructor-paid-auto:disabled{opacity:1}
  .instructor-paid-auto:checked{background:#16a34a;border-color:#16a34a}
  .instructor-paid-auto:checked::after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
  .instructor-salary-align-row{display:grid;grid-template-columns:120px 100px 100px 130px 130px 80px 160px 120px 100px 60px 130px 90px minmax(120px,1fr);min-width:1000px}
  .instructor-monthly-salary-pill{display:none;grid-column:8;align-items:center;justify-content:center;width:max-content;margin:0 14px;padding:4px 10px;border-radius:999px;background:#dcfce7;color:#166534;border:1px solid #86efac;font-size:12px;font-weight:700;line-height:1.2;white-space:nowrap}
  .exam-unit-list { display:flex; flex-direction:column; gap:8px; }
  .exam-unit-card { display:flex; align-items:center; gap:8px; padding:10px; border:1px solid var(--border); border-radius:8px; background:#f8fafc; }
  .exam-unit-card input { flex:1; min-width:0; padding:9px 10px; border:1px solid var(--border); border-radius:8px; background:#fff; font-family:inherit; font-size:13px; outline:none; }
  .exam-unit-card .unit-index { width:28px; height:28px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:var(--primary-bg); color:var(--primary); font-size:12px; font-weight:800; flex-shrink:0; }
  .exam-unit-add { width:100%; margin-top:8px; padding:8px 10px; border:1px dashed var(--primary); border-radius:8px; background:#fff; color:var(--primary); font-size:12px; font-weight:800; cursor:pointer; }
  .exam-scope-term-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 16px; }
  .exam-scope-term-btn {
    padding:8px 14px; border-radius:999px; border:1px solid var(--border);
    background:#fff; color:var(--text-muted); font-family:inherit; font-size:13px; font-weight:800;
    cursor:pointer; transition:all .18s;
  }
  .exam-scope-term-btn:hover { border-color:var(--primary-light); color:var(--primary); background:var(--primary-bg); }
  .exam-scope-term-btn.active { background:var(--primary); border-color:var(--primary); color:#fff; }
  .exam-sel-group { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
  .exam-sel-btn { padding:7px 16px; border-radius:20px; border:2px solid var(--border-strong); background:#fff; font-family:inherit; font-size:13px; font-weight:600; color:var(--text-muted); cursor:pointer; transition:all .18s; }
  .exam-sel-btn:hover { border-color:var(--primary-light); color:var(--primary); }
  .exam-sel-btn.selected { background:var(--primary); border-color:var(--primary); color:#fff; }
  .exam-unit-summary { margin-top:6px; display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
  .exam-unit-summary-title { font-size:12px; font-weight:800; color:var(--text-muted); }
  .exam-unit-summary-list { display:flex; flex-direction:column; gap:5px; width:100%; }
  .exam-unit-summary-item { display:block; width:fit-content; max-width:100%; white-space:normal; line-height:1.45; }
  /* COLOR PICKER */
  .color-picker { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; align-items: center; }
  .color-chip { 
    width: 26px; height: 26px; border-radius: 50%; cursor: pointer; 
    border: 2px solid #fff; transition: all 0.2s; box-shadow: 0 0 0 1px var(--border);
  }
  .color-chip:hover { transform: scale(1.2); }
  .color-chip.active { border-color: var(--text); transform: scale(1.1); box-shadow: 0 0 8px rgba(0,0,0,0.2); }
  
  /* MOCK EXAM MODAL STYLES */
  .mock-form-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 12px; }
  .mock-score-grid { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: flex-end; margin-bottom: 20px; }
  .mock-table { width: 100%; border-collapse: collapse; margin-top: 10px; }
  .mock-table th { padding: 8px; font-size: 11px; color: var(--text-muted); border-bottom: 2px solid var(--border); text-align: center; }
  .mock-table td { padding: 10px 8px; font-size: 13px; border-bottom: 1px solid var(--border); text-align: center; }
  .mock-table tr:hover { background: var(--card-hover); }

  /* MOCK EXAM REPORT */
  .mock-report-page-header { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:20px; }
  .mock-report-page-header .panel-sub { margin-bottom:0; }
  .mock-report-header-actions { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
  .mock-report-header-actions .btn-add { width:auto; padding:9px 16px; }
  .mock-report-print-btn,
  .mock-report-preview-btn,
  .mock-report-text-btn {
    border:1px solid var(--border); border-radius:8px; background:#fff; color:var(--text);
    padding:9px 14px; font-family:inherit; font-size:13px; font-weight:800; cursor:pointer;
  }
  .mock-report-print-btn:hover,
  .mock-report-preview-btn:hover,
  .mock-report-text-btn:hover { border-color:#0f766e; color:#0f766e; background:#f0fdfa; }
  .mock-report-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:-4px 0 18px; padding:4px; border:1px solid #d9e5e6; border-radius:12px; background:#f8fafc; }
  .mock-report-tabs button { position:relative; display:flex; align-items:center; gap:12px; min-height:72px; padding:14px 16px; border:1px solid #d7e1e4; border-radius:10px; background:#fff; color:#475569; font-family:inherit; text-align:left; cursor:pointer; box-shadow:0 1px 2px rgba(15,23,42,.04); transition:transform .16s, border-color .16s, background .16s, box-shadow .16s, color .16s; }
  .mock-report-tabs button:hover { transform:translateY(-1px); border-color:#99d5cf; background:#f0fdfa; color:#0f766e; box-shadow:0 8px 18px rgba(15,118,110,.1); }
  .mock-report-tabs button.active { border-color:#0f766e; background:linear-gradient(135deg,#0f766e,#14b8a6); color:#fff; box-shadow:0 10px 24px rgba(15,118,110,.22); }
  .mock-report-tabs button.active::after { content:"선택됨"; position:absolute; right:12px; top:10px; padding:2px 7px; border-radius:999px; background:rgba(255,255,255,.18); color:#fff; font-size:9px; font-weight:900; }
  .mock-report-tab-icon { display:inline-flex; align-items:center; justify-content:center; flex:0 0 38px; width:38px; height:38px; border-radius:10px; background:#ecfdf5; font-size:19px; }
  .mock-report-tabs button.active .mock-report-tab-icon { background:rgba(255,255,255,.18); }
  .mock-report-tab-copy { display:flex; flex-direction:column; gap:4px; min-width:0; }
  .mock-report-tab-copy strong { font-size:14px; font-weight:900; line-height:1.2; }
  .mock-report-tab-copy small { color:#64748b; font-size:11px; font-weight:700; line-height:1.35; }
  .mock-report-tabs button.active .mock-report-tab-copy small { color:#ccfbf1; }
  .mock-report-tab-panel { display:none; }
  .mock-report-tab-panel.active { display:block; }
  .mock-report-layout { display:grid; grid-template-columns:minmax(250px,300px) minmax(0,1fr); gap:18px; align-items:start; }
  .mock-report-sidebar { padding:18px; position:sticky; top:20px; box-shadow:none; border-radius:8px; }
  .mock-report-sidebar .section-title { color:var(--text); margin-bottom:12px; }
  .mock-report-filter-grid { display:grid; grid-template-columns:1fr; gap:0; }
  .mock-report-sidebar .form-row { margin-bottom:10px; }
  .mock-report-sidebar .form-row select { padding:9px 10px; font-size:13px; border-radius:8px; }
  .mock-report-record-list { display:flex; flex-direction:column; gap:7px; max-height:calc(100vh - 330px); min-height:150px; overflow-y:auto; padding-right:2px; }
  .mock-report-list-empty { border:1px dashed var(--border); border-radius:8px; color:var(--text-muted); font-size:12px; line-height:1.6; padding:22px 14px; text-align:center; }
  .mock-report-record { width:100%; display:flex; flex-direction:column; gap:7px; padding:11px 12px; border:1px solid var(--border); border-radius:8px; background:#fff; color:var(--text); font-family:inherit; text-align:left; cursor:pointer; transition:all .18s; }
  .mock-report-record:hover { border-color:#99d5cf; background:#f7fffe; }
  .mock-report-record.active { border-color:#0f766e; background:#f0fdfa; box-shadow:inset 3px 0 0 #0f766e; }
  .mock-report-cumulative-record { border-color:#93c5fd; background:#eff6ff; color:#334155; box-shadow:inset 3px 0 0 #2563eb; }
  .mock-report-cumulative-record:hover,
  .mock-report-cumulative-record.active { border-color:#2563eb; background:#dbeafe; }
  .mock-report-cumulative-record .mock-report-record-label { color:#1d4ed8; }
  .mock-report-cumulative-record .mock-report-record-score { color:#be123c; }
  .mock-report-cumulative-record .mock-report-record-meta { color:#64748b; }
  .mock-report-cumulative-record .mock-report-record-kind { background:#dbeafe; color:#1d4ed8; }
  .mock-report-cumulative-detail { display:block; color:#64748b; font-size:10px; font-weight:800; }
  .mock-report-record-top,
  .mock-report-record-meta { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
  .mock-report-record-label { min-width:0; font-size:13px; font-weight:800; line-height:1.4; }
  .mock-report-record-actions { flex:0 0 auto; display:flex; align-items:center; gap:6px; }
  .mock-report-record-score { flex:0 0 auto; color:#be123c; font-size:13px; font-weight:900; }
  .mock-report-record-delete { flex:0 0 auto; padding:3px 7px; border:1px solid #fecdd3; border-radius:6px; background:#fff7f8; color:#be123c; font-size:10px; font-weight:900; cursor:pointer; line-height:1.2; }
  .mock-report-record-delete:hover { background:#ffe4e6; border-color:#fda4af; }
  .mock-report-record-meta { color:var(--text-muted); font-size:10px; }
  .mock-report-record-kind { flex:0 0 auto; padding:2px 5px; border-radius:4px; background:#e2e8f0; color:#475569; font-weight:800; }
  .mock-report-record.active .mock-report-record-kind { background:#ccfbf1; color:#0f766e; }
  .mock-report-cumulative-record.active .mock-report-record-kind { background:#bfdbfe; color:#1d4ed8; }
  .mock-report-main { min-width:0; display:flex; flex-direction:column; gap:18px; }
  .mock-report-editor { margin:0; padding:22px; box-shadow:none; border-radius:8px; }
  .mock-report-editor.is-collapsed { padding:16px 18px; }
  .mock-report-editor.is-collapsed .mock-report-section-head { margin-bottom:12px; }
  .mock-report-editor.is-collapsed .mock-report-editor-body { display:none; }
  .mock-report-section-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:18px; }
  .mock-report-editor-head-actions { display:flex; align-items:center; justify-content:flex-end; gap:7px; flex:0 0 auto; }
  .mock-report-editor-head-actions .btn-add { width:auto; padding:9px 14px; }
  .mock-report-persistent-filter { margin-bottom:14px; }
  .mock-report-persistent-filter .form-row { max-width:360px; margin-bottom:0; }
  .mock-report-editor-toggle,
  #mock-report-editor-toggle { border-color:#84cc16; background:#a3e635; color:#365314; box-shadow:0 8px 18px rgba(132,204,22,.22); }
  .mock-report-editor-toggle:hover,
  #mock-report-editor-toggle:hover { background:#84cc16; border-color:#65a30d; color:#fff; }
  .mock-report-editor:not(.is-collapsed) .mock-report-editor-toggle,
  .mock-report-editor:not(.is-collapsed) #mock-report-editor-toggle { border-color:#cbd5e1; background:#fff; color:#475569; box-shadow:none; }
  .mock-report-editor:not(.is-collapsed) .mock-report-editor-toggle:hover,
  .mock-report-editor:not(.is-collapsed) #mock-report-editor-toggle:hover { border-color:#0f766e; background:#f0fdfa; color:#0f766e; }
  .mock-report-section-head .section-title { color:var(--text); margin-bottom:4px; }
  .mock-report-section-sub { color:var(--text-muted); font-size:12px; }
  .mock-report-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; }
  .mock-report-span-2 { grid-column:1 / -1; }
  .mock-report-paper-apply { display:grid; grid-template-columns:minmax(180px,1fr) minmax(150px,.7fr) auto; gap:8px; align-items:center; }
  .mock-report-paper-apply select,
  .mock-report-paper-apply input { width:100%; }
  .mock-report-paper-apply button { white-space:nowrap; }
  .mock-report-paper-select-summary { margin-top:6px; padding:8px 10px; border-radius:7px; background:#f8fafc; color:#64748b; font-size:11px; font-weight:700; }
  .mock-report-paper-select-summary.has-data { background:#ecfdf5; color:#047857; }
  .mock-report-paper-apply input[readonly] { cursor:pointer; background:#fff; }
  .mock-report-paper-apply .mock-report-lime-input {
    border-color:#bef264; background:#f7fee7; color:#365314; font-weight:800;
  }
  .mock-report-paper-apply .mock-report-lime-input:hover,
  .mock-report-paper-apply .mock-report-lime-input:focus {
    border-color:#84cc16; background:#ecfccb; box-shadow:0 0 0 3px rgba(132,204,22,.14);
  }
  .mock-report-lime-btn {
    height:41px; padding:0 16px; border:1px solid #84cc16; border-radius:8px;
    background:#a3e635; color:#365314; font-family:inherit; font-size:13px; font-weight:900;
    cursor:pointer; transition:all .18s;
  }
  .mock-report-lime-btn:hover { background:#84cc16; border-color:#65a30d; color:#fff; }
  .mock-wrong-picker-modal { max-width:720px; }
  .mock-wrong-picker-section { margin-bottom:18px; }
  .mock-wrong-picker-title { margin-bottom:9px; color:var(--text); font-size:13px; font-weight:900; }
  .mock-number-grid { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:6px; }
  .mock-number-btn { height:34px; border:1px solid var(--border); border-radius:8px; background:#fff; color:var(--text); font-family:inherit; font-size:12px; font-weight:900; cursor:pointer; }
  .mock-number-btn:hover { border-color:#99d5cf; background:#f0fdfa; color:#0f766e; }
  .mock-number-btn.active { border-color:#e11d48; background:#fff1f2; color:#be123c; box-shadow:inset 0 0 0 2px rgba(225,29,72,.08); }
  .mock-subjective-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .mock-subjective-item { display:grid; grid-template-columns:52px minmax(0,1fr); align-items:center; gap:8px; padding:8px; border:1px solid var(--border); border-radius:8px; background:#fff; }
  .mock-subjective-item.active { border-color:#e11d48; background:#fff7f8; }
  .mock-subjective-item button { height:32px; border:1px solid var(--border); border-radius:7px; background:#f8fafc; color:var(--text); font-family:inherit; font-size:12px; font-weight:900; cursor:pointer; }
  .mock-subjective-item.active button { border-color:#e11d48; background:#fff1f2; color:#be123c; }
  .mock-subjective-item input { width:100%; padding:8px 9px; border:1px solid var(--border); border-radius:7px; font-size:12px; }
  .mock-wrong-reason-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .mock-wrong-reason-item { display:grid; grid-template-columns:54px minmax(0,1fr); align-items:center; gap:8px; padding:8px; border:1px solid #dbeafe; border-radius:8px; background:#eff6ff; }
  .mock-wrong-reason-item span { color:#1e3a8a; font-size:11px; font-weight:900; }
  .mock-wrong-reason-item select { width:100%; padding:8px 9px; border:1px solid #bfdbfe; border-radius:7px; background:#fff; color:#334155; font-family:inherit; font-size:11px; font-weight:800; outline:none; }
  .mock-wrong-reason-item select:focus { border-color:#2563eb; box-shadow:0 0 0 2px rgba(37,99,235,.12); }
  .mock-wrong-reason-empty { padding:9px 10px; border-radius:8px; background:#f8fafc; color:#64748b; font-size:11px; font-weight:800; }
  .mock-wrong-picker-summary { min-height:34px; padding:9px 10px; border-radius:8px; background:#f8fafc; color:#64748b; font-size:12px; font-weight:800; line-height:1.5; }
  .mock-wrong-picker-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
  .mock-wrong-picker-actions .btn-add { width:auto; padding:9px 16px; }
  .mock-report-sheet-field textarea { min-height:170px; resize:vertical; font-family:Consolas,"Malgun Gothic",monospace; font-size:12px; line-height:1.55; }
  .mock-report-sheet-guide { margin:-1px 0 7px; color:var(--text-muted); font-size:11px; line-height:1.5; }
  .mock-report-simple-card { margin:10px 0 12px; padding:15px; border:1px solid #99d5cf; border-radius:8px; background:#f7fffe; }
  .mock-report-ai-card { margin:10px 0 12px; padding:15px; border:1px solid #c4b5fd; border-radius:8px; background:#faf5ff; }
  .mock-report-ai-card textarea { width:100%; min-height:130px; margin-top:10px; resize:vertical; border:1px solid #ddd6fe; border-radius:8px; background:#fff; font-family:Consolas,"Malgun Gothic",monospace; font-size:12px; line-height:1.55; }
  .mock-report-ai-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
  .mock-report-ai-actions .mock-ai-prompt-copy-btn { border-color:#c4b5fd; background:#ede9fe; color:#5b21b6; box-shadow:0 5px 12px rgba(124,58,237,.12); }
  .mock-report-ai-actions .mock-ai-prompt-copy-btn:hover { border-color:#a78bfa; background:#ddd6fe; color:#4c1d95; }
  .mock-report-ai-actions .mock-ai-paste-apply-btn { border-color:#38bdf8; background:#e0f2fe; color:#075985; box-shadow:0 5px 12px rgba(56,189,248,.14); }
  .mock-report-ai-actions .mock-ai-paste-apply-btn:hover { border-color:#0284c7; background:#bae6fd; color:#075985; }
  .mock-report-simple-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:11px; }
  .mock-report-simple-head>div { min-width:0; display:flex; flex-direction:column; gap:3px; }
  .mock-report-simple-head strong { color:#134e4a; font-size:13px; }
  .mock-report-simple-head span { color:#475569; font-size:11px; line-height:1.45; }
  .mock-report-simple-badge { flex:0 0 auto; padding:3px 7px; border-radius:5px; background:#ccfbf1; color:#0f766e !important; font-size:9px !important; font-weight:900; }
  .mock-report-simple-drop { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px; border:1px dashed #5eead4; border-radius:8px; background:#fff; transition:all .18s; }
  .mock-report-simple-drop.is-dragging { border-color:#0f766e; background:#ecfdf5; box-shadow:0 0 0 3px rgba(15,118,110,.1); }
  .mock-report-simple-drop.is-processing { opacity:.65; pointer-events:none; }
  .mock-report-simple-drop>div { min-width:0; display:flex; flex-direction:column; gap:2px; }
  .mock-report-simple-drop strong { color:#172033; font-size:11px; }
  .mock-report-simple-drop span { color:#64748b; font-size:10px; }
  .mock-report-simple-drop>label { flex:0 0 auto; padding:7px 11px; border:1px solid #99d5cf; border-radius:7px; background:#f0fdfa; color:#0f766e; font-size:10px; font-weight:900; cursor:pointer; }
  .mock-report-simple-file-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:7px; margin-top:8px; }
  .mock-report-simple-file { min-width:0; display:grid; grid-template-columns:38px minmax(0,1fr) 24px; align-items:center; gap:7px; padding:6px; border:1px solid #dce5e7; border-radius:7px; background:#fff; }
  .mock-report-simple-file img { width:38px; height:42px; object-fit:cover; border-radius:5px; background:#f1f5f9; }
  .mock-report-simple-file>div { min-width:0; display:flex; flex-direction:column; gap:2px; }
  .mock-report-simple-file strong { color:#334155; font-size:10px; }
  .mock-report-simple-file span { overflow:hidden; color:#64748b; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
  .mock-report-simple-file button { width:24px; height:24px; border:0; border-radius:6px; background:#fff1f2; color:#be123c; font-size:14px; font-weight:900; cursor:pointer; }
  .mock-report-simple-controls { display:flex; justify-content:flex-end; align-items:center; gap:9px; margin-top:10px; }
  .mock-report-simple-controls>div>label { display:block; margin-bottom:5px; color:#475569; font-size:10px; font-weight:800; }
  .mock-report-simple-controls input { padding:9px 10px; border-radius:7px; background:#fff; font-size:12px; }
  .mock-report-simple-controls button { height:37px; padding:0 13px; border:0; border-radius:7px; background:#0f766e; color:#fff; font-family:inherit; font-size:11px; font-weight:900; cursor:pointer; }
  .mock-report-simple-controls button:hover { background:#115e59; }
  .mock-report-simple-controls button:disabled { opacity:.6; cursor:wait; }
  .mock-report-simple-status { margin-top:9px; padding:9px 10px; border-radius:7px; background:#f1f5f9; color:#475569; font-size:10px; font-weight:800; }
  .mock-report-simple-status.is-success { background:#dcfce7; color:#166534; }
  .mock-report-simple-status.is-warning { background:#fef3c7; color:#92400e; }
  .mock-report-simple-status.is-error { background:#ffe4e6; color:#be123c; }
  .mock-report-simple-status>div:first-child { display:flex; justify-content:space-between; gap:10px; }
  .mock-report-simple-progress { height:5px; margin-top:7px; overflow:hidden; border-radius:99px; background:rgba(148,163,184,.25); }
  .mock-report-simple-progress>span { display:block; width:0; height:100%; border-radius:99px; background:#0f766e; transition:width .2s; }
  .mock-report-simple-status.is-warning .mock-report-simple-progress>span { background:#d97706; }
  .mock-report-simple-status.is-error .mock-report-simple-progress>span { background:#e11d48; }
  .mock-report-simple-review { margin-top:11px; padding:12px; border:1px solid #99d5cf; border-radius:8px; background:#fff; }
  .mock-report-simple-review-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:9px; }
  .mock-report-simple-review-head>div { display:flex; flex-direction:column; gap:2px; }
  .mock-report-simple-review-head strong { color:#134e4a; font-size:12px; }
  .mock-report-simple-review-head span { color:#64748b; font-size:10px; }
  #mock-report-simple-review-count { flex:0 0 auto; padding:3px 7px; border-radius:5px; background:#ecfdf5; color:#0f766e; font-weight:900; }
  .mock-report-simple-review-table-wrap { max-height:360px; overflow:auto; border:1px solid #e2e8f0; border-radius:7px; }
  .mock-report-simple-review-table { width:100%; min-width:860px; border-collapse:collapse; }
  .mock-report-simple-review-table th { position:sticky; top:0; z-index:1; padding:7px 8px; background:#f8fafc; color:#64748b; font-size:9px; text-align:left; }
  .mock-report-simple-review-table td { padding:7px 8px; border-top:1px solid #eef2f3; vertical-align:top; font-size:10px; }
  .mock-report-simple-review-table th:first-child,
  .mock-report-simple-review-table td:first-child { width:62px; text-align:center; }
  .mock-report-simple-review-table th:nth-child(3),
  .mock-report-simple-review-table td:nth-child(3) { width:110px; }
  .mock-report-simple-review-table th:nth-child(4),
  .mock-report-simple-review-table td:nth-child(4) { width:110px; }
  .mock-report-simple-review-table th:nth-child(5),
  .mock-report-simple-review-table td:nth-child(5) { width:130px; }
  .mock-report-simple-review-table th:nth-child(6),
  .mock-report-simple-review-table td:nth-child(6) { width:86px; }
  .mock-report-simple-review-table th:last-child,
  .mock-report-simple-review-table td:last-child { width:86px; }
  .mock-report-simple-review-table tr.needs-review { background:#fffbeb; }
  .mock-report-simple-review-table td:first-child strong { display:block; color:#172033; font-size:12px; }
  .mock-report-simple-review-table td:first-child span { display:block; margin-top:2px; color:#d97706; font-size:8px; font-weight:900; }
  .mock-report-simple-review-table input,
  .mock-report-simple-review-table select { width:100%; padding:7px 8px; border:1px solid #cbd5e1; border-radius:6px; background:#fff; color:#334155; font-family:inherit; font-size:10px; outline:none; }
  .mock-report-simple-review-table input:focus,
  .mock-report-simple-review-table select:focus { border-color:#0f766e; }
  .mock-report-simple-review-table td small { display:block; max-width:430px; margin-top:4px; overflow:hidden; color:#94a3b8; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
  .mock-report-simple-review-table .result-select.correct { border-color:#86efac; background:#f0fdf4; color:#166534; font-weight:900; }
  .mock-report-simple-review-table .result-select.wrong { border-color:#fda4af; background:#fff1f2; color:#be123c; font-weight:900; }
  .mock-report-simple-apply { width:100%; margin-top:9px; padding:9px 12px; border:0; border-radius:7px; background:#0f766e; color:#fff; font-family:inherit; font-size:11px; font-weight:900; cursor:pointer; }
  .mock-report-simple-apply:hover { background:#115e59; }
  .mock-report-paper-editor { max-width:980px; }
  .mock-report-paper-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; margin-top:9px; }
  .mock-report-paper-actions .mock-report-simple-apply { margin-top:0; }
  .mock-report-paper-actions .mock-report-paper-save { background:#2563eb; box-shadow:0 6px 14px rgba(37,99,235,.18); }
  .mock-report-paper-actions .mock-report-paper-save:hover { background:#1d4ed8; }
  .mock-report-paper-library { margin-top:16px; padding-top:16px; border-top:1px solid var(--border); }
  .mock-paper-template-list { display:flex; flex-direction:column; gap:8px; }
  .mock-paper-template-card { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:12px 13px; border:1px solid var(--border); border-radius:8px; background:#fff; cursor:pointer; transition:all .18s; }
  .mock-paper-template-card:hover { border-color:#99d5cf; background:#f7fffe; }
  .mock-paper-template-card>div:first-child { min-width:0; display:flex; flex-direction:column; gap:4px; }
  .mock-paper-template-card strong { overflow:hidden; color:var(--text); font-size:13px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
  .mock-paper-template-card span { color:var(--text-muted); font-size:11px; }
  .mock-paper-template-card>div:last-child { display:flex; gap:6px; flex:0 0 auto; }
  .mock-paper-template-card button { padding:7px 10px; border:1px solid #99d5cf; border-radius:7px; background:#f0fdfa; color:#0f766e; font-family:inherit; font-size:11px; font-weight:900; cursor:pointer; }
  .mock-paper-template-card button.danger { border-color:#fecdd3; background:#fff7f8; color:#be123c; }
  .mock-report-input-divider { display:flex; align-items:center; gap:10px; margin:13px 0 9px; color:#94a3b8; font-size:9px; font-weight:800; }
  .mock-report-input-divider::before,
  .mock-report-input-divider::after { content:""; flex:1; height:1px; background:#e2e8f0; }
  .mock-report-ocr-uploader {
    display:flex; align-items:center; justify-content:space-between; gap:16px; margin:9px 0;
    padding:14px 15px; border:1px dashed #94a3b8; border-radius:8px; background:#f8fafc;
    outline:none; transition:border-color .18s, background .18s, box-shadow .18s;
  }
  .mock-report-ocr-uploader:focus,
  .mock-report-ocr-uploader.is-dragging { border-color:#0f766e; background:#f0fdfa; box-shadow:0 0 0 3px rgba(15,118,110,.1); }
  .mock-report-ocr-uploader.is-processing { opacity:.7; pointer-events:none; }
  .mock-report-ocr-copy { min-width:0; display:flex; flex-direction:column; gap:3px; }
  .mock-report-ocr-copy strong { color:#172033; font-size:12px; }
  .mock-report-ocr-copy span { color:#475569; font-size:11px; line-height:1.45; }
  .mock-report-ocr-copy small { color:#64748b; font-size:10px; line-height:1.45; }
  .mock-report-ocr-select-btn {
    flex:0 0 auto; padding:8px 12px; border:1px solid #99d5cf; border-radius:7px;
    background:#fff; color:#0f766e; font-size:11px; font-weight:900; cursor:pointer;
  }
  .mock-report-ocr-select-btn:hover { background:#ecfdf5; }
  .mock-report-ocr-result {
    grid-template-columns:62px minmax(0,1fr) auto; align-items:center; gap:12px; margin:0 0 9px;
    padding:9px; border:1px solid #cbd5e1; border-radius:8px; background:#fff;
  }
  .mock-report-ocr-result.is-success { border-color:#86efac; background:#f0fdf4; }
  .mock-report-ocr-result.is-warning { border-color:#fcd34d; background:#fffbeb; }
  .mock-report-ocr-result.is-error { border-color:#fda4af; background:#fff1f2; }
  .mock-report-ocr-result>img { width:62px; height:48px; object-fit:cover; border:1px solid #e2e8f0; border-radius:6px; background:#f8fafc; }
  .mock-report-ocr-state { min-width:0; color:#475569; font-size:11px; font-weight:700; }
  .mock-report-ocr-progress { height:5px; margin-top:7px; overflow:hidden; border-radius:99px; background:#e2e8f0; }
  .mock-report-ocr-progress>span { display:block; width:0; height:100%; border-radius:99px; background:#0f766e; transition:width .2s; }
  .mock-report-ocr-result.is-warning .mock-report-ocr-progress>span { background:#d97706; }
  .mock-report-ocr-result.is-error .mock-report-ocr-progress>span { background:#e11d48; }
  .mock-report-ocr-result>button { padding:6px 9px; border:1px solid #cbd5e1; border-radius:7px; background:#fff; color:#64748b; font-family:inherit; font-size:10px; font-weight:800; cursor:pointer; }
  .mock-report-parse-summary { padding:9px 11px; border-radius:7px; background:#f1f5f9; color:#64748b; font-size:11px; font-weight:700; margin-top:7px; }
  .mock-report-parse-summary.has-data { background:#ecfdf5; color:#047857; }
  .mock-report-editor-actions { display:flex; justify-content:flex-end; gap:8px; }
  .mock-report-editor-actions .btn-add { width:auto; padding:10px 18px; }
  .mock-report-preview-shell { min-width:0; }
  .mock-report-empty { min-height:280px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; border:1px dashed var(--border); border-radius:8px; background:#f8fafc; color:var(--text-muted); text-align:center; padding:24px; }
  .mock-report-empty strong { color:var(--text); font-size:16px; }
  .mock-report-empty span { font-size:13px; }
  .mock-score-report-layout { display:grid; grid-template-columns:minmax(250px,300px) minmax(0,1fr); gap:18px; align-items:start; }
  .mock-score-paper-manager { margin-bottom:18px; border-radius:8px; box-shadow:none; }
  .mock-score-paper-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,300px); gap:18px; align-items:start; }
  .mock-score-paper-subtitle { margin:12px 0 8px; color:#172033; font-size:13px; font-weight:900; }
  .mock-score-cutoff-grid { display:grid; grid-template-columns:repeat(9,minmax(0,1fr)); gap:6px; }
  .mock-score-cutoff-item { display:flex; flex-direction:column; gap:4px; min-width:0; }
  .mock-score-cutoff-item span { color:#64748b; font-size:10px; font-weight:900; text-align:center; }
  .mock-score-cutoff-item input { width:100%; padding:7px 6px; border:1px solid var(--border); border-radius:7px; background:#fff; font-size:12px; text-align:center; }
  .mock-score-question-table-wrap { overflow:auto; border:1px solid var(--border); border-radius:8px; background:#fff; margin-bottom:8px; }
  .mock-score-question-table { width:100%; min-width:620px; border-collapse:collapse; }
  .mock-score-question-table th,
  .mock-score-question-table td { padding:8px; border-bottom:1px solid #e2e8f0; font-size:11px; text-align:left; }
  .mock-score-question-table th { color:#64748b; font-weight:900; }
  .mock-score-question-table input,
  .mock-score-question-table select { width:100%; padding:7px 8px; border:1px solid var(--border); border-radius:7px; background:#fff; font-family:inherit; font-size:12px; }
  .mock-score-question-table button { padding:6px 8px; border:1px solid #fecdd3; border-radius:7px; background:#fff7f8; color:#be123c; font-family:inherit; font-size:11px; font-weight:900; cursor:pointer; }
  .mock-score-paper-apply { display:grid; grid-template-columns:minmax(180px,1fr) minmax(160px,.8fr) auto; gap:8px; align-items:center; }
  .mock-score-paper-apply input,
  .mock-score-paper-apply select { width:100%; padding:10px 14px; border:1px solid var(--border); border-radius:10px; background:#f8fafc; color:var(--text); font-family:inherit; font-size:14px; }
  .mock-score-report-sidebar { padding:18px; position:sticky; top:20px; box-shadow:none; border-radius:8px; }
  .mock-score-report-main { min-width:0; display:flex; flex-direction:column; gap:18px; }
  .mock-score-report-editor { margin:0; padding:22px; border-radius:8px; box-shadow:none; }
  .mock-score-report-input-block { margin:12px 0 14px; }
  .mock-score-report-input-title { margin-bottom:8px; color:#172033; font-size:13px; font-weight:900; }
  .mock-score-report-deduction-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
  .mock-score-report-deduction-grid.detail { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .mock-score-report-deduction-item { display:grid; grid-template-columns:minmax(0,1fr) 74px; align-items:center; gap:8px; padding:8px 9px; border:1px solid #dce5e7; border-radius:8px; background:#f8fafc; }
  .mock-score-report-deduction-item span { overflow:hidden; color:#334155; font-size:11px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
  .mock-score-report-deduction-item input { width:100%; padding:7px 8px; border:1px solid #cbd5e1; border-radius:7px; background:#fff; font-size:12px; text-align:right; }
  .mock-score-output-report { overflow:hidden; border:1px solid #cbd5e1; border-radius:8px; background:#f3f4f6; box-shadow:0 10px 28px rgba(15,23,42,.08); }
  .mock-score-output-header { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:30px 34px; background:#174852; color:#fff; }
  .mock-score-output-header h2 { margin:0 0 8px; font-size:29px; line-height:1.2; letter-spacing:0; }
  .mock-score-output-header p { margin:0; color:#d7eef0; font-size:13px; }
  .mock-score-output-header strong { flex:0 0 auto; color:#fde68a; font-size:17px; font-weight:900; }
  .mock-score-output-body { padding:24px 34px 30px; }
  .mock-score-summary-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
  .mock-score-summary-card { min-width:0; min-height:66px; padding:14px 12px; border-radius:8px; background:#fff; text-align:center; box-shadow:0 1px 2px rgba(15,23,42,.03); }
  .mock-score-summary-card span { display:block; color:#64748b; font-size:10px; font-weight:800; }
  .mock-score-summary-card strong { display:block; margin-top:8px; overflow-wrap:anywhere; color:#172033; font-size:15px; font-weight:900; line-height:1.2; }
  .mock-score-summary-card.hot strong { color:#e11d63; }
  .mock-score-output-body h3 { margin:19px 0 10px; color:#111827; font-size:17px; font-weight:900; }
  .mock-score-chart-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .mock-score-chart-grid.compact { align-items:stretch; }
  .mock-score-chart-card { min-width:0; padding:16px; border:1px solid #dbe4e7; border-radius:8px; background:#fff; }
  .mock-score-chart-card h4 { margin:0 0 12px; color:#172033; font-size:13px; font-weight:900; text-align:center; }
  .mock-score-radar { display:block; width:100%; height:auto; }
  .mock-score-chart-title { fill:#172033; font-size:13px; font-weight:900; }
  .mock-score-radar-label { fill:#172033; font-size:10px; font-weight:800; }
  .mock-score-radar-label .deduct { fill:#e11d63; font-size:10px; font-weight:900; }
  .mock-score-footnote { margin:11px 0 0; color:#64748b; font-size:10px; }
  .mock-score-grade-list { max-width:260px; margin:0 auto; }
  .mock-score-grade-row { display:flex; justify-content:space-between; gap:12px; padding:8px 10px; border:1px solid #e5e7eb; border-bottom:0; color:#334155; font-size:11px; }
  .mock-score-grade-row:first-child { border-radius:7px 7px 0 0; }
  .mock-score-grade-row:last-child { border-bottom:1px solid #e5e7eb; border-radius:0 0 7px 7px; }
  .mock-score-grade-row.active { border-color:#e11d63; background:#e11d63; color:#fff; }
  .mock-score-grade-row strong { font-size:11px; }
  .mock-score-donut { width:220px; aspect-ratio:1; margin:10px auto; border-radius:50%; padding:42px; }
  .mock-score-donut>div { width:100%; height:100%; border-radius:50%; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; }
  .mock-score-donut strong { color:#172033; font-size:22px; font-weight:900; line-height:1; }
  .mock-score-donut span { margin-top:5px; color:#64748b; font-size:11px; font-weight:800; }
  .mock-score-donut-legend { display:flex; flex-wrap:wrap; justify-content:center; gap:7px 12px; color:#334155; font-size:10px; font-weight:800; }
  .mock-score-donut-legend span { display:inline-flex; align-items:center; gap:4px; }
  .mock-score-donut-legend i { width:8px; height:8px; border-radius:50%; }
  .mock-score-top-card { padding:16px; border-radius:8px; background:#fff; }
  .mock-score-top-row { display:grid; grid-template-columns:24px 92px minmax(0,1fr) 50px; align-items:center; gap:10px; margin:8px 0; }
  .mock-score-top-row span { width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#e11d63; color:#fff; font-size:10px; font-weight:900; }
  .mock-score-top-row strong { overflow:hidden; color:#172033; font-size:11px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
  .mock-score-top-row div { height:14px; overflow:hidden; border-radius:999px; background:#e5e7eb; }
  .mock-score-top-row i { display:block; height:100%; border-radius:999px; background:#e11d63; }
  .mock-score-top-row em { color:#e11d63; font-size:11px; font-style:normal; font-weight:900; text-align:right; }
  .mock-score-comment-box { padding:18px 20px; border-radius:8px; background:#174852; color:#ecfeff; }
  .mock-score-comment-box pre { margin:0; white-space:pre-wrap; font-family:inherit; font-size:12px; line-height:1.72; }
  .mock-score-output-footer { margin-top:18px; color:#64748b; font-size:11px; }
  .mock-learning-report { overflow:hidden; border:1px solid #cbd5e1; border-radius:8px; background:#fff; box-shadow:0 10px 28px rgba(15,23,42,.08); }
  .mock-learning-report-header { padding:27px 30px; display:flex; align-items:flex-start; justify-content:space-between; gap:22px; background:#123f49; color:#fff; }
  .mock-learning-report-kicker { color:#99f6e4; font-size:11px; font-weight:900; }
  .mock-learning-report-header h2 { margin:6px 0 5px; font-size:25px; line-height:1.25; }
  .mock-learning-report-header p { margin:0; color:#d9eef0; font-size:13px; }
  .mock-learning-report-brand { display:flex; flex-direction:column; align-items:flex-end; gap:7px; text-align:right; }
  .mock-learning-report-brand strong { color:#fef08a; font-size:17px; }
  .mock-learning-report-brand span { color:#d9eef0; font-size:11px; }
  .mock-learning-report-body { padding:24px 28px 28px; }
  .mock-report-draft-badge { width:max-content; margin:0 0 12px auto; padding:5px 8px; border-radius:5px; background:#fff1f2; color:#be123c; font-size:10px; font-weight:900; }
  .mock-report-part { padding:18px 0 24px; border-bottom:1px solid #dce5e7; }
  .mock-report-part:first-of-type { padding-top:0; }
  .mock-report-part:last-of-type { border-bottom:0; padding-bottom:0; }
  .mock-report-part.cumulative { margin-top:20px; }
  .mock-report-part-head { margin-bottom:16px; padding:15px 17px; border:1px solid #dce5e7; border-left:5px solid #0f766e; border-radius:8px; background:#f8fafc; }
  .mock-report-part-head span { display:block; color:#0f766e; font-size:10px; font-weight:900; }
  .mock-report-part-head h3 { margin:5px 0 4px; color:#172033; font-size:18px; line-height:1.25; }
  .mock-report-part-head p { margin:0; color:#64748b; font-size:11px; line-height:1.5; }
  .mock-report-part.cumulative .mock-report-part-head { border-left-color:#e11d48; }
  .mock-report-part.cumulative .mock-report-part-head span { color:#e11d48; }
  .mock-report-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
  .mock-report-summary-card { min-width:0; padding:14px; border:1px solid #dce5e7; border-radius:8px; background:#fff; }
  .mock-report-summary-card.primary { border-color:#fecdd3; background:#fff7f8; }
  .mock-report-summary-card.score { border-color:#bfdbfe; background:#eff6ff; }
  .mock-report-summary-card>span { display:block; color:#64748b; font-size:10px; font-weight:700; }
  .mock-report-summary-card>strong { display:block; margin-top:7px; color:#172033; font-size:24px; line-height:1; }
  .mock-report-summary-card.primary>strong { color:#be123c; }
  .mock-report-summary-card.score>strong { color:#1d4ed8; }
  .mock-report-summary-card small { margin-left:3px; color:#64748b; font-size:10px; }
  .mock-report-summary-card .mock-report-summary-note { display:block; margin:6px 0 0; color:#be123c; font-size:9px; font-weight:800; }
  .mock-report-summary-card.score .mock-report-summary-note { color:#1d4ed8; }
  .mock-report-summary-card .text-value { font-size:15px; line-height:1.25; overflow-wrap:anywhere; }
  .mock-report-summary-card .text-value small { display:block; margin:5px 0 0; }
  .mock-report-gauge-grid { align-items:stretch; }
  .mock-report-gauge-card {
    --gauge:0; --gauge-color:#e11d48; --gauge-rest:#eef2f7;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
    min-height:154px; padding:16px 12px; text-align:center;
  }
  .mock-report-gauge-card.blue { --gauge-color:#2563eb; border-color:#bfdbfe; background:#eff6ff; }
  .mock-report-gauge-card.teal { --gauge-color:#0f766e; border-color:#99f6e4; background:#f0fdfa; }
  .mock-report-gauge-card.pink { --gauge-color:#e11d48; border-color:#fecdd3; background:#fff7f8; }
  .mock-report-gauge-card.violet { --gauge-color:#7c3aed; border-color:#ddd6fe; background:#f5f3ff; }
  .mock-report-gauge {
    width:92px; aspect-ratio:1; border-radius:50%; padding:6px;
    background:conic-gradient(var(--gauge-color) calc(var(--gauge) * 1%), var(--gauge-rest) 0);
    box-shadow:inset 0 0 0 1px rgba(15,23,42,.04);
  }
  .mock-report-gauge-inner {
    width:100%; height:100%; border-radius:50%; background:#fff;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
  }
  .mock-report-gauge-inner strong { color:var(--gauge-color); font-size:22px; font-weight:900; line-height:1; letter-spacing:0; }
  .mock-report-gauge-inner span { margin-top:4px; color:#334155; font-size:10px; font-weight:800; line-height:1; }
  .mock-report-gauge-meta { display:flex; flex-direction:column; align-items:center; gap:3px; min-width:0; }
  .mock-report-gauge-meta span { color:#334155; font-size:11px; font-weight:900; }
  .mock-report-gauge-meta small { margin:0; color:#64748b; font-size:9px; font-weight:800; line-height:1.35; }
  .mock-report-block { margin-top:23px; }
  .mock-report-block-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; padding-bottom:8px; margin-bottom:13px; border-bottom:1px solid #dce5e7; }
  .mock-report-block-head>div { display:flex; align-items:center; gap:8px; }
  .mock-report-block-head>div>span { color:#e11d48; font-size:10px; font-weight:900; }
  .mock-report-block-head h3 { margin:0; color:#172033; font-size:16px; }
  .mock-report-block-head p { margin:0; color:#64748b; font-size:10px; }
  .mock-report-chart-wrap { max-width:100%; overflow:hidden; padding:10px; border:1px solid #dce5e7; border-radius:8px; background:#fbfdfd; }
  .mock-report-chart-wrap canvas { display:block; max-width:100%; }
  .mock-report-two-column { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(220px,.7fr); gap:16px; }
  .mock-domain-list { display:flex; flex-direction:column; gap:12px; }
  .mock-domain-row-head { display:flex; justify-content:space-between; gap:12px; color:#334155; font-size:12px; }
  .mock-domain-track { height:7px; margin-top:6px; overflow:hidden; border-radius:99px; background:#e7edef; }
  .mock-domain-track>span { display:block; height:100%; border-radius:99px; background:#0f766e; }
  .mock-domain-caption { margin-top:4px; color:#64748b; font-size:10px; }
  .mock-report-inline-empty { padding:18px 12px; border-radius:7px; background:#f8fafc; color:#64748b; font-size:11px; text-align:center; }
  .mock-wrong-summary dl { margin:0; }
  .mock-wrong-summary dl>div { display:flex; justify-content:space-between; gap:16px; padding:9px 0; border-bottom:1px solid #eef2f3; font-size:12px; }
  .mock-wrong-summary dl>div:last-child { border-bottom:0; }
  .mock-wrong-summary dt { color:#64748b; }
  .mock-wrong-summary dd { margin:0; color:#172033; font-weight:900; }
  .mock-report-table-wrap { max-width:100%; overflow-x:auto; }
  .mock-report-wrong-table { width:100%; min-width:680px; border-collapse:collapse; }
  .mock-report-wrong-table th,
  .mock-report-wrong-table td { padding:9px 10px; border-bottom:1px solid #e2e8f0; color:#334155; font-size:11px; text-align:left; }
  .mock-report-wrong-table th { color:#64748b; font-size:10px; font-weight:800; }
  .mock-report-wrong-table td:first-child { color:#be123c; font-weight:900; }
  .mock-domain-badge { display:inline-flex; align-items:center; justify-content:center; max-width:110px; padding:2px 8px; border-radius:999px; font-size:10px; font-weight:900; line-height:1.3; white-space:nowrap; }
  .mock-difficulty-badge { display:inline-flex; align-items:center; justify-content:center; min-width:22px; padding:2px 7px; border-radius:999px; font-size:10px; font-weight:900; line-height:1.3; }
  .mock-difficulty-badge.high { background:#fee2e2; color:#b91c1c; border:1px solid #fecaca; }
  .mock-difficulty-badge.mid { background:#dbeafe; color:#1d4ed8; border:1px solid #bfdbfe; }
  .mock-difficulty-badge.low,
  .mock-difficulty-badge.neutral { background:#f1f5f9; color:#334155; border:1px solid #cbd5e1; }
  .mock-wrong-reason-badge { display:inline-flex; align-items:center; max-width:180px; padding:3px 7px; border-radius:999px; background:#f1f5f9; color:#1f2937; border:1px solid #cbd5e1; font-size:10px; font-weight:900; line-height:1.35; white-space:normal; }
  .mock-report-table-empty { color:#64748b !important; text-align:center !important; }
  .mock-report-insight-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:23px; }
  .mock-report-insight-section .mock-report-insight-grid { margin-top:0; }
  .mock-report-insight { overflow:hidden; border:1px solid #dce5e7; border-radius:8px; background:#fff; }
  .mock-report-insight-title { padding:10px 13px; background:#dcfce7; color:#166534; font-size:13px; font-weight:900; }
  .mock-report-insight.weakness .mock-report-insight-title { background:#ffe4e6; color:#be123c; }
  .mock-report-insight ul { display:flex; flex-direction:column; gap:0; margin:0; padding:8px 14px 11px; list-style:none; }
  .mock-report-insight li { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:7px 0; border-bottom:1px solid #eef2f3; font-size:11px; }
  .mock-report-insight li:last-child { border-bottom:0; }
  .mock-report-insight li strong { color:#334155; }
  .mock-report-insight li span { flex:0 0 auto; color:#64748b; font-size:10px; }
  .mock-insight-empty { color:#64748b; }
  .mock-current-insight-item { display:block !important; padding:12px 0 !important; }
  .mock-current-insight-top { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
  .mock-current-insight-top strong { color:#172033; font-size:13px; }
  .mock-current-insight-domain { display:flex; min-width:0; }
  .mock-current-insight-top>span { flex:0 0 auto; color:#0f766e; font-size:10px; font-weight:900; }
  .mock-current-insight-item.weakness .mock-current-insight-top>span { color:#be123c; }
  .mock-current-insight-stats { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }
  .mock-current-insight-stats span { flex:0 0 auto; padding:3px 7px; border-radius:999px; background:#f1f5f9; color:#475569; font-size:9px; font-weight:800; }
  .mock-current-insight-item.strength .mock-current-insight-stats .correct { background:#dcfce7; color:#166534; border:1px solid #bbf7d0; }
  .mock-current-insight-item.weakness .mock-current-insight-stats .wrong { background:#ffe4e6; color:#be123c; border:1px solid #fecdd3; }
  .mock-current-insight-item p { margin:9px 0 0; color:#475569; font-size:11px; line-height:1.55; }
  .mock-current-insight-subtitle { margin-top:10px; color:#172033; font-size:10px; font-weight:900; }
  .mock-current-insight-questions { gap:4px !important; margin-top:5px !important; padding:0 !important; }
  .mock-current-insight-questions li { display:grid !important; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:7px; padding:5px 0 !important; border-bottom:1px dashed #e2e8f0 !important; }
  .mock-current-insight-questions li:last-child { border-bottom:0 !important; }
  .mock-current-insight-questions b { color:#be123c; font-size:10px; }
  .mock-current-insight-topic { min-width:0; overflow:hidden; color:#334155; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
  .mock-current-insight-advice { margin-top:9px; padding:8px 9px; border-radius:7px; background:#f8fafc; color:#334155; font-size:10px; font-weight:800; line-height:1.55; }
  .mock-current-insight-empty { display:block !important; color:#64748b; font-size:10px; }
  .mock-report-comment { margin-top:23px; padding:18px 20px; border-radius:8px; background:#123f49; color:#e6f4f5; }
  .mock-report-comment.teacher-use { margin-top:12px; background:#fff; color:#172033; border:1px solid #dce5e7; }
  .mock-report-comment.teacher-use .mock-report-comment-label { color:#172033; }
  .mock-report-comment-label { margin-bottom:8px; color:#fef08a; font-size:13px; font-weight:900; }
  .mock-report-comment p { margin:0; font-size:12px; line-height:1.7; white-space:pre-line; }
  .mock-report-comment .teacher-comment { margin-top:11px; padding-top:11px; border-top:1px solid #4d737a; }
  .mock-report-preview-actions { display:flex; justify-content:flex-end; gap:7px; margin-top:16px; }
  .mock-report-preview-actions button { padding:7px 12px; border:1px solid #cbd5e1; border-radius:7px; background:#fff; color:#334155; font-family:inherit; font-size:11px; font-weight:800; cursor:pointer; }
  .mock-report-preview-actions button.danger { border-color:#fecdd3; color:#be123c; background:#fff7f8; }
  @media(max-width:1100px) {
    .mock-report-layout,
    .mock-score-report-layout,
    .mock-score-paper-grid { grid-template-columns:1fr; }
    .mock-report-sidebar,
    .mock-score-report-sidebar { position:static; }
    .mock-report-record-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-height:290px; }
    .mock-score-summary-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  }
  @media(max-width:720px) {
    .mock-report-page-header,
    .mock-learning-report-header,
    .mock-score-output-header { flex-direction:column; }
    .mock-report-header-actions { width:100%; }
    .mock-report-header-actions>* { flex:1; }
    .mock-report-record-list,
    .mock-report-form-grid,
    .mock-report-summary-grid,
    .mock-score-summary-grid,
    .mock-score-chart-grid,
    .mock-score-report-deduction-grid,
    .mock-score-report-deduction-grid.detail,
    .mock-score-cutoff-grid,
    .mock-score-paper-apply,
    .mock-report-tabs,
    .mock-report-two-column,
    .mock-report-insight-grid { grid-template-columns:1fr; }
    .mock-report-span-2 { grid-column:auto; }
    .mock-learning-report-brand { align-items:flex-start; text-align:left; }
    .mock-learning-report-body { padding:20px 16px; }
    .mock-report-block-head { align-items:flex-start; flex-direction:column; }
    .mock-report-ocr-uploader { align-items:stretch; flex-direction:column; }
    .mock-report-ocr-select-btn { text-align:center; }
    .mock-report-ocr-result { grid-template-columns:54px minmax(0,1fr); }
    .mock-report-ocr-result>img { width:54px; height:44px; }
    .mock-report-ocr-result>button { grid-column:1 / -1; }
    .mock-report-simple-drop,
    .mock-report-simple-controls,
    .mock-report-paper-apply,
    .mock-report-paper-actions { align-items:stretch; grid-template-columns:1fr; }
    .mock-report-simple-drop { flex-direction:column; }
    .mock-report-simple-drop>label { text-align:center; }
    .mock-report-simple-controls button { width:100%; }
    .mock-paper-template-card,
    .mock-paper-template-card>div:last-child { align-items:stretch; flex-direction:column; }
    .mock-number-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }
    .mock-score-output-body { padding:20px 16px; }
    .mock-score-output-header h2 { font-size:23px; }
    .mock-score-top-row { grid-template-columns:24px 70px minmax(0,1fr) 48px; }
    .mock-subjective-grid { grid-template-columns:1fr; }
    .mock-wrong-reason-grid { grid-template-columns:1fr; }
    .mock-wrong-picker-actions { flex-direction:column; }
  }
body.is-instructor button[onclick="exportData()"],
body.is-instructor button[onclick="importData()"] {
  display: none !important;
}
body.is-instructor #anav-costs {
  display: none !important;
}
body.is-instructor #a-panel-students button[onclick="clearCurrentMonthStudentDetails()"],
body.is-instructor #a-panel-students button[onclick="inheritPreviousMonthStudentDetails()"] {
  display: none !important;
}