[hidden]{display:none!important}
html{min-height:100%;scroll-padding-top:90px}
body{min-height:100dvh;padding-bottom:env(safe-area-inset-bottom,0px)}
header,main,footer{padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
header{padding-top:max(24px,env(safe-area-inset-top))}
button{touch-action:manipulation;min-height:42px}
button:disabled{cursor:default;opacity:.5;filter:none}
.app-icon{display:block;flex:none;border-radius:22%;box-shadow:0 5px 12px #243b3214}
.install-card{display:flex;align-items:center;gap:18px;padding:19px 22px;margin:0 0 24px;background:#e6ece1;border:1px solid #d2decd;border-radius:16px}
.install-copy{flex:1;min-width:0}
.install-copy strong{display:block;font-size:17px;line-height:1.5}
.install-copy p{font-size:12px;color:var(--muted);margin:3px 0 0}
.install-card>button{font-size:13px;white-space:nowrap}
.backup-actions{display:flex;flex-wrap:wrap;gap:8px}
.text-button{display:inline;padding:0 2px;min-height:0;border-radius:0;background:none;color:var(--green);text-decoration:underline;text-underline-offset:3px;font-size:inherit;font-weight:600}
footer .text-button{display:block;margin-top:12px;font-size:12px}
.app-preview{display:flex;align-items:center;gap:18px;margin:25px 0}
.app-preview strong{font-size:21px}
.app-preview p{font-size:13px;color:var(--muted);margin:5px 0}
.install-steps{list-style:none;padding:0;margin:20px 0}
.platform-tabs{display:flex;gap:8px;margin-bottom:4px}
.platform-tabs button{flex:1;font-size:13px}
.platform-tabs [aria-pressed="true"]{background:var(--green);color:white}
.install-steps li{display:flex;align-items:flex-start;gap:14px;border-top:1px solid var(--line);padding:18px 0}
.install-steps li>div{flex:1;min-width:0}
.install-steps strong{font-size:15px;line-height:1.6}
.install-steps p{font-size:12px;color:var(--muted);margin:5px 0 0}
.install-steps svg{flex:none;margin-top:7px}
.step-number{display:grid;place-items:center;background:#e9efe4;color:var(--green);width:30px;height:30px;border-radius:50%;font-weight:700;flex:none}
.transfer-note{background:#f3f4ed;padding:18px;border-radius:12px;margin-top:20px}
.transfer-note strong{font-size:14px}
.transfer-note p{font-size:12px;color:var(--muted);margin:8px 0 14px}
.offline-ready{font-size:12px;color:var(--green)}
.file-label{margin-top:24px}
.file-label input{margin-top:9px;padding:12px;font-size:13px}
.backup-preview{padding:18px;background:#edf4e8;border:1px solid #d7e3d0;border-radius:12px;margin-top:18px}
.backup-preview p{font-size:13px;margin:4px 0}
.connection-note{margin:0 0 18px;font-size:12px;padding:9px 13px;border-radius:8px;background:#eee4cc;color:#65542d}
.update-notice{position:fixed;z-index:30;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:14px;width:max-content;max-width:calc(100% - 28px);padding:12px 16px;background:#243b32;color:white;border-radius:14px;box-shadow:0 4px 30px #243b3230;font-size:13px}
.update-notice button{background:#f0d68b;color:#243b32;flex:none;font-size:13px}
dialog{overscroll-behavior:contain;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 28px)}
.standalone header{position:sticky;top:0;z-index:10;background:var(--bg);padding-top:calc(12px + env(safe-area-inset-top));padding-bottom:12px}
.standalone main{padding-top:10px}
@media(max-width:800px){
  header,main,footer{padding-left:max(17px,env(safe-area-inset-left));padding-right:max(17px,env(safe-area-inset-right))}
  header{gap:12px;padding-top:max(17px,env(safe-area-inset-top))}
  header b{font-size:14px}
  header button{font-size:12px;padding:8px 11px;white-space:nowrap}
  input,select{font-size:16px}
  .install-card{padding:16px;gap:12px;flex-wrap:wrap}
  .install-card .app-icon{width:45px;height:45px}
  .install-copy strong{font-size:14px}
  .install-copy p{font-size:11px}
  .install-card>button{width:100%;margin-top:2px;min-height:44px}
  .history>.row{align-items:flex-start;gap:15px}
  .backup-actions button{font-size:12px;padding:9px 12px}
  .app-preview strong{font-size:18px}
  dialog{padding:22px 19px}
  dialog h2{font-size:19px}
  .file-label input{font-size:14px}
  .update-notice{width:calc(100% - 28px)}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media print{.install-card,.connection-note,.update-notice{display:none!important}}
