:root{--bg:#eef3f2;--card:#fff;--fg:#10242b;--mu:#5d7279;--b:#dbe5e4;--s:#f3f7f6;--p:#0e5a64;--a:#f2a93b}
@media(prefers-color-scheme:dark){:root{--bg:#0b1a1e;--card:#112a30;--fg:#e8f2f1;--mu:#8fa7ab;--b:#1f3d44;--s:#0f242a;--p:#1c8a98}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 "Segoe UI",system-ui,-apple-system,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
h1{font-size:26px;margin:0 0 16px;font-weight:800;letter-spacing:-.02em}h3{margin:0 0 10px;font-size:16px;display:flex;align-items:center;gap:8px}small,.mu{color:var(--mu)}p{margin:0 0 12px}
.ic{display:inline-block;width:20px;height:20px;flex:none;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
input,select,textarea{width:100%;font:inherit;font-size:16px;color:inherit;background:var(--card);border:1px solid var(--b);border-radius:12px;padding:11px 13px;outline:0;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(14,90,100,.18)}
label{display:block;margin-bottom:12px;font-size:13px;color:var(--mu);font-weight:600}label>input,label>select,label>textarea,label>.pw{margin-top:5px}
.btn{background:var(--p);color:#fff;border:1px solid var(--p);border-radius:12px;padding:11px 18px;font:inherit;font-weight:600;cursor:pointer;display:inline-flex;gap:8px;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s,filter .15s}
.btn:hover{filter:brightness(1.1);box-shadow:0 8px 18px -8px var(--p)}.btn:active{transform:scale(.97)}
.btn.g{background:transparent;color:var(--fg);border-color:var(--b)}.btn.g:hover{box-shadow:none;border-color:var(--p)}
.ib{background:none;border:0;color:inherit;padding:6px;cursor:pointer;display:inline-flex;border-radius:8px;transition:opacity .15s,transform .15s}.ib .ic{width:18px;height:18px}.ib:hover{opacity:.65;transform:scale(1.1)}
.card{background:var(--card);border:1px solid var(--b);border-radius:18px;padding:18px;box-shadow:0 1px 2px rgba(16,36,43,.05),0 14px 30px -18px rgba(16,36,43,.25)}
.center{min-height:100dvh;display:grid;place-items:center;padding:16px}.login{width:min(400px,100%)}
.err{font-weight:700;min-height:1.2em;font-size:13px;margin:0 0 8px;color:#c0392b}
/* login */
.lg{position:relative;min-height:100dvh;display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:32px;padding:32px clamp(20px,6vw,80px);overflow:hidden;color:#fff;background:#0a3c44}
.lov{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,34,40,.92),rgba(6,34,40,.5) 60%,rgba(6,34,40,.25))}
.lb,.lc{position:relative}.lc{justify-self:center;width:100%;display:flex;flex-direction:column;align-items:center}
.lb h1{font-size:clamp(44px,7vw,84px);margin:14px 0 8px;line-height:1;animation:rise .8s both}.lb p{font-size:18px;max-width:420px;opacity:.9;animation:rise .8s .15s both}
.blogo{width:68px;border-radius:18px;animation:rise .6s both}
.lc .login{color:var(--fg);animation:rise .7s .2s both;box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.hint{color:#dcecee;font-size:13px;margin-top:14px;width:min(400px,100%)}.hint b{color:var(--a)}
.tabs{display:flex;background:var(--s);border-radius:12px;padding:4px;margin:0 0 16px}.tab{flex:1;border:0;background:none;color:var(--mu);font:inherit;font-weight:600;padding:9px;border-radius:9px;cursor:pointer;transition:.2s}.tab.on{background:var(--p);color:#fff;box-shadow:0 6px 14px -8px var(--p)}
.pw{position:relative}.pw .ib{position:absolute;right:4px;top:50%;transform:translateY(-50%)}.pw input{padding-right:42px}
/* slideshow */
.ss{position:absolute;inset:0;overflow:hidden}.sl{position:absolute;inset:0;background-size:cover;opacity:0;transform:scale(1.12);transition:opacity 1.4s ease}
.sl.on{opacity:1;animation:kb 9s ease-out forwards}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.12)}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}}
@keyframes f{from{opacity:0;transform:translateY(6px)}}
@keyframes grow{from{width:0}}
/* shell */
.shell{display:flex;min-height:100dvh}
.nav{width:232px;padding:20px 14px;background:linear-gradient(180deg,#0e5a64,#0a3c44);color:#fff;position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;gap:4px}
.brand{display:flex;align-items:center;gap:10px;margin:0 6px 22px;font-size:18px}.nlogo{width:40px;border-radius:11px;box-shadow:0 0 0 2px rgba(255,255,255,.28)}
.ni{display:flex;align-items:center;gap:12px;background:none;border:0;color:#b9d3d6;font:inherit;font-weight:600;padding:12px 14px;border-radius:12px;cursor:pointer;transition:background .2s,color .2s,transform .2s}
.ni:hover{background:rgba(255,255,255,.09);color:#fff;transform:translateX(3px)}.ni.on{background:var(--a);color:#10242b}.out{margin-top:auto}
main{flex:1;min-width:0;padding:28px;max-width:1040px}
.pg.in{animation:f .3s}.pg.in .cards>.card,.pg.in .grid>.card{animation:rise .55s both}
.cards>.card:nth-child(2),.grid>.card:nth-child(2){animation-delay:.08s}.cards>.card:nth-child(3),.grid>.card:nth-child(3){animation-delay:.16s}.grid>.card:nth-child(n+4){animation-delay:.22s}
/* home */
.hero{position:relative;border-radius:24px;overflow:hidden;min-height:260px;color:#fff;display:flex;align-items:flex-end;background:#0a3c44}
.hov{position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(6,30,35,.82))}
.ht{position:relative;padding:26px}.ht h1{font-size:clamp(28px,4.5vw,42px);margin:4px 0}.ht small{color:var(--a);font-weight:700}.ht p{margin:0;opacity:.9}
.cards{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px;margin-top:16px}.cards .card{transition:transform .25s,box-shadow .25s}.cards .card:hover{transform:translateY(-4px)}
.ls{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--b)}.ls:last-child{border:0}.ls small{margin-left:auto}
.dot{width:9px;height:9px;border-radius:50%;background:var(--a);flex:none}
.big{font-size:52px;font-weight:800;line-height:1;color:var(--p)}.clip{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.toolbar,.bar2{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.toolbar{justify-content:space-between}.toolbar select{width:auto;min-width:200px}
/* schedule */
.sc{overflow-x:auto;background:var(--card);border:1px solid var(--b);border-radius:18px;box-shadow:0 14px 30px -18px rgba(16,36,43,.25)}
.tt{border-collapse:collapse;width:100%;min-width:640px;table-layout:fixed}
.tt th,.tt td{border:1px solid var(--b);padding:8px 6px;text-align:center;vertical-align:middle;height:60px}
.tt thead th{height:42px;background:var(--s)}.tt thead th.td{background:var(--a);color:#10242b}.tt tbody th{width:78px;position:sticky;left:0;background:var(--s)}
.tt b{display:block;font-size:13px}.tt small{display:block;font-size:11px}
.tt td.cc{background:hsl(var(--h) 75% 92%);box-shadow:inset 4px 0 hsl(var(--h) 60% 46%);color:#10242b;transition:transform .15s}.tt td.cc small{color:#4b5b60}
@media(prefers-color-scheme:dark){.tt td.cc{background:hsl(var(--h) 35% 22%);color:#e8f2f1}.tt td.cc small{color:#a9bec2}}
.clk{cursor:pointer}.clk:hover{outline:2px solid var(--p);outline-offset:-2px}
/* grades */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.chip{border:1px solid var(--b);border-radius:20px;padding:3px 11px;font-size:13px;font-weight:600}
.chip.hi{background:#dff3e6;border-color:#b6e0c4;color:#14532d}.chip.mid{background:#fdf0d5;border-color:#f2d9a0;color:#7a4b00}.chip.lo{background:#fde1e1;border-color:#f3b9b9;color:#7f1d1d}
@media(prefers-color-scheme:dark){.chip.hi{background:#12361f;border-color:#1f5c35;color:#9be3b4}.chip.mid{background:#3b2c0b;border-color:#6b4d12;color:#f3cf85}.chip.lo{background:#3d1717;border-color:#6e2b2b;color:#f2a3a3}}
.meter{height:7px;border-radius:7px;background:var(--b);overflow:hidden;margin:8px 0 4px}.meter i{display:block;height:100%;background:var(--a);border-radius:7px;animation:grow .9s ease-out}
.gt{width:100%;border-collapse:collapse}.gt th,.gt td{border-bottom:1px solid var(--b);padding:6px;text-align:center}.gt thead th{background:var(--s)}.gt th:first-child,.gt td:first-child{text-align:left;min-width:150px}
.gt input{width:68px;text-align:center;padding:8px 4px}
/* chat */
.chat{display:flex;flex-direction:column;height:calc(100dvh - 56px)}
.list{flex:1;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:4px 2px;overscroll-behavior:contain}
.m{max-width:min(78%,520px);padding:9px 13px;background:var(--card);border:1px solid var(--b);border-radius:16px 16px 16px 4px;align-self:flex-start;word-break:break-word;animation:rise .3s both}
.m.me{align-self:flex-end;background:var(--p);color:#fff;border-color:var(--p);border-radius:16px 16px 4px 16px}
.m small{color:inherit;opacity:.7;font-size:11px}.mn{display:block;font-weight:700}.mt{white-space:pre-wrap}
.mi{display:block;max-width:100%;max-height:260px;border-radius:10px;margin-top:6px}
.mf{display:flex;gap:4px;align-items:center;justify-content:flex-end;margin-top:2px}
.bar{display:flex;gap:8px;padding-top:10px;align-items:center}
.row2{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--b)}.row2:last-child{border:0}
.prof{display:grid;gap:4px;justify-items:start}
.av{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid var(--a)}.ph{display:grid;place-items:center;font-size:36px;background:var(--s)}
dialog{border:0;border-radius:18px;background:var(--card);color:var(--fg);width:min(420px,92vw);padding:20px;box-shadow:0 40px 80px -20px rgba(0,0,0,.5);animation:rise .25s}dialog::backdrop{background:rgba(6,30,35,.6)}
.row{display:flex;gap:8px;justify-content:flex-end}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:11px 18px;border-radius:12px;z-index:9;animation:rise .25s}
@media(max-width:860px){.lg{grid-template-columns:1fr;align-content:center;gap:22px}.lb p{display:none}.cards{grid-template-columns:1fr}}
@media(max-width:760px){
.nav{position:fixed;inset:auto 0 0;width:auto;height:auto;flex-direction:row;background:var(--card);color:var(--mu);border-top:1px solid var(--b);padding:6px 6px calc(6px + env(safe-area-inset-bottom));z-index:5;gap:2px}
.brand,.out{display:none}.ni{flex:1;flex-direction:column;align-items:center;gap:2px;font-size:10.5px;padding:7px 2px;color:var(--mu);min-width:0}.ni:hover{background:none;color:var(--mu);transform:none}.ni.on{background:var(--p);color:#fff}
main{padding:16px 14px 90px}.chat{height:calc(100dvh - 114px)}.m{max-width:88%}.hero{min-height:210px;border-radius:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.sl{transform:none}}

/* ===== v2: sakit, ciddi görünüş (kağız tonu + tünd mavi + kərpic vurğu) ===== */
:root{--bg:#f4f1ea;--card:#fffefb;--fg:#1d2433;--mu:#5f6675;--b:#ddd8cc;--s:#eeeae0;--p:#1f3a5f;--a:#b4532a;--nav:#1a2740}
@media(prefers-color-scheme:dark){:root{--bg:#12161f;--card:#1a202c;--fg:#e9ecf2;--mu:#99a1b3;--b:#2c3446;--s:#161b26;--p:#4a78b5;--a:#d9784a;--nav:#0e131c}}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
h1{font-weight:700;letter-spacing:0}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px rgba(31,58,95,.2)}
input,select,textarea,.btn,.tabs,.tab,.ni{border-radius:8px}
.btn:hover{filter:none;box-shadow:none;background:#16304f}.btn.g:hover{background:var(--s)}
.card{border-radius:12px;box-shadow:none}.cards .card:hover{transform:none}
.sc{border-radius:12px;box-shadow:none}
.nav{background:var(--nav);border-right:1px solid rgba(255,255,255,.06)}
.ni:hover{transform:none;background:rgba(255,255,255,.07)}.ni.on{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 3px 0 var(--a)}
.nlogo{box-shadow:none}
.hero{border-radius:14px}.hov{background:linear-gradient(180deg,transparent 35%,rgba(10,16,28,.8))}.ht small{color:#f0c9b5}
.lov{background:linear-gradient(90deg,rgba(12,20,34,.92),rgba(12,20,34,.55) 60%,rgba(12,20,34,.3))}.hint b{color:#f0c9b5}
.lc .login{box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.tab.on{box-shadow:none}.dot{background:var(--a)}
.tt thead th.td{background:var(--p);color:#fff}
.meter i{background:var(--p)}.big{color:var(--p)}
.m,.m.me{border-radius:12px 12px 12px 3px}.m.me{border-radius:12px 12px 3px 12px;background:var(--p)}
.sl.on{animation:none;transform:none}
dialog{border-radius:12px}
.toast{border-radius:8px}
@media(max-width:760px){.nav{background:var(--card)}.ni.on{background:var(--p);box-shadow:none}}

/* Sinif keçidi, profillər və əlaçı görünüşü */
.work{flex:1;min-width:0}
main{width:100%;max-width:1096px;margin:0 auto}
.classbar{width:100%;max-width:1096px;margin:0 auto;padding:16px 28px 0;display:flex;justify-content:flex-end;align-items:center;gap:9px}
.classpick{width:auto;min-width:190px;padding:8px 12px;font-size:14px}
.visibility{margin-bottom:14px}
.subjectchecks{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:2px 14px}
.subjectchecks label{display:flex;align-items:center;gap:8px;margin:0;padding:5px 0;color:var(--fg);font-size:14px}
.subjectchecks input[type=checkbox]{width:18px;height:18px;margin:0;padding:0;accent-color:var(--p)}
.msg-person{display:flex;align-items:center;gap:8px;padding:0;margin:0 0 6px;border:0;background:none;color:inherit;text-align:left;font:inherit;cursor:pointer}
.msg-person>span:last-child{display:grid;gap:1px}
.msg-person b{font-size:13px}
.msg-person small{font-size:11px;opacity:.72}
.msg-av{width:30px;height:30px;flex:none;border-radius:50%;object-fit:cover;border:1px solid currentColor}
.msg-ph{display:grid;place-items:center;background:rgba(255,255,255,.2);font-weight:700}
.m.honor,.m.me.honor{background:linear-gradient(135deg,#fff8df,#f2dfa7);border-color:#d5ad51;color:#4c3b12;box-shadow:0 5px 16px rgba(145,105,18,.14)}
.m.honor .msg-av{border-color:#c39932}
.m.honor .mf .ib{color:#4c3b12}
.linkname{border:0;background:none;padding:0;color:var(--fg);font:inherit;font-weight:700;text-align:left;cursor:pointer}
.linkname:hover{text-decoration:underline;color:var(--p)}
.rowactions{display:flex;align-items:center;gap:4px}
.bio{width:100%;margin:8px 0 12px;padding:14px;background:var(--s);border:1px solid var(--b);border-radius:10px}
.biohead{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.bio .mt{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.subject-role{margin:-8px 0 8px;font-weight:700;color:var(--p)}
.awards{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 10px}
.award{padding:5px 10px;border:1px solid #d5ad51;border-radius:999px;background:#fff2c6;color:#72520a;font-size:13px;font-weight:700}
@media(max-width:760px){
 .classbar{padding:10px 14px 0}
 .classpick{min-width:0;max-width:70%;}
 main{padding-top:12px}
 .subjectchecks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* yeni: növbəti dərs, elan lenti */
.ls.nx{background:var(--s);margin:0 -10px;padding:9px 10px;border-radius:8px;border:0}.ls.nx b::after{content:"növbəti";margin-left:8px;font-size:11px;font-weight:700;color:var(--a);text-transform:uppercase;letter-spacing:.04em}
.feed{display:grid;gap:12px}.post p{margin:6px 0 10px}.ph2{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.tag{font-size:12px;font-weight:700;padding:2px 9px;border-radius:6px;border:1px solid var(--b);color:var(--mu)}.tag.a{background:#e6edf7;border-color:#c5d3e8;color:#1f3a5f}.tag.h{background:#f8e7de;border-color:#ecc7b3;color:#8a3a17}
@media(prefers-color-scheme:dark){.tag.a{background:#1b2a42;border-color:#2c4468;color:#a9c4ec}.tag.h{background:#3a2218;border-color:#63392a;color:#f0b595}}
.late{color:#b42318;font-weight:700}.mf2{display:flex;justify-content:space-between;align-items:center}

/* qiymət cədvəli */
.gt thead th{font-size:13px;white-space:nowrap}.gt thead tr+tr th:first-child{min-width:0;text-align:center}.gt td.yk,.gt th.yk{background:var(--s);font-weight:700;min-width:64px}.gt td:first-child{position:sticky;left:0;background:var(--card)}
.gt input{width:60px}