.study{--h:var(--th);gap:14px}
.study.fresh .scard{animation:pop .5s var(--ease) both}
.study datalist{display:none}

/* Dòng tóm tắt trên cùng */
.ssum{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:stretch}
.sitem{padding:10px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:2px;min-width:0}
.sitem small{font-size:12px;color:var(--muted)}
.sitem b{font-size:14px;font-weight:600;word-break:break-word}
.sitem.warn{border-color:hsl(35 80% 58%)}
.sitem.late{border-color:hsl(8 70% 60%)}
.ssum .nbtn{align-self:stretch}

/* Bố cục 2 cột */
.sgrid{display:grid;grid-template-columns:minmax(300px,380px) 1fr;gap:14px;align-items:start}
.scol{display:flex;flex-direction:column;gap:14px;min-width:0}
.scard{padding:16px;border-radius:var(--r);box-shadow:var(--shadow);display:flex;flex-direction:column;gap:12px;min-width:0}
.shead{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.shead h3{font-size:16px}
.scard .seg button{padding:6px 12px;font-size:14px}

/* Pomodoro */
.ringbox{position:relative;width:min(230px,100%);aspect-ratio:1;margin:0 auto}
.ringbox svg{width:100%;height:100%;display:block}
.ring-track{fill:none;stroke:hsl(var(--th) 25% 80% / .55);stroke-width:7}
[data-mode=dark] .ring-track{stroke:hsl(var(--th) 15% 30%)}
.ring-bar{fill:none;stroke:var(--accent);stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset .5s linear}
.ringbox.rest .ring-bar{stroke:hsl(150 45% 55%)}
.ringmid{position:absolute;inset:0;display:grid;place-content:center;text-align:center;gap:2px}
.rtime{font-size:42px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:1px}
.rstate{font-size:13px;color:var(--muted)}
.sinput{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--surface-solid);color:var(--text);outline:0;transition:border-color .25s,box-shadow .25s}
.sinput:focus{border-color:var(--accent);box-shadow:0 0 0 4px hsl(var(--th) 70% 65% / .2)}
.sctl{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.sctl .btn-new{padding:10px 26px}
.sset{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.sset input{width:56px;margin:0 4px;padding:6px 8px;border-radius:10px;border:1px solid var(--line);background:var(--surface-solid);color:var(--text);text-align:center;outline:0}
.sset input:disabled{opacity:.5}
.spomo{text-align:center;font-size:13px;color:var(--muted)}

/* Thống kê */
.sbig{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sbox{padding:10px 12px;border-radius:14px;background:hsl(var(--th) 40% 70% / .16);display:flex;flex-direction:column}
.sbox span{font-size:12px;color:var(--muted)}
.sbox b{font-size:18px}
.sbars{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;align-items:end}
.sbar{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:var(--muted)}
.sbar em{font-style:normal;font-size:11px;height:14px}
.strk{position:relative;width:100%;max-width:28px;height:72px;border-radius:8px;background:hsl(var(--th) 40% 70% / .18);overflow:hidden}
.strk i{position:absolute;left:0;right:0;bottom:0;height:0;background:var(--accent);border-radius:6px;transition:height .6s var(--ease)}
.sbar.now span{color:var(--text);font-weight:700}
.schips{display:flex;gap:6px;flex-wrap:wrap}
.snote{font-size:12px;color:var(--muted)}

/* Thời khóa biểu */
.sdays{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.sday{flex:1;min-width:42px;padding:8px 6px;border-radius:12px;background:var(--surface-solid);border:1px solid var(--line);color:var(--muted);transition:all .25s var(--ease)}
.sday:hover{transform:translateY(-2px)}
.sday.on{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;border-color:transparent}
.sday.today:not(.on){border-color:var(--accent);color:var(--text)}
.sday sup{font-size:10px;margin-left:2px}

/* Danh sách tiết học / deadline */
.slist{display:flex;flex-direction:column;gap:8px}
.srow{display:grid;grid-template-columns:54px 1fr;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--surface-solid);border:1px solid var(--line);border-left:4px solid var(--line);cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s,opacity .3s}
.srow.dl{grid-template-columns:34px 1fr}
.srow:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.srow.live{border-left-color:hsl(150 50% 50%)}
.srow.sev-soon{border-left-color:hsl(35 85% 55%)}
.srow.sev-late{border-left-color:hsl(8 70% 58%)}
.srow.done{opacity:.6}
.srow.done .stitle{text-decoration:line-through}
.stime{text-align:right;line-height:1.3}
.stime b{display:block;font-size:15px}
.stime span{font-size:12px;color:var(--muted)}
.sbody{min-width:0}
.stitle{font-weight:600;word-break:break-word}
.smeta{font-size:13px;color:var(--muted);word-break:break-word}
.sbadges{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.sempty{text-align:center;color:var(--muted);padding:18px 0;font-size:14px}

@media(max-width:900px){
 .sgrid{grid-template-columns:1fr}
 .ssum{grid-template-columns:1fr 1fr}
 .ssum .nbtn{grid-column:1/-1}
}
@media(max-width:560px){
 .ssum{grid-template-columns:1fr}
 .rtime{font-size:38px}
}

/* Mục tiêu giờ học & chuỗi ngày */
.sgoalrow{display:flex;flex-direction:column;gap:4px}
.sgoalrow .ppill{height:16px}
.sgoalrow.met .ppill i{background:linear-gradient(90deg,hsl(145 70% 62%),hsl(165 70% 62%))}
.sstreak{font-size:14px;font-weight:600}
