#content:has(.audit-center) .toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
#content:has(.audit-center) #auditSearch{flex:1 1 280px;min-height:44px}
#content .audit-center button,#content .security-read-toolbar button,#content .security-refresh-confirm button{min-height:44px}
#appView #content .audit-center .toolbar button{min-height:44px}
#content .audit-read-status:not([hidden]){display:block;overflow-wrap:anywhere}
#content .audit-read-boundary{line-height:1.7;color:var(--muted,#726a60)}
#content .security-read-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:16px}
#content .security-read-status{margin:0;font-size:13px;line-height:1.7;flex:1 1 300px;overflow-wrap:anywhere}
#content .security-refresh-confirm{margin-bottom:18px}
#content .security-account-operations .security-operation-buttons{display:grid;gap:12px}
#content .security-account-operations button{width:100%;min-height:44px;white-space:normal}
#content .audit-center button:focus-visible,#content .security-read-toolbar button:focus-visible{outline:2px solid #a7671a;outline-offset:3px}
@media(min-width:1100px){#content .audit-center table{width:100%;min-width:0;table-layout:fixed}#content .audit-center th,#content .audit-center td{white-space:normal;overflow-wrap:anywhere;padding:12px 9px}#content .audit-center th:nth-child(1){width:18%}#content .audit-center th:nth-child(2){width:15%}#content .audit-center th:nth-child(3){width:24%}#content .audit-center th:nth-child(4){width:23%}#content .audit-center th:nth-child(5){width:12%}#content .audit-center th:nth-child(6){width:8%}#content .audit-center [data-audit-detail]{min-width:44px}}
@media(max-width:760px){#content .security-read-toolbar{align-items:stretch}#content .security-read-toolbar button{width:100%}}

/* R236: PDF pages 21-22, scoped presentation over the existing guarded flows. */
#appView > main:has(.security-reference-view) { position: relative; }
@media(min-width:1101px){#appView #content:has(.security-reference-view) .security-read-toolbar { position: absolute; top: 28px; right: 28px; max-width: 410px; flex-direction: column; align-items: flex-end; gap: 6px; margin: 0; }#content:has(.security-reference-view) .security-read-status { flex: none; order: 2; font-size: 11px; }#content:has(.security-reference-view) .security-read-toolbar button { min-height: 36px; font-size: 12px; }}
#appView #content .audit-reference-view { background: transparent; border: 0; padding: 0; margin: 0; box-shadow: none; }
#appView #content .audit-reference-view > .panel { margin: 0 0 18px; padding: 20px; }
.audit-filter-top { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 16px; }
.audit-filter-bottom { display: grid; grid-template-columns: 1fr 1fr 1.45fr auto; gap: 16px; margin-top: 16px; align-items: end; }
.audit-reference-view label,.audit-date-range legend { font-size: 13px; color: #435568; font-weight: 500; }
.audit-reference-view label { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.audit-date-range { min-width: 0; margin: 0; padding: 0; border: 0; }
.audit-date-range legend { margin: 0 0 7px; padding: 0; }
.audit-date-range > div { display: flex; align-items: center; gap: 6px; }
#appView .audit-reference-view input,#appView .audit-reference-view select { min-width: 0; width: 100%; min-height: 40px; padding: 8px 10px; font-size: 13px; border-radius: 5px; border-color: #dce2e8; background: #fff; }
.audit-date-range input { flex: 1; }
.audit-object-search [data-audit-search-slot] { display: flex; }
.audit-query-actions { display: flex; align-items: center; gap: 10px; }
#appView .audit-query-actions button { min-width: 76px; border-radius: 6px; }
.audit-filter-error { color: #a93128; margin: 12px 0 0; }
#appView .audit-list-panel .panel-head { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
#appView .audit-list-panel .panel-head > div:first-child p { display: none; }
#appView .audit-list-panel .panel-head h2 { margin: 0; font-size: 20px; display: inline-block; }
.audit-match-count { margin-left: 12px; font-size: 13px; color: #617087; }
.audit-pagination { display: flex; gap: 8px; align-items: center; margin-left: auto; }
.audit-pagination label { flex-direction: row; align-items: center; gap: 6px; }
#appView .audit-pagination select { width: 86px; }
#appView .audit-pagination button { min-width: 36px; padding: 6px; font-size: 20px; }
.audit-pagination output { min-width: 40px; text-align: center; font-size: 13px; color: #97520d; }
#appView .audit-reference-view .table-wrap { border: 1px solid #e8e9ed; border-radius: 8px; }
#appView .audit-reference-view table { table-layout: auto; min-width: 780px; }
#appView .audit-reference-view th,#appView .audit-reference-view td { width: auto; padding: 16px 12px; font-size: 13px; vertical-align: middle; }
#appView .audit-reference-view th { color: #526581; background: #f7f9fb; font-weight: 600; }
#appView .audit-reference-view td small { color: #718097; font-size: 11px; margin-top: 5px; }
#appView .audit-reference-view tr.selected td { background: #fff5e8; }
#appView .audit-reference-view [data-audit-detail] { white-space: nowrap; color: #a24e08; font-weight: 600; }
.audit-outcome { display: inline-flex; padding: 4px 10px; border-radius: 12px; color: #25704e; background: #e7f4ec; white-space: nowrap; font-size: 12px; }
.audit-outcome.failed { color: #9f302b; background: #fbedeb; }
.audit-read-boundary { margin-bottom: 0; font-size: 12px; }
.audit-detail-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.6fr); gap: 24px; border-top: 1px solid #e7eaf0; padding-top: 18px; }
.audit-inline-detail dl { margin: 0; padding-right: 18px; border-right: 1px solid #e7eaf0; }
.audit-inline-detail dl > div { display: grid; grid-template-columns: 90px minmax(0,1fr); gap: 12px; margin-bottom: 14px; font-size: 13px; line-height: 1.7; }
.audit-inline-detail dt { color: #60728a; }
.audit-inline-detail dd { margin: 0; overflow-wrap: anywhere; }
.audit-inline-detail h3 { margin: 0 0 12px; font-size: 15px; }
.audit-inline-detail pre { margin: 0; padding: 16px; background: #f7f9fc; border: 1px solid #e9edf3; border-radius: 8px; font-size: 12px; line-height: 1.65; max-height: 300px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.audit-inline-detail .audit-json-boundary { margin: 18px 0 0; }
#appView #content:has(.security-reference-view) .security-steps { background: #fff; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 16px; gap: 0; }
#appView #content:has(.security-reference-view) .security-step { border: 0; border-radius: 0; padding: 18px; background: transparent; }
#appView #content:has(.security-reference-view) .security-step + .security-step { border-left: 1px solid #e8e9ed; }
#appView #content:has(.security-reference-view) .security-step > span { width: 32px; height: 32px; border-radius: 50%; background: #f0ece4; color: #8a795e; }
#appView #content:has(.security-reference-view) .security-step.done > span { background: #168447; color: #fff; }
#appView #content:has(.security-reference-view) .security-step strong { font-size: 14px; }
#appView #content .security-reference-view { grid-template-columns: minmax(0,3fr) minmax(270px,2fr); gap: 16px; }
#appView #content .security-reference-view .panel { padding: 18px; margin-bottom: 16px; border-radius: 10px; }
#appView .security-reference-view .panel-head { margin-bottom: 14px; align-items: start; gap: 8px; }
#appView .security-reference-view .panel-head h2 { font-size: 19px; margin: 0 0 4px; }
#appView .security-reference-view .panel-head p { font-size: 13px; line-height: 1.55; margin: 0; }
#appView .security-reference-view .metric-list { border: 1px solid #e7eaf0; border-radius: 6px; padding: 8px 16px; }
#appView .security-reference-view .metric-list > div { display: grid; grid-template-columns: 42% minmax(0,1fr); padding: 6px 0; border: 0; gap: 10px; font-size: 13px; }
#appView .security-reference-view .metric-list dd { margin: 0; text-align: left; font-weight: 500; }
.security-account-links { display: flex; gap: 12px; margin-top: 12px; }
#appView .security-account-links button { min-height: 40px; padding: 8px 18px; flex: 1; font-size: 13px; }
#appView .security-reference-view #phoneSecurityForm { display: grid; grid-template-columns: minmax(0,1fr); gap: 12px; }
#appView .security-reference-view #phoneSecurityForm label { display: grid; grid-template-columns: 104px minmax(0,1fr); gap: 12px; align-items: center; font-size: 13px; }
#appView .security-reference-view #phoneSecurityForm input { width: 100%; min-width: 0; min-height: 38px; padding: 8px 12px; border: 1px solid #dce2e8; border-radius: 5px; background: #fff; }
#appView .security-reference-view #phoneSecurityForm button { width: calc(100% - 116px); min-height: 40px; justify-self: end; }
.security-phone-help { margin: 0; font-size: 12px; line-height: 1.6; }
#appView .security-reference-view .security-form { display: block; }
.security-sms-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 14px; }
#appView .security-reference-view .security-sms-fields label { display: grid; grid-template-columns: 92px minmax(0,1fr); align-items: center; gap: 6px; margin: 0; font-size: 12px; }
#appView .security-reference-view .security-sms-fields label.full { grid-column: 1/-1; grid-template-columns: 100px minmax(0,1fr); }
#appView .security-reference-view .security-sms-fields input { min-width: 0; min-height: 36px; padding: 7px 9px; font-size: 12px; border-radius: 5px; }
#appView .security-reference-view .security-sms-fields .switch-line { display: flex; grid-column: 1/-1; gap: 8px; min-height: 20px; padding: 0; border: 0; background: transparent; }
#appView .security-reference-view .security-sms-fields [type=checkbox] { min-height: 16px; }
#appView .security-reference-view .security-form .modal-actions { display: flex; flex-wrap: wrap; padding-top: 8px; margin-top: 10px; gap: 10px; }
#appView .security-reference-view .security-form .save-status { font-size: 12px; line-height: 1.6; flex: 1 1 180px; }
.security-sms-safety { margin-bottom: 14px; font-size: 12px; }
.security-sms-safety summary { cursor: pointer; color: #875a24; padding: 8px 0; }
#appView .security-reference-view .security-rules { counter-reset: security-rule; border: 1px solid #e7eaf0; border-radius: 7px; padding: 6px 14px; }
#appView .security-reference-view .security-rules > div { position: relative; padding: 14px 0 14px 32px; }
#appView .security-reference-view .security-rules > div::before { counter-increment: security-rule; content: counter(security-rule); position: absolute; left: 0; top: 14px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #526581; background: #edf0f5; font-size: 12px; }
#appView .security-reference-view .security-rules strong { font-size: 13px; }
#appView .security-reference-view .security-rules small { font-size: 12px; line-height: 1.65; }
#appView .security-reference-view .security-danger-panel { background: #fffcfa; border-color: #f0ded7; }
#appView .security-reference-view .security-danger-panel .panel-head h2 { color: #ac3129; }
.security-danger-item { padding: 14px; border: 1px solid #f0e2dd; border-radius: 7px; background: #fff; display: flow-root; }
.security-danger-item h3 { font-size: 14px; margin: 0 0 6px; color: #ab3028; }
.security-danger-item p { font-size: 12px; margin: 0 0 12px; line-height: 1.65; color: #677589; }
#appView .security-reference-view .security-danger-item button { width: auto; float: right; min-height: 36px; padding: 7px 14px; font-size: 12px; }
#appView .security-reference-view .security-danger-item button.danger,#appView .security-reference-view #regenerateRecoveryButton { border: 1px solid #d47067; color: #ae3229; background: #fff; }
@media(min-width:1101px){#appView .security-reference-view .security-sms-fields { grid-template-columns: repeat(12,minmax(0,1fr)); gap: 10px 12px; }#appView .security-reference-view .security-sms-fields > label { grid-column: span 6; }#appView .security-reference-view .security-sms-fields > label:has([name=signName]),#appView .security-reference-view .security-sms-fields > label:has([name=loginTemplateCode]) { grid-column: span 5; grid-template-columns: 65px minmax(0,1fr); }#appView .security-reference-view .security-sms-fields > label:has([name=codeVariable]) { grid-column: span 2; grid-template-columns: 26px minmax(0,1fr); }#appView .security-reference-view .security-sms-fields > label.full,#appView .security-reference-view .security-sms-fields > label.switch-line { grid-column: 1/-1; }}
@media(max-width:1100px){.audit-filter-top { grid-template-columns: 1fr 1fr; }.audit-date-range { grid-column: 1/-1; }.audit-filter-bottom { grid-template-columns: 1fr 1fr; }.audit-query-actions { justify-content: flex-end; }#appView .security-reference-view .security-sms-fields { grid-template-columns: 1fr; }#appView .security-reference-view .security-sms-fields label.full { grid-column: 1; }}
@media(max-width:900px){#appView #content .security-reference-view { grid-template-columns: minmax(0,1fr); }#appView .security-reference-view .security-workspace-aside { display: block; }#appView .security-reference-view .security-sms-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }}
@media(max-width:640px){.audit-filter-top,.audit-filter-bottom,.audit-detail-grid { grid-template-columns: minmax(0,1fr); }.audit-date-range { grid-column: 1; }.audit-date-range > div { flex-wrap: wrap; }.audit-date-range input { flex-basis: 100%; }.audit-pagination { margin-left: 0; flex-wrap: wrap; }.audit-inline-detail dl { border-right: 0; padding-right: 0; }#appView #content:has(.security-reference-view) .security-step + .security-step { border-left: 0; border-top: 1px solid var(--line); }#appView .security-reference-view .security-sms-fields { grid-template-columns: minmax(0,1fr); }#appView .security-reference-view #phoneSecurityForm label { grid-template-columns: 1fr; gap: 6px; }#appView .security-reference-view #phoneSecurityForm button { width: 100%; }.security-account-links { flex-wrap: wrap; }#appView .audit-reference-view label input,#appView .audit-reference-view label select { font-size: 16px; }}