.forum-dialog {
  --forum-ink: var(--ink, #102452);
  --forum-paper: var(--paper, #fffaf0);
  --forum-blue: var(--cobalt, #1452f5);
  --forum-line: #c8ced8;
  position: fixed; inset: 0; box-sizing: border-box;
  width: 100vw; height: 100dvh; max-width: none; max-height: none;
  margin: 0; padding: 18px 26px 0; border: 0; border-radius: 0;
  background: var(--forum-paper); color: var(--forum-ink);
  font: 16px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif;
  overflow: hidden;
}
.forum-dialog[open] { display: flex; flex-direction: column; }
.forum-dialog::backdrop { background: #10245280; }
.forum-dialog *, .forum-dialog *::before, .forum-dialog *::after { box-sizing: border-box; }
.forum-dialog [hidden] { display: none !important; }
.forum-dialog button, .forum-dialog input, .forum-dialog select, .forum-dialog textarea { font: inherit; color: inherit; }
.forum-dialog :where(button, input, select) { min-height: 44px; min-width: 44px; }
.forum-dialog button { cursor: pointer; }
.forum-dialog button:disabled { cursor: default; opacity: .62; }
.forum-dialog :focus-visible { outline: 3px solid var(--forum-blue); outline-offset: 3px; }
.forum-dialog h1, .forum-dialog h2, .forum-dialog h3, .forum-dialog h4, .forum-dialog p { margin: 0; }
.forum-header { display: flex; flex: 0 0 auto; align-items: center; gap: 28px; min-height: 66px; padding-bottom: 14px; border-bottom: 2px solid var(--forum-ink); }
.forum-return, .forum-secondary, .forum-compose-back, .forum-compose-cancel { border: 1.5px solid var(--forum-ink); background: transparent; border-radius: 7px; padding: 9px 18px; font-weight: 750 !important; }
.forum-return { white-space: nowrap; font-size: 21px !important; min-height: 50px; }
.forum-return > :first-child { margin-left: 4px; }
.forum-heading { display: flex; align-items: baseline; gap: 22px; flex: 1; min-width: 0; }
.forum-heading h1 { font-size: clamp(25px, 2.4vw, 38px); font-weight: 900; letter-spacing: .04em; white-space: nowrap; }
.forum-heading p { color: #52658b; font-size: 17px; white-space: nowrap; }
.forum-publish { flex: 0 0 auto; border: 1.5px solid var(--forum-blue); border-radius: 8px; background: var(--forum-blue); color: white !important; font-size: 21px !important; font-weight: 800 !important; padding: 11px 24px; }
.forum-publish:hover { background: #0940d5; }
.forum-filters { display: flex; flex: 0 0 auto; gap: 16px; padding: 16px 0 18px; align-items: stretch; }
.forum-filters label:not(.forum-search), .forum-extra-filters label { display: flex; align-items: center; border: 1.5px solid var(--forum-line); border-radius: 7px; background: #ffffff70; padding: 0 13px; gap: 5px; white-space: nowrap; font-weight: 650; }
.forum-search { flex: 1; min-width: 190px; }
.forum-search input { border: 1.5px solid var(--forum-line); background: #fff; border-radius: 7px; width: 100%; padding: 11px 16px; min-height: 48px; }
.forum-filters select, .forum-extra-filters select { min-width: 90px; max-width: 210px; padding: 8px 4px; border: 0; background: transparent; }
.forum-more { border: 0; background: transparent; white-space: nowrap; padding: 8px 10px; font-weight: 750 !important; }
.forum-more[aria-expanded=true] { background: #e1e9ff; border-radius: 6px; }
.forum-extra-filters { display: flex; gap: 16px; margin: -6px 0 14px; align-items: center; }
.forum-clear { border: 0; background: transparent; color: #2450c7 !important; padding: 6px; text-decoration: underline; }
.forum-storage-warning { flex: 0 0 auto; background: #fff0ce; padding: 7px 12px; border: 1px solid #d8b35c; border-radius: 5px; margin-bottom: 8px !important; font-size: 13px; }
.forum-body { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(330px, 1fr); gap: 24px; }
.forum-list-panel { min-height: 0; display: flex; flex-direction: column; }
.forum-list-heading { display: flex; align-items: baseline; gap: 18px; margin-bottom: 12px; flex: 0 0 auto; }
.forum-list-heading h2, .forum-detail-heading h2 { font-size: 26px; line-height: 1.3; font-weight: 850; }
.forum-result-count { font-size: 14px; color: #647493; }
.forum-list { flex: 1; min-height: 0; overflow: auto; scrollbar-gutter: stable; padding-right: 6px; }
.forum-post { display: flex; text-align: left; width: 100%; min-height: 190px; gap: 23px; padding: 18px 16px; background: transparent; border: 0; border-bottom: 1px solid var(--forum-line); position: relative; }
.forum-post:first-child { border-top: 1px solid var(--forum-line); }
.forum-post.is-selected { background: #effbf4; box-shadow: inset 5px 0 #12a783; border: 1px solid #bdebd2; border-radius: 7px; }
.forum-post:hover { background: #eef6f0; }
.forum-post-image { display: block; flex: 0 0 32%; width: 32%; align-self: stretch; object-fit: cover; min-height: 150px; max-height: 190px; border-radius: 5px; image-rendering: auto; }
.forum-post-content { flex: 1; min-width: 0; }
.forum-post-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.forum-author { display: flex; align-items: center; gap: 8px; min-width: 0; flex-wrap: wrap; }
.forum-avatar { display: block; flex: 0 0 36px; width: 36px; height: 40px; image-rendering: pixelated; background-repeat: no-repeat; }
.forum-post-origin { display: block; font-size: 11px; color: #607390; font-weight: 500; }
.forum-author strong { font-size: 16px; }
.forum-post h3 { font-size: clamp(19px, 1.7vw, 26px); font-weight: 850; line-height: 1.4; margin: 8px 0 10px; }
.forum-status { font-size: 13px; background: #c8f2dd; padding: 5px 10px; border-radius: 7px; white-space: nowrap; color: #075f52; font-weight: 800; }
.forum-status-full, .forum-status-closed, .forum-status-expired { color: #536281; background: #e5e8ee; }
.forum-post-meta { display: flex; flex-wrap: wrap; gap: 7px 15px; align-items: center; font-size: 14px; }
.forum-activity { display: inline-block; padding: 3px 10px; border-radius: 6px; background: #cef2de; color: #15594e; font-weight: 750; font-size: 13px; }
.forum-activity.is-game { background: #d7e7ff; color: #0643e1; }
.forum-post-excerpt { color: #52658b; font-size: 15px; margin-top: 9px !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.forum-detail { border-left: 1px solid var(--forum-line); padding-left: 24px; overflow: auto; min-height: 0; scrollbar-gutter: stable; }
.forum-detail-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.forum-detail-back { display: none; }
.forum-detail-card { padding: 13px 14px 18px; background: #ffffff85; border-radius: 7px; }
.forum-detail-author { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.forum-detail h3 { font-size: 23px; line-height: 1.45; font-weight: 850; margin: 12px 0 10px; overflow-wrap: anywhere; }
.forum-detail-image { display: block; width: 100%; height: clamp(135px, 23vh, 240px); object-fit: cover; border-radius: 5px; margin-bottom: 6px; }
.forum-detail-data { display: grid; grid-template-columns: 80px minmax(0,1fr); gap: 8px 13px; font-size: 15px; margin: 15px 0 21px; }
.forum-detail-data dt { color: #61708e; }
.forum-detail-data dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.forum-apply { position: sticky; bottom: 0; z-index: 2; display: block; width: 100%; border: 1.5px solid var(--forum-ink); border-radius: 7px; padding: 11px 7px; background: var(--forum-paper); box-shadow: 0 -6px 12px var(--forum-paper); font-size: 18px !important; font-weight: 850 !important; }
.forum-apply:hover:not(:disabled) { background: #e4edff; }
.forum-local-boundary { margin: 9px 0 15px !important; color: #657390; font-size: 12px; }
.forum-comments { padding-top: 16px; border-top: 1px solid var(--forum-line); }
.forum-comments h4 { font-size: 16px; margin-bottom: 11px; }
.forum-muted { font-size: 13px; color: #6a7893; margin-bottom: 12px !important; }
.forum-comment { margin: 10px 0; padding-bottom: 10px; border-bottom: 1px solid #e4e8ec; }
.forum-comment strong { font-size: 14px; }
.forum-comment span { margin-left: 9px; color: #647493; font-size: 11px; }
.forum-comment p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; margin-top: 5px !important; }
.forum-comment-form label { font-size: 13px; display: block; }
.forum-comment-form textarea { display: block; width: 100%; border: 1px solid #aeb9ca; padding: 9px; background: white; border-radius: 5px; margin: 6px 0 9px; resize: vertical; }
.forum-comment-form button { font-size: 13px; padding: 7px 12px; }
.forum-footer { text-align: center; font-size: 12px; color: #6a7893; padding: 12px 0; flex: 0 0 auto; }
.forum-empty, .forum-detail-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; padding: 40px 20px; min-height: 240px; text-align: center; }
.forum-empty p, .forum-detail-empty { color: #647493; }
.forum-composer { flex: 1; min-height: 0; overflow: auto; width: min(900px,100%); margin: 0 auto; padding: 22px 10px; }
.forum-compose-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.forum-compose-heading h2 { font-size: 27px; }
.forum-compose-boundary { margin: 12px 0 20px !important; color: #52658b; }
.forum-compose-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 22px; }
.forum-compose-form label { display: flex; flex-direction: column; gap: 7px; font-size: 14px; font-weight: 650; }
.forum-compose-form input, .forum-compose-form select, .forum-compose-form textarea { width: 100%; min-width: 0; border: 1px solid #aeb9ca; padding: 10px; background: white; border-radius: 5px; }
.forum-compose-form textarea { resize: vertical; }
.forum-field-wide { grid-column: 1 / -1; }
.forum-compose-image img { display: block; max-height: 130px; max-width: 100%; object-fit: contain; }
.forum-compose-error { color: #a92d3f; min-height: 1em; }
.forum-compose-actions { display: flex; justify-content: flex-end; gap: 15px; }
.forum-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 1200px) {
  .forum-dialog { padding: 12px 18px 0; }
  .forum-heading p { display: none; }
  .forum-header { gap: 20px; }
  .forum-filters { gap: 9px; }
  .forum-filters label:not(.forum-search) { padding: 0 8px; font-size: 14px; }
  .forum-filters select { min-width: 60px; max-width: 140px; }
  .forum-body { grid-template-columns: minmax(0,1.35fr) minmax(310px,1fr); gap: 16px; }
  .forum-detail { padding-left: 16px; }
  .forum-post { gap: 14px; padding: 14px 12px; min-height: 177px; }
  .forum-post-image { flex-basis: 31%; width: 31%; max-height: 170px; }
  .forum-post-origin { width: 100%; }
  .forum-author { gap: 3px 7px; }
  .forum-post .forum-avatar { display: none; }
  .forum-post-head { align-items: flex-start; }
  .forum-status { font-size: 11px; padding: 4px 6px; }
  .forum-post-meta { font-size: 12px; gap: 6px 10px; }
  .forum-list-heading { gap: 10px; }
  .forum-list-heading h2, .forum-detail-heading h2 { font-size: 23px; }
  .forum-result-count { font-size: 12px; }
  .forum-detail-card { padding: 10px; }
}
@media (max-width: 950px) and (min-width: 681px) {
  .forum-dialog { padding: 9px 14px 0; font-size: 14px; }
  .forum-header { min-height: 48px; padding-bottom: 8px; gap: 18px; }
  .forum-return { min-height: 44px; font-size: 17px !important; padding: 5px 12px; }
  .forum-publish { font-size: 17px !important; padding: 7px 16px; }
  .forum-heading h1 { font-size: 26px; }
  .forum-filters { padding: 10px 0; gap: 8px; }
  .forum-search { min-width: 160px; }
  .forum-search input { min-height: 44px; padding: 7px 10px; }
  .forum-filters label:not(.forum-search) { font-size: 12px; padding: 0 5px; gap: 2px; }
  .forum-filters select { max-width: 98px; min-width: 44px; padding: 4px 1px; }
  .forum-more { font-size: 12px !important; padding: 5px; }
  .forum-body { grid-template-columns: minmax(0,1.2fr) minmax(290px,1fr); gap: 13px; }
  .forum-detail { padding-left: 13px; }
  .forum-list-heading h2, .forum-detail-heading h2 { font-size: 20px; }
  .forum-post { gap: 12px; padding: 12px 9px; min-height: 153px; }
  .forum-post-image { min-height: 130px; max-height: 160px; }
  .forum-post h3 { font-size: 18px; margin: 5px 0 7px; }
  .forum-post-excerpt { font-size: 12px; }
  .forum-author strong { font-size: 13px; }
  .forum-status { font-size: 10px; white-space: normal; }
  .forum-detail-heading { margin-bottom: 9px; }
  .forum-detail h3 { font-size: 19px; }
  .forum-detail-image { height: 130px; }
  .forum-detail-data { font-size: 13px; grid-template-columns: 64px 1fr; gap: 6px 10px; }
  .forum-footer { padding: 7px 0; font-size: 10px; }
}
@media (max-width: 680px) {
  .forum-dialog { padding: 10px 12px 0; }
  .forum-header { gap: 8px; min-height: 48px; padding-bottom: 10px; }
  .forum-heading h1 { font-size: 21px; letter-spacing: 0; }
  .forum-return { font-size: 12px !important; min-height: 44px; padding: 6px 7px; }
  .forum-publish { font-size: 12px !important; padding: 8px; }
  .forum-filters { flex-wrap: wrap; gap: 8px; padding: 12px 0; }
  .forum-search { flex: 1 0 100%; }
  .forum-search input { min-height: 44px; padding: 8px 10px; }
  .forum-filters label:not(.forum-search) { flex: 1; min-width: 0; padding: 0 5px; gap: 0; font-size: 11px; }
  .forum-filters select { min-width: 44px; width: 100%; max-width: 105px; font-size: 12px; }
  .forum-more { flex: 0 0 100%; font-size: 12px !important; text-align: right; padding: 2px 4px; }
  .forum-extra-filters { flex-wrap: wrap; gap: 7px; }
  .forum-extra-filters label { font-size: 12px; padding: 0 7px; }
  .forum-body { display: block; overflow: hidden; }
  .forum-list-panel { height: 100%; }
  .forum-list-heading h2 { font-size: 22px; }
  .forum-result-count { font-size: 11px; }
  .forum-post { min-height: 160px; gap: 12px; padding: 12px 10px; }
  .forum-post-image { flex-basis: 31%; width: 31%; min-height: 125px; }
  .forum-post h3 { font-size: 18px; }
  .forum-post-meta { font-size: 11px; }
  .forum-author strong { font-size: 14px; }
  .forum-status { white-space: normal; max-width: 90px; }
  .forum-post-excerpt { font-size: 12px; }
  .forum-detail { display: none; height: 100%; border: 0; padding-left: 0; }
  .forum-mobile-detail .forum-detail { display: block; }
  .forum-mobile-detail .forum-list-panel { display: none; }
  .forum-detail-back { display: block; border: 1px solid var(--forum-ink); border-radius: 5px; background: transparent; padding: 5px 10px; font-size: 12px !important; }
  .forum-detail-card { padding: 12px; }
  .forum-detail-image { height: 190px; }
  .forum-footer { font-size: 10px; padding: 8px 0; }
  .forum-compose-heading h2 { font-size: 22px; }
  .forum-compose-back { font-size: 12px !important; padding: 6px 8px; }
  .forum-compose-boundary { font-size: 13px; }
  .forum-compose-form { grid-template-columns: 1fr; gap: 13px; }
}
@media (max-width: 680px) and (max-height: 480px) and (orientation: landscape) {
  .forum-filters { flex-wrap: nowrap; overflow-x: auto; padding: 8px 0; }
  .forum-search { flex: 0 0 210px; min-width: 210px; }
  .forum-filters label:not(.forum-search) { flex: 0 0 auto; }
  .forum-filters select { width: auto; }
  .forum-more { flex: 0 0 auto; text-align: center; padding: 4px 8px; }
  .forum-extra-filters { flex: 0 0 auto; flex-wrap: nowrap; overflow-x: auto; margin-bottom: 8px; }
  .forum-extra-filters label, .forum-clear { flex-shrink: 0; }
  .forum-storage-warning { max-height: 48px; overflow: auto; }
  .forum-footer { padding: 4px 0; }
}
@media (prefers-reduced-motion: reduce) { .forum-dialog * { scroll-behavior: auto !important; } }