:root{
	--brand: #0a66c2;
	--brand-2: #074a92;
	--accent: #ff8a00;
	--accent-strong: #f56d00;
	--muted: #6b7280;
	--bg: #f5f7fa;
	--card-shadow: 0 12px 28px rgba(10, 102, 194, 0.12);
	--radius: 12px;
	--transition: 220ms cubic-bezier(.2,.9,.2,1);
}

body.admin-page .admin-layout > .admin-main > *:not(script),
body.admin-page .admin-layout > .main-content-area > *:not(script) {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

body.admin-page .admin-main .analytics-container,
body.admin-page .admin-main .records-container,
body.admin-page .admin-main .print-page {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}


@keyframes fadeInUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInDown{from{opacity:0;transform:translateY(-26px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{from{opacity:0;transform:translateX(-46px)}to{opacity:1;transform:translateX(0)}}@keyframes softFloat{0%,100%{transform:translateY(0px)}50%{transform:translateY(-8px)}}@keyframes pulseGlow{0%{box-shadow:0 0 0 0 rgba(255,138,0,.38)}70%{box-shadow:0 0 0 16px rgba(255,138,0,0)}100%{box-shadow:0 0 0 0 rgba(255,138,0,0)}}

/* User-facing StreetGuard refresh */
.landing-page,.language-page,.auth-page{background:linear-gradient(160deg,#e7eef6 0%,#f8fafc 38%,#f4f7fb 100%);color:#17120d;display:flex;align-items:center;justify-content:center;min-height:100svh;}
.landing-page footer,.language-page footer{display:none}
.hero{position:relative;width:100%;min-height:100svh;height:auto;overflow:hidden;background:linear-gradient(135deg,#0d4e8c 0%,#0a67b3 35%,#2b7de9 100%);display:flex;align-items:center;justify-content:center;padding:clamp(28px,6vh,72px) clamp(16px,5vw,64px);}
.hero-content{position:relative;z-index:1;width:min(92vw,710px);max-width:710px;text-align:center;animation:sg-rise .65s ease-out both}
.hero-center-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;}
.hero h1{font-size:clamp(3rem,8vw,5.5rem);letter-spacing:-.06em;margin:0;color:#fff}
.hero p{width:100%;max-width:590px;margin:0 auto;font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.65;color:#edf6ff}
.eyebrow{display:inline-block;margin-bottom:4px;padding:7px 11px;border:1px solid rgba(255,255,255,.5);border-radius:999px;color:#fff;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.hero-cta-wrap{display:flex;justify-content:center;align-items:center;margin-top:8px;}
.hero-cta{padding:16px 30px;border-radius:999px;background:#f5a623;box-shadow:0 18px 32px rgba(8,53,101,.25);color:#0b2340;border:none;font-weight:800;transition:transform .22s ease,box-shadow .22s ease,opacity .18s ease;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}.hero-cta:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 22px 38px rgba(8,53,101,.28)}.hero-cta.is-pressed{transform:scale(.97);opacity:.9}
.emergency-contacts{width:min(100%,560px);margin-top:4px;padding:22px 20px;color:#12304f;text-align:left;border:1px solid #dce8f3;border-radius:28px;background:#fff;box-shadow:0 18px 36px rgba(8,53,101,.2)}
.emergency-contact-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.emergency-contacts h2{margin:0;color:#2262a3;font-size:.86rem;letter-spacing:.08em;text-transform:uppercase}
.emergency-availability{padding:7px 13px;border-radius:999px;background:#dcfce7;color:#21633e;font-size:.8rem;font-weight:900}
.emergency-contact-list{display:grid;gap:10px;padding:2px}
.emergency-contact-row{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:14px;width:100%;min-width:0;padding:14px 14px 14px 48px;border:1px solid #dbe7f3;border-radius:14px;background:#f8fbff;box-shadow:0 5px 12px rgba(18,48,79,.06)}
.emergency-contact-number{position:absolute;top:50%;left:14px;transform:translateY(-50%);color:#9bb3c9;font-size:.78rem;font-weight:900;letter-spacing:.08em}
.agency-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#e5f0ff;color:#1764c0}
.agency-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.agency-bfp .agency-icon{background:#fff1dc;color:#e78316}
.agency-pnp .agency-icon{background:#e8f0ff;color:#2864b2}
.agency-mdrrmo .agency-icon{background:#e5f8ee;color:#238052}
.emergency-contact-info strong,.emergency-contact-info span{display:block}
.emergency-contact-info strong{font-size:1.05rem;color:#101b2d}
.emergency-phone{display:flex;align-items:center;gap:8px;margin-top:5px;font-size:1rem;color:#101b2d;font-weight:700}
.emergency-phone svg{width:19px;height:19px;fill:none;stroke:#3e4650;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.emergency-contact-actions{display:flex;gap:7px;flex-shrink:0;margin-left:auto}
.emergency-contact-actions a{display:inline-flex;align-items:center;justify-content:center;min-width:64px;min-height:40px;padding:8px 12px;border:1px solid #1764c0;border-radius:9px;background:#1764c0;color:#fff;font-size:.78rem;font-weight:800;text-decoration:none}
.emergency-contact-actions a:last-child{min-width:94px;border-color:#c7d9e8;background:#fff;color:#2262a3}
.emergency-contact-actions a:hover{filter:brightness(.96);transform:translateY(-1px)}
.hero-orb{position:absolute;border-radius:50%;background:rgba(255,255,255,.12);filter:blur(1px);animation:sg-float 6s ease-in-out infinite}.hero-orb-one{width:260px;height:260px;top:10%;left:-80px}.hero-orb-two{width:360px;height:360px;right:-120px;bottom:-120px;animation-delay:-3s}
.choice-page,.auth-page{display:grid;place-items:center;flex:1;padding:32px 18px;width:100%}
.language-card,.auth-card{width:min(100%,500px);border:1px solid rgba(15,118,110,0.06);border-radius:24px;background:#fff;padding:clamp(24px,5vw,42px);box-shadow:0 18px 45px rgba(15,23,42,.10);animation:sg-rise .45s ease-out both;margin:0 auto}
.language-card .eyebrow{color:#0d4e8c;border-color:#dbeafe}.language-card h1{font-size:clamp(1.9rem,5vw,2.7rem);margin:0 0 10px}.language-card>p,.form-intro{line-height:1.55;color:#475569;margin-bottom:24px}
.language-options{display:grid;gap:18px;margin-top:12px}.language-option{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;width:100%;padding:16px;background:#f8fbff;border:1px solid #d9e7ff;border-radius:15px;color:#1c1917;text-align:left;cursor:pointer;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}.language-option:hover{opacity:1;background:#fff;transform:translateY(-2px);box-shadow:0 10px 20px rgba(30,64,175,.08)}.language-option.is-pressed{transform:scale(.98);opacity:.95}.language-option small{display:block;margin-top:3px;color:#64748b;font-weight:400}.language-flag{font-size:1.75rem}.language-back-link{display:flex;justify-content:center;margin-top:22px}.text-link{display:inline-block;color:#0d4e8c;font-weight:700;text-decoration:none}
.auth-card{margin:0;max-width:420px;background:linear-gradient(180deg,#ffffff,#f8fbff);border:1px solid #dbeafe}.auth-card h2{font-size:2rem; color:#0f172a; margin-bottom:8px}.auth-card input,.auth-card select{border:1px solid #d5e3f6;border-radius:12px;padding:13px 14px;background:#fff;color:#0f172a}.auth-card input::placeholder{color:#64748b}.auth-card input:focus,.auth-card select:focus{border-color:#2b7de9;box-shadow:0 0 0 4px rgba(43,125,233,.12)}.auth-card button{border-radius:12px;background:linear-gradient(180deg,#f7a928,#f08c19);color:#0a1f33;transition:transform .18s ease,filter .18s ease;box-shadow:0 10px 22px rgba(240,140,25,.25);font-weight:800}.auth-card button:hover{filter:brightness(0.98);transform:translateY(-1px)}.form-error,.form-success{padding:10px 12px;margin:12px 0;border-radius:9px;font-weight:700}.form-error{background:#fff1f2;color:#9f1239}.form-success{background:#ecfdf5;color:#047857}.emergency-contact{margin-top:24px;padding-top:19px;border-top:1px solid #dbeafe;text-align:center}.emergency-contact span,.emergency-contact small{display:block;color:#64748b;font-size:.85rem}.emergency-contact a{display:inline-block;margin:7px 0;color:#0d4e8c;font-size:1.2rem;font-weight:800;text-decoration:none}
@keyframes sg-rise{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}@keyframes sg-float{50%{transform:translateY(-20px)}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

form{display:block}
form input[type="checkbox"]{width:auto;margin-right:8px;vertical-align:middle}
form label{color:#334155;font-weight:600}

@media (max-width: 480px){
	body.landing-page{min-height:100dvh;align-items:flex-start;overflow-x:hidden;overflow-y:auto;padding-bottom:env(safe-area-inset-bottom)}
	body.landing-page .hero{min-height:100dvh;overflow:visible;padding:clamp(24px,6vw,48px) clamp(12px,5vw,28px) calc(32px + env(safe-area-inset-bottom))}
	body.landing-page .hero-content{width:100%;max-width:710px;min-width:0;padding-bottom:0}
	body.landing-page .hero p{max-width:38rem;font-size:clamp(.95rem,4vw,1.15rem);line-height:1.5}
	body.landing-page .emergency-contacts{width:100%;max-width:560px;padding:clamp(16px,5vw,22px) clamp(12px,4vw,20px);border-radius:clamp(18px,6vw,28px)}
	body.landing-page .emergency-contact-heading{align-items:flex-start;flex-wrap:wrap}
  .auth-card h2{font-size:1.6rem}
  .language-options{gap:14px}
}

/* Keep the user dashboard visually separate from the admin console - professional blue theme */
body.user-page{background:linear-gradient(135deg,#0b2c69 0%,#0042b5 38%,#061d47 100%);color:#1c1917}
body.user-page .admin-sidebar.user-sidebar{background:linear-gradient(180deg,#0a66c2,#074a92);box-shadow:2px 0 20px rgba(10,102,194,.18)}
	body.landing-page .hero h1{font-size:clamp(2.3rem,15vw,3rem);overflow-wrap:anywhere}
	body.landing-page .eyebrow{max-width:100%;font-size:.65rem;letter-spacing:.08em}
body.user-page .admin-sidebar.user-sidebar .brand{display:flex;align-items:center;gap:12px;padding:18px 16px 12px;font-size:1.3rem;font-weight:800;letter-spacing:-.04em;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.2)}
body.user-page .admin-sidebar.user-sidebar .brand-mark{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(255,138,0,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.14);font-size:.8rem;letter-spacing:.08em;color:#ff8a00}
body.user-page .admin-sidebar.user-sidebar nav{background:transparent;padding:0 12px 14px}
body.user-page .admin-sidebar.user-sidebar nav a{display:flex;align-items:center;gap:12px;margin:5px 0;padding:12px 12px;border-radius:14px;color:#fff;font-weight:700;transition:all var(--transition);animation:fadeInUp .5s ease-out both}
body.user-page .admin-sidebar.user-sidebar nav a:hover{background:rgba(255,255,255,.16);transform:translateX(4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 20px rgba(255,138,0,.2)}
body.user-page .admin-sidebar.user-sidebar nav a.active{background:linear-gradient(135deg,rgba(255,138,0,.25),rgba(255,138,0,.12));color:#ff8a00;box-shadow:0 10px 24px rgba(255,138,0,.28);font-weight:800}
body.user-page .admin-sidebar.user-sidebar nav a .nav-icon{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:10px;background:rgba(255,255,255,.12);font-size:1rem;flex-shrink:0}
body.user-page .admin-sidebar.user-sidebar nav a.active .nav-icon{background:rgba(249,115,22,.1);color:#c2410c}
body.user-page .admin-sidebar.user-sidebar nav a.logout-link{margin-top:14px;border-top:1px solid rgba(255,255,255,.18);padding-top:16px}
body.user-page .admin-main.user-main{background:radial-gradient(circle at top right,rgba(251,146,60,.18),transparent 28%),#fff7ed}
body.user-page .mobile-menu-toggle{display:none}
body.user-page .data-card,body.user-page .message-card,body.user-page .stat-card,body.user-page .table,body.user-page .form-container{border-color:#fed7aa;box-shadow:0 12px 28px rgba(124,45,18,.08)}
body.user-page .page-heading h1,body.user-page .page-heading h2,body.user-page .report-toolbar h2{color:#1c1917}
body.user-page .btn-primary,body.user-page .admin-main button{background:linear-gradient(180deg,#ff8a00,#f56d00);box-shadow:0 10px 22px rgba(255,138,0,.25);border:none;color:#fff;font-weight:800;transition:all var(--transition);animation:fadeInUp .5s ease-out both}body.user-page .btn-primary:hover,body.user-page .admin-main button:hover{background:linear-gradient(180deg,#e67e00,#e35800);transform:translateY(-2px);box-shadow:0 14px 28px rgba(255,138,0,.35);opacity:1}
body.user-page .sg-notification-btn .bell-icon{animation:ring-bell 1.3s ease-in-out infinite;transform-origin:50% 30%}
body.user-page .notification-count{animation:badge-pop .48s ease-out 1}
@keyframes ring-bell{0%,100%{transform:rotate(0deg)}10%{transform:rotate(12deg)}20%{transform:rotate(-10deg)}30%{transform:rotate(10deg)}40%{transform:rotate(-8deg)}}
@keyframes badge-pop{0%{transform:scale(.8)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
@media(max-width:900px){body.user-page .admin-sidebar.user-sidebar{background:linear-gradient(180deg,#f97316,#c2410c)}body.user-page .admin-main.user-main{padding:74px 16px 28px}}

*{
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-family: Arial, Helvetica, sans-serif;
}

html,body{
	height:100%;
	background:var(--bg);
	color:#111827;
}

body{
	min-height:100vh;
	display:flex;
	flex-direction:column;
}

body > footer{
	margin-top:auto;
}

/* Layout container */
.container{
	max-width:1100px;
	margin:0 auto;
	padding:0 20px;
}

/* Navigation */
nav{
	background:var(--brand);
	padding:12px 20px;
	display:flex;
	justify-content:space-between;
	align-items:center;
}

.logo{
	color:#fff;
	font-size:22px;
	font-weight:700;
}

nav ul{
	display:flex;
	list-style:none;
	align-items:center;
}

nav ul li{
	margin-left:18px;
}

nav ul li a{
	color:#fff;
	text-decoration:none;
	font-weight:600;
	transition:opacity .18s ease, transform .18s ease;
}

nav ul li a:hover{
	opacity:.9;
	transform:translateY(-1px);
}

/* Sidebar buttons for user dashboard */
.sbtn{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;color:rgba(255,255,255,.95);text-decoration:none;display:block}
.sbtn.active{background:rgba(255,255,255,.06);font-weight:700}
.sidebar-collapse{position:absolute;right:-22px;top:12px;background:var(--brand-2);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;border:none;box-shadow:0 6px 18px rgba(0,0,0,.12)}

/* Buttons */
.btn{
	background:#fff;
	padding:10px 22px;
	color:var(--brand);
	text-decoration:none;
	border-radius:6px;
	margin-top:20px;
	display:inline-block;
	font-weight:700;
}

.btn:hover{opacity:.95}

.btn-primary{
	background:var(--brand);
	color:#fff;
}

.btn-outline{
	background:transparent;
	color:var(--brand);
	border:2px solid rgba(255,255,255,.12);
}

/* Forms */
.form-container{
	width:420px;
	max-width:95%;
	margin:40px auto;
	background:#fff;
	padding:28px;
	border-radius:var(--radius);
	box-shadow:var(--card-shadow);
}

.form-container h2{margin-bottom:10px}
body.user-page .admin-messages-main .report-toolbar .muted {
	color: #fff !important;
}

input, select, textarea{
	width:100%;
	padding:10px 12px;
	margin-top:10px;
	margin-bottom:15px;
	border:1px solid #e6edf3;
	border-radius:6px;
	background:#fff;
	transition:box-shadow .15s ease, border-color .12s ease;
}

input:focus, select:focus, textarea:focus{
	outline:none;
	border-color:var(--brand);
	box-shadow:0 4px 14px rgba(15,118,110,0.08);
}

button{
	width:100%;
	padding:12px;
	background:var(--brand);
	border:none;
	color:white;
	cursor:pointer;
	border-radius:6px;
	font-weight:700;
}

button:hover{opacity:.95}

button:disabled,
.btn:disabled{
	cursor:not-allowed;
	opacity:.55;
}

.admin-main .form-card{
	background:#fff;
	border-radius:var(--radius);
	box-shadow:var(--card-shadow);
	padding:24px;
	margin-bottom:18px;
}
.admin-main .form-card h1{
	margin-bottom:18px;
}
.admin-main .form-grid{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
}
.admin-main .form-grid .field-group{
	display:flex;
	flex-direction:column;
}
.admin-main .form-section{
	margin-top:24px;
}
.admin-main .form-section h2{
	font-size:18px;
	margin-bottom:14px;
}
.admin-main .time-grid,
.admin-main .odometer-grid{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
}
.admin-main .time-grid{
	grid-template-columns:100px 100px 100px;
}
.admin-main .admin-form-actions{
	display:flex;
	gap:12px;
	flex-wrap:wrap;
	margin-top:22px;
}
.admin-main .admin-form-actions button{
	width:auto;
	min-width:140px;
}
.admin-main .admin-form-alert{
	padding:14px 16px;
	border-radius:10px;
	margin-bottom:18px;
}
.admin-main .admin-form-alert.success{
	background:#ecfdf5;
	color:#065f46;
	border:1px solid #bbf7d0;
}
.admin-main .admin-form-alert.error{
	background:#ffeded;
	color:#7f1d1d;
	border:1px solid #fca5a5;
}

@media (max-width:900px){
	.admin-main .form-grid,
	.admin-main .odometer-grid,
	.admin-main .time-grid{
		grid-template-columns:1fr;
	}
}

/* Profile surface: clean white and blue treatment. */
body.user-page .profile-identity-card {
	background: linear-gradient(145deg, #ffffff 0%, #eaf3ff 100%);
	border: 1px solid #cfe0f2;
	color: #102a4c;
	box-shadow: 0 13px 28px rgba(7,82,184,.16);
}

body.user-page .profile-identity-card p { color: #4c6b8c; }
body.user-page .profile-avatar-photo { background: #0752b8; color: #fff; box-shadow: 0 0 0 2px #9fc6ed; }
body.user-page .profile-camera { background: #0752b8; color: #fff; }
body.user-page .resident-badge { border-color: #9fc6ed; background: #dceeff; color: #0752b8; }

/* Keep the complete Profile section white for readable text and controls. */
body.user-page .profile-screen,
body.user-page .mobile-profile-main {
	background: #fff !important;
	color: #102a4c;
}

body.user-page .profile-screen .profile-content,
body.user-page .profile-screen .preferences-card,
body.user-page .profile-screen .legal-menu {
	background: #fff;
}

/* Complementary white and blue Profile system. */
body.user-page .profile-screen {
	background: #fff !important;
}

body.user-page .profile-identity-card {
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, #ffffff 0%, #f4f9ff 62%, #e3f0ff 100%);
	border: 1px solid #c9def5;
	border-top: 5px solid #1877f2;
	box-shadow: 0 14px 30px rgba(16, 76, 145, .12);
}

body.user-page .profile-identity-card::after {
	content: '';
	position: absolute;
	right: -44px;
	top: -54px;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	background: rgba(24,119,242,.08);
	pointer-events: none;
}

body.user-page .profile-identity-card h1,
body.user-page .profile-identity-card p,
body.user-page .profile-identity-card .resident-badge,
body.user-page .profile-identity-card .profile-avatar-wrap { position: relative; z-index: 1; }

body.user-page .profile-avatar-photo {
	background: #1877f2;
	box-shadow: 0 0 0 3px #fff, 0 0 0 5px #9fc6ed, 0 8px 18px rgba(24,119,242,.2);
}

body.user-page .profile-camera {
	background: #1877f2;
	box-shadow: 0 4px 10px rgba(24,119,242,.25);
}

body.user-page .profile-info-grid,
body.user-page .preferences-card,
body.user-page .legal-menu {
	border-color: #d7e5f4;
	box-shadow: 0 8px 22px rgba(20, 64, 110, .07);
}

body.user-page .profile-info i,
body.user-page .preference-row i {
	background: #eaf3ff;
	color: #1877f2;
}

body.user-page .profile-save,
body.user-page .profile-save-trigger {
	background: #1877f2 !important;
	box-shadow: 0 8px 16px rgba(24,119,242,.2);
}

body.user-page .profile-save:hover,
body.user-page .profile-save-trigger:hover {
	background: #0f65d1 !important;
}

/* Compact, professional profile update surface. */
body.user-page .profile-identity-card {
	max-width: 560px;
	margin-top: 16px;
	padding: 20px 20px 16px;
	border-radius: 18px;
}

body.user-page .profile-avatar-wrap { width: 76px; height: 76px; margin-bottom: 8px; }
body.user-page .profile-avatar-photo { width: 70px; height: 70px; font-size: 2rem; }
body.user-page .profile-camera { width: 30px; height: 30px; }
body.user-page .profile-camera svg { width: 16px; height: 16px; }
body.user-page .profile-identity-card h1 { font-size: 1.2rem; }
body.user-page .profile-identity-card p { margin: 3px 0 8px; font-size: .8rem; }
body.user-page .resident-badge { padding: 4px 10px; font-size: .68rem; }

body.user-page .profile-content {
	max-width: 560px;
	padding: 16px;
	border: 1px solid #d7e5f4;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 10px 24px rgba(20,64,110,.08);
}

body.user-page .profile-content .profile-info-grid,
body.user-page .profile-content .profile-edit-fields { box-shadow: none; }
body.user-page .profile-content .profile-section-heading { margin-bottom: 10px; }
body.user-page .profile-content .profile-section-heading h2 { font-size: 1rem; }

body.user-page #saveProfileDialog {
	width: min(88vw, 320px);
	margin: auto;
	padding: 20px;
	border: 1px solid #d7e5f4;
	border-radius: 18px;
	background: #fff;
	color: #102a4c;
	box-shadow: 0 20px 55px rgba(15,42,76,.22);
}

body.user-page #saveProfileDialog::backdrop { background: rgba(7,36,76,.38); }
body.user-page #saveProfileDialog .dialog-icon { background: #eaf3ff; color: #1877f2; }
body.user-page #saveProfileDialog h2 { margin: 10px 0 6px; font-size: 1.05rem; }
body.user-page #saveProfileDialog p { margin: 0; color: #617894; font-size: .8rem; line-height: 1.45; }
body.user-page #saveProfileDialog > div:last-child { display: flex; gap: 8px; margin-top: 16px; }
body.user-page #saveProfileDialog > div:last-child button { flex: 1; min-height: 38px; border-radius: 9px; font-size: .8rem; }
body.user-page #saveProfileDialog #confirmProfileSave { background: #1877f2 !important; color: #fff !important; }

@media(max-width:900px){
	body.user-page .profile-identity-card { border-radius: 0 0 18px 18px; }
	body.user-page .profile-content { padding: 14px; }
}

/* Dashboard */
.dashboard{
	padding:30px 20px;
	max-width:1100px;
	margin:0 auto 60px;
}

.dashboard h1{margin-bottom:14px}

.cards{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
	gap:18px;
	margin-top:16px;
}

.card{
	background:#fff;
	padding:18px;
	border-radius:var(--radius);
	box-shadow:var(--card-shadow);
}

.card h3{margin-bottom:8px}
.card p{font-size:20px;color:var(--muted);}

/* Tables */
.table{
	width:100%;
	border-collapse:collapse;
	background:#fff;
	border-radius:8px;
	overflow:hidden;
}

.table th, .table td{
	padding:12px 14px;
	text-align:left;
	border-bottom:1px solid #f1f5f9;
}

.table thead th{background:#f8fafc;color:var(--muted);font-weight:700}

.table tbody tr:nth-child(even){background:#fbfdff}

/* Alerts */
.alert{padding:12px 14px;border-radius:6px;margin-bottom:12px}
.alert-success{background:#ecfdf5;color:#065f46;border:1px solid #bbf7d0}
.alert-error{background:#ffeded;color:#7f1d1d;border:1px solid #fca5a5}

/* Footer */
footer{
	background:var(--brand);
	color:#fff;
	text-align:center;
	padding:18px 12px;
	margin-top:auto;
}

/* Utilities */
.text-center{text-align:center}
.muted{color:var(--muted)}

/* Responsive */
@media (max-width:768px){
	nav{flex-direction:column;align-items:flex-start}
	nav ul{flex-direction:column;width:100%;margin-top:8px}
	nav ul li{margin-left:0;margin-top:8px}
	.hero{min-height:100svh;height:auto;padding:32px 16px}
	.hero h1{font-size:clamp(2.5rem,12vw,3.5rem)}
	.hero-center-content{gap:14px}
	.form-container{margin:20px auto}
	.cards{grid-template-columns:1fr}
}

.landing-page .hero-cta{
	width:min(100%,240px);
	max-width:100%;
	min-height:52px;
	margin-top:0;
	padding:16px 24px;
}

@media (max-width:480px){
	.emergency-contact-row{align-items:flex-start;flex-wrap:wrap;padding-left:48px}
	.emergency-contact-actions{width:100%;margin-left:0}
	.emergency-contact-actions a{flex:1;min-width:0;padding-inline:6px;white-space:nowrap}
}

@media (min-width:481px) and (max-width:900px){
	.emergency-contact-row{flex-wrap:wrap}
	.emergency-contact-actions{width:100%;margin-left:0}
	.emergency-contact-actions a{flex:1}
}

@media (max-width:420px){
	.emergency-contact-actions{gap:6px}
	.emergency-contact-actions a{font-size:.72rem}
}

/* Admin styles */
.admin-layout{display:flex;min-height:80vh}

/* Fixed left sidebar */
.admin-sidebar{
	position:fixed;
	left:0;
	top:0;
	bottom:0;
	width:240px;
	background:linear-gradient(180deg,var(--brand),#084e4a);
	color:#fff;
	padding:20px 12px;
	overflow-y:auto;
	overflow-x:hidden;
	transition:width .22s ease, transform .22s ease;
	z-index:1100;
	box-shadow:2px 0 10px rgba(0,0,0,0.06);
	will-change:transform;
}
.admin-sidebar .brand{font-size:18px;font-weight:800;margin-bottom:18px;padding-left:8px}
/* vertical stack, icons inline */
.admin-sidebar nav{display:block}
.admin-sidebar nav a{display:block;color:rgba(255,255,255,.95);padding:12px 10px;border-radius:8px;margin-bottom:6px;text-decoration:none;white-space:normal}
.admin-sidebar nav a .icon{display:inline-block;width:24px;text-align:center;margin-right:8px;vertical-align:middle}
.admin-sidebar nav a:hover{background:rgba(255,255,255,.04)}
.admin-sidebar nav a.active{background:rgba(255,255,255,.08);font-weight:700}
.admin-sidebar .sidebar-toggle{position:absolute;right:-22px;top:12px;background:var(--brand-2);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;border:none;box-shadow:0 6px 18px rgba(0,0,0,.12)}
.admin-sidebar .nav-group{margin-bottom:8px}
.admin-sidebar .nav-group .group-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:transparent;border:none;color:inherit;padding:12px 10px;border-radius:8px;cursor:pointer;font:inherit;text-align:left}
.admin-sidebar .nav-group .group-toggle:hover{background:rgba(255,255,255,.04)}
.admin-sidebar .nav-group .submenu{display:none;padding-left:10px;margin-top:4px}
.admin-sidebar .nav-group.open .submenu{display:block}
.admin-sidebar .nav-group .submenu a{padding:10px 8px;margin-bottom:4px;font-size:14px}
.admin-sidebar .nav-group .submenu a .icon{width:20px}

.admin-main{flex:1;padding:32px 28px 40px;margin-left:240px;transition:margin-left .22s ease;max-width:calc(100% - 240px);overflow-x:hidden;background:radial-gradient(circle at top left, rgba(59,130,246,.08), transparent 30%),linear-gradient(180deg,#f8fbff 0%,#f5f7fa 100%)}

.admin-main .page-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.admin-main .page-heading h1,.admin-main .page-heading h2{margin:0}
.admin-main .data-card{background:rgba(255,255,255,.97);border:1px solid #e5edf5;border-radius:16px;box-shadow:0 12px 32px rgba(15,23,42,.07);padding:20px}
.admin-main .form-card{background:#fff;border-radius:var(--radius);box-shadow:var(--card-shadow);padding:24px;margin-bottom:18px}
.admin-main .form-card h1{margin-bottom:16px}
.admin-main .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.admin-main .form-grid .field-group{display:flex;flex-direction:column}
.admin-main .form-section{margin-top:24px}
.admin-main .form-section h2{font-size:18px;margin-bottom:14px}
.admin-main .odometer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px}
.admin-main .form-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.admin-main .form-actions button{width:auto;min-width:140px}
.admin-main .time-row{display:grid;grid-template-columns:100px 100px 100px;gap:12px}
.admin-main .time-row select{width:100%}
.admin-main .admin-alert{margin-bottom:18px;padding:14px;border-radius:10px}
.admin-main .admin-alert.success{background:#ecfdf5;color:#065f46;border:1px solid #bbf7d0}
.admin-main .admin-alert.error{background:#ffeded;color:#7f1d1d;border:1px solid #fca5a5}

@media (max-width:900px){
	.admin-main .form-grid,
	.admin-main .odometer-grid,
	.admin-main .time-row{grid-template-columns:1fr}
}
.admin-sidebar.collapsed{width:72px}
.admin-main.collapsed{margin-left:72px;max-width:calc(100% - 72px)}

.admin-sidebar.collapsed{width:72px}
.admin-main.collapsed{margin-left:72px}

.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:18px}
.stat-card{background:#fff;padding:16px;border-radius:10px;box-shadow:var(--card-shadow)}
.stat-card h2{margin:0;font-size:20px}
.stat-card p{margin:8px 0 0;color:var(--muted);font-weight:700}
.recent-table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden}
.recent-table thead th{background:#eff6ff;color:#1e3a8a;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.recent-table th,.recent-table td{padding:12px 14px;border-bottom:1px solid #eef2f7;text-align:left}
.recent-table tbody tr{transition:background .18s ease, transform .18s ease}
.recent-table tbody tr:hover{background:#f8fbff}
.recent-table tbody tr:last-child td{border-bottom:none}
.status-btn{padding:6px 10px;border-radius:6px;border:none;cursor:pointer}
.status-pending{background:#f97316;color:#fff}
.status-resolved{background:#10b981;color:#fff}
.notif-bubble{background:#ef4444;color:#fff;border-radius:999px;padding:4px 8px;font-weight:700;margin-left:8px}

/* hide top nav on admin pages */
body.admin-page > nav{display:none}

@media (max-width:900px){
	.admin-sidebar{transform:translateX(-100%)}
	.admin-sidebar.open{transform:translateX(0)}
	.admin-main{margin-left:0;max-width:100%}
	.admin-sidebar .sidebar-toggle{right:8px}
}

/* Prevent horizontal scrolling on admin pages */
body.admin-page{overflow-x:hidden}

/* Modern shared admin navigation */
.admin-sidebar-modern .brand{display:flex;align-items:center;gap:8px;min-height:42px;padding:2px 8px 12px;font-size:1.12rem;font-weight:800;letter-spacing:-.03em;line-height:1.2}
.admin-sidebar-modern .brand span{color:#dff9ff;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase}
.admin-sidebar-modern .admin-nav{display:block;background:transparent;padding:0}
.admin-sidebar-modern .admin-nav > a,
.admin-sidebar-modern .group-toggle{display:flex;align-items:center;gap:10px;min-height:42px;margin:2px 0;padding:9px 10px;border-radius:10px;color:rgba(255,255,255,.92);transition:background .2s ease,color .2s ease}
.admin-sidebar-modern .admin-nav > a{font-weight:600;letter-spacing:.01em}
.admin-sidebar-modern .admin-nav > a:hover,
.admin-sidebar-modern .admin-nav > a.active,
.admin-sidebar-modern .group-toggle:hover{background:rgba(255,255,255,.12);color:#fff}
.admin-sidebar-modern .group-toggle{width:100%;border:0;background:transparent;font:inherit;font-weight:600;text-align:left;cursor:pointer}
.admin-sidebar-modern .group-toggle > span:first-child{display:flex;align-items:center;gap:10px}
.admin-sidebar-modern .icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin:0;border-radius:7px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);text-align:center;line-height:1;font-size:13px;flex-shrink:0}
.admin-sidebar-modern .chevron{margin-left:auto;font-size:17px;transition:transform .24s ease}
.admin-sidebar nav a,
.admin-sidebar nav .group-toggle,
.admin-sidebar nav .submenu a{transition:transform .2s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease}
.admin-sidebar nav a:hover,
.admin-sidebar nav .group-toggle:hover,
.admin-sidebar nav .submenu a:hover{background:linear-gradient(135deg, rgba(255,255,255,.08), rgba(110,181,255,.12));border-color:rgba(142,213,255,.35);transform:translateX(2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 10px 22px rgba(10, 102, 194, .15)}
.admin-sidebar nav a.active,
.admin-sidebar nav .submenu a.active{background:linear-gradient(135deg, rgba(14, 116, 194, .92), rgba(9, 82, 164, .96));border-color:rgba(167, 220, 255, .45);box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 0 0 1px rgba(123, 199, 255, .15), 0 14px 26px rgba(20, 118, 255, .2)}
.admin-sidebar-modern .nav-group.open > .group-toggle .chevron{transform:rotate(180deg)}
.admin-sidebar.admin-sidebar-modern .submenu{display:grid;grid-template-rows:0fr;overflow:hidden;padding:0 0 0 11px;transition:grid-template-rows .25s ease,padding .25s ease}
.admin-sidebar-modern .submenu > *{min-height:0;overflow:hidden}
.admin-sidebar-modern .nav-group.open > .submenu{grid-template-rows:1fr;padding:2px 0 4px 11px}
.admin-sidebar-modern .submenu a{display:flex;align-items:center;gap:8px;margin:2px 0;padding:8px 9px;border-radius:8px;color:rgba(255,255,255,.8);font-size:13px;text-decoration:none;transition:background .2s ease,color .2s ease}
.admin-sidebar-modern .submenu a:hover,.admin-sidebar-modern .submenu a.active{background:rgba(255,255,255,.12);color:#fff}
.admin-sidebar-modern .logout-link{margin-top:12px;border-top:1px solid rgba(255,255,255,.12);border-radius:0!important;padding-top:12px!important}
.admin-sidebar-modern .select-menu{margin:10px 0 12px;padding:10px 10px 11px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 8px 18px rgba(15,23,42,.12)}
.admin-sidebar-modern .select-menu label{display:flex;align-items:center;gap:10px;margin-bottom:9px;padding:2px 2px 0;color:#f5fbff;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.admin-sidebar-modern .select-menu label .icon{width:20px;height:20px;border-radius:7px;font-size:12px}
.admin-sidebar-modern .select-menu select{width:100%;margin:0;padding:12px 14px;border:1px solid #dfeaf7;border-radius:10px;background:linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);color:#1f2937;font-size:14px;font-weight:700;cursor:pointer;box-shadow:0 4px 10px rgba(15,23,42,.08);min-height:46px;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:linear-gradient(45deg, transparent 50%, #1d4ed8 50%), linear-gradient(135deg, #1d4ed8 50%, transparent 50%);background-position:calc(100% - 18px) calc(50% - 2px), calc(100% - 12px) calc(50% - 2px);background-size:6px 6px, 6px 6px;background-repeat:no-repeat}
.admin-sidebar-modern .select-menu select option{padding:10px 12px;color:#111827;background:#fff;font-weight:600}
.admin-sidebar-modern .select-menu select:focus{outline:3px solid rgba(153,246,228,.9);outline-offset:2px;border-color:#93c5fd;box-shadow:0 0 0 4px rgba(147,197,253,.22), 0 6px 16px rgba(59,130,246,.12)}
.legacy-sidebar{display:none!important}
.admin-sidebar-modern.collapsed .brand span,
.admin-sidebar-modern.collapsed .admin-nav > a span:not(.icon),
.admin-sidebar-modern.collapsed .group-toggle > span:first-child > span:not(.icon),
.admin-sidebar-modern.collapsed .chevron,
.admin-sidebar-modern.collapsed .submenu,
.admin-sidebar-modern.collapsed .select-menu{display:none}
.admin-sidebar-modern.collapsed .admin-nav > a,.admin-sidebar-modern.collapsed .group-toggle{justify-content:center}
.admin-sidebar-modern.collapsed .group-toggle > span:first-child{gap:0}
.admin-main .back-button{display:inline-flex;align-items:center;gap:6px;width:max-content;margin:0 0 18px;padding:9px 14px;border:1px solid #cbd5e1;border-radius:999px;background:#fff;color:#334155;text-decoration:none;font-size:14px;font-weight:700;transition:all .2s ease;box-shadow:0 6px 16px rgba(15,23,42,.05)}
.admin-main .back-button:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-1px);box-shadow:0 10px 20px rgba(15,118,110,.12)}

/* Simple button dropdowns: hidden by default, shown only after a click. */
.admin-sidebar.admin-sidebar-modern .group-toggle{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.admin-sidebar.admin-sidebar-modern .submenu{display:none;grid-template-rows:none;padding:4px 0 6px 13px;transition:none}
.admin-sidebar.admin-sidebar-modern .nav-group.open > .submenu{display:block;padding:4px 0 6px 13px}

@media (max-width:900px){
	.admin-sidebar-modern .sidebar-toggle{position:fixed;left:12px;right:auto;top:12px;z-index:1200}
}

/* User dashboard and reports */
.user-layout{
	display:flex;
	min-height:calc(100vh - 58px);
}

.page-heading{
	margin-bottom:18px;
}

.page-heading h1,
.page-heading h2{
	margin-bottom:6px;
}

.map-dashboard{
	display:grid;
	grid-template-columns:minmax(0, 1fr);
	gap:18px;
}

.report-toolbar{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:12px;
	margin-bottom:18px;
}

.report-toolbar .btn{
	margin-top:0;
	width:auto;
}

.status-pill{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:82px;
	padding:5px 10px;
	border-radius:999px;
	font-size:13px;
	font-weight:700;
	background:#eef2ff;
	color:#3730a3;
}

.status-pill.pending{background:#fff7ed;color:#9a3412}
.status-pill.resolved{background:#ecfdf5;color:#047857}

.empty-state{
	background:#fff;
	border:1px dashed #cbd5e1;
	border-radius:8px;
	padding:28px;
	text-align:center;
	color:var(--muted);
}

.message-list{
	display:grid;
	gap:12px;
}

.message-card{
	background:#fff;
	border:1px solid #e5e7eb;
	border-radius:8px;
	padding:16px;
	box-shadow:var(--card-shadow);
}

.message-card p{
	font-size:15px;
	line-height:1.5;
	color:#111827;
	margin-bottom:10px;
}

.message-card small{
	color:var(--muted);
	font-weight:700;
}
@media (max-width:900px){
	.user-layout{display:block}
}

/* Print styles for reports */
@media print{
	/* hide interactive and navigational chrome */
	.admin-sidebar, .sidebar-toggle, nav, header, footer, .no-print, .status-btn, form[name], .muted, .btn { display: none !important; }
	/* expand main content to full width */
	.admin-main, .container{ margin:0 !important; padding:0 !important; width:100% !important; max-width:100% !important }
	body{background:#fff;color:#000}
	table{border-collapse:collapse;width:100%}
	table th, table td{border:1px solid #222 !important;padding:6px !important;color:#000;background:transparent}
	.stat-card{box-shadow:none;background:transparent}
}

/* StreetGuard resident app: mobile-first dashboard and navigation. */
.mobile-app-header,.mobile-bottom-nav{display:none}
.mobile-dashboard-main{padding-bottom:40px}
.mobile-hero-card,.mobile-section-card,.mobile-status-card{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.mobile-hero-card{position:relative;overflow:hidden;min-height:190px;padding:32px 24px;border-radius:28px;background:#fff;box-shadow:0 12px 28px rgba(17,42,76,.08)}
.mobile-hero-card h1{position:relative;z-index:1;margin:0;color:#102a4c;font-size:2rem;line-height:1.1}.mobile-hero-card p{position:relative;z-index:1;max-width:180px;margin:12px 0 0;color:#687386;font-size:1rem;line-height:1.45}.mobile-hero-art{position:absolute;right:-8px;bottom:0;width:55%;max-height:150px}
.mobile-status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}.mobile-status-card{min-width:0;padding:14px 12px;border-radius:18px;box-shadow:0 7px 18px rgba(17,42,76,.05);display:flex;flex-direction:column;color:#102a4c}.mobile-status-card.gps{background:#eaf3ff}.mobile-status-card.incidents{background:#fff1e7}.mobile-status-card.tracking{background:#e9f9f1}.mobile-status-card .status-symbol{width:30px;height:30px;margin-bottom:8px;display:grid;place-items:center;border-radius:50%;font-size:20px;font-weight:800}.gps .status-symbol{color:#0752b8;background:#d7e9ff}.incidents .status-symbol{color:#f47b20;background:#ffe1cb}.tracking .status-symbol{color:#16a36a;background:#d8f5e6}.mobile-status-card>span:not(.status-symbol),.mobile-status-card small{font-size:.72rem;color:#687386;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-status-card strong{margin:4px 0;font-size:1.45rem}
.mobile-section-card{margin:14px 0;padding:20px;border-radius:24px;background:#fff;box-shadow:0 9px 26px rgba(17,42,76,.06)}.mobile-section-card h2{margin:0;color:#102a4c;font-size:1.15rem}.mobile-section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.mobile-section-heading a{color:#0752b8;text-decoration:none;font-weight:700;font-size:.9rem;white-space:nowrap}
.mobile-actions-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-top:16px}.mobile-action{grid-column:span 2;min-height:58px;padding:9px 8px;border:0;border-radius:15px;display:flex;align-items:center;justify-content:center;gap:7px;color:#102a4c;text-decoration:none;font:700 .78rem/1.2 Inter,system-ui,sans-serif;text-align:center;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}.mobile-action.wide{grid-column:span 4}.mobile-action:hover,.mobile-action:focus-visible{transform:translateY(-2px);box-shadow:0 7px 15px rgba(17,42,76,.1)}.mobile-action b{font-size:1.25rem}.action-location{background:#fff0f2;color:#b63245}.action-map{background:#eaf3ff;color:#0752b8}.action-orange{background:#fff1e7;color:#df6818}.action-yellow{background:#fff8e5;color:#b77909}.mobile-action-notice{min-height:0;margin:10px 0 0;color:#687386;font-size:.78rem}
.mobile-summary-grid{display:grid;grid-template-columns:repeat(5,1fr);margin-top:18px}.mobile-summary-grid>div{min-width:0;padding:0 5px;text-align:center;border-right:1px solid #edf0f4;display:flex;flex-direction:column;align-items:center}.mobile-summary-grid>div:last-child{border:0}.mobile-summary-grid i{width:34px;height:34px;margin-bottom:8px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:17px}.summary-hazard{background:#fff0f2;color:#b63245}.summary-incident{background:#fff1e7;color:#df6818}.summary-route{background:#eaf3ff;color:#0752b8}.summary-report{background:#e9f9f1;color:#16a36a}.summary-medical{background:#f3e8ff;color:#7e22ce}.mobile-summary-grid span,.mobile-summary-grid small{font-size:.7rem;color:#687386}.mobile-summary-grid strong{margin:4px 0;color:#102a4c;font-size:1.25rem}
.dashboard-emergency-grid{display:grid;grid-template-columns:1fr;gap:10px}.dashboard-emergency-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;min-width:0;padding:14px;border:1px solid #e3eaf3;border-radius:15px;background:#f8fbff}.dashboard-emergency-card strong,.dashboard-emergency-card>span{display:block;color:#102a4c}.dashboard-emergency-card strong{font-size:.9rem}.dashboard-emergency-card>span{grid-column:1;margin:6px 0 0;font-size:.8rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dashboard-emergency-actions{grid-column:2;grid-row:1 / span 2;display:flex;gap:7px}.dashboard-emergency-actions a{display:inline-flex;align-items:center;justify-content:center;flex:1;min-width:0;padding:8px 5px;border-radius:9px;background:#0752b8;color:#fff;text-align:center;text-decoration:none;font-size:.72rem;font-weight:800;line-height:1;white-space:nowrap}.dashboard-emergency-actions a:last-child{background:#fff;color:#0752b8;border:1px solid #bfdbfe}
.mobile-empty-reports{padding:28px 10px 12px;text-align:center}.mobile-empty-reports>span{width:58px;height:58px;margin:0 auto 12px;border-radius:50%;background:#edf3fa;color:#687386;display:grid;place-items:center;font-size:30px}.mobile-empty-reports strong{display:block;color:#102a4c;font-size:1.05rem}.mobile-empty-reports p{max-width:250px;margin:8px auto 0;color:#687386;font-size:.88rem;line-height:1.45}.mobile-recent-list{margin-top:14px;display:grid;gap:8px}.mobile-recent-list a{padding:11px 12px;border-radius:12px;background:#f8fafc;color:#102a4c;text-decoration:none;display:flex;justify-content:space-between;gap:8px;font-size:.84rem}.mobile-recent-list span{color:#687386;font-size:.72rem}.mobile-recent-report-list{display:grid;gap:9px;margin-top:14px}.mobile-recent-report{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;padding:13px 14px;border:1px solid #e3eaf3;border-radius:14px;background:#f8fbff;box-shadow:0 3px 10px rgba(17,42,76,.04)}.mobile-recent-report>div{display:flex;align-items:center;gap:10px;min-width:0}.mobile-recent-report strong{color:#102a4c;font-size:.86rem;white-space:nowrap}.mobile-recent-report>div span{min-width:0;overflow:hidden;color:#405775;font-size:.84rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.mobile-recent-report .status-pill{flex:0 0 auto;min-width:78px;padding:6px 9px;font-size:.72rem}.status-pill.rejected{background:#fef3f2;color:#b42318}.status-pill.verified{background:#eff8ff;color:#175cd3}
.mobile-profile-main{padding-bottom:40px}.mobile-profile-card{margin:0 -28px 18px;padding:36px 20px 28px;text-align:center;background:linear-gradient(150deg,#0752b8,#0b3f92);color:#fff;border-radius:0 0 30px 30px}.profile-avatar{width:68px;height:68px;margin:0 auto 12px;border:3px solid rgba(255,255,255,.7);border-radius:50%;display:grid;place-items:center;background:#f47b20;font-size:1.75rem;font-weight:800}.mobile-profile-card h1{margin:0;font-size:1.4rem}.mobile-profile-card p{margin:7px 0 0;color:#dceaff;font-size:.88rem}.mobile-profile-form{padding:20px;border-radius:24px;background:#fff;box-shadow:0 9px 26px rgba(17,42,76,.06)}.mobile-profile-form .mobile-section-heading{align-items:flex-start;margin-bottom:20px}.mobile-profile-form .mobile-section-heading span{color:#687386;font-size:.78rem}.mobile-profile-form>label{display:block;margin-bottom:8px;color:#102a4c;font-size:.85rem;font-weight:700}.mobile-profile-form input[type="tel"]{width:100%;padding:14px 15px;border:1px solid #d8e2ef;border-radius:14px;background:#f8fbff;color:#102a4c;font:1rem Inter,system-ui,sans-serif}.mobile-profile-form input:focus{outline:3px solid rgba(7,82,184,.15);border-color:#0752b8}.mobile-language-picker{margin:20px 0;border:0;padding:0}.mobile-language-picker legend{margin-bottom:10px;color:#102a4c;font-size:.85rem;font-weight:700}.mobile-language-picker label{position:relative;margin:8px 0;padding:13px 14px;border:1px solid #e3eaf3;border-radius:15px;display:flex;align-items:center;gap:10px;cursor:pointer}.mobile-language-picker label:has(input:checked){border-color:#0752b8;background:#eaf3ff}.mobile-language-picker input{accent-color:#0752b8}.mobile-language-picker b,.mobile-language-picker small{display:block}.mobile-language-picker small{margin-top:3px;color:#687386;font-size:.75rem}.mobile-save-profile{width:100%;padding:15px;border:0;border-radius:15px;background:#0752b8;color:#fff;font:800 1rem Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 9px 18px rgba(7,82,184,.22)}.mobile-form-notice{padding:10px 12px;border-radius:12px;font-size:.84rem}.mobile-form-notice.success{background:#e9f9f1;color:#16734d}.mobile-form-notice.error{background:#fff0f2;color:#b63245}
  body.mobile-user-page{background:linear-gradient(135deg,#0b2c69 0%,#0042b5 38%,#061d47 100%);padding-bottom:82px}.mobile-app-header{height:88px;padding:18px 18px 14px;background:linear-gradient(135deg,#0a66c2,#074a92);display:flex;align-items:center;justify-content:center;position:sticky;top:0;z-index:1250;box-shadow:0 8px 24px rgba(10,102,194,.24);transition:all .3s ease;animation:slideInDown .4s ease-out}.mobile-app-brand{display:flex;align-items:center;gap:7px;color:#fff;text-decoration:none;font:800 1.24rem/1 Inter,system-ui,sans-serif;letter-spacing:-.03em;text-shadow:0 2px 8px rgba(0,0,0,.15)}.mobile-app-brand>span>span{color:#ff8a00}.mobile-brand-mark{width:40px;height:40px;border:2px solid #fff;border-radius:16px;display:grid;place-items:center;color:#ff8a00;font-size:24px;background:rgba(255,138,0,.1)}.mobile-menu-toggle,.mobile-user-page #sidebarToggle{position:absolute;left:16px;top:26px;width:40px;height:40px;padding:0;border:0;background:transparent;color:#fff;font-size:28px;line-height:1;cursor:pointer;z-index:1;transition:all .18s ease;border-radius:10px}.mobile-menu-toggle:active,.mobile-user-page #sidebarToggle:active{transform:scale(.92);background:rgba(255,138,0,.1)}.mobile-notification-link{position:absolute;right:16px;top:26px;color:#fff;text-decoration:none;font-size:28px;line-height:1;transition:all .18s ease;border-radius:10px}.mobile-notification-link:active{transform:scale(.92);background:rgba(255,138,0,.1)}.mobile-notification-link span{position:absolute;right:-10px;top:-8px;min-width:22px;height:22px;padding:2px 6px;border-radius:999px;background:#ff8a00;color:#fff;font:700 11px/18px Inter,system-ui,sans-serif;text-align:center;animation:pulseGlow .6s ease-out;box-shadow:0 6px 16px rgba(255,138,0,.36)}.admin-sidebar.user-sidebar{display:none}.mobile-bottom-nav{position:fixed;z-index:1300;bottom:0;left:0;right:0;height:78px;padding:8px 6px calc(8px + env(safe-area-inset-bottom));background:#fff;border-top:3px solid #ff8a00;box-shadow:0 -12px 32px rgba(10,102,194,.16);display:grid;grid-template-columns:repeat(6,1fr);gap:2px;animation:slideInDown .4s ease-out .1s both}.mobile-bottom-nav a{min-width:0;border-radius:16px;color:#697a96;text-decoration:none;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;font:600 .72rem/1.1 Inter,system-ui,sans-serif;transition:all .2s cubic-bezier(.34,.68,.73,.85);padding:6px 4px;position:relative;outline:none;animation:fadeInUp .4s ease-out}.mobile-bottom-nav a:hover{color:#0a66c2;background:rgba(10,102,194,.08);transform:translateY(-3px)}.mobile-bottom-nav a:active{transform:scale(.92)}.mobile-bottom-nav a.active{color:#0a66c2;background:linear-gradient(135deg,rgba(10,102,194,.14),rgba(116,180,255,.08));border:1px solid rgba(10,102,194,.2);font-weight:700;box-shadow:0 6px 18px rgba(10,102,194,.16);transform:translateY(-4px)}.mobile-nav-icon{position:relative;font-size:26px;line-height:28px;font-weight:800;display:grid;place-items:center}.mobile-nav-icon em{position:absolute;top:-8px;right:-12px;min-width:20px;height:20px;padding:1px 5px;border-radius:999px;background:#ff8a00;color:#fff;font:700 11px/18px Inter,system-ui,sans-serif;text-align:center;animation:pulseGlow .5s ease-out;box-shadow:0 4px 12px rgba(255,138,0,.32)}tem-ui,sans-serif;font-style:normal;text-align:center}.mobile-dashboard-main,.mobile-profile-main{margin:0;max-width:none;padding:0 14px 16px;background:#f5f7fa}.mobile-dashboard-main .mobile-hero-card{margin:0 -14px;border-radius:0 0 30px 30px}.mobile-profile-main{padding:0 14px 16px!important}.mobile-profile-main .mobile-profile-card{margin:0 -14px 18px}.mobile-user-layout{display:block}.mobile-user-page>footer{display:none}.mobile-user-page .admin-main.user-main{padding-top:0}
}
/* Resident report screen */
.mobile-report-main{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.report-mobile-card{max-width:620px;margin:32px auto;padding:28px;border-radius:28px;background:#fff;box-shadow:0 14px 34px rgba(17,42,76,.09)}
.report-intro{position:relative;min-height:126px;margin:-28px -28px 26px;padding:27px 28px 18px;overflow:hidden;border-radius:28px 28px 0 0;background:linear-gradient(135deg,#fff 45%,#f5faff)}
.report-title-row{display:flex;align-items:flex-start;gap:12px;position:relative;z-index:1;max-width:340px}.report-title-icon{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:16px;background:#fff0e6;color:#f47b20}.report-title-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.report-intro h1{margin:2px 0 6px;color:#102a4c;font-size:1.36rem;line-height:1.15}.report-intro p{margin:0;color:#687386;font-size:.83rem;line-height:1.45}.report-road-art{position:absolute;right:-6px;bottom:-1px;width:47%;height:auto}
.mobile-report-form{display:grid;gap:9px}.mobile-report-form>label{margin-top:10px;color:#102a4c;font-size:.88rem;font-weight:800}.mobile-report-form>label span{color:#8a95a6;font-weight:600}.mobile-select{position:relative;height:58px;display:flex;align-items:center;border:1px solid;border-radius:16px}.select-orange{border-color:#ffd0a6;background:#fff4eb}.select-blue{border-color:#cce1fb;background:#eef6ff}.field-icon{width:36px;height:36px;margin-left:10px;display:grid;place-items:center;border-radius:11px}.select-orange .field-icon{color:#ec731e;background:#ffe3ce}.select-blue .field-icon{color:#1267bc;background:#dceeff}.field-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.mobile-select select{width:100%;height:100%;padding:0 38px 0 12px;border:0;outline:0;appearance:none;background:transparent;color:#102a4c;font:700 1rem Inter,system-ui,sans-serif;cursor:pointer}.select-chevron{position:absolute;right:17px;width:9px;height:9px;border-right:2px solid #687386;border-bottom:2px solid #687386;transform:rotate(45deg) translateY(-3px);pointer-events:none}.mobile-report-form textarea{min-height:108px;resize:vertical;padding:14px 15px;border:1px solid #dce4ee;border-radius:16px;background:#fff;color:#102a4c;font:1rem Inter,system-ui,sans-serif;outline:none}.mobile-report-form textarea::placeholder{color:#9aa5b5}.mobile-report-form textarea:focus{border-color:#77ace5;box-shadow:0 0 0 3px rgba(7,82,184,.1)}
.report-location-card{display:flex;align-items:center;gap:11px;padding:13px;border-radius:17px;background:#eaf4ff}.location-icon{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:50%;background:#d4eaff;color:#0752b8}.location-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.coordinates{min-width:0;flex:1;display:grid;gap:4px;color:#607085;font-size:.72rem}.coordinates b{color:#102a4c;font-weight:800}.use-location{min-height:42px;padding:0 11px;border:1px solid #a8caed;border-radius:12px;background:#fff;color:#0752b8;font:800 .72rem Inter,system-ui,sans-serif;white-space:nowrap;cursor:pointer}.use-location svg{width:15px;height:15px;margin-right:4px;vertical-align:-3px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.use-location.loading{opacity:.65}
.photo-upload{min-height:82px;margin:0!important;padding:12px 14px;border:1.5px dashed #a9c9eb;border-radius:16px;background:#fbfdff;display:flex;align-items:center;gap:12px;cursor:pointer}.photo-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:12px;background:#eaf3ff;color:#0752b8}.photo-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.photo-upload strong,.photo-upload small{display:block}.photo-upload strong{color:#102a4c;font-size:.88rem}.photo-upload small{margin-top:4px;color:#8490a0;font-size:.75rem;font-weight:500}.photo-upload input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.submit-report-button{min-height:57px;margin-top:15px;border:0;border-radius:16px;background:#f47b20!important;color:#fff!important;display:flex;align-items:center;justify-content:center;gap:9px;font:800 1rem Inter,system-ui,sans-serif!important;box-shadow:0 10px 20px rgba(244,123,32,.25);cursor:pointer}.submit-report-button:hover{background:#e86d15!important}.submit-report-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:900px){.mobile-report-main{margin:0!important;max-width:100%!important;padding:0 16px 24px!important;background:#f5f7fa;overflow-x:hidden}.report-mobile-card{margin:20px auto 0;padding:22px 18px 22px;border-radius:24px;width:100%;max-width:100%;box-sizing:border-box;box-shadow:0 10px 28px rgba(17,42,76,.08)}.report-intro{min-height:132px;margin:-20px -18px 18px;padding:24px 18px 16px;border-radius:0 0 25px 25px}.report-title-row{max-width:235px}.report-intro h1{font-size:1.32rem}.report-intro p{font-size:.78rem}.report-road-art{width:48%;right:-10px}.mobile-report-form{gap:8px}.mobile-report-form>label{margin-top:8px}.report-location-card{gap:9px;padding:11px;grid-template-columns:44px minmax(0,1fr);align-items:start;min-width:0}.location-icon{width:40px;height:40px;flex-basis:40px}.coordinates{font-size:.67rem}.use-location{padding:0 9px;font-size:.66rem;min-width:0}.submit-report-button{margin-top:13px}}
@media(max-width:420px){.mobile-recent-report{align-items:flex-start;padding:12px}.mobile-recent-report>div{flex:1;flex-wrap:wrap;gap:4px 8px}.mobile-recent-report>div span{flex-basis:100%;white-space:normal;line-height:1.3}.mobile-recent-report .status-pill{min-width:70px}}
@media(max-width:360px){.report-title-row{max-width:200px}.report-road-art{opacity:.65}.use-location{font-size:0;width:42px;padding:0}.use-location svg{width:18px;margin:0}.report-location-card{gap:7px}}
@media(min-width:901px){.mobile-dashboard-main{padding-top:32px}}

.sg-header.mobile{display:flex;align-items:center;justify-content:space-between}
.sg-header-left{display:flex;align-items:center;gap:12px}
.sg-title{font-size:2.1rem;font-weight:900;letter-spacing:-.06em;color:#fff;text-transform:uppercase;text-shadow:0 3px 16px rgba(0,0,0,.24);padding:6px 14px;border-radius:16px;background:rgba(255,255,255,.14);backdrop-filter:blur(10px);box-shadow:0 16px 38px rgba(0,0,0,.16);}
.sg-header-right{display:flex;align-items:center;gap:14px;margin-left:auto}
.sg-notification-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;min-width:50px;min-height:50px;padding:0;border-radius:16px;background:rgba(255,255,255,.16);color:#fff;text-decoration:none;font-size:1.4rem;transition:transform .18s ease,background .18s ease}
.sg-notification-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.24)}
.sg-notification-btn .bell-icon{font-size:1.8rem;line-height:1}
.notification-count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#f47b20;color:#fff;font:700 11px/20px Inter,system-ui,sans-serif;text-align:center}
.status-notification-link{right:16px!important;left:auto!important}
.mobile-notification-link{right:18px!important;left:auto!important}

/* A clear, thumb-friendly location action for the report form. */
.report-location-card{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px 12px;padding:14px;background:linear-gradient(135deg,#eaf4ff,#f5faff);border:1px solid #d7eafe}.report-location-card .location-icon{grid-column:1;grid-row:1;align-self:center}.coordinates{grid-column:2;grid-row:1;gap:3px}.coordinates small{margin-bottom:2px;color:#6681a0;font-size:.68rem;font-weight:700;letter-spacing:.01em}.use-location{grid-column:1 / -1;grid-row:2;min-height:48px;padding:0 14px;border:0;border-radius:13px;background:#0752b8;color:#fff;font-size:.82rem;box-shadow:0 7px 14px rgba(7,82,184,.18);display:flex;align-items:center;justify-content:center;gap:7px;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.use-location:hover{background:#064796;box-shadow:0 10px 18px rgba(7,82,184,.24);transform:translateY(-1px)}.use-location:active{transform:scale(.98)}.use-location:focus-visible{outline:3px solid rgba(7,82,184,.28);outline-offset:3px}.use-location svg{width:18px;height:18px;margin:0;flex:0 0 18px}.use-location.loading{background:#3d7fc5;opacity:1;cursor:wait}.use-location.loading svg{animation:location-spin .8s linear infinite}.use-location.is-ready{background:#16845a}.use-location:disabled{pointer-events:none}@keyframes location-spin{to{transform:rotate(360deg)}}
@media(max-width:900px){.report-location-card{grid-template-columns:40px minmax(0,1fr);padding:12px}.coordinates{font-size:.71rem}.use-location{min-height:48px;font-size:.78rem}}
@media(max-width:360px){.use-location{width:auto;padding:0 12px;font-size:.76rem}.use-location svg{width:17px;margin:0}}

/* Report photo capture controls */
.photo-upload{cursor:default}.photo-upload-copy{min-width:0;flex:1}.photo-actions{display:flex;gap:7px;align-items:center}.camera-action,.gallery-action{min-height:38px;padding:0 10px;border-radius:10px;display:inline-flex!important;align-items:center;justify-content:center;gap:5px;font:800 .7rem Inter,system-ui,sans-serif!important;white-space:nowrap;cursor:pointer}.camera-action{background:#0752b8;color:#fff}.gallery-action{border:1px solid #b8d2ee;background:#fff;color:#0752b8}.camera-action svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.photo-upload input[type="file"]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.camera-action:hover{background:#064796}.gallery-action:hover{background:#eef6ff}
@media(max-width:460px){.photo-upload{display:grid;grid-template-columns:43px minmax(0,1fr);gap:8px 11px}.photo-icon{grid-column:1;grid-row:1}.photo-upload-copy{grid-column:2;grid-row:1}.photo-actions{grid-column:1 / -1;grid-row:2}.camera-action,.gallery-action{flex:1;min-height:42px;font-size:.75rem!important}}

/* Resident status notifications and mobile header. */
.status-notification-link{display:none}.mobile-notice-main{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}.status-notice-panel{max-width:640px;margin:30px auto;padding:24px;border-radius:26px;background:#fff;box-shadow:0 10px 28px rgba(17,42,76,.07)}.status-notice-heading{display:flex;align-items:center;gap:13px;padding-bottom:19px;border-bottom:1px solid #e8eef5}.status-notice-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:#eaf3ff;color:#0752b8}.status-notice-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.status-notice-heading h1{margin:0;color:#102a4c;font-size:1.3rem}.status-notice-heading p{margin:5px 0 0;color:#687386;font-size:.82rem;line-height:1.4}.status-notice-list{display:grid;gap:11px;margin-top:18px}.status-notice-item{display:flex;align-items:flex-start;gap:10px;padding:14px;border:1px solid #dceafa;border-radius:16px;background:#f8fbff}.status-notice-item--admin-verified{border-color:rgba(16,185,129,.2);background:linear-gradient(180deg,#f0fdf4,#ffffff)}.status-notice-item--admin-resolved{border-color:rgba(59,130,246,.2);background:linear-gradient(180deg,#eff6ff,#ffffff)}.status-notice-check{width:27px;height:27px;flex:0 0 27px;display:grid;place-items:center;border-radius:50%;background:#d9f3e7;color:#147449;font-weight:900}.status-notice-item p{margin:1px 0 6px;color:#203b5d;font-size:.88rem;line-height:1.45}.status-notice-item time{color:#7b8797;font-size:.72rem}.notice-status-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:#e0f2fe;color:#0369a1;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;margin-right:8px}.status-notice-item--admin-verified .notice-status-pill{background:#dcfce7;color:#166534}.status-notice-item--admin-resolved .notice-status-pill{background:#dbeafe;color:#1d4ed8}.status-notice-empty{padding:42px 18px 24px;text-align:center}.status-notice-empty>span{width:55px;height:55px;margin:0 auto 12px;display:grid;place-items:center;border-radius:50%;background:#eaf3ff;color:#0752b8;font-size:25px;font-weight:900}.status-notice-empty strong{display:block;color:#102a4c}.status-notice-empty p{max-width:270px;margin:8px auto 0;color:#687386;font-size:.84rem;line-height:1.45}
@media(max-width:900px){.mobile-app-header .mobile-notification-link,.mobile-user-page #sidebarToggle{display:none!important}.status-notification-link{position:absolute;right:16px;top:22px;width:42px;height:42px;display:grid;place-items:center;color:#fff;text-decoration:none}.status-notification-link svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.status-notification-link span{position:absolute;right:-4px;top:-3px;min-width:19px;height:19px;padding:1px 5px;border-radius:999px;background:#f47b20;color:#fff;font:800 10px/17px Inter,system-ui,sans-serif;text-align:center}.status-notification-link:active{transform:scale(.92)}.mobile-notice-main{margin:0!important;max-width:none!important;padding:16px 14px!important;background:#f5f7fa}.status-notice-panel{margin:0;padding:19px;border-radius:23px}.status-notice-heading{padding-bottom:16px}.message-list{gap:10px}.mobile-notice-main .message-card{border:0;border-radius:18px;padding:15px;box-shadow:0 7px 18px rgba(17,42,76,.06)}.mobile-notice-main .report-toolbar{margin:2px 2px 16px}.mobile-notice-main .report-toolbar h2{color:#102a4c;font-size:1.35rem}.mobile-notice-main .report-toolbar .muted{font-size:.82rem;line-height:1.4}.mobile-notice-main .empty-state{border-radius:18px;background:#fff}.mobile-notice-main .message-actions{margin-top:4px}.mobile-notice-main .reaction-icon{width:42px;height:42px}}

/* Complete resident profile experience. */
.profile-screen,.legal-main{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}.profile-identity-card{max-width:660px;margin:28px auto 0;padding:34px 24px 23px;border-radius:26px;background:linear-gradient(145deg,#0b5bc2,#07459d);color:#fff;text-align:center;box-shadow:0 13px 28px rgba(7,82,184,.2)}.profile-avatar-wrap{position:relative;width:94px;height:94px;margin:0 auto 11px}.profile-avatar-photo{width:86px;height:86px;border:4px solid rgba(255,255,255,.94);overflow:hidden;background:#f47b20;font-size:2.6rem}.profile-avatar-photo img{width:100%;height:100%;object-fit:cover}.profile-camera{position:absolute;right:0;bottom:0;width:34px;height:34px;display:grid;place-items:center;border:3px solid #fff;border-radius:50%;background:#fff;color:#0752b8;cursor:pointer}.profile-camera svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.profile-identity-card h1{margin:0;font-size:1.45rem}.profile-identity-card p{margin:5px 0 10px;color:#dceaff;font-size:.88rem}.resident-badge{display:inline-flex;padding:5px 12px;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:rgba(0,48,119,.2);font-size:.76rem;font-weight:800}.profile-content{max-width:660px;margin:0 auto;padding:23px 0}.profile-section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.profile-section-heading h2,.preferences-title{margin:0;color:#102a4c;font-size:1.18rem}.profile-section-heading button{border:0;background:none;color:#0752b8;font:800 .83rem Inter,system-ui,sans-serif;cursor:pointer}.profile-info-grid,.preferences-card,.legal-menu{overflow:hidden;border:1px solid #e0e9f3;border-radius:19px;background:#fff;box-shadow:0 6px 17px rgba(17,42,76,.045)}.profile-info-grid{display:grid;grid-template-columns:repeat(2,1fr)}.profile-info{min-height:88px;padding:14px 12px;display:flex;align-items:flex-start;gap:10px;border-bottom:1px solid #e8eef5}.profile-info:nth-child(odd){border-right:1px solid #e8eef5}.profile-info:nth-last-child(2):not(.full),.profile-info:nth-last-child(1):not(.full){border-bottom:0}.profile-info.full{grid-column:1/-1;border-right:0;border-bottom:0}.profile-info i,.preference-row i,.legal-menu i{width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;border-radius:50%;background:#edf5ff;color:#0752b8;font-style:normal;font-size:18px}.profile-info span{min-width:0}.profile-info small,.profile-info b{display:block}.profile-info small{margin:2px 0 5px;color:#66758a;font-size:.68rem;font-weight:700}.profile-info b{color:#172e4b;font-size:.79rem;line-height:1.35}.profile-edit-fields{margin-top:12px;padding:14px;border-radius:16px;background:#edf6ff}.profile-edit-fields label{display:block;margin-bottom:7px;color:#102a4c;font-size:.8rem;font-weight:800}.profile-edit-fields input{width:100%;padding:12px;border:1px solid #bcd7f3;border-radius:12px;background:#fff;color:#102a4c;font:1rem Inter,system-ui,sans-serif}.preferences-title{margin:25px 0 13px}.preference-row{min-height:64px;padding:11px 13px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #e8eef5}.preference-row:last-child{border-bottom:0}.preference-row>span{flex:1;color:#192f4c;font-size:.88rem;font-weight:800}.preference-row select{width:48%;min-height:42px;padding:0 32px 0 11px;border:1px solid #c9dbed;border-radius:11px;background:#fff;color:#263b57;font:700 .8rem Inter,system-ui,sans-serif}.legal-menu{margin-top:15px}.legal-menu a{min-height:58px;padding:11px 13px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #e8eef5;color:#192f4c;text-decoration:none;font:800 .86rem Inter,system-ui,sans-serif}.legal-menu a:last-child{border-bottom:0}.legal-menu span{flex:1}.legal-menu b{color:#6b7c90;font-size:1.65rem;font-weight:400}.profile-save{width:100%;min-height:52px;margin-top:15px;border:0;border-radius:15px;background:#0752b8;color:#fff;font:800 1rem Inter,system-ui,sans-serif;cursor:pointer}.profile-logout{width:min(660px,100%);min-height:54px;margin:0 auto 20px;border:1px solid #f3b8bc;border-radius:15px;background:#fff1f2;color:#c92735;display:flex;align-items:center;justify-content:center;gap:9px;font:800 1rem Inter,system-ui,sans-serif;cursor:pointer}.profile-logout span{font-size:22px}.logout-dialog{width:min(90vw,360px);border:0;border-radius:23px;padding:26px;text-align:center;box-shadow:0 20px 55px rgba(15,23,42,.28)}.logout-dialog::backdrop{background:rgba(15,35,64,.48)}.dialog-icon{width:50px;height:50px;margin:auto;display:grid;place-items:center;border-radius:50%;background:#fff0f1;color:#c92735;font-size:26px}.logout-dialog h2{margin:14px 0 7px;color:#102a4c;font-size:1.2rem}.logout-dialog p{margin:0;color:#687386;font-size:.87rem;line-height:1.45}.logout-dialog>div:last-child{display:flex;gap:10px;margin-top:22px}.logout-dialog button,.logout-dialog a{flex:1;min-height:43px;border-radius:12px;display:grid;place-items:center;font:800 .84rem Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer}.logout-dialog button{border:1px solid #d8e2ed;background:#fff;color:#42566e}.logout-dialog a{background:#c92735;color:#fff}.legal-card{max-width:650px;margin:28px auto;padding:28px;border-radius:26px;background:#fff;box-shadow:0 10px 25px rgba(17,42,76,.07)}.legal-back{display:inline-block;margin-bottom:21px;color:#0752b8;font-size:.85rem;font-weight:800;text-decoration:none}.legal-card h1{margin:0;color:#102a4c;font-size:1.45rem}.legal-subtitle{margin:8px 0 22px;color:#687386;font-size:.88rem}.legal-content section{padding:15px 0;border-top:1px solid #e8eef5}.legal-content h2{margin:0 0 6px;color:#17375c;font-size:.96rem}.legal-content p{margin:0;color:#607085;font-size:.84rem;line-height:1.52}.legal-agree{width:100%;min-height:52px;margin-top:20px;border:0;border-radius:15px;background:#0752b8;color:#fff;display:grid;place-items:center;font:800 .95rem Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer}
body[data-theme="dark"]{background:#101b2b!important;color:#e6edf6}body[data-theme="dark"] .mobile-profile-main,body[data-theme="dark"] .legal-main{background:#101b2b!important}body[data-theme="dark"] .profile-info-grid,body[data-theme="dark"] .preferences-card,body[data-theme="dark"] .legal-menu,body[data-theme="dark"] .legal-card{background:#17263a;border-color:#28415e}body[data-theme="dark"] .profile-info,body[data-theme="dark"] .preference-row,body[data-theme="dark"] .legal-menu a,body[data-theme="dark"] .legal-content section{border-color:#28415e}body[data-theme="dark"] .profile-info b,body[data-theme="dark"] .preference-row>span,body[data-theme="dark"] .legal-menu a,body[data-theme="dark"] .legal-card h1,body[data-theme="dark"] .legal-content h2{color:#edf5ff}body[data-theme="dark"] .preference-row select{background:#20334b;color:#fff;border-color:#3a5878}
/* Shared resident dark theme: dashboard, report, map, messages, updates, and profile. */
html[data-theme="dark"] body.mobile-user-page{background:#101b2b!important;color:#e6edf6}html[data-theme="dark"] .mobile-dashboard-main,html[data-theme="dark"] .mobile-profile-main,html[data-theme="dark"] .mobile-report-main,html[data-theme="dark"] .mobile-map-page,html[data-theme="dark"] .mobile-notice-main,html[data-theme="dark"] .legal-main{background:#101b2b!important}html[data-theme="dark"] .mobile-hero-card,html[data-theme="dark"] .mobile-section-card,html[data-theme="dark"] .mobile-status-card,html[data-theme="dark"] .report-mobile-card,html[data-theme="dark"] .mobile-profile-form,html[data-theme="dark"] .message-card,html[data-theme="dark"] .status-notice-panel,html[data-theme="dark"] .empty-state,html[data-theme="dark"] .map-card,html[data-theme="dark"] .map-controls{background:#17263a!important;border-color:#29435f!important;box-shadow:0 9px 25px rgba(0,0,0,.2)}html[data-theme="dark"] .mobile-section-card h2,html[data-theme="dark"] .mobile-hero-card h1,html[data-theme="dark"] .mobile-status-card,html[data-theme="dark"] .mobile-summary-grid strong,html[data-theme="dark"] .mobile-empty-reports strong,html[data-theme="dark"] .mobile-recent-list a,html[data-theme="dark"] .report-intro h1,html[data-theme="dark"] .mobile-report-form>label,html[data-theme="dark"] .coordinates b,html[data-theme="dark"] .message-card p,html[data-theme="dark"] .status-notice-heading h1{color:#edf5ff!important}html[data-theme="dark"] .mobile-hero-card p,html[data-theme="dark"] .mobile-status-card>span:not(.status-symbol),html[data-theme="dark"] .mobile-status-card small,html[data-theme="dark"] .mobile-summary-grid span,html[data-theme="dark"] .mobile-summary-grid small,html[data-theme="dark"] .mobile-empty-reports p,html[data-theme="dark"] .mobile-recent-list span,html[data-theme="dark"] .report-intro p,html[data-theme="dark"] .coordinates,html[data-theme="dark"] .message-card small,html[data-theme="dark"] .muted{color:#aabbd0!important}html[data-theme="dark"] .mobile-bottom-nav{background:#17263a;border-color:#29435f}html[data-theme="dark"] .mobile-bottom-nav a{color:#aab5c4}html[data-theme="dark"] .mobile-bottom-nav a.active{background:#203d5d;color:#9ec9ff}html[data-theme="dark"] .mobile-action,html[data-theme="dark"] .mobile-recent-list a{background:#20334b!important}html[data-theme="dark"] .mobile-select select,html[data-theme="dark"] .mobile-report-form textarea,html[data-theme="dark"] .use-location,html[data-theme="dark"] .photo-upload{color:#edf5ff!important}html[data-theme="dark"] .select-orange{background:#3a2a20;border-color:#6d452a}html[data-theme="dark"] .select-blue,html[data-theme="dark"] .report-location-card{background:#1b3655;border-color:#315b85}html[data-theme="dark"] .mobile-report-form textarea,html[data-theme="dark"] .photo-upload{background:#17263a;border-color:#3a5878}html[data-theme="dark"] .mobile-map-intro,html[data-theme="dark"] .mobile-map-legend{background:#17263a!important;color:#edf5ff!important}html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{color-scheme:dark}
@media(max-width:900px){.profile-screen,.legal-main{margin:0!important;max-width:none!important;padding:0 14px 18px!important;background:#f5f7fa}.profile-identity-card{margin:0 -14px;padding:29px 18px 22px;border-radius:0 0 28px 28px}.profile-content{padding:21px 0 16px}.profile-info{min-height:85px;padding:12px 10px}.profile-info b{font-size:.76rem}.profile-info i{width:32px;height:32px;flex-basis:32px}.profile-logout{margin-bottom:6px}.legal-card{margin:0 -14px;padding:22px 18px;border-radius:0 0 25px 25px}.mobile-user-page:has(.profile-screen) #sidebarToggle{display:block!important;background:transparent;left:16px;top:24px}.mobile-user-page:has(.profile-screen) .status-notification-link{right:16px}}

/* Mobile navigation: icon-only bottom bar with simple Unicode icons */
@media(max-width:900px){
  .mobile-user-page .admin-sidebar.user-sidebar{display:block;transform:translateX(-100%);top:0;bottom:0;width:min(82vw,290px);padding-top:96px;background:linear-gradient(180deg,#0a66c2,#074a92);z-index:1400;animation:slideInLeft .3s ease-out}
  .mobile-user-page .admin-sidebar.user-sidebar.open{transform:translateX(0)}
  .mobile-bottom-nav a{padding:6px 2px;gap:2px;text-align:center;border-radius:14px;font-size:0}
  .mobile-bottom-nav a span:last-child{display:none}
  .mobile-nav-icon{width:32px;height:30px;display:grid;place-items:center;font-size:26px;border-radius:12px;transition:all .2s ease;background:rgba(10,102,194,.04)}
  .mobile-nav-icon::before{font-size:1.2em;display:block}
  .mobile-bottom-nav a:nth-child(1) .mobile-nav-icon::before{content:'⌂'}
  .mobile-bottom-nav a:nth-child(2) .mobile-nav-icon::before{content:'+'}
  .mobile-bottom-nav a:nth-child(3) .mobile-nav-icon::before{content:'◇'}
  .mobile-bottom-nav a:nth-child(4) .mobile-nav-icon::before{content:'⚕'}
  .mobile-bottom-nav a:nth-child(5) .mobile-nav-icon::before{content:'●'}
  .mobile-bottom-nav a:nth-child(6) .mobile-nav-icon::before{content:'👤'}
  .mobile-bottom-nav a.active .mobile-nav-icon{background:#eaf3ff;box-shadow:0 3px 12px rgba(10,102,194,.18)}

.streetguard-nearby-warning{position:fixed;left:16px;right:16px;bottom:92px;z-index:1400;display:flex;align-items:flex-start;gap:10px;padding:13px 14px;border:1px solid #fdba74;border-radius:14px;background:#fff7ed;color:#431407;box-shadow:0 14px 30px rgba(194,65,12,.2);font-size:14px;font-weight:700}
.streetguard-nearby-warning strong{display:block;color:#c2410c;margin-bottom:3px}
.streetguard-nearby-warning p{margin:0;line-height:1.4}
.streetguard-nearby-warning button{margin-left:auto;border:0;background:transparent;color:#9a3412;font-size:20px;line-height:1;cursor:pointer}
.streetguard-nearby-warning .warning-icon{flex:0 0 28px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#f97316;color:#fff}
.profile-save-feedback{margin:0 0 14px;padding:10px 12px;border-radius:10px;font-size:.84rem;font-weight:700}.profile-save-feedback.success{background:#dcfce7;color:#166534}.profile-save-feedback.error{background:#fee2e2;color:#991b1b}
body.user-page{padding-bottom:92px!important}body.user-page .mobile-bottom-nav{display:flex!important;position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:1300!important;visibility:visible!important;opacity:1!important;transform:none!important}
  .mobile-nav-icon em{position:absolute;top:-2px;right:2px;font-size:10px;line-height:14px;padding:2px 4px;border-radius:999px;background:#ff8a00;color:#fff;font-weight:700;animation:pulseGlow .5s ease-out}
  .mobile-notification-link{font-size:0;width:44px;height:44px;display:grid;place-items:center;border-radius:12px}
  .mobile-notification-link::before{content:'🔔';font-size:28px;line-height:1}
  .mobile-notification-link[hidden]{display:none}
  .mobile-notification-link span{font-size:12px}
}

#saveProfileDialog #confirmProfileSave{border:0;background:#0752b8;color:#fff}
#logoutDialog #confirmLogout{border:0;background:#c92735;color:#fff}

#logoutDialog[open]{position:fixed;top:50%;left:50%;width:min(90vw,360px);max-height:calc(100dvh - 32px);margin:0;transform:translate(-50%,-50%);overflow:auto}

/* Final user navigation override: the bar remains mounted and fixed across route changes. */
body.user-page .mobile-bottom-nav{display:flex!important;position:fixed!important;left:0!important;right:0!important;bottom:0!important;height:78px!important;z-index:1300!important;visibility:visible!important;opacity:1!important;transform:none!important;pointer-events:auto!important}
body.user-page .mobile-bottom-nav a{display:flex!important;visibility:visible!important;opacity:1!important}
body.user-page .mobile-bottom-nav{box-sizing:border-box!important;align-items:center!important;justify-content:space-around!important;gap:0!important;padding:8px 6px calc(8px + env(safe-area-inset-bottom))!important;background:#fff!important;border-top:3px solid #ff7a18!important;box-shadow:0 -10px 28px rgba(15,23,42,.1)!important;isolation:isolate!important}
body.user-page .mobile-bottom-nav a{flex:1 1 0!important;min-width:0!important;min-height:52px!important;align-items:center!important;justify-content:center!important;text-decoration:none!important;touch-action:manipulation!important}
body.user-page .mobile-bottom-nav .mobile-nav-icon{flex:0 0 auto!important}

/* Unified resident mobile navigation icons and touch states. */
@media(max-width:900px){
	body.user-page .mobile-bottom-nav{height:calc(78px + env(safe-area-inset-bottom))!important;padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important;border-top:2px solid #ff7a18!important;box-shadow:0 -8px 24px rgba(10,102,194,.14)!important}
	body.user-page .mobile-bottom-nav a{gap:0!important;border:1px solid transparent!important;font-size:0!important;transition:transform .18s ease,background .18s ease,box-shadow .18s ease,color .18s ease!important}
	body.user-page .mobile-bottom-nav a:hover{transform:translateY(-2px)!important;background:#f2f7fd!important}
	body.user-page .mobile-bottom-nav a:focus-visible{outline:3px solid rgba(10,102,194,.28)!important;outline-offset:-3px!important}
	body.user-page .mobile-bottom-nav a.active{transform:translateY(-3px)!important;background:#eaf3ff!important;border-color:#b9d7f6!important;box-shadow:0 5px 14px rgba(10,102,194,.16)!important}
	body.user-page .mobile-bottom-nav .mobile-nav-icon{width:38px!important;height:38px!important;border-radius:13px!important;background-color:transparent!important;background-image:none!important;position:relative!important;color:#72839a!important}
	body.user-page .mobile-bottom-nav .mobile-nav-icon::before{content:''!important;display:block!important;width:23px!important;height:23px!important;background-color:currentColor!important;mask-repeat:no-repeat!important;mask-position:center!important;mask-size:contain!important;-webkit-mask-repeat:no-repeat!important;-webkit-mask-position:center!important;-webkit-mask-size:contain!important}
	body.user-page .mobile-bottom-nav a.active .mobile-nav-icon{color:#0a66c2!important;background:#dceeff!important}
	body.user-page .mobile-bottom-nav a:nth-child(1) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='m3 10 9-7 9 7v10a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='m3 10 9-7 9 7v10a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(2) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M12 5v14M5 12h14'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M12 5v14M5 12h14'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(3) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 6h18M3 12h18M3 18h18'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M3 6h18M3 12h18M3 18h18'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(4) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3v18M3 12h18M5.6 5.6l12.8 12.8M18.4 5.6 5.6 18.4'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3v18M3 12h18M5.6 5.6l12.8 12.8M18.4 5.6 5.6 18.4'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(5) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 5h16v11H7l-3 3zM8 9h8M8 12h5'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 5h16v11H7l-3 3zM8 9h8M8 12h5'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(6) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20 21a8 8 0 0 0-16 0M12 13a4 4 0 1 0 0-8 4 4 0 0 0 0 8z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20 21a8 8 0 0 0-16 0M12 13a4 4 0 1 0 0-8 4 4 0 0 0 0 8z'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(3) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 21s7-6.1 7-12a7 7 0 1 0-14 0c0 5.9 7 12 7 12Z'/%3E%3Ccircle cx='12' cy='9' r='2.2' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 21s7-6.1 7-12a7 7 0 1 0-14 0c0 5.9 7 12 7 12Z'/%3E%3Ccircle cx='12' cy='9' r='2.2' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(5) .mobile-nav-icon::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20 11.5a7.5 7.5 0 0 1-8 7.5 8.5 8.5 0 0 1-4-.9L4 19l.9-3.8a7.5 7.5 0 1 1 15.1-3.7Z'/%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M8.5 11.5h.01M12 11.5h.01M15.5 11.5h.01'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20 11.5a7.5 7.5 0 0 1-8 7.5 8.5 8.5 0 0 1-4-.9L4 19l.9-3.8a7.5 7.5 0 1 1 15.1-3.7Z'/%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M8.5 11.5h.01M12 11.5h.01M15.5 11.5h.01'/%3E%3C/svg%3E")}
	body.user-page .mobile-bottom-nav a:nth-child(4) .mobile-nav-icon::before{content:'\2695'!important;width:auto!important;height:auto!important;background:transparent!important;mask:none!important;-webkit-mask:none!important;font-size:26px!important;line-height:1!important}
}

/* Keep resident pages within the viewport on mobile without changing their design. */
@media(max-width:900px){
	body.user-page { overflow-x: hidden; }
	body.user-page .user-main,
	body.user-page .mobile-dashboard-main,
	body.user-page .report-mobile-card,
	body.user-page .profile-content,
	body.user-page .medical-request-shell { max-width: 100%; box-sizing: border-box; }
	body.user-page img,
	body.user-page svg,
	body.user-page video { max-width: 100%; height: auto; }
	body.user-page table { display: block; max-width: 100%; overflow-x: auto; }
}

/* Unified admin sidebar contract for modern and legacy markup. */
body.admin-page .admin-sidebar,
body.admin-page .admin-sidebar.admin-sidebar-modern,
body.admin-page .admin-sidebar.legacy-sidebar{position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:230px!important;height:100vh!important;min-height:100vh!important;max-height:100vh!important;box-sizing:border-box!important;padding:16px 12px 14px!important;display:flex!important;flex-direction:column!important;overflow-y:auto!important;overflow-x:hidden!important;background:linear-gradient(180deg,#072b38 0%,#084e4a 100%)!important;border:0!important;border-radius:0!important;color:#fff!important;z-index:1100!important}
body.admin-page .admin-sidebar .brand{display:flex!important;align-items:center!important;gap:8px!important;min-height:44px!important;margin:0!important;padding:0 6px 18px!important;color:#fff!important;font-size:19px!important;font-weight:800!important;letter-spacing:-.03em!important;white-space:nowrap!important}
body.admin-page .admin-sidebar nav,body.admin-page .admin-sidebar .admin-nav{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;gap:8px!important;min-height:0!important;margin:0!important;padding:0!important;overflow-y:auto!important;overflow-x:hidden!important}
body.admin-page .admin-sidebar nav>a,body.admin-page .admin-sidebar nav>.nav-group>.group-toggle,body.admin-page .admin-sidebar .admin-nav>a{display:flex!important;align-items:center!important;gap:10px!important;min-height:42px!important;width:100%!important;box-sizing:border-box!important;margin:0!important;padding:10px 12px!important;border:1px solid transparent!important;border-radius:10px!important;background:transparent!important;color:rgba(255,255,255,.96)!important;font:700 14px/1.2 Inter,sans-serif!important;text-decoration:none!important;white-space:normal!important;text-align:left!important}
body.admin-page .admin-sidebar nav>a:hover,body.admin-page .admin-sidebar nav>a.active,body.admin-page .admin-sidebar nav>.nav-group>.group-toggle:hover,body.admin-page .admin-sidebar .admin-nav>a:hover,body.admin-page .admin-sidebar .admin-nav>a.active{background:rgba(21,91,215,.28)!important;border-color:rgba(147,197,253,.32)!important;color:#fff!important;transform:none!important;box-shadow:inset 0 0 18px rgba(21,91,215,.12)!important}
body.admin-page .admin-sidebar .icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:24px!important;height:24px!important;min-width:24px!important;border:1px solid rgba(191,219,254,.2)!important;border-radius:8px!important;background:rgba(255,255,255,.08)!important;color:#fff!important;flex-shrink:0!important}
body.admin-page .admin-sidebar .select-menu{width:100%!important;box-sizing:border-box!important;margin:4px 0 7px!important;padding:10px 9px 9px!important;border:1px solid rgba(147,197,253,.32)!important;border-radius:12px!important;background:rgba(255,255,255,.06)!important}
body.admin-page .admin-sidebar .select-menu label{display:flex!important;align-items:center!important;gap:8px!important;min-height:25px!important;margin:0 0 8px!important;padding:0 2px!important;color:#fff!important;font:800 11px/1.15 Inter,sans-serif!important;letter-spacing:.08em!important;text-transform:uppercase!important}
body.admin-page .admin-sidebar .select-menu select{width:100%!important;min-height:42px!important;box-sizing:border-box!important;padding:9px 10px!important;border:0!important;border-radius:10px!important;background:#fff!important;color:#17345f!important;font:700 13px/1.2 Inter,sans-serif!important}
body.admin-page .admin-sidebar .logout-link{margin-top:auto!important;border-top:1px solid rgba(191,219,254,.2)!important;border-radius:0!important;padding-top:14px!important}
body.admin-page .admin-sidebar.collapsed{width:76px!important}
body.admin-page .admin-sidebar.collapsed .brand span,body.admin-page .admin-sidebar.collapsed .select-menu,body.admin-page .admin-sidebar.collapsed nav>a span:not(.icon),body.admin-page .admin-sidebar.collapsed nav>.nav-group,body.admin-page .admin-sidebar.collapsed .logout-link span:not(.icon){display:none!important}
body.admin-page .admin-sidebar.collapsed nav>a,body.admin-page .admin-sidebar.collapsed .logout-link{justify-content:center!important;padding-inline:8px!important}

/* Resident interface: the shared top bar carries the report-status bell. */
body.user-page > .sg-header.mobile {
	display: flex !important;
	position: sticky;
	top: 0;
	z-index: 1250;
	min-height: 72px;
	margin: 0 0 18px;
	padding: 12px 22px;
	background: #0752b8;
	border-bottom: 3px solid #0752b8;
	box-shadow: 0 8px 24px rgba(7,74,146,.2);
}

/* Keep alert and notification headers on the same solid blue treatment. */
body.user-page .sg-header.mobile { background: #0752b8 !important; border-bottom-color: #0752b8 !important; }

body.user-page .messages-list {
	padding: 4px 0;
}

body.user-page .messages-list .msg-card {
	border-color: #d7e5f4;
	box-shadow: 0 8px 20px rgba(15,64,120,.08);
}

body.user-page .messages-list .msg-card .msg-text {
	color: #102a4c;
	font-size: .94rem;
	line-height: 1.5;
}

body.user-page .user-main .report-toolbar {
	align-items: flex-start;
}

body.user-page .user-main .report-toolbar > div {
	min-width: 0;
}

body.user-page .mark-messages-read {
	width: auto !important;
	min-width: 104px;
	padding: 8px 11px !important;
	border-radius: 9px !important;
	font-size: .72rem !important;
	line-height: 1.2;
}

body.user-page .admin-messages-main .report-toolbar {
	flex-direction: column;
	gap: 9px;
}

body.user-page .admin-messages-main .mark-messages-read {
	align-self: center;
}

body.user-page .status-notifications-main {
	width: min(100%, 760px);
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 24px;
	background: transparent !important;
	box-shadow: none;
}

body.user-page .status-notifications-main .report-toolbar {
	gap: 14px;
	margin-bottom: 20px;
}

body.user-page .status-notifications-main .report-toolbar h2 {
	display: block;
	padding: 0;
	background: transparent;
	color: #fff !important;
	font-size: 1.2rem;
}

body.user-page .status-notifications-main .report-toolbar .muted {
	max-width: 360px;
	margin: 8px auto 0;
	color: #dceaff;
	font-size: .84rem;
	font-weight: 600;
	letter-spacing: .01em;
	line-height: 1.45;
}

body.user-page .status-notifications-main .report-toolbar > div {
	width: 100%;
	text-align: center;
}

body.user-page .status-notifications-main .report-toolbar h2 {
	margin-bottom: 7px;
}

body.user-page .status-notifications-main .mark-messages-read {
	margin-top: 2px;
}

body.user-page .status-notifications-main .messages-list {
	width: 100%;
	padding: 4px 0;
	gap: 12px;
}

body.user-page .status-notifications-main .msg-card {
	width: 100%;
	min-height: 86px;
	padding: 14px 12px;
	border: 1px solid #d7e5f4;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 8px 20px rgba(15,64,120,.08);
}

body.user-page .status-notifications-main .mark-messages-read {
	background: #0752b8 !important;
	color: #fff !important;
}

body.user-page .status-notifications-main .mark-messages-read,
body.user-page .status-notifications-main .reaction-btn {
	background: #f47b20 !important;
	box-shadow: 0 8px 16px rgba(244,123,32,.2);
}

body.user-page .status-notifications-main .mark-messages-read:hover,
body.user-page .status-notifications-main .reaction-btn:hover {
	background: #df6818 !important;
}

body.user-page .status-notifications-main .notification-section {
	width: 100%;
}

body.user-page .messages-list .heart-read-btn {
	width: 36px;
	height: 36px;
	font-size: 1.1rem;
}

body.user-page .admin-messages-main .msg-card {
	border-color: #d7e5f4;
	box-shadow: 0 8px 20px rgba(15,64,120,.08);
}

body.user-page > .sg-header.mobile .sg-title {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 0;
	background: transparent;
	box-shadow: none;
	font-size: 1.12rem;
	letter-spacing: .02em;
	text-transform: none;
	text-shadow: none;
}

body.user-page > .sg-header.mobile .sg-brand-mark {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border: 2px solid rgba(255,255,255,.82);
	border-radius: 11px;
	background: rgba(255,255,255,.14);
	color: #fff;
	font-size: .72rem;
	font-weight: 900;
	letter-spacing: .04em;
}

body.user-page > .sg-header.mobile .sg-notification-btn {
	width: 46px;
	height: 46px;
	border: 1px solid rgba(255,255,255,.3);
	border-radius: 13px;
	background: rgba(255,255,255,.14);
}

body.user-page > .sg-header.mobile .sg-notification-btn:focus-visible {
	outline: 3px solid rgba(255,255,255,.8);
	outline-offset: 2px;
}

body.user-page > .sg-header.mobile .notification-count {
	top: -5px;
	right: -5px;
}

.form-back-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 14px 0 0 4px;
	padding: 11px 14px;
	border: 1px solid #cfe0f2;
	border-radius: 12px;
	background: #fff;
	color: #0752b8;
	font: 800 .82rem/1 Inter,sans-serif;
	text-decoration: none;
	box-shadow: 0 7px 16px rgba(17,42,76,.06);
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.form-back-button:hover {
	background: #eef6ff;
	box-shadow: 0 10px 20px rgba(17,42,76,.1);
	transform: translateY(-1px);
}

.profile-info-grid { border-radius: 19px 19px 0 0; }
.profile-edit-fields { margin-top: -1px; padding: 18px; border: 1px solid #d7e5f4; border-top: 0; border-radius: 0 0 19px 19px; background: #fff; }
.profile-edit-fields label { display: block; margin: 10px 0 6px; color: #365474; font-size: .8rem; font-weight: 800; }
.profile-edit-fields input,
.profile-edit-fields textarea,
.profile-edit-fields select { width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1px solid #cfe0f2; border-radius: 10px; background: #f8fbff; color: #102a4c; font: 600 .9rem Inter,system-ui,sans-serif; }
.profile-edit-fields input:focus,
.profile-edit-fields textarea:focus,
.profile-edit-fields select:focus { outline: 3px solid rgba(24,119,242,.14); border-color: #1877f2; }
.profile-save { margin-top: 16px; }

@media(max-width:900px){
	.form-back-button { margin: 14px 0 6px; }
	.profile-section-heading { align-items: flex-start; }
	.profile-heading-actions { flex-direction: column; align-items: flex-end; gap: 5px; }
}

@media(max-width:900px){
	body.user-page > .sg-header.mobile { margin: 0; padding: 12px 16px; }
	body.user-page > .sg-header.mobile .mobile-menu-toggle {
		display: grid !important;
		place-items: center;
		width: 38px;
		height: 38px;
		padding: 0;
		border: 0;
		border-radius: 10px;
		background: rgba(255,255,255,.14);
		color: #fff;
		font-size: 22px;
		line-height: 1;
		cursor: pointer;
	}
}

body.user-page {
  overflow-x: hidden;
  padding-bottom: calc(92px + env(safe-area-inset-bottom)) !important;
}

body.user-page .user-main,
body.user-page .mobile-dashboard-main,
body.user-page .mobile-profile-main,
body.user-page .mobile-notice-main {
  min-width: 0;
}

body.user-page .message-card,
body.user-page .msg-card,
body.user-page .mobile-section-card,
body.user-page .preferences-card,
body.user-page .profile-info-grid {
  max-width: 100%;
  overflow-wrap: anywhere;
}

@media (max-width: 900px) {
  body.user-page .admin-main.user-main {
    padding-top: 16px !important;
    box-sizing: border-box;
  }

  body.user-page .mobile-dashboard-main,
  body.user-page .mobile-profile-main {
    padding-top: 0 !important;
  }
}

/* Site-wide layout fit: preserve design while preventing page clipping. */
html, body { max-width: 100%; overflow-x: hidden; }
body > *, body .user-layout, body .mobile-dashboard-root { min-width: 0; max-width: 100%; }
body .user-main, body .mobile-dashboard-main, body .report-mobile-card, body .profile-content, body .medical-request-shell { box-sizing: border-box; }
body .mobile-section-card, body .mobile-status-card, body .msg-card, body .profile-info-grid, body .preferences-card, body .legal-menu { min-width: 0; max-width: 100%; }

@media(max-width:1100px){
	body .mobile-actions-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	body .mobile-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 0; }
}

@media(max-width:600px){
	body .mobile-actions-grid,
	body .mobile-status-grid { grid-template-columns: 1fr; }
	body .mobile-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body .report-toolbar { min-width: 0; flex-wrap: wrap; }
	body input, body select, body textarea, body button { max-width: 100%; }
}

/* Final resident canvas: keep every user page on the blue app background. */
body.user-page {
	background: linear-gradient(145deg, #0b2c69 0%, #0752b8 52%, #061d47 100%) !important;
	min-height: 100vh;
}

body.user-page .admin-main.user-main,
body.user-page .mobile-dashboard-root {
	background: transparent !important;
}

/* Center resident forms, profile content, and alert panels. */
body.user-page .user-main {
	margin-left: auto !important;
	margin-right: auto !important;
}

body.user-page .report-mobile-card,
body.user-page .medical-form-card,
body.user-page .profile-identity-card,
body.user-page .profile-content,
body.user-page .status-notice-panel,
body.user-page .messages-list,
body.user-page .notification-section {
	width: min(100%, 760px);
	margin-left: auto;
	margin-right: auto;
}

body.user-page .medical-request-shell {
	width: min(100%, 980px);
	margin-left: auto;
	margin-right: auto;
}

body.user-page .profile-content {
	margin-top: 16px;
}

body.user-page .profile-content .profile-section-heading {
	margin-bottom: 14px;
}

body.user-page .profile-content .profile-info {
	padding-top: 16px;
	padding-bottom: 16px;
}

body.user-page .mobile-profile-main {
	min-height: calc(100vh - 90px);
	padding-bottom: 120px !important;
}

body.user-page .profile-logout {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: min(560px, calc(100% - 28px)) !important;
	min-height: 52px;
	margin: 18px auto 112px !important;
	position: relative;
	z-index: 2;
	background: #c92735 !important;
	color: #fff !important;
	box-shadow: 0 8px 18px rgba(201,39,53,.22);
	text-decoration: none;
	cursor: pointer;
}

body.user-page .profile-logout:hover { background: #ad202d !important; }

body.user-page .profile-content .profile-section-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	white-space: nowrap;
}

body.user-page .profile-content .profile-section-heading h2 {
	flex: 1 1 auto;
	min-width: 0;
	white-space: nowrap;
}

body.user-page .profile-content #editProfile {
	flex: 0 0 auto;
	width: auto;
	min-width: 128px;
	max-width: 150px;
	padding: 9px 12px;
	border-radius: 10px;
	background: #eaf3ff;
	color: #0752b8;
	font-size: .76rem;
	line-height: 1.2;
	white-space: nowrap;
}

body.user-page .profile-content #editProfile:hover {
	background: #dceeff;
}

@media(max-width:900px){
	body.user-page .status-notifications-main { padding: 16px 14px 20px; }
	body.user-page .admin-main.user-main,
	body.user-page .mobile-dashboard-main,
	body.user-page .mobile-notice-main,
	body.user-page .mobile-profile-main,
	body.user-page .mobile-report-main {
		background: transparent !important;
	}
	body.user-page .user-main {
		padding-left: 14px;
		padding-right: 14px;
	}
	body.user-page .report-mobile-card,
	body.user-page .medical-request-shell,
	body.user-page .medical-form-card,
	body.user-page .profile-identity-card,
	body.user-page .profile-content,
	body.user-page .status-notice-panel,
	body.user-page .messages-list,
	body.user-page .notification-section { width: 100%; }
	body.user-page .profile-content { margin-top: 12px; }
	body.user-page .profile-content .profile-section-heading { gap: 8px; }
	body.user-page .profile-content .profile-section-heading h2 { font-size: .95rem; }
	body.user-page .profile-content #editProfile { min-width: 118px; max-width: 132px; padding: 8px 9px; font-size: .68rem; }
}