.acra-wrapper { max-width: 960px; margin: 0 auto; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
.acra-form { display: grid; gap: 16px; margin-bottom: 18px; }
.acra-fieldset { border: 1px solid #e5e7eb; border-radius: 12px; padding: 12px 14px; }
.acra-fieldset legend { padding: 0 6px; font-weight: 600; }
.acra-materials { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px 14px; }
.acra-inline { display: grid; grid-template-columns: 180px 1fr; align-items: center; gap: 8px; margin: 6px 0; }
.acra-btn { background: black; color: white; border: 0; border-radius: 10px; padding: 10px 14px; cursor: pointer; }
.acra-btn:hover { opacity: .9; }
.acra-hint { color: #6b7280; font-size: 12px; margin: 6px 0 0; }
.acra-output { margin-top: 18px; }
#acra-table table { width: 100%; border-collapse: collapse; margin-top: 14px; }
#acra-table th, #acra-table td { border: 1px solid #e5e7eb; padding: 8px; text-align: center; font-variant-numeric: tabular-nums; }
#acra-table th { background: #f9fafb; }
.acra-log { margin-top: 10px; color: #374151; font-size: 13px; white-space: pre-wrap; }
.acra-badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; }
.acra-badge.ok { background: #ecfdf5; color: #065f46; }
.acra-badge.warn { background: #fff7ed; color: #9a3412; }
.acra-badge.high { background: #fef2f2; color: #991b1b; }