:root{font-family:Arial,Noto Sans SC,sans-serif;color:#271d17;background:#f1d54b}*{box-sizing:border-box}body{margin:0;min-width:320px}.field{min-height:100vh;background:#f1d54b}header{padding:28px 5vw 36px}.eyebrow{font-size:10px;letter-spacing:.25em;border-bottom:1px solid;padding-bottom:12px}.hero{display:grid;grid-template-columns:1fr 1.4fr 150px;align-items:end;gap:40px;padding-top:28px}.hero h1{font-size:clamp(70px,10vw,150px);line-height:.63;letter-spacing:-.08em;margin:0}.hero h1 i{font-family:Georgia,serif;font-weight:400}.hero p{font-size:16px;line-height:1.7;margin:0}.big-db{width:130px;height:130px;background:#e34b2f;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;transform:rotate(6deg)}.big-db b{font-size:42px}.big-db span{font-size:10px}.caution{background:#271d17;color:#f6e991;display:flex;gap:18px;align-items:center;padding:15px 5vw}.caution>b{width:32px;height:32px;border:1px solid;border-radius:50%;display:grid;place-items:center}.caution p{margin:0;font-size:12px;line-height:1.5}.caution strong{color:#fff}nav{display:flex;padding:22px 5vw 12px;gap:8px;overflow:auto}nav button{border:1px solid;background:transparent;border-radius:99px;padding:9px 16px;white-space:nowrap;cursor:pointer}nav button.active{background:#271d17;color:#f1d54b}.fav{margin-left:auto}main{padding:10px 5vw 34px}.scale-head{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em;margin-bottom:8px}.scale-head b{font-size:13px}.chart{height:460px;background:#f6e780;border:1px solid;position:relative;overflow:hidden}.baseline{position:absolute;top:52%;left:8%;right:8%;height:2px;background:#271d17}.tick{position:absolute;top:0;height:100%;transform:translate(-50%)}.tick i{height:100%;width:1px;background:#2b201526;display:block}.tick span{position:absolute;bottom:10px;left:5px;font:10px monospace}.chart article{position:absolute;transform:translate(-50%,-50%);z-index:2}.dot{width:58px;height:58px;border:2px solid #271d17;border-radius:50%;background:#f1d54b;cursor:pointer;font-size:19px;box-shadow:4px 4px #271d17}.chart article:nth-of-type(n+7) .dot{background:#e34b2f;color:#fff}.chart article.active{z-index:6}.chart article.active .dot{transform:scale(1.13);background:#271d17;color:#f1d54b}.label{position:absolute;left:50%;transform:translate(-50%);top:65px;text-align:center;white-space:nowrap}.label b,.label em{display:block}.label b{font-size:11px}.label em{font:10px monospace;margin-top:3px}.card{position:absolute;left:76px;top:-40px;width:320px;background:#fff9db;border:2px solid;padding:18px;box-shadow:8px 8px #271d17}.card.left{left:auto;right:76px}.card>button{float:right;border:0;background:none;font-size:24px;cursor:pointer}.card small{font-size:9px;letter-spacing:.12em}.card h2{font-family:Georgia,serif;font-size:25px;margin:8px 0 15px}.card h2 i{font:13px monospace;color:#e34b2f}.card dl{margin:0}.card dl div{display:grid;grid-template-columns:68px 1fr;border-top:1px solid #b8ab88;padding:7px 0;font-size:11px}.card dt{color:#776b55}.card dd{margin:0}.empty{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.empty span{font-size:12px}.legend{display:flex;gap:22px;align-items:center;padding-top:15px;font-size:10px}.legend span{display:flex;align-items:center;gap:6px}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;background:#f1d54b;border:1px solid}.legend .aware{background:#e89c36}.legend .protect{background:#e34b2f}.legend p{margin-left:auto}footer{background:#e34b2f;color:#fff;display:grid;grid-template-columns:repeat(3,1fr);padding:18px 5vw;font-size:10px;letter-spacing:.1em}footer div{border-right:1px solid #ffffff66;padding-right:20px}footer div+div{padding-left:20px}@media(max-width:760px){.hero{grid-template-columns:1fr 100px}.hero p{grid-column:1/-1;grid-row:2}.big-db{width:96px;height:96px}.big-db b{font-size:30px}.hero h1{font-size:80px}.fav{margin-left:0}.chart{height:580px;overflow:visible}.chart article{top:var(--mobile-top)}.card,.card.left{position:fixed;left:16px;right:16px;top:auto;bottom:16px;width:auto;z-index:20}.legend{align-items:flex-start;flex-wrap:wrap}.legend p{margin:0;width:100%}footer{grid-template-columns:1fr;gap:8px}footer div,footer div+div{border:0;padding:0}}
