.branding-page section { margin: 24px 0; padding-bottom: 24px; border-bottom: 1px solid #303030; }
.branding-page h2, .branding-page h3 { margin: 0 0 12px; }
.screenshot-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.screenshot-grid section { margin: 0; min-width: 0; padding-bottom: 12px; }
.asset-preview { display: block; width: 100%; height: auto; margin-bottom: 12px; }
.asset-preview.compact { max-width: 400px; }
.asset-preview.icon { width: 102px; image-rendering: pixelated; }
.branding-page label { display: block; margin-bottom: 5px; font-size: 11px; }
.copy-row { display: flex; gap: 8px; }
.branding-page input { width: 100%; min-width: 0; padding: 8px; border: 1px solid #444; background: #171717; color: #ddd; font: 12px/1.5 monospace; }
.branding-page input:focus-visible { outline: 1px solid #dedbcf; }
.branding-page button { flex-shrink: 0; padding: 6px 10px; border: 1px solid #555; background: #262626; }
.branding-page button:hover { background: #383838; }
.asset-note { color: #999; font-size: 11px; margin: 12px 0 0; }
#copy-status { margin: 8px 0 0; overflow-wrap: anywhere; }
@media (max-width: 600px) { .screenshot-grid { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .copy-row { flex-direction: column; align-items: flex-start; } }