/* Local presenter surface. Consumer layouts stay in style.css. */
.lab-admin { display: inline-flex; align-items: center; gap: 7px; padding: 7px 0; color: #dce5dc; font-size: 11px; }
.lab-admin .icon { width: 14px; height: 14px; }
.lab-admin:hover, .lab-admin[aria-current="page"] { color: #e1c795; }
.lab-right { gap: 18px; }
.admin-entry { display: flex; align-items: center; gap: 14px; margin: 20px 0; padding: 18px; border: 1px solid #cbd6c7; border-radius: 7px; background: #f5f7f1; }
.admin-entry > span { flex: 1; }
.admin-entry strong, .admin-entry small { display: block; }
.admin-entry strong { font-size: 13px; }
.admin-entry small { margin-top: 4px; color: #657360; font-size: 11px; }
.admin-entry:hover { background: #eaf0e6; }
.admin-site { font-size: 16px; line-height: 1.6; background: #f5f4ef; min-height: calc(100vh - 48px); }
.admin-main { max-width: 1440px; margin: 0 auto; padding: 28px 48px 0; }
.admin-utility { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; margin-bottom: 24px; color: #657366; font-size: 14px; font-weight: 500; letter-spacing: 1.1px; }
.admin-utility > span > span { color: #a6aea3; margin: 0 10px; }
.admin-utility a { font-size: 16px; letter-spacing: 0; }
.admin-utility a:hover { color: #946d35; }
.arch-badge { display: inline-flex; align-items: center; justify-content: center; width: fit-content; padding: 4px 7px; border: 1px solid #e0d8c5; background: #f8f2e5; color: #7a5c28; border-radius: 4px; font-size: 13px; line-height: 1.4; font-weight: 500; white-space: nowrap; }
.arch-badge.placeholder { background: #f0edf8; border-color: #ddd6ec; color: #685984; }
.arch-panel { border: 1px solid #dce1d5; background: #fffefa; border-radius: 12px; overflow: hidden; box-shadow: 0 6px 24px #263d2510; }
.arch-panel-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; padding: 28px 30px 20px; }
.arch-label { display: block; font: 500 14px/1.5 var(--sans); letter-spacing: 1.15px; color: #73816c; margin: 0 0 8px; }
.arch-panel-heading h1 { margin: 0; font-size: 40px; }
.arch-filters { display: flex; flex-wrap: wrap; max-width: 100%; gap: 3px; padding: 4px; border: 1px solid #e0e5d9; border-radius: 7px; background: #f2f4ee; }
.arch-filters button { padding: 10px 14px; font-size: 15px; border-radius: 4px; }
.arch-filters button[aria-pressed="true"] { background: #254a38; color: #fff; box-shadow: 0 2px 4px #254a381a; }
.arch-filters button:hover:not([aria-pressed="true"]) { background: #e2e9dc; }
.arch-legend { display: flex; flex-wrap: wrap; gap: 10px 20px; padding: 0 30px 18px; font-size: 14px; color: #717c6c; }
.arch-legend > span { display: flex; align-items: center; gap: 7px; }
.arch-legend i { width: 7px; height: 7px; border-radius: 2px; }
.arch-legend-issuer { background: #617955; }
.arch-legend-merchant { background: #ba9363; }
.arch-legend .arch-select-hint { margin-left: auto; color: #6a725f; }
.arch-map { padding: 22px 30px 0; background-color: #f7f8f2; background-image: radial-gradient(#dce2d4 0.7px, transparent 0.7px); background-size: 14px 14px; border-top: 1px solid #e2e5db; }
.arch-node { text-align: left; border: 1px solid #dbe1d4; border-radius: 7px; transition: border-color .15s, box-shadow .15s; }
.arch-node:hover { border-color: #6d8960; box-shadow: 0 2px 10px #38502b10; }
.arch-node[aria-pressed="true"] { border-color: #5a754b; box-shadow: 0 0 0 2px #5a754b25; }
.arch-node strong { display: block; font-weight: 600; font-size: 18px; }
.arch-node small { display: block; overflow-wrap: anywhere; margin-top: 4px; font-size: 14px; line-height: 1.6; color: #687360; }
.arch-node > span { min-width: 0; }
.arch-campaign-flow { display: grid; grid-template-columns: minmax(260px, 1.2fr) minmax(170px, 1fr) minmax(160px, .9fr); align-items: center; gap: 24px; padding-bottom: 24px; }
.arch-campaign { display: grid; grid-template-columns: 60px minmax(0, 1fr); align-items: center; gap: 12px; padding: 14px; background: #fffefa; }
.arch-brand-logo { display: block; flex-shrink: 0; object-fit: contain; }
.arch-brand-logo.visa { width: 60px; height: 40px; }
.arch-brand-logo.ping { width: 52px; height: 52px; }
.arch-campaign-arrow, .arch-checkout-arrow { text-align: center; font-size: 15px; color: #827047; }
.arch-campaign-arrow b, .arch-checkout-arrow b { font-size: 13px; padding-right: 5px; }
.arch-arrow { display: block; width: 100%; height: 16px; margin: 3px 0; }
.arch-campaign-arrow small, .arch-checkout-arrow small { display: block; font-size: 13px; color: #7c806f; }
.arch-arrival { display: flex; align-items: center; gap: 10px; font-size: 16px; }
.arch-arrival small { display: block; color: #7a8070; font-size: 14px; margin-top: 2px; }
.arch-arrival-dot { width: 9px; height: 9px; border: 2px solid #ba9663; border-radius: 50%; box-shadow: 0 0 0 5px #ede8d9; }
.arch-direct-map { display: grid; grid-template-columns: minmax(290px, 1.08fr) minmax(150px, .55fr) minmax(290px, 1fr); align-items: stretch; }
.arch-issuer { align-self: start; border: 1px solid #b9c9ae; background: #eaf0e3; border-radius: 9px; padding: 18px; }
.arch-boundary-label { margin: 0 0 12px; font-size: 12px; letter-spacing: 1.6px; font-weight: 600; color: #6c805d; }
.arch-bank { display: flex; align-items: center; gap: 12px; padding: 10px; background: #f7faF3; width: 100%; }
.arch-monogram { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border: 1px solid #c1cdb7; border-radius: 7px; background: #e6eddd; font: 26px var(--serif); color: #4c6640; }
.arch-bank strong { font: 30px var(--serif); letter-spacing: -.5px; }
.arch-bank-owns { margin: 12px 10px 17px; color: #67745c; font-size: 15px; line-height: 1.8; }
.arch-service { display: grid; grid-template-columns: 52px minmax(0, 1fr); align-items: center; gap: 6px 12px; padding: 13px 11px; width: 100%; margin-top: 9px; background: #fffefa; }
.arch-service strong { font-size: 15px; }
.arch-service small { font-size: 13px; }
.arch-service-number { display: block; margin-bottom: 3px; font-size: 12px; letter-spacing: .6px; color: #718160; }
.arch-issuer-store { display: flex; align-items: center; gap: 7px; margin-top: 16px; font-size: 13px; color: #718160; }
.arch-store-dot { width: 8px; height: 8px; border: 1px solid #8c9d7b; border-radius: 2px; }
.arch-direct-links { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 23px; text-align: center; padding: 26px 12px 10px; }
.arch-direct-links > div { width: 100%; }
.arch-link-number { display: block; color: #7c8c6a; font-size: 13px; margin-bottom: 4px; }
.arch-direct-links strong { display: block; font-size: 15px; font-weight: 500; }
.arch-direct-links small { display: block; font-size: 13px; color: #6c7962; margin: 5px 0; line-height: 1.6; }
.arch-direct-links .arch-arrow { height: 24px; color: #799166; }
.arch-no-broker { border: 1px dashed #b8c6ab; border-radius: 20px; padding: 5px 9px; font-size: 13px; color: #627353; }
.arch-merchants { display: flex; flex-direction: column; gap: 12px; }
.arch-merchants > .arch-boundary-label { margin: 0; padding-top: 1px; color: #8b795e; }
.arch-merchant { padding: 16px; flex: 1; min-width: 0; width: 100%; border: 1px solid #dbe1d4; border-radius: 9px; background: #fffefa; transition: opacity .15s, border-color .15s; }
.arch-merchant.travel { border-color: #c2ceba; }
.arch-merchant.retail { border-color: #d7cbb7; background: #fdf9f2; }
.arch-node-heading { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 6px 12px; }
.arch-node-heading > span { min-width: 0; }
.arch-node-heading strong { display: block; font-size: 18px; font-weight: 600; }
.arch-node-heading small { display: block; margin-top: 4px; color: #687360; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.arch-node-heading .arch-monogram { width: 38px; height: 38px; font-size: 22px; }
.retail .arch-monogram { background: #f2e8d9; border-color: #d9c8ae; color: #896b45; font-size: 18px; }
.arch-journey-tag { grid-column: 2; font-size: 12px; color: #798768; letter-spacing: .7px; margin-left: 0; align-self: flex-start; white-space: nowrap; }
.retail .arch-journey-tag { color: #9a7954; }
.arch-merchant-idp { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; width: 100%; margin-top: 14px; padding: 11px 12px; background: #fff; }
.arch-merchant-idp .arch-brand-logo.ping { width: 44px; height: 44px; }
.arch-merchant-idp strong { font-size: 17px; }
.arch-token-flow { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 6px 0; color: #687360; font-size: 13px; line-height: 1.5; }
.arch-token-flow > span { font-size: 20px; color: #829371; }
.arch-merchant-app { display: block; width: 100%; padding: 11px 12px; background: #f8faf4; }
.arch-merchant-app .arch-claims { margin-top: 0; }
.arch-merchant-app .arch-store { margin-top: 8px; padding-top: 6px; }
.retail .arch-merchant-app { background: #fcf6ed; }
.arch-claims { display: block; font-size: 16px; font-weight: 500; margin-top: 14px; }
.arch-node-note { display: block; font-size: 14px; color: #7b816f; margin-top: 5px; }
.arch-store { display: block; border-top: 1px solid #e6e9de; margin-top: 12px; padding-top: 8px; color: #7a826f; font-size: 13px; }
.arch-map[data-journey="travel"] .arch-merchant.retail, .arch-map[data-journey="retail"] .arch-merchant.travel { opacity: .4; }
.arch-map .arch-merchant:has([aria-pressed="true"]), .arch-map .arch-merchant:focus-within, .arch-map .arch-merchant:hover { opacity: 1; border-color: #5a754b; }
.arch-bottom-map { display: grid; grid-template-columns: minmax(290px, 1.08fr) minmax(150px, .55fr) minmax(290px, 1fr); align-items: center; margin-top: 28px; }
.arch-loyalty { display: flex; align-items: center; gap: 11px; padding: 12px; background: #f9fbf6; }
.arch-loyalty > span:first-child { font-size: 24px; color: #90a17b; }
.arch-loyalty strong { font-size: 15px; }
.arch-loyalty small { font-size: 13px; }
.arch-checkout-arrow { color: #7b8868; padding: 0 10px; }
.arch-checkout-arrow small { margin-top: 5px; }
.arch-payment { display: grid; grid-template-columns: 60px minmax(0, 1fr); align-items: center; gap: 12px; padding: 14px; background: #f9faf7; position: relative; }
.arch-payment::before { content: ''; position: absolute; left: 50%; top: -29px; height: 23px; border-left: 1px solid #8f9e7e; }
.arch-payment::after { content: ''; position: absolute; left: calc(50% - 3px); top: -12px; width: 7px; height: 7px; border: solid #8f9e7e; border-width: 0 1px 1px 0; transform: rotate(45deg); }
.arch-payment strong { font-size: 16px; }
.arch-payment small { font-size: 13px; }
.arch-map-caption { padding: 18px 0 15px; margin: 0; color: #75806a; font-size: 14px; text-align: center; }
.arch-inspector { display: flex; align-items: flex-start; gap: 16px; padding: 24px 30px; border-top: 1px solid #dfe6d7; background: #eef3e8; }
.arch-inspector-mark { display: grid; place-items: center; flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; border: 1px solid #bdcdb0; color: #728963; font: italic 20px var(--serif); margin-top: 2px; }
.arch-inspector h3 { font: 500 20px/1.5 var(--sans); letter-spacing: 0; margin: 0 0 7px; }
.arch-inspector p:not(.arch-label) { color: #66765a; font-size: 16px; max-width: 950px; margin: 0; }
.arch-inspector ul { display: flex; flex-wrap: wrap; gap: 6px 23px; padding: 0; margin: 12px 0 0; list-style: none; color: #536d47; font-size: 14px; }
.arch-inspector li::before { content: '✓'; margin-right: 6px; color: #7d9969; }
.arch-section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 36px; margin: 36px 0 20px; }
.arch-section-heading h2 { font-size: 34px; margin: 0; }
.arch-section-heading > p { max-width: 340px; font-size: 16px; margin: 0; }
.arch-journeys { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.arch-journey-card { padding: 27px 30px 0; border: 1px solid #d9e0d1; background: #f0f4e9; border-radius: 9px; overflow: hidden; }
.arch-journey-card.retail { background: #f7f1e7; border-color: #e5dbca; }
.arch-journey-card.retail .arch-label { color: #937955; }
.arch-journey-card h3 { font-size: 34px; margin-bottom: 22px; }
.arch-journey-card ol { list-style: none; counter-reset: steps; padding: 0; margin: 0 0 24px; }
.arch-journey-card li { position: relative; counter-increment: steps; padding: 0 0 18px 34px; }
.arch-journey-card li:last-child { padding-bottom: 0; }
.arch-journey-card li::before { content: counter(steps, decimal-leading-zero); position: absolute; left: 0; top: 0; color: #8a9d78; font-size: 14px; }
.arch-journey-card li::after { content: ''; position: absolute; top: 23px; bottom: 7px; left: 6px; border-left: 1px solid #d2dcc5; }
.arch-journey-card li:last-child::after { display: none; }
.arch-journey-card b { display: block; font-size: 16px; font-weight: 500; margin-bottom: 4px; }
.arch-journey-card li span { color: #6c7c5e; font-size: 15px; display: block; line-height: 1.75; }
.arch-journey-card.retail li span { color: #887a65; }
.arch-journey-card.retail li::after { border-color: #e3d7c2; }
.arch-journey-card.retail li::before { color: #aa8b60; }
.arch-outcome { margin: 0 -30px; padding: 13px 30px; background: #e6eddd; color: #637653; font-size: 14px; }
.retail .arch-outcome { background: #efe6d7; color: #8b7351; }
.arch-journeys[data-journey="travel"] [data-journey-detail="retail"], .arch-journeys[data-journey="retail"] [data-journey-detail="travel"] { display: none; }
.arch-journeys:not([data-journey="both"]) { grid-template-columns: 1fr; }
.arch-runtime { display: grid; grid-template-columns: .9fr 1.3fr; gap: 48px; padding: 36px 0; }
.arch-runtime h2 { font-size: 34px; }
.arch-runtime-intro > p:last-child { font-size: 16px; max-width: 440px; margin: 0; }
.arch-runtime-list > div { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 0; border-bottom: 1px solid #dedfd5; }
.arch-runtime-list > div:first-child { padding-top: 0; }
.arch-runtime-list strong { display: block; font-size: 16px; font-weight: 500; }
.arch-runtime-list small { display: block; margin-top: 3px; font-size: 15px; color: #7d826f; }
.arch-disclosure { background: #fafaf5; border: 1px solid #dce0d3; border-radius: 8px; margin-bottom: 14px; }
.arch-disclosure summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 20px 26px; cursor: pointer; }
.arch-disclosure summary::-webkit-details-marker { display: none; }
.arch-disclosure summary strong { font-size: 20px; font-weight: 400; }
.arch-disclosure summary .arch-label { margin-bottom: 5px; font-size: 13px; }
.arch-disclosure-icon { font-size: 30px; font-weight: 300; color: #8a957b; transition: transform .15s; }
.arch-disclosure[open] .arch-disclosure-icon { transform: rotate(45deg); }
.arch-state-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; padding: 10px 26px 20px; }
.arch-state-grid h3 { font-size: 26px; margin-bottom: 12px; }
.arch-state-grid p { font-size: 16px; }
.arch-state-grid strong { font-size: 15px; font-weight: 500; color: #476737; }
.arch-alternative-body { padding: 0 26px 20px; }
.arch-alternative-body > p { font-size: 16px; max-width: 900px; }
.arch-broker-map { display: grid; grid-template-columns: 1fr auto 1.1fr auto 1fr; align-items: center; gap: 14px; margin: 22px 0; }
.arch-broker-map > div { text-align: center; padding: 20px 12px; background: #f0f1e9; border: 1px solid #dce0cf; border-radius: 6px; }
.arch-broker-map strong { display: block; font-size: 16px; font-weight: 500; }
.arch-broker-map > span { color: #89977c; }
.arch-broker-map div > span { display: block; font-size: 14px; margin-top: 5px; color: #818a72; }
.arch-broker-map .arch-broker { border: 1px dashed #b9aece; background: #f2eef7; color: #706181; }
.arch-alternative-note { margin: 0; }
.admin-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 0 30px; color: #858c7b; font-size: 14px; }
@media (max-width: 1120px) {
  .admin-main { padding: 24px 28px 0; }
  .arch-map { padding: 22px 22px 0; }
  .arch-direct-map { grid-template-columns: minmax(270px, 1fr) 160px minmax(260px, 1fr); }
  .arch-bottom-map { grid-template-columns: minmax(270px, 1fr) 160px minmax(260px, 1fr); }
  .arch-legend .arch-select-hint { margin-left: 0; }
}
@media (max-width: 900px) {
  .lab-right .local-status { display: none; }
  .admin-main { padding: 22px 24px 0; }
  .arch-direct-map { grid-template-columns: 1fr; }
  .arch-direct-links { display: grid; grid-template-columns: 1fr 1fr; padding: 18px 12px; gap: 12px; }
  .arch-direct-links .arch-arrow { width: 70px; margin: 0 auto; }
  .arch-no-broker { grid-column: 1 / -1; justify-self: center; }
  .arch-merchants { display: grid; grid-template-columns: 1fr 1fr; }
  .arch-merchants > .arch-boundary-label { grid-column: 1 / -1; }
  .arch-campaign-flow { grid-template-columns: 1fr 1fr; gap: 14px; }
  .arch-campaign-arrow { grid-column: 2; grid-row: 1; }
  .arch-arrival { grid-column: 2; justify-content: center; }
  .arch-bottom-map { grid-template-columns: 1fr 1fr; gap: 16px; }
  .arch-loyalty { grid-column: 1 / -1; order: 3; }
  .arch-runtime { gap: 30px; }
}
@media (max-width: 640px) {
  .lab-admin > span { display: none; }
  .lab-right { gap: 13px; }
  .lab-admin .icon { width: 16px; height: 16px; }
  .lab-switcher { gap: 0; }
  .lab-switcher a { padding-left: 7px; padding-right: 7px; }
  .admin-main { padding: 18px 16px 0; }
  .admin-utility { font-size: 12px; letter-spacing: .5px; gap: 10px; margin-bottom: 18px; }
  .admin-utility > span > span { margin: 0 4px; }
  .admin-utility a { font-size: 14px; }
  .arch-panel-heading { display: block; padding: 21px 18px 16px; }
  .arch-panel-heading h1 { font-size: 34px; }
  .arch-filters { margin-top: 18px; width: fit-content; }
  .arch-filters button { padding: 9px 14px; }
  .arch-legend { display: grid; padding: 0 18px 17px; gap: 8px; }
  .arch-legend .arch-select-hint { font-size: 13px; }
  .arch-map { padding: 18px 14px 0; }
  .arch-campaign-flow { display: flex; flex-direction: column; align-items: stretch; padding-bottom: 18px; gap: 8px; }
  .arch-campaign { padding: 12px; }
  .arch-campaign strong { font-size: 16px; }
  .arch-campaign-arrow { padding: 0 10px; }
  .arch-campaign-arrow .arch-arrow { width: 74px; margin: 0 auto; }
  .arch-arrival { font-size: 15px; padding: 4px; }
  .arch-arrival small { font-size: 13px; }
  .arch-issuer { padding: 14px; }
  .arch-service { gap: 5px 10px; }
  .arch-bank-owns { margin-left: 0; }
  .arch-direct-links { padding: 18px 0; gap: 10px; }
  .arch-direct-links strong { font-size: 14px; }
  .arch-merchants { grid-template-columns: 1fr; }
  .arch-merchant { padding: 15px; }
  .arch-journey-tag { font-size: 12px; }
  .arch-bottom-map { display: flex; flex-direction: column; align-items: stretch; gap: 12px; margin-top: 18px; }
  .arch-payment::before, .arch-payment::after { display: none; }
  .arch-checkout-arrow .arch-arrow { width: 74px; margin: 0 auto; }
  .arch-loyalty { order: 3; }
  .arch-map-caption { font-size: 13px; }
  .arch-inspector { padding: 20px 18px; gap: 10px; }
  .arch-inspector-mark { width: 22px; height: 22px; }
  .arch-inspector .arch-label { font-size: 12px; }
  .arch-inspector h3 { font-size: 18px; }
  .arch-inspector p:not(.arch-label) { font-size: 15px; }
  .arch-inspector ul { display: grid; font-size: 13px; }
  .arch-section-heading { display: block; margin-top: 30px; }
  .arch-section-heading h2 { font-size: 32px; }
  .arch-section-heading > p { max-width: none; margin-top: 12px; }
  .arch-journeys { grid-template-columns: 1fr; gap: 16px; }
  .arch-journey-card { padding: 23px 22px 0; }
  .arch-journey-card h3 { font-size: 32px; }
  .arch-outcome { margin: 0 -22px; padding: 13px 22px; font-size: 13px; }
  .arch-runtime { grid-template-columns: 1fr; gap: 24px; padding: 30px 0; }
  .arch-runtime-list small { font-size: 14px; }
  .arch-disclosure summary { padding: 19px 18px; }
  .arch-disclosure summary strong { font-size: 18px; }
  .arch-disclosure summary .arch-label { font-size: 12px; }
  .arch-state-grid { grid-template-columns: 1fr; gap: 10px; padding: 5px 18px 18px; }
  .arch-state-grid p:last-child { margin-bottom: 0; }
  .arch-state-grid article + article { border-top: 1px solid #e1e5d8; padding-top: 18px; margin-top: 8px; }
  .arch-alternative-body { padding: 0 18px 18px; }
  .arch-broker-map { grid-template-columns: 1fr; gap: 8px; text-align: center; }
  .arch-broker-map > span { transform: rotate(90deg); }
  .admin-footer { display: block; font-size: 13px; padding: 16px 0 24px; }
  .admin-footer > span { display: block; margin: 5px 0; }
}