html{--ayw:rgb(120 104 15);--sfyw:rgb(255 255 255);--bdyw:rgb(209 222 235);--gyw:1.15rem;--p2yw:rgb(78 106 177);--pyw:rgb(72 115 157);--ryw:6px;--wyw:1140px;--bgyw:rgb(242 247 252);--hfyw:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;--fyw:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;--muyw:rgb(76 102 118);--ptyw:rgb(53 84 115);--onyw:rgb(248 250 251);--fgyw:rgb(20 39 52)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:3.6rem;-webkit-text-size-adjust:100%}
body{overflow-wrap:anywhere;background:var(--bgyw);color:var(--fgyw);font:16px/1.75 var(--fyw);margin:0}
a{color:var(--ptyw);text-underline-offset:3px}
a:focus-visible,summary:focus-visible{outline:2px solid var(--ptyw);outline-offset:3px;border-radius:2px}
svg{display:block}
h1,h3,h2{color:var(--fgyw);line-height:1.3;font-family:var(--hfyw);margin:0}
.skipyw{left:-999px;top:0;position:absolute}
.skipyw:focus{background:var(--sfyw);left:.9rem;top:.9rem;padding:.45rem .9rem;z-index:20}
.progressyw{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--ayw);transform:scaleX(0);transform-origin:0 50%;z-index:15}
.shellyw{padding:0 .9rem;margin:0 auto;max-width:var(--wyw)}
/* masthead */
.mastyw{padding:calc(var(--gyw)*1.2) 0 0}
.datelineyw{gap:.9rem;display:flex;flex-wrap:wrap;color:var(--muyw);letter-spacing:.06em;font-size:.7rem;justify-content:space-between;border-bottom:1px solid var(--bdyw);padding-bottom:.45rem}
.brandyw{display:flex;color:var(--fgyw);text-decoration:none;padding:calc(var(--gyw)*1.4) 0 calc(var(--gyw)*1.1);justify-content:center;align-items:center;gap:.7rem}
.brandyw .logoyw{width:44px;height:44px;flex:none}
.brandyw b{line-height:1.1;letter-spacing:.04em;font-weight:800;font-family:var(--hfyw);font-size:clamp(1.7rem,5.4vw,3.05rem)}
.ruleyw{border-top:3px solid var(--fgyw);height:6px;border-bottom:1px solid var(--fgyw);margin:0}
/* category bar */
.catsyw{background:var(--bgyw);position:sticky;top:0;border-bottom:1px solid var(--bdyw);z-index:10}
.catsyw ul{display:flex;overflow-x:auto;padding:0 .9rem;margin:0 auto;list-style:none;max-width:var(--wyw);gap:.2rem;scrollbar-width:none}
.catsyw ul::-webkit-scrollbar{display:none}
.catsyw a{color:var(--fgyw);text-decoration:none;font-weight:600;display:block;padding:.65rem .75rem;border-bottom:2px solid transparent;white-space:nowrap;font-size:.8rem}
.catsyw a:hover{color:var(--ptyw);border-bottom-color:var(--pyw)}
.catsyw li:first-child a{padding-left:0}
/* body grid */
.bodyyw{display:grid;padding-top:calc(var(--gyw)*2.2);gap:calc(var(--gyw)*3);padding-bottom:calc(var(--gyw)*3);grid-template-columns:minmax(0,1fr) 300px}
.mainyw{min-width:0}
.kickeryw{margin:0 0 .7rem;font-weight:700;display:inline-block;font-size:.7rem;color:var(--ayw);text-transform:uppercase;letter-spacing:.18em}
.kickeryw::before{margin-right:.55rem;background:var(--ayw);vertical-align:middle;content:"";display:inline-block;height:2px;width:1.45rem}
.leadyw h1{letter-spacing:-.005em;font-weight:800;font-size:clamp(1.6rem,4.6vw,2.7rem);line-height:1.18}
.dekyw{color:var(--muyw);font-size:1.05rem;margin:.9rem 0 0;line-height:1.7;max-width:40em}
.bylineyw{margin:1rem 0 0;display:flex;flex-wrap:wrap;padding:.65rem 0;color:var(--muyw);font-size:.75rem;border-top:1px solid var(--bdyw);border-bottom:1px solid var(--bdyw);gap:.35rem 1.1rem}
.coveryw{margin:calc(var(--gyw)*1.6) 0 0}
.cover-artyw{border-radius:var(--ryw);aspect-ratio:3/2;background:linear-gradient(135deg,color-mix(in srgb,var(--pyw) 16%,var(--bgyw)),color-mix(in srgb,var(--p2yw) 6%,var(--sfyw)));overflow:hidden}
.cover-artyw .decoryw{height:100%;width:100%}
.coveryw figcaption{color:var(--muyw);margin-top:.45rem;padding-left:.65rem;font-size:.7rem;border-left:2px solid var(--ayw)}
/* reading */
.readyw{margin-top:calc(var(--gyw)*2.4)}
.articleyw{line-height:1.95;font-size:.95rem;font-family:var(--hfyw);max-width:40em}
.articleyw+.articleyw{margin-top:calc(var(--gyw)*2.6);border-top:1px solid var(--bdyw);padding-top:calc(var(--gyw)*2.2)}
.articleyw h2{font-weight:800;margin-bottom:.9rem;font-size:clamp(1.25rem,3vw,1.65rem)}
.articleyw h3{margin:1.6rem 0 .35rem;border-left:3px solid var(--pyw);padding-left:.65rem;font-size:1.05rem}
.articleyw p{margin:0 0 .95rem}
.articleyw ul,.articleyw ol{margin:0 0 1rem;padding-left:1.15rem}
.articleyw li{margin:.25rem 0}
.articleyw li::marker{color:var(--ptyw)}
.articleyw>p:first-of-type::first-letter{color:var(--ptyw);margin:.08em .12em 0 0;font-weight:800;font-size:3.3em;line-height:.9;float:left}
/* sections in main */
.secyw{margin-top:calc(var(--gyw)*3.2)}
.sec-hyw{display:flex;margin-bottom:1.1rem;border-top:3px solid var(--fgyw);align-items:baseline;padding-top:.55rem;gap:.7rem}
.sec-hyw h2{font-size:1.3rem;font-weight:800}
.sec-hyw span{color:var(--muyw);font-size:.7rem;letter-spacing:.16em;white-space:nowrap}
.subyw{font-size:.85rem;color:var(--muyw);margin:-.4rem 0 1.15rem}
.pullsyw{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--gyw)*1.2)}
.noteyw{background:var(--sfyw);position:relative;border-radius:0 0 var(--ryw) var(--ryw);padding:1.45rem 1rem 1rem;border-top:4px solid var(--pyw)}
.noteyw.conyw{border-top-color:var(--ayw)}
.noteyw.tip-nyw{border-top-color:var(--muyw)}
.noteyw::before{color:color-mix(in srgb,var(--pyw) 35%,transparent);content:"\201C";position:absolute;right:.8rem;top:-.1rem;font:800 3.25rem/1 var(--hfyw)}
.verdictyw{letter-spacing:.1em;color:var(--ptyw);font-weight:700;font-size:.65rem}
.noteyw.conyw .verdictyw{color:var(--ayw)}
.noteyw h3{font-size:1rem;line-height:1.45;margin:.3rem 0 .4rem}
.noteyw p{font-size:.85rem;color:var(--muyw);margin:0}
.stepsetyw h3{font-size:1rem;margin-bottom:.7rem}
.stepsyw{counter-reset:styw;list-style:none;padding:0;margin:0}
.stepsyw li{position:relative;margin-left:.9rem;border-left:1px dashed var(--bdyw);padding:0 0 1rem 2.7rem;counter-increment:styw}
.stepsyw li:last-child{border-left-color:transparent}
.stepsyw li::before{content:counter(styw);position:absolute;left:-1rem;top:0;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--bgyw);border:2px solid var(--pyw);display:grid;place-items:center;font-weight:800;font-size:.8rem;color:var(--ptyw)}
.stepsyw strong,.stepsyw b{padding-top:.2rem;display:block}
.stepsyw p{font-size:.85rem;color:var(--muyw);margin:.2rem 0 0}
.tablewrapyw{overflow-x:auto;border:1px solid var(--bdyw);border-radius:var(--ryw)}
.compareyw{width:100%;border-collapse:collapse;font-size:.85rem;min-width:27rem}
.compareyw caption{padding:.65rem .8rem;caption-side:top;font-weight:700;text-align:left}
.compareyw td,.compareyw th{border-top:1px solid var(--bdyw);vertical-align:top;text-align:left;padding:.55rem .8rem}
.compareyw thead th{background:var(--sfyw);letter-spacing:.04em;font-size:.75rem}
.compareyw tbody th{font-weight:600}
.lettersyw{display:grid;gap:0}
.letteryw{padding:.9rem 0;border-bottom:1px solid var(--bdyw)}
.letteryw h3{display:flex;font-size:.95rem;gap:.55rem}
.letteryw h3::before{display:grid;border-radius:var(--ryw);width:1.35rem;margin-top:.1rem;background:var(--pyw);place-items:center;font-size:.7rem;height:1.35rem;content:"问";flex:none;color:var(--onyw)}
.letteryw p{color:var(--muyw);margin:.4rem 0 0 1.9rem}
/* sidebar */
.sideyw{display:flex;min-width:0;flex-direction:column;gap:calc(var(--gyw)*1.8)}
.latestyw h2,.boxyw h2{margin:0 0 .7rem;font-family:var(--fyw);font-weight:800;font-size:.7rem;padding-bottom:.4rem;border-bottom:2px solid var(--fgyw);letter-spacing:.18em}
.dlyw{background:var(--sfyw);border:1px solid var(--bdyw);border-radius:var(--ryw);padding:1rem}
.dlyw h2{border-bottom-color:var(--pyw)}
.dlyw p{margin:0 0 .7rem;color:var(--muyw);font-size:.75rem}
.dlyw ul{grid-template-columns:1fr 1fr;display:grid;list-style:none;gap:.45rem;padding:0;margin:0}
.dlyw a{display:flex;align-items:center;gap:.4rem;padding:.55rem .6rem;border-radius:var(--ryw);background:var(--bgyw);border:1px solid var(--bdyw);color:var(--fgyw);text-decoration:none;font-size:.8rem;font-weight:600}
.dlyw a:hover{border-color:var(--pyw)}
.dlyw svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--ptyw);stroke-width:1.8}
.glossyw{display:grid;gap:.7rem;margin:0}
.glossyw dt{font-size:.85rem;font-weight:700}
.glossyw dd{color:var(--muyw);margin:.1rem 0 0;font-size:.75rem;line-height:1.6}
.relyw{display:flex;flex-direction:column}
.relyw a{font-size:.85rem;color:var(--fgyw);text-decoration:none;padding:.45rem 0;border-bottom:1px dotted var(--bdyw)}
.relyw a::before{margin-right:.45rem;color:var(--ptyw);content:"→"}
.relyw a:hover{color:var(--ptyw)}
.latestyw ul{counter-reset:ltyw;list-style:none;padding:0;margin:0}
.latestyw li{font-size:.85rem;display:flex;line-height:1.5;counter-increment:ltyw;gap:.65rem;border-bottom:1px solid var(--bdyw);padding:.5rem 0}
.latestyw li::before{min-width:1rem;content:counter(ltyw);font:800 1.15rem/1 var(--hfyw);color:var(--ayw)}
.latestyw a{color:var(--fgyw);text-decoration:none}
.latestyw a:hover{color:var(--ptyw);text-decoration:underline}
.tagsyw{display:flex;flex-wrap:wrap;gap:.35rem}
.tagsyw a{font-size:.75rem;padding:.25rem .6rem;border:1px solid var(--bdyw);border-radius:999px;color:var(--muyw);text-decoration:none}
.tagsyw a:nth-child(3n+1){font-size:.85rem;color:var(--fgyw)}
.tagsyw a:hover{border-color:var(--pyw);color:var(--ptyw)}
/* colophon */
.colophonyw{color:var(--muyw);text-align:center;padding:calc(var(--gyw)*2) .9rem calc(var(--gyw)*2.4);font-size:.75rem;border-top:1px solid var(--bdyw)}
.colophonyw .logoyw{width:28px;height:28px;margin:0 auto .45rem}
.colophonyw b{font-size:1rem;color:var(--fgyw);letter-spacing:.05em;display:block;font-family:var(--hfyw)}
.colophonyw p{margin:.25rem 0}
@media (max-width:900px){
.bodyyw{gap:calc(var(--gyw)*2.6);grid-template-columns:minmax(0,1fr)}
.sideyw{display:grid;grid-template-columns:repeat(auto-fit,minmax(13.5rem,1fr))}
}
@media (max-width:560px){
body{font-size:15px}
.pullsyw{grid-template-columns:minmax(0,1fr)}
.articleyw{line-height:1.85;font-size:.9rem}
.datelineyw span:last-child{display:none}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.progressyw{display:none}}
.mast2-inyw{gap:.9rem;display:flex;padding:.8rem 0 .7rem;border-bottom:3px double var(--fgyw);justify-content:space-between;align-items:center}
.mast2yw .brandyw{padding:0;justify-content:flex-start}
.mast2yw .brandyw b{font-size:clamp(1.25rem,3.4vw,1.9rem)}
.mast2yw .datelineyw{align-items:flex-end;flex-direction:column;border:0;gap:.1rem;padding:0}
.mast3yw .brandyw{padding-top:1.1rem}
.pulls-1yw{grid-template-columns:1fr}
.letters-2yw{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem}
.colophon2yw{grid-template-columns:1fr 1fr;display:grid;padding-left:.9rem;margin:0 auto;max-width:var(--wyw);padding-right:.9rem;text-align:left;gap:1.8rem}
.colophon2yw .brandyw{padding:0 0 .45rem;justify-content:flex-start}
.colophon2yw .brandyw b{font-size:1.25rem}
@media (max-width:640px){.letters-2yw,.colophon2yw{grid-template-columns:1fr}.mast2-inyw{flex-direction:column;align-items:flex-start}.mast2yw .datelineyw{align-items:flex-start}}
@media (min-width:1024px){.bodyyw{grid-template-columns:300px minmax(0,1fr)}.sideyw{order:-1}}
.cover-artyw{aspect-ratio:21/9}.mastyw .brandyw{justify-content:flex-start}
.extyw{color:var(--muyw);margin:.8rem 0 0;font-size:.75rem}.extyw span{margin-right:.45rem;opacity:.8}.extyw a{color:var(--muyw)}
h1{text-wrap:balance}