*{box-sizing:border-box}body{margin:0;background:#f5f6f0;color:#183b30;font-family:system-ui,-apple-system,sans-serif}header{height:84px;padding:20px 36px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce5dc;background:#fff}.logo{font-size:28px;font-weight:750;letter-spacing:-1px}.sub{margin-left:24px;color:#778578}h1{font-size:30px;letter-spacing:-.7px;margin:12px 0 24px}h2{font-size:20px}p{line-height:1.7}button{border:0;border-radius:10px;padding:12px 16px;background:#245c48;color:#fff;font:inherit;cursor:pointer}button:disabled{opacity:.5;cursor:wait}.secondary{background:#e7ede5;color:#245c48}.notice{padding:16px 36px;background:#faf0d7;color:#70582b}.layout{display:grid;grid-template-columns:320px minmax(0,1fr);max-width:1440px;margin:auto}aside{padding:24px;border-right:1px solid #dce5dc}section{padding:32px;min-width:0}.bar{display:flex;justify-content:space-between;align-items:center;gap:12px}.lesson{display:flex;flex-direction:column;gap:10px;text-align:left;width:100%;margin:12px 0;background:#fff;color:#183b30;border:1px solid #e0e7de;padding:18px}.lesson.active{border-color:#245c48;background:#edf5ed}.lesson strong{font-size:18px}small{color:#758173}label{display:block;font-size:14px;font-weight:600;margin-bottom:18px}input,textarea,select{display:block;width:100%;margin-top:8px;padding:12px;border:1px solid #cfd9ce;border-radius:10px;background:#fff;color:#183b30;font:inherit}input:focus,textarea:focus,select:focus,button:focus-visible{outline:2px solid #47865d;outline-offset:2px}textarea{min-height:90px;resize:vertical}.code{font-family:ui-monospace,monospace;font-size:13px;min-height:240px;line-height:1.6}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.fields{max-width:850px}.message{white-space:pre-wrap;color:#9b4930;overflow-wrap:anywhere;margin-bottom:16px}footer{display:flex;flex-wrap:wrap;gap:12px;position:sticky;bottom:0;background:#f5f6f0;padding:20px 0}.empty{padding:100px 10px}.preview article{background:#fff;border-radius:14px;padding:18px;margin:12px 0}.highlight{outline:2px solid #245c48}audio{width:100%}.login{max-width:460px;margin:80px auto;padding:24px}.import{margin-top:20px}@media(max-width:800px){.layout{grid-template-columns:1fr}aside{border-right:0;border-bottom:1px solid #dce5dc}header{padding:16px}.sub{display:none}section{padding:20px}.empty{padding:20px}.grid{grid-template-columns:1fr}}
