.modal.install-modal {width:min(560px,calc(100% - 32px));max-width:560px;max-height:calc(100dvh - 32px);padding:28px;border:1px solid var(--border);border-radius:22px;background:var(--paper);color:var(--ink);overflow:auto;scrollbar-width:thin}
.install-header {display:flex;align-items:center;gap:14px;margin-bottom:22px}
.install-header img {flex:none;border-radius:16px}
.install-header .eyebrow {flex:1;line-height:1.6;font-size:10px;letter-spacing:1.2px;color:var(--muted)}
.install-header .icon-button {flex:none;width:40px;height:40px;color:var(--muted)}
.install-modal h2 {font-size:26px;line-height:1.2;letter-spacing:-.6px;margin:0 0 12px}
.install-modal h2:focus {outline:none}
.install-intro {font-size:14px;line-height:1.65;color:var(--muted);margin:0 0 20px}
.install-status {padding:14px 16px;border-radius:12px;background:var(--lavender);color:var(--purple);font-size:13px;line-height:1.65;margin:0 0 16px;overflow-wrap:anywhere}
.install-modal .button {min-height:44px;font-size:13px}
.install-modal #install-confirm {margin-bottom:22px;white-space:normal}
.install-instructions {padding-top:4px}
.install-instructions label,.install-link>label {display:block;font-size:12px;font-weight:600;margin:0 0 12px}
.install-instructions select {display:block;width:100%;min-width:0;min-height:44px;margin-top:8px;padding:10px 12px;font:inherit;font-size:14px;color:var(--ink);border:1px solid var(--border);border-radius:10px;background:var(--surface)}
.install-steps {list-style:none;counter-reset:install-step;display:grid;gap:16px;margin:20px 0;padding:0}
.install-steps li {counter-increment:install-step;display:grid;grid-template-columns:26px minmax(0,1fr);align-items:start;gap:12px;font-size:13px;line-height:1.7;overflow-wrap:anywhere}
.install-steps li::before {content:counter(install-step);display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--surface);color:var(--purple);font-size:12px;font-weight:650}
.install-note {font-size:12px;line-height:1.7;color:var(--muted);margin:0}
.install-link {margin-top:22px;padding-top:20px;border-top:1px solid var(--border)}
.install-link>div {display:flex;align-items:center;gap:8px}
.install-link input {width:100%;min-width:0;min-height:44px;padding:10px;font:inherit;font-size:12px;color:var(--ink);border:1px solid var(--border);border-radius:10px;background:var(--surface)}
.install-link .button {flex:none;padding:10px 12px;gap:6px;background:var(--surface);color:var(--ink);border:1px solid var(--border)}
.install-requirements {margin-top:18px}
.install-done {margin-top:16px}
.pwa-onboarding-step {font-size:11px;font-weight:600;line-height:1.5;letter-spacing:.4px;color:var(--purple);margin:0 0 10px}
.notifications-mark {display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:16px;background:var(--lavender);color:var(--purple)}
.notifications-mark .icon {width:28px;height:28px}
.notifications-note {margin-top:16px}
.install-modal :is(button,input,select):focus-visible {outline:3px solid var(--purple);outline-offset:3px}
@media(max-width:650px) {
  .modal.install-modal {width:calc(100% - 20px);max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:22px 18px;border-radius:18px}
  .install-modal h2 {font-size:23px}
  .install-header {gap:12px;margin-bottom:20px}
  .install-header img {width:48px;height:48px;border-radius:14px}
  .install-header .eyebrow {font-size:9px;letter-spacing:1px}
  .install-link input,.install-instructions select {font-size:16px}
  .install-link>div {flex-wrap:wrap}
  .install-link .button {width:100%;justify-content:center}
}