*{box-sizing:border-box}body{margin:0;color:#282a2b;background:#f7f7f3;background-image:linear-gradient(45deg,transparent 49.7%,#dddcd52b 50%,transparent 50.3%),linear-gradient(-45deg,transparent 49.7%,#dddcd52b 50%,transparent 50.3%);background-size:110px 110px;font-family:Arial,"Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}header{height:62px;border-bottom:1px solid #d5d5cf;display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:#f9f9f5}header .brand{font-size:13px;font-weight:800;letter-spacing:1.3px}header .brand span{color:#bca264;padding:0 10px}.year{font-size:11px;letter-spacing:2px;color:#7a7b77}main{max-width:1600px;margin:auto;padding:36px 38px 60px}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.eyebrow{font-size:10px;letter-spacing:2px;color:#7e827e;margin:0 0 10px}h1{font-size:34px;margin:0;font-weight:700;letter-spacing:2px}h1>span{font-size:12px;letter-spacing:4px;color:#999b92;margin-left:20px;font-weight:400}.total{display:flex;gap:12px;align-items:center}.total b{font-size:40px;font-weight:300;letter-spacing:-2px}.total>span{font-size:12px;color:#808278;letter-spacing:1px}.toolbar{border-top:2px solid #323633;border-bottom:1px solid #c9cbc3;display:flex;justify-content:space-between;align-items:center;padding:12px 0;margin-bottom:23px;gap:16px}.toolbar>span{font-size:14px;font-weight:bold}.toolbar i{display:inline-block;width:1px;height:12px;background:#b9bbb0;margin:0 12px;vertical-align:middle}.toolbar small{font-size:11px;color:#8a8d83;font-weight:400}.sort{display:flex;gap:5px}.sort button{font-size:12px;border:1px solid #d1d3c9;background:#efefe9;padding:9px 14px;cursor:pointer}.sort button[aria-pressed=true]{background:#30352f;color:white;border-color:#30352f}.sort button:focus-visible,a:focus-visible{outline:3px solid #00a7d3;outline-offset:5px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:20px 19px}.card{position:relative;aspect-ratio: .48;display:block;isolation:isolate;filter:drop-shadow(2px 4px 4px #0004);transition:transform .2s,filter .2s}.card:hover{transform:translateY(-5px);filter:drop-shadow(2px 7px 6px #0006)}.card-bg{position:absolute;inset:6px 0 0;background:linear-gradient(145deg,#232925 0%,#b19660 27%,#4a4e45 44%,#b69858 62%,#323531 90%);clip-path:polygon(0 0,85% 0,100% 9%,100% 100%,0 100%)}.portrait{position:absolute;width:100%;height:100%;object-fit:cover;inset:0;clip-path:polygon(0 0,85% 0,100% 9%,100% 100%,0 100%)}.profession{position:absolute;left:-3px;top:0;width:33px;height:37px;background:linear-gradient(130deg,#30342e,#62634d);border-left:3px solid #bc8545;box-shadow:0 0 6px #0009;display:grid;place-items:center;z-index:3}.profession img{width:29px;height:29px;object-fit:contain}.stars{position:absolute;left:33px;top:1px;color:#ffe14e;font-size:16px;letter-spacing:-3px;line-height:22px;text-shadow:0 0 4px #a67800,1px 1px 2px #333;white-space:nowrap;z-index:3}.diagonal{position:absolute;inset:0;background:linear-gradient(25deg,#252627 0%,#252627 18%,#181d1d 24%,#ffe8a4 24.8%,#dfc373 27%,transparent 36%);z-index:1}.diagonal:after{content:"";position:absolute;left:0;right:0;top:64%;height:11%;background:radial-gradient(#ffea7a 1px,transparent 1.5px);background-size:4px 4px;transform:skewY(25deg);opacity:.8;mask-image:linear-gradient(to top,#000,transparent)}.nameplate{position:absolute;bottom:0;left:0;right:0;padding:9px 7px 7px 12px;z-index:2;text-align:left;color:#fff;background:linear-gradient(transparent,#171b1bc9 40%);min-height:64px;display:flex;flex-direction:column;justify-content:flex-end;text-shadow:1px 1px 2px #000}.nameplate span{font-size:13px;line-height:1.45}.nameplate strong{font-size:16px;line-height:1.25;font-weight:500;overflow-wrap:anywhere}footer{max-width:1524px;margin:0 auto;padding:20px 0 25px;border-top:1px solid #d1d3c9;display:flex;justify-content:space-between;font-size:10px;color:#96998e;gap:15px}footer a{text-decoration:underline}.back{display:inline-block;font-size:13px;margin:0 0 30px;color:#757b70}.detail-title{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #343831;padding-bottom:24px;margin-bottom:30px;gap:20px}.detail-title h1{letter-spacing:0;overflow-wrap:anywhere}.author{font-size:14px;color:#6a7064}.author span{color:#bda965;margin:0 10px}.detail-class{display:grid;grid-template-columns:38px auto;gap:4px 10px;align-items:center;background:#33382f;color:white;padding:10px 18px;flex-shrink:0}.detail-class img{width:35px;grid-row:span 2}.detail-class small{color:#ffe15c;letter-spacing:-1px}h2{font-size:18px;font-weight:500;margin:0 0 22px}h2 span{font-size:12px;color:#a79460;margin-right:15px}.views{margin-bottom:35px}.views>a{display:block;text-align:center;border:1px solid #dedfd6;background:#efeee9}.views img{max-width:100%;max-height:78vh;vertical-align:middle}.caption{font-size:11px;color:#91968a;text-align:right}.story{max-width:1000px;padding-top:28px;border-top:1px solid #c9cec0}.story-text{white-space:pre-wrap;overflow-wrap:anywhere;font-family:Georgia,"Microsoft YaHei",serif;font-size:17px;line-height:1.95;color:#454b40;padding-bottom:30px}@media(min-width:1450px){.grid{grid-template-columns:repeat(10,minmax(0,1fr))}}@media(max-width:650px){header{padding:0 18px}.year{display:none}main{padding:25px 18px}.intro{margin-bottom:20px}h1{font-size:29px}h1>span{display:block;margin:7px 0 0;font-size:10px}.eyebrow{font-size:8px;letter-spacing:1px}.toolbar{align-items:flex-start;flex-direction:column}.sort{width:100%}.sort button{flex:1}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 10px}.stars{font-size:13px;left:27px}.profession{width:27px;height:30px}.profession img{width:24px}.nameplate{padding:5px;min-height:60px}.nameplate span{font-size:11px}.nameplate strong{font-size:13px}footer{margin:0 18px;flex-direction:column}.detail-title h1{font-size:26px}.detail-class{padding:8px;gap:3px}.detail-class img{width:26px}.detail-class{grid-template-columns:26px auto}.story-text{font-size:16px}}


.total>span{max-width:75px;line-height:1.5}.toolbar{flex-wrap:wrap}@media(max-width:650px){.toolbar>span{font-size:12px}.sort button{padding:9px 8px;font-size:11px}h1>span{letter-spacing:2px}}

.total>span{max-width:75px;line-height:1.5}.toolbar{flex-wrap:wrap}@media(max-width:650px){.toolbar>span{font-size:12px}.sort button{padding:9px 8px;font-size:11px}h1>span{letter-spacing:2px}}

