/* ============================================================================
   NAVTTC Progress Dashboard
   ============================================================================ */
.pg { font-family: var(--font-primary); color: var(--color-text); }
.pg .container { max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-pad); }
.pg h2, .pg h3, .pg h4 { margin: 0; }

/* ── Hero ─────────────────────────────────────────────────────────────── */
.pg-hero { position: relative; overflow: hidden; padding: 5rem 0; background: linear-gradient(135deg, #111827 0%, #1E293B 55%, #0B1220 100%); }
.pg-hero__blob { position: absolute; border-radius: 50%; filter: blur(80px); }
.pg-hero__blob--1 { top: 4rem; left: 2rem; width: 18rem; height: 18rem; background: rgba(59,130,246,.20); }
.pg-hero__blob--2 { bottom: 2rem; right: 2rem; width: 24rem; height: 24rem; background: rgba(251,191,36,.12); }
.pg-hero__inner { position: relative; z-index: 2; }
.pg-hero__head { text-align: center; margin-bottom: 3.5rem; color: #fff; }
.pg-hero__live { display: inline-flex; align-items: center; gap: .5rem; padding: .55rem 1.25rem; border-radius: 999px; font-size: .85rem; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); color: #fff; margin-bottom: 1.75rem; }
.pg-dot { width: .55rem; height: .55rem; border-radius: 50%; background: #4ade80; animation: pgPulse 1.6s infinite; }
@keyframes pgPulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }
.pg-hero__head h1 { font-size: clamp(2.25rem, 5vw, 3.75rem); font-weight: 800; line-height: 1.1; margin-bottom: 1.25rem; color: #fff; }
.pg-grad-gold { background: linear-gradient(90deg, #FCD34D, #F59E0B); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.pg-hero__head p { font-size: 1.2rem; max-width: 48rem; margin: 0 auto; color: rgba(255,255,255,.8); }
.pg-hero__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.pg-stat { text-align: center; padding: 2rem 1.5rem; border-radius: 1.25rem; background: linear-gradient(135deg, rgba(255,255,255,.15), rgba(255,255,255,.05)); border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(10px); transition: transform .35s; }
.pg-stat:hover { transform: translateY(-6px); }
.pg-stat__icon { width: 4rem; height: 4rem; border-radius: 1rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.25rem; color: #fff; font-size: 1.5rem; }
.pg-stat__num { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; color: #fff; line-height: 1; }
.pg-stat__label { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.7); margin-top: .5rem; }
.pg-stat__sub { font-size: .85rem; font-weight: 700; margin-top: .5rem; }

/* ── Tabs ─────────────────────────────────────────────────────────────── */
.pg-tabs { position: sticky; top: 0; z-index: 30; background: #fff; border-bottom: 1px solid var(--color-border); box-shadow: var(--shadow-sm); }
.admin-bar .pg-tabs { top: 32px; }
.pg-tabs__inner { display: flex; gap: .35rem; overflow-x: auto; padding: .85rem var(--container-pad); }
.pg-tab { flex-shrink: 0; padding: .6rem 1.15rem; border-radius: .6rem; font-size: .875rem; font-weight: 600; color: var(--color-text-muted); white-space: nowrap; transition: all .2s; }
.pg-tab:hover { color: var(--color-primary); background: var(--color-bg-light); }
.pg-tab--active { color: var(--color-primary); background: var(--color-primary-light); }

/* ── Sections / headers ───────────────────────────────────────────────── */
.pg-section { padding: 5rem 0; background: #fff; }
.pg-section--gray { background: linear-gradient(180deg, #f9fafb, #f3f4f6); }
.pg-sechead { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 3rem; }
.pg-sechead--center { justify-content: center; text-align: center; }
.pg-sechead h2 { font-size: clamp(1.75rem, 3.5vw, 2.4rem); font-weight: 800; color: var(--color-text); margin: .75rem 0; }
.pg-sechead p { color: var(--color-text-muted); font-size: 1.05rem; max-width: 40rem; }
.pg-sechead--center p { margin-inline: auto; }
.pg-sechead--light h2 { color: #fff; }
.pg-sechead--light p { color: rgba(255,255,255,.8); }
.pg-badge { display: inline-flex; align-items: center; gap: .5rem; padding: .45rem 1rem; border-radius: 999px; font-size: .8rem; font-weight: 700; }
.pg-badge--green { background: var(--color-primary-light); color: var(--color-primary); }
.pg-badge--blue { background: #dbeafe; color: #1d4ed8; }
.pg-badge--purple { background: #f3e8ff; color: #7c3aed; }
.pg-badge--amber { background: #fef3c7; color: #b45309; }
.pg-badge--glass { background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.25); color: #fff; }
.pg-field label { display: block; font-size: .85rem; font-weight: 600; color: var(--color-text); margin-bottom: .4rem; }
.pg-field--light label { color: rgba(255,255,255,.8); }
.pg-select { appearance: none; width: 100%; min-width: 13rem; padding: .7rem 2.5rem .7rem 1rem; border: 2px solid var(--color-border); border-radius: .75rem; background: #fff; font-family: inherit; font-size: .9rem; font-weight: 500; color: var(--color-text); cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236B7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .9rem center; background-size: 1.1rem; }
.pg-select:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 4px var(--color-primary-light); }
.pg-select--ghost { background-color: rgba(255,255,255,.15); border-color: rgba(255,255,255,.25); color: #fff; }
.pg-select--ghost option { color: #333; }
.pg-ico { width: 2.5rem; height: 2.5rem; border-radius: .65rem; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pg-ico--green { background: var(--color-primary-light); color: var(--color-primary); }
.pg-ico--blue { background: #dbeafe; color: #1d4ed8; }
.pg-ico--glass { background: rgba(255,255,255,.2); color: #fff; }

/* ── Province section ─────────────────────────────────────────────────── */
.pg-prov-grid { display: grid; grid-template-columns: 2fr 3fr; gap: 2rem; }
.pg-donut-card { background: #fff; border-radius: 1.5rem; padding: 2rem; border: 3px solid transparent; background: linear-gradient(#fff,#fff) padding-box, linear-gradient(135deg, var(--color-primary), #10b981, var(--color-accent)) border-box; }
.pg-donut-card h3, .pg-card h3, .pg-glass h3 { display: flex; align-items: center; gap: .75rem; font-size: 1.2rem; font-weight: 700; margin-bottom: 1.5rem; }
.pg-glass h3 { color: #fff; }
.pg-donut { position: relative; height: 320px; }
.pg-donut__center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.pg-donut__num { font-size: 2rem; font-weight: 800; color: var(--color-text); }
.pg-donut__lbl { font-size: .85rem; color: var(--color-text-muted); }
.pg-prov-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.pg-prov-card { background: #fff; border-radius: 1rem; padding: 1.5rem; box-shadow: var(--shadow-md); border: 2px solid transparent; cursor: pointer; transition: transform .35s, box-shadow .35s, border-color .2s; }
.pg-prov-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); border-color: color-mix(in srgb, var(--c) 30%, transparent); }
.pg-prov-card__top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 1rem; }
.pg-prov-card__id { display: flex; align-items: center; gap: .75rem; }
.pg-prov-card__icon { width: 3rem; height: 3rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.1rem; background: linear-gradient(135deg, var(--c), color-mix(in srgb, var(--c) 70%, #000)); }
.pg-prov-card__id h4 { font-size: 1rem; font-weight: 700; color: var(--color-text); }
.pg-prov-card__id p { font-size: .72rem; color: var(--color-text-muted); margin: 0; }
.pg-prov-card__pct { padding: .25rem .75rem; border-radius: 999px; font-size: .8rem; font-weight: 700; background: color-mix(in srgb, var(--c) 14%, #fff); color: var(--c); }
.pg-prov-card__total { font-size: 1.85rem; font-weight: 800; color: var(--color-text); margin-bottom: 1rem; }
.pg-prov-card__rows { display: grid; gap: .5rem; font-size: .85rem; }
.pg-prov-card__rows > div { display: flex; justify-content: space-between; }
.pg-prov-card__rows span:last-child { font-weight: 600; color: var(--color-text); }
.pg-prov-card__rows em { color: var(--color-text-light); font-style: normal; }
.pg-ratiobar { display: flex; height: .5rem; border-radius: 999px; overflow: hidden; margin-top: 1rem; background: var(--color-bg-section); }
.pg-ratiobar span { display: block; }

/* ── District section ─────────────────────────────────────────────────── */
.pg-filterbar { background: #fff; border-radius: 1.5rem; padding: 2rem; box-shadow: var(--shadow-lg); margin-bottom: 2.5rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; }
.pg-filterbar h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 800; }
.pg-filterbar__fields { display: flex; flex-wrap: wrap; gap: 1rem; }
.pg-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-bottom: 2.5rem; }
.pg-summary__card { background: #fff; border-radius: 1rem; padding: 1.5rem; box-shadow: var(--shadow-md); text-align: center; }
.pg-summary__num { font-size: 2.25rem; font-weight: 800; line-height: 1; }
.pg-summary__lbl { font-size: .85rem; color: var(--color-text-muted); margin-top: .35rem; }
.pg-dgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.pg-card { background: #fff; border-radius: 1.5rem; padding: 2rem; box-shadow: var(--shadow-lg); }
.pg-chart { height: 350px; }
.pg-chart--tall { height: 400px; }
.pg-tablewrap { max-height: 24rem; overflow: auto; }
.pg-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.pg-table th { position: sticky; top: 0; background: var(--color-bg-light); text-align: left; padding: .75rem; font-weight: 700; color: var(--color-text); }
.pg-table td { padding: .85rem .75rem; border-top: 1px solid var(--color-border); }
.pg-table tr:hover td { background: var(--color-bg-light); }
.pg-table__d { font-weight: 600; color: var(--color-text); }
.pg-c { text-align: center; }
.pg-table__ratio { display: flex; align-items: center; gap: .5rem; }
.pg-table__bar { display: flex; flex: 1; height: .6rem; border-radius: 999px; overflow: hidden; background: var(--color-bg-section); }
.pg-table__ratio em { font-style: normal; font-size: .7rem; color: var(--color-text-muted); width: 3rem; }

/* ── Year section ─────────────────────────────────────────────────────── */
.pg-year-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; border-radius: 1.5rem; padding: 2rem; margin-bottom: 2.5rem; background: linear-gradient(135deg, #0A6847, #064E3B); box-shadow: var(--shadow-lg); }
.pg-year-controls__fields { display: flex; flex-wrap: wrap; gap: 1rem; }
.pg-year-controls__quick { display: flex; gap: 2rem; }
.pg-q-num { display: block; font-size: 1.85rem; font-weight: 800; color: #fff; }
.pg-q-lbl { font-size: .8rem; color: rgba(255,255,255,.6); }
.pg-year-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 2rem; }
.pg-card__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.pg-card__head h3 { margin: 0; }
.pg-legend { display: flex; gap: 1rem; font-size: .8rem; }
.pg-legend span { display: inline-flex; align-items: center; gap: .4rem; }
.pg-legend i { width: .7rem; height: .7rem; border-radius: 50%; display: inline-block; }
.pg-year-cards { display: grid; gap: 1rem; max-height: 460px; overflow-y: auto; padding-right: .25rem; }
.pg-year-card { background: #fff; border: 1px solid var(--color-border); border-radius: 1rem; padding: 1.25rem; box-shadow: var(--shadow-sm); }
.pg-year-card--active { background: linear-gradient(135deg, #0A6847, #064E3B); border: none; color: #fff; }
.pg-year-card__top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: .5rem; }
.pg-year-card__top > span:first-child { color: var(--color-text-muted); font-weight: 600; }
.pg-year-card--active .pg-year-card__top > span:first-child { color: rgba(255,255,255,.8); }
.pg-tag { padding: .2rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.pg-tag--up { background: #dcfce7; color: #15803d; }
.pg-tag--down { background: #fee2e2; color: #b91c1c; }
.pg-year-card--active .pg-tag--up { background: rgba(74,222,128,.2); color: #86efac; }
.pg-year-card__num { font-size: 1.6rem; font-weight: 800; color: var(--color-text); margin-bottom: .5rem; }
.pg-year-card--active .pg-year-card__num { color: #fff; font-size: 1.85rem; }
.pg-year-card__mf { display: flex; gap: 1rem; font-size: .82rem; color: var(--color-text-muted); }
.pg-year-card--active .pg-year-card__mf { color: rgba(255,255,255,.75); }
.pg-year-card__note { margin-top: .5rem; font-size: .72rem; color: var(--color-text-light); }

/* ── Women section ────────────────────────────────────────────────────── */
.pg-women { position: relative; overflow: hidden; background: linear-gradient(135deg, #DB2777 0%, #7C3AED 50%, #4338CA 100%); }
.pg-women-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-bottom: 3.5rem; }
.pg-wstat { text-align: center; padding: 2rem 1.25rem; border-radius: 1.25rem; background: rgba(255,255,255,.1); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.2); transition: transform .35s; }
.pg-wstat:hover { transform: translateY(-6px); }
.pg-wstat__icon { width: 4rem; height: 4rem; border-radius: 1rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; color: #fff; font-size: 1.5rem; }
.pg-wstat__num { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; color: #fff; }
.pg-wstat__lbl { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: rgba(255,255,255,.7); }
.pg-women-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.pg-glass { border-radius: 1.5rem; padding: 2rem; background: rgba(255,255,255,.1); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.2); }
.pg-wprog-list { display: grid; gap: 1.25rem; }
.pg-wprog { border-radius: .85rem; padding: 1rem 1.25rem; background: rgba(255,255,255,.1); }
.pg-wprog__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .75rem; }
.pg-wprog__head h4 { font-size: .95rem; font-weight: 600; color: #fff; }
.pg-wprog__head p { font-size: .8rem; color: rgba(255,255,255,.6); margin: 0; }
.pg-wprog__val { font-size: 1.35rem; font-weight: 800; }
.pg-wprog__bar { height: .65rem; border-radius: 999px; background: rgba(255,255,255,.12); overflow: hidden; }
.pg-wprog__bar span { display: block; height: 100%; border-radius: 999px; }

/* ── Core functions ───────────────────────────────────────────────────── */
.pg-func-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-bottom: 3rem; }
.pg-func-card { background: #fff; border-radius: 1.5rem; padding: 2rem; box-shadow: var(--shadow-lg); border-top: 4px solid var(--fc); transition: transform .35s; }
.pg-func-card:hover { transform: translateY(-6px); }
.pg-func-card__head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.pg-func-card__icon { width: 4rem; height: 4rem; border-radius: 1rem; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.5rem; flex-shrink: 0; }
.pg-func-card__head h3 { font-size: 1.15rem; font-weight: 700; }
.pg-func-card__head p { font-size: .8rem; font-weight: 600; margin: .15rem 0 0; }
.pg-func-row { display: flex; align-items: center; justify-content: space-between; padding: .9rem 0; border-bottom: 1px solid var(--color-border); }
.pg-func-row:last-child { border-bottom: none; }
.pg-func-row__l { display: flex; align-items: center; gap: .75rem; color: var(--color-text); font-size: .9rem; }
.pg-func-row__ico { width: 2.25rem; height: 2.25rem; border-radius: .55rem; display: inline-flex; align-items: center; justify-content: center; }
.pg-func-row__v { font-size: 1.4rem; font-weight: 800; }
.pg-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.pg-metric { background: #fff; border-radius: 1rem; padding: 1.5rem; box-shadow: var(--shadow-md); text-align: center; border: 1px solid var(--color-border); transition: transform .35s; }
.pg-metric:hover { transform: translateY(-6px); }
.pg-metric__icon { width: 3.5rem; height: 3.5rem; border-radius: 1rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; font-size: 1.4rem; }
.pg-metric__num { font-size: 1.85rem; font-weight: 800; color: var(--color-text); }
.pg-metric__lbl { font-size: .85rem; color: var(--color-text-muted); }
.pg-metric__sub { font-size: .72rem; color: var(--color-text-muted); margin-top: .5rem; font-weight: 600; }
.pg-metric__sub.pg-up { color: var(--color-primary); }

/* ── Projects ─────────────────────────────────────────────────────────── */
.pg-proj-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; }
.pg-proj-h { display: flex; align-items: center; gap: .75rem; font-size: 1.2rem; font-weight: 700; margin-bottom: 1.5rem; }
.pg-dot--green { width: .75rem; height: .75rem; border-radius: 50%; background: #16a34a; animation: pgPulse 1.6s infinite; }
.pg-dot--gray { width: .75rem; height: .75rem; border-radius: 50%; background: #9ca3af; }
.pg-proj-list { display: grid; gap: 1.5rem; }
.pg-proj-card { border-radius: 1rem; padding: 1.5rem; box-shadow: var(--shadow-md); border-left: 4px solid var(--pc); background: linear-gradient(90deg, color-mix(in srgb, var(--pc) 8%, #fff), #fff); transition: transform .35s; }
.pg-proj-card:hover { transform: translateY(-5px); }
.pg-proj-card--plain { border: 1px solid var(--color-border); border-left: 1px solid var(--color-border); background: #fff; }
.pg-proj-card__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; }
.pg-proj-card__top h4 { font-size: 1.1rem; font-weight: 700; color: var(--color-text); }
.pg-proj-card__top p { font-size: .82rem; font-weight: 600; margin: .15rem 0 0; }
.pg-muted { color: var(--color-text-muted) !important; }
.pg-proj-card__desc { color: var(--color-text-muted); font-size: .9rem; margin-bottom: 1rem; }
.pg-proj-card__prog { display: flex; justify-content: space-between; font-size: .85rem; font-weight: 600; margin-bottom: .5rem; }
.pg-proj-bar { height: .65rem; border-radius: 999px; background: var(--color-border); overflow: hidden; }
.pg-proj-bar span { display: block; height: 100%; border-radius: 999px; }
.pg-chips { display: flex; flex-wrap: wrap; gap: .65rem; font-size: .8rem; }
.pg-chips span { padding: .3rem .8rem; border-radius: 999px; background: var(--color-bg-section); }
.pg-proj-card__foot { font-size: .85rem; font-weight: 600; }
.pg-green { color: #16a34a; }
.pg-tag--green { background: #dcfce7; color: #15803d; }
.pg-tag--blue { background: #dbeafe; color: #1d4ed8; }
.pg-tag--purple { background: #f3e8ff; color: #7c3aed; }
.pg-tag--gray { background: var(--color-bg-section); color: var(--color-text-muted); }

/* ── CTA ──────────────────────────────────────────────────────────────── */
.pg-cta { padding: 4rem 0; text-align: center; background: linear-gradient(90deg, #0F172A, #1E293B, #0F172A); }
.pg-cta h2 { font-size: clamp(1.75rem, 3.5vw, 2.4rem); font-weight: 800; color: #fff; margin-bottom: .75rem; }
.pg-cta p { color: rgba(255,255,255,.7); font-size: 1.1rem; margin-bottom: 2rem; }
.pg-cta__btns { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
.pg-cta__btn { display: inline-flex; align-items: center; gap: .65rem; padding: 1rem 2rem; border-radius: .85rem; font-weight: 700; transition: transform .2s; }
.pg-cta__btn:hover { transform: translateY(-2px); }
.pg-cta__btn--white { background: #fff; color: var(--color-primary); }
.pg-cta__btn--ghost { background: rgba(255,255,255,.1); color: #fff; border: 2px solid rgba(255,255,255,.2); }

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
	.pg-prov-grid, .pg-dgrid, .pg-year-grid, .pg-women-grid, .pg-proj-grid { grid-template-columns: 1fr; }
	.pg-func-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
	.pg-hero__stats, .pg-women-stats, .pg-metrics { grid-template-columns: repeat(2, 1fr); }
	.pg-prov-cards, .pg-summary { grid-template-columns: 1fr 1fr; }
	.pg-section { padding: 3.5rem 0; }
}
@media (max-width: 480px) {
	.pg-prov-cards, .pg-summary { grid-template-columns: 1fr; }
	.pg-year-controls__quick { width: 100%; justify-content: space-around; }
}

/* ── Overflow / responsiveness safety ─────────────────────────────────────
   Grid & flex children default to min-width:auto, so a wide <canvas> or table
   forces the column wider than the viewport → horizontal scroll. Force them to
   shrink and cap canvas/media width. (No overflow on .pg itself - that would
   break the sticky tabs; the theme's global body{overflow-x:clip} is the net.) */
.pg-prov-grid, .pg-dgrid, .pg-year-grid, .pg-women-grid, .pg-proj-grid,
.pg-hero__stats, .pg-women-stats, .pg-metrics, .pg-func-grid, .pg-summary,
.pg-portals__grid, .pg-cardsgrid__grid { min-width: 0; }
.pg-prov-grid > *, .pg-dgrid > *, .pg-year-grid > *, .pg-women-grid > *,
.pg-proj-grid > *, .pg-proj-list > *, .pg-year-controls > *,
.pg-year-controls__fields, .pg-year-controls__quick,
.pg-filterbar > *, .pg-filterbar__fields { min-width: 0; }
.pg-card, .pg-donut-card, .pg-glass, .pg-prov-cards, .pg-year-cards,
.pg-chart, .pg-chart--tall, .pg-donut { min-width: 0; max-width: 100%; }
.pg canvas { max-width: 100% !important; height: auto; }
.pg img, .pg table { max-width: 100%; }
/* selects shouldn't force a min that overflows tiny screens */
.pg-select { min-width: 0; width: 100%; }
.pg-field { min-width: 0; flex: 1 1 12rem; }
@media (max-width: 560px) {
	.pg-hero__stats, .pg-women-stats, .pg-metrics { grid-template-columns: 1fr; }
	.pg-filterbar__fields, .pg-year-controls__fields { flex-direction: column; align-items: stretch; width: 100%; }
}