/* Service Center (AI Municipal Hub v4.9.0) — 2026-10-04 23:30 — resident Service Center component styles (scoped under .ssc-app)
   All interactive states declare background+color pairs, .ssc-app-scoped
   to defeat theme/Elementor-kit global hover styles (contrast hardening). */
.ssc-app{
  --ssc-navy:#1b365d;
  --ssc-navy-2:#12315e;
  --ssc-red:#C8102E;         /* decorative only (icons/borders) — NOT for text or button bg */
  --ssc-red-btn:#A50D25;     /* AAA on #fff 7.83:1 — primary button background */
  --ssc-red-btn-dk:#8a0b1f;  /* AAA on #fff 9.78:1 — primary hover/active */
  --ssc-red-ink:#A50D25;     /* AAA text accent on #fff 7.83:1 */
  --ssc-red-dk:#A50D25;
  --ssc-ink:#1b2233;
  --ssc-muted:#44505f; /* v2.4.0: AAA 8.21:1 on #fff, 7.65:1 on soft (was #5a6675, AA only) */
  --ssc-border:#d7dce4;
  --ssc-soft:#f5f7fa;
  --ssc-card:#ffffff;
  --ssc-ok:#2ECC71;
  --ssc-tint:#e7ecf5;   /* v2.27.0: hover wash — derived from primary in inline theme CSS */
  --ssc-tint-2:#dde5f1; /* v2.27.0: pressed wash */
  --ssc-radius:.75rem;
  --ssc-ease:cubic-bezier(.22,.61,.36,1);

  box-sizing:border-box;
  max-width:72rem;
  margin:0 auto;
  color:var(--ssc-ink);
  font-family:inherit;
}
.ssc-app *{box-sizing:border-box}
.ssc-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.ssc-app-head{text-align:center;margin-bottom:1.5rem}
.ssc-app-title{margin:0;color:var(--ssc-navy);font-size:clamp(1.6rem,3.4vw,2.25rem);font-weight:800;line-height:1.1}
.ssc-app-intro{margin:.5rem auto 0;max-width:44rem;color:var(--ssc-muted);font-size:1.05rem}
.ssc-app-help{margin:.6rem auto 0;font-size:.95rem}
.ssc-app .ssc-app-help a,.ssc-app .ssc-app-help a:visited{color:var(--ssc-navy);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.ssc-app .ssc-app-help a:hover{color:var(--ssc-red-ink)}

/* ---------------- Tablist ---------------- */
.ssc-tablist{
  /* v2.27.0: flex, never wraps — 4 or 5 tabs always share one row */
  display:flex;
  flex-wrap:nowrap;
  gap:.5rem;
  background:var(--ssc-soft);
  padding:.5rem;
  border:1px solid var(--ssc-border);
  border-radius:var(--ssc-radius);
}
.ssc-tab{
  flex:1 1 0;min-width:0;justify-content:center;
  display:flex;align-items:center;justify-content:center;gap:.55rem;
  min-height:44px;padding:.85rem .75rem;
  background:transparent;color:var(--ssc-navy);
  border:1px solid transparent;border-radius:.55rem;
  font-weight:700;font-size:.98rem;text-decoration:none;cursor:pointer;
  transition:background-color .18s var(--ssc-ease),color .18s var(--ssc-ease),box-shadow .18s var(--ssc-ease);
}
/* v2.4.0: every state scoped under .ssc-app with BOTH background and color declared,
   so theme/Elementor-kit global button/link hovers (e.g. pink) can never bleed through. */
.ssc-app .ssc-tab:link,.ssc-app .ssc-tab:visited{background:transparent;color:var(--ssc-navy)}
.ssc-app .ssc-tab:hover{background:var(--ssc-tint);color:var(--ssc-navy-2)}
.ssc-app .ssc-tab:active{background:var(--ssc-tint-2);color:var(--ssc-navy-2)}
.ssc-app .ssc-tab.is-active,.ssc-app .ssc-tab.is-active:link,.ssc-app .ssc-tab.is-active:visited{background:var(--ssc-navy);color:#ffffff;box-shadow:0 8px 20px -12px rgba(27,54,93,.8);box-shadow:0 8px 20px -12px color-mix(in srgb,var(--ssc-navy) 80%,transparent)}
.ssc-app .ssc-tab.is-active:hover,.ssc-app .ssc-tab.is-active:active{background:var(--ssc-navy);color:#ffffff}
.ssc-app .ssc-tab:focus-visible{background:var(--ssc-tint);color:var(--ssc-navy-2);outline:3px solid var(--ssc-red);outline-offset:2px}
.ssc-app .ssc-tab.is-active:focus-visible{background:var(--ssc-navy);color:#ffffff}
.ssc-tab .ssc-svg{width:20px;height:20px;flex:0 0 auto}
.ssc-tab-label{white-space:nowrap}

/* ---------------- Shared panel ---------------- */
.ssc-panel{
  margin-top:1rem;
  background:var(--ssc-card);
  border:1px solid var(--ssc-border);
  border-radius:var(--ssc-radius);
  padding:1.75rem;
  min-height:18rem;
}
.ssc-panel:focus-visible{outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-view-inner{display:flex;flex-direction:column;gap:1rem;animation:ssc-fade .28s var(--ssc-ease)}
@keyframes ssc-fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ssc-view-title{margin:0;color:var(--ssc-navy);font-size:1.4rem;font-weight:800;line-height:1.15}
.ssc-view-title:focus{outline:none}
.ssc-lead{margin:0;color:var(--ssc-muted);font-size:1.02rem;line-height:1.55}

/* Breadcrumbs + back */
.ssc-crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:.25rem;font-size:.86rem}
.ssc-crumb{background:none;border:0;padding:.15rem .25rem;color:var(--ssc-red-ink);font:inherit;font-size:.86rem;font-weight:600;cursor:pointer;border-radius:.25rem}
.ssc-app .ssc-crumb:hover{background:transparent;color:var(--ssc-red-btn-dk);text-decoration:underline}
.ssc-crumb:focus-visible{outline:2px solid var(--ssc-navy);outline-offset:1px}
.ssc-crumb.is-current{color:var(--ssc-muted);font-weight:600}
.ssc-crumb-sep{width:14px;height:14px;color:var(--ssc-muted)}
.ssc-back{display:inline-flex;align-items:center;gap:.35rem;align-self:flex-start;background:none;border:0;padding:.25rem .25rem;color:var(--ssc-navy);font:inherit;font-weight:600;cursor:pointer;border-radius:.3rem}
.ssc-app .ssc-back:hover{background:transparent;color:var(--ssc-red-ink)}
.ssc-app .ssc-back:active{background:transparent;color:var(--ssc-red-btn-dk)}
.ssc-back:focus-visible{outline:2px solid var(--ssc-navy);outline-offset:1px}
.ssc-back .ssc-svg{width:18px;height:18px}

/* ---------------- Grid of cards ---------------- */
.ssc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}
.ssc-card{
  display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;position:relative;
  padding:1.15rem 1.15rem;text-align:left;
  background:var(--ssc-card);color:var(--ssc-ink);
  border:1px solid var(--ssc-border);border-radius:.7rem;cursor:pointer;
  font:inherit;
  transition:transform .16s var(--ssc-ease),border-color .16s var(--ssc-ease),box-shadow .16s var(--ssc-ease);
}
/* v2.4.0: hover/focus/active declare bg + text explicitly (theme button:hover defense).
   Cards stay white with navy title on hover — AAA var(--ssc-navy) on #fff (10.94:1). */
.ssc-app .ssc-card,.ssc-app .ssc-card:link,.ssc-app .ssc-card:visited{background:var(--ssc-card);color:var(--ssc-ink)}
.ssc-app .ssc-card:hover{background:var(--ssc-card);color:var(--ssc-ink);transform:translateY(-2px);border-color:var(--ssc-navy);box-shadow:0 14px 30px -20px rgba(27,54,93,.6);box-shadow:0 14px 30px -20px color-mix(in srgb,var(--ssc-navy) 60%,transparent)}
.ssc-app .ssc-card:active{background:var(--ssc-soft);color:var(--ssc-ink);border-color:var(--ssc-navy)}
.ssc-app .ssc-card:focus-visible{background:var(--ssc-card);color:var(--ssc-ink);outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-app .ssc-card:hover .ssc-card-title,.ssc-app .ssc-card:active .ssc-card-title,.ssc-app .ssc-card:focus-visible .ssc-card-title{color:var(--ssc-navy)}
.ssc-app .ssc-card:hover .ssc-card-meta,.ssc-app .ssc-card:active .ssc-card-meta,.ssc-app .ssc-card:focus-visible .ssc-card-meta{color:var(--ssc-muted)}
.ssc-card-title{font-weight:700;font-size:1.05rem;color:var(--ssc-navy)}
.ssc-card-meta{font-size:.85rem;color:var(--ssc-muted)}
.ssc-card-arrow{position:absolute;top:1.15rem;right:1rem;width:18px;height:18px;color:var(--ssc-muted)}

/* ---------------- Lists ---------------- */
.ssc-list{display:flex;flex-direction:column;gap:.5rem}
.ssc-listitem{
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding:1rem 1.1rem;text-align:left;font:inherit;cursor:pointer;
  background:var(--ssc-card);color:var(--ssc-ink);
  border:1px solid var(--ssc-border);border-radius:.6rem;
  transition:background-color .15s var(--ssc-ease),border-color .15s var(--ssc-ease)}
.ssc-app .ssc-listitem,.ssc-app .ssc-listitem:link,.ssc-app .ssc-listitem:visited{background:var(--ssc-card);color:var(--ssc-ink)}
.ssc-app .ssc-listitem:hover{background:var(--ssc-soft);color:var(--ssc-ink);border-color:var(--ssc-navy)}
.ssc-app .ssc-listitem:active{background:var(--ssc-tint);color:var(--ssc-ink);border-color:var(--ssc-navy)}
.ssc-app .ssc-listitem:focus-visible{background:var(--ssc-soft);color:var(--ssc-ink);outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-app .ssc-listitem:hover .ssc-li-q,.ssc-app .ssc-listitem:active .ssc-li-q,.ssc-app .ssc-listitem:focus-visible .ssc-li-q{color:var(--ssc-navy)}
.ssc-li-q{font-weight:600;color:var(--ssc-navy)}
.ssc-li-crumb{font-size:.8rem;color:var(--ssc-muted);margin-left:auto;padding-left:.5rem}
.ssc-listitem .ssc-card-arrow{position:static;flex:0 0 auto}
.ssc-empty{color:var(--ssc-muted);padding:1rem 0}

/* Answer body */
.ssc-answer{color:var(--ssc-ink);line-height:1.65;font-size:1.02rem}
.ssc-answer p{margin:0 0 .75rem}
.ssc-note{background:var(--ssc-soft);border:1px solid var(--ssc-border);border-radius:.55rem;padding:.85rem 1rem;color:var(--ssc-ink);font-size:.95rem}
.ssc-fineprint{font-size:.82rem;color:var(--ssc-muted);margin:0}

/* ---------------- Search ---------------- */
.ssc-search{display:flex;gap:.5rem;align-items:center;position:relative}
.ssc-search .ssc-search-ico{position:absolute;left:.8rem;width:18px;height:18px;color:var(--ssc-muted);pointer-events:none}
.ssc-search input{flex:1;padding:.75rem .9rem .75rem 2.4rem;border:1px solid var(--ssc-border);border-radius:.55rem;font:inherit;color:var(--ssc-ink)}
.ssc-search input:focus-visible{outline:3px solid var(--ssc-navy);outline-offset:1px;border-color:var(--ssc-navy)}

/* ---------------- Forms ---------------- */
.ssc-form{display:flex;flex-direction:column;gap:.4rem;max-width:34rem}
.ssc-label{font-weight:600;color:var(--ssc-navy);font-size:.92rem;margin-top:.5rem}
.ssc-req{color:var(--ssc-red-ink)}
.ssc-input{width:100%;padding:.7rem .85rem;border:1px solid var(--ssc-border);border-radius:.5rem;font:inherit;color:var(--ssc-ink);background:#fff}
.ssc-input:focus-visible{outline:3px solid var(--ssc-navy);outline-offset:1px;border-color:var(--ssc-navy)}
textarea.ssc-input{resize:vertical;min-height:5rem}
.ssc-input-icon{position:relative;display:flex;align-items:center}
.ssc-input-icon .ssc-svg{position:absolute;left:.75rem;width:18px;height:18px;color:var(--ssc-muted);pointer-events:none}
.ssc-input-icon .ssc-input{padding-left:2.35rem}
.ssc-field-error{color:var(--ssc-red-dk);font-size:.88rem;font-weight:600;min-height:1rem}

/* ---------------- Buttons ---------------- */
.ssc-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  min-height:44px;padding:.7rem 1.4rem;margin-top:.5rem;align-self:flex-start;
  background:var(--ssc-soft);color:var(--ssc-navy);
  border:1px solid var(--ssc-border);border-radius:.5rem;
  font:inherit;font-weight:700;cursor:pointer;text-decoration:none;
  transition:background-color .16s var(--ssc-ease),color .16s var(--ssc-ease),transform .16s var(--ssc-ease)}
.ssc-app .ssc-btn,.ssc-app .ssc-btn:link,.ssc-app .ssc-btn:visited{background:var(--ssc-soft);color:var(--ssc-navy)}
.ssc-app .ssc-btn:hover{background:var(--ssc-tint);color:var(--ssc-navy-2)}
.ssc-app .ssc-btn:active{background:var(--ssc-tint-2);color:var(--ssc-navy-2)}
.ssc-app .ssc-btn:focus-visible{background:var(--ssc-tint);color:var(--ssc-navy-2);outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-app .ssc-btn:disabled{background:#e9edf3;color:#41506a;cursor:not-allowed}

.ssc-app .ssc-btn-primary,
.ssc-app .ssc-btn-primary:link,
.ssc-app .ssc-btn-primary:visited{background:var(--ssc-red-btn);color:#ffffff;border-color:var(--ssc-red-btn)}
.ssc-app .ssc-btn-primary:hover{background:var(--ssc-red-btn-dk);color:#ffffff;border-color:var(--ssc-red-btn-dk);transform:translateY(-1px)}
.ssc-app .ssc-btn-primary:active{background:var(--ssc-red-btn-dk);color:#ffffff;border-color:var(--ssc-red-btn-dk)}
.ssc-app .ssc-btn-primary:focus-visible{background:var(--ssc-red-btn-dk);color:#ffffff;border-color:var(--ssc-red-btn-dk);outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-app .ssc-btn-primary:disabled{background:#7c3a44;color:#ffffff;border-color:#7c3a44;cursor:not-allowed}

.ssc-app .ssc-btn-ghost,
.ssc-app .ssc-btn-ghost:link,
.ssc-app .ssc-btn-ghost:visited{background:transparent;color:var(--ssc-navy);border-color:var(--ssc-border)}
.ssc-app .ssc-btn-ghost:hover{background:var(--ssc-soft);color:var(--ssc-navy-2)}
.ssc-app .ssc-btn-ghost:active{background:var(--ssc-tint);color:var(--ssc-navy-2)}
.ssc-app .ssc-btn-ghost:focus-visible{background:var(--ssc-soft);color:var(--ssc-navy-2);outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-app .ssc-btn-ghost:disabled{background:transparent;color:#41506a;cursor:not-allowed}
.ssc-btn-ext .ssc-svg{width:18px;height:18px}
.ssc-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.5rem}
.ssc-divider-or{display:flex;align-items:center;text-align:center;color:var(--ssc-muted);font-size:.85rem;margin:.5rem 0}
.ssc-divider-or::before,.ssc-divider-or::after{content:"";flex:1;height:1px;background:var(--ssc-border)}
.ssc-divider-or::before{margin-right:.75rem}.ssc-divider-or::after{margin-left:.75rem}

/* ---------------- Progress / success / status ---------------- */
.ssc-progress{display:flex;align-items:center;gap:.6rem;color:var(--ssc-muted)}
.ssc-spinner{width:20px;height:20px;border-radius:50%;border:2.5px solid var(--ssc-border);border-top-color:var(--ssc-navy);animation:ssc-spin .8s linear infinite}
.ssc-spinner.is-static{animation:none;border-top-color:var(--ssc-navy)}
@keyframes ssc-spin{to{transform:rotate(360deg)}}
.ssc-success{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem 0}
.ssc-success-ico{width:44px;height:44px;color:var(--ssc-ok);border:2px solid var(--ssc-ok);border-radius:50%;padding:6px}
.ssc-code{font-size:1.6rem;font-weight:800;letter-spacing:.06em;color:var(--ssc-navy);margin:0}
.ssc-status-card{border:1px solid var(--ssc-border);border-radius:.6rem;padding:1.1rem;display:flex;flex-direction:column;gap:.75rem}
.ssc-status-badge{align-self:flex-start;padding:.3rem .75rem;border-radius:999px;font-size:.82rem;font-weight:700;color:#fff;background:var(--ssc-navy)}
.status-received{background:var(--ssc-navy)}.status-in_review{background:#6b5300}.status-in_progress{background:#1d4289}.status-resolved{background:#14532d}.status-closed{background:#4a5568}
.ssc-dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem .9rem;margin:0}
.ssc-dl dt{color:var(--ssc-muted);font-size:.85rem}
.ssc-dl dd{margin:0;color:var(--ssc-ink);font-size:.9rem}

/* ---------------- Errors / toasts ---------------- */
.ssc-inline-error{background:#fdecec;border:1px solid #f4c2c2;border-radius:.55rem;padding:1rem;color:#7a1020}
.ssc-inline-error p{margin:0 0 .5rem}
.ssc-toast-host{position:fixed;left:50%;bottom:1.25rem;transform:translateX(-50%);display:flex;flex-direction:column;gap:.5rem;z-index:9999}
.ssc-toast{padding:.75rem 1.1rem;border-radius:.55rem;color:#fff;background:var(--ssc-navy);box-shadow:0 12px 30px -12px rgba(0,0,0,.5);font-size:.9rem;animation:ssc-fade .2s var(--ssc-ease)}
.ssc-toast-success{background:#14532d}.ssc-toast-error{background:var(--ssc-red-btn-dk)}
.ssc-toast.is-out{opacity:0;transition:opacity .3s}

/* ---------------- Skeletons ---------------- */
.ssc-skeleton{display:flex;flex-direction:column;gap:.6rem;width:100%}
.ssc-sk-line{height:.9rem;border-radius:.3rem;background:linear-gradient(90deg,#eef1f6,#e2e7ef,#eef1f6);background-size:200% 100%;animation:ssc-shimmer 1.2s infinite}
.ssc-sk-line.w90{width:90%}.ssc-sk-line.w80{width:80%}.ssc-sk-line.w60{width:60%}
.ssc-sk-row{height:3rem;border-radius:.5rem;background:linear-gradient(90deg,#eef1f6,#e2e7ef,#eef1f6);background-size:200% 100%;animation:ssc-shimmer 1.2s infinite}
.ssc-sk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.85rem;margin-top:.4rem}
.ssc-sk-grid span{height:5rem;border-radius:.7rem;background:linear-gradient(90deg,#eef1f6,#e2e7ef,#eef1f6);background-size:200% 100%;animation:ssc-shimmer 1.2s infinite}
@keyframes ssc-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ---------------- Responsive ---------------- */
@media(max-width:900px){
  .ssc-grid,.ssc-sk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .ssc-tablist{gap:.35rem;padding:.35rem}
  .ssc-panel{padding:1.25rem}
  .ssc-grid,.ssc-sk-grid{grid-template-columns:1fr}
  .ssc-tab{flex-direction:column;gap:.25rem;font-size:.78rem;padding:.55rem .25rem}
  .ssc-tab-label{white-space:normal;text-align:center;line-height:1.15}
}

/* ---------------- Reduced motion ---------------- */
@media(prefers-reduced-motion:reduce){
  .ssc-view-inner,.ssc-toast{animation:none}
  .ssc-card:hover,.ssc-btn-primary:hover{transform:none}
  .ssc-sk-line,.ssc-sk-row,.ssc-sk-grid span{animation:none}
  .ssc-spinner{animation:none}
}

/* ---------------- v2.3.0: photo upload + honeypot ---------------- */
.ssc-file{padding:.5rem .6rem;background:#ffffff;color:var(--ssc-ink)}
.ssc-file::file-selector-button{
  margin-right:.75rem;padding:.45rem .9rem;border-radius:.45rem;cursor:pointer;font:inherit;font-weight:600;
  background:var(--ssc-navy);color:#ffffff;border:1px solid var(--ssc-navy)}
.ssc-file::file-selector-button:hover{background:var(--ssc-navy-2);color:#ffffff;border-color:var(--ssc-navy-2)}
.ssc-photo-status{font-size:.88rem;color:var(--ssc-muted);min-height:1.1em}
.ssc-photo-clear{align-self:flex-start;min-height:38px;padding:.35rem .9rem}
/* Honeypot: removed from visual + AT flow; bots still see the input */
.ssc-hp{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------------- v2.5.0: services contact directory ---------------- */
.ssc-contact{display:flex;flex-direction:column;gap:.55rem;background:var(--ssc-soft);border:1px solid var(--ssc-border);border-radius:.6rem;padding:1rem 1.1rem;max-width:34rem}
.ssc-contact-row{display:flex;align-items:center;gap:.6rem}
.ssc-contact-ico{width:18px;height:18px;flex:0 0 auto;color:var(--ssc-navy)}
.ssc-contact-label{flex:0 0 4.5rem;font-size:.85rem;font-weight:700;color:var(--ssc-navy)}
.ssc-contact-text{color:var(--ssc-ink)}
.ssc-app .ssc-contact-link,.ssc-app .ssc-contact-link:link,.ssc-app .ssc-contact-link:visited{background:transparent;color:var(--ssc-red-ink);font-weight:600;text-decoration:underline;border-radius:.2rem}
.ssc-app .ssc-contact-link:hover{background:transparent;color:var(--ssc-red-btn-dk)}
.ssc-app .ssc-contact-link:active{background:transparent;color:var(--ssc-red-btn-dk)}
.ssc-app .ssc-contact-link:focus-visible{background:transparent;color:var(--ssc-red-btn-dk);outline:2px solid var(--ssc-navy);outline-offset:2px}

/* ---------------- v2.5.0: report map pin (Leaflet) ---------------- */
.ssc-map-wrap{display:flex;flex-direction:column;gap:.4rem}
.ssc-map{height:16rem;border:1px solid var(--ssc-border);border-radius:.6rem;overflow:hidden;background:var(--ssc-soft)}
.ssc-map:focus-visible{outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-map-locate .ssc-svg{width:18px;height:18px}
/* Keep Leaflet chrome under our toasts, and its links AAA */
.ssc-app .leaflet-container{font:inherit;z-index:1}
.ssc-app .leaflet-container a,.ssc-app .leaflet-container a:link,.ssc-app .leaflet-container a:visited{background:transparent;color:var(--ssc-navy-2)}
.ssc-app .leaflet-container a:hover{background:transparent;color:var(--ssc-navy-2);text-decoration:underline}
.ssc-app .leaflet-container a:active{background:transparent;color:var(--ssc-navy-2)}
/* v2.8.1: mobile map height handled in the mobile pass below */

/* ---------------- v2.8.0: My reports ---------------- */
.ssc-badge-sm{margin-left:auto;font-size:.75rem;padding:.22rem .6rem;flex:0 0 auto}
.ssc-listitem .ssc-badge-sm + .ssc-card-arrow{margin-left:.5rem}

/* ================= v2.8.1: mobile-friendly pass (frontend) ================= */
/* Kill double-tap zoom delay on all controls */
.ssc-app button,.ssc-app a,.ssc-app input,.ssc-app select,.ssc-app textarea{touch-action:manipulation}
/* iOS zooms any focused field under 16px — force a floor everywhere */
.ssc-app .ssc-input,.ssc-app select,.ssc-app textarea.ssc-input{font-size:max(16px,1rem)}

@media(max-width:600px){
  /* Comfortable thumb targets */
  .ssc-app .ssc-btn,.ssc-app .ssc-tab,.ssc-app .ssc-listitem{min-height:48px}
  .ssc-app .ssc-input{min-height:48px}
  textarea.ssc-input{min-height:7rem}

  /* Tab bar sticks while scrolling long panels so switching is one thumb-reach away */
  .ssc-tablist{position:sticky;top:0;z-index:20;box-shadow:0 6px 16px -12px rgba(27,54,93,.45);box-shadow:0 6px 16px -12px color-mix(in srgb,var(--ssc-navy) 45%,transparent)}
  body.admin-bar .ssc-tablist{top:46px} /* WP mobile admin bar */

  /* Full-width action buttons — no tiny side-by-side taps */
  .ssc-actions{flex-direction:column;align-items:stretch}
  .ssc-actions .ssc-btn{width:100%;justify-content:center}
  .ssc-app .ssc-btn-primary{width:100%;justify-content:center}

  /* Tighter gutters, larger touch rows */
  .ssc-panel{padding:1rem}
  .ssc-view-inner{gap:.85rem}
  .ssc-listitem{flex-wrap:wrap;row-gap:.3rem}
  .ssc-badge-sm{margin-left:0}

  /* Contact rows: label above value instead of a cramped fixed column */
  .ssc-contact{padding:.85rem}
  .ssc-contact-row{flex-wrap:wrap;row-gap:.1rem}
  .ssc-contact-label{flex:0 0 auto;min-width:4.5rem}
  .ssc-contact-link,.ssc-contact-text{flex:1 1 100%;padding-left:calc(18px + .6rem)}

  /* Map: taller than the old 12rem so pinching/panning is usable, plus roomy locate button */
  .ssc-map{height:15rem}
  .ssc-map-locate{width:100%;justify-content:center}

  /* Toasts clear the iPhone home indicator */
  .ssc-toasts{bottom:calc(1rem + env(safe-area-inset-bottom,0px));left:1rem;right:1rem;transform:none}
  .ssc-toast{width:100%;text-align:center}

  /* Crumbs/back bar wrap instead of overflowing */
  .ssc-backbar,.ssc-crumbs{flex-wrap:wrap;row-gap:.25rem}
}

/* Very small phones (SE / Fold cover screens) */
@media(max-width:380px){
  .ssc-tab{font-size:.76rem;padding:.6rem .35rem}
  .ssc-tab .ssc-svg{width:16px;height:16px}
  .ssc-app-title{font-size:1.45rem}
  .ssc-panel{padding:.85rem}
}

/* ---------------- v2.10.0: public report map ---------------- */
.ssc-map-public{height:22rem}
.ssc-map-legend{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.ssc-legend-item{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;color:var(--ssc-navy)}
.ssc-legend-dot{width:14px;height:14px;border-radius:50%;border:2px solid #ffffff;box-shadow:0 0 0 1px var(--ssc-border);display:inline-block}
.ssc-map-pop{display:flex;flex-direction:column;gap:.15rem;font-size:.9rem;min-width:9rem}
.ssc-map-pop strong{color:var(--ssc-navy)}
@media(max-width:600px){.ssc-map-public{height:17rem}}

/* ---------------- v2.12.0: public map issue list ---------------- */
.ssc-pub-list .ssc-listitem{gap:.6rem}
.ssc-pub-list .ssc-legend-dot{flex:0 0 auto}
.ssc-pub-list .ssc-li-crumb{flex:0 0 auto}
@media(max-width:600px){.ssc-pub-list .ssc-li-crumb{flex:1 1 100%;margin-left:calc(14px + .6rem);padding-left:0}}

/* ---------------- v2.12.1: defend Leaflet panes from theme/optimizer CSS ----------------
   Many themes ship `img,svg{height:auto;max-width:100%}` which collapses Leaflet's
   SVG overlay (tiles keep working, vector pins vanish). Vectors now render on
   canvas (preferCanvas), and these guards protect any remaining svg/canvas panes. */
.ssc-app .leaflet-pane svg,
.ssc-app .leaflet-overlay-pane svg{max-width:none!important;max-height:none!important}
.ssc-app .leaflet-pane canvas{max-width:none!important;max-height:none!important}
.ssc-app .leaflet-container img{max-width:none!important;height:auto}
.ssc-app .leaflet-marker-icon{max-width:none!important}

/* ---------------- v2.13.0: 311-style map chrome (search + basemap toggle) ---------------- */
.ssc-map{position:relative}
.ssc-map-chrome{position:absolute;inset:0;pointer-events:none;z-index:800}
.ssc-map-chrome>*{pointer-events:auto}
.ssc-map-search{
  position:absolute;top:.65rem;left:50%;transform:translateX(-50%);
  display:flex;align-items:center;gap:.4rem;width:min(62%,22rem);
  background:#ffffff;color:var(--ssc-navy);border:1px solid var(--ssc-border);border-radius:999px;
  padding:.35rem .8rem;box-shadow:0 8px 22px -14px rgba(0,0,0,.55)}
.ssc-map-search .ssc-search-ico{width:16px;height:16px;flex:0 0 auto;color:var(--ssc-muted)}
.ssc-map-search-in{border:0;outline:none;background:transparent;color:var(--ssc-navy);font:inherit;font-size:max(16px,.95rem);width:100%;min-height:32px}
.ssc-map-search-in::placeholder{color:var(--ssc-muted)}
.ssc-map-search:focus-within{border-color:var(--ssc-navy);box-shadow:0 0 0 3px rgba(27,54,93,.25);box-shadow:0 0 0 3px color-mix(in srgb,var(--ssc-navy) 25%,transparent)}
.ssc-map-search-status{
  position:absolute;top:3.4rem;left:50%;transform:translateX(-50%);
  background:var(--ssc-navy);color:#ffffff;font-size:.8rem;font-weight:600;border-radius:.4rem;padding:.15rem .6rem;white-space:nowrap}
.ssc-map-search-status:empty{display:none}
.ssc-map-bases{position:absolute;top:.65rem;right:.65rem;display:flex;gap:.35rem}
.ssc-app .ssc-map-base{
  border-radius:999px;padding:.4rem .9rem;font:inherit;font-size:.78rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;
  background:#ffffff;color:var(--ssc-navy);border:1px solid var(--ssc-border);box-shadow:0 8px 22px -14px rgba(0,0,0,.55)}
.ssc-app .ssc-map-base:hover{background:var(--ssc-tint);color:var(--ssc-navy-2)}
.ssc-app .ssc-map-base:active{background:var(--ssc-tint-2);color:var(--ssc-navy-2)}
.ssc-app .ssc-map-base:focus-visible{background:var(--ssc-tint);color:var(--ssc-navy-2);outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-app .ssc-map-base.is-active,.ssc-app .ssc-map-base.is-active:hover{background:#000000;color:#ffffff;border-color:#000000}
/* v2.27.0: zoom +/- buttons — the generic .leaflet-container link reset above
   stripped their white background, leaving bare glyphs over the tiles. Every
   state declares BOTH background and text (AAA pairs: navy on white, white on navy). */
.ssc-app .leaflet-bar{border:none;border-radius:.55rem;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.ssc-app .leaflet-bar a,.ssc-app .leaflet-bar a:link,.ssc-app .leaflet-bar a:visited{background:#ffffff;color:var(--ssc-navy);width:2rem;height:2rem;line-height:2rem;font-size:1.15rem;font-weight:700;border-bottom:1px solid var(--ssc-border);text-decoration:none}
.ssc-app .leaflet-bar a:hover{background:var(--ssc-navy);color:#ffffff;text-decoration:none}
.ssc-app .leaflet-bar a:active{background:var(--ssc-navy-2);color:#ffffff}
.ssc-app .leaflet-bar a:first-child{border-radius:.55rem .55rem 0 0}
.ssc-app .leaflet-bar a:last-child{border-radius:0 0 .55rem .55rem;border-bottom:none}
.ssc-app .leaflet-bar a.leaflet-disabled,.ssc-app .leaflet-bar a.leaflet-disabled:hover{background:#ffffff;color:#8a94a3;cursor:default}
/* v2.27.0: embedded shortcode content (e.g. [amm_upcoming]) below tab content */
.ssc-app .ssc-embed{margin-top:1.5rem;padding:1.25rem 1.5rem 1.5rem;border-top:1px solid var(--ssc-border)}
/* v2.27.0: open category grid — icon + label, no card chrome (ProudCity look) */
.ssc-app .ssc-cat{background:transparent;border:none;border-radius:0;overflow:visible;align-self:start}
.ssc-app .ssc-cat-head{display:flex;align-items:center;gap:.9rem;width:100%;background:transparent;color:var(--ssc-ink);border:none;padding:.55rem .25rem;cursor:pointer;text-align:left;font:inherit;font-size:1.05rem;font-weight:600;border-radius:.5rem}
.ssc-app .ssc-cat-head:hover{background:transparent;color:var(--ssc-navy)}
.ssc-app .ssc-cat-head:active{background:transparent;color:var(--ssc-navy-2)}
.ssc-app .ssc-cat-head:focus-visible{outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-app .ssc-cat-ico{flex:0 0 auto;width:1.9rem;height:1.9rem;color:var(--ssc-navy)}
.ssc-app .ssc-cat-head .ssc-card-title{flex:1 1 auto;font-weight:600;color:inherit}
.ssc-app .ssc-cat-head .ssc-card-arrow{width:1rem;height:1rem;color:var(--ssc-muted);transition:transform .15s ease}
@media (prefers-reduced-motion:reduce){.ssc-app .ssc-cat-head .ssc-card-arrow{transition:none}}
.ssc-app .ssc-cat-head[aria-expanded="true"] .ssc-card-arrow{transform:rotate(90deg)}
.ssc-app .ssc-cat-kids{display:flex;flex-direction:column;gap:.15rem;padding:.15rem 0 .4rem 3.05rem}
.ssc-app .ssc-cat-kids[hidden]{display:none}
.ssc-app .ssc-cat-kid{display:block;width:auto;background:transparent;color:var(--ssc-navy-2);border:none;padding:.3rem 0;cursor:pointer;text-align:left;font:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px;align-self:flex-start}
.ssc-app .ssc-cat-kid:hover{background:transparent;color:var(--ssc-navy);text-decoration:none}
.ssc-app .ssc-cat-kid:active{background:transparent;color:var(--ssc-navy-2)}
.ssc-app .ssc-cat-kid:focus-visible{outline:3px solid var(--ssc-navy);outline-offset:2px}
/* anchor variant keeps identical LVHA */
.ssc-app a.ssc-cat-kid,.ssc-app a.ssc-cat-kid:link{background:transparent;color:var(--ssc-navy-2)}
.ssc-app a.ssc-cat-kid:visited{background:transparent;color:var(--ssc-navy-2)}
.ssc-app a.ssc-cat-kid:hover{background:transparent;color:var(--ssc-navy);text-decoration:none}
.ssc-app a.ssc-cat-kid:active{background:transparent;color:var(--ssc-navy-2)}
/* v2.27.0: featured Agendas & Minutes entry — navy-tinted band with calendar icon */
.ssc-app .ssc-cat-agenda,.ssc-app button.ssc-cat-agenda,.ssc-app a.ssc-cat-agenda,.ssc-app a.ssc-cat-agenda:link,.ssc-app a.ssc-cat-agenda:visited{display:flex;align-items:center;gap:.5rem;background:var(--ssc-tint);color:var(--ssc-navy);margin:.35rem 0 .1rem;padding:.5rem .7rem;width:auto;align-self:stretch;border-radius:.55rem;border-left:3px solid var(--ssc-navy);font-weight:700;text-decoration:none}
.ssc-app .ssc-cat-agenda .ssc-agenda-ico{flex:0 0 auto;width:1.05rem;height:1.05rem}
.ssc-app .ssc-cat-agenda .ssc-agenda-label{flex:1 1 auto;text-align:left}
.ssc-app .ssc-cat-agenda .ssc-agenda-go{flex:0 0 auto;width:1rem;height:1rem;transition:transform .15s ease}
@media (prefers-reduced-motion:reduce){.ssc-app .ssc-cat-agenda .ssc-agenda-go{transition:none}}
.ssc-app button.ssc-cat-agenda:hover,.ssc-app a.ssc-cat-agenda:hover{background:var(--ssc-navy);color:#ffffff;text-decoration:none}
.ssc-app .ssc-cat-agenda:hover .ssc-agenda-go{transform:translateX(2px)}
.ssc-app button.ssc-cat-agenda:active,.ssc-app a.ssc-cat-agenda:active{background:var(--ssc-navy-2);color:#ffffff}
.ssc-app .ssc-cat-agenda:focus-visible{outline:3px solid var(--ssc-navy);outline-offset:2px}
/* v2.27.0: Today in {City} panel on My Services */
.ssc-app .ssc-today{background:var(--ssc-soft);border:1px solid var(--ssc-border);border-radius:.75rem;padding:1rem 1.25rem;margin:0 0 1.25rem}
.ssc-app .ssc-today-title{margin:0 0 .6rem;font-size:1.05rem;font-weight:800;color:var(--ssc-navy)}
.ssc-app .ssc-today-fac{display:flex;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.ssc-app .ssc-today-facbody{flex:1 1 14rem;display:flex;flex-direction:column;gap:.15rem}
.ssc-app .ssc-today-facname{font-weight:700;color:var(--ssc-ink)}
.ssc-app .ssc-today-facaddr{color:var(--ssc-muted);font-size:.9rem}
.ssc-app .ssc-today-fachours{display:flex;align-items:center;gap:.35rem;color:var(--ssc-muted);font-size:.9rem}
.ssc-app .ssc-today-ico{flex:0 0 auto}
.ssc-app .ssc-today-dir,.ssc-app .ssc-today-dir:link,.ssc-app .ssc-today-dir:visited{display:inline-flex;align-items:center;gap:.35rem;background:var(--ssc-card);color:var(--ssc-navy);border:1px solid var(--ssc-border);border-radius:.55rem;padding:.4rem .8rem;font-weight:700;font-size:.88rem;text-decoration:none;align-self:flex-start}
.ssc-app .ssc-today-dir:hover{background:var(--ssc-navy);color:#ffffff;border-color:var(--ssc-navy);text-decoration:none}
.ssc-app .ssc-today-dir:active{background:var(--ssc-navy-2);color:#ffffff}
.ssc-app .ssc-today-wx{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;margin-top:.6rem;padding-top:.6rem;border-top:1px solid var(--ssc-border)}
.ssc-app .ssc-today-wx[hidden]{display:none}
.ssc-app .ssc-today-temp{font-size:1.5rem;font-weight:800;color:var(--ssc-ink)}
.ssc-app .ssc-today-cond{color:var(--ssc-muted);font-size:.9rem}
/* v2.27.0: alert banner (gold background, navy text — AAA pair from the MyCityGov palette) */
.ssc-app .ssc-alert{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;background:#ffc845;color:#1b365d;border-radius:.75rem;padding:.7rem 1rem;margin:0 0 .9rem;font-weight:600}
.ssc-app .ssc-alert svg{flex:0 0 auto}
.ssc-app .ssc-alert-text{flex:1 1 14rem}
.ssc-app .ssc-alert-link,.ssc-app .ssc-alert-link:link,.ssc-app .ssc-alert-link:visited{background:transparent;color:#1b365d;font-weight:800;text-decoration:underline;text-underline-offset:2px}
.ssc-app .ssc-alert-link:hover{background:transparent;color:#1b365d;text-decoration:none}
.ssc-app .ssc-alert-link:active{background:transparent;color:#1b365d}
/* v2.27.0: Common Services list (label + one-line description + chevron) */
.ssc-app .ssc-common{margin:0 0 1.25rem}
.ssc-app .ssc-common-title{margin:0 0 .5rem;font-size:.85rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ssc-muted)}
.ssc-app .ssc-common-list{display:flex;flex-direction:column;border:1px solid var(--ssc-border);border-radius:.75rem;overflow:hidden;background:var(--ssc-card)}
.ssc-app .ssc-common-item,.ssc-app .ssc-common-item:link,.ssc-app .ssc-common-item:visited{display:flex;align-items:center;gap:.75rem;background:var(--ssc-card);color:var(--ssc-ink);padding:.75rem 1rem;text-decoration:none;border-bottom:1px solid var(--ssc-border)}
.ssc-app .ssc-common-item:last-child{border-bottom:none}
.ssc-app .ssc-common-item:hover{background:var(--ssc-tint);color:var(--ssc-ink);text-decoration:none}
.ssc-app .ssc-common-item:active{background:var(--ssc-tint-2);color:var(--ssc-ink)}
.ssc-app .ssc-common-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:.1rem}
.ssc-app .ssc-common-label{font-weight:700;color:var(--ssc-navy)}
.ssc-app .ssc-common-desc{font-size:.85rem;color:var(--ssc-muted)}
/* v2.27.0: embed as its own tab — it IS the panel content, so no divider chrome */
.ssc-app .ssc-embed.is-tab{margin-top:0;border-top:none;padding:1.5rem}
.ssc-app .ssc-embed-title{margin:0 0 .75rem;font-size:1.15rem;font-weight:700;color:var(--ssc-navy)}
/* v2.27.0: NATIVE upcoming-meetings rows (rendered by SSC from AMM data — no foreign markup) */
.ssc-app .ssc-embed *{font-family:inherit}
.ssc-app .ssc-embed-head{display:flex;align-items:center;gap:.5rem;margin:0 0 .85rem}
.ssc-app .ssc-embed-head svg{flex:0 0 auto;color:var(--ssc-navy)}
.ssc-app .ssc-meetings{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}
.ssc-app .ssc-meet{display:flex;align-items:center;gap:.9rem;background:var(--ssc-card);border:1px solid var(--ssc-border);border-radius:.75rem;padding:.7rem .9rem}
.ssc-app .ssc-meet-date{flex:0 0 auto;width:3.4rem;text-align:center;background:var(--ssc-navy);color:#ffffff;border-radius:.6rem;padding:.4rem 0;line-height:1.1}
.ssc-app .ssc-meet-mo{display:block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.ssc-app .ssc-meet-day{display:block;font-size:1.3rem;font-weight:800}
.ssc-app .ssc-meet-body{flex:1 1 auto;min-width:0}
.ssc-app .ssc-meet-title{font-weight:700;color:var(--ssc-ink);line-height:1.3}
.ssc-app .ssc-meet-meta{font-size:.85rem;color:var(--ssc-muted);display:flex;flex-wrap:wrap;gap:.25rem .6rem;align-items:center;margin-top:.2rem}
.ssc-app .ssc-meet-badge{background:var(--ssc-tint);color:var(--ssc-navy);border-radius:999px;padding:.1rem .55rem;font-size:.74rem;font-weight:700}
.ssc-app .ssc-meet-docs{display:flex;gap:.4rem;flex-wrap:wrap;flex:0 0 auto}
.ssc-app .ssc-meet-docs a,.ssc-app .ssc-meet-docs a:link,.ssc-app .ssc-meet-docs a:visited{display:inline-block;background:var(--ssc-soft);color:var(--ssc-navy);border:1px solid var(--ssc-border);border-radius:.55rem;padding:.3rem .7rem;font-size:.82rem;font-weight:700;text-decoration:none}
.ssc-app .ssc-meet-docs a:hover{background:var(--ssc-navy);color:#ffffff;border-color:var(--ssc-navy);text-decoration:none}
.ssc-app .ssc-meet-docs a:active{background:var(--ssc-navy-2);color:#ffffff}
.ssc-app .ssc-embed-empty{color:var(--ssc-muted);margin:.25rem 0}
.ssc-app .ssc-embed-foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:.9rem;flex-wrap:wrap}
.ssc-app .ssc-embed-note{font-size:.82rem;color:var(--ssc-muted);margin:0;flex:1 1 16rem}
.ssc-app .ssc-embed-btn,.ssc-app .ssc-embed-btn:link,.ssc-app .ssc-embed-btn:visited{display:inline-block;background:var(--ssc-navy);color:#ffffff;border-radius:.55rem;padding:.55rem 1.1rem;font-weight:700;text-decoration:none}
.ssc-app .ssc-embed-btn:hover{background:var(--ssc-navy-2);color:#ffffff;text-decoration:none}
.ssc-app .ssc-embed-btn:active{background:var(--ssc-navy-2);color:#ffffff}
@media (max-width:480px){.ssc-app .ssc-meet{flex-wrap:wrap}.ssc-app .ssc-meet-docs{width:100%;margin-left:4.3rem}}
/* Leaflet zoom control sits under our chrome comfortably */
.ssc-app .leaflet-top.leaflet-left{top:3.4rem}
@media(max-width:600px){
  .ssc-map-search{width:calc(100% - 8.5rem);left:.65rem;transform:none}
  .ssc-map-bases{top:.65rem;right:.65rem}
  .ssc-app .ssc-map-base{padding:.35rem .6rem;font-size:.7rem}
  .ssc-map-search-status{left:.65rem;transform:none}
}

/* ---------------- v2.14.0: 311 split layout ---------------- */
.ssc-311{display:flex;gap:1rem;align-items:stretch}
.ssc-311-side{flex:0 0 22rem;display:flex;flex-direction:column;gap:.6rem;max-height:34rem}
.ssc-311-mappane{flex:1;min-width:0;display:flex;flex-direction:column;gap:.5rem}
.ssc-map-311{height:34rem}
.ssc-311-filters{display:flex;flex-direction:column;gap:.5rem}
.ssc-311-selrow{display:flex;gap:.5rem}
.ssc-311-sel{flex:1;min-width:0}
.ssc-311-count{margin:0;font-size:.85rem;font-weight:700;color:var(--ssc-muted)}
.ssc-311-cards{display:flex;flex-direction:column;gap:.6rem;overflow-y:auto;padding-right:.25rem;flex:1}
.ssc-app .ssc-311-card,.ssc-app .ssc-311-card:link,.ssc-app .ssc-311-card:visited{
  display:flex;flex-direction:column;gap:.3rem;text-align:left;cursor:pointer;
  background:#ffffff;color:var(--ssc-ink);border:1px solid var(--ssc-border);border-radius:.6rem;padding:.85rem .95rem;font:inherit}
.ssc-app .ssc-311-card:hover{background:var(--ssc-soft);color:var(--ssc-ink);border-color:var(--ssc-navy)}
.ssc-app .ssc-311-card:active{background:var(--ssc-tint);color:var(--ssc-ink)}
.ssc-app .ssc-311-card:focus-visible{background:var(--ssc-soft);color:var(--ssc-ink);outline:3px solid var(--ssc-navy);outline-offset:2px}
.ssc-311-cardtop{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.ssc-311-cat{color:var(--ssc-navy)}
.ssc-311-loc{font-size:.88rem;color:var(--ssc-ink)}
.ssc-311-date{font-size:.8rem;color:var(--ssc-muted)}
.ssc-311-desc{font-size:.9rem;color:var(--ssc-ink);line-height:1.45}
.ssc-app .ssc-311-fab,.ssc-app .ssc-311-fab:link,.ssc-app .ssc-311-fab:visited{
  position:absolute;bottom:1.1rem;left:50%;transform:translateX(-50%);z-index:801;
  background:#4F46E5;color:#ffffff;border:0;border-radius:999px;padding:.75rem 1.5rem;
  font:inherit;font-weight:800;cursor:pointer;box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}
.ssc-app .ssc-311-fab:hover{background:#3730A3;color:#ffffff}
.ssc-app .ssc-311-fab:active{background:#312E81;color:#ffffff}
.ssc-app .ssc-311-fab:focus-visible{background:#3730A3;color:#ffffff;outline:3px solid #ffffff;outline-offset:2px}
@media(max-width:900px){
  .ssc-311{flex-direction:column}
  .ssc-311-side{flex:1 1 auto;max-height:none;order:2}
  .ssc-311-mappane{order:1}
  .ssc-map-311{height:20rem}
  .ssc-311-cards{overflow:visible;max-height:none}
}

/* ---------------- v2.15.0: inline pin, unpinned cards, debug badge ---------------- */
.ssc-pin-ico{background:transparent;border:0}
.ssc-pin-ico svg{filter:drop-shadow(0 3px 4px rgba(0,0,0,.45))}
.ssc-311-card.is-unpinned{cursor:default}
.ssc-app .ssc-311-card.is-unpinned:hover{background:#ffffff;color:var(--ssc-ink);border-color:var(--ssc-border)}
.ssc-debug-badge{
  position:fixed;bottom:.75rem;left:.75rem;z-index:99999;max-width:min(92vw,40rem);
  background:#000000;color:#ffc845;font:700 12px/1.5 monospace;border-radius:.5rem;padding:.5rem .75rem;
  box-shadow:0 10px 30px -10px rgba(0,0,0,.7)}

/* AIMH v4.9.0: the tab bar follows the width of the Service Center itself, not the
   window — narrow theme columns (and the Hub's Meetings tab, a 5th tab) stack the
   icon over the label instead of letting labels run into each other. */
.ssc-app{container-type:inline-size;container-name:sscapp;width:100%} /* width: never collapse inside a shrink-to-fit parent */
@container sscapp (max-width:760px){
  .ssc-tablist{gap:.35rem;padding:.35rem}
  .ssc-tab{flex-direction:column;gap:.25rem;font-size:.8rem;padding:.55rem .25rem}
  .ssc-tab-label{white-space:normal;text-align:center;line-height:1.15}
  .ssc-grid,.ssc-sk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container sscapp (max-width:480px){
  .ssc-grid,.ssc-sk-grid{grid-template-columns:1fr}
}
@container sscapp (max-width:420px){
  .ssc-tab{font-size:.74rem;padding:.5rem .2rem}
  .ssc-tab .ssc-svg{width:16px;height:16px}
}
