/* Farooq Music 2.0 — account pages on stream.farooqmusic.com (Day 18 part 2, WBS D18-2; languages Day 18 part 3).
   Fonts follow the language (data-font on <body>, from config fm2.locales): latin · nastaliq (Urdu) · naskh (Arabic).
   One file for every account page, because the CSP (Day 17) allows styles from files only. */
/* 064 (owner, 1 Oct 2026): Urdu uses the FarooqStars face — Noto Naskh Arabic, 12% larger (size-adjust 112%), line-height 2. The family keeps the name "Nastaliq" so every older rule follows; the Nastaliq file stays only for the admin site. */
@font-face{font-family:"Nastaliq";font-weight:400;font-display:swap;size-adjust:112%;src:url("../admin/fonts/noto-naskh-arabic-regular.woff2") format("woff2")}
@font-face{font-family:"Nastaliq";font-weight:700;font-display:swap;size-adjust:112%;src:url("../admin/fonts/noto-naskh-arabic-bold.woff2") format("woff2")}
@font-face{font-family:"Naskh";font-weight:400;font-display:swap;src:url("../admin/fonts/noto-naskh-arabic-regular.woff2") format("woff2")}
@font-face{font-family:"Naskh";font-weight:700;font-display:swap;src:url("../admin/fonts/noto-naskh-arabic-bold.woff2") format("woff2")}
:root{--ground:#0f0b17;--panel:#171124;--line:#2a2140;--ink:#eae6f2;--dim:#9b93ad;--brand:#c9a0ff;--btn:#7b2ff7;--btn-hi:#9150ff;--ok:#a8e6a1;--bad:#ffb4a1}
*{box-sizing:border-box}
html,body{margin:0;min-height:100vh;background:var(--ground);color:var(--ink);font-family:"Segoe UI",Tahoma,Arial,sans-serif}
body{display:grid;place-items:center;padding:24px}
body[data-font=nastaliq]{font-family:"Nastaliq","Segoe UI",Tahoma,Arial,sans-serif}
body[data-font=naskh]{font-family:"Naskh","Segoe UI",Tahoma,Arial,sans-serif}
.card{width:100%;max-width:440px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:36px 30px}
.brand{color:var(--brand);font-weight:700;font-size:20px;letter-spacing:.5px;margin-bottom:18px}
h1{font-size:24px;margin:0 0 10px}
body[data-font=nastaliq] h1{font-size:26px;line-height:2}
p{color:var(--dim);font-size:15px;line-height:1.8;margin:0 0 18px}
body[data-font=nastaliq] p{font-size:17px;line-height:2.2}
label{display:block;font-size:14px;margin:14px 0 6px;color:var(--ink)}
body[data-font=nastaliq] label{font-size:16px;line-height:2}
.field{position:relative}
input{width:100%;font:inherit;font-size:16px;padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:#0c0913;color:var(--ink);direction:ltr;text-align:left}
input:focus{outline:2px solid var(--btn);outline-offset:1px;border-color:transparent}
.show{position:absolute;top:50%;transform:translateY(-50%);right:8px;background:none;border:0;color:var(--dim);font:inherit;font-size:13px;cursor:pointer;padding:6px}
button.go{margin-top:22px;width:100%;font:inherit;font-size:16px;font-weight:600;padding:13px;border:0;border-radius:10px;background:var(--btn);color:#fff;cursor:pointer}
button.go:hover{background:var(--btn-hi)}
button.go[disabled]{opacity:.55;cursor:wait}
.msg{margin-top:18px;font-size:15px;line-height:1.8;min-height:1.8em}
body[data-font=nastaliq] .msg{font-size:17px;line-height:2.2}
.msg.ok{color:var(--ok)}.msg.bad{color:var(--bad)}
.rules{font-size:13px;color:var(--dim);margin-top:8px;line-height:1.7}
body[data-font=nastaliq] .rules{font-size:15px;line-height:2}
.foot{margin-top:26px;display:flex;justify-content:space-between;gap:12px;font-size:13px}
.foot a{color:var(--brand);text-decoration:none}
.foot{align-items:center}
/* no language switch on these pages (owner 23 Sep): the language is chosen once at the start and followed everywhere */
body[data-font=naskh] p{font-size:16px;line-height:1.9}
.hidden{display:none}
/* the e-mail confirmation page (Day 15) — moved here from its inline <style>, which the CSP blocks */
.verify{text-align:center}
.verify .mark{font-size:52px;line-height:1}
.verify h1.good{color:var(--ok)}.verify h1.fail{color:var(--bad)}