@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap";:root{--md-font:"IBM Plex Sans Arabic", Tahoma, Arial, sans-serif;--md-font-weight-regular:400;--md-font-weight-medium:500;--md-font-weight-bold:700;--md-font-weight-extrabold:700;--md-color-ink:#0b3a52;--md-color-ink-muted:#5c7386;--md-color-canvas:#eef6f8;--md-color-surface:#fff;--md-color-surface-soft:#f4fbfc;--md-color-border:#d4e5ec;--md-color-border-strong:#b9d3dc;--md-color-brand:#007f8e;--md-color-brand-strong:#005f6d;--md-color-brand-soft:#e4f5f7;--md-color-on-brand:#fff;--md-color-water:#147fd1;--md-color-water-strong:#0b63a8;--md-color-water-soft:#e7f4ff;--md-color-pharmacy:#168a4b;--md-color-pharmacy-soft:#e7f7ed;--md-color-warning:#c05612;--md-color-warning-soft:#fff3e6;--md-color-danger:#b42318;--md-color-danger-soft:#fdecec;--md-color-info:#026aa2;--md-color-info-soft:#e8f4fb;--md-space-1:.25rem;--md-space-2:.5rem;--md-space-3:.75rem;--md-space-4:1rem;--md-space-5:1.25rem;--md-space-6:1.5rem;--md-space-8:2rem;--md-space-10:2.5rem;--md-text-xs:.75rem;--md-text-sm:.875rem;--md-text-md:1rem;--md-text-lg:1.125rem;--md-text-xl:1.375rem;--md-text-2xl:1.625rem;--md-leading-tight:1.25;--md-leading-snug:1.4;--md-leading-normal:1.55;--md-radius-sm:.375rem;--md-radius-md:.5rem;--md-radius-lg:.75rem;--md-radius-xl:.875rem;--md-radius-full:999px;--md-shadow-sm:0 4px 14px #0b3a520f;--md-shadow-md:0 10px 28px #0b3a521a;--md-shadow-lg:0 -16px 48px #0b3a5229;--md-touch:2.75rem;--md-icon-sm:1.125rem;--md-icon-md:1.375rem;--md-icon-lg:1.75rem;--md-shell-max:32rem;--md-nav-height:4.75rem;--md-ease:.16s ease;--md-ink:var(--md-color-ink);--md-muted:var(--md-color-ink-muted);--md-primary:var(--md-color-brand);--md-primary-strong:var(--md-color-brand-strong);--md-water:var(--md-color-water);--md-success:var(--md-color-pharmacy);--md-surface:var(--md-color-surface);--md-surface-soft:var(--md-color-surface-soft);--md-border:var(--md-color-border);--md-shadow:var(--md-shadow-md);font-family:var(--md-font);color:var(--md-color-ink);background:var(--md-color-canvas);line-height:var(--md-leading-normal)}*,:before,:after{box-sizing:border-box}button,input,a{font:inherit}:focus-visible{outline:2px solid var(--md-color-brand);outline-offset:2px}:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{background:var(--md-color-canvas)}body{min-width:320px;margin:0}#root{min-height:100vh}body{background:var(--md-color-canvas);margin:0}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.offline-banner{background:var(--md-color-warning-soft);color:var(--md-color-warning);text-align:center;margin:0;padding:10px 16px;font-size:14px;font-weight:700}.install-notice{padding:var(--md-space-3) var(--md-space-4) 0}.install-notice__card{gap:var(--md-space-3);padding:var(--md-space-4);background:var(--md-color-surface);border:1px solid var(--md-color-border);border-radius:var(--md-radius-lg);box-shadow:var(--md-shadow-md);display:grid}.install-notice__head{gap:var(--md-space-2);grid-template-columns:auto minmax(0,1fr) auto;align-items:start;display:grid}.install-notice__copy small{color:var(--md-color-brand);font-size:var(--md-text-xs);font-weight:var(--md-font-weight-bold);display:block}.install-notice__copy h2{margin:var(--md-space-1) 0 0;font-size:var(--md-text-md)}.install-notice__copy p{margin:var(--md-space-1) 0 0;color:var(--md-color-ink-muted);font-size:var(--md-text-sm)}.install-notice .btn{width:100%;min-height:var(--md-touch)}.mobile-shell{max-width:var(--md-shell-max);min-height:100dvh;padding-bottom:calc(var(--md-nav-height) + env(safe-area-inset-bottom));background:var(--md-color-canvas);margin:auto}.app-header{align-items:center;column-gap:var(--md-space-3);row-gap:var(--md-space-2);padding:calc(var(--md-space-3) + env(safe-area-inset-top)) var(--md-space-4) var(--md-space-2);grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"logo copy bell""logo city city";display:grid}.app-header__logo{object-fit:contain;grid-area:logo;width:5rem;height:5rem}.app-header__copy{grid-area:copy;min-width:0}.app-header__copy p{color:var(--md-color-ink-muted);font-size:var(--md-text-sm);font-weight:var(--md-font-weight-medium);margin:0}.app-header__copy strong{font-size:var(--md-text-xl);line-height:var(--md-leading-tight);display:block}.app-header__bell{grid-area:bell;position:relative}.app-header__bell--unread:after{content:"";border-radius:var(--md-radius-full);background:var(--md-color-danger);border:2px solid var(--md-color-surface);width:.5rem;height:.5rem;position:absolute;top:.45rem;left:.45rem}.city-chip,.icon-btn{min-height:var(--md-touch);border:1px solid var(--md-color-border);background:var(--md-color-surface);color:var(--md-color-brand-strong);border-radius:var(--md-radius-sm);box-shadow:var(--md-shadow-sm);justify-content:center;align-items:center;display:inline-flex}.icon-btn{width:var(--md-touch);min-width:var(--md-touch);padding:0}.city-chip{justify-content:flex-start;gap:var(--md-space-2);width:100%;padding:0 var(--md-space-3);font-size:var(--md-text-sm);font-weight:var(--md-font-weight-bold);grid-area:city}.city-chip span{text-overflow:ellipsis;white-space:nowrap;text-align:start;flex:1;min-width:0;overflow:hidden}.screen{padding:0 var(--md-space-4) var(--md-space-5);gap:var(--md-space-3);display:grid}.search-field{align-items:center;gap:var(--md-space-3);background:var(--md-color-surface);border:1px solid var(--md-color-border);border-radius:var(--md-radius-md);padding:.55rem var(--md-space-3);box-shadow:var(--md-shadow-sm);display:flex}.search-field__icon{color:var(--md-color-brand);flex:none}.search-field input{width:100%;color:var(--md-color-ink);font-size:var(--md-text-md);background:0 0;border:0;outline:0}.quick-grid{gap:var(--md-space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.service-tile{border:1px solid var(--md-color-border);border-radius:var(--md-radius-md);background:var(--md-color-surface);min-height:5rem;padding:var(--md-space-2);align-content:center;justify-items:center;gap:var(--md-space-1);color:var(--md-color-ink);font-weight:var(--md-font-weight-bold);font-size:var(--md-text-sm);display:grid}.service-tile--soon{color:var(--md-color-ink-muted)}.service-tile__icon{border-radius:var(--md-radius-sm);place-items:center;width:2.5rem;height:2.5rem;display:grid}.service-tile__icon--water{background:var(--md-color-water-soft);color:var(--md-color-water-strong)}.service-tile__icon--pharmacy{background:var(--md-color-pharmacy-soft);color:var(--md-color-pharmacy)}.service-tile__icon--services{background:var(--md-color-brand-soft);color:var(--md-color-brand-strong)}.service-tile__icon--report{background:var(--md-color-warning-soft);color:var(--md-color-warning)}.service-tile__icon--emergency{background:var(--md-color-danger-soft);color:var(--md-color-danger)}.service-tile__icon--power{background:var(--md-color-info-soft);color:var(--md-color-info)}.service-tile__icon--news{background:var(--md-color-brand-soft);color:var(--md-color-brand-strong)}.service-tile__icon--account{background:var(--md-color-surface-soft);color:var(--md-color-ink)}.service-tile small{font-size:.65rem;font-weight:var(--md-font-weight-medium)}.entity-card,.notice{background:var(--md-color-surface);border:1px solid var(--md-color-border);border-radius:var(--md-radius-md);box-shadow:var(--md-shadow-sm)}.entity-card{padding:var(--md-space-3);align-items:center;gap:var(--md-space-3);display:flex}.entity-card--featured{align-items:stretch;gap:var(--md-space-3);display:grid}.entity-card__row{align-items:center;gap:var(--md-space-3);display:flex}.entity-card--water{background:var(--md-color-water-soft);border-color:#b7d9f5}.entity-card--pharmacy{background:var(--md-color-pharmacy-soft);border-color:#b7e0c6}.entity-card h3,.section-header h2,.subpage-header h1,.empty-state h2,.sheet h2{margin:0}.entity-card p,.sheet p{margin:var(--md-space-1) 0 0;color:var(--md-color-ink-muted);font-size:var(--md-text-sm)}.icon-well{border-radius:var(--md-radius-sm);width:2.75rem;height:2.75rem;color:var(--md-color-water-strong);background:#ffffffb8;flex:none;place-items:center;display:grid}.icon-well--pharmacy{background:var(--md-color-pharmacy-soft);color:var(--md-color-pharmacy)}.entity-card--featured .icon-well{background:var(--md-color-surface)}.badge{align-items:center;gap:var(--md-space-1);border-radius:var(--md-radius-sm);font-size:var(--md-text-xs);font-weight:var(--md-font-weight-bold);background:var(--md-color-surface);color:var(--md-color-brand-strong);padding:.2rem .55rem;display:inline-flex}.badge--success{color:var(--md-color-pharmacy);background:var(--md-color-pharmacy-soft)}.badge--warning{color:var(--md-color-warning);background:var(--md-color-warning-soft)}.badge--muted{color:var(--md-color-ink-muted);background:var(--md-color-surface-soft)}.card-actions,.sheet-actions{gap:var(--md-space-2);grid-template-columns:1fr 1fr;margin-top:0;display:grid}.card-actions--one{grid-template-columns:1fr}.btn,.chip{border-radius:var(--md-radius-sm);border:1px solid var(--md-color-border);background:var(--md-color-surface);min-height:2.5rem;color:var(--md-color-brand-strong);font-weight:var(--md-font-weight-bold);justify-content:center;align-items:center;gap:var(--md-space-2);padding:0 var(--md-space-3);text-decoration:none;display:inline-flex}.btn--primary{background:var(--md-color-brand);border-color:var(--md-color-brand);color:var(--md-color-on-brand)}.btn--ghost{background:0 0;border:0}.city-option{text-align:start;cursor:pointer;width:100%}.city-option--active{border-color:var(--md-color-brand);background:var(--md-color-brand-soft)}.chip-row{gap:var(--md-space-2);padding-bottom:var(--md-space-1);display:flex;overflow-x:auto}.chip.active{background:var(--md-color-brand);border-color:var(--md-color-brand);color:var(--md-color-on-brand)}.section-header{justify-content:space-between;align-items:center;gap:var(--md-space-3);display:flex}.section-header h2{font-size:var(--md-text-lg)}.text-action{color:var(--md-color-brand);font-weight:var(--md-font-weight-bold);min-height:var(--md-touch);background:0 0;border:0}.entity-list{gap:var(--md-space-2);display:grid}.entity-card__body{flex:1;min-width:0}.entity-card h3{font-size:var(--md-text-md)}.entity-card small{margin-top:var(--md-space-1);color:var(--md-color-ink-muted);font-size:var(--md-text-xs);display:block}.entity-card__actions{gap:var(--md-space-1);display:grid}.entity-card__actions .btn{min-height:2.25rem;font-size:var(--md-text-sm);padding:0 var(--md-space-2)}.filter-row{color:var(--md-color-ink-muted);font-size:var(--md-text-sm);justify-content:space-between;align-items:center;display:flex}.notice{align-items:flex-start;gap:var(--md-space-3);padding:var(--md-space-3);background:var(--md-color-info-soft);color:var(--md-color-brand-strong);font-size:var(--md-text-sm);border-color:#c5e1f2;display:flex}.notice .icon-well{background:var(--md-color-surface);width:2.25rem;height:2.25rem;color:var(--md-color-info)}.bottom-nav{width:min(var(--md-shell-max), 100%);background:var(--md-color-surface);border-top:1px solid var(--md-color-border);padding:var(--md-space-2) var(--md-space-1) calc(var(--md-space-2) + env(safe-area-inset-bottom));z-index:3;grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.bottom-nav button{color:var(--md-color-ink-muted);min-height:3.25rem;font-size:var(--md-text-xs);font-weight:var(--md-font-weight-medium);background:0 0;border:0;align-content:center;justify-items:center;gap:.15rem;display:grid}.bottom-nav .active{color:var(--md-color-brand);font-weight:var(--md-font-weight-bold)}.subpage-header{align-items:center;gap:var(--md-space-3);padding:calc(var(--md-space-4) + env(safe-area-inset-top)) var(--md-space-4) var(--md-space-4);display:flex}.subpage-header h1{font-size:var(--md-text-xl)}.eyebrow{color:var(--md-color-ink-muted);font-size:var(--md-text-xs);font-weight:var(--md-font-weight-bold);margin:0}.page-intro{color:var(--md-color-ink-muted);margin:0}.empty-state{text-align:center;justify-items:center;gap:var(--md-space-2);background:var(--md-color-surface);border:1px dashed var(--md-color-border);border-radius:var(--md-radius-md);padding:var(--md-space-8) var(--md-space-4);color:var(--md-color-ink-muted);display:grid}.empty-state__icon{border-radius:var(--md-radius-md);background:var(--md-color-brand-soft);width:3.25rem;height:3.25rem;color:var(--md-color-brand);place-items:center;display:grid}.skeleton{border-radius:var(--md-radius-md);background:linear-gradient(90deg,#e4eef2,#f7fbfc,#e4eef2) 0 0/200% 100%;height:7.5rem;animation:1.2s infinite md-shimmer}.alert{padding:var(--md-space-3);border-radius:var(--md-radius-md);background:var(--md-color-danger-soft);color:var(--md-color-danger)}.sheet-backdrop{z-index:4;background:#0b3a5259;position:fixed;inset:0}.sheet{z-index:5;width:min(var(--md-shell-max), 100%);background:var(--md-color-surface);border-radius:var(--md-radius-md) var(--md-radius-md) 0 0;padding:var(--md-space-4) var(--md-space-4) calc(var(--md-space-5) + env(safe-area-inset-bottom));box-shadow:var(--md-shadow-lg);position:fixed;bottom:0;left:50%;transform:translate(-50%)}.sheet-header{align-items:flex-start;gap:var(--md-space-3);margin-bottom:var(--md-space-3);display:flex}.sheet-header__copy{flex:1;min-width:0}.sheet-header__copy h2{margin-top:var(--md-space-1)}.sheet-meta{gap:var(--md-space-2);margin:0;padding:0;list-style:none;display:grid}.sheet-meta li{align-items:flex-start;gap:var(--md-space-2);color:var(--md-color-ink-muted);font-size:var(--md-text-sm);display:flex}.sheet-meta svg{color:var(--md-color-brand);flex:none;margin-top:.15rem}.sheet-actions{margin-top:var(--md-space-4)}@keyframes md-shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}.stat-row{gap:var(--md-space-2);grid-template-columns:1fr 1fr;display:grid}.stat-chip,.menu-group{background:var(--md-color-surface);border:1px solid var(--md-color-border);border-radius:var(--md-radius-md);box-shadow:var(--md-shadow-sm)}.stat-chip{justify-items:center;gap:var(--md-space-1);padding:var(--md-space-3);display:grid}.stat-chip strong{font-size:var(--md-text-xl);color:var(--md-color-brand-strong)}.stat-chip span{font-size:var(--md-text-xs);color:var(--md-color-ink-muted);font-weight:var(--md-font-weight-bold)}.menu-group{overflow:hidden}.menu-row{width:100%;min-height:var(--md-touch);align-items:center;gap:var(--md-space-3);padding:var(--md-space-3);border:0;border-bottom:1px solid var(--md-color-border);text-align:start;color:inherit;background:0 0;display:flex}.menu-row:last-child{border-bottom:0}.menu-row__icon{border-radius:var(--md-radius-sm);background:var(--md-color-brand-soft);width:2.5rem;height:2.5rem;color:var(--md-color-brand-strong);flex:none;place-items:center;display:grid}.menu-row__body{flex:1;gap:.15rem;min-width:0;display:grid}.menu-row__title{font-weight:var(--md-font-weight-bold)}.menu-row__sub{color:var(--md-color-ink-muted);font-size:var(--md-text-xs)}.switch{appearance:none;border-radius:var(--md-radius-full);background:var(--md-color-border-strong);flex:none;width:2.75rem;height:1.5rem;position:relative}.switch:after{content:"";inset-inline-start:.15rem;border-radius:var(--md-radius-full);background:var(--md-color-surface);width:1.2rem;height:1.2rem;position:absolute;top:.15rem}.switch:checked{background:var(--md-color-brand)}.switch:checked:after{inset-inline:auto .15rem}.notif-card{text-align:start;cursor:pointer;width:100%}.notif-card--unread{background:var(--md-color-brand-soft);border-color:#b7dce2}@media (width>=640px){.mobile-shell{box-shadow:var(--md-shadow-md)}}