@font-face{font-family:"SC Display";src:url(/fonts/display-900.woff) format("woff");font-weight:900;font-display:swap}
@font-face{font-family:"SC Text";src:url(/fonts/text-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"SC Text";src:url(/fonts/text-600.woff) format("woff");font-weight:600 700;font-display:swap}
:root{--ink:#071E2B;--bg:#F4F7F8;--bg2:#E7EEF1;--surface:#fff;--text:#0F2330;--muted:#4D6270;--line:#D5E0E5;--cobalt:#2147C9;--accent:#2147C9;--lagoon:#1CC4B0;--sun:#FFC133;--brand:#071E2B;--ok:#13795B;--warn:#8A5A00;--shadow:0 1px 2px rgba(7,30,43,.05),0 10px 30px rgba(7,30,43,.07);--display:"SC Display","Inter Display",Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--sans:"SC Text",Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
[data-theme=dark]{--ink:#031018;--bg:#071A24;--bg2:#0C2431;--surface:#0E2938;--text:#E6F0F4;--muted:#9DB4C0;--line:#1D3A4B;--accent:#8CB0FF;--brand:#EAF3F7;--ok:#4FD1A5;--warn:#F0B24A;--shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px rgba(0,0,0,.3)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 17px/1.7 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%}a{color:var(--accent);text-underline-offset:3px}a:hover{color:var(--text)}
:focus-visible{outline:3px solid var(--sun);outline-offset:2px;border-radius:6px}
h1,h2,h3{font-family:var(--display);font-weight:900;line-height:1.05;letter-spacing:-.028em;word-spacing:.05em;color:var(--brand);margin:0}
h1{font-size:clamp(2.4rem,6.4vw,4.8rem)}h2{font-size:clamp(1.5rem,3.2vw,2.2rem);margin:1.6em 0 .5em}h3{font-size:1.25rem;letter-spacing:-.02em;margin:.1em 0 .4em}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}.sr,.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;background:var(--surface);padding:8px 12px;z-index:99}
.muted{color:var(--muted)}.small{font-size:.88rem}
#progress{position:fixed;top:0;left:0;height:4px;width:0;background:var(--sun);z-index:60}
.site-header{position:sticky;top:0;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);z-index:50}
.bar{display:flex;align-items:center;gap:20px;height:66px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--brand);font:900 1.2rem/1 var(--display);letter-spacing:-.03em}.brand b{color:var(--accent)}
.nav{display:flex;gap:2px;margin-left:14px;flex:1}.nav a{text-decoration:none;padding:8px 13px;border-radius:99px;font-size:.95rem;font-weight:600;color:var(--text)}.nav a:hover{background:var(--bg2)}.nav a[aria-current]{background:var(--ink);color:#fff}
.actions{display:flex;gap:2px}.icon-btn{background:none;border:0;color:var(--text);padding:10px;border-radius:99px;cursor:pointer;display:inline-flex}.icon-btn:hover{background:var(--bg2)}.menu{display:none}
@media(max-width:860px){.menu{display:inline-flex}.nav{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;background:var(--bg);padding:10px 22px 18px;border-bottom:1px solid var(--line);margin:0}.nav.open{display:flex}}
.kicker{display:inline-flex;align-items:center;gap:7px;font:600 .85rem/1 var(--sans);color:var(--muted);margin:0 0 6px}.kicker::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--lagoon)}
.lede{font-size:1.2rem;color:var(--muted);max-width:56ch;line-height:1.55}
/* hero: the sky shows Sharjah's real time */
.hero{--sky-top:#7CC4EE;--sky-bottom:#E6F7F6;--far:#A9CFDC;--mid:#4D7D96;--near:#12384B;--sea1:#38B0BE;--sea2:#1D7388;--glint:#fff;--sun:#FFD04A;--hero-ink:#06202E;--hero-sub:#0C3347;position:relative;overflow:hidden;min-height:clamp(600px,88vh,780px);background:linear-gradient(180deg,var(--sky-top),var(--sky-bottom) 70%);color:var(--hero-ink)}
.hero[data-phase=dawn]{--sky-top:#7FA6E6;--sky-bottom:#FFE2BE;--far:#C9B2C4;--mid:#7D6A92;--near:#2A2750;--sea1:#E3A38B;--sea2:#7A6A9E;--glint:#FFE7C2;--sun:#FFB84D}
.hero[data-phase=dusk]{--sky-top:#262A6B;--sky-bottom:#FFAA66;--far:#7A5F97;--mid:#3C3472;--near:#17143F;--sea1:#8A5F9F;--sea2:#2A2260;--glint:#FFD6A0;--sun:#FFB347;--hero-ink:#fff;--hero-sub:#F3EAFB}
.hero[data-phase=night]{--sky-top:#040D1A;--sky-bottom:#15354F;--far:#1B3550;--mid:#0F2438;--near:#050E16;--sea1:#10304A;--sea2:#06131D;--glint:#7FC8E8;--sun:#FFE08A;--hero-ink:#fff;--hero-sub:#D5E6EE}
.scene{position:absolute;left:0;bottom:0;width:100%;height:auto;display:block}.scene g{will-change:transform}#stars circle{fill:#fff}
.hero-in{position:relative;padding-top:64px;padding-bottom:40px}
.hero h1{max-width:13ch;color:var(--hero-ink)}.hero .lede{color:var(--hero-sub);margin-top:18px}
.hero-search{display:flex;gap:8px;max-width:620px;margin-top:26px}.hero-search input{flex:1;min-width:0;padding:16px 20px;border-radius:99px;border:2px solid transparent;background:#fff;color:#0F2330;font:inherit;box-shadow:0 10px 30px rgba(7,30,43,.22)}
.hero-search button{flex-shrink:0}.hero-search button,.btn{background:var(--ink);color:#fff;border:0;padding:0 26px;border-radius:99px;font:600 1rem var(--sans);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;min-height:50px}
.hero .hero-search button{background:var(--ink)}[data-theme=dark] .btn{background:var(--sun);color:#071E2B}.btn:hover{color:#fff;filter:brightness(1.2)}.btn.sun{background:var(--sun);color:#071E2B}.btn.sun:hover{color:#071E2B;filter:brightness(1.05)}
.btn.ghost{background:transparent;color:var(--text);border:2px solid var(--line)}.btn.ghost:hover{color:var(--text);border-color:var(--text);filter:none}
.clock{margin:16px 0 0;font-size:.95rem;color:var(--hero-sub);font-weight:600}
/* bento */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:-56px;position:relative;padding-bottom:20px}
.tile{display:block;border-radius:28px;padding:30px;text-decoration:none;color:var(--ink);position:relative;overflow:hidden}.tile h2{margin:0 0 .45em;font-size:clamp(1.4rem,2.6vw,2rem);color:inherit}.tile p{margin:.3em 0 1em;max-width:44ch}
a.tile{transition:transform .25s}a.tile:hover{transform:translateY(-4px);color:var(--ink)}
.t-calc{grid-column:1/span 7;grid-row:1/span 2;background:var(--cobalt);color:#fff;padding:36px;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cpath d='M36 6l7 17 17-7-7 17 17 7-17 7 7 17-17-7-7 17-7-17-17 7 7-17-17-7 17-7-7-17 17 7z' fill='none' stroke='%23ffffff' stroke-opacity='.12' stroke-width='1.2'/%3E%3C/svg%3E")}
.t-calc{display:flex;flex-direction:column}.t-calc .btn{margin-top:auto;align-self:flex-start}.t-calc h2{color:#fff;font-size:clamp(1.8rem,3.4vw,2.8rem);max-width:15ch}.t-calc p{color:#DDE6FF}
.mini{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:18px 0 10px}
.t-calc .field label{display:block;font-weight:600;font-size:.88rem;margin-bottom:5px;color:#fff}
.t-calc .field input{width:100%;padding:13px 14px;border-radius:14px;border:2px solid rgba(255,255,255,.35);background:rgba(7,30,43,.28);color:#fff;font:inherit}.t-calc .field input::placeholder{color:rgba(255,255,255,.6)}.t-calc .field input:focus{border-color:var(--sun);outline:none}
.mini-out{margin:18px 0 22px}.mini-out span{display:block;font:900 clamp(2.6rem,6vw,4.4rem)/1 var(--display);letter-spacing:-.04em;color:var(--sun)}.mini-out small{color:#DDE6FF;font-size:.95rem}
.t-area{grid-column:8/span 5;background:var(--lagoon)}.t-area p{color:#06302B}
.pills{display:flex;flex-wrap:wrap;gap:8px}.pills i{font-style:normal;font-weight:600;font-size:.88rem;background:rgba(7,30,43,.88);color:#fff;padding:7px 14px;border-radius:99px}
.t-bus{grid-column:8/span 5;background:var(--surface);border:2px solid var(--ink);color:var(--text)}.t-bus h2{color:var(--brand)}.t-bus p{color:var(--muted)}.route{width:100%;max-width:340px;color:var(--text);margin:6px 0}.route text{font-family:var(--sans);font-weight:600}
.t-free{grid-column:1/span 5;background:var(--sun)}.t-free ul{list-style:none;padding:0;margin:6px 0 14px;display:grid;gap:2px}.t-free li{font:900 1.35rem/1.25 var(--display);letter-spacing:-.025em}.t-free p{color:#3A2C00}
.t-proof{grid-column:6/span 7;background:var(--ink);color:#fff;padding:36px}.t-proof h2{color:#fff}.t-proof ol{margin:0 0 18px;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px 26px;counter-reset:s}
.t-proof li{counter-increment:s;color:#C8D9E2;font-size:.97rem;line-height:1.5;padding-left:44px;position:relative}.t-proof li::before{content:counter(s);position:absolute;left:0;top:-2px;width:32px;height:32px;border-radius:50%;background:var(--lagoon);color:var(--ink);font:900 1rem/32px var(--display);text-align:center}.t-proof li b{display:block;color:#fff;font-size:1.02rem}
.textlink{color:var(--sun);font-weight:600}.textlink:hover{color:#fff}
@media(max-width:900px){.bento{grid-template-columns:1fr;margin-top:-40px}.t-calc,.t-area,.t-bus,.t-free,.t-proof{grid-column:1;grid-row:auto}.tile{padding:26px}}
/* explore rows */
.explore{margin:56px auto 20px}.explore h2{margin-top:0}.rows{list-style:none;padding:0;margin:18px 0 0;border-top:2px solid var(--ink)}
.rows a{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) 44px;gap:18px;align-items:center;padding:22px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text);transition:padding .2s,background .2s}
.rows a:hover{padding-left:18px;background:var(--bg2)}.r-name{font:900 clamp(1.4rem,3.2vw,2.3rem)/1.05 var(--display);letter-spacing:-.035em;color:var(--brand)}.r-desc{color:var(--muted)}
.r-go{width:44px;height:44px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;transition:background .2s,transform .2s}.rows a:hover .r-go{background:var(--cobalt);transform:translateX(4px)}
@media(max-width:700px){.rows a{grid-template-columns:1fr 44px}.r-desc{grid-column:1;grid-row:2}.r-go{grid-column:2;grid-row:1/span 2}}
/* shared cards, hubs, articles */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px;margin:20px 0}.cards.four{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.card{display:block;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px;text-decoration:none;color:var(--text);transition:transform .2s,border-color .2s}
.card:hover{transform:translateY(-3px);border-color:var(--ink);color:var(--text)}.card p{margin:.3em 0 .6em;color:var(--muted);font-size:.95rem;line-height:1.55}.card .more{font-weight:600;font-size:.9rem;color:var(--accent)}
.hub-hero{background:var(--ink);color:#fff;padding:34px 0 40px}.hub-hero h1,.hub-hero .lede{color:#fff}.hub-hero .lede{color:#C8D9E2}.hub-hero .crumbs,.hub-hero .crumbs a{color:#9DB4C0}.hub-hero .kicker{color:#C8D9E2}.hub{padding-top:24px;padding-bottom:50px}
.crumbs{font-size:.85rem;color:var(--muted);margin:20px 0 14px}.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--text)}.crumbs span{margin:0 7px}
.article{padding-bottom:50px}.art-head{margin-top:10px}.art-head h1{max-width:18ch;font-size:clamp(2.1rem,5vw,3.6rem)}.art-head .lede{margin-top:16px}
.meta{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;color:var(--muted);font-size:.9rem;margin:18px 0}
.badge{padding:3px 11px;border-radius:99px;font-weight:600;font-size:.8rem;border:2px solid}.badge.ok{color:var(--ok);border-color:var(--ok)}.badge.warn{color:var(--warn);border-color:var(--warn)}
.save-btn{background:none;border:2px solid var(--line);color:var(--text);border-radius:99px;padding:3px 15px;cursor:pointer;font:inherit;font-size:.85rem;font-weight:600}.save-btn[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.notice{border-radius:14px;background:color-mix(in srgb,var(--sun) 22%,var(--bg));border:1px solid color-mix(in srgb,var(--sun) 60%,var(--bg));padding:14px 18px;margin:10px 0 22px;font-size:.95rem;color:var(--text)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:48px;align-items:start}@media(max-width:900px){.layout{grid-template-columns:1fr}.toc{order:-1;position:static!important}}
.body{max-width:70ch}.body h2{margin-top:2em}.body table{border-collapse:collapse;width:100%;font-size:.95rem;margin:1em 0;display:block;overflow-x:auto}.body th,.body td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left}.body th{background:var(--bg2);font-weight:600}
.body li{margin:.3em 0}.answer{background:var(--ink);color:#fff;border-radius:22px;padding:8px 26px 22px;margin-bottom:8px}.answer h2{margin:.9em 0 .3em;font:600 .9rem var(--sans);letter-spacing:0;color:var(--sun)}.answer p{margin:0;font-size:1.1rem;line-height:1.6}
.toc{position:sticky;top:88px;font-size:.92rem}.toc h2{font:600 .85rem var(--sans);letter-spacing:0;color:var(--muted);margin:0 0 8px}.toc ul{list-style:none;padding:0;margin:0;border-left:3px solid var(--line)}.toc a{display:block;padding:5px 14px;text-decoration:none;color:var(--muted)}.toc a:hover{color:var(--text)}
.faq details{border:1px solid var(--line);border-radius:14px;padding:12px 18px;margin:10px 0;background:var(--surface)}.faq summary{cursor:pointer;font-weight:600}
.sources ol{padding-left:20px}.related{margin-top:54px}
.site-footer{margin-top:70px;background:var(--ink);color:#C8D9E2;padding:44px 0 22px}.site-footer a{color:#fff}.site-footer .brand{color:#fff}.site-footer .brand b{color:var(--sun)}.site-footer .muted{color:#9DB4C0}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}@media(max-width:700px){.foot-grid{grid-template-columns:1fr}}
.foot-h{font:600 .9rem var(--sans);color:#9DB4C0;margin:0 0 10px;letter-spacing:0}.site-footer ul{list-style:none;padding:0;margin:0}.site-footer li{margin:6px 0}.fine{color:#9DB4C0;font-size:.85rem;margin-top:28px}
/* tools */
.tool-box{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:var(--shadow);margin:20px 0}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}.field label{display:block;font-weight:600;font-size:.9rem;margin-bottom:4px}.field small{color:var(--muted);display:block;font-size:.78rem;margin-top:3px}
.field input,.field select{width:100%;padding:12px 13px;border:2px solid var(--line);border-radius:12px;background:var(--bg);color:var(--text);font:inherit}.field input:focus,.field select:focus{border-color:var(--cobalt);outline:none}
.result{margin-top:18px;padding:20px;background:var(--ink);color:#fff;border-radius:18px}.result .muted{color:#9DB4C0}.big{font:900 2.8rem/1 var(--display);letter-spacing:-.04em;color:var(--sun)}
.bar-row{display:grid;grid-template-columns:130px 1fr 90px;gap:10px;align-items:center;font-size:.9rem;margin:7px 0}.bar-track{background:rgba(255,255,255,.14);border-radius:99px;height:10px;overflow:hidden}.bar-fill{height:100%;background:var(--lagoon);border-radius:99px;transition:width .3s}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}.chip{border:2px solid var(--line);background:var(--bg);color:var(--text);padding:7px 15px;border-radius:99px;cursor:pointer;font:inherit;font-size:.9rem;font-weight:600}.chip[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.area-card{border:1px solid var(--line);border-radius:18px;padding:18px;background:var(--surface)}.tag{display:inline-block;font-size:.76rem;background:var(--bg2);border-radius:99px;padding:2px 11px;margin:2px 4px 2px 0;color:var(--muted)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.site-header,.site-footer,.toc,.save-btn,#progress,.actions,.hero{display:none}}

@media(max-width:700px){.scene{width:250%;left:50%;transform:translateX(-60%)}.hero{min-height:640px}}

.facts{border:1px solid var(--line);border-radius:18px;padding:6px 22px 14px;margin:18px 0 8px;background:var(--bg2)}
.facts h2{margin:.9em 0 .4em;font:600 1rem var(--sans)}
.facts dl{margin:0}.fact{display:grid;grid-template-columns:9rem 1fr;gap:4px 16px;padding:10px 0;border-top:1px solid var(--line)}
.fact:first-child{border-top:0}.fact dt{font-weight:600;font-size:.92rem}.fact dd{margin:0;font-size:.97rem}
.fact .src{display:block;font-size:.8rem;color:var(--muted,#5b6b75);margin-top:2px}
.fact .flag{display:inline-block;margin-top:4px;font-size:.78rem;font-weight:600;background:color-mix(in srgb,var(--sun) 35%,var(--bg));border-radius:99px;padding:2px 10px}
@media(max-width:560px){.fact{grid-template-columns:1fr}}

.pair{grid-template-columns:1fr 1fr}.optbox{border:1px solid var(--line);border-radius:16px;padding:6px 16px 14px;background:var(--bg)}.optbox h3{font:600 1rem var(--sans);margin:.8em 0 .4em}
.tool-box .pair+.pair{margin-top:16px}@media(max-width:640px){.pair{grid-template-columns:1fr}}
