:root {
  color-scheme: dark;
  font-family: "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif;
  color: #fff2d9;
  background: #08090d;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 0; }
.community { width: min(54rem, 100%); margin-inline: auto; padding: clamp(1rem, 4vw, 3rem); }
.intro h1 { margin: 1rem 0; }
.home { color: #f3ca83; }
.board-nav { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .75rem; }
.board-nav a, .community button {
  border: 1px solid #7d6340;
  border-radius: .5rem;
  padding: .65rem .8rem;
  color: #fff2d9;
  background: #211910;
  font: inherit;
}
.board-nav a { text-decoration: none; }
.board-nav a[aria-current="page"] { color: #211910; background: #f3ca83; font-weight: 700; }
.board { padding: clamp(.9rem, 3vw, 1.5rem); border: 1px solid #52432f; border-radius: .65rem; background: #11121a; }
.board h2 { margin: 0 0 1rem; }
.notice { padding: .8rem 1rem; border-inline-start: .22rem solid #f3ca83; background: #251c15; margin: 0 0 1rem; line-height: 1.65; }
.account-line { display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; margin-block: .75rem; }
.account-line p { margin: 0; }
.community button { cursor: pointer; }
.community button:disabled { cursor: wait; opacity: .65; }
form { display: grid; gap: .5rem; border: 1px solid #52432f; border-radius: .5rem; padding: .85rem; }
form button { justify-self: start; }
form p { margin: 0; }
input, textarea {
  width: 100%;
  border: 1px solid #7d6340;
  background: #08090d;
  color: inherit;
  font: inherit;
  border-radius: .3rem;
  padding: .65rem;
}
textarea { resize: vertical; }
#linkField { display: grid; gap: .5rem; }
.posts { padding: 0; list-style: none; display: grid; gap: .65rem; }
.posts li { border: 1px solid #52432f; border-radius: .45rem; padding: .85rem; overflow-wrap: anywhere; }
.posts h4, .posts p { margin: 0 0 .55rem; }
.posts small { color: #e2ccab; }
.posts .post-content { white-space: pre-wrap; line-height: 1.6; }
.posts a { color: #f3ca83; }
:focus-visible { outline: .15rem solid #f3ca83; outline-offset: .14rem; }