@layer content{.joe_post_series{border-radius:var(--radius-wrap);background:var(--fill-base);margin:0 0 18px;& summary{color:var(--text-regular);cursor:pointer;user-select:none;align-items:center;gap:8px;padding:10px 14px;font-size:14px;list-style:none;display:flex;&::-webkit-details-marker{display:none}&>i:first-child,& .label{color:var(--text-secondary)}& .name{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--text-title);font-weight:600;overflow:hidden}& .pos{color:var(--text-secondary);flex:none;margin-left:auto;font-size:12px}& .arrow{color:var(--text-secondary);transition:rotate var(--dur-base) var(--ease-out);flex:none}&:hover .name{color:var(--theme-text)}}&[open] summary .arrow{rotate:180deg}& ol{border-top:1px dashed var(--border-lighter);margin:0;padding:0 14px 4px}& li{align-items:baseline;gap:10px;margin:0;padding:6px 0;font-size:14px;list-style:none;display:flex;&+li{margin-top:0}}& .num{font-variant-numeric:tabular-nums;min-width:1.6em;color:var(--text-secondary);flex:none;font-size:12px}& .title{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--text-regular);overflow:hidden}& a.title:hover{color:var(--theme-text)}& .is-current{& .num,& .title{color:var(--theme-text);font-weight:600}}& .all{color:var(--text-secondary);align-items:center;gap:2px;margin:0 14px 12px;font-size:12px;display:inline-flex;&:hover{color:var(--theme-text)}}}}@layer pages{.joe_bread{margin:20px auto 0;padding:15px 15px 0}.joe_bread__bread{align-items:center;display:flex;& .line{color:var(--text-placeholder);padding:0 5px}& .item{color:var(--text-secondary);white-space:nowrap;& .link{color:var(--text-regular);transition:color var(--dur-base) var(--ease-out);&:hover{color:var(--theme)}}& .joe-font{margin-right:3px}&:first-child{align-items:center;display:flex}}}.joe_post{position:relative}.joe_post__pagination{grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px;display:grid}.joe_post__pagination-item{border-radius:var(--radius-wrap);background:linear-gradient(135deg, color-mix(in srgb, var(--theme) 26%, var(--bg-page)), color-mix(in srgb, var(--theme) 8%, var(--bg-page)));min-width:0;min-height:96px;box-shadow:var(--shadow);transition:box-shadow var(--dur-base) var(--ease-out);align-items:flex-end;display:flex;position:relative;overflow:hidden;& .cover{object-fit:cover;width:100%;height:100%;transition:transform .6s var(--ease-out);position:absolute;inset:0}&:has(.cover):after{content:"";background:linear-gradient(#0000001f,#000000ad);position:absolute;inset:0}& .body{z-index:1;gap:4px;width:100%;min-width:0;padding:14px 16px;display:grid;position:relative}& .label{color:var(--text-secondary);align-items:center;gap:2px;font-size:12px;display:inline-flex}& .title{text-overflow:ellipsis;white-space:nowrap;color:var(--text-title);font-size:15px;font-weight:600;overflow:hidden}&:has(.cover){& .label{color:#ffffffc7}& .title{color:#fff}}&:hover{box-shadow:var(--shadow-hover);& .cover{transform:scale(1.05)}}&.next{text-align:right;grid-column:2;& .label{justify-self:end}}}.joe_post__pagination-item.is-empty{background:color-mix(in srgb, var(--theme) 5%, var(--bg-page));box-shadow:inset 0 0 0 1px var(--border-lighter);& .label{color:var(--text-secondary)}& .title{color:var(--text-regular);font-weight:500}&:is(a):hover{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--theme) 45%, transparent);& .title{color:var(--theme-text)}}&:not(a):hover{box-shadow:inset 0 0 0 1px var(--border-lighter)}}@media (width<=500px){.joe_post__pagination{grid-template-columns:1fr;gap:10px}.joe_post__pagination-item{min-height:76px;&.next{grid-column:auto}}}.joe_related{border-radius:var(--radius-wrap);background:var(--bg-page);box-shadow:var(--shadow);margin-bottom:15px;padding:14px 16px 16px}.joe_related__title{color:var(--text-title);margin:0 0 12px;font-size:15px;font-weight:600}.joe_related__list{scroll-snap-type:x mandatory;scrollbar-width:none;grid-auto-columns:calc(25% - 9px);grid-auto-flow:column;gap:12px;margin:0;padding:0;list-style:none;display:grid;overflow-x:auto;&::-webkit-scrollbar{display:none}& li{scroll-snap-align:start;min-width:0}& a{gap:6px;display:grid}& .cover{aspect-ratio:16/10;border-radius:var(--radius-inner);background:linear-gradient(135deg, color-mix(in srgb, var(--theme) 22%, transparent), color-mix(in srgb, var(--theme) 6%, transparent));display:block;overflow:hidden;& img{object-fit:cover;color:#0000;width:100%;height:100%;transition:transform .6s var(--ease-out);display:block}}& a:hover .cover img{transform:scale(1.05)}& .title{-webkit-line-clamp:2;color:var(--text-title);transition:color var(--dur-fast) var(--ease-out);-webkit-box-orient:vertical;font-size:13.5px;line-height:1.5;display:-webkit-box;overflow:hidden}& a:hover .title{color:var(--theme-text)}& time{color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:12px}@media (width<=768px){grid-auto-columns:44%}}.joe_detail__title{margin-bottom:30px}.joe_detail-wrapper{padding:0 10px;& article{padding:15px 0 30px;position:relative}}.joe_aside_post{z-index:2;width:280px;transition:top var(--dur-base) var(--ease-out);position:sticky;top:75px}.toc-container[hidden]{display:none}.toc-container{background:var(--bg-page);border-radius:var(--radius-wrap);min-height:90px;box-shadow:var(--shadow);transition:top var(--dur-base) var(--ease-out);margin-bottom:15px;overflow:hidden;& .toc-header{z-index:1;height:45px;color:var(--theme);border-bottom:1px solid var(--border-lighter);padding:0 10px;font-size:16px;font-weight:700;line-height:45px;position:relative;& i{vertical-align:middle;margin-right:4px;font-size:18px;position:relative;top:0}}& .toc{user-select:none;min-height:50px;max-height:calc(100vh - 150px);position:relative;overflow-y:auto;&>.toc-list{padding:10px 12px 20px 36px;position:relative;overflow:hidden;&:after{content:"";background:var(--border-light);width:2px;position:absolute;top:0;bottom:0;left:16px}& li{list-style:none}&>li>a{font-weight:700;&:before{content:"";z-index:1;background:var(--bg-page);border:2px solid var(--border-light);width:8px;height:8px;box-shadow:0 0 0 2px var(--bg-page);border-radius:50%;display:block;position:absolute;top:4px;left:-25px}&.is-active-link{color:var(--theme);border-color:var(--toc-active);font-weight:700;&:before{background:var(--theme);box-shadow:0 0 0 1px var(--theme)}}}}}& .toc-list{z-index:1;margin:0;padding-left:14px;font-size:14px;position:relative;& .toc-list-item{position:relative}& .toc-list{font-size:13px}}& .toc-link{height:100%;color:var(--text-regular);&.is-active-link{color:var(--theme);font-weight:700}}& .toc-nodata{text-align:center;color:var(--text-secondary);user-select:none;background:var(--fill-base);padding:20px;font-style:italic}& .is-collapsible{transition:all var(--dur-base) var(--ease-out);overflow:hidden}& .is-collapsed{max-height:0}& .toc-list-item{word-break:break-word;margin:10px 0}&.hide{width:30px;height:30px;min-height:auto;padding:0;& .toc-list{display:none}}}@keyframes pulse{0%{box-shadow:0 0 0 0 var(--theme)}}@media (width<=992px){.toc-container{display:none}.joe_detail-wrapper{padding:0}}@media (width<=500px){.joe_bread{margin:0 auto;padding:15px 15px 0 5px}.joe_post__pagination{padding:0 10px}}html[data-mode=dark] .toc-nodata em{opacity:.4}}