#folderScene{background:transparent;backdrop-filter:none;min-height:100svh;height:auto;padding:90px max(6vw,24px) 150px;scroll-margin-top:34px;overflow:hidden;color:#133862}
#folderScene>.project-folder,#folderScene>.media-windows,#folderScene>.home-link,#folderScene>.second-dock{display:none!important}
.works-heading{max-width:1280px;margin:0 auto 38px;position:relative}.works-heading>p:first-child{font:10px Consolas,monospace;letter-spacing:.22em;margin:0 0 22px;color:#426b94}
.works-heading h2{font:800 clamp(44px,6.3vw,92px)/.98 'Helvetica Neue',Arial,sans-serif;letter-spacing:-.065em;margin:0;color:#153965}.works-heading h2 br{display:none}.works-heading h2 span{margin-left:.2em;color:#2569d5}
#worksDescription{font-size:13px;line-height:1.8;margin:18px 0 0;color:#466b91;letter-spacing:.02em}
.works-filters{display:flex;gap:28px;max-width:1280px;margin:0 auto 30px;border-bottom:1px solid #4175a82b}
.works-filters button{position:relative;padding:0 0 13px;border:0;border-radius:0;background:transparent;color:#527394;cursor:pointer;font:500 12px 'Microsoft YaHei',sans-serif}
.works-filters button[aria-pressed="true"]{color:#164aa2}.works-filters button[aria-pressed="true"]::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#246be0}
.works-status{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.works-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 24px;max-width:1280px;margin:auto}
.work-tile{display:block;min-width:0;width:100%;padding:0;margin:0;border:0;background:transparent;box-shadow:none;border-radius:0;color:inherit;text-align:left;font-family:'Microsoft YaHei',sans-serif}
.work-tile[hidden]{display:none}.work-tile:is(button){cursor:pointer}.work-cover{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:10px;background:#e2eff9;box-shadow:0 5px 18px #24538b0d;transition:box-shadow .3s,transform .35s cubic-bezier(.2,.8,.2,1)}
.work-cover>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.work-tile:is(button):hover .work-cover{transform:translateY(-4px);box-shadow:0 15px 30px #24538b20}.work-tile:is(button):hover img{transform:scale(1.035)}
.work-open{position:absolute;right:14px;bottom:14px;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#ffffffeb;color:#19417b;font:20px Arial;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}
.work-tile:hover .work-open,.work-tile:focus-visible .work-open{opacity:1;transform:none}
.work-description{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:15px 2px 0}
.work-description h3{margin:0;font-size:14px;font-weight:600;line-height:1.5;letter-spacing:-.015em}.work-description p{margin:5px 0 0;font-size:10px;line-height:1.6;color:#4d7298}
.work-index{font:10px Consolas,monospace;color:#6687a7}
.work-empty{height:100%;display:grid;place-content:center;text-align:center;gap:9px;background:linear-gradient(135deg,#eef7ffc9,#d9eafa99);border:1px solid #ffffff80;border-radius:inherit}
.work-empty-number{font:300 clamp(40px,4.3vw,66px)/1 'Helvetica Neue',Arial,sans-serif;letter-spacing:-.055em;color:#6084ae45}
.work-pending{font-size:10px;letter-spacing:.12em;color:#6c8eaf}
.is-placeholder .work-description h3{color:#55789b;font-weight:400}.is-placeholder .work-description p{color:#6587a7}
.work-tile:nth-child(3n+2) .work-empty{background:linear-gradient(145deg,#edf4fcd9,#dfe7f399)}
.work-tile:focus-visible,.works-filters button:focus-visible{outline:2px solid #246be0;outline-offset:6px;border-radius:3px}
.works-visible .work-tile{animation:work-enter .5s cubic-bezier(.2,.8,.2,1) calc(var(--index)*35ms) backwards}
@keyframes work-enter{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(max-width:980px){.works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}.works-heading h2{font-size:clamp(40px,7vw,68px)}}
@media(max-width:560px){#folderScene{padding:70px 24px 125px}.works-grid{grid-template-columns:1fr;gap:30px}.works-heading{margin-bottom:28px}.works-heading h2{font-size:48px}.works-heading h2 br{display:block}.works-heading h2 span{margin-left:0}.works-filters{gap:25px}.work-empty-number{font-size:64px}.work-description h3{font-size:15px}}
@media(prefers-reduced-motion:reduce){.works-visible .work-tile{animation:none}.work-cover,.work-cover>img,.work-open{transition:none}}

/* Rounded portfolio cards with type bookmarks, inspired by the supplied cards. */
.work-tile{position:relative;background:#fff;border:5px solid #fff;border-radius:30px;box-shadow:0 10px 30px #224f831c;overflow:hidden;transition:transform .3s,box-shadow .3s}
.work-action{display:block;width:100%;padding:0;border:0;background:transparent;text-align:left;color:inherit;font:inherit;cursor:pointer}
div.work-action{cursor:default}
.work-cover{aspect-ratio:16/11;border-radius:25px 25px 0 0;box-shadow:none;overflow:hidden}
.work-cover>img{object-fit:cover}
.work-description{position:relative;min-height:94px;margin-top:-17px;padding:21px 54px 18px 18px;border-radius:24px 24px 0 0;background:#fff;gap:8px;align-items:center}
.work-description h3{font-size:15px;font-weight:700;color:#152f50;line-height:1.45}
.work-description p{font-size:11px;color:#7890a5;margin-top:5px}
.work-index{position:absolute;right:20px;top:19px;font-size:16px;color:#2a629c}
.work-ribbon{position:absolute;right:18px;top:0;z-index:2;display:flex;justify-content:center;align-items:center;max-width:108px;min-width:58px;min-height:64px;padding:10px 10px 20px;clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 9px),0 100%);background:#2463eb;color:white;font-size:11px;font-weight:700;text-align:center;line-height:1.5;pointer-events:none}
.work-tile[data-category="personal"] .work-ribbon{background:#067e96}
.is-placeholder .work-ribbon{background:#8aa8c8;color:#fff}
.work-like{position:absolute;right:14px;bottom:12px;z-index:3;width:30px;height:30px;border:0;border-radius:50%;background:#edf4fc;color:#3973b6;font-size:20px;cursor:pointer;display:grid;place-items:center;transition:transform .2s,background .2s}
.work-like:hover{transform:scale(1.1)}.work-like[aria-pressed="true"]{background:#ffe9ef;color:#e9507f}
.work-tile:not(.is-placeholder):hover{transform:translateY(-5px);box-shadow:0 18px 36px #224f8330}
.work-tile:not(.is-placeholder):hover .work-cover>img{transform:scale(1.025)}
.work-action:focus-visible,.work-like:focus-visible{outline:3px solid #2c72ef;outline-offset:-3px;border-radius:24px}
.work-empty{border:0;border-radius:0;padding-bottom:17px}.is-placeholder{box-shadow:0 5px 18px #224f8310}
@media(max-width:560px){.work-description{min-height:98px}.work-description h3{font-size:16px}}
@media(prefers-reduced-motion:reduce){.work-tile,.work-like{transition:none}}

/* Quieter finish: precise spacing, restrained borders, one aligned action. */
.work-tile{border-width:3px;border-radius:22px;box-shadow:0 5px 18px #254a7510}
.work-cover{border-radius:19px 19px 0 0}
.work-description{min-height:88px;margin-top:-12px;border-radius:18px 18px 0 0;padding:20px 60px 19px 20px;align-items:center}
.work-description h3{font-family:"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;font-size:14px;font-weight:600;letter-spacing:0;line-height:1.55;color:#243b55}
.work-description p{font-size:11px;line-height:1.5;margin-top:6px;color:#8292a4}
.work-index{display:none}
.work-like{right:16px;bottom:26px;width:34px;height:34px;background:transparent;border:1px solid #e7edf4;color:#7390ae;border-radius:50%;transition:color .2s,background .2s,border-color .2s}
.work-like svg{width:16px;height:16px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.work-like:hover{transform:none;background:#f1f6fc;border-color:#d2dfef;color:#2768b8}
.work-like[aria-pressed="true"]{background:#fff1f4;border-color:#f9dce5;color:#da6586}.work-like[aria-pressed="true"] svg{fill:currentColor}
.work-ribbon{right:18px;min-width:0;width:38px;max-width:38px;min-height:0;height:50px;padding:7px 0 14px;font-size:11px;font-weight:600;letter-spacing:.06em;line-height:1;clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 6px),0 100%);background:#2858ba}
.work-tile[data-category="personal"] .work-ribbon{background:#32788a}.is-placeholder .work-ribbon{background:#9bb0c5}
.is-placeholder .work-description{padding-right:20px}.work-tile:not(.is-placeholder):hover{transform:translateY(-3px);box-shadow:0 12px 28px #224f8320}
@media(max-width:560px){.work-description{min-height:88px}.work-description h3{font-size:15px}}

.works-heading .works-title-art{position:relative;width:min(100%,760px);aspect-ratio:2770/806;overflow:hidden;margin:0;line-height:0}
.works-title-art img{position:absolute;display:block;width:120.722%;max-width:none;height:auto;left:-10.361%;top:-62.655%}

/* Final spacing pass: retain the original cover composition and reduce chrome. */
#folderScene{padding-top:74px}
.works-heading{margin-bottom:28px;text-align:center}
.works-heading .works-title-art{width:min(78%,660px);margin-inline:auto}
.works-heading>p:first-child{margin-bottom:18px;font-size:9px;color:#547a9f}
#worksDescription{margin-top:20px;font-size:12px}
.works-filters{justify-content:center;border-bottom:0;gap:8px;margin-bottom:32px}
.works-filters button{padding:9px 17px;border-radius:20px;color:#496b8e;transition:background .2s,color .2s}
.works-filters button[aria-pressed="true"]{background:#ffffffc9;color:#215ab7;box-shadow:0 2px 8px #2b629018}
.works-filters button[aria-pressed="true"]::after{display:none}
.works-filters button:hover{background:#ffffff85;color:#215ab7}
.works-grid{gap:25px;max-width:1200px}
.work-cover{aspect-ratio:16/9}
.work-cover>img{object-fit:contain}
.work-description{margin-top:0;min-height:86px;padding:17px 62px 17px 18px;border-radius:0;background:#fff}
.work-description h3{font-size:14px;font-weight:600;line-height:1.6;text-wrap:pretty}
.work-description p{color:#617d98;font-size:10px;letter-spacing:.04em;margin-top:4px}
.work-like{bottom:25px;right:16px;width:36px;height:36px}
.work-ribbon{right:16px;width:35px;height:46px;font-size:10px;letter-spacing:.08em}
.work-empty{padding:0;background:linear-gradient(135deg,#eef7ff,#e1ecf7)}
.is-placeholder .work-description h3{color:#617e9a;font-size:13px}
.is-placeholder .work-ribbon{background:#8ca7c1}
@media(max-width:560px){.works-heading .works-title-art{width:100%}.works-grid{gap:22px}.work-description h3{font-size:14px}.work-like{width:40px;height:40px;bottom:23px;right:14px}}
