.feed-rich-editor{position:relative}
.feed-editor-toolbar{
  display:flex;
  align-items:center;
  gap:4px;
  padding:6px;
  border:1px solid var(--border);
  border-bottom:0;
  border-radius:10px 10px 0 0;
  background:color-mix(in srgb,var(--surface) 94%,var(--accent) 6%);
}
.feed-editor-toolbar>button,
.feed-editor-emoji>button{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  min-height:34px;
  margin:0;
  padding:0;
  border:1px solid transparent;
  border-radius:6px;
  background:transparent;
  color:var(--text);
  font:inherit;
  cursor:pointer;
}
.feed-editor-toolbar>button:hover,
.feed-editor-toolbar>button:focus-visible,
.feed-editor-toolbar>button.is-active,
.feed-editor-emoji>button:hover,
.feed-editor-emoji>button:focus-visible,
.feed-editor-emoji>button[aria-expanded="true"]{
  border-color:var(--border);
  background:color-mix(in srgb,var(--accent) 12%,transparent);
}
.feed-editor-surface{
  min-height:210px;
  max-height:52vh;
  overflow:auto;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:0 0 10px 10px;
  background:var(--surface);
  color:var(--text);
  font:inherit;
  line-height:1.55;
  outline:none;
  white-space:normal;
  overflow-wrap:anywhere;
}
.feed-editor-surface:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent);
}
.feed-editor-surface.is-invalid{
  border-color:var(--danger);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 15%,transparent);
}
.feed-editor-surface:empty::before{
  content:attr(data-placeholder);
  color:var(--muted);
  pointer-events:none;
}
.feed-editor-surface p,
.feed-editor-surface div{margin:0 0 .7em}
.feed-editor-surface p:last-child,
.feed-editor-surface div:last-child{margin-bottom:0}
.feed-editor-surface ul{margin:.55em 0;padding-left:1.5em}
.feed-editor-surface li+li{margin-top:.2em}
.feed-editor-surface a{color:var(--accent-strong);text-decoration:underline;text-underline-offset:2px}
.feed-editor-emoji{position:relative}
.feed-editor-emoji-picker{
  position:absolute;
  z-index:80;
  top:calc(100% + 6px);
  left:0;
  display:grid;
  grid-template-columns:repeat(6,34px);
  gap:3px;
  padding:7px;
  border:1px solid var(--border);
  border-radius:9px;
  background:var(--surface);
  box-shadow:0 12px 30px rgba(0,0,0,.24);
}
.feed-editor-emoji-picker[hidden]{display:none}
.feed-editor-emoji-picker button{
  width:34px;
  height:34px;
  min-height:34px;
  margin:0;
  padding:0;
  border:0;
  border-radius:5px;
  background:transparent;
  font-size:20px;
  cursor:pointer;
}
.feed-editor-emoji-picker button:hover,
.feed-editor-emoji-picker button:focus-visible{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.feed-rich-editor .hint{margin-top:6px}
.feed-post-body p,
.feed-post-body div{margin-top:0}
.feed-post-body p{margin-bottom:.7em}
.feed-post-body p:last-child{margin-bottom:0}
.feed-post-body ul,
.feed-post-body .feed-body-list{margin:.55em 0 .55em 1.25em;padding:0}
.feed-post-body li+li{margin-top:.2em}
@media(max-width:520px){
  .feed-editor-emoji-picker{grid-template-columns:repeat(5,34px);max-width:calc(100vw - 52px)}
  .feed-editor-surface{min-height:170px}
}

/* Composer hierarchy: title and body are the primary task. */
.feed-composer-primary{display:grid;gap:12px}
.feed-composer-title{margin:0;font-weight:750}
.feed-composer-title input{
  min-height:58px;
  margin-top:7px;
  padding:10px 15px;
  border-width:2px;
  border-radius:12px;
  font-size:clamp(20px,2.2vw,26px);
  font-weight:750;
  line-height:1.2;
}
.feed-composer-title input::placeholder{font-weight:500}
.feed-composer-text-label{margin:2px 0 -5px;font-weight:750}
.feed-composer-primary .feed-editor-surface{
  min-height:300px;
  max-height:56vh;
  padding:16px 18px;
  font-size:16px;
  line-height:1.6;
}
.feed-composer-secondary{margin-top:14px}
.feed-composer-secondary .feed-link-preview-option{margin:0;color:var(--muted);font-size:13px}
.feed-attachment-settings{
  margin:16px 0 6px;
  border:1px solid var(--border);
  border-radius:10px;
  background:color-mix(in srgb,var(--surface) 96%,var(--accent) 4%);
}
.feed-attachment-settings>summary{
  padding:12px 14px;
  color:var(--accent-strong);
  font-weight:750;
  cursor:pointer;
  list-style-position:inside;
}
.feed-attachment-settings[open]>summary{border-bottom:1px solid var(--border)}
.feed-attachment-options{padding:4px 14px 14px}
.feed-attachment-options>label{margin-top:14px}
.feed-attachment-options .media-picker{margin:14px 0 0}
@media(max-width:600px){
  .feed-composer-title input{min-height:52px;font-size:20px}
  .feed-composer-primary .feed-editor-surface{min-height:250px;padding:14px}
}