/* Approved six Office access compositions. No mockup transport or outcomes. */
body.office-access-approved{margin:0;background:#fff;padding:14px}
#splash-office-pages [hidden]{display:none!important}
#splash-office-pages .access-stage{min-height:650px;border:1px solid var(--so-line);border-radius:9px;background:linear-gradient(115deg,var(--so-bg),var(--op-eef8f5,#eef8f5));padding:23px;display:grid;align-content:start}
#splash-office-pages .access-heading{display:flex;gap:9px;align-items:center;margin-bottom:55px;font-size:20px;font-weight:700}
#splash-office-pages .access-heading img{width:25px;height:25px}
#splash-office-pages .access-card{width:100%;max-width:420px;margin:0 auto;background:var(--so-paper);border:1px solid var(--so-line);border-radius:7px;padding:24px}
#splash-office-pages .brand-heading{display:flex;align-items:center;gap:11px;margin-bottom:20px;color:var(--so-muted);font-size:12px}
#splash-office-pages .brand-heading img{width:48px;height:34px;object-fit:contain}
#splash-office-pages .intro{color:var(--so-muted);font-size:12px;line-height:1.5;margin:10px 0 20px}
#splash-office-pages .field{display:block;margin-bottom:15px;color:var(--so-muted);font-size:11px}
#splash-office-pages .field>input{margin-top:5px;color:var(--so-ink)}
#splash-office-pages .password-line{display:flex;align-items:center;gap:9px;margin-top:5px}
#splash-office-pages .password-line input{flex:1;width:1px;color:var(--so-ink)}
#splash-office-pages .password-line button{flex:none}
#splash-office-pages .credential-actions{display:flex;gap:12px;align-items:center;margin-top:5px}
#splash-office-pages .quiet-actions{display:flex;flex-direction:column;align-items:start;gap:12px;margin-top:21px;padding-top:17px;border-top:1px solid var(--so-line)}
#splash-office-pages .status{font-size:12px;line-height:1.5;margin:16px 0 0;min-height:18px}
#splash-office-pages .status[data-state=refused],#splash-office-pages .status[data-state=limited],#splash-office-pages .status[data-state=unavailable]{color:var(--so-red)}
#splash-office-pages .status[data-state=uncertain]{color:#8a622b}
#splash-office-pages .notice{font-size:12px;color:var(--so-green);line-height:1.5;margin-bottom:17px}
#splash-office-pages :focus-visible{outline:2px solid var(--so-teal);outline-offset:3px}
#splash-office-pages button:disabled{opacity:.6;cursor:default}
#splash-office-pages p,#splash-office-pages label,#splash-office-pages h1,#splash-office-pages h2{overflow-wrap:normal;word-break:normal;hyphens:none}
#splash-office-pages .token{overflow-wrap:anywhere}
@media(max-width:600px){
#splash-office-pages .access-stage{min-height:550px;padding:16px}
#splash-office-pages .access-heading{margin-bottom:30px}
#splash-office-pages .access-card{padding:16px}
#splash-office-pages .so-button,#splash-office-pages .so-link{min-height:44px;display:inline-flex;align-items:center}
#splash-office-pages input:not([type=checkbox]),#splash-office-pages select{min-height:44px}
#splash-office-pages .credential-actions{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){
#splash-office-pages *{transition:none!important;animation:none!important}
}
#splash-office-pages .access-heading .office-home{font-size:20px;font-weight:700;color:var(--so-ink);text-decoration:none}
#splash-office-pages .access-card{box-sizing:border-box}
#splash-office-pages .access-stage{min-height:650px}
#splash-office-pages .checkbox-field{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.5;margin:0 0 15px}
#splash-office-pages .checkbox-field input{width:auto}
#splash-office-pages .method-choices{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
#splash-office-pages .method-choices button{display:grid;gap:3px;text-align:left}
#splash-office-pages .method-hint{font-size:10px;color:var(--so-muted)}
#splash-office-pages .qr-placeholder{width:156px;height:156px;display:grid;place-content:center;text-align:center;border:1px solid var(--so-line);border-radius:6px;background:var(--so-soft);font-size:12px;margin:15px 0}
#splash-office-pages .recovery-list{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding-left:23px;font-size:12px;line-height:1.5}
#splash-office-pages .access-card details{font-size:12px;line-height:1.5;margin:15px 0}
#splash-office-pages .access-card summary{cursor:pointer;min-height:36px;align-content:center}
#splash-office-pages .access-card.mfa-card details:not(.mfa-setup-key) form{margin-top:12px}
#splash-office-pages [data-mfa-methods]{border-top:1px solid var(--so-line);margin-top:18px}
#splash-office-pages .status:empty{display:none}
@media(max-width:600px){
#splash-office-pages .access-card input:not([type=checkbox]),#splash-office-pages .access-card select{font-size:16px}
#splash-office-pages .access-stage{padding:12px}
#splash-office-pages .access-heading{margin-bottom:26px}
#splash-office-pages .access-card{padding:18px}
#splash-office-pages .recovery-list{grid-template-columns:1fr}
#splash-office-pages .access-card summary{min-height:44px}
}

body.office-access-approved #splash-office-pages{max-width:1700px;margin:auto}
#splash-office-pages .access-card form>label:not(.checkbox-field){display:block;color:var(--so-muted);font-size:11px;margin:0}
#splash-office-pages .access-card form>input:not([type=hidden]):not([type=checkbox]){margin:5px 0 15px}
#splash-office-pages .access-card .password-line{margin:5px 0 15px}
#splash-office-pages .access-error{color:var(--so-red);margin:12px 0}
#splash-office-pages .mfa-qr{display:grid;place-items:center;margin:15px 0}
#splash-office-pages .mfa-setup-key code{display:block;overflow-wrap:anywhere}
#splash-office-pages .so-button-current{background:var(--so-soft)}
#splash-office-pages .mfa-text-row{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
#splash-office-pages .mfa-text-row input{flex:1;min-width:120px}
#splash-office-pages .mfa-text-row .so-link{flex:none}
#splash-office-pages .mfa-footer{font-size:12px;line-height:1.5;margin-top:20px}
@media(max-width:600px){body.office-access-approved{padding:8px}}