.addon-panel-page { max-inline-size: 52rem; margin-inline: auto; padding-block: 1.5rem; }
.addon-panel__header { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-block-end: 1rem; }
.addon-panel__header h1 { font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.25; margin: 0; }
.addon-panel__header p { color: var(--store-muted); margin-block: .5rem 0; }
.addon-panel__close { display: grid; place-items: center; flex: 0 0 2.75rem; block-size: 2.75rem; border: 1px solid var(--store-border); border-radius: 50%; font-size: 1.5rem; text-decoration: none; color: var(--store-text); }
.addon-panel-dialog { inline-size: min(56rem, calc(100% - 2rem)); max-block-size: calc(100dvh - 2rem); padding: 0 2rem; border: 1px solid var(--store-border); border-radius: 1rem; background: var(--store-surface); color: var(--store-text); overscroll-behavior: contain; }
.addon-panel-dialog::backdrop { background: rgb(0 0 0 / .45); }
.addon-panel-dialog[aria-busy="true"] { cursor: progress; }
.addon-panel-dialog .addon-panel-page { padding-block: 1.5rem; }
.addon-panel-dialog :focus-visible, .addon-panel__close:focus-visible { outline: 2px solid var(--store-accent); outline-offset: 3px; }
@media (max-width: 40rem) { .addon-panel-dialog { inline-size: calc(100% - 1rem); max-block-size: calc(100dvh - 1rem); padding-inline: 1rem; border-radius: .75rem; } }
