
:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #f6f7f9;
  color: #20242a;
}

* { box-sizing: border-box; }
body { margin: 0; background: #f6f7f9; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: 0.55; }

.app { min-height: 100vh; display: grid; grid-template-columns: 360px 1fr; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.login-panel { width: min(460px, 100%); background: #fff; border: 1px solid #d8dde4; border-radius: 8px; padding: 22px; }
.login-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.sidebar { border-right: 1px solid #d7dce2; background: #ffffff; padding: 20px; overflow: auto; height: 100vh; }
.main { padding: 24px; overflow: auto; height: 100vh; }
.title { margin: 0 0 4px; font-size: 24px; line-height: 1.2; }
.subtitle { margin: 0 0 20px; color: #58616d; font-size: 14px; line-height: 1.45; }
.toolbar { display: grid; gap: 10px; margin-bottom: 18px; }
.field { display: grid; gap: 6px; }
.field label { font-size: 12px; color: #58616d; font-weight: 650; text-transform: uppercase; }
.input, .select, .textarea { width: 100%; border: 1px solid #c9d0d8; border-radius: 6px; background: #fff; padding: 9px 10px; color: #20242a; }
.input:disabled, .select:disabled, .textarea:disabled { background: #eef1f4; color: #6b7280; border-color: #d4dae1; }
.textarea { min-height: 88px; resize: vertical; }
.button { border: 1px solid #5f6673; background: #5f6673; color: #fff; border-radius: 6px; padding: 9px 12px; font-weight: 650; }
.button:hover:not(:disabled) { border-color: #4b5563; background: #4b5563; box-shadow: 0 1px 4px rgba(32, 36, 42, 0.18); }
.button.primary { border-color: #5f6673; background: #5f6673; color: #fff; }
.button.secondary { background: #fff; color: #4b5563; border-color: #b9c1cb; }
.button.secondary:hover:not(:disabled) { background: #f3f5f7; border-color: #8d98a6; color: #20242a; }
.button.compact { padding: 5px 8px; font-size: 12px; }
.button.row { width: 100%; text-align: left; }
.identity-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.local-contributor-name { color: #6b7280; font-weight: 650; }
.checkbox-row label { display: inline-flex; gap: 8px; align-items: center; color: #58616d; font-size: 13px; font-weight: 650; }
.checkbox-row input { width: 16px; height: 16px; }
.issue-list { display: grid; gap: 8px; }
.issue-row { width: 100%; text-align: left; border: 1px solid #d8dde4; background: #fff; border-radius: 8px; padding: 12px; display: grid; gap: 8px; }
.issue-row.closed { background: #f1f3f5; }
.issue-row.active { border-color: #2f6f73; box-shadow: 0 0 0 2px rgba(47, 111, 115, 0.14); }
.issue-title { font-weight: 700; line-height: 1.35; }
.meta { display: flex; gap: 8px; flex-wrap: wrap; color: #58616d; font-size: 12px; align-items: center; }
.pill { border: 1px solid #cbd3dc; background: #f8fafb; border-radius: 999px; padding: 2px 7px; line-height: 1.5; }
.section { background: #fff; border: 1px solid #d8dde4; border-radius: 8px; padding: 18px; margin-bottom: 16px; }
.section h2 { margin: 0 0 12px; font-size: 18px; }
.section h3 { margin: 0 0 10px; font-size: 15px; }
.section h3.table-heading { margin-top: 22px; margin-bottom: 12px; font-size: 18px; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.field + .actions { margin-top: 10px; }
.preset-actions { margin-top: 8px; }
.preset-actions + .actions { margin-top: 16px; }
.section > .field + .field,
.section > .grid + .field,
.section > .vote-grid + .field { margin-top: 16px; }
.vote-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.vote-button { border: 1px solid #cbd3dc; background: #f3f5f7; color: #20242a; border-radius: 6px; padding: 9px 10px; text-align: left; font-weight: 650; }
.vote-button:hover { border-color: #8d98a6; background: #e9edf2; }
.vote-button.selected { box-shadow: 0 0 0 3px rgba(32, 36, 42, 0.22), inset 0 0 0 2px rgba(255, 255, 255, 0.72); font-weight: 850; }
.vote-button.selected.strongly-agree { background: #7bc995; border-color: #2f8f50; color: #103a20; }
.vote-button.selected.agree { background: #c7ead2; border-color: #7bc995; color: #184f2d; }
.vote-button.selected.no-opinion { background: #ffe08a; border-color: #d6a514; color: #5d4400; }
.vote-button.selected.disagree { background: #ffd0d0; border-color: #e06a6a; color: #7a1515; }
.vote-button.selected.strongly-disagree { background: #e06a6a; border-color: #b3261e; color: #4e0909; }
.vote-button.selected.problem-unclear, .vote-button.selected.problem-not-clear { background: #d9c2ff; border-color: #8b5cf6; color: #3f1d78; }
.vote-button.selected.not-evaluated { background: #f7b267; border-color: #d97706; color: #4b2500; }
.consensus-panel { display: grid; gap: 14px; margin-top: 16px; }
.consensus-row { display: grid; gap: 6px; }
.consensus-label { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; color: #58616d; font-size: 12px; font-weight: 650; }
.consensus-title { font-size: 14px; color: #20242a; }
.consensus-label span:last-child { text-align: right; }
.consensus-track { position: relative; height: 10px; border-radius: 999px; background: linear-gradient(90deg, #2f8f50 0%, #f7b267 50%, #b3261e 100%); border: 1px solid #d8dde4; }
.consensus-fill { position: absolute; top: 50%; width: 18px; height: 18px; border: 2px solid #fff; border-radius: 999px; box-shadow: 0 1px 4px rgba(32, 36, 42, 0.28); transform: translate(-50%, -50%); }
.consensus-caption { color: #687382; font-size: 12px; }
.unclear-track { background: #f2ecff; overflow: hidden; }
.unclear-fill { height: 100%; border-radius: 999px; }
.vote-summary-row td:first-child { font-weight: 700; border-left: 6px solid transparent; }
.vote-summary-row.strongly-agree td:first-child { border-left-color: #2f8f50; }
.vote-summary-row.agree td:first-child { border-left-color: #7bc995; }
.vote-summary-row.no-opinion td:first-child { border-left-color: #d6a514; }
.vote-summary-row.disagree td:first-child { border-left-color: #e06a6a; }
.vote-summary-row.strongly-disagree td:first-child { border-left-color: #b3261e; }
.vote-summary-row.problem-unclear td:first-child, .vote-summary-row.problem-not-clear td:first-child { border-left-color: #8b5cf6; }
.vote-summary-row.not-evaluated td:first-child { border-left-color: #d97706; }
.label-pill { font-weight: 650; border-radius: 999px; font-size: 80%; padding: 1px 6px; line-height: 1.35; }
.label-row { display: flex; flex-wrap: wrap; gap: 4px; }
.category-section { display: grid; gap: 14px; }
.subgroup { display: grid; gap: 8px; }
.collapsible { padding: 0; overflow: hidden; }
.collapse-header { width: 100%; border: 0; background: #fff; color: #20242a; padding: 14px 18px; display: flex; gap: 10px; align-items: center; text-align: left; font-weight: 800; font-size: 18px; }
.subgroup-section .collapse-header { font-size: 15px; padding: 10px 12px; background: #f8fafb; border-top: 1px solid #e1e5ea; }
.collapse-icon { width: 18px; height: 18px; color: #2f6f73; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; }
.collapse-chevron { width: 12px; height: 12px; display: block; fill: currentColor; }
.collapse-body { padding: 0 18px 18px; }
.subgroup-section .collapse-body { padding: 12px; }
.detail-collapsible { border-top: 1px solid #e1e5ea; margin-top: 18px; }
.detail-collapse-header { padding: 14px 0 10px; font-size: 18px; background: transparent; }
.detail-collapse-body { padding: 0 0 8px; }
.issue-box-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; align-items: stretch; }
.issue-box { border: 1px solid #d8dde4; background: #fff; border-radius: 8px; min-height: 112px; padding: 10px; text-align: left; display: grid; grid-template-rows: auto 1fr auto; gap: 7px; }
.issue-box.closed { background: #f1f3f5; }
.issue-box:hover { border-color: #2f6f73; box-shadow: 0 1px 6px rgba(32, 36, 42, 0.12); }
.issue-box-number { color: #2f6f73; font-weight: 800; font-size: 13px; }
.issue-box-title { color: #20242a; font-size: 13px; line-height: 1.3; overflow-wrap: anywhere; }
.github-description { margin: 10px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid #e1e5ea; background: #f8fafb; border-radius: 6px; padding: 12px; font-size: 13px; line-height: 1.45; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { border-bottom: 1px solid #e1e5ea; text-align: left; padding: 8px 6px; vertical-align: top; }
.table th { color: #58616d; font-size: 12px; text-transform: uppercase; }
.votes-table th, .votes-table td { text-align: left; }
.votes-table th:nth-child(1), .votes-table td:nth-child(1) { width: 22%; }
.votes-table th:nth-child(2), .votes-table td:nth-child(2) { width: 24%; }
.votes-table th:nth-child(3), .votes-table td:nth-child(3) { width: 22%; }
.vote-summary-table th:nth-child(1), .vote-summary-table td:nth-child(1) { width: 32%; }
.vote-summary-table th:nth-child(2), .vote-summary-table td:nth-child(2) { width: 12%; }
.comment { border-top: 1px solid #e1e5ea; padding: 12px 0; }
.comment:first-child { border-top: 0; }
.empty { color: #687382; padding: 18px 0; }
.error { border: 1px solid #d56b6b; color: #8f1f1f; background: #fff3f3; padding: 10px 12px; border-radius: 6px; margin-bottom: 12px; }

@media (max-width: 900px) {
  .app { grid-template-columns: 1fr; }
  .sidebar, .main { height: auto; }
  .sidebar { border-right: 0; border-bottom: 1px solid #d7dce2; }
  .grid { grid-template-columns: 1fr; }
  .login-actions { grid-template-columns: 1fr; }
}
