* { box-sizing: border-box; }
[hidden] { display: none !important; }
.board-page { min-height: 100vh; display: flex; flex-direction: column; background: radial-gradient(circle at 52% -18%, #243029 0, #101314 45%); }
.board-main { width: min(980px, calc(100% - 48px)); margin: 0 auto; flex: 1; padding: 70px 0 100px; }
.board-hero { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.board-switch { display: flex; gap: 8px; margin: 0 0 20px; border-bottom: 1px solid var(--u-border); }
.board-switch button { min-height: 43px; padding: 0 19px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--u-muted); font-size: 14px; font-weight: 700; cursor: pointer; }
.board-switch button:hover { color: var(--u-text); }
.board-switch button[aria-current='page'] { border-bottom-color: var(--u-green); color: var(--u-green); }
.board-hero h1 { margin: 18px 0 8px; font-size: clamp(35px, 6vw, 55px); line-height: 1.1; letter-spacing: -.065em; }
.board-accent { color: var(--u-green); }
.board-hero p { color: var(--u-muted); margin: 0; font-size: 15px; }
.board-primary, .board-secondary, .board-pagination button { border-radius: 9px; min-height: 43px; padding: 0 18px; font-size: 13px; font-weight: 750; cursor: pointer; }
.board-primary { color: #151c12; background: var(--u-green); border: 1px solid var(--u-green); }
.board-primary:hover { background: #d9ff98; }
.board-primary:disabled { opacity: .5; cursor: wait; }
.board-secondary, .board-pagination button { color: var(--u-text); background: var(--u-raised); border: 1px solid var(--u-border); }
.board-secondary:hover, .board-pagination button:hover:not(:disabled) { border-color: #788c7a; }
.board-pagination button:disabled { opacity: .35; cursor: default; }
.board-status { min-height: 0; color: var(--u-muted); margin: 0 0 13px; font-size: 13px; }
.board-status:empty { display: none; }
.board-status.error { color: #ff9999; }
.board-panel { border: 1px solid var(--u-border); border-radius: 15px; background: #191d1ef2; overflow: hidden; }
.board-panel-head { min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 25px; border-bottom: 1px solid var(--u-border); }
.board-panel-head h2 { margin: 0; font-size: 16px; letter-spacing: -.02em; }
.board-panel-head h2 span { color: var(--u-green); }
.board-text-button { border: 0; background: transparent; padding: 8px 0; color: var(--u-muted); font-size: 13px; cursor: pointer; }
.board-text-button:hover { color: var(--u-green); }
.board-text-button.danger:hover { color: #ff9999; }
.board-list-item { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 20px; border: 0; border-bottom: 1px solid #303638a8; padding: 21px 25px; color: var(--u-text); text-align: left; background: transparent; cursor: pointer; }
.board-list-item:hover { background: #252c29; }
.board-list-item:last-child { border-bottom: 0; }
.board-list-title { font-weight: 700; font-size: 15px; overflow-wrap: anywhere; }
.board-list-title .board-lock-label { display: inline-block; margin-left: 8px; padding: 2px 6px; border-radius: 4px; color: var(--u-green); background: #c3f36b18; font-size: 11px; vertical-align: middle; }
.board-list-sub { color: var(--u-muted); display: flex; gap: 12px; margin-top: 8px; font-size: 12px; }
.board-category { color: var(--u-green); }
.board-list-arrow { color: var(--u-muted); flex: none; font-size: 20px; }
.board-empty { padding: 75px 18px; color: var(--u-muted); text-align: center; font-size: 14px; }
.board-pagination { display: flex; align-items: center; justify-content: center; gap: 20px; padding: 22px; border-top: 1px solid var(--u-border); color: var(--u-muted); font-size: 12px; }
.board-detail-actions { display: flex; gap: 17px; }
.board-detail-copy { padding: 35px 36px 45px; }
.board-detail-meta { display: flex; flex-wrap: wrap; gap: 14px; color: var(--u-muted); font-size: 12px; }
.board-detail-copy h2 { margin: 16px 0 28px; font-size: clamp(24px, 4vw, 32px); letter-spacing: -.05em; overflow-wrap: anywhere; }
.board-detail-body { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.8; font-size: 15px; }
.board-detail-images { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 14px; margin-top: 30px; }
.board-detail-images:empty, .board-detail-video:empty { display: none; }
.board-detail-images img { width: 100%; max-height: 620px; object-fit: contain; background: #0e1111; border: 1px solid var(--u-border); border-radius: 8px; }
.board-detail-video { margin-top: 30px; max-width: 700px; aspect-ratio: 16 / 9; }
.board-detail-video iframe { width: 100%; height: 100%; border: 1px solid var(--u-border); border-radius: 8px; }
.board-form { display: grid; gap: 22px; padding: 30px 35px 34px; }
.board-form label { display: grid; gap: 9px; color: var(--u-text); font-size: 13px; font-weight: 700; min-width: 0; }
.board-form label small { color: var(--u-muted); font-weight: 400; }
.board-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.board-form-row.free-board { grid-template-columns: 1fr; }
.board-form input, .board-form textarea, .board-form select { width: 100%; background: #101516; color: var(--u-text); border: 1px solid #3a4243; border-radius: 8px; padding: 13px 14px; font-size: 14px; font-weight: 400; }
.board-form input:focus, .board-form textarea:focus, .board-form select:focus { border-color: var(--u-green); outline: none; }
.board-form input[type=file] { padding: 10px; font-size: 12px; }
.board-secret-toggle { min-height: 47px; display: flex; align-items: center; gap: 11px; border: 1px solid #3a4243; border-radius: 8px; padding: 9px 13px; background: #101516; cursor: pointer; }
.board-form .board-secret-toggle input { width: 17px; height: 17px; flex: none; margin: 0; padding: 0; accent-color: var(--u-green); }
.board-secret-toggle span { display: grid; gap: 3px; font-weight: 600; }
.board-secret-toggle small { font-size: 11px; line-height: 1.35; }
.board-unlock-form { display: grid; justify-items: center; gap: 14px; padding: 58px 20px 66px; text-align: center; }
.board-lock-icon { font-size: 28px; }
.board-unlock-form h2 { margin: 0; font-size: 25px; }
.board-unlock-form p { margin: 0 0 8px; color: var(--u-muted); font-size: 13px; line-height: 1.7; }
.board-unlock-form label { width: min(100%, 330px); text-align: left; font-size: 12px; font-weight: 650; }
.board-unlock-form input { width: min(100%, 330px); border: 1px solid #3a4243; border-radius: 8px; padding: 12px 14px; background: #101516; color: var(--u-text); font-size: 14px; }
.board-unlock-form button { width: min(100%, 330px); }
.board-form textarea { resize: vertical; min-height: 210px; line-height: 1.7; }
.board-form-note { margin: 0; color: var(--u-muted); font-size: 12px; line-height: 1.6; }
.board-form-actions { display: flex; justify-content: flex-end; gap: 10px; }
.board-image-preview { display: flex; flex-wrap: wrap; gap: 12px; }
.board-image-preview:empty { display: none; }
.board-preview-item { position: relative; width: 110px; height: 110px; }
.board-preview-item img { width: 100%; height: 100%; object-fit: cover; border: 1px solid var(--u-border); border-radius: 7px; }
.board-preview-item button { position: absolute; top: 4px; right: 4px; width: 25px; height: 25px; border: 0; border-radius: 50%; color: white; background: #111c; cursor: pointer; }
@media (max-width: 700px) {
  .board-main { width: calc(100% - 28px); padding: 35px 0 60px; }
  .board-hero { align-items: start; flex-direction: column; margin-bottom: 28px; gap: 22px; }
  .board-hero .board-primary { width: 100%; }
  .board-switch { display: grid; grid-template-columns: repeat(2, 1fr); }
  .board-panel-head { padding: 0 17px; }
  .board-list-item { padding: 18px 17px; }
  .board-detail-copy { padding: 26px 20px 35px; }
  .board-form { padding: 20px 17px 25px; }
  .board-form-row { grid-template-columns: 1fr; }
}