/* App sub-sites on farooqmughal.net — Farooq Chat Viewer, FarooqDrive (5 Nov 2026). Builds on site.css. */
.appnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.appnav a{font-weight:600;font-size:14px;color:var(--dim);border:1px solid var(--line);border-radius:999px;padding:6px 14px}
.appnav a:hover{border-color:var(--teal-2);color:var(--teal-2)}
.appnav a[aria-current]{background:rgba(34,184,200,.12);color:var(--teal-2);border-color:transparent}
.applogo{display:flex;align-items:center;gap:14px;margin:0 0 6px}
.applogo img{width:56px;height:56px;border-radius:14px;flex:none}
.applogo .kicker{margin:0}
/* legal/guide extras */
.legal .toc{display:flex;flex-wrap:wrap;gap:8px 16px;margin:4px 0 22px;padding:14px 18px;background:var(--soft);border:1px solid var(--line);border-radius:14px}
.legal .toc a{font-weight:600;font-size:14px}
.legal ol{padding-inline-start:22px;margin:8px 0 12px;color:var(--dim)}
.legal ol li{margin:6px 0}
.legal details{border:1px solid var(--line);border-radius:12px;margin:10px 0;overflow:hidden;background:#fff}
.legal details summary{cursor:pointer;padding:14px 18px;font-weight:700;color:var(--navy);list-style:none}
.legal details summary::-webkit-details-marker{display:none}
.legal details summary::before{content:"+";color:var(--teal-2);font-weight:800;margin-inline-end:10px}
.legal details[open] summary::before{content:"\2013"}
.legal details[open] summary{border-bottom:1px solid var(--line)}
.legal details .dd{padding:12px 18px}
.legal details .dd p{margin:0;color:var(--dim)}
.legal pre{background:var(--navy);color:#e6ecf8;border-radius:12px;padding:16px 18px;overflow:auto;font-size:13px;line-height:1.6;direction:ltr;text-align:left}
.legal code{background:var(--soft);border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:13px}
.legal .lead{font-size:18px;color:var(--dim);margin:0 0 6px}
.legal .legal-note{font-size:13px;color:var(--faint);border-top:1px solid var(--line);padding-top:14px;margin-top:26px}
.legal table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:12px 0}
.legal table th,.legal table td{padding:12px 16px;border-bottom:1px solid var(--line);text-align:start;vertical-align:top;color:var(--dim)}
.legal table th{background:#fbfcfe;color:var(--navy);font-weight:700}
.legal table tr:last-child td{border-bottom:0}
/* landing extras */
.apphero{background:radial-gradient(1200px 500px at 85% -10%,rgba(34,184,200,.16),transparent 60%),radial-gradient(900px 400px at -10% 120%,rgba(31,143,192,.10),transparent 60%),var(--soft);border-bottom:1px solid var(--line)}
.apphero .wrap{padding:46px 20px 40px}
.apphero h1{font-size:40px;line-height:1.15;margin:10px 0 14px;color:var(--navy);max-width:22ch}
html[lang="ur"] .apphero h1,html[lang="ar"] .apphero h1{font-size:34px;line-height:1.6}
.apphero .lead{font-size:18px;color:var(--dim);margin:0 0 22px;max-width:62ch}
html[lang="ur"] .apphero .lead,html[lang="ar"] .apphero .lead{font-size:18px}
.platforms{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:16px 0}
.platform{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:#fff}
.platform strong{display:block;color:var(--navy)}
.platform .status{font-size:13px;font-weight:700;color:var(--mint)}
.platform .status.soon{color:var(--faint)}
.platform .small{display:block;color:var(--dim);font-size:13px;margin-top:4px}
.coming{background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:14px 18px;color:var(--dim);font-size:14px;margin-top:10px}
.coming .small{color:var(--faint);font-size:13px}
.disclaim{font-size:13px;color:var(--faint);margin-top:6px}