*{box-sizing:border-box}body{margin:0;font-family:var(--font);background:#edf1f5;color:var(--ink)}button,a,input{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.board-header{height:92px;background:var(--navy);color:white}.header-inner{max-width:1700px;margin:auto;padding:20px 48px;display:flex;justify-content:space-between;align-items:center}.board-brand{display:flex;align-items:center;gap:14px}.board-brand img{width:49px;height:49px;border:1px solid #ffffff30;border-radius:15px}.board-brand strong{display:block;font-size:23px;letter-spacing:3px}.board-brand span{display:block;margin-top:6px;font-size:10px;color:#acbfcd;letter-spacing:2px}.header-links{display:flex;align-items:center;gap:28px;font-size:11px;color:#b9cbd9}.version{display:flex;gap:7px;align-items:center}.version i{height:5px;width:5px;background:#f2a06e;border-radius:50%}.entry-link{border:1px solid #ffffff40;padding:12px 17px;border-radius:7px;color:white}.entry-link span{margin-left:20px;color:#ffb98b}main{max-width:1700px;padding:0 48px;margin:auto}.board-intro{display:flex;align-items:center;justify-content:space-between;padding:54px 0 38px;gap:30px}.board-eyebrow{font-size:10px;letter-spacing:2px;color:#a36d46;font-weight:650}h1{font-size:34px;letter-spacing:1px;margin:15px 0 17px;font-weight:650}.board-intro p{font-size:12px;line-height:1.9;color:#7e8c99}.intro-numbers{display:flex;gap:37px;text-align:center}.intro-numbers strong{display:block;font-size:40px;color:#25465f;font-weight:400;letter-spacing:-1px}.intro-numbers span{display:block;font-size:10px;color:#8795a1;letter-spacing:2px;margin-top:9px}.filter-bar{position:sticky;top:0;z-index:20;background:#edf1f5f5;border-top:1px solid #dce3e9;border-bottom:1px solid #dce3e9;padding:17px 0;display:flex;justify-content:space-between;gap:10px;backdrop-filter:blur(8px)}#role-filters{display:flex;gap:6px;flex-wrap:wrap}#role-filters button{border:0;background:none;color:#748595;font-size:12px;padding:9px 14px;border-radius:6px;transition:.15s}#role-filters button.active{background:var(--navy);color:white}.view-switch{font-size:10px;color:#84939f;display:flex;align-items:center;gap:16px;white-space:nowrap}.view-switch label{display:flex;align-items:center;gap:5px;cursor:pointer}.view-switch input{accent-color:var(--navy)}.group{padding-top:39px;margin-bottom:22px}.group-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.group-title{display:flex;align-items:baseline;gap:13px}.group-title .no{font-size:11px;font-family:monospace;color:#ad7d56;letter-spacing:2px}.group-title h2{font-size:23px;font-weight:650;margin:0;letter-spacing:1px}.group-title .count{font-size:10px;color:#8d9aa6;letter-spacing:1px}.flow{font-size:10px;color:#8393a1;letter-spacing:.4px;margin:0}.phone-grid{display:grid;grid-template-columns:repeat(auto-fit,393px);gap:39px 26px;justify-content:space-between}.phone-item{width:393px}.phone-label{font-size:11px;display:flex;align-items:center;justify-content:space-between;margin:0 5px 12px;color:#607789;font-weight:550}.phone-label span{font-size:9px;font-weight:400;color:#93a0ab;letter-spacing:1px}.device{width:393px;height:852px;border-radius:39px;overflow:hidden;border:5px solid #152735;box-shadow:0 12px 24px #243d5014,0 0 0 1px #152735;position:relative;background:white}.device iframe{width:393px;height:852px;border:0;transform:scale(.975);transform-origin:top left;display:block}.device{height:841px}.phone-label a:hover{color:var(--orange)}.board-footer{text-align:center;padding:65px 20px;color:#8b9aa6;border-top:1px solid #dce3e9;margin-top:70px}.board-footer span{font-size:18px;color:#3a5569;letter-spacing:3px}.board-footer p{font-size:11px;letter-spacing:1px;margin:14px 0 20px}.board-footer small{font-size:9px}.to-top{position:fixed;bottom:25px;right:25px;border:1px solid #d4dee7;border-radius:50%;background:white;color:var(--navy);height:40px;width:40px;z-index:30}.compact .phone-item{width:275px}.compact .phone-grid{grid-template-columns:repeat(auto-fit,275px);gap:30px 20px}.compact .device{width:275px;height:593px;border-radius:30px}.compact .device iframe{transform:scale(.674)}.compact .phone-label{font-size:10px}.compact .phone-label span{display:none}@media(min-width:1650px){.phone-grid{gap:39px 18px}}@media(max-width:1250px){.flow{display:none}.view-switch #visible-count{display:none}.intro-numbers{gap:20px}.header-inner,main{padding-left:30px;padding-right:30px}}@media(max-width:900px){h1{font-size:29px}.board-intro{padding:35px 0 25px}.intro-numbers{display:none}.view-switch{display:none}.phone-grid{justify-content:center;gap:35px}.group-heading{justify-content:center}.version{display:none}.header-inner,main{padding-left:20px;padding-right:20px}.entry-link{font-size:10px}.board-brand span{letter-spacing:0}}@media(max-width:430px){main{padding:0 10px}.phone-item{width:353px}.device{transform:scale(.898);transform-origin:top left;margin-bottom:-86px}.phone-label{padding:0 4px}.phone-grid{grid-template-columns:353px}.board-intro p{font-size:11px}h1{font-size:25px}.board-brand img{width:40px;height:40px}.board-brand strong{font-size:20px}.board-brand span{font-size:8px}.header-links{gap:0}.entry-link span{margin-left:4px}}
/* Identity scenarios and reusable capabilities are separate presentation levels. */
#role-filters{display:flex;flex-direction:column;gap:10px;flex:1;min-width:0}.filter-line{display:flex;align-items:center;gap:13px}.filter-label{flex-shrink:0;font-size:10px;letter-spacing:1px;color:#667f92;font-weight:650;min-width:70px}.filter-options{display:flex;flex-wrap:wrap;gap:4px}.filter-bar{align-items:flex-start}.view-switch{padding-top:10px}.area-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:42px;padding:17px 20px;background:#e2e9f0;border-radius:9px}.area-heading>span{font-size:12px;color:#2d4f69;font-weight:650;letter-spacing:1px}.area-heading p{font-size:11px;color:#74899a;margin:0;line-height:1.7}.group-heading{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:18px}.group-title{flex-wrap:wrap;gap:10px}.group-kind{font-size:9px;background:#dfe7ef;color:#5c778d;padding:5px 8px;border-radius:4px;align-self:center;letter-spacing:1px}.flow{font-size:11px;line-height:1.8;display:block!important;margin-left:0;color:#758b9c}.stage-heading{display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.5px;font-weight:550;color:#4e6a80;margin:0 0 18px}.stage-heading span{font-size:10px;color:#a77955;letter-spacing:1px}.journey-stage{margin:24px 0 36px;padding-top:17px;border-top:1px solid #dce4eb}.journey-links{display:flex;align-items:center;flex-wrap:wrap;gap:9px;font-size:10px;line-height:1.7;margin:14px 0 22px;padding:13px 16px;background:#e6edf3;border-radius:7px}.journey-links>span{color:#8395a3;margin-right:5px}.journey-links a{color:#3c607d;border-bottom:1px solid #b6c7d5}.journey-links b{color:#9aafbf;font-weight:400}.intro-numbers span{letter-spacing:1px;white-space:nowrap}.area-heading+.group{padding-top:28px}@media(max-width:900px){.area-heading{align-items:flex-start;flex-direction:column;gap:7px}.group-heading{align-items:flex-start}.filter-label{min-width:60px;font-size:9px}.filter-line{gap:4px}#role-filters button{font-size:11px;padding:8px 10px}.filter-bar{padding:12px 0}.flow{font-size:10px}}
/* Retain the reading grid when a journey stage has only one or two screens. */
.phone-grid{grid-template-columns:repeat(auto-fill,393px)}.compact .phone-grid{grid-template-columns:repeat(auto-fill,275px)}@media(max-width:430px){.phone-grid{grid-template-columns:353px}}
/* A phone is already the device: keep previews at native CSS text size rather
   than shrinking the desktop device mockup a second time. */
.mobile-reading-note{display:none}
@media(max-width:600px){
 html{font-size:16px;-webkit-text-size-adjust:100%}
 .board-header{height:auto}.header-inner{padding:16px;gap:14px;flex-wrap:wrap}
 .board-brand{gap:10px}.board-brand img{width:40px;height:40px}.board-brand strong{font-size:21px;letter-spacing:1px}.board-brand span{font-size:12px;line-height:1.5;letter-spacing:0}
 .header-links{margin-left:auto}.entry-link{display:inline-flex;align-items:center;min-height:44px;padding:10px 14px;font-size:14px}.entry-link span{margin-left:8px}
 main{padding:0 16px}.board-intro{padding:28px 0 22px}.board-eyebrow{font-size:12px;line-height:1.6;letter-spacing:1px}h1{font-size:28px;line-height:1.4;letter-spacing:0}.board-intro p{font-size:16px;line-height:1.8;color:#4b6274}
 .mobile-reading-note{display:block;font-size:14px;line-height:1.7;color:#4b6274;background:#e2e9f0;padding:14px 16px;border-radius:8px;margin:0 0 20px}
 /* A wrapped identity menu must scroll with the page, not cover its content. */
 .filter-bar{position:static;padding:16px 0}.filter-line{align-items:flex-start;flex-direction:column;gap:8px}.filter-label{font-size:14px;letter-spacing:0;color:#4b6274}#role-filters{gap:16px}.filter-options{gap:8px}#role-filters button{font-size:14px;min-height:44px;padding:10px 12px;color:#4b6274;line-height:1.5}
 #role-filters button.active{color:white}.area-heading{padding:16px;margin-top:28px}.area-heading>span{font-size:16px;letter-spacing:0}.area-heading p{font-size:14px;color:#4b6274}
 .group{padding-top:28px}.group-title{gap:8px}.group-title h2{font-size:22px;line-height:1.5;letter-spacing:0}.group-kind,.group-title .count{font-size:14px;letter-spacing:0;color:#4b6274}.flow{font-size:16px;line-height:1.8;color:#4b6274}.stage-heading{font-size:16px;line-height:1.6;letter-spacing:0}.stage-heading span{font-size:14px;color:#775536}
 .phone-grid,.compact .phone-grid{grid-template-columns:minmax(0,1fr);gap:28px}.phone-item,.compact .phone-item{width:100%;min-width:0}.phone-label,.compact .phone-label{font-size:16px;gap:8px;padding:0;margin:0 0 10px;align-items:center}.phone-label a{display:flex;align-items:center;min-height:44px;line-height:1.5;color:#274d69}.phone-label span{font-size:14px;letter-spacing:0;color:#4b6274;white-space:nowrap}
 .device,.compact .device{width:100%;height:852px;transform:none;margin:0;border:0;border-radius:16px;box-shadow:0 4px 18px #243d5014}.device iframe,.compact .device iframe{width:100%;height:852px;transform:none}
 .journey-links{font-size:14px;line-height:1.7;padding:12px;gap:8px}.journey-links>span{color:#4b6274}.journey-links a{display:inline-flex;align-items:center;min-height:44px;padding:6px 4px}.journey-links b{color:#4b6274}
 .board-footer{padding:36px 16px 80px;margin-top:36px}.board-footer p,.board-footer small{font-size:14px;line-height:1.8;color:#4b6274}.board-footer p{letter-spacing:0}.to-top{height:48px;width:48px;right:16px;bottom:16px;font-size:20px}
}
/* The overview's floating arrow must not cover the embedded app's SOS button. */
@media(max-width:600px){.to-top{display:none}}
.page-directory{margin-top:36px;border-top:1px solid #ccd7e0;padding:24px 0;color:#4b6274}.page-directory summary{cursor:pointer;min-height:44px;font-size:16px;font-weight:600;line-height:1.6}.page-directory p{font-size:14px;line-height:1.8}.directory-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}.directory-links a{font-size:14px;padding:12px;min-height:44px;background:white;border-radius:6px;line-height:1.6}

.phone-label .screen-title{display:block;min-width:0;white-space:normal;font-size:11px;font-weight:600;color:#607789;letter-spacing:0}.compact .phone-label .screen-title{display:block;font-size:10px}.directory-links>span{font-size:14px;padding:12px;border-radius:8px;background:white;border:1px solid #dfe7ee;color:#526b7e}.presentation-overview .board-brand{cursor:default}
@media(max-width:600px){.phone-label .screen-title,.compact .phone-label .screen-title{font-size:16px;line-height:1.5}}
