:root{--bg:#f5f6f2;--paper:#fff;--ink:#202b28;--muted:#58665e;--line:#dfe4dd;--green:#227652;--mint:#edf5e9;--orange:#a74712;--peach:#fff0e4;--radius:14px}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}
button,input,select{font:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer;color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #5d8e45;outline-offset:4px}
::selection{background:#d6ebc5}
a{color:inherit;text-underline-offset:4px}
button{transition:background .16s,transform .16s}
button:active{transform:translateY(1px)}
header{background:#fff;border-bottom:1px solid var(--line)}
.wrap{max-width:1256px;margin:auto;padding:0 32px}
.nav{min-height:80px;display:flex;align-items:center;gap:34px}
.brand{display:flex;align-items:center;gap:9px;font-size:22px;font-weight:800;letter-spacing:-.035em;border:0;background:none;white-space:nowrap;padding:0}
.brandmark{background:var(--ink);color:#d9f1be;width:31px;height:31px;border-radius:9px;display:grid;place-items:center}
.brandmark svg{width:23px;height:23px}
.navlinks{display:flex;gap:28px;flex:1}
.navlinks [data-nav]{background:none;border:0;padding:27px 0;font-weight:600;text-decoration:none;color:var(--muted);border-bottom:3px solid transparent}
.navlinks [data-nav].active{color:var(--ink);border-bottom-color:var(--green)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:8px;background:white;padding:10px 15px;font-weight:650;min-height:44px}
.btn:hover{background:#f0f3ed}
.primary{background:var(--ink);border-color:var(--ink);color:white}
.primary:hover{background:#394b42}
.btn svg,.iconbtn svg{width:19px;height:19px}
.demo{font-size:12px;color:var(--muted);background:#eef0e9;padding:6px 0}
.intro{display:grid;grid-template-columns:1.2fr 1fr;gap:65px;align-items:center;padding:40px 0 30px}
h1{font-size:48px;line-height:1.09;letter-spacing:-.04em;font-weight:750;margin:0 0 13px}
h1 em{color:var(--green);font-style:normal}
p{margin:0 0 14px}
h2{font-size:22px;letter-spacing:-.025em;line-height:1.3;margin:0}
h3{margin:0;font-size:16px}
small,.muted{color:var(--muted)}
.searchbox{display:flex;gap:10px;align-items:center;background:white;border:1px solid #acb8a7;border-radius:10px;padding:4px 5px 4px 14px;box-shadow:0 5px 18px #293a1b08}
.searchbox svg{width:20px;height:20px;color:var(--muted);flex:none}
.searchbox input{width:100%;min-width:0;border:0;background:transparent;padding:12px 0;outline:0}
.searchbox:focus-within{outline:3px solid #d4e4c8}
.searchhint{font-size:12px;margin-top:8px}
.summary{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding:16px 0 22px;font-size:13px}
.live{display:inline-flex;align-items:center;gap:7px}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);flex:none}
.dot.warn{background:var(--orange)}
.maincols{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:30px;align-items:start}
.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px}
.textbutton{background:none;border:0;color:var(--green);padding:8px 0;font-weight:650;min-height:44px}
.filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}
.filters button{border:1px solid var(--line);background:transparent;border-radius:6px;padding:7px 11px;min-height:38px;color:#59675e;font-size:13px}
.filters button[aria-pressed=true]{color:white;background:var(--ink);border-color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.card{position:relative;border:1px solid var(--line);background:var(--paper);border-radius:var(--radius);overflow:hidden;transition:border-color .2s,transform .2s}
.card:hover{border-color:#9eaf99;transform:translateY(-2px)}
.cardlink{width:100%;height:100%;padding:19px 16px 14px;border:0;background:none;text-align:left;display:flex;flex-direction:column}
.cardtop{display:flex;align-items:center;gap:10px;padding-right:25px}
.logo{width:35px;height:35px;object-fit:contain;border-radius:6px;flex:none}
.card h3{font-size:16px}
.category{font-size:11px;color:var(--muted)}
.state{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--green);margin-top:17px}
.card.hot .state{color:var(--orange)}
.spark{display:block;width:100%;height:52px;color:var(--green);margin:10px 0 5px}
.card.hot .spark{color:#d87736}
.cardbottom{display:flex;justify-content:space-between;align-items:baseline;gap:4px 8px;flex-wrap:wrap;margin-top:auto;padding-top:10px;font-size:11px;color:var(--muted)}
.card-comments{margin-left:auto}
.card-official{margin:5px 0 0;color:var(--green);font-size:11px}
.cardbottom strong{color:var(--ink);font-weight:650;font-variant-numeric:tabular-nums}
.iconbtn{position:absolute;right:8px;top:14px;width:40px;height:40px;border:0;background:none;display:grid;place-items:center;color:#7a897e;border-radius:7px}
.iconbtn[aria-pressed=true]{color:var(--green)}
.iconbtn[aria-pressed=true] svg{fill:#d4e8c7}
.iconbtn:hover{background:var(--mint)}
.side{border-left:1px solid var(--line);padding-left:25px}
.side h2{font-size:18px}
.incident{padding:18px 0;border-bottom:1px solid var(--line);width:100%;text-align:left;background:none;border-left:0;border-right:0;border-top:0}
.incident p{font-size:13px;margin:6px 0}
.label{display:inline-flex;align-items:center;gap:5px;background:var(--peach);color:var(--orange);padding:3px 6px;border-radius:4px;font-size:10px;font-weight:700}
.side small{font-size:11px}
.side .note{padding:20px 0}
.note p{font-size:13px;margin:8px 0}
.ad{display:none;margin-top:20px;border:1px dashed #b7bfb1;min-height:120px;align-items:center;justify-content:center;flex-direction:column;color:var(--muted);font-size:12px}
.ads .ad{display:flex}
.activity{margin-top:32px;padding:22px 0;border-top:1px solid var(--line)}
.activitygrid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:18px}
.quote{display:flex;gap:12px}
.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e2e9d9;color:#3e5943;font-size:12px;font-weight:700;flex:none}
.quote p{font-size:13px;margin:4px 0}
.quote small{font-size:11px}
footer{margin-top:34px;border-top:1px solid var(--line);padding:22px 0}
.foot{display:flex;justify-content:space-between;gap:15px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.breadcrumb{padding:25px 0 18px}
.detailhead{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:25px}
.detailtitle{display:flex;gap:16px;align-items:center}
.detailtitle .logo{width:56px;height:56px}
.detailtitle h1{font-size:36px;margin:0 0 4px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.notice{background:var(--peach);padding:18px 20px;border-radius:10px;margin-bottom:22px;display:flex;gap:12px;align-items:center}
.notice p{margin:4px 0 0;font-size:13px}
.notice.calm{background:var(--mint)}
.panel{padding:22px;background:white;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:18px}
.panel .heading{margin:0 0 18px}
.bigchart{width:100%;height:180px;color:#cc7136}
.axis{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:8px}
.legend{display:flex;gap:15px;margin-top:18px;font-size:12px}
.key{display:inline-block;width:12px;height:3px;background:#d87736;margin-right:5px;vertical-align:middle}
.key.normal{background:#aebaa8}
.composer{border:1px solid var(--line);border-radius:8px;padding:12px;margin:18px 0}
.composer textarea{resize:vertical;min-height:65px;width:100%;font:inherit;border:0;outline:0;line-height:1.5}
.composer:focus-within{outline:2px solid #9fb28f}
.composer .row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.comments article{display:flex;gap:12px;padding:17px 0;border-top:1px solid var(--line)}
.comments p{font-size:14px;margin:6px 0}
.comments small{font-size:11px}
.reply{font-size:12px;border:0;background:none;color:var(--muted);padding:4px 0;min-height:32px}
.barline{display:flex;justify-content:space-between;font-size:13px;margin-top:15px}
.bartrack{height:5px;background:#eef1e9;border-radius:3px;margin-top:5px;overflow:hidden}
.bartrack span{display:block;height:100%;background:#8fa87d}
.rating{display:flex;gap:4px}
.rating button{font-size:22px;border:0;background:transparent;color:#68795d;width:40px;height:44px;padding:0}
.rating button[aria-pressed=true]{color:#a34c0a}
.empty{padding:35px 10px;text-align:center;border:1px dashed var(--line);border-radius:12px}
.empty button{margin-top:12px}
.hide{display:none!important}
dialog{border:0;border-radius:16px;padding:26px;width:min(440px,calc(100% - 24px));color:var(--ink);box-shadow:0 18px 80px #18231833}
dialog::backdrop{background:#18241b66}
dialog h2{margin-bottom:12px}
dialog input{width:100%;border:1px solid var(--line);padding:12px;border-radius:8px;margin:8px 0 14px}
dialog .btn{width:100%;margin-top:8px}
.close{float:right;width:36px;height:36px;border:0;background:#eff2eb;border-radius:6px}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:12px 20px;border-radius:9px;font-size:13px;box-shadow:0 5px 20px #0002;z-index:10;max-width:90vw}
.mobilelabel{display:none}

@media(max-width:1050px){.maincols{grid-template-columns:minmax(0,1fr) 230px;gap:20px}
.side{padding-left:18px}
.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.intro{gap:30px}
h1{font-size:40px}
.nav{gap:24px}
.navlinks{gap:18px}
}

@media(max-width:740px){.wrap{padding:0 18px}
.nav{min-height:66px;gap:12px;justify-content:space-between;flex-wrap:wrap}
.brand{font-size:20px}
.navlinks{order:3;width:100%;gap:24px}
.navlinks [data-nav]{padding:8px 0 11px;font-size:13px}
.intro{grid-template-columns:1fr;gap:20px;padding:28px 0 20px}
.intro h1{font-size:36px;line-height:1.1;max-width:340px}
.intro p{font-size:14px;margin:0}
.intro .searchhint{font-size:11px;margin-top:8px}
.summary{font-size:11px;padding-bottom:18px}
.summary>span:last-child{display:none}
.maincols{grid-template-columns:1fr}
.side{border:0;padding:0;margin-top:10px}
.side .note{display:none}
.grid{gap:10px}
.cardlink{padding:15px 12px 12px}
.cardtop{gap:8px}
.logo{width:29px;height:29px}
.card h3{font-size:14px}
.iconbtn{right:2px;top:6px;width:36px;height:36px}
.state{font-size:10px;margin-top:16px}
.cardbottom{font-size:10px}
.spark{height:44px}
.filters{gap:6px;flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
.filters button{white-space:nowrap;min-height:42px}
.heading h2{font-size:20px}
.activitygrid{grid-template-columns:1fr;gap:20px}
.detailhead{align-items:flex-start;flex-direction:column}
.detailtitle h1{font-size:30px}
.panel{padding:16px}
.detailhead .actions{width:100%}
.detailhead .primary{flex:1}
.notice{padding:14px}
.bigchart{height:150px}
.composer .row small{display:none}
.mobilelabel{display:inline}
.foot{gap:12px}
.side>h2{margin-top:10px}
}

@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}
}

.maincols>*,.intro>*,.grid>*,.activitygrid>*{min-width:0}
.navlinks{min-width:0}
@media(max-width:740px){.navlinks{flex-basis:100%}
.state{line-height:1.4;min-height:28px}
.cardtop{padding-right:12px}
.card .iconbtn{top:3px;right:0;width:32px;height:32px}
}
 
.skip { position:absolute; left:-9999px; padding:8px; background:white; z-index:3 }
.skip:focus { left:8px }
.brand strong { color:#227652 }
.summary .dot, .state .dot, .notice .dot { background:#737e73 }
.summary .dot.warn, .state .dot.warn, .notice .dot.warn { background:#a74712 }
.notice.calm { background:#eef0e9 }
.report-options { margin:0; padding:0; border:0 }
.report-options legend { margin-bottom:8px; color:var(--muted) }
.report-options label { display:flex; align-items:center; gap:12px; min-height:44px; padding:7px 10px; margin:6px 0; border:1px solid var(--line); border-radius:8px; cursor:pointer }
.report-options input { width:auto; margin:0; accent-color:var(--green) }
.form-status { min-height:1.5em; font-size:13px; margin:10px 0 0 }
.form-status:empty { display:none }
.chart-empty { min-height:124px; display:grid; place-items:center; margin:0; text-align:center; padding:10px }
.card .spark { display:block }
.card .state { align-items:center }
.stats-note { margin:14px 0 0; font-size:13px }
.panel+.panel { margin-top:16px }
.discussion-status:empty { display:none }
.btn:disabled { cursor:wait; opacity:.65 }
.btn[hidden] { display:none }
@media(max-width:390px) { .navlinks { gap:16px } .navlinks [data-nav] { font-size:12px } }
.cardlink, .incident { text-decoration:none }
.incident { display:block }
.incident:hover h3 { text-decoration:underline }
.card .state { color:var(--muted) }
.card .state:has(.dot.warn) { color:var(--orange) }
@media(max-width:740px) { .nav { padding-top:10px } }
.network-intro { padding:40px 0 18px; max-width:700px }
.network-intro p { margin-bottom:0 }
.network-sources { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px }
.network-sources .network-source { margin:0 }
.network-message { margin:18px 0 10px }
.network-events { list-style:none; padding:0; margin:14px 0 0 }
.network-events li { border-top:1px solid var(--line); padding:12px 0 }
.network-events p { margin:2px 0 }
.network-source .textbutton { display:inline-flex; align-items:center }
.network-note { margin:16px 0 0 }
@media(max-width:740px) {
  .navlinks { flex-wrap:wrap; row-gap:0 }
  .network-sources { grid-template-columns:1fr; gap:12px }
  .network-intro { padding-top:25px }
}