.edpwa {
--edpwa-red: #872424;
--edpwa-cream: #FFE0AA;
max-width: 480px;
margin: 24px auto;
padding: 20px;
background: var(--edpwa-red);
color: var(--edpwa-cream);
border-radius: 18px;
box-sizing: border-box;
}
.edpwa-head {
display: flex;
align-items: center;
gap: 16px;
}
.edpwa-head img {
width: 64px;
height: 64px;
flex-shrink: 0;
border-radius: 50%;
box-shadow: 0 0 0 2px var(--edpwa-cream);
}
.edpwa .edpwa-title {
margin: 0 0 4px;
font-size: 1.15rem;
font-weight: 700;
line-height: 1.25;
color: var(--edpwa-cream);
}
.edpwa .edpwa-sub,
.edpwa .edpwa-note {
margin: 0;
font-size: 0.95rem;
line-height: 1.5;
color: var(--edpwa-cream);
} .edpwa-panel {
display: none;
margin-top: 18px;
padding-top: 16px;
border-top: 1px solid rgba(255, 224, 170, 0.35);
}
.edpwa[data-mode="android"] [data-for="android"],
.edpwa[data-mode="android-menu"] [data-for="android-menu"],
.edpwa[data-mode="ios"] [data-for="ios"],
.edpwa[data-mode="desktop"] [data-for="desktop"],
.edpwa[data-mode="installed"] [data-for="installed"] {
display: block;
}
.edpwa .edpwa-btn {
display: block;
width: 100%;
padding: 14px 20px;
border: 0;
border-radius: 999px;
background: var(--edpwa-cream);
color: var(--edpwa-red);
font-size: 1rem;
font-weight: 700;
cursor: pointer;
}
.edpwa .edpwa-btn:focus-visible {
outline: 3px solid #fff;
outline-offset: 3px;
}
.edpwa .edpwa-steps {
margin: 0;
padding-left: 1.3em;
font-size: 0.95rem;
line-height: 1.6;
color: var(--edpwa-cream);
}
.edpwa .edpwa-steps li + li {
margin-top: 6px;
}
.edpwa strong {
color: var(--edpwa-cream);
}
.edpwa-share {
width: 1.2em;
height: 1.2em;
vertical-align: -0.2em;
}