body { background:#fff; }
.community-header { border-bottom:1px solid var(--line); background:#fff; }
.community-header-inner { width:min(1120px,calc(100% - 32px)); min-height:62px; margin:auto; display:flex; align-items:center; gap:30px; }
.community-brand { font-weight:800; font-size:17px; text-decoration:none; color:var(--ink); white-space:nowrap; }
.community-header nav { display:flex; gap:15px; }
.community-header nav a,.account-bar button { color:var(--muted); text-decoration:none; border:0; background:none; padding:8px 0; white-space:nowrap; }
.community-header nav a.selected { color:var(--accent); font-weight:700; border-bottom:2px solid var(--accent); }
.account-bar { margin-left:auto; display:flex; align-items:center; gap:12px; font-size:13px; }
.account-bar strong { max-width:110px; overflow:hidden; text-overflow:ellipsis; }
.account-bar button { cursor:pointer; }
.community-shell { width:min(1120px,calc(100% - 32px)); min-height:calc(100vh - 180px); margin:32px auto 80px; }
.community-title { display:flex; align-items:end; justify-content:space-between; gap:20px; padding-bottom:22px; border-bottom:1px solid var(--line); }
.community-title h1 { margin:2px 0 8px; font-size:30px; letter-spacing:0; }
.community-title p { margin:0; color:var(--muted); }
.community-title .section-label { color:var(--accent); font-size:11px; font-weight:800; }
.community-primary { min-height:40px; border:0; border-radius:6px; padding:0 18px; background:var(--accent); color:#fff; font-weight:700; white-space:nowrap; }
.community-primary:disabled { opacity:.5; cursor:not-allowed; }
.community-message { margin:18px 0; border-left:3px solid var(--accent); background:color-mix(in srgb, var(--sage) 32%, #fff); padding:12px 16px; }
.board-filters { display:flex; flex-wrap:wrap; gap:8px; padding:22px 0; }
.board-filters input { flex:1 1 230px; }
.board-filters input,.board-filters select,.form-panel input,.form-panel select,.form-panel textarea,.reply-section textarea { min-height:40px; min-width:0; border:1px solid var(--line); border-radius:6px; background:#fff; padding:8px 11px; }
.board-filters button { min-height:40px; border:1px solid var(--line); border-radius:6px; padding:0 16px; background:#fff; }
.board-head { display:flex; justify-content:space-between; padding:12px 4px; border-top:2px solid var(--ink); border-bottom:1px solid var(--line); font-weight:700; }
.board-head span:last-child { color:var(--muted); font-weight:400; }
.post-row { display:grid; grid-template-columns:1fr auto; gap:10px; padding:16px 4px; border-bottom:1px solid var(--line); }
.post-row a { color:var(--ink); font-weight:700; text-decoration:none; }
.post-row a:hover { color:var(--accent); }
.post-row-meta,.post-row-side,.small-note { color:var(--muted); font-size:13px; }
.post-row-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:5px; }
.post-row-side { text-align:right; white-space:nowrap; }
.empty-board { padding:64px 16px; text-align:center; color:var(--muted); }
.text-button { border:0; background:none; color:var(--accent); padding:0; cursor:pointer; font-weight:700; }
#detailView { padding-top:22px; }
#postDetail h2 { font-size:24px; margin:22px 0 8px; }
.detail-meta { display:flex; flex-wrap:wrap; gap:12px; color:var(--muted); font-size:13px; }
.seller-line { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:22px 0; padding:13px 0; border-block:1px solid var(--line); }
.seller-line a { color:var(--accent); overflow-wrap:anywhere; }
.detail-body,.reply-body { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.8; }
.detail-actions { margin-top:24px; }
.detail-actions button { border:1px solid var(--line); background:#fff; border-radius:6px; padding:7px 12px; }
.reply-section { margin-top:40px; border-top:2px solid var(--ink); padding-top:16px; }
.reply-section h2 { font-size:18px; }
.reply-row { padding:14px 0; border-bottom:1px solid var(--line); }
.reply-row small { color:var(--muted); margin-left:10px; }
.reply-section textarea { display:block; width:100%; min-height:105px; margin:8px 0; }
.form-panel { max-width:680px; padding:24px 0 0; }
.form-panel h2 { margin:20px 0; font-size:22px; }
.form-panel form { display:grid; gap:7px; }
.form-panel label,.reply-section label { font-size:13px; font-weight:700; margin-top:12px; }
.form-panel textarea { min-height:190px; resize:vertical; }
.form-panel .form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-grid div { display:grid; gap:7px; }
.form-panel .community-primary { justify-self:start; margin-top:16px; }
.mode-switch { display:flex; border-bottom:1px solid var(--line); margin-bottom:12px; }
.mode-switch button { border:0; background:none; padding:9px 18px; cursor:pointer; }
.mode-switch button.active { border-bottom:2px solid var(--accent); color:var(--accent); font-weight:700; }
.community-footer { display:flex; justify-content:space-between; gap:20px; padding:28px max(16px,calc((100vw - 1120px)/2)); border-top:1px solid var(--line); background:var(--surface); color:var(--muted); font-size:12px; }
.community-footer div { display:grid; gap:5px; }
.community-footer strong { color:var(--ink); }
.community-footer nav { display:flex; flex-wrap:wrap; gap:14px; }
.community-footer a { color:var(--muted); }
@media(max-width:700px) { .community-header-inner { gap:12px; flex-wrap:wrap; padding:10px 0; } .community-header nav { gap:10px; } .account-bar { width:100%; justify-content:flex-end; } .community-title { align-items:start; } .community-title h1 { font-size:25px; } .community-title p { font-size:13px; } .board-filters input { flex:1 0 100%; } .board-filters select { flex:1 1 120px; } .board-filters button { flex:0 0 70px; } .community-footer { display:grid; } }
