.subscription-page { width: 100%; min-width: 0; }
.subscription-page .page-title h1 { overflow-wrap: anywhere; }
.subscription-page :is(.lead, p, a, button, legend, label) { overflow-wrap: anywhere; }
.subscription-page .panel { max-width: 860px; }
.subscription-page .panel h2 { font-size: 17px; margin-bottom: 14px; }
.subscription-page p { font-size: 13px; line-height: 1.8; }
.subscription-form-panel { padding: 26px; }
.subscription-field { display: grid; gap: 8px; max-width: 440px; margin-bottom: 22px; }
.subscription-field > label, .subscription-services > legend { font-size: 13px; font-weight: 600; }
.subscription-field :is(input, select) { width: 100%; min-width: 0; border: 1px solid #bac6d9; border-radius: 7px; background: #fff; color: var(--ink); padding: 11px 12px; font: inherit; font-size: 14px; }
.subscription-field select:focus-visible { outline: 3px solid #96b8ff; outline-offset: 3px; }
.subscription-services { min-width: 0; border: 0; padding: 0; margin: 0 0 23px; }
.subscription-services > legend { padding: 0; }
.subscription-services > p { margin: 9px 0 14px; }
.subscription-service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.subscription-service-grid label { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 10px 12px; min-height: 44px; border: 1px solid var(--line); border-radius: 7px; font-size: 12px; cursor: pointer; }
.subscription-service-grid label:has(input:checked) { border-color: #a4bce5; background: #f1f5fd; }
.subscription-service-grid label > span { min-width: 0; }
.subscription-service-grid small { font-size: 10px; color: var(--muted); }
.subscription-page input[type=checkbox] { flex: 0 0 16px; width: 16px; height: 16px; margin: 0; accent-color: var(--blue); }
.subscription-consent { display: flex; align-items: flex-start; gap: 10px; font-size: 12px; line-height: 1.7; margin: 0 0 20px; }
.subscription-consent input { margin-top: 3px !important; }
.subscription-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 22px; }
.subscription-page .button { white-space: normal; max-width: 100%; text-align: center; line-height: 1.6; }
.subscription-page .button.primary { min-height: 44px; padding: 10px 16px; background: var(--blue); border-color: var(--blue); color: #fff; font-weight: 600; }
.subscription-page .button.primary:hover { background: #1d4fb8; border-color: #1d4fb8; }
.subscription-page .button:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.subscription-message form { margin: 18px 0; }
.subscription-selected { padding-inline-start: 22px; font-size: 13px; line-height: 1.9; }
.subscription-scope .text-link { display: inline-block; margin-inline-end: 24px; }
.subscription-webhook :is(dd, code) { overflow-wrap: anywhere; }
.subscription-webhook .subscription-actions { margin-bottom: 24px; }
.subscription-webhook-guide { margin-top: 24px; font-size: 12px; }
.subscription-webhook-guide summary { cursor: pointer; color: var(--blue); }
.subscription-webhook-guide pre { max-width: 100%; overflow: auto; padding: 14px; background: #f4f6fa; border: 1px solid var(--line); border-radius: 7px; font-size: 11px; line-height: 1.8; }
.subscription-secret { border: 1px solid #c2d3ef; border-radius: 7px; padding: 17px; margin-bottom: 22px; background: #f1f5fd; }
.subscription-secret h3 { font-size: 14px; }
.subscription-secret code { display: block; padding: 10px; border: 1px solid var(--line); border-radius: 5px; background: #fff; font-size: 12px; }
@media (max-width: 720px) { .subscription-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .subscription-form-panel { padding: 18px; } .subscription-service-grid { grid-template-columns: 1fr; } .subscription-actions { align-items: flex-start; flex-direction: column; } }