/* Orion EVENT HORIZON: the full-screen "how stressed does the world look" panel. Always dark and cosmic whatever the theme, because it is meant to look like looking into a black hole.
   The hue variable --hz-h (0-360) is set from the reading, so the whole panel changes colour with the score. Part of Orion; loaded by index.html. */

#hzOverlay{background:rgba(2,3,10,.82);backdrop-filter:blur(10px)}
.modal.hz{--hz-h:175;--hz-c:hsl(var(--hz-h) 92% 64%);--hz-cs:hsl(var(--hz-h) 92% 64% / .55);width:min(1120px,100%);max-height:min(94vh,100%);padding:0 28px 28px;color:#e8ecff;background:
  radial-gradient(1100px 520px at 18% -8%,hsl(var(--hz-h) 85% 38% / .22),transparent 62%),
  radial-gradient(900px 600px at 100% 30%,hsl(calc(var(--hz-h) + 40) 70% 40% / .10),transparent 60%),
  linear-gradient(180deg,#05060f 0%,#080b19 55%,#05060f 100%);border:1px solid hsl(var(--hz-h) 60% 60% / .28);box-shadow:0 30px 120px -20px hsl(var(--hz-h) 90% 40% / .45),0 0 0 1px rgba(255,255,255,.03) inset;transition:border-color .8s,box-shadow .8s}
.modal.hz .mhead{background:linear-gradient(180deg,#05060f 70%,transparent);border-bottom:0;margin:0 -28px 6px;padding:16px 18px 10px 28px}
.modal.hz .mhead h2{color:#e8ecff;letter-spacing:.22em;font-size:13px;font-weight:600;text-transform:uppercase}
.modal.hz .mhead h2 .ic{color:var(--hz-c);filter:drop-shadow(0 0 6px var(--hz-cs))}
.modal.hz .xbtn{color:#a9b4dd}
.modal.hz .xbtn:hover{background:rgba(255,255,255,.08);color:#fff}
.modal.hz .btn.ghost{background:rgba(255,255,255,.05);border-color:rgba(190,205,255,.22);color:#dfe5ff}
.modal.hz .btn.ghost:hover{background:rgba(255,255,255,.1);border-color:var(--hz-cs)}
.modal.hz .warnbox{margin:10px 0}
.modal.hz ::selection{background:hsl(var(--hz-h) 80% 50% / .35)}

/* hero: the picture on the left, the reading in words on the right */
.hz-hero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:34px;align-items:center;padding:4px 0 14px}
.hz-stage{position:relative;width:100%;aspect-ratio:1/1;max-width:560px;margin:0 auto;--hzs:520px;touch-action:pan-y}
.hz-stage::before{content:"";display:block;padding-top:100%}   /* a square without aspect-ratio (older smart-TV browsers have none) */
.hz-stage canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}
.hz-core{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;justify-items:center;text-align:center;pointer-events:none}
.hz-num{font-size:calc(var(--hzs) * .155);font-weight:200;line-height:1;letter-spacing:-.045em;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 0 28px var(--hz-cs),0 0 2px #fff;margin-top:calc(var(--hzs) * -.012)}
.hz-of{font-size:calc(var(--hzs) * .0185);letter-spacing:.34em;color:hsl(var(--hz-h) 70% 80% / .85);margin-top:calc(var(--hzs) * .012);font-weight:600}
.hz-info{min-width:0}
.hz-kicker{font-size:12px;letter-spacing:.5em;font-weight:700;text-transform:uppercase;background:linear-gradient(90deg,#fff,var(--hz-c));-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:6px}
.hz-band{margin:0 0 10px;font-size:clamp(28px,3.9vw,52px);font-weight:700;letter-spacing:.05em;line-height:1.05;color:var(--hz-c);text-shadow:0 0 30px var(--hz-cs);overflow-wrap:normal;word-break:normal;hyphens:none}
.hz-note{margin:0 0 14px;font-size:16px;line-height:1.5;color:#c9d2f5;max-width:46ch}
.hz-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.hz-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;padding:5px 11px;border-radius:99px;background:rgba(255,255,255,.06);border:1px solid rgba(190,205,255,.16);color:#c3ccef}
.hz-live{color:#9ff0cf;border-color:rgba(90,220,170,.4);background:rgba(60,200,150,.1)} .hz-live[hidden]{display:none}
.hz-dot{width:7px;height:7px;border-radius:50%;background:#4ade99;box-shadow:0 0 0 0 rgba(74,222,153,.55);animation:hzlive 2.2s ease-out infinite;flex:none}
@keyframes hzlive{0%{box-shadow:0 0 0 0 rgba(74,222,153,.55)}70%{box-shadow:0 0 0 7px rgba(74,222,153,0)}100%{box-shadow:0 0 0 0 rgba(74,222,153,0)}}
@media (prefers-reduced-motion:reduce){.hz-dot{animation:none}}
.hz-chip.up{color:#ffb38a;border-color:rgba(255,150,90,.4);background:rgba(255,120,60,.1)}
.hz-chip.down{color:#8ae6c4;border-color:rgba(90,220,170,.4);background:rgba(60,200,150,.1)}
.hz-h3{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#9fabd6;margin:0 0 10px}
.hz-h3 span{letter-spacing:0;text-transform:none;font-weight:400;color:#7f8ab3;font-size:12.5px}
.hz-drivers{display:grid;gap:8px;margin-bottom:16px}
.hz-drv{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(190,205,255,.1);border-left:3px solid var(--c)}
.hz-drv b{font-size:14px;color:#f1f4ff}
.hz-drv span{grid-column:1;font-size:13px;color:#aab5dc;line-height:1.4}
.hz-drv i{grid-row:1/3;grid-column:2;align-self:center;font-style:normal;font-size:22px;font-weight:300;color:var(--c);font-variant-numeric:tabular-nums}
.hz-actions{display:flex;flex-wrap:wrap;gap:8px}
.hz-sub,.hz-small{font-size:12.5px;color:#8f9bc5;line-height:1.5}
.hz-small{margin:10px 0 0}

/* sections */
.hz-sec{margin-top:26px}
.hz-scale{position:relative;padding-top:22px}
.hz-track{display:flex;height:14px;border-radius:99px;overflow:hidden;gap:2px}
.hz-track i{display:block;height:100%;transition:background .6s}
.hz-mark{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;transition:left 1.2s cubic-bezier(.2,.8,.2,1)}
.hz-mark b{font-size:12px;font-weight:700;color:#05060f;background:var(--hz-c);padding:1px 8px;border-radius:99px;box-shadow:0 0 14px var(--hz-cs)}
.hz-mark::after{content:"";width:2px;height:22px;background:var(--hz-c);margin-top:-1px;box-shadow:0 0 10px var(--hz-cs);position:absolute;top:19px}
.hz-labels{display:flex;margin-top:7px;gap:2px}
.hz-labels span{font-size:10.5px;letter-spacing:.08em;color:#7885b3;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:clip}
.hz-labels span{min-width:0}
.hz-labels span.on{color:var(--hz-c);font-weight:700;overflow:visible;display:flex;justify-content:center}
.hz-labels span.on:first-child{justify-content:flex-start}
.hz-labels span.on:last-child{justify-content:flex-end}
.hz-comp{display:flex;height:16px;border-radius:99px;overflow:hidden;gap:2px;background:rgba(255,255,255,.05)}
.hz-comp i{display:block;height:100%;min-width:3px}
.hz-compkey{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:12.5px;color:#aab5dc}
.hz-compkey span{display:inline-flex;align-items:center;gap:6px}
.hz-compkey i{width:9px;height:9px;border-radius:50%;display:inline-block}

/* the nine signals */
.hz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;align-items:start}
.hz-sig{position:relative;border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));border:1px solid rgba(190,205,255,.13);padding:12px 14px 14px;transition:border-color .2s,transform .2s,background .2s;overflow:hidden}
.hz-sig::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--c);opacity:.9}
.hz-sig:hover{border-color:var(--c);transform:translateY(-1px)}
.hz-sig.nolive{opacity:.72}
.hz-sh{all:unset;box-sizing:border-box;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;width:100%;cursor:pointer;border-radius:10px}
.hz-sh:focus-visible{outline:2px solid var(--c);outline-offset:3px}
.hz-ring{position:relative;width:54px;height:54px;flex:none}
.hz-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.hz-ring circle{fill:none;stroke-width:3.4}
.hz-ring .bg{stroke:rgba(190,205,255,.14)}
.hz-ring .fg{stroke:var(--lv);stroke-linecap:round;filter:drop-shadow(0 0 3px var(--lv));transition:stroke-dasharray 1s}
.hz-ring b{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:16px;font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
.hz-st{display:grid;gap:2px;min-width:0}
.hz-sname{font-size:15px;font-weight:600;color:#f1f4ff;line-height:1.25}
.hz-sw{font-size:12px;color:#8f9bc5}
.hz-chev{color:#7885b3;transition:transform .2s}
.hz-chev .ic{width:16px;height:16px}
.hz-sig.open .hz-chev{transform:rotate(180deg)}
.hz-sig.open .hz-fact{display:none}
.hz-fact{margin-top:10px;font-size:13px;line-height:1.45;color:#b9c3e8}
.hz-det{display:none;margin-top:10px;padding-top:10px;border-top:1px solid rgba(190,205,255,.12)}
.hz-sig.open .hz-det{display:block}
.hz-facts{margin:0 0 8px;padding-left:18px;font-size:13px;color:#c5cdee;line-height:1.5}
.hz-evh{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#8f9bc5;margin:8px 0 4px;font-weight:700}
.hz-ev{margin:0;padding-left:18px;font-size:13px;line-height:1.45}
.hz-ev li{margin-bottom:4px;color:#c5cdee}
.hz-ev a{color:hsl(var(--hz-h) 90% 76%);text-decoration:none;border-bottom:1px dotted currentColor}
.hz-ev a:hover{color:#fff}
.hz-ev span{font-size:11.5px;color:#7f8ab3;margin-left:4px}
.hz-looks{margin-top:8px;font-size:12px;color:#7f8ab3;line-height:1.45}

/* trend */
.hz-trend svg{display:block;width:100%;height:120px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid rgba(190,205,255,.1)}
.hz-tl{display:flex;justify-content:space-between;font-size:12px;color:#8f9bc5;margin-top:6px}

/* how it is worked out */
.hz-how{border:1px solid rgba(190,205,255,.14);border-radius:14px;padding:4px 16px;background:rgba(255,255,255,.025)}
.hz-how summary{cursor:pointer;padding:10px 0;font-weight:600;color:#dfe5ff;list-style:none;display:flex;align-items:center;gap:8px}
.hz-how summary::-webkit-details-marker{display:none}
.hz-how summary::before{content:"+";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;border:1px solid var(--hz-cs);color:var(--hz-c);font-size:14px;line-height:1}
.hz-how[open] summary::before{content:"\2212"}
.hz-how p{font-size:13.5px;line-height:1.6;color:#b9c3e8}
.hz-tbl{width:100%;border-collapse:collapse;font-size:13px;margin:6px 0}
.hz-tbl th{text-align:left;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8f9bc5;padding:6px 8px;border-bottom:1px solid rgba(190,205,255,.16)}
.hz-tbl td{padding:8px;border-bottom:1px solid rgba(190,205,255,.08);vertical-align:top;color:#c5cdee}
.hz-tbl td:first-child{white-space:nowrap;color:#f1f4ff}
.hz-tbl td i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}

/* the footer that must always be there */
.hz-guess{margin-top:26px;display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;border:1px solid hsl(var(--hz-h) 70% 60% / .45);background:hsl(var(--hz-h) 60% 40% / .12);color:#d6dcf7;font-size:13.5px;line-height:1.55}
.hz-guess b{color:#fff;letter-spacing:.02em}
.hz-guess .ic{flex:none;width:20px;height:20px;color:var(--hz-c);margin-top:1px}

/* loading */
.hz-loading{display:grid;justify-items:center;text-align:center;gap:10px;padding:80px 20px 60px;color:#c9d2f5}
.hz-loadtxt{font-size:18px;letter-spacing:.12em;font-weight:600}
.hz-loadsub{font-size:13px;color:#8f9bc5;max-width:42ch}
.hz-orbit{position:relative;width:86px;height:86px}
.hz-orbit b{position:absolute;top:26px;right:26px;bottom:26px;left:26px;border-radius:50%;background:#000;box-shadow:0 0 0 2px hsl(var(--hz-h) 100% 80% / .7),0 0 24px hsl(var(--hz-h) 100% 60% / .8)}
.hz-orbit i{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:2px solid transparent;border-top-color:hsl(var(--hz-h) 100% 70%);border-bottom-color:hsl(calc(var(--hz-h) + 30) 100% 60% / .5);animation:hzspin 1.2s linear infinite}
@keyframes hzspin{to{transform:rotate(360deg)}}
.hz-prog{position:relative;width:min(380px,82vw);height:8px;border-radius:99px;background:rgba(143,155,197,.22);overflow:hidden;margin-top:6px}
.hz-prog i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,hsl(var(--hz-h) 100% 60%),hsl(calc(var(--hz-h) + 30) 100% 72%));box-shadow:0 0 10px hsl(var(--hz-h) 100% 60% / .6);transition:width .85s linear}
.hz-prog.wait i{width:34%;animation:hzslide 1.5s ease-in-out infinite;transition:none}
.hz-progtxt{font-size:13px;color:#b3bde3;font-variant-numeric:tabular-nums;min-height:1.3em}
.hz-topprog{position:sticky;top:0;z-index:6;height:3px;margin:0 0 -3px;background:rgba(143,155,197,.18);overflow:hidden}
.hz-topprog i{display:block;height:100%;width:0;background:linear-gradient(90deg,hsl(var(--hz-h) 100% 60%),hsl(calc(var(--hz-h) + 30) 100% 72%));transition:width .85s linear}
@keyframes hzslide{0%{margin-left:-34%}100%{margin-left:100%}}
@media (prefers-reduced-motion: reduce){.hz-prog i,.hz-topprog i{transition:none}.hz-prog.wait i{animation:none;width:34%;margin-left:33%}}

/* sidebar */
.hz-navval{margin-left:auto;font-size:11px;font-weight:700;padding:1px 7px;border-radius:99px;background:hsl(var(--hz-h,175) 70% 45% / .22);color:hsl(var(--hz-h,175) 90% 72%);border:1px solid hsl(var(--hz-h,175) 70% 55% / .5);font-variant-numeric:tabular-nums}
.hz-navval[hidden]{display:none}
.acard.hz-card{background:linear-gradient(135deg,rgba(40,20,90,.55),rgba(5,6,15,.9));border-color:rgba(150,120,255,.35)}

@media (max-width:1000px){
  .hz-hero{grid-template-columns:1fr;gap:6px}
  .hz-stage{max-width:500px}
  .hz-band{font-size:clamp(30px,8vw,48px)}
  .hz-note{max-width:none}
}
@media (max-width:760px){
  #hzOverlay{padding:0;align-items:stretch}
  .modal.hz{width:100%;max-height:100dvh;height:100dvh;border-radius:0;padding:0 16px 24px}
  .modal.hz .mhead{margin:0 -16px 4px;padding:12px 10px 8px 16px}
  .hz-grid{grid-template-columns:1fr}
  .hz-labels span{font-size:0}
  .hz-labels span.on{font-size:10.5px}
  .hz-tbl td:first-child{white-space:normal}
  .hz-tbl th:nth-child(3),.hz-tbl td:nth-child(3){display:none}
}
@media (prefers-reduced-motion:reduce){
  .hz-sig,.hz-mark,.hz-ring .fg,.modal.hz{transition:none}
  .hz-orbit i{animation-duration:6s}
}

/* Event Horizon at the top of "What's happening today?" (a dark cosmic card whatever the theme) */
.td-hz{--hz-h:175;position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"g i b" "f f f";gap:6px 18px;align-items:center;margin:0 0 14px;padding:14px 18px 12px;border-radius:18px;cursor:pointer;color:#e8ecff;
  background:radial-gradient(520px 200px at 8% 0%,hsl(var(--hz-h) 85% 38% / .30),transparent 65%),linear-gradient(180deg,#05060f,#0a0f22);border:1px solid hsl(var(--hz-h) 60% 60% / .38);box-shadow:0 10px 40px -18px hsl(var(--hz-h) 90% 45% / .6);transition:border-color .3s,transform .2s}
.td-hz:hover{border-color:hsl(var(--hz-h) 80% 65% / .7);transform:translateY(-1px)}
.td-hz.loading{grid-template-areas:"g i";grid-template-columns:auto minmax(0,1fr);cursor:default;--hz-h:175}
.td-hz.loading:hover{transform:none}
.td-hzg{grid-area:g;width:124px;height:124px;display:block;filter:drop-shadow(0 0 14px hsl(var(--hz-h) 90% 50% / .45))}
.td-hz .hz-orbit{grid-area:g;width:64px;height:64px;margin:0 24px}
.td-hz .hz-orbit b{top:20px;right:20px;bottom:20px;left:20px}
.td-hzi{grid-area:i;min-width:0}
.td-hzk{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.42em;font-weight:700;color:#9fabd6}
.td-hzk .ic{width:15px;height:15px;color:hsl(var(--hz-h) 92% 66%)}
.td-hzn{margin:2px 0 4px;font-size:clamp(24px,4vw,34px);font-weight:700;letter-spacing:.05em;line-height:1.1;color:hsl(var(--hz-h) 92% 64%);text-shadow:0 0 24px hsl(var(--hz-h) 92% 60% / .55)}
.td-hzx{font-size:13.5px;line-height:1.45;color:#c3ccef;max-width:60ch}
.td-hzc{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.td-hzd{display:inline-flex;gap:6px;align-items:center;font-size:12px;padding:3px 10px;border-radius:99px;background:rgba(255,255,255,.05);border:1px solid rgba(190,205,255,.14);border-left:3px solid var(--c);color:#c3ccef}
.td-hzd b{color:#f1f4ff;font-weight:600}
.td-hz .hz-chip{font-size:12px;padding:3px 10px}
.td-hzb{grid-area:b}
.td-hz .btn.ghost{background:rgba(255,255,255,.06);border-color:rgba(190,205,255,.25);color:#dfe5ff}
.td-hz .btn.ghost:hover{background:rgba(255,255,255,.12);border-color:hsl(var(--hz-h) 80% 65% / .7)}
.td-hzf{grid-area:f;margin-top:4px;padding-top:8px;border-top:1px solid rgba(190,205,255,.12);font-size:12px;line-height:1.45;color:#9aa6cf}
@media (max-width:760px){
  .td-hz{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"g i" "b b" "f f";gap:6px 12px;padding:12px 14px 10px}
  .td-hzg{width:88px;height:88px}
  .td-hzb .btn{width:100%}
  .td-hz.loading{grid-template-areas:"g i"}
  .td-hz .hz-orbit{margin:0 12px}
}
/* stage A: why it changed, data confidence, sources, history ranges */
.hz-why{border:1px solid rgba(190,205,255,.16);background:rgba(255,255,255,.04);border-left:3px solid rgba(190,205,255,.5);border-radius:12px;padding:12px 15px} .hz-why.w-up{border-left-color:#ff9a5c} .hz-why.w-down{border-left-color:#4ade99}
.hz-why p{margin:0;line-height:1.6;font-size:14.5px}
.hz-more{margin-top:10px} .hz-more summary{cursor:pointer;font-size:13px;color:#9db4ff}
.hz-why-tbl td.up{color:#ffb38a;font-weight:600} .hz-why-tbl td.down{color:#8ae6c4;font-weight:600} .hz-why-tbl .hz-sub td{opacity:.8;font-size:12.5px} .hz-why-tbl .hz-tot td{border-top:1px solid rgba(190,205,255,.3);font-weight:700}
.hz-why-tbl td:nth-child(n+2),.hz-why-tbl th:nth-child(n+2){text-align:right;white-space:nowrap}
.hz-conf{border:1px solid rgba(190,205,255,.16);border-radius:12px;padding:10px 14px;background:rgba(255,255,255,.03)} .hz-conf summary{cursor:pointer;display:flex;flex-direction:column;gap:2px;font-size:14px} .hz-conf summary small{font-size:11.5px;opacity:.7}
.hz-conf.high .hz-cs b{color:#4ade99} .hz-conf.moderate .hz-cs b{color:#f5b94a} .hz-conf.low .hz-cs b{color:#ff8585}
.hz-cbar{display:grid;grid-template-columns:104px 1fr 34px;gap:10px;align-items:center;font-size:12.5px;margin:7px 0} .hz-cbar i{display:block;height:8px;border-radius:99px;background:rgba(255,255,255,.1);position:relative;overflow:hidden} .hz-cbar i b{position:absolute;left:0;top:0;bottom:0;background:#6aa6ff;border-radius:99px} .hz-cbar em{font-style:normal;text-align:right;font-variant-numeric:tabular-nums}
.hz-cchip{text-decoration:none;color:inherit;cursor:pointer} .hz-cchip.high{border-color:rgba(74,222,153,.45);background:rgba(74,222,153,.1)} .hz-cchip.moderate{border-color:rgba(245,185,74,.5);background:rgba(245,185,74,.1)} .hz-cchip.low{border-color:rgba(255,133,133,.55);background:rgba(255,133,133,.1)}
.hz-srcs{list-style:none;margin:6px 0 0;padding:0} .hz-srcs li{font-size:12px;padding:6px 0;border-top:1px solid rgba(190,205,255,.1);display:flex;flex-wrap:wrap;gap:3px 9px;align-items:baseline}
.hz-sstate{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:1px 8px;border-radius:99px;border:1px solid} .hz-sstate.live{color:#4ade99;border-color:rgba(74,222,153,.45)} .hz-sstate.stale{color:#f5b94a;border-color:rgba(245,185,74,.5)} .hz-sstate.unavailable{color:#ff8585;border-color:rgba(255,133,133,.5)}
.hz-pill{font-weight:600;color:#f5b94a}
.hz-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 10px} .hz-tab{font:inherit;font-size:12.5px;padding:5px 12px;border-radius:99px;border:1px solid rgba(190,205,255,.2);background:rgba(255,255,255,.05);color:inherit;cursor:pointer} .hz-tab.on{background:rgba(120,160,255,.22);border-color:rgba(150,180,255,.55)} .hz-tab.hz-mode{margin-left:auto}

/* v1.52.0 significant events and the standing / now bar */
.hz-evl{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.hz-evi{border:1px solid rgba(255,255,255,.08);border-left:3px solid var(--c,#8aa);border-radius:10px;padding:9px 12px;background:rgba(255,255,255,.025)}
.hz-evi.sev3{border-left-width:5px}
.hz-evt{font-size:14px;line-height:1.35;color:#e8ecff}
.hz-evt a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,.35)}
.hz-evm{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:5px;font-size:11.5px;color:#8f9bc5}
.hz-evm .hz-evsev{font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--c,#8aa)}
.hz-evfam{display:inline-flex;align-items:center;gap:5px}
.hz-evfam i{width:8px;height:8px;border-radius:50%;display:inline-block}
.hz-evtr.growing{color:#ffd23f}
.hz-dim{margin:6px 0 10px}
.hz-dimbar{display:flex;height:8px;border-radius:99px;overflow:hidden;gap:2px;margin:6px 0 4px;background:rgba(255,255,255,.05)}
.hz-dimbar i{display:block;height:100%}
.hz-dimbar i.s{background:rgba(255,255,255,.28)}
.hz-dimbar i.c{background:var(--c,#8aa)}
.hz-pill.hz-up{color:#ffd23f}
.hz-evst{font-style:italic;color:#c9b27c}

/* v1.54.0 the planet and its people */
.hz-planet{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.hz-pl{border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:13px 15px;background:rgba(255,255,255,.025);min-width:0}
.hz-plw{grid-column:span 2}
@media (max-width:760px){ .hz-plw{grid-column:span 1} }
.hz-plh{font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:#8f9bc5;margin-bottom:6px}
.hz-plh i{font-style:normal;text-transform:none;letter-spacing:0;color:#ffd23f;font-size:11px;margin-left:6px}
.hz-plbig{font-size:clamp(22px,3.2vw,30px);font-weight:300;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.01em;margin-bottom:4px;word-break:break-word}
.hz-iceR{margin:6px 0 10px}
.hz-iceT{display:flex;justify-content:space-between;gap:8px;font-size:13px;flex-wrap:wrap} .hz-iceT span{color:#8f9bc5}
.hz-icebar{position:relative;height:9px;border-radius:99px;background:rgba(255,255,255,.07);margin:6px 0 4px;overflow:visible}
.hz-icebar i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#4dc3ff,#9ae4ff)}
.hz-icebar u{position:absolute;top:-3px;bottom:-3px;width:2px;background:#fff;opacity:.8;text-decoration:none}
/* the Australian view (v1.68.0) */
.hz-seg{display:inline-flex;gap:4px;padding:4px;border-radius:99px;background:rgba(255,255,255,.06);border:1px solid rgba(190,205,255,.16);margin:0 0 12px}
.hz-seg button{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:99px;padding:6px 14px;font:inherit;font-size:13px;color:#c3ccef;background:transparent;cursor:pointer}
.hz-seg button b{font-size:15px;color:#fff}
.hz-seg button.on{background:rgba(120,160,255,.22);color:#fff;box-shadow:0 0 0 1px rgba(150,180,255,.45) inset}
.hz-aut{margin-top:10px;font-size:13px;color:#c3ccef}
.hz-aut b{color:#fff;font-size:16px}
.hz-compare .hz-note{margin:0 0 10px}
.hz-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin:8px 0 10px}
.hz-grp{padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(190,205,255,.14);display:flex;flex-direction:column;gap:2px}
.hz-grp b{font-size:20px;color:#fff;line-height:1}
.hz-grp span{font-size:12px;color:#aab4d8}
.hz-evexp{display:inline-block;font-size:11.5px;padding:2px 8px;border-radius:99px;background:rgba(120,200,255,.14);border:1px solid rgba(120,200,255,.35);color:#bfe6ff;margin-right:6px}
@media (max-width:420px){.hz-seg{display:flex;width:100%}.hz-seg button{flex:1;justify-content:center;padding:7px 8px;font-size:12.5px}}
.hz-evfac{display:inline-block;font-size:11px;padding:2px 7px;border-radius:99px;background:rgba(255,255,255,.06);border:1px solid rgba(190,205,255,.16);color:#aab4d8;margin-right:6px}

/* the country views (v1.70.0): the switch, the list of twenty, the tiles, the flags */
.hz-flag{display:inline-block;width:30px;height:20px;flex:none;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.22);vertical-align:middle}
.hz-seg{flex-wrap:wrap}
.hz-seg .hz-flag{width:22px;height:15px;border-radius:2px}
.hz-seg button.hz-segmore{gap:5px;padding-left:12px;padding-right:12px}
.hz-seg button.hz-segmore svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s}
.hz-seg button.hz-segmore.on svg{transform:rotate(180deg)}
.hz-picker,.hz-cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:8px;margin:0 0 14px}
.hz-picker{margin:-4px 0 16px;padding:10px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(190,205,255,.12)}
.hz-ctile{display:grid;grid-template-columns:30px 1fr auto;grid-template-areas:"f n s" "f b s" "f d d";gap:0 9px;align-items:center;padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(190,205,255,.14);color:#dfe6ff;font:inherit;text-align:left;min-width:0}
button.hz-ctile{cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
button.hz-ctile:hover{background:rgba(120,160,255,.13);border-color:rgba(150,180,255,.45);transform:translateY(-1px)}
button.hz-ctile:focus-visible{outline:2px solid #9db4ff;outline-offset:2px}
.hz-ctile.on{background:rgba(120,160,255,.16);box-shadow:0 0 0 1.5px var(--lv) inset}
.hz-ctile .hz-flag{grid-area:f;align-self:start;margin-top:2px}
.hz-ctile .hz-cn{grid-area:n;font-size:13px;line-height:1.2;color:#fff;overflow:hidden;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.hz-ctile b{grid-area:s;font-size:24px;line-height:1;font-weight:300;color:var(--lv);text-shadow:0 0 16px var(--lv)}
.hz-ctile em{grid-area:b;font-style:normal;font-size:10.5px;letter-spacing:.08em;color:#9fabd6;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hz-ctile small{grid-area:d;justify-self:start;font-size:10.5px;color:#7d8bb8;margin-top:3px}
.hz-ctile i{grid-area:d;justify-self:end;font-style:normal;font-size:11px;margin-top:3px;color:#c3ccef}
.hz-ctile i.up{color:#ffb38a} .hz-ctile i.down{color:#8ae6c4}
.hz-sortrow{display:flex;gap:6px;margin:2px 0 10px}
.hz-ctyload{margin:0 0 12px;color:#9fabd6}
.hz-chip.hz-cov{border-color:rgba(120,200,255,.35);background:rgba(90,170,255,.1);color:#bfe3ff}
.hz-pill.hz-direct{color:#7be0b0}
.hzpub .hz-ctile.static{cursor:default}
@media (max-width:420px){.hz-picker,.hz-cgrid{grid-template-columns:1fr 1fr}.hz-ctile b{font-size:21px}}
/* what changed and alerts (v1.72.0) */
.hz-moves{margin:6px 0 12px}
.hz-mvh{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#9fb0e6;margin-bottom:6px}
.hz-mvrow{display:flex;flex-wrap:wrap;gap:8px}
.hz-move{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid rgba(143,155,197,.35);background:rgba(20,26,56,.6);color:#e8ecff;font:inherit;font-size:13px;cursor:default}
button.hz-move{cursor:pointer}
button.hz-move:hover{border-color:hsl(var(--hz-h) 80% 65%)}
.hz-move small{color:#aab4dc;font-size:11.5px}
.hz-move i{font-style:normal;font-variant-numeric:tabular-nums;font-weight:600}
.hz-move.up .hz-mv-a,.hz-move.up i{color:hsl(28 92% 62%)}
.hz-move.down .hz-mv-a,.hz-move.down i{color:hsl(165 70% 58%)}
.hz-moves0{margin:6px 0 12px}
.hz-alerts{margin-top:12px}
.hz-alerts-btns{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.hz-alert-list{margin:6px 0 0 18px;padding:0}
.hz-alert-list li{margin:4px 0}
.hz-alert-list small{color:#8f9bc5}

/* the projection (v1.75.0) */
.hz-prows{display:grid;gap:14px;margin:6px 0 4px}
.hz-prow{padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(190,205,255,.1)}
.hz-pt{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.hz-pt b{font-size:14px;color:#f1f4ff}
.hz-pv{font-size:22px;font-weight:300;color:#e8ecff;font-variant-numeric:tabular-nums}
.hz-pr{font-size:12.5px;color:#9fabd6}
.hz-pbar{position:relative;height:12px;margin:10px 0 2px;border-radius:99px;background:rgba(255,255,255,.07);overflow:visible}
.hz-prange{position:absolute;top:0;height:100%;border-radius:99px;background:rgba(150,185,255,.38)}
.hz-pnow{position:absolute;top:-3px;width:2px;height:18px;background:#fff;opacity:.8;border-radius:2px}
.hz-pmean{position:absolute;top:50%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#9ecbff;border:2px solid #0d1226}
.hz-psig{margin:10px 0 0;display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.hz-pchip{display:inline-flex;font-size:12.5px;padding:4px 10px;border-radius:99px;background:rgba(255,255,255,.06);border:1px solid rgba(190,205,255,.16);color:#c3ccef;font-variant-numeric:tabular-nums}
.hz-pwarn{margin:12px 0 0;padding:10px 14px;border-radius:12px;background:rgba(255,160,70,.09);border:1px solid rgba(255,170,90,.35);color:#ffd9b0;font-size:13px;line-height:1.5}
.hz-pwarn ul{margin:6px 0 0;padding-left:18px}

/* the updates log (v1.76.0) */
.hz-updl{display:grid;gap:12px;margin:10px 0 4px;max-height:60vh;overflow:auto;padding-right:4px}
.hz-upd{padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(190,205,255,.1);border-left:3px solid rgba(150,185,255,.4)}
.hz-upd.step{border-left-color:hsl(40 90% 60%)}
.hz-updh{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.hz-updh b{font-size:14px;color:#f1f4ff}
.hz-updh span{font-size:12.5px;color:#9fabd6}
.hz-updh em,.hz-stepnote{font-style:normal;font-size:11.5px;padding:2px 8px;border-radius:99px;background:rgba(255,255,255,.07);border:1px solid rgba(190,205,255,.16);color:#c3ccef}
.hz-updh em.new{background:rgba(120,200,255,.14);border-color:rgba(120,200,255,.4);color:#bfe6ff}
.hz-updh em.stp,.hz-stepnote{background:rgba(255,190,80,.12);border-color:rgba(255,190,80,.4);color:#ffdca3}
.hz-upd ul{margin:6px 0 0;padding-left:18px;font-size:13px;color:#aab5dc;line-height:1.5}
.hz-upd li{margin:0 0 4px}