:root{--bg:#0B1015;--panel:#111820;--panel2:#16202b;--line:#222e3b;--text:#e9eef4;--muted:#8b9aab;--accent:#3DDC97;--ink:#04110b;--bad:#ff6b6b;--warn:#f5b942;--info:#6ab7ff;--r:16px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.55 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;min-height:100vh;background-image:radial-gradient(900px 400px at 85% -10%,rgba(61,220,151,.07),transparent 60%)}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.2}h3{font-size:17px}.serif{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:34px;letter-spacing:-.01em}.serif em{color:var(--accent)}
.muted{color:var(--muted)}.small,small{font-size:12.5px}.center{text-align:center}.pad{padding:26px!important}.right{text-align:right}.nowrap{white-space:nowrap}code{background:var(--panel2);padding:2px 6px;border-radius:6px;font-size:12.5px}
hr{border:0;border-top:1px solid var(--line);margin:18px 0}.pre{white-space:pre-wrap}
/* layout */
.app{display:flex;min-height:100vh}
.side{width:262px;flex:none;background:rgba(17,24,32,.92);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:18px 14px;position:sticky;top:0;height:100vh;overflow-y:auto;z-index:30}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);padding:4px 8px 18px;text-decoration:none!important}.brand.center{justify-content:center;padding-bottom:6px}
.brand-mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--accent),#1c8f63);display:grid;place-items:center;overflow:hidden;flex:none}.brand-mark img{width:100%;height:100%;object-fit:contain;background:#fff}
.brand-text{display:flex;flex-direction:column;line-height:1.15}.brand-text b{letter-spacing:.16em;font-size:14px}.brand-text i{font-style:normal;font-size:11px;color:var(--muted)}
.side nav{display:flex;flex-direction:column;gap:2px;flex:1}
.nav-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:11px;color:var(--muted);font-weight:500;text-decoration:none!important}
.nav-item:hover{background:var(--panel2);color:var(--text)}.nav-item.active{background:rgba(61,220,151,.12);color:var(--accent)}
.side-foot{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}.who{padding:4px 12px 8px}.who b{display:block}.who small{color:var(--muted)}
main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:flex;align-items:center;gap:12px;padding:16px 28px;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(11,16,21,.85);backdrop-filter:blur(10px);z-index:20}
.top h1{font:400 28px 'Instrument Serif',Georgia,serif;margin:0;flex:1}.top-actions{display:flex;gap:8px;align-items:center}
.content{padding:26px 28px 60px;max-width:1280px;width:100%}
.icon-btn{background:none;border:1px solid var(--line);color:var(--text);width:40px;height:40px;border-radius:12px;display:inline-grid;place-items:center;cursor:pointer;position:relative}
.icon-btn[data-toggle]{display:none}.bell em{position:absolute;top:-6px;right:-6px;background:var(--bad);color:#fff;font-style:normal;font-size:11px;border-radius:99px;padding:1px 6px;font-weight:700}
.scrim{display:none}
/* cards */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:18px}
.card>h3:first-child,.card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.grid{display:grid;gap:16px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.stat small{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:11px}.stat b{font:400 30px 'Instrument Serif',Georgia,serif;letter-spacing:-.01em}.stat span{font-size:12.5px;color:var(--muted)}
.stat.good b{color:var(--accent)}.stat.bad b{color:var(--bad)}.stat.warn b{color:var(--warn)}
/* tables */
.table-wrap{overflow-x:auto;margin:0 -4px}table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;color:var(--muted);font-weight:500;font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;padding:10px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:11px 10px;border-bottom:1px solid rgba(34,46,59,.6);vertical-align:middle}tr:last-child td{border-bottom:0}tr:hover td{background:rgba(255,255,255,.015)}
/* forms */
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field>span{font-size:12.5px;color:var(--muted);font-weight:500}.field small{color:var(--muted)}
input,select,textarea{width:100%;background:var(--bg);border:1px solid #2a3846;color:var(--text);border-radius:11px;padding:11px 13px;font:inherit;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(61,220,151,.14)}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--accent)}input[type=color]{padding:3px;height:42px}input[type=file]{padding:9px}
textarea{min-height:90px;resize:vertical}select{appearance:auto}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 16px}.form-grid .full{grid-column:1/-1}
.stack>*+*{margin-top:0}.check{display:flex;gap:8px;align-items:center;margin:6px 0;color:var(--text);font-size:14px}.check input{flex:none}
.inline{display:inline}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row.between{justify-content:space-between}
/* buttons & badges */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:var(--ink);border:1px solid var(--accent);border-radius:999px;padding:11px 22px;font:600 14.5px Inter,sans-serif;cursor:pointer;text-decoration:none!important;transition:.15s}
.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}.btn.sm{padding:6px 14px;font-size:13px}.btn.ghost{background:transparent;color:var(--text);border-color:#2f3d4c}.btn.ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn.danger{background:transparent;color:var(--bad);border-color:rgba(255,107,107,.45)}.btn.block{width:100%}
.badge{display:inline-block;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:99px;background:var(--panel2);color:var(--muted);white-space:nowrap}
.badge.ok{background:rgba(61,220,151,.14);color:var(--accent)}.badge.warn{background:rgba(245,185,66,.14);color:var(--warn)}.badge.bad{background:rgba(255,107,107,.14);color:var(--bad)}.badge.info{background:rgba(106,183,255,.14);color:var(--info)}
.alert{padding:12px 16px;border-radius:12px;margin-bottom:16px;border:1px solid var(--line);background:var(--panel)}
.alert.ok{border-color:rgba(61,220,151,.4);background:rgba(61,220,151,.08)}.alert.err{border-color:rgba(255,107,107,.45);background:rgba(255,107,107,.08)}.alert.warn{border-color:rgba(245,185,66,.45);background:rgba(245,185,66,.08)}
.due-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.due-banner svg{vertical-align:-4px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}.tabs a{padding:8px 16px;border-radius:99px;border:1px solid var(--line);color:var(--muted);font-weight:500;text-decoration:none!important}.tabs a.on{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.progress{height:8px;background:var(--panel2);border-radius:9px;overflow:hidden;min-width:90px}.progress i{display:block;height:100%;background:var(--accent);border-radius:9px}
.chart{width:100%;height:auto}.legend{display:flex;gap:16px;font-size:12.5px;color:var(--muted);margin-top:6px}.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
/* modal */
.modal{position:fixed;inset:0;background:rgba(5,8,11,.72);display:none;place-items:center;z-index:100;padding:20px}.modal.show{display:grid}
.modal-box{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:28px;max-width:480px;width:100%;box-shadow:0 30px 80px rgba(0,0,0,.5)}.modal-box h3{font:400 28px 'Instrument Serif',Georgia,serif;margin:10px 0}.modal-box .btn{margin-top:16px}
/* auth */
.public{min-height:100vh;display:grid;place-items:center;padding:20px}.auth-card{width:100%;max-width:430px;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:30px}
/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.cal .dow{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;text-align:center;padding:4px}
.cal .day{min-height:96px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:6px;display:flex;flex-direction:column;gap:3px;overflow:hidden}.cal .day.out{opacity:.35}.cal .day.today{border-color:var(--accent)}
.cal .day b{font-size:12px;color:var(--muted)}
.ev{font-size:11.5px;border-radius:7px;padding:3px 6px;background:var(--panel2);display:block;color:var(--text);line-height:1.25;text-decoration:none!important}
.ev.completed{background:rgba(61,220,151,.14)}.ev.cancelled,.ev.holiday{background:rgba(255,107,107,.14)}.ev.postponed{background:rgba(245,185,66,.16)}.ev.scheduled{background:rgba(106,183,255,.14)}
.tick{color:var(--accent);font-weight:800;margin-right:3px}
.list-ev{display:none}
/* video */
.player{position:relative;background:#000;border-radius:16px;overflow:hidden;aspect-ratio:16/9;user-select:none;-webkit-user-select:none}
.player video,.player iframe{width:100%;height:100%;border:0;display:block;background:#000}
.wm{position:absolute;z-index:5;pointer-events:none;color:rgba(255,255,255,.35);font-size:13px;font-weight:600;text-shadow:0 0 4px rgba(0,0,0,.6);transition:all 2s linear;white-space:nowrap}
.lesson{display:flex;gap:12px;align-items:center;padding:11px 12px;border-radius:12px;border:1px solid var(--line);margin-bottom:8px;color:var(--text);text-decoration:none!important}.lesson:hover,.lesson.on{border-color:var(--accent);background:rgba(61,220,151,.06)}
.lesson i{width:30px;height:30px;border-radius:50%;background:var(--panel2);display:grid;place-items:center;font-style:normal;font-size:12px;color:var(--accent);flex:none}
.noselect{user-select:none;-webkit-user-select:none}
/* exam */
.q{border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px}.q p{margin:0 0 10px;font-weight:600}.opt{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border-radius:10px;border:1px solid var(--line);margin-bottom:6px;cursor:pointer}.opt:hover{border-color:var(--accent)}
.opt.right{border-color:var(--accent);background:rgba(61,220,151,.08)}.opt.wrong{border-color:var(--bad);background:rgba(255,107,107,.08)}
.timer{position:sticky;top:76px;z-index:10;background:var(--panel);border:1px solid var(--accent);border-radius:99px;padding:6px 16px;display:inline-block;font-weight:700;margin-bottom:14px}
/* perm matrix */
.perm-group{margin-bottom:16px}.perm-group h4{color:var(--accent);font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.tri{display:flex;gap:2px;background:var(--panel2);border-radius:99px;padding:2px;font-size:12px}.tri label{padding:3px 10px;border-radius:99px;cursor:pointer;color:var(--muted)}.tri input{display:none}.tri input:checked+span{color:var(--ink)}.tri label:has(input:checked){background:var(--accent);color:var(--ink)}.tri label:has(input[value=deny]:checked){background:var(--bad);color:#fff}.tri label:has(input[value=inherit]:checked){background:var(--line);color:var(--text)}
.perm-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line)}
/* responsive */
@media(max-width:980px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){
  .side{position:fixed;left:0;top:0;transform:translateX(-102%);transition:.22s;width:280px}.side.open{transform:none}
  .scrim.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:25}.icon-btn[data-toggle]{display:inline-grid}
  .top{padding:12px 16px}.top h1{font-size:23px}.content{padding:18px 14px 70px}
  .g2,.g3,.g4,.form-grid{grid-template-columns:1fr}.stat b{font-size:26px}
  .cal{display:none}.list-ev{display:block}
}
@media(max-width:520px){.g4,.g3{grid-template-columns:1fr 1fr}.btn{padding:10px 18px}}
@media print{body{background:#fff;color:#000}.side,.top,.no-print,.scrim,.modal{display:none!important}.content{padding:0;max-width:none}.card,.stat{background:#fff;border-color:#ccc;color:#000}.muted,th{color:#555}td{border-color:#ddd}.badge{border:1px solid #bbb;background:#fff;color:#000}a{color:#000}.progress{border:1px solid #aaa}}