:root{--green:#075c4b;--green2:#0d8069;--mint:#e8f5f0;--gold:#d3a93b;--ink:#16332d;--muted:#687b76;--line:#dbe7e3;--bg:#f5f8f7;--white:#fff;--red:#b54040;--shadow:0 14px 40px #18483a18}*{box-sizing:border-box}body{margin:0;font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer}.login-page{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;background:#fff}.brand-panel{padding:clamp(40px,8vw,110px);display:flex;flex-direction:column;justify-content:center;color:white;background:radial-gradient(circle at 80% 10%,#25a58755,transparent 28%),linear-gradient(145deg,#064638,#08715d);position:relative;overflow:hidden}.brand-panel:after{content:"۞";position:absolute;right:-60px;bottom:-130px;font-size:430px;color:#fff08}.mark,.mini-mark{display:grid;place-items:center;border:1px solid #ffffff55;background:#ffffff16}.mark{width:68px;height:68px;border-radius:22px;font:40px serif;margin-bottom:26px}.brand-panel h1{font-size:clamp(42px,6vw,70px);line-height:1;margin:8px 0 20px}.brand-panel>p:not(.eyebrow){max-width:560px;font-size:18px;color:#dceee9}.eyebrow{margin:0;color:var(--green2);font-weight:800;letter-spacing:.12em;font-size:11px}.brand-panel .eyebrow{color:#aad9cc}.level-path{display:flex;align-items:center;gap:12px;margin-top:35px}.level-path span{padding:9px 14px;border:1px solid #ffffff44;border-radius:99px}.level-path b{color:var(--gold)}.login-card{align-self:center;justify-self:center;width:min(420px,85%);padding:38px;border-radius:24px;box-shadow:var(--shadow);border:1px solid var(--line)}h2{margin:0;font-size:28px}.muted{color:var(--muted)}.role-switch{display:grid;grid-template-columns:repeat(3,1fr);padding:4px;background:#edf3f1;border-radius:12px;margin:25px 0}.role-switch button{border:0;padding:10px;background:transparent;border-radius:9px}.role-switch button.active{background:white;color:var(--green);font-weight:700;box-shadow:0 3px 12px #1232}label{display:block;font-weight:650;margin:15px 0}input,select,textarea{width:100%;padding:11px 12px;border:1px solid #cddbd7;border-radius:9px;background:white;color:var(--ink);margin-top:6px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--green2);box-shadow:0 0 0 3px #0d80691c}textarea{min-height:90px;resize:vertical}.primary,.outline,.soft,.danger{border:0;border-radius:9px;padding:10px 15px;font-weight:700}.primary{background:var(--green);color:white}.primary:hover{background:#04483a}.outline{background:white;border:1px solid var(--line);color:var(--ink)}.soft{background:var(--mint);color:var(--green)}.danger{background:#feeaea;color:var(--red)}.wide{width:100%;padding:13px}.hint{font-size:12px;text-align:center;color:var(--muted);margin-top:22px}.hint a{color:var(--green)}#staffApp{min-height:100vh;display:grid!important;grid-template-columns:250px 1fr}#staffApp[hidden],#studentApp[hidden],#login[hidden]{display:none!important}aside{position:sticky;top:0;height:100vh;background:#073f35;color:white;padding:24px 15px;display:flex;flex-direction:column}.side-brand{display:flex;gap:12px;align-items:center;padding:0 9px 23px}.mini-mark{width:42px;height:42px;border-radius:13px;font:25px serif}.side-brand strong,.side-brand small{display:block}.side-brand small{opacity:.6;font-size:11px}nav{display:grid;gap:5px}nav button{border:0;background:transparent;text-align:left;color:#c7dfd9;padding:11px 13px;border-radius:9px}nav button:hover,nav button.active{background:#ffffff16;color:white}.logout{margin-top:auto;border:1px solid #ffffff28;background:transparent;color:white;padding:10px;border-radius:9px}main>header{height:86px;padding:0 30px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:5}main>header h2{font-size:22px}.user-chip{display:flex;align-items:center;gap:10px}.user-chip>span{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--mint);color:var(--green);font-weight:800}.user-chip b,.user-chip small{display:block}.user-chip small{font-size:11px;color:var(--muted);text-transform:capitalize}.menu{display:none;border:0;background:none;font-size:24px}#content{padding:28px;max-width:1500px;margin:auto}.toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:18px}.toolbar .filters{display:flex;gap:8px}.toolbar select,.toolbar input{margin:0;width:auto}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.stat,.card{background:white;border:1px solid var(--line);border-radius:15px;padding:20px;box-shadow:0 5px 20px #173f3510}.stat small{color:var(--muted);font-weight:650}.stat strong{display:block;font-size:34px;margin:6px 0}.stat em{font-style:normal;color:var(--green2);font-size:12px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.card h3{margin:0 0 15px}.level-bars{display:grid;gap:15px}.bar-head{display:flex;justify-content:space-between}.bar{height:9px;background:#e9efed;border-radius:20px;overflow:hidden}.bar i{height:100%;display:block;background:linear-gradient(90deg,var(--green2),#4eb69f);border-radius:20px}.callout{background:linear-gradient(120deg,#0a6654,#087963);color:white}.callout p{color:#d4ebe5}.table-wrap{overflow:auto;background:white;border:1px solid var(--line);border-radius:14px}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:left;padding:12px 14px;border-bottom:1px solid #edf1f0;vertical-align:middle}th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:#fafcfb}tr:last-child td{border-bottom:0}.badge{display:inline-block;padding:4px 9px;border-radius:99px;background:var(--mint);color:var(--green);font-size:11px;font-weight:800}.badge.gold{background:#fff7dc;color:#8b6811}.badge.red{background:#feeaea;color:#9a3030}.actions{display:flex;gap:6px}.actions button{padding:6px 9px;font-size:12px}.empty{padding:35px;text-align:center;color:var(--muted)}dialog{border:0;border-radius:18px;width:min(720px,92vw);max-height:90vh;overflow:auto;padding:28px;box-shadow:0 25px 80px #0017}dialog::backdrop{background:#07241e99}.close{position:absolute;right:14px;top:10px;border:0;background:none;font-size:26px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.form-grid .full{grid-column:1/-1}.form-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.attendance-row{display:grid;grid-template-columns:1fr 150px;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}#toast{position:fixed;top:18px;right:18px;z-index:99;background:#123c33;color:white;border-radius:10px;padding:12px 18px;box-shadow:var(--shadow);opacity:0;transform:translateY(-10px);pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:none}.student-head{height:72px;padding:0 5vw;background:#064b3e;color:white;display:flex;justify-content:space-between;align-items:center}.student-head .side-brand{padding:0}.student-main{padding:32px 5vw;max-width:1250px;margin:auto}.hero-card{background:linear-gradient(135deg,#075646,#0b846b);color:white;padding:28px;border-radius:20px;display:flex;justify-content:space-between;gap:20px}.hero-card h1{margin:4px 0;font-size:32px}.hierarchy{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:15px}.hierarchy span{background:#ffffff18;border:1px solid #ffffff30;border-radius:8px;padding:6px 10px}.student-section{margin-top:25px}.material-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.material{padding:17px;border:1px solid var(--line);background:white;border-radius:13px}.material h4{margin:5px 0}.material p{color:var(--muted);font-size:12px}.score{font-size:32px;color:var(--green);font-weight:800}
@media(max-width:900px){.login-page{grid-template-columns:1fr}.brand-panel{min-height:38vh;padding:35px}.brand-panel h1{font-size:44px}.brand-panel>p:not(.eyebrow),.level-path{display:none}.login-card{margin:30px auto}.stats,.material-list{grid-template-columns:1fr 1fr}.grid-2{grid-template-columns:1fr}#staffApp{grid-template-columns:1fr}aside{position:fixed;z-index:20;left:-270px;width:250px;transition:.2s}.nav-open aside{left:0}.menu{display:block}main>header{padding:0 16px}.user-chip div{display:none}#content{padding:18px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}}@media(max-width:560px){.stats,.material-list{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.toolbar .filters{flex-wrap:wrap}.hero-card{display:block}.student-main{padding:20px}.level-path{font-size:11px}.login-card{padding:25px}.attendance-row{grid-template-columns:1fr 110px}}