.mode-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: var(--space-5); padding: 4px; border-radius: var(--radius-md); background: var(--surface-soft); }
.mode-option { display: grid; gap: 2px; padding: 10px; border: 0; border-radius: var(--radius-sm); background: transparent; text-align: left; cursor: pointer; }
.mode-option span { color: var(--ink-muted); font-size: .72rem; }
.mode-option.is-active { background: var(--surface); box-shadow: 0 1px 3px rgba(23,32,51,.12); }
.panel-message p, .session-summary p { margin: 6px 0 0; color: var(--ink-muted); font-size: .9rem; }
.field-note, .auth-note { margin: 0; color: var(--ink-muted); font-size: .78rem; font-weight: 500; }
.reconnect-form { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--hairline); }
.compact-form, .join-form { display: grid; gap: var(--space-3); }
.join-form { grid-template-columns: 1fr auto; align-items: end; }
.join-form .field { min-width: 0; }
.or-divider { margin-block: var(--space-4); color: var(--ink-muted); text-align: center; font-size: .75rem; }
.field { display: grid; gap: 6px; color: var(--ink); font-size: .86rem; font-weight: 700; }
.field input, .field select, .field textarea, .score-row select { width: 100%; border: 1px solid #c9d2dc; border-radius: var(--radius-sm); background: #fff; color: var(--ink); }
.field input, .field select, .score-row select { min-height: 44px; padding: 8px 11px; }
.field textarea { resize: vertical; padding: 10px 11px; }
.meeting-code { display: block; margin-top: var(--space-3); font-size: 2rem; letter-spacing: .14em; }
.notice { position: sticky; z-index: 10; top: 76px; padding: 10px 14px; border: 1px solid currentColor; border-radius: var(--radius-md); font-size: .9rem; }
.notice.is-empty { display: none; }
.status-item { padding: var(--space-5) 0; border-top: 3px solid var(--ink); }
.status-item-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.status-item p { color: var(--ink-muted); }
.status-badge { display: inline-flex; flex: 0 0 auto; padding: 4px 8px; border-radius: 99px; font-size: .72rem; font-weight: 750; }
.evidence-strength-card { padding: var(--space-5); border: 1px solid var(--hairline); border-radius: var(--radius-lg); background: var(--surface); }
.evidence-strength-card h3 { margin-bottom: var(--space-4); }
.evidence-badge-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.evidence-badge { min-width: 104px; display: inline-flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 7px 10px; border: 1px solid currentColor; border-radius: var(--radius-md); }
.evidence-badge small { font-size: .72rem; font-weight: 700; }
.evidence-badge strong { font-size: 1.05rem; }
.evidence-badge.level-a { color: #0f6658; background: #e6f5f1; }
.evidence-badge.level-b { color: #2051ad; background: #eaf0ff; }
.evidence-badge.level-c { color: #75490c; background: #fff3d8; }
.evidence-meta { margin: var(--space-3) 0 0; color: var(--ink-muted); font-size: .75rem; font-weight: 650; }
.evidence-basis { margin: var(--space-4) 0; color: var(--ink-muted); }
.next-evidence { display: grid; gap: 2px; margin-bottom: 0; padding-top: var(--space-3); border-top: 1px solid var(--hairline); font-size: .88rem; }
.next-evidence span { color: var(--ink-muted); }
.evidence-scale { margin-top: var(--space-4); padding: var(--space-4); border: 1px solid var(--hairline); border-radius: var(--radius-md); background: var(--surface-soft); }
.evidence-scale summary { cursor: pointer; font-weight: 750; }
.evidence-scale dl { display: grid; grid-template-columns: 32px 1fr; gap: 6px 12px; margin-bottom: 0; }
.evidence-scale dt { font-weight: 800; }
.evidence-scale dd { margin: 0; color: var(--ink-muted); }
.evidence-card { margin: 0; overflow: hidden; border: 1px solid var(--hairline); border-radius: var(--radius-lg); background: var(--surface); }
.evidence-image { aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface-soft); }
.evidence-image img { width: 100%; height: 100%; object-fit: cover; }
.evidence-card figcaption { display: grid; gap: 3px; padding: var(--space-4); }
.evidence-card figcaption span { color: var(--ink-muted); font-size: .85rem; }
.image-unavailable { height: 100%; display: grid; place-items: center; padding: var(--space-5); color: var(--ink-muted); text-align: center; }
.empty-evidence { margin-top: var(--space-4); padding: var(--space-5); border-left: 4px solid var(--warning); background: #fffaf0; }
.empty-evidence p { margin: 4px 0 0; color: var(--ink-muted); }
.comparison-wrap { overflow-x: auto; border: 1px solid var(--hairline); border-radius: var(--radius-lg); background: var(--surface); }
.comparison-table { width: 100%; min-width: 900px; border-collapse: collapse; }
.comparison-table th, .comparison-table td { padding: 18px; border-bottom: 1px solid var(--hairline); vertical-align: top; text-align: left; }
.comparison-table thead th { background: var(--ink); color: #fff; }
.comparison-table tbody th { width: 140px; background: var(--surface-soft); }
.candidate-card { padding: var(--space-6); border: 1px solid var(--hairline); border-top: 4px solid var(--info); border-radius: var(--radius-lg); background: var(--surface); }
.candidate-kicker { margin-bottom: 6px; color: var(--info); font-size: .75rem; font-weight: 800; }
.candidate-summary { min-height: 52px; color: var(--ink-muted); }
.candidate-details { display: grid; grid-template-columns: 88px 1fr; gap: 10px 16px; margin: var(--space-5) 0 0; font-size: .9rem; }
.candidate-details dt { font-weight: 750; }
.candidate-details dd { margin: 0; color: var(--ink-muted); }
.method-steps { margin: 0 0 var(--space-6); padding: 0; list-style: none; counter-reset: none; }
.method-step { min-height: 180px; display: grid; align-content: start; gap: var(--space-4); padding: var(--space-5); border-top: 3px solid var(--ink); background: var(--surface); }
.method-number { color: var(--primary); font-size: .75rem; font-weight: 850; letter-spacing: .12em; }
.method-step h3 { margin-bottom: var(--space-2); }
.method-step p { margin: 0; color: var(--ink-muted); font-size: .9rem; }
.role-check-card { padding: var(--space-6); border: 1px solid var(--hairline); border-radius: var(--radius-lg); background: var(--surface); }
.role-check-card.primary-role { border-top: 4px solid var(--primary); }
.role-check-card.secondary-role { border-top: 4px solid var(--info); }
.role-label { margin-bottom: var(--space-2); color: var(--ink-muted); font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.role-check-card ul { margin-bottom: 0; padding-left: 1.25rem; color: var(--ink-muted); }
.form-help { color: var(--ink-muted); }
.score-card { padding: var(--space-5); border: 1px solid var(--hairline); border-radius: var(--radius-md); }
.score-card h3 { padding-bottom: var(--space-3); border-bottom: 2px solid var(--ink); }
.score-row { display: grid; grid-template-columns: 1fr 82px; align-items: center; gap: var(--space-3); padding-block: 10px; border-bottom: 1px solid var(--hairline); }
.score-row span { display: grid; }
.score-row small { color: var(--ink-muted); font-weight: 500; }
.submit-vote { justify-self: start; margin-top: var(--space-4); }
.selection-note { margin: var(--space-4) 0 0; padding: 12px 14px; border-left: 3px solid var(--info); background: #f4f7ff; color: var(--ink-muted); font-size: .9rem; }
.inline-alert { padding: 12px 14px; border-radius: var(--radius-md); }
.result-card { padding: var(--space-5); border-top: 4px solid var(--primary); background: var(--surface); }
.result-card.is-disqualified { border-top-color: var(--danger); }
.result-label { margin-bottom: 0; color: var(--ink-muted); font-weight: 700; }
.result-score { display: block; margin-block: 4px; font-size: 2rem; }
.hidden-result { display: grid; justify-items: center; gap: var(--space-3); padding: var(--space-7); border: 1px dashed #b7c2ce; background: var(--surface-soft); text-align: center; }
.hidden-icon { font-size: 2rem; letter-spacing: .25em; }
.recommendation { margin-top: var(--space-5); padding: var(--space-6); border-left: 4px solid var(--primary); background: var(--surface); }
.recommendation p:last-child { margin-bottom: 0; color: var(--ink-muted); }
.final-summary { margin-block: var(--space-section); padding-inline: var(--space-6); border: 1px solid var(--hairline); background: var(--surface); }
.final-details { display: grid; grid-template-columns: 150px 1fr; gap: 12px 24px; }
.final-details dt { font-weight: 750; }
.final-details dd { margin: 0; color: var(--ink-muted); }
.experiment-section { background: #edf3f4; }
.experiment-rule { padding: var(--space-5); border: 1px solid #ccdadd; border-radius: var(--radius-lg); background: var(--surface); }
.rule-index { display: block; margin-bottom: var(--space-5); color: var(--primary); font-size: .75rem; font-weight: 850; letter-spacing: .12em; }
.experiment-rule h3 { margin-bottom: var(--space-2); }
.experiment-rule p { margin-bottom: 0; color: var(--ink-muted); font-size: .9rem; }
