.popularity{padding-top:24px;padding-bottom:36px;--pop-bg:#fff;--pop-soft:#f7f8fa;--pop-line:#e6e9ee;--pop-text:#263343;--pop-muted:#778294;color:var(--pop-text)}
.dark .popularity{--pop-bg:#1b1d21;--pop-soft:#22252a;--pop-line:#333841;--pop-text:#e1e7ef;--pop-muted:#9ca7b7}
.popularity [hidden]{display:none!important}.pop-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:30px;border:1px solid var(--pop-line);border-radius:8px;background:linear-gradient(120deg,var(--pop-bg),var(--pop-soft));border-top:3px solid #d5ac62}.pop-eyebrow{font-size:11px;letter-spacing:2px;color:#a17b3e}.pop-hero h1{font-size:30px;font-weight:600;margin:8px 0 10px}.pop-hero p{font-size:14px;margin:0 0 9px}.pop-hero p.pop-disclaimer{margin:0;font-size:12px;color:var(--pop-muted)}.pop-link{border:1px solid var(--pop-line);padding:10px 15px;border-radius:4px;background:var(--pop-bg);font-size:12px;white-space:nowrap}
#pop-status{padding:16px;color:var(--pop-muted);font-size:13px}.pop-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.pop-summary article{padding:17px 20px;border:1px solid var(--pop-line);background:var(--pop-bg);border-radius:6px}.pop-summary small,.pop-summary span{display:block;color:var(--pop-muted);font-size:11px}.pop-summary b{display:block;font-size:29px;font-weight:600;font-variant-numeric:tabular-nums;margin:5px 0}.pop-summary b.pop-date{font-size:23px;line-height:1.9}
.pop-board{border:1px solid var(--pop-line);border-radius:6px;background:var(--pop-bg);overflow:hidden}.pop-controls{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 20px 8px}.pop-tabs{display:flex;background:var(--pop-soft);padding:3px;border-radius:5px;gap:3px}.pop-tabs button{padding:8px 17px;font-size:13px;border-radius:3px;white-space:nowrap}.pop-tabs button[aria-pressed=true]{background:var(--pop-bg);color:#3068b1;box-shadow:0 1px 5px #0001;font-weight:600}.pop-controls label{font-size:12px;color:var(--pop-muted)}.pop-controls select{padding:7px 10px;margin-left:8px;border:1px solid var(--pop-line);border-radius:4px;background:var(--pop-bg);color:var(--pop-text)}.pop-method{margin:8px 20px 16px;color:var(--pop-muted);font-size:12px}.pop-table-wrap{overflow-x:auto}.pop-board table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}.pop-board th{background:var(--pop-soft);color:var(--pop-muted);font-weight:400;font-size:11px;padding:11px 20px}.pop-board td{padding:15px 20px;border-top:1px solid var(--pop-line);font-variant-numeric:tabular-nums}.pop-board tbody tr:hover{background:var(--pop-soft)}.pop-board td strong{font-weight:500;white-space:nowrap}.pop-board td small{display:block;font-size:10px;color:var(--pop-muted);margin-top:3px}.pop-rank{width:65px;color:var(--pop-muted)}.pop-rank.is-top{color:#b4893c;font-size:17px;font-weight:600}.pop-bar-cell{width:40%}.pop-bar{height:7px;border-radius:2px;background:var(--pop-soft);overflow:hidden}.pop-bar i{display:block;height:100%;background:var(--job-color);border-radius:2px}.pop-count,.pop-share{white-space:nowrap}.pop-share{color:var(--pop-muted)}.pop-empty{text-align:center;padding:20px;color:var(--pop-muted);font-size:13px}
.pop-reading{display:grid;grid-template-columns:1fr 1.5fr;gap:16px;font-size:12px;line-height:1.75;color:var(--pop-muted)}.pop-note{min-width:0;padding:20px;border:1px solid var(--pop-line);border-radius:6px;background:var(--pop-bg)}.pop-note-heading{display:flex;align-items:center;gap:10px;margin-bottom:16px}.pop-note-heading h2{margin:0 0 2px;font-size:14px;font-weight:600;color:var(--pop-text)}.pop-note-heading div>span{font-size:11px}.pop-note-icon{display:grid;place-items:center;flex:0 0 32px;height:32px;border:1px solid var(--pop-line);background:var(--pop-soft);border-radius:4px;font-size:20px;color:#6584ab}.pop-guide .pop-note-icon{color:#a17b3e}.pop-note-badge{margin-left:auto;white-space:nowrap;padding:2px 7px;background:var(--pop-soft);border:1px solid var(--pop-line);border-radius:3px;font-size:10px}.pop-guide-steps{list-style:none;padding:0;margin:0;display:grid;gap:12px}.pop-guide-steps li{display:flex;gap:12px;align-items:flex-start}.pop-guide-steps li>span{font-size:11px;font-variant-numeric:tabular-nums;color:#a17b3e;background:var(--pop-soft);border-radius:3px;padding:1px 6px;margin-top:1px}.pop-guide-steps h3{font-size:12px;font-weight:500;color:var(--pop-text);margin:0}.pop-guide-steps p{margin:2px 0 0}.pop-guide-tip{padding:10px 12px;margin:16px 0 0;background:var(--pop-soft);border-left:2px solid #d5ac62;border-radius:0 3px 3px 0;font-size:11px}.pop-rules{margin:0}.pop-rules>div{display:grid;grid-template-columns:76px 1fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--pop-line)}.pop-rules>div:first-child{padding-top:0}.pop-rules>div:last-child{border-bottom:0;padding-bottom:0}.pop-rules dt{font-weight:500;color:var(--pop-text)}.pop-rules dd{margin:0}.pop-note #pop-excluded:empty{display:none}.pop-note #pop-excluded:not(:empty){margin:12px 0 0;padding-top:10px;border-top:1px solid var(--pop-line)}.popularity button:focus-visible,.popularity a:focus-visible,.popularity select:focus-visible{outline:2px solid #4c84c3;outline-offset:2px}
@media(max-width:640px){.pop-hero{padding:20px;align-items:flex-start;flex-direction:column;gap:15px}.pop-hero h1{font-size:25px}.pop-summary{gap:7px}.pop-summary article{padding:12px 9px}.pop-summary b{font-size:22px}.pop-summary b.pop-date{font-size:14px;line-height:2.4}.pop-controls{padding:13px 10px 6px;align-items:flex-start;flex-direction:column}.pop-tabs button{padding:8px 13px}.pop-method{margin:8px 12px 13px}.pop-board td,.pop-board th{padding:11px 9px}.pop-rank{width:35px}.pop-bar-cell{width:22%}.pop-reading{grid-template-columns:1fr;row-gap:.75rem}.pop-summary span{font-size:10px}}

@media(max-width:800px){.pop-reading{grid-template-columns:1fr;row-gap:.75rem}.pop-note{padding:16px}.pop-rules>div{grid-template-columns:70px 1fr;gap:10px}}
