:root{--pwa-safe-top:env(safe-area-inset-top,0px);--pwa-safe-right:env(safe-area-inset-right,0px);--pwa-safe-bottom:env(safe-area-inset-bottom,0px);--pwa-safe-left:env(safe-area-inset-left,0px);--pwa-header-height:78px}
.pwa-install{background:transparent;color:var(--ink);font:inherit;font-size:13px;min-height:44px;padding:10px 12px;text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
.hero .actions{flex-wrap:wrap}
.pwa-dialog{box-sizing:border-box;width:calc(100% - 32px);max-width:460px;max-height:calc(100dvh - var(--pwa-safe-top) - var(--pwa-safe-bottom) - 32px);overflow:auto;border:1px solid var(--line);border-radius:8px;padding:24px;background:var(--paper);color:var(--ink);font:14px var(--font)}
.pwa-dialog::backdrop{background:#203a3180}
.pwa-heading{display:flex;gap:12px;align-items:center;margin-bottom:20px}.pwa-heading h2{font-size:21px;margin:0 0 6px}.pwa-heading p{font-size:12px;margin:0;color:var(--muted)}
.pwa-dialog section{border-top:1px solid var(--line);padding-top:14px;margin-top:14px}.pwa-dialog h3{font-size:14px;margin:0 0 8px}.pwa-dialog ol{padding-left:20px;line-height:1.8;margin:0}.pwa-dialog li+li{margin-top:6px}.pwa-dialog section p{font-size:13px;line-height:1.8;margin-bottom:0}
.pwa-dialog .pwa-hint{color:var(--muted);font-size:12px;margin:20px 0}.pwa-install-status{font-size:13px}
.pwa-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.pwa-actions button{min-height:44px;padding:10px 16px;border:1px solid var(--line);border-radius:4px;background:var(--white);color:var(--ink);font:inherit;cursor:pointer}.pwa-actions .pwa-primary{background:var(--ink);color:var(--white);border-color:var(--ink)}
:is(.pwa-install,.pwa-actions button):focus-visible{outline:3px solid var(--accent);outline-offset:3px}.pwa-actions button:disabled{opacity:.6;cursor:wait}
.pwa-update{position:fixed;z-index:20;right:max(16px,var(--pwa-safe-right));bottom:calc(16px + var(--pwa-safe-bottom));width:calc(100% - 32px - var(--pwa-safe-left) - var(--pwa-safe-right));max-width:360px;box-sizing:border-box;padding:18px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);box-shadow:0 8px 28px #203a3126;font:13px var(--font)}
.pwa-update strong{font-size:15px}.pwa-update p{line-height:1.65;margin:8px 0 14px}
.pwa-standalone{padding-left:var(--pwa-safe-left);padding-right:var(--pwa-safe-right);padding-bottom:var(--pwa-safe-bottom)}
.pwa-standalone:not(.naro-editor){padding-top:var(--pwa-safe-top)}
.naro-editor.pwa-standalone header{height:calc(var(--pwa-header-height) + var(--pwa-safe-top));padding-top:var(--pwa-safe-top)}
.naro-editor.pwa-standalone:not(.editing) .processing{inset:calc(var(--pwa-header-height) + var(--pwa-safe-top)) var(--pwa-safe-right) var(--pwa-safe-bottom) var(--pwa-safe-left)}
.naro-editor.pwa-standalone.editing .preview-panel{top:calc(var(--pwa-header-height) + var(--pwa-safe-top))}
.pwa-offline{max-width:520px;margin:12vh auto;padding:24px}.pwa-offline h1{font-size:32px;margin-top:24px}.pwa-offline .actions{display:flex;flex-wrap:wrap;gap:12px}
@media(min-width:821px){.naro-editor.pwa-standalone.editing .inspector{max-height:calc(100dvh - 185px - var(--pwa-safe-top) - var(--pwa-safe-bottom))}}
@media(max-width:820px){:root{--pwa-header-height:62px}.naro-editor.pwa-standalone.editing .tool-rail{top:calc(var(--mobile-preview-height,340px) + 70px + var(--pwa-safe-top))}.naro-editor.pwa-standalone.editing .inspector{max-height:max(180px,calc(100dvh - var(--mobile-preview-height,340px) - 147px - var(--pwa-safe-top) - var(--pwa-safe-bottom)))}}
@media(max-width:390px){.pwa-dialog{padding:20px}.pwa-heading{align-items:flex-start}.pwa-heading h2{font-size:19px}}