*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#18334e;background:#f3f6fa}body{margin:0;font-size:14px}a{color:inherit;text-decoration:none}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:268px;background:#10283e;color:#eaf2fa;padding:28px 18px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;gap:12px;align-items:center;padding:4px 9px 30px}.brand-mark{font-size:32px;font-weight:800;color:#29c4c4}.brand strong{display:block;font-size:20px;letter-spacing:-.6px;color:#fff}.brand strong b{color:#27c4c4}.brand small{display:block;color:#b7c7d8;font-size:12px;margin-top:5px}.sidebar nav{display:grid;gap:8px}.nav-link{display:flex;gap:14px;align-items:center;padding:15px 16px;border-radius:10px;color:#c6d4e2;font-size:15px;transition:.15s}.nav-link span{width:20px;font-size:19px;text-align:center}.nav-link:hover,.nav-link.active{background:#214b69;color:#fff}.sidebar-foot{margin-top:auto;border-top:1px solid #294258;padding:18px 8px 0;color:#c2d1df;font-size:12px;line-height:1.8}.sidebar-foot small{color:#8fa5b9}.dot{display:inline-block;width:7px;height:7px;background:#42c58a;border-radius:50%;margin-right:7px}.main{margin-left:268px;min-height:100vh;padding:30px clamp(22px,3vw,48px) 22px;max-width:1800px}.topbar{display:flex;align-items:center;gap:20px;margin-bottom:28px}.topbar h1{margin:7px 0 4px;font-size:30px;letter-spacing:-1px;color:#102e4c}.eyebrow{font-size:11px;letter-spacing:1.5px;font-weight:750;color:#8294a8}.location{margin:0;color:#788da4;font-size:15px}.top-status{margin-left:auto;display:flex;align-items:center;gap:20px}.status-pill{display:inline-flex;align-items:center;gap:8px;background:#e4f7ef;color:#14885a;border-radius:30px;padding:10px 14px;font-size:12px;font-weight:650;white-space:nowrap}.status-pill i{width:7px;height:7px;background:#22ad72;border-radius:50%}.updated{border-left:1px solid #d9e1ea;padding-left:20px;display:grid;gap:4px}.updated small{color:#8798ab;font-size:11px}.updated strong{font-size:13px;color:#344f6a;white-space:nowrap}.menu-toggle{display:none;border:0;background:#e5edf5;border-radius:8px;padding:10px;color:#173a58}.notice{padding:13px 16px;border-radius:10px;margin-bottom:20px;font-size:13px}.notice-warning{background:#fff7e3;border:1px solid #f3d58b;color:#8d5b09}.alert-banner{display:flex;align-items:center;gap:20px;padding:24px 26px;border:1px solid;border-radius:15px;margin-bottom:22px}.alert-banner.normal{background:#eaf8f1;border-color:#bce8d2}.alert-banner.waspada{background:#fff7e3;border-color:#f3d58b}.alert-banner.siaga{background:#fff0e5;border-color:#f6c49e}.alert-banner.awas{background:#fff0f0;border-color:#f2b6b6}.alert-symbol{display:grid;place-items:center;flex:0 0 48px;height:48px;background:#ffffffa8;border-radius:13px;font-size:26px;font-weight:800;color:#b56c09}.normal .alert-symbol{color:#16885a}.awas .alert-symbol{color:#c53535}.alert-copy{flex:1}.alert-copy h2{font-size:22px;letter-spacing:-.5px;margin:6px 0;color:#9a6008}.normal .alert-copy h2{color:#14794f}.siaga .alert-copy h2{color:#bd5e16}.awas .alert-copy h2{color:#b52d2d}.alert-copy p{margin:0;color:#657a8f;line-height:1.5}.alert-meta{display:grid;gap:7px;text-align:right}.alert-meta strong{font-size:10px;letter-spacing:.8px;background:#ffffffa8;padding:8px 10px;border-radius:20px}.alert-meta small{color:#75899d;font-size:11px}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}.metric-card,.panel{background:#fff;border:1px solid #e2e9f1;border-radius:14px;box-shadow:0 2px 8px #17334d05}.metric-card{padding:20px 21px;min-width:0}.metric-head{display:flex;align-items:center;gap:10px;color:#617990;font-size:13px}.metric-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;font-size:18px;font-weight:700}.blue{background:#e8f3fc;color:#277da1}.teal{background:#e6f8f3;color:#43aa8b}.violet{background:#f0eafe;color:#9b5de5}.amber{background:#fff1df;color:#f8961e}.indigo{background:#e9edff;color:#577590}.green{background:#e8f6e9;color:#55a66a}.metric-value{font-size:27px;font-weight:750;letter-spacing:-.8px;color:#173b5c;margin:14px 0 6px;white-space:nowrap}.metric-value.compact{font-size:23px}.metric-value.compact span{font-weight:400;color:#a0adbb}.metric-sub{font-size:11px;color:#8b9caf;line-height:1.45}.content-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);gap:18px}.panel{padding:22px;min-width:0}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}.panel-heading h3{margin:0 0 6px;font-size:17px;letter-spacing:-.3px;color:#183b5a}.panel-heading p{margin:0;color:#91a0b1;font-size:12px}.panel-tag{font-size:11px;color:#72869b;background:#f3f6fa;border:1px solid #e6edf4;border-radius:8px;padding:7px 10px;white-space:nowrap}.chart-wrap{height:350px;position:relative}.chart-note{font-size:11px;color:#91a0b1;line-height:1.5;margin-top:12px}.empty-chart{height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#8497aa}.empty-chart span{font-size:40px;color:#b8c8d7}.empty-chart strong{font-size:14px;color:#536d85;margin:10px}.empty-chart p{font-size:12px;margin:0}.detail-list{display:grid}.detail-list>div{display:flex;justify-content:space-between;gap:12px;padding:15px 0;border-bottom:1px solid #edf1f5}.detail-list span{color:#8496a9;font-size:12px}.detail-list strong{font-size:12px;text-align:right;color:#294a67}.text-normal{color:#16885a!important}.text-waspada{color:#b7770b!important}.text-siaga{color:#c56a22!important}.text-awas{color:#c53535!important}.text-link{display:flex;justify-content:space-between;margin-top:20px;color:#247aa5;font-weight:650;font-size:13px}.footer{margin-top:24px;padding:14px 2px;color:#9aa8b7;font-size:11px}.footer span{padding:0 5px}.page-title{margin:0 0 20px}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:760px}.data-table th,.data-table td{text-align:left;padding:13px 12px;border-bottom:1px solid #edf1f5;font-size:12px}.data-table th{color:#71869b;background:#f8fafc;font-weight:700}.data-table td{color:#36536e}.badge{display:inline-block;padding:5px 8px;border-radius:20px;font-size:10px;font-weight:700;background:#e7f6ee;color:#16885a}.badge.warn{background:#fff2d7;color:#a96c05}.badge.danger{background:#ffebeb;color:#b52d2d}.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.contact-card{background:#fff;border:1px solid #e2e9f1;border-radius:13px;padding:20px}.contact-card h3{margin:0 0 8px;font-size:15px}.contact-card p{color:#8193a5;font-size:12px;line-height:1.5}.contact-card a{color:#247aa5;font-weight:700}.muted{color:#91a0b1;font-size:12px}
@media(max-width:1100px){.sidebar{width:230px}.main{margin-left:230px}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-grid{grid-template-columns:1fr}.top-status{gap:10px}.updated{padding-left:10px}}
@media(max-width:720px){.sidebar{transform:translateX(-100%);transition:transform .2s;width:265px;box-shadow:8px 0 25px #0002}.sidebar.open{transform:translateX(0)}.main{margin-left:0;padding:18px 15px}.menu-toggle{display:block}.topbar{gap:12px;align-items:flex-start;margin-bottom:20px}.topbar h1{font-size:24px}.location{font-size:12px}.top-status{display:grid;justify-items:end;gap:7px}.updated{border:0;padding:0;text-align:right}.updated strong{font-size:10px}.status-pill{font-size:10px;padding:8px 10px}.alert-banner{padding:17px;gap:12px;align-items:flex-start}.alert-symbol{flex-basis:36px;height:36px;font-size:20px}.alert-copy h2{font-size:17px}.alert-copy p{font-size:12px}.alert-meta{display:none}.metric-grid{gap:10px}.metric-card{padding:15px}.metric-value{font-size:22px}.metric-value.compact{font-size:18px}.metric-sub{font-size:10px}.panel{padding:17px}.chart-wrap{height:310px}.contact-grid{grid-template-columns:1fr}}

/* Final dashboard refinements */
.sidebar{position:fixed;top:0;bottom:0;left:0;height:100vh;overflow-y:auto}
.main{min-width:0}
.logo-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 0 20px}
.logo-tile{height:58px;display:flex;align-items:center;justify-content:center;gap:9px;background:#fff;border:1px solid #e2e9f1;border-radius:10px;padding:8px 12px;min-width:0}
.logo-placeholder{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:30px;padding:0 7px;border-radius:7px;background:#e8f3fc;color:#277da1;font-size:10px;font-weight:800;letter-spacing:.3px}
.logo-tile small{font-size:10px;color:#8193a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.metric-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.metric-card{padding:14px 15px}
.metric-head{font-size:12px;gap:8px}
.metric-icon{width:29px;height:29px;font-size:15px;border-radius:8px}
.metric-value{font-size:22px;margin:10px 0 5px}
.metric-value.compact{font-size:17px;letter-spacing:-.5px}
.metric-sub{font-size:10px}
.telegram-panel{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:20px;padding:20px 24px;background:#fff;border:1px solid #e2e9f1;border-radius:14px}
.telegram-copy h3{margin:7px 0;font-size:17px;color:#183b5a}
.telegram-copy p{margin:0 0 12px;color:#8193a5;font-size:12px}
.telegram-link{display:inline-block;background:#168bd2;color:#fff;padding:9px 14px;border-radius:8px;font-size:12px;font-weight:700}
.telegram-copy small{display:block;margin-top:9px;color:#a0adbb;font-size:10px}
.telegram-qr{display:flex;flex-direction:column;align-items:center;gap:5px;flex-shrink:0;color:#8193a5;font-size:10px}
.telegram-qr img{width:112px;height:112px;object-fit:contain;border:1px solid #e5ebf2;border-radius:8px;padding:4px}
@media(max-width:1150px){.metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.logo-strip{grid-template-columns:repeat(5,minmax(75px,1fr));gap:6px;overflow-x:auto;padding-bottom:3px}.logo-tile{height:48px;padding:5px;gap:4px;flex-direction:column}.logo-placeholder{height:22px;min-width:28px;font-size:8px}.logo-tile small{font-size:8px}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.telegram-panel{padding:16px;gap:12px}.telegram-qr img{width:88px;height:88px}.telegram-copy h3{font-size:15px}}


/* Professional interaction layer: subtle lift, soft bubble accents, and map */
.nav-external{margin-left:auto!important;font-size:12px!important;opacity:.65}
.metric-card,.panel,.contact-card,.logo-tile,.telegram-panel{position:relative;overflow:hidden;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}
.metric-card::after,.contact-card::after,.logo-tile::after{content:"";position:absolute;width:76px;height:76px;border:1px solid #d9edf6;border-radius:50%;right:-27px;top:-32px;opacity:.42;pointer-events:none;transition:transform .35s ease,opacity .35s ease}
.metric-card:hover,.panel:hover,.contact-card:hover,.logo-tile:hover,.telegram-panel:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(25,65,98,.10);border-color:#c9dce9}
.metric-card:hover::after,.contact-card:hover::after,.logo-tile:hover::after{transform:scale(1.35);opacity:.75}
.panel.chart-panel::before{content:"";position:absolute;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,rgba(65,174,190,.07),rgba(65,174,190,0));right:-45px;top:-45px;pointer-events:none}
.map-panel{margin-top:20px}
.map-frame{height:310px;border-radius:12px;overflow:hidden;background:#eaf0f5;border:1px solid #e3ebf2}
.map-frame iframe{width:100%;height:100%;border:0;display:block}
.map-open{white-space:nowrap;color:#247aa5!important}
.contact-symbol{display:grid;place-items:center;width:40px;height:40px;margin-bottom:12px;border-radius:12px;background:#eaf4fb;color:#247da5;font-size:20px}
.contact-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}
.contact-actions a{display:inline-flex;align-items:center;justify-content:center;border-radius:9px;background:#eaf5fb;color:#1d7198;padding:9px 12px;font-size:12px;font-weight:750;transition:background .2s ease,transform .2s ease}
.contact-actions a:hover{background:#d9edf8;transform:translateY(-2px)}
.contact-source{display:inline-block;margin-top:12px;color:#8a9bae;font-size:10px;text-decoration:underline;text-underline-offset:3px}
@media(max-width:720px){.map-frame{height:245px}.map-panel .panel-heading{align-items:flex-start}.map-open{font-size:10px;padding:6px 8px}.contact-actions a{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* Final polish: hover lift, subtle bubbles, Telegram information card, centered log title */
.metric-card,.panel,.contact-card,.logo-tile,.telegram-panel{
  transition:transform .22s ease, box-shadow .22s ease;
}
.metric-card:hover,.panel:hover,.contact-card:hover,.logo-tile:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 32px rgba(16,40,62,.10);
}
.metric-card,.contact-card,.panel{position:relative;overflow:hidden}
.metric-card:before,.contact-card:before{
  content:"";position:absolute;width:110px;height:110px;border-radius:50%;
  right:-42px;top:-48px;background:rgba(65,170,205,.07);pointer-events:none;
}
.telegram-panel{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:28px 32px;border:1px solid #cfe5f3;border-radius:22px;
  background:linear-gradient(120deg,#f8fcff 0%,#eaf6ff 55%,#f7fbff 100%);
  box-shadow:0 10px 28px rgba(28,102,150,.08);position:relative;overflow:hidden;
}
.telegram-panel:after{content:"";position:absolute;width:210px;height:210px;border-radius:50%;
right:100px;top:-145px;background:rgba(40,160,210,.09);pointer-events:none}
.telegram-copy{position:relative;z-index:1}
.telegram-copy h3{font-size:1.35rem;margin:8px 0}
.telegram-link{display:inline-flex;align-items:center;gap:8px;margin:14px 0 10px;
padding:12px 18px;border-radius:12px;background:#168bd2;color:#fff;font-weight:700;
text-decoration:none;box-shadow:0 6px 16px rgba(22,139,210,.20)}
.telegram-link:hover{transform:translateY(-2px);background:#0879bd}
.telegram-qr{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;
gap:8px;padding:12px;background:#fff;border:1px solid #dceaf4;border-radius:16px;text-decoration:none}
.telegram-qr img{width:132px;height:132px;object-fit:contain}
.telegram-qr span{font-size:.8rem;color:#6c8196}
@media(max-width:700px){.telegram-panel{align-items:flex-start;padding:20px;flex-direction:column}.telegram-qr{align-self:center}}
.log-page-title{text-align:center;width:100%}

/* FloodGuard refreshed visual system: river blue + young-leaf green */
:root{--river:#087fa5;--river-deep:#0d3149;--leaf:#8bd34f;--leaf-dark:#3c8d35;--mint:#eaf9df;--sky:#e8f7fc;--ink:#153650;--muted:#71889b}
html,body{background:#f3f9f5;color:var(--ink)}
.main{background:radial-gradient(ellipse at 90% 4%,rgba(157,224,112,.18),transparent 25%),linear-gradient(180deg,#f5fbf7 0%,#f0f7fb 100%);position:relative;isolation:isolate}
.main:before{content:"";position:fixed;z-index:-1;pointer-events:none;width:250px;height:250px;border-radius:50%;right:4%;top:16%;background:radial-gradient(circle,rgba(133,211,79,.12),rgba(133,211,79,0) 70%)}
.sidebar{background:linear-gradient(180deg,#10334b,#10283e 80%);border-right:1px solid #21465c}
.brand-mark,.brand strong b{color:#8bd34f}.dot{background:#8bd34f}
.nav-link:hover,.nav-link.active{background:linear-gradient(100deg,#1d5975,#22684f);box-shadow:inset 3px 0 #9be15d}
.logo-tile{border-radius:16px;background:linear-gradient(135deg,#fff 0%,#f7fff4 100%);border-color:#dcebdc;position:relative;overflow:hidden}
.logo-tile:after{content:"";position:absolute;width:90px;height:90px;border:1px solid rgba(139,211,79,.2);border-radius:50%;right:-28px;top:-40px;pointer-events:none}
.logo-placeholder{background:linear-gradient(135deg,#e5f5fc,#eaf8dd);color:#147c9c;border-radius:11px}
.topbar{position:relative;display:flex;justify-content:center;text-align:center;min-height:92px;align-items:center;margin:4px 0 28px}
.topbar>.title-block,.topbar>div:not(.top-status){width:min(100%,760px);margin:0 auto;text-align:center}
.topbar h1,.topbar .page-title{font-size:clamp(27px,3vw,36px);font-weight:800;letter-spacing:-1.2px;margin:7px 0 5px;color:#123650}
.topbar .location{font-size:14px}
.topbar .top-status{position:absolute;right:0;top:50%;transform:translateY(-50%);margin:0}
.topbar .menu-toggle{position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:2}
.eyebrow{color:#6f9b82}
.alert-banner{border-radius:20px;box-shadow:0 8px 24px rgba(30,95,73,.05)}
.alert-banner.normal{background:linear-gradient(115deg,#e9f9df,#e9f8f1);border-color:#c6e8b1}
.metric-card,.panel,.contact-card{border-radius:18px;border-color:#dce9e5;box-shadow:0 5px 18px rgba(26,66,83,.035)}
.metric-card:hover,.panel:hover,.contact-card:hover,.logo-tile:hover{transform:translateY(-5px);box-shadow:0 16px 32px rgba(24,86,73,.12);border-color:#bfe3b1}
.metric-icon.green{background:#e9f9df;color:#4e9c3b}.metric-icon.blue{background:#e5f6fc;color:#1686a8}.metric-icon.teal{background:#e5f8ef;color:#279d7b}
.panel-heading h3{color:#143d57}
.notice-warning{background:#fff8e6;border-color:#f0d58d}
.contact-card{background:linear-gradient(145deg,#fff,#f8fff5)}
/* Centered page titles on every section */
.log-page-title{text-align:center;width:100%}
.credit-intro{position:relative;overflow:hidden;text-align:center;padding:28px clamp(20px,4vw,48px);margin:0 0 26px;border-radius:22px;border:1px solid #d4e9d0;background:linear-gradient(120deg,#f0fbe9,#eaf8fc 60%,#f8fff3);box-shadow:0 10px 30px rgba(39,105,76,.06)}
.credit-intro:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-65px;top:-100px;background:rgba(139,211,79,.16);pointer-events:none}
.credit-kicker{display:inline-block;font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:#4d9a3d}
.credit-intro h2{font-size:clamp(21px,2.4vw,29px);margin:9px 0;color:#153b53;letter-spacing:-.6px}
.credit-intro p{max-width:720px;margin:0 auto;color:#71889b;line-height:1.7;font-size:13px}
.credit-section{margin:28px 0;padding:26px;border:1px solid #dcebe2;border-radius:22px;background:rgba(255,255,255,.82);box-shadow:0 7px 24px rgba(25,78,64,.045)}
.credit-section.supporting{background:linear-gradient(135deg,#fff,#f0f8ff);border-color:#d7e7f1}
.credit-section-heading{display:flex;align-items:center;gap:15px;margin:0 0 22px}
.credit-number{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border-radius:14px;background:linear-gradient(135deg,#dff5d3,#dff3fb);color:#328a55;font-weight:850}
.credit-section-heading h2{font-size:clamp(20px,2.2vw,27px);margin:5px 0;color:#143a54;letter-spacing:-.6px}
.credit-section-heading p{margin:0;color:#8296a5;font-size:12px}
.people-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.person-card{overflow:hidden;display:flex;align-items:center;gap:15px;min-width:0;padding:13px;border-radius:16px;border:1px solid #e0ece5;background:#fff;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.person-card:hover{transform:translateY(-4px);box-shadow:0 13px 25px rgba(29,92,72,.11);border-color:#bfe3b1}
.person-card img{width:86px;height:106px;flex:0 0 86px;object-fit:cover;object-position:top center;border-radius:12px;background:#eaf4f8;border:1px solid #e2eaf0}
.person-info{min-width:0}.person-info h3{font-size:13px;line-height:1.4;margin:0 0 6px;color:#173b54}.person-info p{font-size:11px;line-height:1.55;margin:0;color:#7d91a1}
.student-panel{margin-top:20px;padding:20px;border-radius:17px;background:linear-gradient(120deg,#effbe7,#f4fbff);border:1px solid #d9edce}
.student-panel-head{display:flex;align-items:center;gap:12px;margin-bottom:15px}.student-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#dff4d2;color:#4c9a3c}.student-panel-head h3{margin:0 0 4px;font-size:15px;color:#214b3c}.student-panel-head p{margin:0;font-size:11px;color:#7d9385}
.student-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.student-list span{padding:11px 13px;border-radius:11px;background:#fff;border:1px solid #e1edda;color:#34566b;font-size:12px;font-weight:650}
@media(max-width:1100px){.people-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar .top-status{position:static;transform:none;margin-left:auto}}
@media(max-width:720px){.topbar{min-height:100px;padding:0 36px;display:flex;flex-direction:column;justify-content:center;gap:8px}.topbar>.title-block,.topbar>div:not(.top-status){width:100%}.topbar .top-status{position:static;transform:none;display:flex;justify-content:center;margin:5px 0 0}.topbar .updated{display:none}.topbar .menu-toggle{left:0;top:10px;transform:none}.credit-section{padding:17px;margin:20px 0}.credit-section-heading{align-items:flex-start}.people-grid{grid-template-columns:1fr}.person-card img{width:76px;height:94px;flex-basis:76px}.student-list{grid-template-columns:1fr}.credit-intro{padding:23px 17px}}


/* FloodGuard responsive refinements */
.fg-logo-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 0 26px}
.fg-logo-card{min-width:0;min-height:78px;display:flex;align-items:center;justify-content:center;padding:10px 14px;background:rgba(255,255,255,.92);border:1px solid #dcebe2;border-radius:18px;box-shadow:0 5px 18px rgba(23,72,56,.045);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.fg-logo-card:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(23,72,56,.11);border-color:#b7dfc6}
.fg-logo-card img{display:block;width:100%;height:56px;object-fit:contain}
.topbar{position:relative;justify-content:center;text-align:center}
.topbar>div:not(.top-status),.topbar>.title-block{width:min(100%,820px);margin-inline:auto;text-align:center}
.topbar .eyebrow,.topbar .page-title,.topbar .location{text-align:center}
.topbar .menu-toggle{position:absolute;left:0;top:0}
.main{min-width:0}
.metric-grid,.content-grid,.contact-grid,.people-grid{min-width:0}
.table-wrap{max-width:100%;overscroll-behavior-x:contain}
.data-table{min-width:760px}
.chart-wrap{min-width:0;max-width:100%}
iframe{max-width:100%}
img{max-width:100%}
@media(max-width:1150px){
 .sidebar{width:245px}
 .main{margin-left:245px;padding-inline:clamp(16px,2.5vw,30px)}
 .fg-logo-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
 .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 .sidebar{width:min(285px,86vw);transform:translateX(-105%);transition:transform .24s ease;box-shadow:12px 0 32px rgba(9,31,49,.18)}
 .sidebar.open{transform:translateX(0)}
 .main{margin-left:0;padding:18px 14px 24px}
 .menu-toggle{display:inline-flex!important;align-items:center;justify-content:center}
 .fg-logo-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:20px}
 .fg-logo-card{min-height:68px;padding:8px 10px;border-radius:14px}
 .fg-logo-card img{height:48px}
 .topbar{padding:34px 4px 0;min-height:0;margin-bottom:22px;display:flex;flex-direction:column;gap:8px}
 .topbar .menu-toggle{left:0;top:0}
 .topbar h1,.topbar .page-title{font-size:clamp(25px,7vw,32px);line-height:1.15}
 .topbar .location{font-size:13px;line-height:1.5}
 .top-status{width:100%;justify-content:center;flex-wrap:wrap;gap:10px}
 .updated{border-left:0;padding:0;text-align:center}
 .alert-banner{padding:16px;gap:12px;align-items:flex-start}
 .alert-symbol{flex-basis:38px;height:38px;font-size:20px}
 .alert-copy h2{font-size:18px;line-height:1.3}
 .alert-meta{display:none}
 .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .metric-card{padding:14px;min-width:0}
 .metric-head{font-size:12px;align-items:flex-start}
 .metric-icon{width:30px;height:30px;flex:0 0 30px}
 .metric-value{font-size:clamp(19px,5.5vw,24px);white-space:normal;overflow-wrap:anywhere}
 .metric-value.compact{font-size:clamp(17px,4.8vw,21px)}
 .content-grid{grid-template-columns:minmax(0,1fr);gap:12px}
 .panel{padding:16px}
 .chart-wrap{height:280px}
 .contact-grid{grid-template-columns:minmax(0,1fr)}
 .contact-card{min-width:0}
 .credit-intro,.credit-section{padding:18px 14px}
 .people-grid{grid-template-columns:minmax(0,1fr)}
 .student-list{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:390px){
 .metric-grid{grid-template-columns:minmax(0,1fr)}
 .fg-logo-strip{gap:7px}
 .fg-logo-card img{height:43px}
}
@media(prefers-reduced-motion:reduce){
 .fg-logo-card,.metric-card,.panel,.contact-card,.person-card{transition:none!important}
 .fg-logo-card:hover,.metric-card:hover,.panel:hover,.contact-card:hover,.person-card:hover{transform:none}
}
