:root{
  --bg:#fff6f8;
  --card:#fff;
  --accent:#ff6b9a;
  --muted:#666;
}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; background:linear-gradient(180deg,var(--bg),#fff); margin:0; color:#222}
.container{max-width:720px;margin:32px auto;padding:16px}
header h1{margin:0;font-size:28px}
.subtitle{margin:4px 0 20px;color:var(--muted)}
.compose textarea{width:100%;min-height:110px;padding:12px;border-radius:10px;border:1px solid rgba(0,0,0,0.06);resize:vertical}
.compose-actions{display:flex;gap:8px;margin-top:8px}
.compose-actions input{flex:1;padding:10px;border-radius:8px;border:1px solid rgba(0,0,0,0.06)}
button{background:var(--accent);color:#fff;border:none;padding:10px 14px;border-radius:10px;cursor:pointer}
.notes{margin-top:24px}
.note{background:var(--card);padding:14px;border-radius:12px;margin-bottom:12px;box-shadow:0 6px 18px rgba(255,107,154,0.06);}
.note .meta{font-size:12px;color:var(--muted);margin-bottom:6px}
.note p{margin:0;white-space:pre-wrap}
footer{margin-top:24px;text-align:center;color:var(--muted)}
.loading{color:var(--muted)}