* { box-sizing: border-box; }
body { font: 14px system-ui, -apple-system, sans-serif; margin: 0; color: #24292e; }

.topbar { display: flex; align-items: center; gap: 14px; padding: 10px 16px;
          border-bottom: 1px solid #e1e4e8; background: #fafbfc; }
.brand { font-weight: 700; font-size: 16px; text-decoration: none; color: inherit; }
.who { color: #586069; font-size: 13px; }
.spacer { flex: 1; }
.stub-picker { font-size: 12px; color: #586069; display: flex; gap: 6px; align-items: center; }
.stub-picker input { width: 220px; padding: 4px 6px; font: inherit; border: 1px solid #d1d5da; border-radius: 4px; }
.stub-picker button { padding: 4px 8px; font: inherit; border: 1px solid #d1d5da; background: white; border-radius: 4px; cursor: pointer; }

main { padding: 16px; }
h1 { margin: 0 0 16px; font-size: 20px; }

.boards-list ul { list-style: none; padding: 0; }
.boards-list li { padding: 6px 0; border-bottom: 1px solid #eaecef; }
.boards-list a { color: #0366d6; text-decoration: none; font-weight: 500; }
.boards-list a:hover { text-decoration: underline; }
.board-meta { color: #6a737d; font-size: 12px; margin-left: 8px; }

.board-error { color: #cb2431; font-weight: 500; margin-bottom: 12px; }
.board-error:empty { display: none; }

.board-cols { display: flex; gap: 10px; align-items: flex-start; overflow-x: auto; padding-bottom: 8px; }
.board-col { flex: 0 0 280px; background: #f6f8fa; border-radius: 6px; padding: 8px; }
.board-col h2 { font-size: 13px; margin: 0 0 8px; padding: 5px 8px; background: #e1e7ee; border-radius: 4px; }

.item-card { background: white; padding: 6px 8px; border-radius: 4px; margin-bottom: 6px;
             border: 1px solid #e1e4e8; }
.item-field { display: flex; align-items: center; gap: 6px; margin-bottom: 2px; }
.item-field-label { flex: 0 0 96px; font-size: 10px; color: #586069; text-transform: uppercase;
                    letter-spacing: 0.4px; }
.item-field-input { flex: 1; min-width: 0; border: 1px solid transparent; padding: 3px 5px;
                    font: inherit; background: transparent; border-radius: 3px; }
.item-field-input:hover { background: #fafbfc; border-color: #d1d5da; }
.item-field-input:focus { background: white; border-color: #2188ff; outline: none;
                          box-shadow: 0 0 0 2px rgba(33, 136, 255, 0.2); }
.item-field-input.saving { border-color: #f0b000; }
.item-field-input.save-ok { border-color: #2bbd2b; transition: border-color 1s; }
.item-field-input.save-error { border-color: #cb2431; }