@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600&family=Playfair+Display:ital,wght@0,500;1,500&display=swap");
:root{--ink:#f8f5ff;--muted:#b8b0ca;--surface:#17122a;--line:rgba(255,255,255,.14);--pink:#f0a6c8}
*{box-sizing:border-box}html{background:var(--surface);scroll-behavior:smooth}body{min-height:100vh;margin:0;color:var(--ink);font-family:"Noto Sans SC",sans-serif;background:radial-gradient(circle at 78% 6%,rgba(132,101,213,.22),transparent 34rem),radial-gradient(circle at 8% 34%,rgba(220,100,167,.12),transparent 28rem),var(--surface)}a{color:inherit}button{font:inherit}
.gallery-header{width:min(1440px,calc(100% - 56px));height:88px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.back-link{text-decoration:none;font-size:14px;letter-spacing:.08em}.header-mark{color:var(--muted);font-size:11px;letter-spacing:.22em}
main,footer{width:min(1440px,calc(100% - 56px));margin:auto}.hero{min-height:390px;padding:96px 0 72px;position:relative}.hero:after{content:"64";position:absolute;right:2%;top:20px;color:rgba(255,255,255,.035);font:500 300px/1 "Playfair Display",serif;pointer-events:none}.eyebrow{margin:0 0 20px;color:var(--pink);font-size:11px;letter-spacing:.32em}h1{margin:0;font:500 clamp(62px,10vw,132px)/.9 "Playfair Display","Noto Sans SC",serif;letter-spacing:-.06em}.hero-copy{max-width:540px;margin:34px 0 28px;color:var(--muted);font-size:17px;font-weight:300;letter-spacing:.06em}.archive-meta{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:12px;letter-spacing:.08em}.archive-meta b{color:var(--ink);font-size:18px}.meta-divider{width:1px;height:13px;background:var(--line)}
.archive{padding:30px 0 100px;border-top:1px solid var(--line)}.archive-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:34px}.archive-toolbar h2{margin:0;font-size:15px;font-weight:500;letter-spacing:.12em}.filters{display:flex;gap:8px;flex-wrap:wrap}.filter{padding:8px 16px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:transparent;cursor:pointer;font-size:12px;transition:.2s ease}.filter:hover,.filter.is-active{color:#17122a;background:var(--ink);border-color:var(--ink)}
.gallery-grid{columns:3 280px;column-gap:18px}.photo-card{width:100%;margin:0 0 18px;padding:0;border:0;break-inside:avoid;position:relative;overflow:hidden;color:#fff;background:#29213e;cursor:zoom-in;text-align:left}.photo-card img{display:block;width:100%;height:auto;opacity:0;transition:opacity .25s ease,transform .65s cubic-bezier(.2,.75,.2,1)}.photo-card img.is-loaded{opacity:1}.photo-card.is-image-error:before{content:"图片暂时无法加载";position:absolute;inset:0;display:grid;place-items:center;padding:16px;color:rgba(255,255,255,.58);font-size:11px;letter-spacing:.08em;background:linear-gradient(135deg,#29213e,#151020)}.photo-card:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(8,5,17,.8));opacity:0;transition:opacity .3s}.photo-card-info{position:absolute;z-index:1;left:20px;right:20px;bottom:18px;display:flex;align-items:end;justify-content:space-between;gap:14px;opacity:0;transform:translateY(8px);transition:.3s ease}.photo-card-title{font-size:14px;font-weight:500}.photo-card-source{color:rgba(255,255,255,.72);font-size:10px;letter-spacing:.08em}.photo-card:hover img{transform:scale(1.025)}.photo-card:hover:after,.photo-card:hover .photo-card-info{opacity:1}.photo-card:hover .photo-card-info{transform:none}.empty-state{padding:80px 0;text-align:center;color:var(--muted)}
.gallery-more{display:block;margin:36px auto 10px;padding:11px 24px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:transparent;cursor:pointer;font-size:11px;letter-spacing:.12em}.gallery-more:hover{color:var(--ink);border-color:var(--ink)}.gallery-more[hidden]{display:none}
.filter-album{border-color:rgba(240,166,200,.45);color:var(--pink)}.album-player{padding:0 0 20px}.album-stage{position:relative;overflow:hidden;background:#0d0918}.album-open{display:block;width:100%;height:clamp(480px,69vh,850px);padding:0;border:0;position:relative;isolation:isolate;overflow:hidden;color:#fff;background:#0d0918;cursor:zoom-in;text-align:left}.album-open:before{content:"";position:absolute;z-index:0;inset:-28px;background-image:linear-gradient(rgba(13,9,24,.38),rgba(13,9,24,.55)),var(--album-bg);background-position:center;background-size:cover;filter:blur(24px);transform:scale(1.06);opacity:.72}.album-open img{display:block;width:100%;height:100%;position:relative;z-index:1;object-fit:contain;opacity:1;transform:scale(1);transition:opacity .45s ease,transform 7s linear}.album-open:not(.is-loading) img{transform:scale(1.012)}.album-open.is-loading img{opacity:.42}.album-vignette{position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(8,5,17,.82));pointer-events:none}.album-caption{position:absolute;z-index:3;left:30px;right:30px;bottom:26px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.album-caption small{display:block;margin-bottom:8px;color:var(--pink);font-size:9px;letter-spacing:.24em}.album-caption strong{display:block;max-width:min(760px,70vw);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:400;letter-spacing:.05em}.album-caption>span:last-child{color:rgba(255,255,255,.78);font:500 12px/1 "Playfair Display",serif;letter-spacing:.14em}.album-controls{min-height:74px;padding:18px 4px;display:grid;grid-template-columns:42px 64px 42px minmax(120px,1fr) auto;align-items:center;gap:10px}.album-controls button{height:38px;border:1px solid var(--line);border-radius:999px;color:var(--ink);background:transparent;cursor:pointer}.album-controls button:hover{border-color:var(--ink)}.album-toggle{font-size:11px;letter-spacing:.1em}.album-progress{height:2px;margin:0 12px;overflow:hidden;background:var(--line)}.album-progress span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:var(--pink);transition:transform .5s ease}.album-hint{color:var(--muted);font-size:10px;letter-spacing:.08em}
footer{min-height:120px;padding:36px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.14em}.lightbox{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:28px 76px;border:0;color:#fff;background:rgba(8,5,17,.96)}.lightbox[open]{display:grid;place-items:center}.lightbox::backdrop{background:rgba(0,0,0,.8)}.lightbox figure{margin:0;max-width:min(78vw,1100px);max-height:92vh}.lightbox img{display:block;max-width:100%;max-height:calc(92vh - 64px);margin:auto;object-fit:contain}.lightbox figcaption{min-height:54px;padding-top:14px;display:flex;justify-content:space-between;gap:24px}#lightbox-title{margin:0 0 4px;font-size:13px}#lightbox-source,#lightbox-index{color:var(--muted);font-size:10px;letter-spacing:.1em}.lightbox-close,.lightbox-nav{position:fixed;z-index:3;border:0;color:#fff;background:transparent;cursor:pointer}.lightbox-close{right:32px;top:20px;font-size:36px;font-weight:200}.lightbox-nav{top:50%;transform:translateY(-50%);font-size:24px}.lightbox-prev{left:28px}.lightbox-next{right:28px}
@media(max-width:700px){.gallery-header,main,footer{width:calc(100% - 32px)}.gallery-header{height:68px}.header-mark{display:none}.hero{min-height:320px;padding:70px 0 54px}.hero:after{top:50px;font-size:170px}.hero-copy{font-size:14px}.archive-toolbar{align-items:flex-start;flex-direction:column}.gallery-grid{columns:2 140px;column-gap:10px}.photo-card{margin-bottom:10px}.photo-card-info{display:none}.album-open{height:min(62vh,560px)}.album-caption{left:16px;right:16px;bottom:16px}.album-caption strong{max-width:62vw;font-size:12px}.album-controls{grid-template-columns:40px 58px 40px 1fr}.album-progress{margin:0 0 0 8px}.album-hint{display:none}.lightbox{padding:60px 16px 20px}.lightbox figure{max-width:100%}.lightbox-nav{top:auto;bottom:26px;padding:12px;background:rgba(255,255,255,.08)}.lightbox-prev{left:16px}.lightbox-next{right:16px}footer{min-height:100px;flex-direction:column;justify-content:flex-start;gap:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
