@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Fraunces:opsz,wght@9..144,500&display=swap');
:root{--ink:#202624;--muted:#727a73;--paper:#f5f2ea;--panel:#fffdf8;--line:#deded5;--coral:#ef765f;--mint:#c8e1d0;--yellow:#f4d66d}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font-family:'DM Sans',sans-serif}button,input,textarea{font:inherit}button{cursor:pointer}.shell{max-width:1180px;margin:auto;padding:28px 34px 60px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px}.brand{color:var(--ink);text-decoration:none;font-weight:700;font-size:21px}.brand:first-letter{color:var(--coral)}header small{color:var(--muted)}.intro{padding:70px 5% 48px}.intro p,.heading label,.library>label{color:var(--coral);font-size:11px;letter-spacing:1.4px}.intro h1{margin:15px 0;font-size:clamp(44px,6vw,72px);line-height:.98;letter-spacing:-3px}.intro i{font-family:Fraunces,Georgia,serif;font-weight:500}.intro span{display:block;max-width:440px;color:var(--muted);line-height:1.6}.workspace{display:grid;grid-template-columns:1.55fr 1fr;background:var(--panel);border:1px solid var(--line);box-shadow:8px 8px #e5e1d6}.editor,aside{padding:28px 30px}.editor{border-right:1px solid var(--line)}.heading{display:flex;justify-content:space-between;align-items:flex-start}.heading label{display:block}.heading input{display:block;width:80%;margin-top:8px;border:0;outline:0;background:transparent;color:var(--ink);font:21px Fraunces,Georgia,serif}.heading>span{color:var(--muted);font-size:11px}.heading h2{margin:10px 0;font-size:20px;color:var(--ink);letter-spacing:0}.heading b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--yellow)}textarea{display:block;width:100%;min-height:340px;margin-top:28px;border:0;outline:0;resize:vertical;background:transparent;color:var(--ink);font-size:18px;line-height:1.8}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:11px}footer div{display:flex;gap:12px}button{border:0;color:var(--coral);background:transparent}footer button:last-child,aside>button{padding:10px 13px;color:#fff;background:var(--ink);font-weight:700}aside>button{width:100%;margin-top:12px;text-align:left}aside>button:disabled{opacity:.4}.feedback{padding:15px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:1.5}.feedback small{display:block;color:var(--coral);font-size:10px;text-transform:uppercase}.feedback del{color:var(--muted)}.feedback ins{font-weight:700;text-decoration:none}.feedback button{display:block;padding:0;font-weight:700}.translation{margin-top:25px;padding:16px;background:#f0eee5}.translation label{color:var(--coral);font-size:11px;letter-spacing:1px}.translation p{font-size:14px;line-height:1.6}.library{margin:58px 5% 0;padding-top:28px;border-top:1px solid var(--line)}.library h2{margin:12px 0;font-size:25px}.history{display:inline-flex;flex-direction:column;width:190px;margin:0 8px 0 0;padding:14px;border:1px solid var(--line);background:var(--panel);text-align:left}.history span{margin-top:12px;color:var(--muted);font-size:11px}@media(max-width:760px){.shell{padding:20px 18px 42px}.intro{padding:50px 0 36px}.workspace{display:block;box-shadow:5px 5px #e5e1d6}.editor{border-right:0;border-bottom:1px solid var(--line);padding:22px}aside{padding:22px}.library{margin:48px 0 0}textarea{min-height:260px}}