* { box-sizing: border-box; }
html { background: #000; color: #fff; font: 15px/1.4 system-ui, -apple-system, "Segoe UI", sans-serif; }
body { margin: 0 auto; max-width: 880px; padding: 12px 14px 80px; }
a { color: #fff; }
header { align-items: baseline; display: flex; flex-wrap: wrap; gap: 8px 18px; }
h1 { font-size: 18px; font-weight: 600; margin: 0; }
label { color: #bbb; font-size: 13px; }
input, textarea, select, button { background: #000; border: 1px solid #555; border-radius: 0; color: #fff; font: inherit; padding: 4px 6px; }
input:focus, textarea:focus, select:focus { border-color: #fff; outline: none; }
button { cursor: pointer; }
button:disabled { color: #666; cursor: default; }
button.primary { border-color: #fff; }
nav { display: flex; gap: 2px; width: 100%; }
nav button { border-color: #333; flex: 1; padding: 6px 2px; }
nav button.on { border-color: #fff; font-weight: 600; }
#intro { color: #bbb; font-size: 13px; margin: 10px 0 6px; }
.item { border-top: 1px solid #333; display: grid; gap: 2px 10px; grid-template-columns: 44px 1fr; padding: 8px 0; }
.item.cut { color: #777; }
.item.cut .title { text-decoration: line-through; }
.vote { align-items: center; display: flex; flex-direction: column; font-size: 12px; }
.vote button { border: none; line-height: 1; padding: 2px 8px; }
.vote button.on { color: #ffb300; }
.vote .score { font-size: 15px; font-weight: 600; }
.title { font-weight: 600; }
.meta { color: #bbb; font-size: 12px; }
.meta b { color: #fff; font-weight: 500; }
.detail { white-space: pre-wrap; }
.options { font-size: 14px; margin: 2px 0 0; padding-left: 18px; }
.options .right { color: #ffb300; }
.row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.row button { font-size: 12px; padding: 2px 8px; }
.row button.toggle { border-color: #333; }
.thread { margin-top: 6px; }
.comment { font-size: 13px; margin: 4px 0; }
.comment b { font-weight: 600; }
.comment time, .history time { color: #888; font-size: 11px; margin-left: 6px; }
.history { color: #888; font-size: 11px; margin-top: 6px; }
form.edit { display: grid; gap: 6px; margin-top: 8px; }
form.edit label { display: grid; gap: 2px; }
form.edit textarea { min-height: 60px; }
form.edit .fields { display: grid; gap: 6px; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
form.edit .actions { display: flex; gap: 6px; }
#add { border-top: 1px solid #333; margin-top: 10px; padding-top: 10px; }
#add h2 { font-size: 15px; margin: 0 0 4px; }
.comment-form { display: flex; gap: 6px; margin-top: 6px; }
.comment-form input { flex: 1; }
.notice { color: #ffb300; font-size: 13px; margin: 8px 0; }
.who { color: #888; font-size: 11px; }