@import url("/shared/breadcrumbs.css?v=e3b1f69a0ab848b7ea6435fa72cbc43d2a0a09ef");
/* Messaging uses the canonical shell, theme, typography and navigation. */
#messagesApp { width:95%; max-width:1200px; margin:2rem auto; color:var(--ink); }
#messagesApp .layout { display:grid; grid-template-columns:minmax(240px,1fr) minmax(0,2fr); gap:1.2rem; align-items:start; }
#messagesApp section { background:var(--paper); border:1px solid var(--line,#d4bb83); border-radius:16px; padding:1.2rem; min-width:0; }
#messagesApp h1 { margin:1.4rem 0 .7rem; }
#messagesApp h2 { font-size:1.25rem; margin:0 0 1rem; }
#messagesApp button,#messagesApp input,#messagesApp textarea,#messagesApp select { font:inherit; box-sizing:border-box; max-width:100%; border:1px solid var(--line,#c6a05b); border-radius:8px; padding:.65rem .85rem; background:var(--paper); color:var(--ink); }
#messagesApp button { font-weight:600; font-size:.95rem; line-height:1.25; padding:10px 16px; cursor:pointer; min-height:44px; margin:.25rem .35rem .25rem 0; }
#messagesApp button[type=submit] { background:var(--cta,#946526); color:var(--cta-ink,#fff9e8); border-color:var(--cta,#946526); }
#messagesApp button:disabled { opacity:.55; cursor:default; }
#messagesApp label { display:block; margin:.8rem 0 .35rem; }
#messagesApp input,#messagesApp textarea { width:100%; }
#messagesApp input[readonly] { background:transparent; border-style:dashed; }
#messagesApp textarea { min-height:100px; resize:vertical; }
#messagesApp ul { list-style:none; padding:0; }
#messagesApp article { padding:.85rem; margin:.75rem 0; border:1px solid var(--line,#d4bb83); border-radius:12px; }
#messagesApp article.mine { margin-inline-start:8%; border-inline-start:4px solid #946526; }
#messagesApp .body { white-space:pre-wrap; overflow-wrap:anywhere; }
#messagesApp time { font-size:.8rem; opacity:.75; }
#messagesApp p { overflow-wrap:anywhere; }
#messagesApp #status:empty { display:none; }
#messagesApp [role=alert] { color:var(--danger,#b33322); }
#messagesApp dialog { width:min(95%,600px); border-radius:16px; background:var(--paper); color:var(--ink); }
#messagesApp :focus-visible { outline:3px solid #946526; outline-offset:3px; }
@media(max-width:680px) { #messagesApp { margin:1rem auto; } #messagesApp .layout { grid-template-columns:1fr; } #messagesApp section { padding:1rem; } }

#messagesApp section { background:var(--paper-bright,#fff9e8); border-color:#b89b62; box-shadow:0 3px 12px #4e371412; }
#messagesApp input,#messagesApp textarea { background:var(--paper-bright,#fffdf6); }
#messagesApp .message-search-row { display:flex; align-items:stretch; gap:.5rem; }
#messagesApp .message-search-row input { min-width:0; flex:1; }
#messagesApp .message-search-row button { flex:0 0 auto; margin:0; }
#messagesApp .message-actions { display:flex; flex-wrap:wrap; gap:.5rem; }
#messagesApp .message-actions button { margin:0; }
#messagesApp article { background:var(--paper,#f8edd2); }
#messagesApp article.mine { background:color-mix(in srgb,var(--paper-bright) 90%,#946526); }

.account-panel #messagesApp { width:100%; max-width:none; margin:0; }
.account-panel #messagesApp > h2 { font-size:1.8rem; margin:1rem 0; }

#messagesApp .layout { grid-template-columns:minmax(300px,360px) minmax(0,1fr); }
#messagesApp .message-search-row { max-width:520px; }
#messagesApp .conversation-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:.5rem 0; padding:10px 14px; }
#messagesApp .conversation-row > p:empty { display:none; }
#messagesApp .conversation-row > p { margin:0; font-size:.85rem; }
#messagesApp .conversation-row .message-actions { margin-inline-start:auto; }
#messagesApp .conversation-row button { padding:8px 12px; font-size:.85rem; }
#messagesApp .conversation-row.is-unread { border-inline-start:5px solid #A53D26; background:var(--paper-bright,#fff9e8); }
#messagesApp .unread-label { background:#A53D26; color:#FFF9E8; border-radius:20px; padding:4px 10px; font-size:.8rem; font-weight:700; white-space:nowrap; }
@media(max-width:600px){ #messagesApp .conversation-row .message-actions { width:100%; margin:0; } }

/* A bounded inbox rail keeps the open conversation beside it. */
#messagesApp .layout > section:first-child { position:sticky; top:90px; max-height:calc(100vh - 120px); overflow:auto; }
#messagesApp .conversation-row { gap:8px; padding:12px; }
#messagesApp .conversation-row > strong { flex:1; overflow-wrap:anywhere; }
#messagesApp .conversation-row > time { flex-basis:100%; }
#messagesApp .conversation-row > p:not(:empty) { flex-basis:100%; }
#messagesApp .conversation-row .message-actions { width:100%; margin:4px 0 0; gap:6px; }
#messagesApp .conversation-row button { padding:8px; font-size:.8rem; }
#messagesApp .conversation-row.is-active { outline:2px solid var(--cta,#946526); outline-offset:1px; }
#messagesApp .conversation-row.is-unread > strong { font-weight:800; }
@media(max-width:800px) {
  #messagesApp .layout { grid-template-columns:minmax(0,1fr); }
  #messagesApp .layout > section:first-child { position:static; max-height:320px; }
}

/* Account messaging: use the site's violet/green accents and opaque controls. */
#messagesApp { --message-violet:#62417A; --message-violet-hover:#4E3363; }
#messagesApp .layout > section { border-radius:var(--radius-lg,12px); border-color:var(--line); box-shadow:var(--shadow-card); }
#messagesApp .layout > section:first-child { border-top:4px solid var(--premium); }
#messagesApp .layout > section:last-child { border-top:4px solid var(--game-binary); }
#messagesApp .layout > section > h2 { padding-bottom:12px; border-bottom:1px solid var(--hairline); }
#messagesApp button { background:var(--paper-bright); border-color:var(--cta); color:var(--ink); box-shadow:var(--shadow-1); transition:background .15s,border-color .15s; }
#messagesApp button:hover:not(:disabled) { background:var(--paper-shade); border-color:var(--ink); }
#messagesApp button[type=submit],#messagesApp .message-actions button:first-child { background:var(--cta); border-color:var(--cta); color:var(--cta-ink); }
#messagesApp button[type=submit]:hover:not(:disabled),#messagesApp .message-actions button:first-child:hover:not(:disabled) { background:var(--cta-hover); border-color:var(--cta-hover); }
#messagesApp .conversation-row { background:var(--paper-bright); border-color:var(--hairline); border-radius:10px; box-shadow:var(--shadow-1); }
#messagesApp .conversation-row.is-active { background:color-mix(in srgb,var(--premium) 16%,var(--paper-bright)); border-color:var(--premium); border-inline-start:4px solid var(--premium); outline:none; }
#messagesApp .conversation-row.is-active .message-actions button:first-child { background:var(--message-violet); border-color:var(--message-violet); color:#FFF9E8; }
#messagesApp .conversation-row.is-active .message-actions button:first-child:hover:not(:disabled) { background:var(--message-violet-hover); }
#messagesApp .conversation-row.is-unread { background:color-mix(in srgb,var(--game-binary) 14%,var(--paper-bright)); border-inline-start:4px solid var(--game-binary); }
#messagesApp .conversation-row.is-active.is-unread { border-color:var(--premium); }
#messagesApp .conversation-row .message-actions button:last-child { background:var(--paper-bright); border-color:var(--bad); color:var(--ink); }
#messagesApp .layout > section:last-child > article { margin:12px 8% 12px 0; padding:14px 16px; border-color:color-mix(in srgb,var(--game-binary) 50%,var(--paper-bright)); border-inline-start:3px solid var(--game-binary); background:color-mix(in srgb,var(--game-binary) 13%,var(--paper-bright)); border-radius:12px; }
#messagesApp .layout > section:last-child > article.mine { margin:12px 0 12px 8%; border-inline-start-width:1px; border-inline-end:3px solid var(--premium); border-color:color-mix(in srgb,var(--premium) 50%,var(--paper-bright)); background:color-mix(in srgb,var(--premium) 14%,var(--paper-bright)); }
#messagesApp .body { margin:10px 0 4px; line-height:1.5; }
#messagesApp time { color:var(--muted); opacity:1; }
#messagesApp .layout > section:last-child > article > button { font-size:.78rem; padding:6px 10px; min-height:44px; margin:8px 0 0; box-shadow:none; }
#messagesApp .layout > section:last-child > form { margin-top:20px; padding-top:12px; border-top:1px solid var(--hairline); }
#messagesApp textarea { background:var(--paper-bright); border:1px solid var(--cta); box-shadow:inset 0 1px 3px #0000000a; }
#messagesApp textarea:focus-visible { outline-color:var(--premium); }
@media(max-width:800px) {
  #messagesApp .layout { gap:16px; }
  #messagesApp .layout > section { padding:14px; }
  #messagesApp .layout > section:last-child > article { padding:12px; margin-inline-end:5%; }
  #messagesApp .layout > section:last-child > article.mine { margin-inline-start:5%; margin-inline-end:0; }
}

/* Compact inbox rows above the selected thread, without a nested scroll area. */
#messagesApp .layout { grid-template-columns:minmax(0,1fr); }
#messagesApp .layout > section:first-child { position:static; max-height:none; overflow:visible; }
#messagesApp .conversation-list { margin:0; }
#messagesApp .conversation-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; padding:6px 10px; margin:0; border:0; border-bottom:1px solid var(--hairline); border-radius:0; box-shadow:none; }
#messagesApp .conversation-row:last-child { border-bottom:0; }
#messagesApp .conversation-row.is-active,#messagesApp .conversation-row.is-unread { border-inline-start:3px solid var(--premium); border-radius:6px; }
#messagesApp .conversation-row.is-unread { border-inline-start-color:var(--game-binary); }
#messagesApp .conversation-identity { min-width:0; }
#messagesApp button.conversation-name { display:block; width:100%; text-align:start; margin:0; padding:3px 0; min-height:32px; border:0; background:transparent; color:var(--ink); box-shadow:none; font-size:.95rem; overflow-wrap:anywhere; }
#messagesApp button.conversation-name:hover:not(:disabled) { color:var(--premium); background:transparent; text-decoration:underline; }
#messagesApp .conversation-meta { display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; font-size:.75rem; color:var(--muted); }
#messagesApp .conversation-meta time { font-size:inherit; }
#messagesApp .conversation-meta .unread-label { font-size:.65rem; padding:2px 6px; }
#messagesApp .conversation-row .message-actions { width:auto; margin:0; flex-wrap:nowrap; gap:4px; }
#messagesApp .conversation-row .message-actions button.conversation-action { display:grid; place-items:center; width:44px; min-height:44px; padding:0; margin:0; border-radius:8px; background:var(--paper-bright); border-color:var(--cta); color:var(--ink); }
#messagesApp .conversation-action span,#messagesApp .conversation-action svg { display:block; }
#messagesApp .conversation-row .message-actions button.conversation-action:hover:not(:disabled) { background:var(--paper-shade); border-color:var(--premium); }
#messagesApp .conversation-row .message-actions button.conversation-block { border-color:var(--bad); }
@media(max-width:600px) { #messagesApp .conversation-row { padding:6px; } }