@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--ink:#ede8dd;--muted:#a1a5ac;--gold:#d4bc8e;--line:#ffffff20}*{box-sizing:border-box}body{margin:0;background:#080e1c;color:var(--ink);font-family:Manrope,"Microsoft YaHei",sans-serif;overflow:hidden}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}button:hover{color:var(--gold)}a{color:inherit;text-decoration:none}#universe,.grain{position:fixed;inset:0;width:100%;height:100%}.grain{pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='white' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E");z-index:3}header{position:fixed;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:34px 4.5%;z-index:8}.brand{display:flex;gap:14px;align-items:center}.brand-symbol{font-size:43px;font-weight:400;color:var(--gold)}.brand>span:last-child{font-family:"Noto Serif SC",serif;font-size:22px;letter-spacing:5px}.brand small{display:block;font-family:Manrope,sans-serif;font-size:8px;letter-spacing:3px;margin-top:6px;color:#bcb9b1}nav{display:flex;gap:35px;align-items:center;font-size:12px}nav button{padding:9px 0}.nav-number{font-size:9px;vertical-align:super;color:var(--gold);margin-left:4px}.upload-nav{border:1px solid #d4bc8e60;padding:12px 19px!important;border-radius:2px}.upload-nav>span{margin-right:9px;color:var(--gold)}main{position:fixed;left:8.5%;top:25%;z-index:4;transition:opacity .6s,transform .8s;pointer-events:none}main button{pointer-events:auto}.eyebrow{font-size:9px;letter-spacing:2.7px;color:#c1c4ca;display:flex;align-items:center;gap:10px}.eyebrow>span{width:19px;height:1px;background:var(--gold)}h1{font-family:"Noto Serif SC",serif;font-size:clamp(46px,5.2vw,84px);font-weight:400;line-height:1.45;letter-spacing:7px;margin:24px 0 22px}h1 span{color:#ddc89f}.intro{color:#b6bbc5;font-size:12px;line-height:2.3;letter-spacing:2px}.explore{margin-top:22px;border-bottom:1px solid #bba47b77;padding:11px 0;font-size:12px;letter-spacing:2px;display:flex;gap:60px;align-items:center}.explore span{font-size:23px;color:var(--gold)}.coordinates{font-size:8px;letter-spacing:1.8px;color:#9ca7b8;margin-top:40px}.coordinates span{margin-left:14px;letter-spacing:1px;color:#7f8997}footer{position:fixed;bottom:51px;left:4.5%;right:4.5%;z-index:7;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1px;color:#c6c2b8}.ocean-status{display:flex;align-items:center;gap:12px}.live-dot{width:4px;height:4px;border-radius:100%;background:#ddc79b;box-shadow:0 0 7px #ecd2a2}.footer-line{height:12px;width:1px;background:#ffffff35;margin:0 5px}.footer-tools{display:flex;align-items:center;gap:25px}#soundBtn{font-size:20px;display:flex;gap:9px;align-items:center}#soundBtn span{font-size:10px}#fullscreenBtn{font-size:24px}.bottom-label{position:fixed;bottom:18px;left:0;right:0;text-align:center;font-size:7px;letter-spacing:3px;color:#c9b99580;z-index:4}#starLayer{position:fixed;inset:0;pointer-events:none;z-index:5}.art-star{position:absolute;width:44px;height:44px;margin:-22px;border:0;border-radius:50%;pointer-events:auto;display:grid;place-items:center}.art-star::before{content:"";width:4px;height:4px;background:#fff8dd;border-radius:50%;box-shadow:0 0 4px #fff,0 0 13px 3px #b4caff80,0 0 26px #c4caff40;animation:breathe 4s infinite alternate;animation-delay:var(--delay)}.art-star::after{content:"";position:absolute;width:17px;height:1px;background:linear-gradient(90deg,transparent,#fff9,transparent)}.art-star .vertical{position:absolute;width:1px;height:18px;background:linear-gradient(transparent,#fff9,transparent)}.art-star:hover::before,.art-star:focus-visible::before{box-shadow:0 0 8px 3px #fff,0 0 28px 8px #e3cc9d80}.art-star .star-label{position:absolute;top:40px;white-space:nowrap;letter-spacing:2px;font-size:10px;opacity:0;transition:.3s;color:#e8d9bb}.art-star:hover .star-label,.art-star:focus-visible .star-label{opacity:1}.art-star.featured .star-label{opacity:.7}.art-star.featured::before{width:6px;height:6px}.art-star.dim{opacity:.25;pointer-events:none}@keyframes breathe{from{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1.3)}}body.viewing main,body.transitioning main{opacity:0;transform:translateY(15px);pointer-events:none}body.viewing main button,body.transitioning main button{pointer-events:none}body.viewing #starLayer,body.transitioning #starLayer{opacity:0;pointer-events:none}body.viewing .art-star,body.transitioning .art-star{pointer-events:none}#exhibition{position:fixed;inset:0;z-index:6;perspective:1200px}#exhibition[hidden]{display:none}#photoStage{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);width:min(57vw,850px);height:48vh;display:flex;justify-content:center;align-items:center;transform-style:preserve-3d;animation:reveal 1.4s cubic-bezier(.16,1,.3,1)}.photo-frame{position:relative;display:flex;max-width:100%;max-height:100%;padding:6px;background:#e8e2d20b;border:1px solid #f8db9c66;box-shadow:0 0 28px #e7b96425,0 0 100px #dca65c15;transform:rotateY(var(--rx,0deg)) rotateX(var(--ry,0deg));transition:transform .3s ease-out}#artwork{display:block;max-width:100%;max-height:46vh;object-fit:contain;box-shadow:0 0 1px 1px #000}.sunlight{position:absolute;width:70vw;height:55vh;left:15%;top:16%;background:radial-gradient(ellipse,#e9b97b25,transparent 65%);filter:blur(25px);pointer-events:none}.photo-reflection{position:absolute;top:100%;width:80%;height:28vh;background-image:var(--photo);background-size:contain;background-position:center top;background-repeat:no-repeat;transform:scaleY(-1);opacity:.15;filter:blur(4px);mask-image:linear-gradient(transparent 15%,#0008);pointer-events:none}.film-corner{position:absolute;width:18px;height:18px;border-color:#f2ddba}.tl{left:-9px;top:-9px;border-left:1px solid;border-top:1px solid}.br{right:-9px;bottom:-9px;border-right:1px solid;border-bottom:1px solid}.art-caption{position:absolute;top:71%;left:20%;right:20%;text-align:center;text-shadow:0 2px 20px #000}.art-caption>span{font-size:8px;letter-spacing:4px;color:var(--gold)}.art-caption h2{font-family:"Noto Serif SC",serif;font-weight:400;font-size:26px;letter-spacing:5px;margin:12px}.art-caption p{font-size:11px;letter-spacing:1px;color:#bec2cc;line-height:1.7}.viewer-controls{position:absolute;bottom:12%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;padding:12px 22px;background:#0a132a88;border:1px solid #ffffff18;backdrop-filter:blur(14px);border-radius:5px;white-space:nowrap;font-size:11px}.viewer-controls>span{font-size:9px;color:#9da8ba}.viewer-controls i{width:1px;height:15px;background:var(--line);margin:0 5px}body.clean #universe{filter:brightness(.15)}body.clean .sunlight,body.clean .photo-reflection{opacity:0}body.clean .photo-frame{box-shadow:none;border-color:transparent}body.film .photo-frame{padding:22px 14px;background:#171719;border:1px solid #80735b;box-shadow:0 0 65px #f1cb8640}body.film .photo-frame::after{content:'35MM · STELLAR TIDE';position:absolute;bottom:6px;left:14px;font-size:7px;letter-spacing:4px;color:var(--gold)}@keyframes reveal{from{opacity:0;filter:blur(15px);transform:translate(-50%,-50%) scale(.05)}to{opacity:1;filter:blur(0);transform:translate(-50%,-50%) scale(1)}}dialog{width:min(960px,92vw);max-height:85vh;border:1px solid #d3bf942c;color:var(--ink);background:linear-gradient(135deg,#121b2aee,#080f1df5);backdrop-filter:blur(30px);border-radius:10px;padding:38px;box-shadow:0 30px 150px #0008}dialog::backdrop{background:#030914b8;backdrop-filter:blur(8px)}.dialog-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.dialog-top h2{font-family:"Noto Serif SC",serif;font-size:25px;font-weight:400;letter-spacing:2px;margin-top:16px}.dialog-close{font-size:27px;color:#b6b9be;padding:0 5px}.catalog-filters{display:flex;gap:20px;margin:17px 0 26px}.catalog-filters button{font-size:11px;color:#9ba5b4;padding:8px 0;border-bottom:1px solid transparent}.catalog-filters .active{color:var(--gold);border-color:var(--gold)}#catalogGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.catalog-card{text-align:left;padding:0}.catalog-card img{width:100%;aspect-ratio:1.5;object-fit:cover;border-radius:3px;transition:filter .3s;filter:brightness(.8)}.catalog-card:hover img{filter:brightness(1)}.catalog-card h3{font-family:"Noto Serif SC",serif;font-size:14px;font-weight:400;margin:12px 0 5px;letter-spacing:2px}.catalog-card p{font-size:9px;letter-spacing:1px;color:#909dad}.delete-work{font-size:10px;color:#aa9d89;padding:8px 0}.dialog-note{color:#8d98a9;font-size:10px;line-height:1.9;margin-top:24px}#upload{max-width:560px}.dropzone{position:relative;border:1px dashed #d4bc8e50;display:flex;flex-direction:column;align-items:center;padding:28px 15px;gap:12px;cursor:pointer;margin:15px 0 22px;background:#d4bc8e04;text-align:center}.dropzone.drag{background:#d4bc8e18}.dropzone input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.upload-icon{font-size:30px;color:var(--gold)}.dropzone strong{font-size:13px;font-weight:400}.dropzone>span:last-of-type{font-size:9px;color:#94a0b0;line-height:1.7}.dropzone img{max-height:100px;max-width:100%}.field{display:flex;flex-direction:column;gap:9px;font-size:11px;margin-top:18px;color:#c7cbd2}.field input,.field textarea{background:#ffffff04;border:1px solid #ffffff20;padding:11px 12px;color:var(--ink);font:inherit;resize:vertical;border-radius:3px}.field input:focus,.field textarea:focus{outline:1px solid var(--gold)}.primary{padding:13px 18px;background:#cfbb94;color:#121826;font-size:12px;width:100%;display:flex;justify-content:space-between;border-radius:3px}.primary:hover{color:#000;background:#e7d0a7}.primary:disabled{opacity:.5;cursor:wait}#uploadError{font-size:11px;color:#ffb4a5}#about{max-width:570px;padding:42px}.about-symbol{font-size:60px;color:var(--gold);margin:30px 0}#about h2{font-family:"Noto Serif SC",serif;font-weight:400;line-height:1.7;letter-spacing:3px;font-size:30px}#about p{font-size:12px;line-height:2.3;color:#aeb8c6}#toast{position:fixed;bottom:110px;left:50%;transform:translate(-50%,20px);background:#182234ed;border:1px solid #d4bc8e50;padding:13px 22px;font-size:12px;z-index:30;border-radius:5px;opacity:0;pointer-events:none;transition:.3s;max-width:90vw;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}@media(min-width:1600px){main{top:26%}}@media(max-width:700px){header{padding:24px 6%}.brand-symbol{font-size:34px}.brand>span:last-child{font-size:18px}.brand small{font-size:6px}nav{gap:18px;font-size:10px}#aboutBtn{display:none}.upload-nav{padding:9px 11px!important}main{left:9%;top:24%}.eyebrow{font-size:7px;letter-spacing:1.5px}h1{font-size:48px;letter-spacing:5px;margin-top:25px}.intro{font-size:11px}.coordinates{font-size:6px;letter-spacing:1px;margin-top:30px}.coordinates span{display:block;margin:8px 0}.explore{margin-top:15px}footer{left:6%;right:6%;bottom:45px;font-size:8px}.footer-line,#workCount{display:none}.footer-tools{gap:15px}#soundBtn span{font-size:8px}.bottom-label{font-size:6px;letter-spacing:1.5px}#photoStage{width:84vw;height:42vh;top:39%}#artwork{max-height:41vh}.art-caption{top:65%;left:7%;right:7%}.art-caption h2{font-size:23px}.art-caption p{font-size:10px}.viewer-controls{bottom:15%;gap:12px;padding:12px;font-size:10px}.viewer-controls i{margin:0}dialog{padding:24px;max-height:86vh}.dialog-top h2{font-size:20px}#catalogGrid{grid-template-columns:repeat(2,1fr);gap:14px}.catalog-filters{gap:16px}.catalog-filters button{font-size:10px}#about{padding:28px}#about h2{font-size:25px}.photo-reflection{height:20vh}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* 作品目录筛选：数量随作品系列变化，允许换行并禁止词内断行 */
.catalog-filters{flex-wrap:wrap;gap:8px 18px}
.catalog-filters button{white-space:nowrap}
@media (max-width:700px){.catalog-filters{gap:6px 14px;margin:12px 0 18px}.catalog-filters button{font-size:10.5px}}

/* 作品星亮度分级：少量亮星 + 多数暗星，避免 84 颗星一样亮像一块发光面板 */
.art-star.bright::before{width:6px;height:6px;box-shadow:0 0 7px 2px #fff,0 0 20px 6px #b4caff90,0 0 36px #c4caff50}
.art-star.bright::after,.art-star.bright .vertical{opacity:.95}
.art-star.faint{opacity:.72}
.art-star.faint::before{width:3px;height:3px;box-shadow:0 0 3px #fff,0 0 9px 2px #b4caff55}
.art-star.faint::after,.art-star.faint .vertical{opacity:.3;transform:scale(.72)}

/* 放大原图查看器 */
#lightbox{position:fixed;inset:0;z-index:60;background:#04060c;display:flex;flex-direction:column;touch-action:none;animation:lbIn .25s ease-out}
#lightbox[hidden]{display:none}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
.lb-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 22px;font-size:11px;letter-spacing:2px;color:#d8cfbd}
#lbTitle{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-tools{display:flex;align-items:center;gap:8px;flex:none}
.lb-tools button{font-size:12px;border:1px solid #ffffff26;border-radius:2px;padding:6px 10px;color:#e8e3d8;line-height:1}
.lb-tools button:hover{border-color:var(--gold);color:var(--gold)}
#lbZoom{min-width:46px;text-align:center;font-size:11px;color:#9aa1ad;letter-spacing:0}
#lbStage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:grab}
#lbStage.dragging{cursor:grabbing}
#lbImage{max-width:none;max-height:none;transform-origin:center center;will-change:transform;user-select:none;-webkit-user-drag:none;opacity:0;transition:opacity .25s}
#lbImage.ready{opacity:1}
.lb-hint{margin:0;text-align:center;font-size:10px;letter-spacing:1.5px;color:#78808d;padding:10px 12px 16px}
body.lightbox-open #starLayer,body.lightbox-open #exhibition{pointer-events:none}
@media (max-width:700px){.lb-bar{padding:10px 12px;font-size:10px}.lb-tools button{padding:6px 8px;font-size:11px}.lb-hint{font-size:9px;letter-spacing:1px;padding:8px 10px 12px}}
