:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #25313a; background: #f5f7f8; font-size: 16px; }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.7; }
button, input, textarea { font: inherit; font-size: 16px; }
button { border: 0; border-radius: 8px; padding: .7rem 1rem; color: #fff; background: #176b5b; cursor: pointer; font-weight: 700; }
button:disabled { opacity: .55; cursor: wait; }
button.secondary { color: #355; background: #e7eeec; }
.login-card { width: min(92%, 430px); margin: 12vh auto; padding: 2rem; background: #fff; border-radius: 14px; box-shadow: 0 4px 20px #26323818; }
label { display: block; margin-top: .75rem; font-weight: 700; }
input, textarea { width: 100%; border: 1px solid #abb9b5; border-radius: 8px; padding: .7rem; background: #fff; color: #25313a; }
.login-card button { width: 100%; margin-top: 1rem; }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.5rem; background: #fff; border-bottom: 1px solid #dce3e1; }
h1, h2, h3, p { margin-top: 0; }
.topbar h1 { font-size: 1.25rem; margin-bottom: 0; }
.topbar p { margin: .1rem 0 0; color: #687773; font-size: .9rem; }
.layout { display: grid; grid-template-columns: minmax(260px, 330px) minmax(0, 760px); max-width: 1120px; margin: 0 auto; }
.sidebar { padding: 1rem; border-right: 1px solid #dce3e1; }
.group-title { margin: 1rem .35rem .35rem; font-size: .85rem; color: #687773; }
.message-link { display: block; width: 100%; text-align: left; color: #25313a; background: transparent; padding: .7rem; margin-bottom: .25rem; font-weight: 400; }
.message-link.active { background: #dcece8; }
.message-link small { display: block; color: #687773; }
.badge { display: inline-block; margin-top: .25rem; padding: 0 .45rem; border-radius: 999px; background: #f6e4a4; font-size: .78rem; }
.badge.done { background: #cae9d9; }
.content { min-width: 0; padding: 1.5rem 2rem 4rem; background: #fff; }
.eyebrow { color: #687773; margin-bottom: .2rem; }
.tabs { display: flex; gap: .4rem; border-bottom: 1px solid #dce3e1; margin: 1.25rem 0; }
.tabs button { color: #50615d; background: transparent; border-radius: 8px 8px 0 0; }
.tabs button[aria-selected="true"] { color: #176b5b; background: #dcece8; }
.message-body { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.9; }
.placeholder { color: #899692; }
.actions { display: flex; gap: .6rem; flex-wrap: wrap; margin: 1.5rem 0; }
.editor { margin-top: 1rem; padding: 1rem; background: #f5f8f7; border-radius: 10px; }
#edit-body { min-height: 15rem; line-height: 1.7; resize: vertical; }
.error { color: #b42318; min-height: 1.5em; }
.proposals { margin-top: 2.5rem; border-top: 1px solid #dce3e1; padding-top: 1.5rem; }
.proposal { padding: 1rem 0; border-bottom: 1px solid #e5eae8; }
.proposal-meta { color: #687773; font-size: .9rem; }
.status { color: #8a5b00; font-weight: 700; }
.status.done { color: #18744d; }
.diff { white-space: pre-wrap; overflow-wrap: anywhere; padding: .75rem; background: #f5f7f8; border-radius: 6px; font-family: ui-monospace, monospace; font-size: .9rem; }
.diff-del { color: #a22; background: #fde8e7; }.diff-add { color: #176b37; background: #e3f5e8; }
.toast { position: fixed; right: 1rem; bottom: 1rem; max-width: calc(100% - 2rem); padding: .8rem 1rem; color: #fff; background: #254b43; border-radius: 8px; opacity: 0; pointer-events: none; transition: opacity .2s; }
.toast.show { opacity: 1; }
@media (max-width: 700px) {
  .topbar { align-items: flex-start; padding: .8rem 1rem; }.topbar button { padding: .5rem .65rem; font-size: .9rem; }
  .layout { display: block; }.sidebar { border-right: 0; border-bottom: 1px solid #dce3e1; padding: .5rem; max-height: 35vh; overflow: auto; }
  .content { padding: 1.25rem 1rem 3rem; }.message-link { padding: .6rem; }
}
