/* Public pages (catalogue and app download pages). Mobile first: customers open these links on their phones. */

.site{display:flex;flex-direction:column;min-block-size:100vh}
.wrap{inline-size:100%;max-inline-size:760px;margin-inline:auto;padding-inline:16px}
.site-header{background:var(--card);border-block-end:1px solid var(--border)}
.site-header__inner{padding-block:12px}
.brand{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:1.05rem;color:var(--text);text-decoration:none}
.site-main{flex:1;padding-block:24px 40px}
.site-footer{border-block-start:1px solid var(--border);background:var(--card);font-size:.86rem;color:var(--text-muted)}
.site-footer__inner{display:flex;gap:8px 20px;flex-wrap:wrap;justify-content:center;padding-block:16px}
.site-footer a{color:var(--text-muted)}

.hero{text-align:center;margin-block-end:24px}
.hero p{color:var(--text-muted);margin-block-start:6px}

/* catalogue */
.app-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}
.app-card__link{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--card);border:1px solid var(--border);
  border-radius:18px;text-decoration:none;color:var(--text);box-shadow:var(--shadow);transition:transform .15s,border-color .15s}
.app-card__link:hover{border-color:var(--primary);transform:translateY(-2px);color:var(--text)}
.app-card__body{flex:1;min-inline-size:0;display:flex;flex-direction:column;gap:2px}
.app-card__name{font-weight:800;font-size:1.05rem}
.app-card__summary{color:var(--text-muted);font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-card__meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:.84rem}
.app-card__go{font-size:1.6rem;color:var(--text-muted)}

/* app page */
.app-hero{display:flex;align-items:center;gap:16px;margin-block-end:20px}
.app-hero__text{min-inline-size:0}
.app-hero__summary{color:var(--text-muted);margin-block-start:2px}
.app-hero__badges{margin-block-start:6px}
.app-icon{border-radius:22%;object-fit:cover;flex:none;background:var(--neutral-bg);box-shadow:var(--shadow)}
.app-icon--letter{display:inline-flex;align-items:center;justify-content:center;background:var(--primary-soft);color:var(--teal-800);font-weight:800}

.download-card{background:var(--card);border:1px solid var(--teal-100);border-radius:22px;padding:20px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;gap:16px;margin-block-end:16px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}
.facts div{background:var(--primary-soft);border-radius:12px;padding:10px 12px}
.facts dt{font-size:.78rem;color:var(--text-muted);font-weight:700}
.facts dd{font-weight:800;font-size:1rem}
.download-card .btn--xl{inline-size:100%}
.download-card__file{text-align:center;font-size:.8rem;color:var(--text-muted);overflow-wrap:anywhere}

.notice{background:var(--warning-bg);border:1px solid var(--warning-line);color:#78350f;border-radius:16px;padding:16px;margin-block-end:16px}
.panel{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:16px 18px;margin-block-end:16px}
.panel h2{margin-block-end:8px}
details.panel > summary{font-weight:800;cursor:pointer;list-style-position:inside}
details.panel[open] > summary{margin-block-end:10px}
.howto ol{display:flex;flex-direction:column;gap:6px}

.file-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px}
.file-item{display:flex;gap:14px;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid var(--border);border-radius:14px;flex-wrap:wrap}
.file-item__text{display:flex;flex-direction:column;min-inline-size:0;flex:1}
.file-item__title{font-weight:800}
.file-item__desc{font-size:.88rem;margin-block-start:4px}

.history{list-style:none;padding:0;display:flex;flex-direction:column;gap:12px}
.history li{border-inline-start:3px solid var(--teal-100);padding-inline-start:12px}
.hashes dt{font-size:.82rem;font-weight:700;margin-block-start:10px}
.hashes dd{margin-block-start:4px}
.verify p{font-size:.9rem}

.share{display:flex;flex-direction:column;align-items:center;gap:6px;margin-block-start:8px}
.share__done{font-size:.84rem;color:var(--success);font-weight:700;min-block-size:1.4em}

.message{text-align:center;padding-block:40px}
.message__icon{font-size:3rem}
.message p{color:var(--text-muted);margin-block:8px 20px}
.empty{text-align:center;color:var(--text-muted);padding:30px}

@media (min-width:640px){
  .download-card .btn--xl{inline-size:auto;align-self:center;min-inline-size:320px}
}
