/* Messages */
.pf-tabs { display: flex; gap: .4rem; margin: 0 0 1.4rem; border-bottom: 1px solid rgba(18,53,36,.12); }
.pf-tabs [role="tab"] { font: 700 .86rem var(--font-body); background: none; border: 0; border-bottom: 3px solid transparent; padding: .8rem 1.1rem; color: var(--ink-soft, #3f5548); cursor: pointer; display: inline-flex; align-items: center; gap: .5rem; }
.pf-tabs [role="tab"][aria-selected="true"] { color: var(--ivy-black, #081912); border-bottom-color: var(--salmon-deep, #c14f3d); }
.pf-tabs [role="tab"]:focus-visible { outline: 3px solid rgba(193,79,61,.5); outline-offset: -3px; }
.pf-badge { min-width: 20px; height: 20px; padding: 0 .4em; border-radius: 999px; background: #d93025; color: #fff; font-size: .7rem; font-weight: 800; display: inline-grid; place-items: center; }
.pf-badge[hidden], .mg-app[hidden], #pf-view[hidden] { display: none !important; }

.mg-app { max-width: 1100px; }
.mg-shell { display: grid; grid-template-columns: minmax(250px, 340px) 1fr; background: #fff; border: 1px solid rgba(18,53,36,.1); border-radius: 18px; box-shadow: 0 22px 46px -30px rgba(8,25,18,.38); overflow: hidden; min-height: 560px; }
.mg-side { border-right: 1px solid rgba(18,53,36,.1); display: flex; flex-direction: column; min-width: 0; background: var(--pearl, #faf6ee); }
.mg-side-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .9rem 1rem; border-bottom: 1px solid rgba(18,53,36,.08); }
.mg-link { background: none; border: 0; padding: .3em .1em; font: 700 .78rem var(--font-body); color: var(--ivy, #123524); cursor: pointer; text-decoration: underline; text-decoration-color: rgba(193,79,61,.5); text-underline-offset: 3px; }
.mg-link:hover { color: var(--salmon-deep, #c14f3d); }
.mg-convos { list-style: none; margin: 0; padding: 0; overflow-y: auto; max-height: 620px; }
.mg-convo { position: relative; width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px solid rgba(18,53,36,.07); padding: .85rem 1rem; display: flex; flex-direction: column; gap: .2rem; cursor: pointer; font: inherit; color: inherit; }
.mg-convo:hover, .mg-convo.is-open { background: #fff; }
.mg-convo.is-open { box-shadow: inset 3px 0 0 var(--salmon-deep, #c14f3d); }
.mg-convo-top { display: flex; justify-content: space-between; gap: .6rem; align-items: baseline; }
.mg-convo strong { font-size: .92rem; color: var(--ivy-black, #081912); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mg-convo time { font-size: .7rem; color: var(--ink-soft, #3f5548); white-space: nowrap; }
.mg-convo-prev { font-size: .82rem; color: var(--ink-soft, #3f5548); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 1.6rem; }
.mg-convo.is-unread strong, .mg-convo.is-unread .mg-convo-prev { color: var(--ivy-black, #081912); font-weight: 800; }
.mg-unread { position: absolute; right: .9rem; bottom: .8rem; min-width: 20px; height: 20px; padding: 0 .4em; border-radius: 999px; background: #d93025; color: #fff; font-size: .7rem; font-weight: 800; display: grid; place-items: center; }
.mg-none { padding: 1.2rem 1rem; color: var(--ink-soft, #3f5548); font-size: .9rem; list-style: none; }
.mg-thread { display: flex; flex-direction: column; min-width: 0; min-height: 560px; }
.mg-empty { margin: auto; text-align: center; max-width: 36ch; padding: 2rem 1rem; color: var(--ink-soft, #3f5548); }
.mg-empty h3 { font-family: var(--font-display); color: var(--ivy-black, #081912); margin: 0 0 .5rem; }
.mg-head { display: flex; align-items: center; gap: .8rem; padding: .9rem 1.2rem; border-bottom: 1px solid rgba(18,53,36,.1); }
.mg-head-txt { flex: 1; min-width: 0; }
.mg-head h3 { margin: 0; font-family: var(--font-display); font-size: 1.1rem; color: var(--ivy-black, #081912); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mg-head p { margin: .15rem 0 0; font-size: .78rem; color: var(--ink-soft, #3f5548); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mg-tools { display: flex; gap: .9rem; flex-wrap: wrap; justify-content: flex-end; }
.mg-back { display: none; background: none; border: 1px solid rgba(18,53,36,.2); border-radius: 50%; width: 34px; height: 34px; cursor: pointer; font-size: 1rem; }
.mg-msgs { flex: 1; overflow-y: auto; padding: 1rem 1.2rem; display: flex; flex-direction: column; gap: .8rem; max-height: 520px; }
.mg-day { align-self: center; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft, #3f5548); padding: .2rem .8rem; background: var(--pearl, #faf6ee); border-radius: 999px; }
.mg-row { display: flex; flex-direction: column; gap: .25rem; align-items: flex-start; max-width: 100%; }
.mg-row.is-mine { align-items: flex-end; }
.mg-meta { font-size: .72rem; color: var(--ink-soft, #3f5548); font-weight: 600; }
.mg-meta time { font-weight: 400; }
.mg-bubble { max-width: min(560px, 88%); background: var(--pearl, #faf6ee); border: 1px solid rgba(18,53,36,.08); border-radius: 16px 16px 16px 4px; padding: .65rem .9rem; display: flex; flex-direction: column; gap: .5rem; }
.mg-row.is-mine .mg-bubble { background: #e8f2d6; border-color: transparent; border-radius: 16px 16px 4px 16px; }
.mg-bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--ink, #171f19); font-size: .95rem; line-height: 1.5; }
.mg-img img { display: block; max-width: 240px; max-height: 240px; border-radius: 10px; }
.mg-file { display: inline-flex; flex-direction: column; gap: .1rem; padding: .5rem .7rem; border-radius: 10px; background: #fff; border: 1px solid rgba(18,53,36,.12); color: var(--ivy, #123524); font-weight: 600; font-size: .86rem; text-decoration: none; overflow-wrap: anywhere; }
.mg-file small { font-weight: 400; color: var(--ink-soft, #3f5548); }
.mg-file.is-gone { color: var(--ink-soft, #3f5548); font-style: italic; }
.mg-acts { display: flex; gap: .8rem; align-items: center; flex-wrap: wrap; opacity: 0; transition: opacity .2s; }
.mg-row:hover .mg-acts, .mg-row:focus-within .mg-acts, .mg-acts:has(.mg-report) { opacity: 1; }
@media (hover: none) { .mg-acts { opacity: 1; } }
.mg-act { background: none; border: 0; padding: 0; font: 600 .72rem var(--font-body); color: var(--ink-soft, #3f5548); cursor: pointer; text-decoration: underline; }
.mg-act:hover { color: var(--salmon-deep, #c14f3d); }
.mg-report { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; width: 100%; margin-top: .3rem; }
.mg-ok { font-size: .8rem; font-weight: 600; color: var(--apple-deep, #4f7a24); }
.mg-hint { font-size: .72rem; color: var(--ink-soft, #3f5548); }
.mg-compose { border-top: 1px solid rgba(18,53,36,.1); padding: .8rem 1.2rem 1rem; display: flex; flex-direction: column; gap: .5rem; background: #fff; }
.mg-input { font: 500 .95rem var(--font-body); color: var(--ink, #171f19); border: 1.5px solid rgba(18,53,36,.22); border-radius: 10px; padding: .65em .85em; background: #fff; width: 100%; }
.mg-input:focus { outline: none; border-color: var(--salmon-deep, #c14f3d); box-shadow: 0 0 0 3px rgba(242,145,126,.25); }
.mg-ta { resize: vertical; min-height: 56px; }
.mg-compose-row { display: flex; align-items: center; gap: .9rem; flex-wrap: wrap; justify-content: flex-end; }
.mg-compose-row .mg-hint { margin-right: auto; }
.mg-chips { display: flex; gap: .4rem; flex-wrap: wrap; }
.mg-chip { display: inline-flex; align-items: center; gap: .3rem; background: #e8f2d6; color: var(--apple-deep, #4f7a24); border-radius: 999px; padding: .3em .8em; font-size: .78rem; font-weight: 700; }
.mg-chip small { font-weight: 400; }
.mg-x { background: none; border: 0; cursor: pointer; font-size: 1rem; line-height: 1; color: inherit; padding: 0 .1em; }
.mg-status { margin: 0; min-height: 1.1em; font-size: .82rem; font-weight: 600; color: var(--salmon-deep, #c14f3d); }
.mg-notice { margin: .9rem .2rem 0; font-size: .8rem; color: var(--ink-soft, #3f5548); }
.mg-modal { position: fixed; inset: 0; z-index: 1500; background: rgba(8,25,18,.55); display: grid; place-items: center; padding: 1rem; }
.mg-modal-card { width: 100%; max-width: 460px; max-height: 88vh; overflow-y: auto; background: #fff; border-radius: 16px; border-top: 3px solid var(--gold, #c9a24d); padding: 1.4rem; display: flex; flex-direction: column; gap: .8rem; box-shadow: 0 40px 80px -20px rgba(8,25,18,.5); }
.mg-modal-card h3 { margin: 0; font-family: var(--font-display); color: var(--ivy-black, #081912); }
.mg-results { list-style: none; margin: 0; padding: 0; max-height: 240px; overflow-y: auto; border: 1px solid rgba(18,53,36,.1); border-radius: 10px; }
.mg-pick { width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px solid rgba(18,53,36,.06); padding: .6rem .8rem; cursor: pointer; font: 600 .9rem var(--font-body); color: var(--ink, #171f19); }
.mg-pick:hover, .mg-pick.is-on { background: var(--pearl, #faf6ee); }
.mg-pick.is-on { color: var(--apple-deep, #4f7a24); }
@media (max-width: 760px) {
  .mg-shell { grid-template-columns: 1fr; min-height: 0; }
  .mg-thread { display: none; }
  .mg-thread.is-open { display: flex; }
  .mg-thread.is-open ~ *, .mg-shell:has(.mg-thread.is-open) .mg-side { display: none; }
  .mg-back { display: inline-grid; place-items: center; }
  .mg-tools { width: 100%; justify-content: flex-start; }
  .mg-head { flex-wrap: wrap; }
}

/* admin review */
.mr-h { font-family: var(--font-display); font-size: 1.3rem; color: var(--ivy-black, #081912); margin: 2rem 0 .8rem; }
.mr-h:first-child { margin-top: 0; }
.mr-list { display: grid; gap: .8rem; }
.mr-card { background: #fff; border: 1px solid rgba(18,53,36,.1); border-radius: 14px; padding: 1rem 1.2rem; display: flex; flex-direction: column; gap: .4rem; align-items: flex-start; }
.mr-card.is-done { opacity: .6; }
.mr-quote { margin: 0; padding: .6rem .9rem; background: var(--pearl, #faf6ee); border-radius: 10px; white-space: pre-wrap; overflow-wrap: anywhere; width: 100%; }
.mr-reason { margin: 0; font-size: .86rem; color: var(--ink-soft, #3f5548); }
.mr-find { position: relative; max-width: 420px; margin-bottom: .8rem; }
.mr-find .mg-results { position: absolute; left: 0; right: 0; z-index: 5; background: #fff; box-shadow: 0 18px 36px -18px rgba(8,25,18,.4); }
.mr-thread { margin-top: 1.4rem; background: #fff; border: 1px solid rgba(18,53,36,.1); border-radius: 14px; padding: 1rem 1.2rem; }
.mr-sub { margin: 0 0 .6rem; font-family: var(--font-display); color: var(--ivy-black, #081912); }
.mr-msgs { max-height: 480px; padding: .4rem 0; }
.mr-thread[hidden], .mg-results[hidden] { display: none !important; }