/* PPE proof is the subject; the source screen never sits inside a fake phone. */
body.hw-ppe-r30 #ppe-how .cm-story-pin{height:728px;min-height:0;padding:38px 0 42px}
body.hw-ppe-r30 #ppe-how .cm-story-grid{grid-template-columns:minmax(280px,.85fr) minmax(0,1.8fr);gap:44px;max-height:none}
body.hw-ppe-r30 #ppe-how .cm-story-visual{height:640px;max-height:100%;overflow:visible}
body.hw-ppe-r30 #ppe-how .cm-story-steps{max-width:290px}
body.hw-ppe-r30 .p30-source{position:relative;display:block;aspect-ratio:var(--p30-ratio);overflow:hidden;width:100%;margin:0;background:#fff;border:0;border-radius:0;box-shadow:none}
body.hw-ppe-r30 .p30-source>img{position:absolute;left:var(--p30-img-left);top:var(--p30-img-top);width:var(--p30-img-width);height:auto;max-width:none;max-height:none;object-fit:initial;margin:0}
body.hw-ppe-r30 .p30-photo-scene{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:none}
body.hw-ppe-r30 .p30-helmet{width:min(100%,378px);box-shadow:0 12px 50px -32px #263b4a40}
body.hw-ppe-r30 .p30-request-scene{width:100%;display:flex;flex-direction:column;gap:0;max-width:820px;margin:auto}
body.hw-ppe-r30 .p30-detection{border-radius:12px}
body.hw-ppe-r30 .p30-request-line{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #ded6ec;padding:23px 0}
body.hw-ppe-r30 .p30-request-line>div{display:flex;flex-direction:column;gap:8px}
body.hw-ppe-r30 .p30-request-line>div>span{font-size:12px;color:#705993}
body.hw-ppe-r30 .p30-request-line strong{font-size:19px;font-weight:550;color:#2a203b}
body.hw-ppe-r30 .p30-request-line button{display:inline-flex;gap:16px;align-items:center;justify-content:center;min-height:44px;border:0;border-radius:8px;padding:10px 14px;background:#f2edfa;color:#4c00ff;font:inherit;font-size:13px;font-weight:500;cursor:pointer;transition:transform 140ms cubic-bezier(.23,1,.32,1),background-color 140ms ease}
body.hw-ppe-r30 .p30-request-line button:active{transform:scale(.97)}
body.hw-ppe-r30 .p30-settings{background:#f8f7fb;padding-block:76px}
body.hw-ppe-r30 .p30-settings .cm-split{grid-template-columns:minmax(280px,.85fr) minmax(0,1.8fr);gap:44px}
body.hw-ppe-r30 .p30-scope{display:flex;align-items:center;gap:16px;margin-top:32px;color:#6c617c;font-size:15px}
body.hw-ppe-r30 .p30-scope [aria-hidden]{color:#b6a8ca;font-size:14px}
body.hw-ppe-r30 .p30-setting-visual{width:100%;max-width:760px;justify-self:end;background:#fff;border-radius:12px;padding:24px 26px}
body.hw-ppe-r30 .p30-setting-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:18px;margin-bottom:10px;border-bottom:1px solid #eee9f4}
body.hw-ppe-r30 .p30-setting-bar>span{font-size:16px;font-weight:550;color:#282130}
body.hw-ppe-r30 .p30-expand{display:flex;align-items:center;justify-content:center;gap:10px;min-height:40px;border:0;border-radius:7px;padding:7px 11px;background:#f6f2fc;color:#5d4681;font:inherit;font-size:12px;cursor:pointer;transition:transform 140ms ease-out}
body.hw-ppe-r30 .p30-expand:active{transform:scale(.97)}
body.hw-ppe-r30 :is(.p30-expand,[data-p30-photo],.p30-close):focus-visible{outline:2px solid #4c00ff;outline-offset:3px}
body.hw-ppe-r30 .p30-dialog{inset:12px;margin:auto;width:min(940px,calc(100vw - 24px));max-width:calc(100vw - 24px);height:calc(100svh - 24px);max-height:calc(100svh - 24px);padding:70px 22px 28px;background:#fff;border:1px solid #e2ddeb;border-radius:14px;overflow:auto;overscroll-behavior:contain}
body.hw-ppe-r30 .p30-dialog::backdrop{background:#1b132980}
body.hw-ppe-r30 .p30-close{position:fixed;top:28px;right:28px;z-index:3;min-height:44px;padding:8px 18px;background:#fff;border:1px solid #e4deec;border-radius:8px;font:inherit;font-size:14px;cursor:pointer}
body.hw-ppe-r30 .p30-dialog-view{position:relative;overflow:hidden;margin:auto}
body.hw-ppe-r30 .p30-dialog-view>img{position:absolute;width:1485px;height:812px;left:-47px;top:-144px;max-width:none;max-height:none}
@media(hover:hover){body.hw-ppe-r30 :is(.p30-expand,[data-p30-photo]):hover{background:#eae1f8}}
@media(min-width:761px) and (max-width:1100px){
 body.hw-ppe-r30 #ppe-how .cm-story-grid,body.hw-ppe-r30 .p30-settings .cm-split{grid-template-columns:250px minmax(0,1fr);gap:28px}
 body.hw-ppe-r30 .p30-helmet{width:min(100%,360px)}
 body.hw-ppe-r30 .p30-request-line{align-items:flex-start;flex-direction:column;gap:18px}
 body.hw-ppe-r30 .p30-setting-visual{padding:16px}
}
@media(max-width:760px){
 body.hw-ppe-r30 #ppe-how .cm-story-pin{height:auto;min-height:0;padding:26px 0 30px}
 body.hw-ppe-r30 #ppe-how .cm-story-grid{grid-template-columns:minmax(0,1fr);gap:22px;height:auto;max-height:none}
 body.hw-ppe-r30 #ppe-how .cm-story-copy h1{font-size:28px!important;line-height:1.36!important}
 body.hw-ppe-r30 #ppe-how .cm-story-steps{max-width:none;margin-top:20px;gap:0;border-bottom:1px solid #e8e3f0}
 body.hw-ppe-r30 #ppe-how .cm-story-steps button{font-size:13px;min-height:44px;background:none;text-align:center;border-radius:0;padding:8px 3px 12px}
 body.hw-ppe-r30 #ppe-how .cm-story-visual{height:470px;max-height:none;overflow:visible}
 body.hw-ppe-r30 .p30-helmet{width:278px;max-width:100%}
 body.hw-ppe-r30 .p30-detection{border-radius:10px}
 body.hw-ppe-r30 .p30-request-line{align-items:flex-start;flex-direction:column;padding:19px 0;gap:18px}
 body.hw-ppe-r30 .p30-request-line>div{gap:7px}
 body.hw-ppe-r30 .p30-request-line strong{font-size:19px}
 body.hw-ppe-r30 .p30-request-line button{align-self:flex-start}
 body.hw-ppe-r30 .p30-settings{padding-block:52px}
 body.hw-ppe-r30 .p30-settings .cm-split{grid-template-columns:minmax(0,1fr);gap:26px}
 body.hw-ppe-r30 .p30-settings .cm-refine-heading{margin-bottom:0;font-size:26px!important}
 body.hw-ppe-r30 .p30-scope{margin-top:20px;gap:16px;font-size:13px}
 body.hw-ppe-r30 .p30-setting-visual{padding:16px 12px;border-radius:10px}
 body.hw-ppe-r30 .p30-setting-bar{gap:10px;margin-bottom:8px;padding-bottom:14px}
 body.hw-ppe-r30 .p30-setting-bar>span{font-size:14px}
 body.hw-ppe-r30 .p30-config{aspect-ratio:622/409}
 body.hw-ppe-r30 .p30-dialog{padding:72px 16px 20px}
 body.hw-ppe-r30 .p30-dialog-view{margin:0;width:622px;height:409px}
}
@media(max-width:360px){body.hw-ppe-r30 #ppe-how .cm-story-visual{height:420px}body.hw-ppe-r30 .p30-helmet{width:248px}}
@media(prefers-reduced-motion:reduce){body.hw-ppe-r30 #ppe-how .cm-story-pin{position:relative;top:0;height:auto}body.hw-ppe-r30 :is(.p30-expand,[data-p30-photo]){transition:none}}
body.hw-ppe-r30 .p30-mobile-config{display:none}
@media(max-width:760px){
 body.hw-ppe-r30 .p30-setting-visual>.p30-config{display:none}
 body.hw-ppe-r30 .p30-mobile-config{display:grid;gap:16px;padding-top:10px}
 body.hw-ppe-r30 .p30-mobile-config>.p30-source{width:min(100%,250px);justify-self:center}
 body.hw-ppe-r30 .p30-mobile-config>.p30-source:not(:last-child){border-bottom:1px solid #f0edf4}
}
