@import "https://fonts.googleapis.com/css2?family=Bangers&family=Manrope:wght@400;500;600;700;800&family=Patrick+Hand&display=swap";:root{color:#08245f;font-synthesis:none;--blue:#1769ff;--blue-dark:#0c4fd7;--navy:#082a75;--ink:#0b2458;--muted:#6e7f9f;--line:#dce7f7;--surface:#fffffff0;--ice:#f4f8ff;--shadow:0 12px 34px #264a811a, 0 2px 7px #264a810d;--shadow-soft:0 8px 22px #264a8114;background:#eff6ff;font-family:Manrope,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at 72% 4%,#b5d9ff8a,#0000 26%),linear-gradient(135deg,#f7faff 0%,#edf5ff 52%,#f9fbff 100%);min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #1769ff38}button,select{cursor:pointer}.app-shell{min-height:100vh}.sidebar{z-index:40;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#ffffffe8;border-right:1px solid #ccdaf0b8;flex-direction:column;width:244px;padding:24px 18px 18px;display:flex;position:fixed;inset:0 auto 0 0;box-shadow:10px 0 34px #284d820f}.sidebar__head{justify-content:space-between;align-items:center;padding:0 8px 34px;display:flex}.brand{letter-spacing:-1px;color:var(--blue);align-items:center;gap:10px;font-size:23px;font-weight:800;display:flex}.brand__mark{filter:drop-shadow(0 6px 8px #1769ff40);width:36px;height:31px;position:relative}.brand__mark i{background:linear-gradient(145deg,#5b9aff,#1769ff 70%);border-radius:7px 3px 7px 7px;width:18px;height:27px;position:absolute;top:2px;transform:skewY(-13deg)}.brand__mark i:first-child{left:1px}.brand__mark i:last-child{right:1px;transform:scaleX(-1)skewY(-13deg)}.brand__mark:after{content:"";background:#0b4ed4;border-radius:10px;width:4px;height:22px;position:absolute;top:5px;left:16px}.brand--compact{display:none}.nav-label{color:#9aa9c2;letter-spacing:1.25px;text-transform:uppercase;margin:0 11px 10px;font-size:10px;font-weight:800}.nav-label--spaced{margin-top:28px}.nav-list{gap:7px;display:grid}.nav-item{color:#56719e;text-align:left;background:0 0;border:0;border-radius:14px;align-items:center;gap:12px;width:100%;height:47px;padding:0 14px;font-size:13px;font-weight:700;transition:all .2s;display:flex}.nav-item:hover{color:var(--blue);background:#edf4ff;transform:translate(2px)}.nav-item--active{color:#fff;background:linear-gradient(135deg,#4387ff,#1769ff 65%,#0b58e4);box-shadow:0 10px 19px #1769ff45}.nav-item--active:hover{color:#fff;background:linear-gradient(135deg,#4387ff,#1769ff 65%,#0b58e4)}.nav-list--muted .nav-item{height:43px;font-weight:600}.sidebar__profile{width:100%;color:inherit;text-align:left;box-shadow:var(--shadow-soft);cursor:pointer;background:#f6f9ff;border:1px solid #e4ecfa;border-radius:16px;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;margin-top:auto;padding:11px;display:grid}.sidebar__profile strong,.sidebar__profile span{display:block}.sidebar__profile strong{font-size:12px}.sidebar__profile span{color:var(--muted);margin-top:3px;font-size:9px}.sidebar__footer{color:var(--navy);gap:3px;padding:22px 8px 0;display:grid}.sidebar__footer span{font-size:11px;font-weight:800}.sidebar__footer small{color:var(--muted);font-size:9px}.sidebar__close{display:none!important}.avatar{border-radius:50%;justify-content:center;align-items:center;font-weight:800;display:inline-flex}.avatar--teacher{color:#0e4dbf;background:linear-gradient(145deg,#ffdca7,#ffbd68);border:3px solid #fff;width:38px;height:38px;font-size:11px;box-shadow:0 4px 10px #3f5b8229}.avatar--teacher img,.student-avatar img{border-radius:inherit;object-fit:cover;width:100%;height:100%}.workspace{min-height:100vh;margin-left:244px}.topbar{z-index:30;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#f2f7ffd4;border-bottom:1px solid #d3e0f2ad;align-items:center;gap:16px;height:82px;padding:14px clamp(20px,3vw,46px);display:flex;position:sticky;top:0}.school-switcher,.user-chip,.icon-button{border:0}.school-switcher{min-width:390px;max-width:460px;min-height:55px;box-shadow:var(--shadow-soft);text-align:left;background:#ffffffe6;border-radius:17px;align-items:center;gap:11px;padding:8px 14px 8px 9px;display:flex}.school-switcher>span:nth-child(2){flex:1;min-width:0}.school-switcher small,.school-switcher strong{display:block}.school-switcher small{color:#8797b1;margin-bottom:2px;font-size:9px;font-weight:700}.school-switcher strong{color:var(--navy);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.school-switcher__icon{width:39px;height:39px;color:var(--blue);background:linear-gradient(145deg,#eef5ff,#dceaff);border-radius:13px;place-items:center;display:grid}.topbar__actions{align-items:center;gap:12px;margin-left:auto;display:flex}.icon-button{width:42px;height:42px;box-shadow:var(--shadow-soft);background:#fff;border-radius:13px;place-items:center;display:inline-grid}.notification{color:#5073a9;position:relative}.notification>span{color:#fff;background:#f44;border:2px solid #fff;border-radius:50%;place-items:center;width:20px;height:20px;font-size:9px;font-weight:800;display:grid;position:absolute;top:-5px;right:-3px}.user-chip{min-width:155px;box-shadow:var(--shadow-soft);text-align:left;background:#fff;border-radius:17px;align-items:center;gap:9px;padding:7px 10px;display:flex}.user-chip>span:nth-child(2){flex:1}.user-chip strong,.user-chip small{display:block}.user-chip strong{font-size:11px}.user-chip small{color:var(--muted);margin-top:3px;font-size:9px}.mobile-menu{display:none}.main-content{width:min(100%,1540px);margin:0 auto;padding:26px clamp(20px,3vw,46px) 46px}@keyframes pageIn{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}.hero{min-height:386px;box-shadow:var(--shadow);isolation:isolate;background:#dfedff;border-radius:28px;position:relative;overflow:hidden}.hero img{object-fit:cover;object-position:center;z-index:-2;width:100%;height:100%;position:absolute;inset:0}.hero__overlay{z-index:-1;background:linear-gradient(90deg,#f5fafffa 0%,#eff7fff0 31%,#ebf5ff8f 52%,#ebf5ff08 72%);position:absolute;inset:0}.hero__content{width:58%;padding:clamp(30px,4vw,52px)}.hero__greeting{color:var(--blue);align-items:center;gap:7px;font-size:14px;font-weight:800;display:inline-flex}.hero__content>p{margin:8px 0 16px;font-size:12px}.hero h1{color:var(--navy);letter-spacing:-2.8px;text-transform:uppercase;margin:0;font-size:clamp(32px,3.7vw,55px);line-height:.98}.hero__meta{gap:12px;margin-top:26px;display:flex}.hero__meta>span{-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);min-width:144px;min-height:57px;color:var(--blue);background:#ffffffc4;border:1px solid #fffc;border-radius:15px;align-items:center;gap:9px;padding:10px 13px;display:flex;box-shadow:0 8px 20px #3252821a}.hero__meta small,.hero__meta strong{display:block}.hero__meta small{color:#7487a7;margin-bottom:3px;font-size:8px}.hero__meta strong{color:var(--navy);font-size:10px}.summary-grid{grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0;display:grid}.summary-card{background:var(--surface);min-height:91px;box-shadow:var(--shadow-soft);border:1px solid #dfe8f7e6;border-radius:20px;align-items:center;gap:14px;padding:16px 18px;display:flex}.summary-card>div{min-width:0}.summary-card strong,.summary-card div>span{display:block}.summary-card strong{color:var(--navy);font-size:25px;line-height:1}.summary-card div>span{color:var(--muted);margin-top:6px;font-size:10px;font-weight:600}.summary-icon{border-radius:15px;flex:none;place-items:center;width:48px;height:48px;display:grid}.summary-icon svg{width:23px}.summary-icon.blue{color:#1769ff;background:#e7f0ff}.summary-icon.cyan{color:#05a7bc;background:#e3f9fb}.summary-icon.orange{color:#f59a13;background:#fff3dc}.summary-icon.purple{color:#745ae6;background:#eeeafe}.panel{background:var(--surface);box-shadow:var(--shadow);border:1px solid #dee8f7e6;border-radius:22px;padding:20px}.panel__header{justify-content:space-between;align-items:flex-start;gap:12px;min-height:38px;margin-bottom:16px;display:flex}.panel__header h2{color:var(--navy);letter-spacing:-.2px;margin:0;font-size:14px}.panel__header p{color:var(--muted);margin:4px 0 0;font-size:9px}.panel__more{width:32px;height:32px;box-shadow:none;color:#7f8fac;background:#f5f8fd}.text-link{color:var(--blue);background:0 0;border:0;align-items:center;gap:5px;font-size:9px;font-weight:800;display:inline-flex}.dashboard-grid{gap:14px;margin-bottom:18px;display:grid}.dashboard-grid--top{grid-template-columns:1.05fr 1fr 1fr}.dashboard-grid--bottom{grid-template-columns:1.1fr 1fr 1fr}.attendance-overview{justify-content:center;align-items:center;gap:20px;display:flex}.donut{background:conic-gradient(var(--blue) 0 var(--attendance-value,0deg), #e5edf9 var(--attendance-value,0deg) 360deg);border-radius:50%;flex:none;place-items:center;width:120px;height:120px;display:grid;position:relative;box-shadow:inset 0 0 0 2px #fff9,0 8px 20px #1769ff33}.donut:after{content:"";background:#fff;border-radius:50%;position:absolute;inset:15px;box-shadow:inset 0 3px 8px #1e416e14}.donut>span{z-index:1;text-align:center;position:relative}.donut strong,.donut small{display:block}.donut strong{color:var(--navy);font-size:24px}.donut small{color:var(--muted);font-size:8px}.legend{gap:8px;display:grid}.legend span{color:var(--navy);grid-template-columns:8px 22px 1fr;align-items:center;gap:6px;font-size:10px;font-weight:800;display:grid}.legend small{color:var(--muted);font-weight:600}.dot{border-radius:50%;width:8px;height:8px}.dot--blue{background:var(--blue)}.dot--orange{background:#ff9d16}.dot--cyan{background:#22b8cf}.dot--red{background:#ee4d51}.soft-button{width:max-content;min-height:35px;color:var(--blue);background:#eaf2ff;border:0;border-radius:11px;justify-content:center;align-items:center;gap:7px;margin-top:15px;padding:0 14px;font-size:9px;font-weight:800;display:flex}.attendance-panel .soft-button{margin-inline:auto}.timeline{gap:12px;display:grid}.timeline__item{grid-template-columns:40px 10px 1fr;align-items:center;gap:8px;display:grid;position:relative}.timeline__item:not(:last-child):after{content:"";background:#dce8fa;width:1px;height:18px;position:absolute;top:23px;left:53px}.timeline__time{color:var(--blue);font-size:9px;font-weight:700}.timeline__item>i{background:var(--blue);border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #eaf2ff}.timeline strong,.timeline small{display:block}.timeline strong{font-size:10px}.timeline small{color:var(--muted);margin-top:3px;font-size:8px}.note-list{gap:10px;display:grid}.note-item{border-radius:12px;grid-template-columns:36px 1fr;align-items:center;gap:10px;padding:7px;transition:all .2s;display:grid}.note-item:hover{background:#f6f9ff}.note-icon{border-radius:11px;place-items:center;width:34px;height:34px;display:grid}.note-icon svg{width:16px}.note-icon--1{color:#ee754e;background:#fff0e9}.note-icon--2{color:#1769ff;background:#e9f2ff}.note-icon--3{color:#7254e8;background:#f0ecff}.note-item strong,.note-item small{display:block}.note-item strong{font-size:9px}.note-item small{color:var(--muted);margin-top:3px;font-size:8px}.module-panel{margin-bottom:18px}.module-grid{grid-template-columns:repeat(5,1fr);gap:12px;display:grid}.module-card{text-align:left;background:linear-gradient(145deg,#fafcff,#f1f6ff);border:1px solid #e2eafa;border-radius:17px;min-height:116px;padding:14px;transition:all .24s}.module-card__icon{border-radius:15px;place-items:center;width:48px;height:48px;margin-bottom:12px;display:grid;box-shadow:inset 0 1px #fffc,0 8px 16px #2745731a}.module-card__icon.blue{color:#1769ff;background:linear-gradient(145deg,#deecff,#bcd7ff)}.module-card__icon.indigo{color:#3a43c5;background:linear-gradient(145deg,#ebeaff,#cfccff)}.module-card__icon.orange{color:#f18e08;background:linear-gradient(145deg,#fff0cc,#ffd28c)}.module-card__icon.yellow{color:#e99f00;background:linear-gradient(145deg,#fff7cf,#ffe576)}.module-card__icon.purple{color:#7254e8;background:linear-gradient(145deg,#f1edff,#d5caff)}.module-card strong,.module-card small{display:block}.module-card strong{color:var(--navy);font-size:10px}.module-card small{color:var(--muted);margin-top:4px;font-size:8px;line-height:1.45}.student-mini-list{gap:11px;display:grid}.student-mini-list>div{grid-template-columns:36px 1fr auto;align-items:center;gap:10px;display:grid}.student-mini-list strong,.student-mini-list small{display:block}.student-mini-list strong{font-size:9px}.student-mini-list small{color:var(--muted);margin-top:3px;font-size:8px}.student-mini-list svg{color:#2db67c}.student-avatar{color:#17417c;background:linear-gradient(145deg, white, var(--avatar-color));border:2px solid #fff;border-radius:12px 12px 14px 14px;flex:none;justify-content:center;align-items:center;width:36px;height:36px;font-size:9px;font-weight:800;display:inline-flex;box-shadow:0 4px 10px #334b7021}.mini-chart{background:repeating-linear-gradient(0deg,#0000 0 28px,#edf3fc 29px);border-bottom:1px solid #dce7f8;justify-content:space-around;align-items:end;gap:5px;height:118px;padding:12px 8px 7px;display:flex}.mini-chart span{width:10px;height:var(--value);background:linear-gradient(#4d8dff,#1769ff);border-radius:8px 8px 2px 2px;position:relative;box-shadow:0 5px 12px #1769ff2e}.mini-chart span i{background:#1769ff;border:2px solid #fff;border-radius:50%;width:8px;height:8px;position:absolute;top:-4px;left:1px}.mini-chart b{color:#fff;background:#1769ff;border-radius:7px;padding:4px 7px;font-size:8px;position:absolute;top:-27px;left:50%;transform:translate(-50%)}.chart-labels{color:var(--muted);justify-content:space-between;padding-top:7px;font-size:7px;display:flex}.trust-card{background:#f6f9ff;border-radius:14px;grid-template-columns:42px 1fr;align-items:center;gap:10px;padding:10px;display:grid}.trust-card+.trust-card{margin-top:9px}.trust-card>span{width:40px;height:40px;color:var(--blue);background:#e4efff;border-radius:13px;place-items:center;display:grid}.trust-card__star{color:#ea9d00!important;background:#fff3d1!important}.trust-card svg{width:21px}.trust-card strong{font-size:9px}.trust-card p{color:var(--muted);margin:3px 0 0;font-size:8px;line-height:1.45}.page{padding-top:8px}.page-intro{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px;display:flex}.eyebrow{color:var(--blue);letter-spacing:.9px;text-transform:uppercase;font-size:10px;font-weight:800}.page-intro h1{color:var(--navy);letter-spacing:-1.6px;margin:7px 0 8px;font-size:clamp(27px,3vw,39px);line-height:1.04}.page-intro p{max-width:620px;color:var(--muted);margin:0;font-size:11px;line-height:1.6}.page-intro__actions{gap:9px;display:flex}.button{white-space:nowrap;border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;gap:7px;min-height:40px;padding:0 15px;font-size:10px;font-weight:800;transition:all .2s;display:inline-flex}.button:hover{transform:translateY(-1px)}.button--primary{color:#fff;background:linear-gradient(135deg,#4387ff,#1769ff 65%,#0b58e4);box-shadow:0 9px 18px #1769ff3b}.button--ghost{color:#43628f;background:#fff;border-color:#dce6f5;box-shadow:0 5px 13px #2c4a730f}.button--small{min-height:34px;padding:0 11px;font-size:9px}.button:disabled{opacity:.45;cursor:not-allowed;transform:none}.summary-grid--page{grid-template-columns:repeat(3,1fr);margin:0 0 18px}.metric-card{color:#fff;background:linear-gradient(135deg,#4589ff,#1769ff);border-radius:20px;align-items:center;gap:16px;min-height:122px;padding:21px;display:flex;box-shadow:0 12px 24px #1769ff33}.metric-card>span{background:#ffffff2e;border-radius:17px;place-items:center;width:52px;height:52px;display:grid}.metric-card--green{background:linear-gradient(135deg,#35c897,#14a978);box-shadow:0 12px 24px #14a9782b}.metric-card--orange{background:linear-gradient(135deg,#ffb341,#f28a12);box-shadow:0 12px 24px #f28a1229}.metric-card--gold{background:linear-gradient(135deg,#f8c64a,#e89b08);box-shadow:0 12px 24px #e89b082e}.metric-card--red{background:linear-gradient(135deg,#ff7e78,#e64b51);box-shadow:0 12px 24px #e64b512e}.metric-card small,.metric-card strong,.metric-card em{display:block}.metric-card small{color:#ffffffd1;font-size:9px;font-weight:700}.metric-card strong{margin:5px 0;font-size:26px;line-height:1}.metric-card em{color:#ffffffd9;font-size:8px;font-style:normal}.page-grid{grid-template-columns:minmax(0,1fr) 275px;align-items:start;gap:18px;display:grid}.page-aside{gap:18px;display:grid}.table-panel{min-width:0}.table-toolbar{justify-content:space-between;align-items:center;gap:10px;margin-bottom:13px;display:flex}.search-box{color:#8a9ab3;background:#f7faff;border:1px solid #dde7f5;border-radius:12px;align-items:center;gap:8px;width:min(100%,310px);height:39px;padding:0 12px;display:flex}.search-box input{width:100%;min-width:0;color:var(--ink);background:0 0;border:0;outline:0;font-size:9px}.search-box input::placeholder{color:#9eabc0}.data-table-wrapper{overflow-x:auto}.data-table{border-collapse:collapse;text-align:left;width:100%}.data-table th{color:#8a9ab4;text-transform:uppercase;letter-spacing:.35px;background:#f5f8fd;border-block:1px solid #e6edf8;height:38px;padding:0 10px;font-size:8px;font-weight:800}.data-table td{color:#526b93;border-bottom:1px solid #edf1f8;height:59px;padding:8px 10px;font-size:9px}.data-table tr:last-child td{border-bottom:0}.person-cell{align-items:center;gap:10px;min-width:160px;display:flex}.person-cell strong{color:var(--ink);font-size:9px}.person-cell small{color:var(--muted);margin-top:3px;font-size:7px;display:block}.status{border-radius:999px;justify-content:center;align-items:center;min-height:24px;padding:0 9px;font-size:8px;font-weight:800;display:inline-flex}.status--hadir,.status--tuntas,.status--selesai,.status--aktif{color:#0b9663;background:#e3f8ef}.status--izin,.status--terjadwal,.status--draf{color:#e48805;background:#fff4d9}.status--sakit{color:#0299ae;background:#e2f8fb}.status--terlambat,.status--alpha,.status--remedial{color:#df494d;background:#ffe9e9}.table-link{color:var(--blue);background:0 0;border:0;padding:0;font-size:8px;font-weight:800}.table-link:disabled,.table-icon-button:disabled{opacity:.45;cursor:not-allowed}.table-actions{align-items:center;gap:6px;display:inline-flex}.table-icon-button{width:29px;height:29px;color:var(--navy);cursor:pointer;background:#f8fbff;border:1px solid #dce7f8;border-radius:9px;place-items:center;transition:all .18s;display:inline-grid}.table-icon-button:not(:disabled):hover{color:var(--blue);background:#eef5ff;border-color:#a9c8fb;transform:translateY(-1px)}.donut--small{width:112px;height:112px;margin:4px auto 18px}.attendance-bars{gap:8px;display:grid}.attendance-bars>div{justify-content:space-between;align-items:center;font-size:9px;display:flex}.attendance-bars span{color:var(--muted);align-items:center;gap:8px;display:flex}.attendance-bars strong{color:var(--navy)}.qr-card{color:#fff;background:linear-gradient(145deg,#3a82ff,#125de7 70%);border-radius:22px;grid-template-columns:48px 1fr;align-items:center;gap:12px;padding:20px;display:grid;box-shadow:0 14px 28px #1769ff38}.qr-card>span{background:#ffffff2b;border-radius:15px;place-items:center;width:48px;height:48px;display:grid}.qr-card strong{font-size:12px}.qr-card p{color:#ffffffc7;margin:4px 0 0;font-size:8px;line-height:1.45}.qr-card button{min-height:36px;color:var(--blue);background:#fff;border:0;border-radius:11px;grid-column:1/-1;font-size:9px;font-weight:800}.recap-list{gap:9px;display:grid}.recap-list>button{text-align:left;background:#f7f9fd;border:0;border-radius:13px;grid-template-columns:38px 1fr auto;align-items:center;gap:9px;width:100%;padding:9px;display:grid}.recap-icon{width:36px;height:36px;color:var(--blue);background:#e6f0ff;border-radius:11px;place-items:center;display:grid}.recap-icon svg{width:18px}.recap-icon--gold{color:#e79a05;background:#fff2ca}.recap-icon--red{color:#e45055;background:#ffe6e7}.recap-list strong,.recap-list small{display:block}.recap-list strong{color:var(--ink);font-size:9px}.recap-list small{color:var(--muted);margin-top:3px;font-size:7px}.recap-list b{color:var(--blue);font-size:8px}.star-panel{margin-top:18px}.star-summary{background:linear-gradient(135deg,#fff8dc,#fff2ba);border-radius:15px;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;margin-bottom:14px;padding:13px 15px;display:grid}.star-summary>span{color:#eea000;background:#fff;border-radius:13px;place-items:center;width:40px;height:40px;display:grid;box-shadow:0 6px 13px #cd8e001f}.star-summary small,.star-summary strong{display:block}.star-summary small{color:#927327;font-size:8px}.star-summary strong{color:#7d5800;margin-top:3px;font-size:13px}.star-student-list{grid-template-columns:repeat(2,1fr);gap:9px;display:grid}.star-student{background:#fbfcff;border:1px solid #e6ecf6;border-radius:15px;grid-template-columns:38px 1fr auto auto;align-items:center;gap:9px;min-width:0;padding:10px;display:grid}.star-student__name{min-width:0}.star-student__name strong,.star-student__name small{display:block}.star-student__name strong{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:9px;overflow:hidden}.star-student__name small{color:var(--muted);margin-top:3px;font-size:7px}.star-count{color:#eba000;justify-content:center;align-items:center;gap:4px;min-width:42px;display:inline-flex}.star-count strong{color:#875e00;font-size:12px}.star-controls{gap:4px;display:flex}.star-controls button{color:#5d7398;background:#fff;border:1px solid #dce6f5;border-radius:9px;place-items:center;width:27px;height:27px;padding:0;display:grid}.star-controls button:last-child{color:#fff;border-color:var(--blue);background:var(--blue)}.preview-data-note{color:var(--muted);margin:12px 0 0;font-size:8px;line-height:1.5}.filter-strip{box-shadow:var(--shadow-soft);background:#fffc;border:1px solid #e0e9f7;border-radius:20px;grid-template-columns:1.2fr 1fr 1fr;gap:12px;margin-bottom:18px;padding:17px;display:grid}.filter-strip label>small{color:#8392aa;margin:0 0 6px 3px;font-size:8px;font-weight:700;display:block}.filter-strip label>span{height:40px;color:var(--blue);background:#fff;border:1px solid #dfe8f5;border-radius:12px;align-items:center;gap:8px;padding:0 10px;display:flex}.filter-strip label>span>strong{color:var(--navy);white-space:nowrap;font-size:9px}.filter-strip select{appearance:none;min-width:0;color:var(--ink);background:0 0;border:0;outline:0;flex:1;font-size:9px;font-weight:700}.filter-strip input{width:100%;min-width:0;color:var(--ink);font:inherit;background:0 0;border:0;outline:0;font-size:9px;font-weight:700}.summary-grid--four{grid-template-columns:repeat(4,1fr)}.summary-grid--five{grid-template-columns:repeat(5,1fr)}.score-card{min-height:105px;box-shadow:var(--shadow-soft);background:#ffffffeb;border:1px solid #e0e8f5;border-radius:19px;padding:18px}.score-card small,.score-card strong,.score-card>span{display:block}.score-card small{color:#7c8da8;font-size:8px;font-weight:700}.score-card strong{color:var(--navy);margin:8px 0 5px;font-size:25px;line-height:1}.score-card>span{color:var(--muted);font-size:8px}.trend{border-radius:999px;width:max-content;padding:4px 7px;font-weight:800}.trend--up{background:#e3f8ef;color:#0a9c67!important}.trend--warn{background:#fff3d7;color:#e28a0a!important}.subject-grid{grid-template-columns:minmax(0,1.45fr) minmax(300px,.7fr);align-items:start;gap:18px;display:grid}.score-table .progress{background:#e8eef7;border-radius:99px;min-width:95px;height:7px;overflow:hidden}.progress i{border-radius:inherit;background:linear-gradient(90deg,#64a0ff,#1769ff);height:100%;display:block}.score-value{color:var(--navy);font-size:13px}.journal-list{gap:8px;display:grid}.journal-list button{text-align:left;background:#f7f9fd;border:0;border-radius:13px;grid-template-columns:39px 1fr auto;align-items:center;gap:9px;width:100%;padding:9px;display:grid}.journal-list button>span:nth-child(2) strong,.journal-list button>span:nth-child(2) small{display:block}.journal-list button>span:nth-child(2) strong{color:var(--ink);font-size:9px}.journal-list button>span:nth-child(2) small{color:var(--muted);margin-top:3px;font-size:7px}.journal-date{color:#fff;text-align:center;background:linear-gradient(145deg,#4a8bff,#1769ff);border-radius:11px;place-content:center;width:38px;height:38px;display:grid}.journal-date strong{font-size:11px;line-height:1}.journal-date small{margin-top:2px;font-size:7px}.soft-button--wide{width:100%}.grade-workspace-grid{grid-template-columns:.8fr 1.2fr;align-items:start;gap:18px;margin-bottom:18px;display:grid}.grade-form{grid-template-columns:1fr 1fr;gap:11px;display:grid}.grade-form label>span{color:#7b8da9;margin:0 0 6px 3px;font-size:8px;font-weight:700;display:block}.grade-form input,.grade-form select{width:100%;height:39px;color:var(--ink);background:#f9fbff;border:1px solid #dfe7f4;border-radius:11px;outline:0;padding:0 11px;font-size:9px}.input-suffix{position:relative}.input-suffix input{padding-right:28px}.input-suffix>span{color:var(--muted);font-size:9px;font-weight:800;position:absolute;top:50%;right:11px;transform:translateY(-50%)}.grade-save{width:100%;margin-top:12px}.assignment-list{gap:8px;display:grid}.assignment-list>button{text-align:left;background:#f7f9fd;border:0;border-radius:13px;grid-template-columns:38px 1fr auto;align-items:center;gap:9px;width:100%;padding:9px;display:grid}.assignment-icon{width:36px;height:36px;color:var(--blue);background:#e6f0ff;border-radius:11px;place-items:center;display:grid}.assignment-list strong,.assignment-list small{display:block}.assignment-list strong{color:var(--ink);font-size:9px}.assignment-list small{color:var(--muted);margin-top:3px;font-size:7px}.assignment-meta{text-align:right}.assignment-meta small{margin-top:4px}.semester-panel{margin-bottom:18px}.semester-table{min-width:760px}.journal-panel-wide{margin-bottom:18px}.journal-list--wide{grid-template-columns:repeat(3,1fr)}.admin-preview-grid{grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px;display:grid}.admin-chip-list{flex-wrap:wrap;gap:9px;display:flex}.admin-chip-list button{color:#476893;background:#f7faff;border:1px solid #dfe8f6;border-radius:12px;align-items:center;gap:7px;min-height:38px;padding:0 12px;font-size:9px;font-weight:700;display:inline-flex}.admin-table{min-width:650px}.admin-table td:first-child strong{color:var(--blue)}.admin-security-note{color:var(--blue);background:#eef5ff;border-radius:14px;align-items:center;gap:10px;margin-top:15px;padding:13px;display:flex}.admin-security-note strong,.admin-security-note small{display:block}.admin-security-note strong{color:var(--navy);font-size:9px}.admin-security-note small{color:var(--muted);margin-top:3px;font-size:8px}.toast{z-index:100;max-width:calc(100% - 48px);color:var(--navy);background:#fff;border:1px solid #d9e6f8;border-radius:13px;padding:13px 17px;font-size:10px;font-weight:700;animation:.25s both toastIn;position:fixed;bottom:24px;right:24px;box-shadow:0 16px 38px #1e3c692e}@keyframes toastIn{0%{opacity:0;transform:translateY(12px)}}.mobile-nav,.scrim{display:none}@media (max-width:1180px){.sidebar{width:218px}.workspace{margin-left:218px}.dashboard-grid--top,.dashboard-grid--bottom{grid-template-columns:1fr 1fr}.dashboard-grid--top>:first-child,.dashboard-grid--bottom>:first-child{grid-row:span 2}.module-grid{grid-template-columns:repeat(3,1fr)}.hero{min-height:365px}.hero__content{width:64%}}@media (max-width:960px){.sidebar{width:88px;padding-inline:12px}.workspace{margin-left:88px}.sidebar .brand>span:last-child,.sidebar .nav-label,.sidebar .nav-item span,.sidebar__profile>div,.sidebar__profile>svg,.sidebar__footer{display:none}.sidebar__head{justify-content:center;padding-inline:0}.nav-item{justify-content:center;padding:0}.sidebar__profile{justify-content:center;padding:8px;display:flex}.school-switcher{flex:1;min-width:0}.hero__content{width:68%}.hero h1{font-size:39px}.summary-grid{grid-template-columns:repeat(2,1fr)}.summary-grid--page{grid-template-columns:repeat(3,1fr)}.summary-grid--four{grid-template-columns:repeat(4,1fr)}.summary-grid--five{grid-template-columns:repeat(5,1fr)}.page-grid,.subject-grid{grid-template-columns:1fr}.page-aside{grid-template-columns:1fr 1fr}}@media (max-width:720px){.notification-popover{width:auto;position:fixed;top:68px;left:12px;right:12px}.date-action{justify-content:center;width:100%}.page-intro__actions .date-action+.button{width:100%}body{background:#f2f7ff}.sidebar{width:min(84vw,300px);padding:22px 18px;transition:transform .25s;transform:translate(-105%)}.sidebar--open{transform:translate(0)}.sidebar .brand>span:last-child,.sidebar .nav-label,.sidebar .nav-item span,.sidebar__profile>div,.sidebar__profile>svg,.sidebar__footer{display:block}.sidebar .nav-item{justify-content:flex-start;padding:0 14px}.sidebar__profile{display:grid}.sidebar__head{justify-content:space-between;padding-inline:8px}.sidebar__close{box-shadow:none;background:#eff5ff;display:inline-grid!important}.scrim{z-index:35;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#071c414d;border:0;width:100%;height:100%;display:block;position:fixed;inset:0}.workspace{margin-left:0}.topbar{gap:9px;height:69px;padding:10px 14px}.mobile-menu{width:39px;height:39px;box-shadow:none;display:inline-grid}.brand--compact{display:flex}.brand--compact .brand__mark{width:29px;height:27px}.brand--compact .brand__mark i{width:15px;height:23px}.brand--compact .brand__mark:after{height:18px;top:5px;left:13px}.school-switcher{height:44px;box-shadow:none;border-radius:13px;padding:5px 8px}.school-switcher__icon,.school-switcher small,.school-switcher>svg{display:none}.school-switcher strong{font-size:9px}.topbar__actions{margin-left:0}.user-chip{display:none}.notification{width:39px;height:39px;box-shadow:none}.main-content{padding:16px 14px 91px}.hero{border-radius:23px;min-height:430px}.hero img{object-position:64% center}.hero__overlay{background:linear-gradient(#f2f9fffa 0%,#eff7ffeb 36%,#eff7ff2e 69%,#e7f2ff0f)}.hero__content{width:100%;padding:24px 21px}.hero__greeting{font-size:12px}.hero__content>p{font-size:10px}.hero h1{letter-spacing:-2px;width:92%;font-size:clamp(29px,9vw,38px)}.hero__meta{gap:8px;margin:0;position:absolute;bottom:16px;left:17px;right:17px}.hero__meta>span{background:#ffffffe0;flex:1;min-width:0;padding:8px}.hero__meta>span>svg{display:none}.hero__meta strong{font-size:8px}.summary-grid{gap:10px;margin-block:12px}.summary-card{border-radius:17px;gap:10px;min-height:83px;padding:12px}.summary-icon{border-radius:13px;width:40px;height:40px}.summary-card strong{font-size:21px}.summary-card div>span{font-size:8px}.dashboard-grid--top,.dashboard-grid--bottom{grid-template-columns:1fr;gap:12px}.dashboard-grid--top>:first-child,.dashboard-grid--bottom>:first-child{grid-row:auto}.panel{border-radius:19px;padding:17px}.module-grid{grid-template-columns:repeat(2,1fr);gap:9px}.module-card{min-height:120px}.dashboard-grid,.module-panel{margin-bottom:12px}.page{padding-top:2px}.page-intro{flex-direction:column;align-items:flex-start;margin-bottom:17px}.page-intro h1{font-size:28px}.page-intro__actions{width:100%}.page-intro__actions .button{flex:1}.summary-grid--page,.summary-grid--four,.summary-grid--five{scroll-snap-type:x mandatory;padding-bottom:5px;display:flex;overflow-x:auto}.metric-card,.score-card{scroll-snap-align:start;flex:0 0 75%;min-width:235px}.filter-strip,.page-aside{grid-template-columns:1fr}.table-toolbar{flex-direction:column;align-items:stretch}.search-box,.table-toolbar .button{width:100%}.data-table{min-width:620px}.score-table{min-width:560px}.admin-preview-grid,.star-student-list,.grade-workspace-grid,.journal-list--wide{grid-template-columns:1fr}.star-summary{grid-template-columns:40px 1fr}.star-summary .button{grid-column:1/-1}.grade-form{grid-template-columns:1fr}.mobile-nav{z-index:32;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffed;border:1px solid #d9e4f5e6;border-radius:19px;grid-template-columns:repeat(4,1fr);min-height:64px;padding:7px;display:grid;position:fixed;bottom:10px;left:12px;right:12px;box-shadow:0 14px 38px #223f6c33}.mobile-nav button{color:#7688a8;background:0 0;border:0;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:3px;font-size:8px;font-weight:700;display:flex}.mobile-nav button.active{color:var(--blue);background:#ebf3ff}.toast{max-width:calc(100% - 28px);bottom:88px;right:14px}}@media (max-width:390px){.school-switcher{display:none}.topbar__actions{margin-left:auto}.hero{min-height:406px}.hero__meta>span{min-height:50px}.summary-card{padding:10px}.summary-icon{width:36px;height:36px}.summary-icon svg{width:19px}.attendance-overview{gap:14px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}.app-loader{min-height:100vh;color:var(--navy);place-content:center;justify-items:center;gap:15px;display:grid}.app-loader span{border:4px solid #dbe9ff;border-top-color:var(--blue);border-radius:50%;width:42px;height:42px;animation:.8s linear infinite spin}.app-loader strong{font-size:13px}.page-loader{min-height:55vh;color:var(--muted);place-content:center;justify-items:center;gap:10px;display:grid}.page-loader span{border:3px solid #dce9fb;border-top-color:var(--blue);border-radius:50%;width:30px;height:30px;animation:.8s linear infinite spin}.page-loader strong{font-size:9px}@keyframes spin{to{transform:rotate(360deg)}}.login-page{grid-template-columns:minmax(0,1.15fr) minmax(390px,.85fr);gap:24px;min-height:100vh;padding:24px;display:grid}.login-visual{min-height:calc(100vh - 48px);box-shadow:var(--shadow);isolation:isolate;background:linear-gradient(145deg,#f0f7ff,#dbeaff);border-radius:32px;padding:34px;position:relative;overflow:hidden}.login-visual:after{content:"";z-index:-1;background:linear-gradient(100deg,#f1f8fffc,#ecf6ffbf 52%,#0000 75%);position:absolute;inset:0}.login-visual>img{z-index:-2;object-fit:cover;object-position:62% center;width:100%;height:100%;position:absolute;inset:0}.login-visual__copy{z-index:1;width:min(540px,69%);margin-top:clamp(110px,18vh,190px);position:relative}.login-visual__copy>span{color:var(--blue);align-items:center;gap:8px;font-size:12px;font-weight:800;display:inline-flex}.login-visual__copy h1{color:var(--navy);letter-spacing:-3.6px;margin:17px 0 15px;font-size:clamp(38px,4.7vw,67px);line-height:1.02}.login-visual__copy p{color:#557199;max-width:480px;font-size:12px;line-height:1.7}.login-panel{place-items:center;display:grid}.login-card{background:#fffffff0;border:1px solid #dce8f7;border-radius:30px;width:min(100%,470px);padding:clamp(27px,4vw,46px);box-shadow:0 24px 60px #1c457e21}.login-icon{width:58px;height:58px;color:var(--blue);background:#e8f1ff;border-radius:19px;place-items:center;display:grid}.login-card h2{color:var(--navy);letter-spacing:-1px;margin:20px 0 8px;font-size:27px}.login-card>p{color:var(--muted);margin:0 0 21px;font-size:11px;line-height:1.6}.demo-banner{color:#0d7f5c;background:#e6f8f1;border-radius:14px;align-items:center;gap:10px;margin-bottom:17px;padding:12px;display:flex}.demo-banner strong,.demo-banner small{display:block}.demo-banner strong{font-size:10px}.demo-banner small{color:#5c8c7b;margin-top:3px;font-size:8px}.login-form{gap:12px;display:grid}.login-form label>span,.form-field>span{color:#617696;margin:0 0 7px 3px;font-size:9px;font-weight:800;display:block}.login-form input,.form-field input,.form-field select,.form-field textarea,.standalone-select{width:100%;min-height:43px;color:var(--ink);background:#f9fbff;border:1px solid #dce6f4;border-radius:12px;outline:0;padding:0 12px;font-size:10px}.form-field textarea{resize:vertical;min-height:91px;padding-block:11px}.form-field small{color:var(--muted);margin:5px 3px 0;font-size:8px;line-height:1.45;display:block}.login-submit{width:100%;min-height:45px;margin-top:4px}.form-error{color:#c53743;background:#fff0f1;border-radius:10px;margin:0;padding:9px 11px;font-size:9px;line-height:1.45}.demo-roles{border-top:1px solid #e6edf7;grid-template-columns:1fr;gap:8px;margin-top:21px;padding-top:18px;display:grid}.demo-roles button{color:var(--blue);text-align:left;background:#f7faff;border:1px solid #e0e9f6;border-radius:13px;grid-template-columns:32px 1fr;align-items:center;gap:9px;padding:10px;display:grid}.demo-roles strong,.demo-roles small{display:block}.demo-roles strong{color:var(--ink);font-size:9px}.demo-roles small{color:var(--muted);margin-top:3px;font-size:7px}.demo-mode-bar{color:#7d5a00;background:#fff4cb;border-bottom:1px solid #f1df9e;justify-content:center;align-items:center;gap:7px;min-height:31px;padding:6px clamp(20px,3vw,46px);font-size:8px;font-weight:700;display:flex}.data-error-bar{color:#9d2222;background:#fff0f0;border-bottom:1px solid #f4caca;justify-content:center;align-items:center;gap:10px;min-height:35px;padding:7px clamp(20px,3vw,46px);font-size:9px;font-weight:750;display:flex}.data-error-bar button{width:25px;height:25px;color:inherit;cursor:pointer;background:#9d222214;border:0;border-radius:50%;place-items:center;display:grid}.top-demo-chip{color:#9a6a00;background:#fff0b5;border-radius:999px;padding:5px 8px;font-size:8px;font-weight:800}.sidebar-logout{color:#6d809e;background:0 0;border:0;border-radius:11px;align-items:center;gap:8px;width:100%;min-height:37px;margin-top:8px;padding:0 11px;font-size:9px;font-weight:700;display:flex}.sidebar-logout:hover{color:#df4a50;background:#fff0f1}.modal-layer{z-index:200;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-scrim{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#071d446b;border:0;width:100%;height:100%;position:absolute;inset:0}.modal{background:#fff;border:1px solid #dce7f7;border-radius:24px;width:min(100%,540px);max-height:calc(100vh - 40px);animation:.22s both modalIn;position:relative;overflow:auto;box-shadow:0 30px 80px #082a7540}@keyframes modalIn{0%{opacity:0;transform:translateY(10px)scale(.98)}}.modal__header{z-index:2;background:#fffffff5;border-bottom:1px solid #e8eef7;justify-content:space-between;gap:12px;padding:20px 21px 15px;display:flex;position:sticky;top:0}.modal__header h2{color:var(--navy);margin:0;font-size:17px}.modal__header p{color:var(--muted);margin:5px 0 0;font-size:9px;line-height:1.5}.modal__header .icon-button{width:35px;height:35px;box-shadow:none;background:#f1f5fb}.modal__body{padding:20px 21px 22px}.modal-form{grid-template-columns:1fr 1fr;gap:13px;display:grid}:is(.modal-form .button,.modal-form .form-field:has(textarea)){grid-column:1/-1}.modal-form .button{margin-top:3px}.photo-upload{background:#f7faff;border:1px solid #dce7f6;border-radius:16px;grid-column:1/-1;align-items:center;gap:13px;padding:12px;display:flex}.photo-upload .student-avatar{border-radius:20px;width:66px;height:66px;font-size:14px}.photo-upload>div{gap:5px;display:grid}.photo-upload label{cursor:pointer;width:max-content;margin:0}.photo-upload input[type=file]{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;overflow:hidden}.photo-upload small{color:var(--muted);font-size:8px}.profile-photo-form{grid-template-columns:1fr}.photo-message{color:#315d9c;background:#edf5ff;border-radius:11px;grid-column:1/-1;margin:0;padding:9px 11px;font-size:9px}.panel-action-button{color:var(--blue);cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;font-size:10px;font-weight:800;display:inline-flex}.timeline__button{width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;grid-template-columns:40px 10px 1fr 18px;padding:3px 0}.timeline__button>svg{color:#b7c4d7}.timeline__button:hover strong{color:var(--blue)}.timeline__button.is-complete{opacity:.58}.timeline__button.is-complete strong{text-decoration:line-through}.timeline__button.is-complete>svg{color:#18a875}.empty-inline{color:#8292aa;text-align:left;background:#f8fbff;border:1px dashed #d7e3f4;border-radius:14px;justify-content:center;align-items:center;gap:10px;min-height:74px;padding:12px;display:flex}.empty-inline span,.empty-inline strong,.empty-inline small{display:block}.empty-inline strong{color:var(--ink);font-size:10px}.empty-inline small{margin-top:3px;font-size:8px}.notification-wrap{position:relative}.notification-popover{z-index:80;background:#fffffffa;border:1px solid #dce6f4;border-radius:20px;width:min(360px,100vw - 28px);position:absolute;top:calc(100% + 12px);right:0;overflow:hidden;box-shadow:0 22px 60px #12305a33}.notification-popover__head{border-bottom:1px solid #e8eef7;justify-content:space-between;align-items:center;gap:10px;padding:15px 16px 12px;display:flex}.notification-popover__head span,.notification-popover__head strong,.notification-popover__head small{display:block}.notification-popover__head strong{color:var(--navy);font-size:12px}.notification-popover__head small{color:var(--muted);margin-top:2px;font-size:8px}.notification-popover__head button{color:var(--blue);cursor:pointer;background:#edf4ff;border:0;border-radius:9px;padding:6px 9px;font-size:8px;font-weight:800}.notification-list{max-height:370px;overflow:auto}.notification-list>button{width:100%;color:inherit;text-align:left;cursor:pointer;background:#f8fbff;border:0;border-bottom:1px solid #edf1f7;grid-template-columns:8px 1fr;gap:10px;padding:12px 15px;display:grid}.notification-list>button>i{background:var(--blue);border-radius:50%;width:7px;height:7px;margin-top:4px}.notification-list>button.is-read>i{background:#cbd5e3}.notification-list span,.notification-list strong,.notification-list small{display:block}.notification-list strong{color:var(--ink);font-size:10px}.notification-list small{color:var(--muted);margin-top:3px;font-size:8px}.notification-empty{color:#8a9ab0;align-content:center;place-items:center;gap:8px;min-height:130px;font-size:10px;display:grid}.teacher-assignment-cell{flex-wrap:wrap;gap:5px;min-width:210px;display:flex}.teacher-assignment-cell>span{width:100%;color:var(--ink);font-size:9px}.teacher-assignment-cell>button{color:#5c6e89;cursor:pointer;background:#f8fbff;border:1px solid #dce7f7;border-radius:8px;align-items:center;gap:4px;padding:5px 7px;font-size:7px;font-weight:800;display:inline-flex}.teacher-assignment-cell>button:hover{color:#d33d48;background:#fff2f3;border-color:#ffd2d5}.date-action{height:40px;color:var(--blue);box-shadow:var(--shadow-soft);background:#fff;border:1px solid #dce6f4;border-radius:12px;align-items:center;gap:7px;padding:0 11px;display:inline-flex}.date-action input{color:var(--ink);background:0 0;border:0;outline:0;font-size:10px;font-weight:700}.date-time-cell{color:var(--muted);white-space:nowrap;align-items:center;gap:5px;display:inline-flex}.filter-strip--compact{grid-template-columns:minmax(210px,330px) minmax(260px,1fr);align-items:end}.search-box--filter{align-self:end;width:100%}.admin-chip-list>span{color:#476893;background:#f7faff;border:1px solid #dfe8f6;border-radius:12px;align-items:center;gap:7px;min-height:38px;padding:0 12px;font-size:9px;font-weight:700;display:inline-flex}.admin-chip-list>span small{color:#94a2b7;font-size:7px}.locked-chip{color:#7c8daa;background:#eff3f8;border-radius:999px;align-items:center;gap:5px;padding:6px 9px;font-size:8px;font-weight:800;display:inline-flex}.admin-helper{color:var(--muted);margin:13px 0 0;font-size:8px;line-height:1.55}.maintenance-panel{margin-top:18px}.table-link{align-items:center;gap:5px;display:inline-flex}.student-qr{text-align:center;justify-items:center;display:grid}.student-qr img{border:1px solid #e0e9f6;border-radius:18px;width:min(100%,280px)}.student-qr strong{color:var(--navy);margin-top:9px;font-size:14px}.student-qr span{color:var(--muted);margin:4px 0 13px;font-size:9px}.empty-state{color:#9aabc3;text-align:center;place-content:center;place-items:center;min-height:180px;padding:25px;display:grid}.empty-state svg{color:#aac4ec;width:40px;height:40px;margin-bottom:9px}.empty-state strong{color:var(--navy);font-size:11px}.empty-state p{margin:5px 0 0;font-size:8px}.empty-state--small{min-height:100px}.empty-state--small svg{width:30px;height:30px}.empty-state--illustrated img{width:min(100%,260px);margin-bottom:7px}.attendance-layout{grid-template-columns:minmax(310px,.62fr) minmax(0,1.38fr);align-items:start;gap:18px;display:grid}.qr-reader{background:#f5f9ff;border:2px dashed #cbdcf4;border-radius:18px;place-items:center;min-height:330px;display:grid;overflow:hidden}.qr-reader>div:not([id]){color:#91a5c5;text-align:center;justify-items:center;padding:25px;display:grid}.qr-reader>div:not([id]) strong{color:var(--navy);margin-top:10px;font-size:11px}.qr-reader p{max-width:230px;margin:5px 0;font-size:8px;line-height:1.5}.qr-reader video{object-fit:cover;border-radius:15px}.qr-reader img[alt=Info\ icon]{display:none}.scan-note{color:#15916a;background:#e8f8f2;border-radius:12px;align-items:center;gap:9px;margin-top:12px;padding:11px;display:flex}.scan-note strong,.scan-note small{display:block}.scan-note strong{font-size:9px}.scan-note small{color:#679686;margin-top:3px;font-size:7px}.attendance-student-list{gap:7px;display:grid}.attendance-student-list>div{border:1px solid #e7edf7;border-radius:13px;grid-template-columns:36px minmax(110px,1fr) auto 105px;align-items:center;gap:9px;min-width:0;padding:8px 9px;display:grid}.attendance-student-list strong,.attendance-student-list small{display:block}.attendance-student-list strong{color:var(--ink);font-size:9px}.attendance-student-list small{color:var(--muted);margin-top:3px;font-size:7px}.attendance-student-list select{width:100%;height:32px;color:var(--ink);background:#fff;border:1px solid #dce6f4;border-radius:9px;padding:0 7px;font-size:8px}.attendance-score--0{border-top:3px solid #20b581}.attendance-score--1{border-top:3px solid #f0a11d}.attendance-score--2{border-top:3px solid #19aac1}.attendance-score--3{border-top:3px solid #7d67d9}.attendance-score--4{border-top:3px solid #e6555b}.inline-stars{align-items:center;gap:5px;min-width:120px;display:inline-flex}.inline-stars>span{color:#d99100;align-items:center;gap:4px;min-width:47px;font-weight:800;display:inline-flex}.inline-stars button{color:#697f9f;background:#fff;border:1px solid #dce6f4;border-radius:8px;place-items:center;width:27px;height:27px;padding:0;display:grid}.inline-stars button:last-child{color:#fff;border-color:var(--blue);background:var(--blue)}.qr-card--button{text-align:left;border:0;width:100%}.qr-card--button b{min-height:35px;color:var(--blue);background:#fff;border-radius:10px;grid-column:1/-1;place-items:center;font-size:9px;display:grid}.records-panel{margin-top:18px}.record-columns{grid-template-columns:1fr 1fr;gap:14px;display:grid}.record-columns>div{background:#f7faff;border-radius:16px;padding:14px}.record-columns h3{color:var(--navy);align-items:center;gap:7px;margin:0 0 11px;font-size:10px;display:flex}.record-columns article{background:#fff;border:1px solid #e6edf7;border-radius:11px;padding:10px}.record-columns article+article{margin-top:7px}.record-columns strong,.record-columns span,.record-columns small{display:block}.record-columns strong{color:var(--navy);font-size:9px}.record-columns span{color:#49678f;margin-top:4px;font-size:8px}.record-columns small{color:var(--muted);margin-top:5px;font-size:7px}.assignment-row,.journal-row{text-align:left;background:#f7f9fd;border-radius:13px;grid-template-columns:38px 1fr auto;align-items:center;gap:9px;width:100%;padding:9px;display:grid}.assignment-row strong,.assignment-row small,.journal-row strong,.journal-row small{display:block}.assignment-row strong,.journal-row strong{color:var(--ink);font-size:9px}.assignment-row small,.journal-row small{color:var(--muted);margin-top:3px;font-size:7px}.score-entry-form{grid-template-columns:1fr}.score-entry-form>label{border:1px solid #e5ecf7;border-radius:12px;grid-template-columns:1fr 90px;align-items:center;gap:10px;padding:7px 9px;display:grid}.score-entry-form>label>span{align-items:center;gap:8px;display:flex}.score-entry-form>label strong{color:var(--ink);font-size:9px}.score-entry-form input{width:100%;min-height:37px;color:var(--navy);border:1px solid #dce6f4;border-radius:9px;padding:0 8px;font-size:10px;font-weight:800}@media (max-width:960px){.login-page{grid-template-columns:1fr}.login-visual{min-height:430px}.login-panel{padding-block:18px}.attendance-layout{grid-template-columns:1fr}.scanner-panel{order:2}}@media (max-width:720px){.login-page{gap:12px;padding:12px}.login-visual{border-radius:24px;min-height:390px;padding:23px}.login-visual__copy{width:86%;margin-top:75px}.login-visual__copy h1{letter-spacing:-2px;font-size:37px}.login-visual__copy p{font-size:10px}.login-card{border-radius:23px;padding:24px 20px}.demo-mode-bar{text-align:center;padding-inline:13px}.top-demo-chip{display:none}.mobile-nav{grid-template-columns:repeat(var(--mobile-items),1fr)}.filter-strip--compact{grid-template-columns:1fr}.modal-layer{align-items:end;padding:9px}.modal{border-radius:23px 23px 15px 15px;max-height:92vh}.modal-form{grid-template-columns:1fr}.modal-form .form-field{grid-column:1}.attendance-student-list>div{grid-template-columns:36px 1fr auto}.attendance-student-list select{grid-column:2/-1}.record-columns{grid-template-columns:1fr}.qr-reader{min-height:290px}}@media print{body *{visibility:hidden}.modal-layer,.modal-layer *{visibility:visible}.modal-layer{position:static}.modal-scrim,.modal__header,.student-qr .button{display:none}.modal{box-shadow:none;border:0}.student-qr img{width:320px}}:root{color:#3b2925;--blue:#62a9d5;--blue-dark:#3f89b9;--navy:#3b2925;--ink:#3b2925;--muted:#76675f;--line:#4b342e;--surface:#fffaf0;--ice:#fff5de;--paper:#fff8e6;--cream:#f5e6c8;--coral:#f4635f;--sun:#facb4f;--leaf:#9ccc63;--pink:#e981ad;--orange:#f49a49;--sketch-shadow:3px 4px 0 #4b342e33;--shadow:var(--sketch-shadow);--shadow-soft:2px 3px 0 #4b342e24;background:#f1dfc2}body{background-color:#f0dec0;background-image:linear-gradient(#5b403309 1px,#0000 1px),linear-gradient(90deg,#5b403309 1px,#0000 1px);background-size:24px 24px}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:3px;outline:3px solid #62a9d561}.app-shell{background:var(--paper)}.sidebar{border:0;border-right:3px solid var(--line);-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff6df;width:230px;padding:22px 16px 18px;box-shadow:7px 0 #7e574321}.workspace{margin-left:230px}.sidebar__head{padding:0 7px 24px}.brand{color:var(--ink);letter-spacing:1px;gap:9px;font-family:Patrick Hand,cursive;font-size:25px}.brand>span:last-child>span{color:var(--ink)}.brand__mark{filter:none}.brand__mark i{background:var(--coral);border:2px solid var(--line);border-radius:2px}.brand__mark i:last-child{background:var(--blue)}.brand__mark:after{background:var(--line)}.nav-label{color:var(--ink);letter-spacing:.7px;margin:0 10px 8px;font-family:Patrick Hand,cursive;font-size:12px}.nav-label:after{content:"";border-bottom:2px dashed var(--line);width:68px;margin-top:4px;display:block}.nav-list{gap:8px}.nav-item{height:42px;color:var(--ink);border:2px solid var(--line);background:#fffaf0;border-radius:3px;padding:0 13px;font-family:Patrick Hand,cursive;font-size:15px;font-weight:400;transform:rotate(-.25deg);box-shadow:2px 2px #4b342e29}.nav-list .nav-item:nth-child(6n+1){background:#f8ce50}.nav-list .nav-item:nth-child(6n+2){background:#9dcd67}.nav-list .nav-item:nth-child(6n+3){background:#69acd4}.nav-list .nav-item:nth-child(6n+4){background:#f26460}.nav-list .nav-item:nth-child(6n+5){background:#f3a04c}.nav-list .nav-item:nth-child(6n+6){background:#e985af}.nav-list--muted .nav-item{height:39px}.nav-item:hover{color:var(--ink);filter:brightness(1.04);transform:translate(2px,-1px)rotate(.2deg)}.nav-item--active,.nav-item--active:hover{color:var(--ink);border-color:var(--line);box-shadow:3px 4px #4b342e47;background:var(--sun)!important}.nav-item--active:after{content:"★";margin-left:auto;font-size:18px}.sidebar__profile{background:var(--paper);border:2px solid var(--line);box-shadow:var(--shadow-soft);border-radius:4px;padding:10px}.sidebar__profile strong,.sidebar__footer span{color:var(--ink)}.sidebar__profile span,.sidebar__footer small{color:var(--muted)}.sidebar-logout{color:var(--ink);border:2px solid var(--line);background:var(--paper);border-radius:3px;margin-top:10px;font-family:Patrick Hand,cursive;font-size:13px}.avatar--teacher,.student-avatar{color:var(--ink);background:var(--blue);border:2px solid var(--line);box-shadow:none}.topbar{border-bottom:3px solid var(--line);-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff8e6f5;height:78px;padding:12px clamp(18px,2.8vw,42px)}.school-switcher,.user-chip,.icon-button{color:var(--ink);background:var(--paper);border:2px solid var(--line);box-shadow:var(--shadow-soft);border-radius:4px}.school-switcher{min-width:360px}.school-switcher__icon{color:var(--ink);background:var(--sun);border:2px solid var(--line);border-radius:50%}.school-switcher small,.user-chip small{color:var(--muted)}.school-switcher strong,.user-chip strong{color:var(--ink)}.notification>span{background:var(--coral);border-color:var(--paper)}.top-demo-chip{color:var(--ink);background:var(--sun);border:1.5px solid var(--line);border-radius:3px}.main-content{background:var(--paper);padding-top:30px}.page-enter{animation:.32s both pageIn}.hero{border:3px solid var(--line);background:#d7edf0;border-radius:5px;min-height:374px;box-shadow:6px 7px #4b342e33}.hero:before{content:"KELASKU";z-index:3;color:var(--ink);background:var(--sun);border:2px solid var(--line);padding:7px 18px 5px;font-family:Patrick Hand,cursive;font-size:14px;position:absolute;top:22px;right:28px;transform:rotate(1.5deg)}.hero img{object-position:center}.hero__overlay{background:linear-gradient(90deg,#fff8e6fc 0%,#fff8e6f0 34%,#fff8e64d 61%,#0000 78%)}.hero__content{width:58%}.hero__greeting,.eyebrow{width:max-content;color:var(--ink);background:var(--coral);border:2px solid var(--line);padding:5px 13px 3px;font-family:Patrick Hand,cursive;font-size:14px;font-weight:400;transform:rotate(-1deg)}.hero__content>p{color:var(--ink);font-family:Patrick Hand,cursive;font-size:16px}.hero h1,.page-intro h1,.login-visual__copy h1{color:var(--ink);letter-spacing:1.3px;font-family:Bangers,Impact,sans-serif;font-weight:400}.hero h1{font-size:clamp(38px,4vw,59px);line-height:.96}.hero__meta>span{color:var(--ink);background:var(--paper);border:2px solid var(--line);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:3px}.hero__meta>span:first-child{border-top:8px solid var(--sun)}.hero__meta>span:last-child{border-top:8px solid var(--leaf)}.hero__meta small{color:var(--muted)}.hero__meta strong{color:var(--ink)}.summary-grid{gap:16px;margin:22px 0}.summary-card,.metric-card,.score-card{color:var(--ink);background:var(--paper);border:2px solid var(--line);box-shadow:var(--shadow-soft);border-radius:4px;position:relative}.summary-card:nth-child(4n+1),.metric-card:nth-child(4n+1),.score-card:nth-child(4n+1){background:#69acd4}.summary-card:nth-child(4n+2),.metric-card:nth-child(4n+2),.score-card:nth-child(4n+2){background:#9dcd67}.summary-card:nth-child(4n+3),.metric-card:nth-child(4n+3),.score-card:nth-child(4n+3){background:#f4a04c}.summary-card:nth-child(4n),.metric-card:nth-child(4n),.score-card:nth-child(4n){background:#e985af}.summary-card strong,.summary-card div>span,.metric-card strong,.metric-card span,.score-card strong,.score-card span{color:var(--ink)}.summary-icon,.summary-icon.blue,.summary-icon.cyan,.summary-icon.orange,.summary-icon.purple{color:var(--ink);background:var(--paper);border:2px solid var(--line);border-radius:50%}.panel{color:var(--ink);border:2px solid var(--line);box-shadow:var(--sketch-shadow);background:#fffdf7;border-radius:4px;padding:21px;position:relative}.panel:after{content:"";pointer-events:none;background:#d1b17c80;width:48px;height:17px;position:absolute;top:-10px;right:22px;transform:rotate(3deg)}.panel__header{margin-bottom:17px}.panel__header h2{color:var(--ink);background:var(--blue);border:2px solid var(--line);letter-spacing:.2px;margin-top:-32px;padding:6px 13px 4px;font-family:Patrick Hand,cursive;font-size:16px;font-weight:400;display:inline-block;transform:rotate(-.6deg)}.dashboard-grid>.panel:nth-child(2) .panel__header h2{background:var(--leaf)}.dashboard-grid>.panel:nth-child(3) .panel__header h2{background:var(--coral)}.panel__header p{color:var(--muted);font-size:9px}.panel__more,.text-link,.panel-action-button{color:var(--ink)}.panel__more{background:var(--paper)}.button,.soft-button,.date-action{color:var(--ink);background:var(--sun);border:2px solid var(--line);border-radius:3px;font-family:Patrick Hand,cursive;font-size:13px;font-weight:400;box-shadow:2px 2px #4b342e2b}.button:hover,.soft-button:hover{transform:translate(-1px,-1px);box-shadow:4px 4px #4b342e33}.button--primary{color:var(--ink);background:var(--coral)}.button--ghost{color:var(--ink);background:var(--paper);border-color:var(--line)}.button--soft{color:var(--ink);background:var(--blue)}.donut{background:conic-gradient(var(--blue-dark) 0 var(--attendance-value,0deg), #ead9bc var(--attendance-value,0deg) 360deg);box-shadow:none;border:2px solid var(--line)}.donut:after{background:var(--paper);box-shadow:none;border:2px solid var(--line)}.donut strong,.legend span,.timeline__time{color:var(--ink)}.dot{border:1px solid var(--line)}.timeline__item:not(:last-child):after{background:var(--line)}.timeline__item>i{background:var(--coral);box-shadow:0 0 0 3px var(--paper);border:1px solid var(--line)}.note-item:hover,.assignment-list>button,.assignment-row,.journal-row{background:var(--cream)}.note-icon{border:1.5px solid var(--line);border-radius:50%;color:var(--ink)!important}.module-panel{padding-top:27px}.module-grid{gap:14px}.module-card{background:var(--paper);border:2px solid var(--line);border-radius:4px;min-height:122px;box-shadow:2px 3px #4b342e24}.module-card:nth-child(5n+1){background:#69acd4}.module-card:nth-child(5n+2){background:#f8ce50}.module-card:nth-child(5n+3){background:#f4a04c}.module-card:nth-child(5n+4){background:#e985af}.module-card:nth-child(5n){background:#9dcd67}.module-card:hover{border-color:var(--line);transform:translate(-2px,-2px)rotate(.4deg);box-shadow:5px 6px #4b342e33}.module-card__icon,.module-card__icon.blue,.module-card__icon.indigo,.module-card__icon.orange,.module-card__icon.yellow,.module-card__icon.purple{color:var(--ink);background:var(--paper);border:2px solid var(--line);box-shadow:none;border-radius:50%}.module-card strong,.module-card small{color:var(--ink)}.trust-card,.record-columns>div{background:var(--cream);border:1.5px dashed var(--line);border-radius:3px}.trust-card>span,.trust-card__star{border:1.5px solid var(--line);border-radius:50%;color:var(--ink)!important;background:var(--sun)!important}.mini-chart{border-color:var(--line);background:repeating-linear-gradient(0deg,#0000 0 28px,#4b342e21 29px)}.mini-chart span,.mini-chart span i,.mini-chart b{background:var(--blue-dark)}.mini-chart span i{border-color:var(--paper)}.page-intro{margin-bottom:28px}.eyebrow{display:inline-block}.page-intro h1{margin-top:12px;font-size:clamp(34px,3.7vw,50px)}.page-intro p{color:var(--muted);font-size:12px}.filter-strip,.table-card,.attendance-layout>.panel{border-color:var(--line)}.search-box,.grade-form input,.grade-form select,.login-form input,.form-field input,.form-field select,.form-field textarea,.standalone-select,.attendance-student-list select{color:var(--ink);border:1.8px solid var(--line);background:#fffdf7;border-radius:3px}.form-field>span,.login-form label>span,.grade-form label>span{color:var(--ink);font-family:Patrick Hand,cursive;font-size:13px;font-weight:400}.table-wrap{border-color:var(--line)}.data-table thead,.score-table thead{background:var(--cream)}.data-table th,.score-table th{color:var(--ink);border-bottom-color:var(--line);font-family:Patrick Hand,cursive;font-size:12px}.data-table td,.score-table td{color:var(--ink);border-bottom-color:#4b342e38}.data-table tbody tr:hover,.score-table tbody tr:hover{background:#fff2ce}.status,.locked-chip{color:var(--ink);border:1.5px solid var(--line);border-radius:3px}.table-action,.inline-stars button,.teacher-assignment-cell>button{color:var(--ink);background:var(--paper);border-color:var(--line);border-radius:3px}.empty-inline,.empty-state,.qr-reader{color:var(--muted);background:var(--cream);border-color:var(--line);border-radius:3px}.qr-reader{border-width:2px}.scan-note,.admin-security-note{color:var(--ink);background:var(--leaf);border:1.5px solid var(--line);border-radius:3px}.notification-popover,.modal,.login-card{color:var(--ink);background:var(--paper);border:2px solid var(--line);border-radius:5px;box-shadow:6px 7px #4b342e33}.notification-popover__head,.modal__header{background:var(--paper);border-bottom-color:var(--line)}.notification-popover__head strong,.modal__header h2{color:var(--ink);letter-spacing:.8px;font-family:Bangers,Impact,sans-serif;font-weight:400}.notification-list>button{color:var(--ink);background:#fffdf7;border-bottom-color:#4b342e33}.notification-list>button:hover{background:#fff1c9}.notification-list>button.is-read{background:var(--paper)}.notification-list>button>i{background:var(--coral)}.modal-scrim{background:#3b292585}.login-page{background:var(--paper)}.login-visual{background:var(--cream);border:3px solid var(--line);border-radius:5px;box-shadow:6px 7px #4b342e33}.login-visual:after{background:linear-gradient(100deg,#fff8e6fc,#fff8e6cc 54%,#0000 78%)}.login-visual__copy>span{color:var(--ink);background:var(--sun);border:2px solid var(--line);padding:5px 10px}.login-visual__copy p,.login-card>p{color:var(--muted)}.login-icon{color:var(--ink);background:var(--blue);border:2px solid var(--line);border-radius:50%}.login-card h2{color:var(--ink);letter-spacing:1px;font-family:Bangers,Impact,sans-serif;font-weight:400}.demo-banner{color:var(--ink);background:var(--leaf);border:1.5px solid var(--line);border-radius:3px}.demo-roles button{color:var(--ink);background:var(--cream);border-color:var(--line);border-radius:3px}.mobile-nav{border:2px solid var(--line);-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff8e6f7;border-radius:5px;box-shadow:4px 5px #4b342e33}.mobile-nav button{color:var(--ink);border-radius:3px;font-family:Patrick Hand,cursive;font-size:11px}.mobile-nav button.active{color:var(--ink);background:var(--sun);border:1.5px solid var(--line)}.toast{color:var(--ink);background:var(--sun);border:2px solid var(--line);box-shadow:var(--sketch-shadow);border-radius:3px}@media (max-width:1180px){.sidebar{width:210px}.workspace{margin-left:210px}}@media (max-width:960px){.sidebar{width:86px}.workspace{margin-left:86px}.nav-item--active:after{display:none}}@media (max-width:720px){body,.app-shell,.main-content{background:var(--paper)}.sidebar{border-right-width:3px;width:min(86vw,310px)}.workspace{margin-left:0}.topbar{height:70px;padding:9px 12px}.school-switcher{border-width:1.5px;min-width:0}.main-content{padding-top:18px}.hero{border-radius:4px;min-height:440px}.hero:before{top:auto;bottom:118px;right:14px}.hero__overlay{background:linear-gradient(#fff8e6fc 0%,#fff8e6eb 39%,#fff8e61f 70%)}.hero__content{padding:22px 18px}.hero__greeting,.hero__content>p{font-size:13px}.hero h1{letter-spacing:1px;font-size:clamp(34px,10vw,44px)}.hero__meta>span{background:#fff8e6f0}.summary-grid{gap:9px}.summary-card{border-radius:3px}.panel{border-radius:3px;padding:18px}.panel__header h2{margin-top:-29px}.module-grid{gap:10px}.module-card{min-height:126px}.page-intro h1{font-size:38px}.notification-popover{top:69px}.modal{border-radius:5px}.login-page{padding:10px}.login-visual,.login-card{border-radius:4px}}.attendance-flow{gap:22px;margin-bottom:22px;display:grid}.scanner-panel--primary{width:100%;padding-inline:clamp(20px,5vw,72px)}.scanner-panel--primary .panel__header{text-align:center;justify-content:center}.scanner-panel--primary .panel__header>div{justify-items:center;display:grid}.scanner-panel--primary .qr-reader{width:min(100%,760px);min-height:410px;margin-inline:auto}.scanner-panel--primary .scan-note,.scanner-panel--primary .form-error{width:min(100%,760px);margin-inline:auto}.attendance-summary{margin-top:0;margin-bottom:22px}@media (max-width:720px){.attendance-flow{gap:18px;margin-bottom:18px}.scanner-panel--primary{padding-inline:16px}.scanner-panel--primary .qr-reader{min-height:320px}.attendance-summary{margin-bottom:18px}}