/* ----- MOBILE FULL-WIDTH + NO HORIZONTAL SCROLL ----- */
html, body { max-width: 100%; overflow-x: hidden; }
img, svg { max-width: 100%; height: auto; }
p, a, li, h1, h2, h3, h4 { word-wrap: break-word; overflow-wrap: anywhere; }

:root{
  --bg:#f6f7f8;
  --card:#ffffff;
  --text:#111827;
  --muted:#6b7280;
  --line:#e5e7eb;
  --brand:#b92b27;
  --brand2:#2563eb;
  --shadow:0 1px 2px rgba(0,0,0,.06);
  --radius:14px;
  --max:1120px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--max);margin:0 auto;padding:16px}
.search input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:999px;background:#fff}
.nav{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.pill{padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;box-shadow:var(--shadow);color:var(--muted);font-size:.92rem}
.pill.primary{border-color:rgba(185,43,39,.25);color:var(--brand)}
.grid{display:grid;grid-template-columns:1.35fr .65fr;gap:16px;margin-top:16px}
@media (max-width:980px){.grid{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.hd{padding:14px 14px 0}
.bd{padding:14px}
.h1{font-size:1.25rem;margin:0}
.small{color:var(--muted);font-size:.92rem}
.feed-item{padding:14px;border-top:1px solid var(--line)}
.feed-item:first-child{border-top:0}
.row{display:flex;gap:12px}
.avatar{width:28px;height:28px;border-radius:999px;background:linear-gradient(135deg,#c7d2fe,#fecaca);border:1px solid var(--line);flex:0 0 auto}
.qtitle{font-size:1.03rem;margin:0 0 6px}
.excerpt{margin:0;color:var(--muted)}
.tag{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:.8rem}
.meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.notice{padding:10px 12px;border:1px dashed rgba(107,114,128,.35);border-radius:12px;background:#fff}
.footer{padding:22px 0;color:var(--muted);font-size:.9rem}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);font-weight:700}
.btn.blue{background:var(--brand2);border-color:rgba(0,0,0,.06);color:#fff}
.thread{margin-top:10px}
.post{display:flex;gap:12px;padding:14px;border-top:1px solid var(--line)}
.post:first-child{border-top:0}
.post .who{font-weight:700}
.post .where{color:var(--muted);font-weight:600}
.post .time{color:var(--muted);font-size:.88rem}
.post .content{margin:6px 0 0;color:var(--text);line-height:1.45}
.post .reply{margin-top:8px;color:var(--muted);font-size:.92rem}

/* LOGO VISIBILITY FIX */

.topbar{
  position:sticky;
  top:0;
  z-index:50;
  background:#ffffff;
  border-bottom:1px solid var(--line);
}

.topbar .container{
  display:flex;
  align-items:flex-start;
  gap:20px;
  padding:24px 16px;
}

.brand{
  display:flex;
  align-items:flex-start;
}

.brand img{
  height:140px;
  width:auto;
  display:block;
}

.search{
  margin-top:20px;
}
