
:root{--bg:#0e1116;--panel:#161b22;--panel2:#1c2230;--accent:#7c5cff;--accent2:#39d98a;
--text:#e6edf3;--muted:#8b949e;--border:#262d38;--bubble:#20283a;}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Segoe UI",system-ui,sans-serif;
line-height:1.55;max-width:920px;margin:0 auto;padding:24px}
a{color:var(--accent2);text-decoration:none}a:hover{text-decoration:underline}
h1{font-family:"Consolas","Courier New",monospace;letter-spacing:.5px;margin:.2em 0}
h2{border-bottom:1px solid var(--border);padding-bottom:6px;margin-top:32px}
.muted{color:var(--muted);font-size:.9em}
.back{display:inline-block;margin-bottom:14px;color:var(--muted)}
/* hero */
.hero{display:flex;gap:20px;align-items:center;background:var(--panel);border:1px solid var(--border);
border-radius:14px;padding:20px;margin-bottom:24px}
.hero .poster{width:120px;height:120px;border-radius:12px;object-fit:cover;border:2px solid var(--accent)}
.hero h1{font-size:1.5em}
.btn{display:inline-block;margin-top:10px;background:var(--accent);color:#fff;padding:8px 16px;
border-radius:8px;font-weight:600}
.btn:hover{text-decoration:none;filter:brightness(1.1)}
/* grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.card{display:flex;gap:14px;background:var(--panel);border:1px solid var(--border);border-radius:12px;
padding:14px;transition:.15s;align-items:center}
.card:hover{border-color:var(--accent);transform:translateY(-2px);text-decoration:none}
.card .num{font-family:"Consolas",monospace;font-size:1.8em;font-weight:700;color:var(--accent);
min-width:42px;height:42px;display:flex;align-items:center;justify-content:center;
background:var(--panel2);border-radius:10px}
.card-title{color:var(--text);font-weight:600}
.card-meta{color:var(--muted);font-size:.85em;margin-top:4px}
/* lesson */
.date-line{color:var(--muted);font-size:.85em;margin-bottom:14px}
.lesson-video{margin:14px 0}
.lesson-video video{width:100%;border-radius:12px;background:#000}
.vlabel{color:var(--accent2);font-size:.85em;margin-bottom:4px;font-weight:600}
.desc{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:16px;white-space:normal}
.materials{display:flex;flex-wrap:wrap;gap:10px}
.materials a{background:var(--panel2);border:1px solid var(--border);padding:8px 14px;border-radius:8px;color:var(--text)}
.materials a:hover{border-color:var(--accent2);text-decoration:none}
/* chat */
.chat{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.cmt{background:var(--bubble);border:1px solid var(--border);border-radius:12px;border-top-left-radius:2px;
padding:10px 14px;max-width:88%}
.cmt-head{display:flex;gap:10px;align-items:baseline;margin-bottom:2px}
.author{color:var(--accent);font-weight:600;font-size:.92em}
.date{color:var(--muted);font-size:.75em}
.quote{border-left:3px solid var(--accent2);padding:2px 8px;margin:4px 0;color:var(--muted);
font-size:.85em;background:rgba(255,255,255,.03);border-radius:4px}
.cmt-body{word-wrap:break-word}
.cmt-img{max-width:260px;max-height:260px;border-radius:8px;margin-top:8px;display:block}
.cmt-vid{max-width:320px;border-radius:8px;margin-top:8px;display:block;background:#000}
.cmt-file{display:inline-block;margin-top:6px;color:var(--accent2)}
.reacts{margin-top:6px;font-size:.85em;color:var(--muted)}
.thread{margin:22px 0;padding:16px;background:var(--panel);border:1px solid var(--border);border-radius:12px}
.root-post{border-left:3px solid var(--accent);padding:6px 12px;margin-bottom:10px;font-weight:500;background:var(--panel2);border-radius:6px}
footer{margin-top:40px;text-align:center;border-top:1px solid var(--border);padding-top:16px}
@media(max-width:600px){.hero{flex-direction:column;text-align:center}body{padding:14px}}
