.home-screen-option { margin-top: 1.25rem; }
.home-screen-button, .home-screen-done { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; max-width: 100%; padding: .7rem 1rem; border: 1px solid #dcae62; border-radius: 12px; background: #172b23; color: #fffaf2; font: 600 .9375rem/1.5 system-ui, sans-serif; text-align: center; cursor: pointer; }
.home-screen-dark .home-screen-button, .home-screen-dark .home-screen-done { background: #15191c; color: #efcd8d; }
.home-screen-button[hidden] { display: none; }
.home-screen-option:has(button[hidden]) { display: none; }
.home-screen-button:hover, .home-screen-done:hover { filter: brightness(1.2); }
.home-screen-button:focus-visible, .home-screen-dialog button:focus-visible { outline: 3px solid #dcae62; outline-offset: 4px; }
.home-screen-dialog { box-sizing: border-box; width: min(480px, calc(100% - 2rem)); max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); overflow-y: auto; margin: auto; padding: 2rem; border: 1px solid #dcae62; border-radius: 20px; background: #fffaf2; color: #28332d; box-shadow: 0 24px 80px #0009; font: 400 1rem/1.65 system-ui, sans-serif; }
.home-screen-dialog.home-screen-dark { background: #0b151d; color: #f5f0e7; }
.home-screen-dialog::backdrop { background: #000b; }
.home-screen-close { position: absolute; top: 4px; right: 4px; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: inherit; font: 28px/1 system-ui, sans-serif; cursor: pointer; }
.home-screen-heading { display: flex; align-items: center; gap: 1rem; margin: 1rem 0; }
.home-screen-heading img { flex: none; width: 64px; height: 64px; border-radius: 14px; }
.home-screen-heading h2 { margin: 0; font: 500 1.5rem/1.2 Georgia, serif; letter-spacing: normal; overflow-wrap: anywhere; }
#home-screen-steps { padding-left: 1.4rem; margin: 1.25rem 0; }
#home-screen-steps li + li { margin-top: .6rem; }
#home-screen-note { font-size: .875rem; }
.home-screen-done { width: 100%; margin-top: .75rem; }
@media (display-mode: standalone) { .home-screen-option { display: none; } }
@media (max-width: 400px) { .home-screen-dialog { padding: 1.5rem; } .home-screen-heading { gap: .75rem; } .home-screen-heading h2 { font-size: 1.25rem; } }
