:root{--bg:#f6f4ef;--card:#fff;--ink:#1d2a22;--muted:#6b756e;--accent:#2f6b3a;--accent2:#e8f1ea;--warn:#b45309;--warnbg:#fef3c7;--line:#dcd8cd;--danger:#b42318}
@media (prefers-color-scheme:dark){:root{--bg:#141a16;--card:#1c241f;--ink:#e8ece9;--muted:#9aa59d;--accent:#7cc38a;--accent2:#223127;--warn:#fbbf24;--warnbg:#3a2f12;--line:#33403a;--danger:#f97066}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,-apple-system,Segoe UI,sans-serif}
.top{position:sticky;top:0;z-index:10;display:flex;gap:16px;align-items:center;padding:10px 16px;background:var(--card);border-bottom:1px solid var(--line)}
.brand{font-weight:700;color:var(--accent);text-decoration:none}
.status{color:var(--muted);font-size:13px;flex:1}
button,.btn{font:inherit;cursor:pointer;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:6px 12px;border-radius:8px;text-decoration:none;display:inline-block}
button:hover,.btn:hover{border-color:var(--accent)}
button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
button.danger{color:var(--danger)}
button.small{padding:3px 8px;font-size:13px}
input[type=text],input[type=url],textarea,select{font:inherit;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:8px;padding:6px 10px;width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:20px 16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:12px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.grow{flex:1}
h1{font-size:24px;margin:0 0 12px}
.layout{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start}
@media(max-width:800px){.layout{grid-template-columns:1fr}}
.mods{position:sticky;top:64px}
.mod{display:flex;gap:4px;align-items:center;padding:6px 8px;border-radius:8px;cursor:pointer;border:1px solid transparent}
.mod.active{background:var(--accent2);border-color:var(--accent)}
.mod .t{flex:1;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.block{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px}
.block.t-text{border-left-color:#5b8def}.block.t-heading{border-left-color:var(--accent)}.block.t-quiz{border-left-color:#c026d3}.block.t-note{border-left-color:var(--warn);background:var(--warnbg)}.block.t-image,.block.t-video{border-left-color:#0891b2}
.btype{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.tools{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.edit{min-height:44px;outline:none;padding:4px}
.edit:focus{background:var(--accent2);border-radius:6px}
.edit table{border-collapse:collapse}.edit td,.edit th{border:1px solid var(--line);padding:4px 8px}
.opt{display:flex;gap:8px;align-items:center;margin:4px 0}
.opt input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent)}
.warn{background:var(--warnbg);color:var(--warn);padding:6px 10px;border-radius:8px;font-size:13px;margin:6px 0}
.insert{display:flex;gap:4px;justify-content:center;margin:-2px 0 10px;opacity:.5}
.insert:hover{opacity:1}
img.preview{max-width:100%;max-height:260px;border-radius:8px;display:block;margin:6px 0}
.muted{color:var(--muted);font-size:14px}