:root{--ink:#0b3b40;--deep:#0b4a4f;--sea:#e9f3f1;--card:#fff;--rose:#b83256;--rose2:#8f2442;--mute:#5d7578;--line:#cfe0dd;--r:14px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--sea);color:var(--ink);font:16px/1.55 'Nunito Sans',system-ui,sans-serif;padding-bottom:74px}
html[lang=dv] body{font-family:'Noto Sans Thaana','Nunito Sans',sans-serif;line-height:1.9}
h1,h2,h3{font-family:Lora,serif;margin:.2em 0 .5em;line-height:1.25}html[lang=dv] h1,html[lang=dv] h2,html[lang=dv] h3{font-family:'Noto Sans Thaana',serif}
h1{font-size:1.7rem}h2{font-size:1.3rem}h3{font-size:1.05rem}
#top{background:var(--deep);color:#fff;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;position:sticky;top:0;z-index:5}
.brand{font:700 1.15rem Lora,serif;color:#fff;text-decoration:none}html[lang=dv] .brand{font-family:'Noto Sans Thaana'}
#app{max-width:760px;margin:0 auto;padding:16px}
#nav{position:fixed;bottom:0;inset-inline:0;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:space-around;padding:4px 0 max(4px,env(safe-area-inset-bottom));z-index:5}
#nav a{flex:1;text-align:center;padding:10px 2px;color:var(--mute);text-decoration:none;font-size:.82rem;font-weight:600;position:relative}
#nav a.on{color:var(--rose);box-shadow:inset 0 3px var(--rose)}
.badge{background:var(--rose);color:#fff;border-radius:9px;font-size:.7rem;padding:0 6px;margin-inline-start:3px}
@media(min-width:760px){#nav{top:48px;bottom:auto;position:sticky;border:0;border-bottom:1px solid var(--line);padding:0}body{padding-bottom:20px}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:0 0 12px}
.row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.grid{display:grid;gap:12px}@media(min-width:600px){.grid.two{grid-template-columns:1fr 1fr}}
a.card{display:block;color:inherit;text-decoration:none}a.card:hover{border-color:var(--deep)}
.av{width:54px;height:54px;border-radius:50%;background:var(--deep);color:#fff;display:grid;place-items:center;font:700 1.3rem Lora,serif;flex:none}
.av.f{background:var(--rose)}.who{display:flex;gap:12px;align-items:center}
.m{color:var(--mute);font-size:.9rem}
label{display:block;font-weight:700;font-size:.92rem;margin:12px 0 4px}
input,select,textarea{width:100%;font:inherit;padding:11px 12px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
input[type=checkbox]{width:auto;margin-inline-end:8px;transform:scale(1.2)}label.ck{font-weight:400;display:flex;align-items:flex-start;gap:4px}
textarea{min-height:96px}
:focus-visible{outline:3px solid #f0a3b8;outline-offset:2px}
button,.btn{font:inherit;font-weight:700;border:0;border-radius:10px;padding:11px 18px;background:var(--rose);color:#fff;cursor:pointer;text-decoration:none;display:inline-block}
button:hover{background:var(--rose2)}button.alt{background:#fff;color:var(--ink);border:1.5px solid var(--line)}button.dng{background:#7a1f1f}
button.sm{padding:6px 12px;font-size:.88rem}.acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.tag{display:inline-block;background:var(--sea);border-radius:20px;padding:2px 10px;font-size:.82rem;margin:2px 4px 2px 0;font-weight:600}
.st-pending{background:#ffe9b8}.st-approved{background:#c9efd8}.st-rejected{background:#f7c9c9}
.hero{background:var(--deep);color:#fff;border-radius:var(--r);padding:26px 20px;margin-bottom:14px}.hero p{opacity:.9}
.chat{display:flex;flex-direction:column;gap:6px;max-height:55vh;overflow:auto;padding:4px}
.b{max-width:80%;padding:8px 12px;border-radius:14px;background:#fff;border:1px solid var(--line);white-space:pre-wrap;overflow-wrap:anywhere}
.b.me{align-self:flex-end;background:var(--deep);color:#fff;border-color:var(--deep)}
.lang{background:transparent;border:1.5px solid #ffffff88;padding:5px 12px;font-size:.9rem}
#toast{position:fixed;inset-inline:16px;bottom:90px;background:var(--ink);color:#fff;padding:12px 16px;border-radius:10px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:9;text-align:center}
#toast.on{opacity:1}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}.stats div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center}.stats b{display:block;font:700 1.6rem Lora,serif}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* ---- v2 additions ---- */
.tag{margin:2px 0;margin-inline-end:4px}
.tag.married{background:#ffd9a8;color:#5a3000}
.badge-demo{display:inline-block;background:#fff3c4;color:#6b4e00;border:1px solid #e6c85c;border-radius:6px;font-size:.72rem;font-weight:800;letter-spacing:.06em;padding:1px 8px;margin-inline-end:6px}
.card.demo{border-style:dashed;background:#fffdf3}
.av svg{width:60%;height:60%;fill:currentColor}
.av.demo{background:#b8a24a}
.pill{display:inline-block;background:#fff;color:var(--deep);border-radius:20px;padding:4px 14px;font-weight:800;font-size:.9rem;margin-bottom:10px}
.hero h1{margin-top:4px}.hero .sub{font-size:1.05rem}.hero .dv{font:700 1.4rem 'Noto Sans Thaana',serif;margin:0 0 6px}
.hero .acts a.btn.alt{background:transparent;border:1.5px solid #ffffff99;color:#fff}
.notice{border-inline-start:5px solid var(--rose);background:#fff6f8;padding:10px 14px;border-radius:10px;margin:10px 0}
.notice.info{border-color:var(--deep);background:var(--sea)}
.steps{display:grid;gap:10px}@media(min-width:600px){.steps{grid-template-columns:repeat(3,1fr)}}
.steps .card{margin:0}.steps b.n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--rose);color:#fff;margin-bottom:6px}
.foot{margin:22px 0 8px;text-align:center;font-size:.9rem}.foot a{margin:0 8px;white-space:nowrap}
.hscroll{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px}.hscroll .card{min-width:240px;margin:0}
.bell{position:relative;background:transparent;border:1.5px solid #ffffff88;padding:5px 10px;font-size:.9rem}
.hdr-r{display:flex;gap:8px;align-items:center}
.grow{flex:1}.acts.tight{margin:-4px 0 14px}
.empty{text-align:center;padding:26px 16px}.empty h3{margin-top:0}
.ni{border-inline-start:4px solid var(--line)}.ni.new{border-color:var(--rose);background:#fff8fa}
.reveal{background:#eaf7ef;border:1px solid #b6e0c5;border-radius:10px;padding:10px 14px;margin:8px 0}
.sect{margin-top:18px}
.prose p{margin:.4em 0 1em}.prose h3{margin-top:1.2em}
details.faq{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:0 0 8px}details.faq summary{cursor:pointer;font-weight:700}

/* footer = header colour */
#nav{background:var(--deep);border-top:0}
#nav a{color:#cfe0dd}#nav a.on{color:#fff;box-shadow:inset 0 3px #fff}
@media(min-width:760px){#nav{border-bottom:0}}
.foot{background:var(--deep);color:#fff;border-radius:var(--r);padding:16px 12px;line-height:2}.foot a{color:#fff}
/* popup */
.modal-bg{position:fixed;inset:0;background:#0b3b40b3;display:grid;place-items:center;padding:20px;z-index:20}
.modal{background:#fff;border-radius:var(--r);padding:22px 20px;max-width:420px;width:100%;text-align:center;box-shadow:0 10px 40px #0006}
.modal p{font-size:1.05rem;margin:0 0 16px}

/* Dhivehi font: Magey Huseynu. The Thaana face applies to Thaana text in either language; digits only in Dhivehi mode. */
@font-face{font-family:'MV A Waheed';src:url('/MVAWaheed-Bold.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0780-07BF,U+200C-200F,U+FDF2}
@font-face{font-family:'MV A Waheed Num';src:url('/MVAWaheed-Bold.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0030-0039}
@font-face{font-family:'Magey Huseynu';src:url('/MageyHuseynu-Regular.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0780-07BF,U+200C-200F,U+FDF2}
@font-face{font-family:'Magey Num';src:url('/MageyHuseynu-Regular.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0030-0039}
body{font-family:'MV A Waheed','Magey Huseynu','Nunito Sans',system-ui,sans-serif}
h1,h2,h3,.brand,.stats b,.av{font-family:'MV A Waheed','Magey Huseynu',Lora,serif}
html[lang=dv] body,html[lang=dv] h1,html[lang=dv] h2,html[lang=dv] h3,html[lang=dv] .brand,html[lang=dv] .stats b,html[lang=dv] .av,html[lang=dv] .hero .dv,html[lang=dv] .badge-demo,html[lang=dv] .pill,.hero .dv{font-family:'MV A Waheed','Magey Huseynu','MV A Waheed Num','Magey Num','Noto Sans Thaana','Nunito Sans',sans-serif}

/* app-style bottom tab bar */
#nav{background:var(--deep);border:0;border-radius:20px 20px 0 0;box-shadow:0 -6px 24px #0b3b4033;padding:6px 6px max(8px,env(safe-area-inset-bottom));gap:2px}
#nav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px 5px;border-radius:14px;color:#a9c9c6;box-shadow:none;transition:background .25s,color .25s,transform .15s;-webkit-tap-highlight-color:transparent}
#nav a:active{transform:scale(.92)}
#nav .ic{position:relative;display:grid;place-items:center;width:44px;height:28px;border-radius:14px;transition:background .25s}
#nav svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
#nav a.on{color:#fff;box-shadow:none}#nav a.on .ic{background:#ffffff26}#nav a.on svg{transform:translateY(-1px) scale(1.08)}
#nav .lb{font-size:.7rem;font-weight:700;line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#nav .badge{position:absolute;top:-4px;inset-inline-end:2px;margin:0;min-width:17px;height:17px;line-height:17px;padding:0 4px;text-align:center;border:2px solid var(--deep);box-sizing:content-box;font-size:.62rem;font-weight:800}
@media(min-width:760px){#nav{border-radius:0;box-shadow:none;padding:4px 8px;justify-content:center;gap:6px}#nav a{flex:0 1 auto;flex-direction:row;gap:8px;padding:4px 14px 4px 8px}#nav .ic{width:30px}#nav .lb{font-size:.9rem}}

/* floating pill tab bar (blush white, maroon active tab) */
body{padding-bottom:108px}
#toast{bottom:112px}
#nav{inset-inline:12px;bottom:max(12px,env(safe-area-inset-bottom));background:#fdf5f7;border:1px solid #f1dfe4;border-radius:34px;box-shadow:0 10px 32px #5a1f3140;padding:7px;gap:2px}
#nav a{color:#6f5f64;border-radius:26px;padding:10px 2px 8px;gap:4px;background:transparent}
#nav .ic{width:auto;height:auto;background:none}
#nav svg{width:26px;height:26px;stroke-width:1.7}
#nav a.on{color:#8f2442;background:linear-gradient(145deg,#f8e8ee,#efd9e1);box-shadow:inset 0 0 0 1px #e9cdd770}
#nav a.on .ic{background:none}#nav a.on svg{transform:none}
#nav .lb{font-size:.72rem;font-weight:600}
#nav .badge{border-color:#fdf5f7;top:-6px;inset-inline-end:-8px}
@media(min-width:760px){body{padding-bottom:20px}#nav{position:sticky;top:56px;bottom:auto;inset-inline:auto;width:min(720px,calc(100% - 24px));margin:8px auto;padding:5px;justify-content:center}#nav a{flex-direction:row;gap:8px;padding:8px 16px}#nav svg{width:22px;height:22px}#nav .lb{font-size:.9rem}}