/* Layout parity with the supplied demo; existing forms, actions and values stay intact. */
:root{--ui-gradient:linear-gradient(110deg,#0ea5e9,#10b981);--blue:#0ea5e9;--green:#10b981;--ink:#1e293b;--muted:#8297b5;--line:#dfebf5;--shadow:0 5px 18px #397b9810}
body,body.director-ref-body{background:linear-gradient(125deg,#eaf5ff,#f0fdf4) fixed!important;color:#1e293b}
.content,.director-ref-content{max-width:1584px!important}
.card,.metric-card,.director-panel,.director-page{border-radius:14px!important;box-shadow:var(--shadow)!important}
.sidebar .nav-list a{font-size:14px!important}.sidebar .nav-list{gap:8px!important}.sidebar .nav-list a.active{background:#ffffff2b!important}
/* A legacy fixed-height, nested scroll shell clipped the teachers table. */
body.director-ref-body{height:auto!important;min-height:100vh;overflow-y:auto!important;overflow-x:hidden!important}
.director-ref-main{height:auto!important;min-height:calc(100vh - 80px);overflow:visible!important}
.director-ref-shell{min-height:100vh;max-height:none!important;overflow:visible!important}
.director-table-wrap.teacher-table{max-height:none!important;overflow-x:auto!important;overflow-y:visible!important}
.teacher-manage-page{overflow:visible!important}.teacher-query{display:flex!important;flex-wrap:wrap;gap:16px!important}.teacher-query>label{flex:1 1 210px;min-width:0}.teacher-query>label:first-child{flex:2 1 300px}.teacher-query-actions{flex:0 0 auto}
/* Task modal: centered page title, inset gradient header, two-column settings. */
dialog.target-create-dialog{padding:18px 20px!important;width:min(1000px,94vw)!important;max-height:94vh!important;border-radius:18px!important;background:linear-gradient(110deg,#effaff,#effcf7)!important;overflow:hidden!important}
.target-create-form{display:grid!important;grid-template-rows:auto 68px minmax(0,1fr) 68px!important;height:min(1000px,88vh)!important;max-height:none!important;min-height:0!important}
.demo-task-intro{text-align:center;padding:2px 0 14px}.demo-task-intro h1{margin:0 0 5px;font-size:26px;color:#1e293b}.demo-task-intro p{font-size:13px;margin:0;color:#8095b2}
.target-create-form>header{border-radius:14px 14px 0 0!important;padding:0 26px!important}.target-create-form>header h2{font-size:19px!important}.target-create-form>header h2:before{content:'✎';display:inline-grid;place-items:center;width:26px;height:26px;border-radius:6px;background:#ffffff35;margin-right:10px}
.target-create-scroll{padding:18px 26px 26px!important;min-height:0;overflow-y:auto!important;background:#fff!important}
.target-create-form>footer{border-radius:0 0 12px 12px;background:#f8fafc!important;padding:12px 26px!important;gap:12px}
.target-create-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px 24px!important;margin:16px 0!important}
.target-create-row.full{grid-column:1/-1}.target-create-row>b{font-size:12px!important;font-weight:400!important}.target-create-row select,.target-create-row input:not([type=radio]):not([type=checkbox]),.target-create-row textarea{background:#f8fafc!important;min-height:40px!important;border-color:#dcecfb!important;font-size:13px!important;width:100%;min-width:0;box-sizing:border-box}
.target-create-row .radio-line{display:flex;gap:8px!important;flex-wrap:nowrap!important}.target-create-row .radio-line>label{flex:1 1 0!important;min-width:0!important;justify-content:center;padding:10px 8px!important;background:#f8fafc!important;font-size:12px;border-color:#dcecfb!important}
.target-create-row .radio-line input{position:absolute;opacity:0;width:1px;height:1px}.target-create-row .radio-line>label:has(input:checked){border-color:#0ea5e9!important;color:#0ea5e9!important;background:#f0f9ff!important}.target-create-row .radio-line>label:focus-within{outline:2px solid #0ea5e9;outline-offset:2px}.target-create-row [data-task-type-help]{display:none!important}
.bluegreen-form-section{font-size:14px!important;color:#0ea5e9!important;padding:9px 0!important;margin:12px 0 0!important;border-bottom:1px solid #dcecfb!important}.bluegreen-form-section span{background:none!important;width:18px!important;height:auto!important;color:#0ea5e9!important}
.demo-paper-row .chip-line{width:100%;display:flex!important;align-items:center;flex-wrap:wrap;background:#f1f5f9!important}.demo-paper-row label span{font-size:12px!important}.demo-paper-row .inline-action{margin-left:auto}.target-create-row .counted-field{width:100%}
.composition-kind-switch,.target-create-row:has(input[name=book]) .radio-line{padding:3px;border-radius:7px;background:#f1f5f9}.composition-kind-switch>label,.target-create-row:has(input[name=book]) .radio-line>label{border:0!important;padding:7px 10px!important;flex:0 1 auto!important}.composition-kind-switch>label:has(input:checked),.target-create-row:has(input[name=book]) label:has(input:checked){background:#fff!important;box-shadow:0 1px 4px #0ea5e918}
.select-with-action{position:relative}.select-with-action .inline-action{position:absolute;right:0;top:-25px}.select-with-action select{width:100%}
.demo-polish-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.demo-polish-options label{position:relative;background:#fff;border:1px solid #cfe4ef;border-radius:10px;padding:14px 6px;text-align:center;cursor:pointer;box-shadow:0 2px 4px #397b9809}.demo-polish-options label b{display:block;font-size:13px}.demo-polish-options label small{display:block;color:#8291a6;font-size:10px;line-height:1.5;margin-top:5px}.demo-polish-options input,.demo-option-pills input{position:absolute;opacity:0;width:1px;height:1px}.demo-polish-options label:has(input:checked){color:#0ea5e9;border-color:#0ea5e9;box-shadow:0 0 0 1px #0ea5e928}.demo-polish-options label:focus-within,.demo-option-pills label:focus-within{outline:2px solid #0ea5e9;outline-offset:2px}
.polish-grid{background:linear-gradient(110deg,#f0f9ff,#effcf6);padding:20px;border-radius:12px;border:1px solid #e2eff5}.demo-keep-length{grid-column:1/-1;display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:wrap;padding:14px!important;border-left:3px solid #10b981;background:#ffffff7a;border-radius:8px}.demo-keep-length small{flex-basis:100%}.demo-option-pills{display:flex;flex-wrap:wrap;gap:8px}.demo-option-pills label span{display:block;padding:7px 12px;border-radius:20px;border:1px solid #dfe7ed;background:#fff;font-size:12px;cursor:pointer}.demo-option-pills label:has(input:checked) span{background:var(--ui-gradient);color:#fff;border-color:transparent}
/* Dashboard: hero, 3x2 KPI grid, 2:1 charts, independently bounded lists. */
.demo-dashboard-hero{padding:34px 38px;margin-bottom:24px;border-radius:14px;background:var(--ui-gradient);color:#fff;position:relative;overflow:hidden}.demo-dashboard-hero:after{content:'';position:absolute;width:105px;height:105px;right:42px;top:65px;border:3px solid #ffffff30;border-radius:50%;box-shadow:0 0 0 20px #ffffff10}.demo-dashboard-hero small{font-size:13px;letter-spacing:1px}.demo-dashboard-hero h1{font-size:30px;margin:18px 0}.demo-dashboard-hero p{font-size:14px;margin:14px 0 22px}.demo-dashboard-hero .btn{background:#ffffff26!important;border-color:#ffffff66!important;color:#fff!important;padding:12px 24px}
.demo-dashboard-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-bottom:24px}.demo-dashboard-metrics article{background:#fff;border-radius:14px;padding:26px;display:flex;align-items:center;gap:18px;box-shadow:var(--shadow)}.demo-dashboard-metrics i{width:54px;height:54px;border-radius:14px;background:#e0f2fe;color:#0ea5e9;display:grid;place-items:center;font-size:27px;font-style:normal}.demo-dashboard-metrics article:nth-child(3n) i,.demo-dashboard-metrics article:nth-child(5) i{background:#d1fae5;color:#10b981}.demo-dashboard-metrics b{font-size:28px;display:block}.demo-dashboard-metrics small{display:block;color:#8297b5;margin-top:6px;font-size:12px}
.demo-dashboard-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:20px}.demo-dashboard-grid .card{padding:24px;min-width:0}.demo-dashboard-grid header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.demo-dashboard-grid h2{font-size:17px;margin:0}.demo-dashboard-grid h2:before{content:'';display:inline-block;width:9px;height:9px;background:#0ea5e9;border-radius:3px;margin-right:10px}.demo-dashboard-grid svg{display:block;width:100%;height:auto;min-height:220px}.demo-live-trend .grid line{stroke:#edf2f7}.demo-live-trend text{fill:#8297b5;font-size:12px}.demo-live-trend .trend-line{fill:none;stroke:#0ea5e9;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.demo-live-trend .trend-area{fill:#0ea5e913}.demo-live-trend circle{fill:#0ea5e9}.demo-chart-empty{text-align:center;color:#94a3b8;padding:35px 10px;font-size:13px}
.demo-dashboard-top>div{max-height:310px;overflow:auto}.demo-dashboard-top a{display:block;padding:14px 0;border-bottom:1px solid #edf2f7}.demo-dashboard-top a b{font-size:14px;color:#0ea5e9}.demo-dashboard-top small{display:block;color:#8297b5;font-size:12px;line-height:1.6;margin-top:8px}.demo-dashboard-recent>a{display:block;background:#f8fafc;border-radius:10px;padding:16px 18px;margin-top:12px}.demo-dashboard-recent small{font-size:12px;color:#8297b5}.demo-dashboard-recent time{float:right}.demo-dashboard-recent h3{font-size:16px;margin:12px 0}.demo-dashboard-recent footer{display:flex;gap:24px;font-size:12px}.demo-dimension-bars>div{display:grid;grid-template-columns:60px 1fr 55px;align-items:center;gap:12px;margin:24px 0;font-size:13px}.demo-dimension-bars i{height:9px;border-radius:10px;background:#edf2f7;overflow:hidden}.demo-dimension-bars em{display:block;height:100%;background:var(--ui-gradient);border-radius:10px}
/* Examples: pill tabs, active grade accent and pale gradient gallery cards. */
.excellent-manager{padding:0!important;min-height:560px!important;border:0!important;background:transparent!important;box-shadow:none!important;gap:20px!important;grid-template-columns:160px minmax(0,1fr)!important}
.excellent-directory,.excellent-stage{background:#fff!important;border-radius:14px!important;box-shadow:var(--shadow)!important}.excellent-directory{border:0!important;padding:16px 0!important}.excellent-directory-title{padding:8px 20px;color:#8297b5;font-size:13px}.excellent-directory-list a{padding:12px 20px!important;border-radius:0!important;margin:0!important;font-size:13px}.excellent-directory-list a.active{border-right:3px solid #10b981!important;background:#e0f2fe!important;color:#0ea5e9!important}.excellent-stage{padding:24px!important;min-width:0}.excellent-stage-head{display:flex!important;gap:16px;flex-wrap:wrap;align-items:center}.excellent-tabs{display:flex;flex-wrap:wrap;gap:8px!important}.excellent-tabs a{display:block;padding:10px 18px!important;border-radius:24px!important;background:#f8fafc!important;color:#64748b!important;border:0!important;font-size:13px!important}.excellent-tabs a.active{background:#0ea5e9!important;color:#fff!important;box-shadow:0 4px 12px #0ea5e92b!important}.excellent-search{margin-left:auto}.excellent-search input{border-radius:22px!important;background:#e0f2fe!important;padding:9px 16px!important;min-width:190px}.excellent-genre-nav{padding:18px 0!important;display:flex;flex-wrap:wrap;gap:10px;border-bottom:1px solid #e2e8f0}.excellent-genre-nav a{padding:6px 12px!important;border-radius:20px!important;font-size:12px}.excellent-genre-nav a.active{background:#d1fae5!important;color:#059669!important}
.excellent-card-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important;padding:20px 0!important}.excellent-essay-card{background:linear-gradient(110deg,#f0f9ff,#ecfdf5)!important;border:1px solid transparent!important;border-radius:14px!important;padding:18px!important;min-height:170px!important;box-shadow:none!important;transition:border-color .15s,box-shadow .15s}.excellent-essay-card:hover{border-color:#7dd3fc!important;box-shadow:0 5px 20px #0ea5e916!important}.excellent-essay-card h2{font-size:14px!important;line-height:1.7;display:block!important}.excellent-unit-tag{display:inline-block;padding:4px 7px;margin-right:7px;background:#fff!important;border-radius:15px;color:#10b981!important;font-size:10px!important}.excellent-essay-excerpt{color:#647f9e!important;font-size:12px!important;line-height:1.8;margin:10px 0!important}.excellent-essay-card footer{border-top:1px solid #dcece9;padding-top:10px!important;font-size:11px;color:#8297b5!important}.excellent-essay-card time{font-size:10px!important}.excellent-essay-actions{font-size:11px;margin-top:10px}.excellent-pagination{margin-top:20px}
/* Growth: compact metrics, 2:1 capability/honors, full-width graphs. */
.growth-reference-layout{grid-template-columns:190px minmax(0,1fr)!important;gap:20px!important;align-items:start}.growth-student-panel{padding:16px!important;position:sticky;top:100px}.growth-student-list{max-height:550px!important;overflow-y:auto}.growth-student-list a.active{background:#d1fae5!important;border-right:3px solid #10b981!important;color:#047857!important}.growth-kpis{gap:12px!important;grid-template-columns:repeat(6,minmax(0,1fr))!important}.growth-kpis article{background:#fff!important;border:1px solid #dfebf5;border-radius:12px!important;padding:18px 14px!important;min-width:0}.growth-kpis small,.growth-kpis i{font-size:11px!important;color:#8297b5!important}.growth-kpis b{color:#1e293b!important}.growth-visual-grid{grid-template-columns:minmax(0,2fr) minmax(0,1fr)!important;gap:16px!important}.growth-radar-card,.growth-honor-card{min-height:310px;padding:18px!important}.growth-card-head h2{font-size:15px!important}.radar-content{display:flex;justify-content:center}.radar-content svg{width:100%;max-width:420px!important;height:260px!important}.radar-class-value{fill:#0ea5e920!important;stroke:#0ea5e9!important;stroke-width:2!important}.radar-value{fill:#10b98120!important;stroke:#10b981!important;stroke-width:2!important}.growth-honor-card .growth-empty-state span{font-size:42px;color:#cbd5e1}.growth-empty-state{color:#94a3b8!important}.growth-genre-card,.growth-trend-card,.growth-score-distribution{padding:20px!important}.growth-trend-card polyline{stroke:#0ea5e9!important;stroke-width:2.5!important}.growth-trend-card circle{fill:#0ea5e9!important}.growth-report-head{padding:16px 20px!important}
.demo-score-filters{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.demo-score-filters button{border:1px solid #dfe8f3;border-radius:20px;background:#fff;color:#64748b;padding:6px 14px;font-size:12px}.demo-score-filters button.active{background:#d1fae5;border-color:#10b981;color:#047857}.demo-score-bars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:210px;gap:24px;padding:0 25px;border-bottom:1px solid #dbe7f1;background:repeating-linear-gradient(to top,transparent 0,transparent 49px,#edf2f7 50px,#edf2f7 51px);margin-bottom:35px}.demo-score-bars>div{position:relative;display:flex;align-items:end;justify-content:center}.demo-score-bars i{display:block;width:38px;min-height:0;background:var(--ui-gradient);border-radius:6px 6px 0 0}.demo-score-bars small{position:absolute;bottom:-25px;font-size:12px;color:#8297b5}.demo-score-bars b{position:absolute;bottom:calc(var(--bar-height) + 6px);font-size:12px;color:#64748b}
.radar-grid polygon{fill:none;stroke:#dce8f4;stroke-width:1}.growth-radar-legend .class-level i{background:#0ea5e9!important}.growth-radar-legend .my-level i{background:#10b981!important}.demo-dashboard-hero small{color:#ffffffdd!important}
.demo-genre-menu{position:relative}.demo-genre-menu summary{list-style:none;padding:6px 12px;font-size:12px;color:#64748b;cursor:pointer;border-radius:20px}.demo-genre-menu summary.active{background:#d1fae5;color:#059669}.demo-genre-menu>div{position:absolute;top:100%;left:0;z-index:15;display:grid;min-width:150px;max-height:300px;overflow:auto;background:white;border:1px solid #dfebf5;border-radius:12px;padding:8px;box-shadow:0 8px 24px #397b9820}.excellent-stage{overflow:visible!important}.excellent-search input[name=keyword]{background:#e0f2fe!important;border-radius:22px!important}
body[data-ui-page="teacher.reports"] .page-heading{background:transparent!important;border:0!important;box-shadow:none!important;padding:8px 0 16px!important}
[hidden]{display:none!important}
@media(max-width:1250px){.excellent-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.growth-kpis{grid-template-columns:repeat(3,minmax(0,1fr))!important}.sidebar .nav-list a{font-size:12px!important;padding:0 10px!important}}
@media(max-width:900px){.target-create-grid{grid-template-columns:1fr!important}.demo-polish-options{grid-template-columns:repeat(2,minmax(0,1fr))}.target-create-dialog{padding:10px!important}.target-create-scroll{padding:12px 16px!important}.demo-task-intro h1{font-size:21px}.demo-dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-dashboard-grid,.growth-visual-grid{grid-template-columns:1fr!important}.excellent-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.excellent-manager{grid-template-columns:130px minmax(0,1fr)!important}.growth-reference-layout{grid-template-columns:155px minmax(0,1fr)!important}.demo-dashboard-hero{padding:25px}.demo-dashboard-metrics article{padding:18px}.demo-dashboard-metrics i{width:40px;height:40px}.demo-dashboard-metrics b{font-size:24px}}
@media(max-width:600px){.excellent-manager,.growth-reference-layout{grid-template-columns:1fr!important}.excellent-directory-list{display:flex;flex-wrap:wrap}.excellent-directory-list a{padding:8px 12px!important}.excellent-card-grid{grid-template-columns:1fr!important}.growth-student-panel{position:static}.growth-student-list{max-height:180px!important}.growth-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}.demo-dashboard-metrics{gap:10px}.demo-dashboard-metrics article{padding:14px;gap:10px}.demo-dashboard-hero h1{font-size:25px}.demo-dashboard-hero:after{display:none}.demo-dashboard-recent time{float:none;display:block;margin-top:5px}.demo-dashboard-recent footer{gap:10px;flex-wrap:wrap}.demo-score-bars{gap:10px;padding:0 10px}}
.ui-line-icon{width:20px;height:20px;display:inline-block;vertical-align:-4px;flex-shrink:0;color:inherit}
.review-section-rail .ui-line-icon{width:23px;height:23px}
.director-ref-side nav details>summary.active{background:#ffffff30!important;color:#fff!important;box-shadow:inset 0 -3px #fff!important;border-radius:10px}
.director-ref-side nav details>summary.active i{color:#fff!important}
.director-ref-head .director-account-avatar{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#e0f4fc;color:#0984b2;cursor:pointer}
.director-account-avatar .ui-line-icon{width:22px;height:22px}