body { font-family: Arial, sans-serif; margin: 2rem; color: #111827; }
h1 { margin-bottom: 0.25rem; }
.sub { margin-top: 0; color: #4b5563; }
.btn-row { margin: 1rem 0; }
button { margin-right: 0.75rem; padding: 0.6rem 1rem; cursor: pointer; border: 1px solid #d1d5db; border-radius: 8px; background: #f9fafb; }
button:hover { background: #f3f4f6; }
pre { margin-top: 1rem; background: #f6f8fa; padding: 1rem; border-radius: 8px; overflow: auto; white-space: pre-wrap; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 1rem; }
.card { border: 1px solid #e5e7eb; border-radius: 10px; padding: 12px; background: #ffffff; }
.card h3 { margin: 0 0 8px; font-size: 1rem; }
.table-wrap { margin-top: 1rem; overflow-x: auto; }
table { border-collapse: collapse; width: 100%; max-width: 900px; background: #fff; }
th, td { border: 1px solid #e5e7eb; padding: 10px; text-align: left; }
th { background: #f9fafb; }
.viewer-wrap { margin-top: 1rem; border: 1px solid #d0d7de; border-radius: 8px; overflow: hidden; }
iframe { width: 100%; min-height: 560px; border: 0; display: none; background: #fff; }