/* Native HTML compositions retain Verunel's existing tokens and controls. */
[data-native-portal] .portal-panel { min-height: 0; }
[data-native-portal] .portal-body { display: grid; align-content: start; gap: 24px; }
[data-native-portal] .portal-body > :empty { display: none; }
[data-native-portal] .portal-body h1 { margin: 0; font: 600 32px/1.18 var(--font-sans); letter-spacing: -.035em; }
[data-native-portal] .portal-view-heading { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
[data-native-portal] :is([data-purchase-wizard],[data-admin-assessment],[data-website-list],[data-report-list],[data-assessment-list],[data-saved-checks],[data-billing-summary]) { display: grid; gap: 20px; }
[data-native-portal] :is(.wizard-card,.journey-panel,.portal-panel form) { display: grid; align-content: start; gap: 16px; }
[data-native-portal] :is(.wizard-card,.journey-panel) :is(h2,h3,h4,p) { margin: 0; }
[data-native-portal] :is(.wizard-card,.journey-panel) form { display: grid; gap: 14px; }
[data-native-portal] :is(.wizard-card,.journey-panel) fieldset { min-width: 0; display: grid; gap: 12px; }
[data-native-portal] .wizard-progress { display: flex; flex-wrap: wrap; gap: 8px; }
[data-native-portal] .wizard-progress [aria-current="step"] { border-color: var(--brand); color: var(--brand); background: var(--brand-tint); }
[data-native-portal] :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  min-width: 0; max-width: 100%; min-height: 44px; padding: 10px 12px;
  border: 1px solid var(--border-control); border-radius: var(--radius-control);
  background: var(--surface); color: var(--text); font: inherit;
}
[data-native-portal] textarea { min-height: 120px; }
[data-native-portal] button:not(.button):not(.portal-primary):not(.portal-secondary):not(.preference-trigger):not([role^="menuitem"]) {
  min-height: 44px; padding: 10px 14px; border: 1px solid var(--border-control);
  border-radius: var(--radius-control); color: var(--text); background: var(--surface); cursor: pointer; font: inherit;
}
[data-native-portal] button:disabled { cursor: default; }
[data-native-portal] .wizard-plans button.active { border-color: var(--brand); background: var(--brand-tint); color: var(--text); }
[data-native-portal] :is(.portal-panel,.wizard-card,.journey-panel) > button { justify-self: start; }
[data-native-portal] :is([data-form="add-website"],.verification-panel,.report-governance,[data-journey-steps],[data-outreach-editor] form) { display: grid; gap: 12px; }
[data-native-portal] :is(.verification-panel pre,.report-governance pre) { white-space: pre-wrap; overflow-wrap: anywhere; }
[data-native-portal] .journey-panel > section { display: grid; gap: 12px; }
[data-native-portal] .journey-panel ul { margin: 0; padding-left: 20px; overflow-wrap: anywhere; }
[data-native-portal] [data-journey-steps] > fieldset { border: 1px solid var(--border); border-radius: var(--radius-control); padding: 16px; }
[data-native-portal] [data-outreach-editor] form { margin-block: 16px; }
[data-native-portal] dialog { width: min(1100px,calc(100% - 32px)); max-height: calc(100dvh - 48px); overflow: auto; padding: 24px; border: 1px solid var(--border); border-radius: var(--radius-panel); background: var(--surface); color: var(--text); }
[data-native-portal] dialog::backdrop { background: rgb(5 12 22 / 62%); }

[data-native-report] [hidden] { display: none !important; }
[data-native-report] .report-v2-filters :is(input,select) { min-width: 0; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--border-control, #647286); border-radius: 8px; background: var(--paper); color: var(--slate-900); font: inherit; }
[data-native-report] .report-v2-technical pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.marketing-waitlist .waitlist-form .waitlist-consent .ui-native-checkbox {
  flex: 0 0 20px; width: 20px; min-width: 20px; height: 20px;
  padding: 0; margin-top: 2px; appearance: auto;
}
.ui-content-tabs[data-enhanced="true"] > .ui-tabs-content > section[hidden] { display: none !important; }
.native-sample-dialog { position: fixed; inset: 50% auto auto 50%; transform: translate(-50%,-50%); margin: 0; width: min(880px,calc(100% - 32px)); max-height: calc(100dvh - 48px); overflow: auto; }
.native-sample-dialog::backdrop { background: rgb(5 12 22 / 62%); }