:root{
  --purple:#400E8C; --purple2:#8A4DFF; --ink:#1A1714; --sub:#5C5247; --muted:#8A7E6E;
  --bg:#F6F4FB; --card:#FFFFFF; --line:#E3DAF2; --ok:#1E8E5A; --bad:#C0392B; --warn:#B8860B;
}
*{box-sizing:border-box}
body{margin:0;font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;background:#fff;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--purple),var(--purple2));color:#fff;font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center}
.brand h1{font-size:18px;margin:0}
.brand p{margin:2px 0 0;color:var(--muted);font-size:12px}
.tabs{display:flex;gap:8px}
.tab{border:1px solid var(--line);background:#fff;padding:8px 16px;border-radius:8px;cursor:pointer;font-size:14px;color:var(--sub)}
.tab.active{background:var(--purple);color:#fff;border-color:var(--purple)}
main{max-width:1080px;margin:0 auto;padding:24px}
.panel{display:none}
.panel.active{display:block}
.row{display:flex;align-items:center}
.between{justify-content:space-between}
.wrap{flex-wrap:wrap;gap:8px}
.gap{gap:8px}
h2{font-size:18px;margin:0 0 8px}
h3.preview-title{margin:24px 0 10px;font-size:15px;color:var(--sub)}
.hint{color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin:0 0 14px;line-height:1.6}
.code{background:#1A1714;color:#E8E0F5;padding:16px;border-radius:10px;white-space:pre-wrap;word-break:break-word;max-height:62vh;overflow:auto;font-family:"Cascadia Code",Consolas,monospace;font-size:12.5px;line-height:1.6}
.btn{border:1px solid var(--purple);background:#fff;color:var(--purple);padding:8px 14px;border-radius:8px;cursor:pointer;font-size:13px}
.btn:hover{background:#F3EEFF}
.btn.primary{background:var(--purple);color:#fff}
.btn.primary:hover{background:#2f0a6b}
.select{border:1px solid var(--line);border-radius:8px;padding:8px;background:#fff}
.editor{width:100%;min-height:300px;margin-top:12px;border:1px solid var(--line);border-radius:10px;padding:14px;font-family:"Cascadia Code",Consolas,monospace;font-size:13px;line-height:1.6;resize:vertical;background:#fff}
.summary{margin-top:16px;padding:12px 16px;border-radius:10px;font-weight:600;display:flex;gap:18px;flex-wrap:wrap}
.summary.ok{background:#E7F6EE;color:var(--ok);border:1px solid #BFE9CF}
.summary.bad{background:#FDECEA;color:var(--bad);border:1px solid #F3C5BE}
.summary .meta{color:var(--sub);font-weight:500}
.feedback{margin-top:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.fcard{border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff}
.fcard .hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.fcard .pg{font-weight:700}
.tag{font-size:11px;padding:2px 8px;border-radius:20px;background:#F0EBFA;color:var(--purple)}
.pass{color:var(--ok);font-weight:700}
.fail{color:var(--bad);font-weight:700}
.iss{margin:4px 0 0;padding-left:16px;color:var(--bad);font-size:12.5px}
.preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.slide{border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px;min-height:120px}
.slide .sno{font-size:11px;color:var(--muted)}
.slide .stitle{font-weight:700;margin:4px 0;font-size:13px;color:var(--ink)}
.slide .skind{font-size:10px;color:#fff;background:var(--purple2);padding:1px 6px;border-radius:10px;display:inline-block;margin-bottom:4px}
.slide ul{margin:4px 0 0;padding-left:16px;color:var(--sub);font-size:11.5px;line-height:1.5}
.hidden{display:none}
.foot{text-align:center;color:var(--muted);font-size:12px;padding:18px;border-top:1px solid var(--line);background:#fff}
code{background:#F0EBFA;padding:1px 6px;border-radius:5px;color:var(--purple)}
.dl{display:inline-block;margin-top:10px;background:var(--ok);color:#fff;padding:10px 18px;border-radius:8px;text-decoration:none;font-weight:600}
