/* 字体只使用上传字体：皎月（界面）、古韵宋（阅读）、龙吟（主标题）。 */
*{font-family:Moon,GuYun!important}body{font-size:15px}button,input,label{font-family:Moon,GuYun!important}.reading-page *,.notes-index .note-row *,.reading-column p,.reading-layout[lang=en] p{font-family:GuYun!important}.identity h1{font-family:Moon,GuYun!important}.oc-title,.art-caption strong,.gallery-heading h1,.notes-index h1,.sub-title,.essay h2{font-family:Dragon,GuYun!important}.card-label,.route-kicker,.wordmark,.route-nav strong{font-size:11px;letter-spacing:1px}.digits{font-family:Moon,GuYun!important;font-variant-numeric:tabular-nums;letter-spacing:-2px;font-size:43px}.gallery-word,.notes-watermark{font-family:Moon,GuYun!important;letter-spacing:-.06em}.reading-column .import-note{font-family:GuYun!important;font-size:12px}.clock-date{font-size:12px}.social small{font-size:12px}.identity .handle{font-size:12px}.top-controls .pill{font-size:13px}
/* 留住前两张大卡，下方用不等宽链接与高低错落的唱片组合。 */
@media(min-width:1001px){.bento{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:395px 145px 177px 196px auto auto}.oc{grid-area:1/1/2/4}.artwork{grid-area:1/4/2/7}.social.x{grid-area:2/1/3/2}.social.bluesky{grid-area:2/2/3/4}.social.steam{grid-area:2/4/3/5}.social.github{grid-area:2/5/3/7}.clock{grid-area:3/1/4/3}.music{grid-area:3/3/5/7}.essay{grid-area:4/1/5/3}.contact{grid-area:5/1/6/7;min-height:150px;padding:24px 28px}.contact h2{margin:10px 0}.contact>a{position:absolute;right:28px;top:24px;margin:0;font-size:17px}.contact .copy{right:28px;bottom:24px}.page-footer{grid-row:6}.social.x,.social.steam{padding:18px 14px}.social.bluesky,.social.github{padding:20px 24px}.social.x small,.social.steam small{font-size:10px}.social.x strong,.social.steam strong{font-size:12px}.clock{padding:21px 23px}.clock .digits{font-size:36px}.clock-top span:last-child{font-size:8px}.essay{padding:23px}.essay h2{font-size:29px;margin:11px 0}.essay p{font-size:12px}}
.card{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:#fff5}.oc{background:#d94435ed}.social.x{background:#25272ce8}.social.bluesky{background:#59b8c8df}.social.steam,.clock{background:#eac251e8}.social.github{background:#c94437e8}.essay{background:#55adbadf}.contact{background:#d75040e8}.card:before{background:linear-gradient(135deg,#fff1,transparent 55%),radial-gradient(450px at var(--mx,50%) var(--my,0%),#ffffff18,transparent 65%)}
html[data-theme=dark] .oc{background:#c73d32eb}html[data-theme=dark] .social.bluesky,html[data-theme=dark] .essay{background:#4299a8dd}html[data-theme=dark] .clock,html[data-theme=dark] .social.steam{background:#d5aa3de8}html[data-theme=dark] .contact{background:#bd493ce8}
/* 背景由三个缓慢游移的色面构成；位置变化，避免连续重算模糊。 */
.atmosphere{z-index:-1}.atmosphere:before{width:55vw;height:65vh;left:-15%;top:35%;background:#39a6b5;filter:blur(85px);opacity:.19;border-radius:42% 58% 70% 30%;animation:drift-cyan 32s ease-in-out infinite alternate;will-change:transform}.atmosphere:after{width:45vw;height:55vh;right:-8%;top:7%;background:#d64535;filter:blur(95px);opacity:.13;border-radius:15%;animation:drift-red 37s ease-in-out infinite alternate;will-change:transform}.background-gold{position:absolute;left:30%;bottom:-20%;width:45vw;height:55vh;background:#e3b43c;opacity:.2;filter:blur(85px);border-radius:50%;animation:drift-gold 43s ease-in-out infinite alternate;will-change:transform}@keyframes drift-cyan{to{transform:translate(20vw,-15vh) rotate(40deg)}}@keyframes drift-red{to{transform:translate(-22vw,30vh) rotate(-45deg)}}@keyframes drift-gold{to{transform:translate(16vw,-20vh) scale(.75)}}
/* 纸纹：静态 SVG 噪点叠加纤维方向，不拦截鼠标。 */
.notes-page,.reading-page{isolation:isolate;background-image:repeating-linear-gradient(3deg,#56462d03 0 1px,transparent 1px 4px),linear-gradient(120deg,#ffffff25,transparent)}.notes-page:before,.reading-page:before{content:"";position:fixed;inset:0;z-index:40;pointer-events:none;opacity:.12;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.68' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.7' filter='url(%23n)'/%3E%3C/svg%3E")}.notes-page:after{display:none}.notes-art{position:absolute;right:7vw;top:150px;width:195px;height:195px;pointer-events:none;opacity:.9;transform:rotate(-13deg)}.notes-art i{position:absolute;display:block}.notes-art i:nth-child(1){width:100px;height:100px;border-radius:50%;background:#48a9b6;left:0;top:0}.notes-art i:nth-child(2){width:104px;height:104px;border:19px solid #d44938;border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;right:0;bottom:0;transform:rotate(45deg)}.notes-art i:nth-child(3){width:120px;height:14px;background:#e3b43c;left:5px;bottom:15px;transform:rotate(-42deg)}.notes-art i:nth-child(4){width:26px;height:26px;background:var(--text);right:5px;top:3px;border-radius:50%}.notes-watermark{opacity:.045;font-size:clamp(140px,25vw,360px)}.reading-page .notes-watermark{opacity:.35}.notes-index>p{max-width:65%}.note-row{position:relative}.note-row:before{content:"";position:absolute;inset:0 -15px;background:#48a9b60c;border-radius:18px;opacity:0;transition:opacity .3s,transform .3s;transform:scale(.98);z-index:-1}.note-row:hover:before{opacity:1;transform:none}
/* 路由进退共用同一组退场与入场，避免只有子页面有动画。 */
body>header,body>.layout,body>.route-page{transition:opacity .16s ease,transform .16s ease}.route-page{animation:none}.route-leaving>header,.route-leaving>.layout,.route-leaving>.route-page{opacity:0;transform:translateY(-8px);pointer-events:none}.route-arriving>header,.route-arriving>.layout,.route-arriving>.route-page{animation:page-arrive .46s cubic-bezier(.18,.72,.22,1) both}@keyframes page-arrive{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
.route-back{position:relative;overflow:hidden;background:#ffffff15;border:1px solid #8b918733!important;box-shadow:inset 0 1px 0 #ffffff35;backdrop-filter:blur(14px);transition:background .3s,transform .3s,box-shadow .3s,color .3s!important;font-size:14px}.route-back:before{content:"";position:absolute;inset:-40% auto -40% -70%;width:50%;background:linear-gradient(90deg,transparent,#fff6,transparent);transform:skewX(-20deg);transition:left .5s;pointer-events:none}.route-back:hover{background:#e4b847!important;color:#25272c!important;transform:translateX(-4px);box-shadow:4px 5px 0 #2999aa45}.route-back:hover:before{left:130%}.route-back:active{transform:translateX(-2px) scale(.97)}
#copyEmail{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:105px;min-height:36px;color:#fff4df!important;background:#272b30!important;border:1px solid #fff3;font:14px/1.2 Moon,GuYun!important;z-index:3;box-shadow:0 4px 10px #5b201526;transition:transform .25s,background .25s}#copyEmail:hover{transform:translateY(-2px);background:#183d45!important}.contact{padding-bottom:68px}.contact p{font-size:14px}.contact>a{max-width:100%}
.exhibit{transform-origin:50% 50%}.fall-card{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,opacity .6s}.fall-card:hover,.fall-card:focus-visible{transform:scale(1.055) rotate(1deg);box-shadow:0 20px 45px #0009;z-index:25}.fall-column:has(.fall-card:hover){z-index:5}.gallery-transition[data-leaving=waterfall] .fall-card{transform:translate(var(--scatter),var(--scatter-y)) rotate(25deg)}
/* 黑胶播放器：自己的稿件封套 + 伸出右侧的唱片 + 模糊同源背景。 */
.music{padding:22px 26px 20px;min-height:390px;isolation:isolate;background:#1b282ee8;display:flex;flex-direction:column;justify-content:flex-end}.music:after{content:"";position:absolute;inset:-20px;z-index:-2;background:linear-gradient(#16242b80,#101c26e8),url('assets/portrait.webp') center 35%/cover;filter:blur(15px);transform:scale(1.08);pointer-events:none}.music>.card-label{position:absolute;top:19px;left:25px;color:#fff1dc;opacity:.8;font-size:10px;z-index:4}.record-scene{position:relative;height:220px;width:100%;margin:12px 0 13px;align-self:center;max-width:390px;flex-shrink:0}.record-sleeve{position:absolute;height:210px;width:210px;left:5%;top:0;z-index:2;transform:rotate(-5deg);box-shadow:8px 12px 25px #0006;border:6px solid #f5eedf;background:#eee;overflow:hidden;transition:transform .6s}.record-sleeve img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;pointer-events:none}.record-sleeve:after{content:"";position:absolute;inset:0;background:linear-gradient(130deg,#ffffff28,transparent 50%),linear-gradient(transparent 50%,#1a151ab0)}.record-sleeve>span{position:absolute;bottom:12px;left:12px;right:8px;z-index:1;color:#fff6e8;font-size:20px;letter-spacing:1px;line-height:1.3}.record-sleeve small{font-size:7px;letter-spacing:1px}.music .record{position:absolute;left:37%;top:8px;width:198px;height:198px;border:1px solid #191919;border-radius:50%;background:conic-gradient(from 15deg,transparent,#ffffff24 25deg,transparent 48deg,transparent 170deg,#ffffff22 195deg,transparent 225deg),repeating-radial-gradient(circle,#17181b 0 2px,#242529 2.5px 3px,#111215 3.5px 5px);box-shadow:12px 9px 22px #0007;animation:spin 9s linear infinite;animation-play-state:paused;display:grid;place-items:center}.music .record:after{height:55px;width:55px;border:0;background:#db4b3c;box-shadow:inset 0 0 0 1px #e4765a;position:absolute}.music .record>span{width:8px;height:8px;background:#1b242c;border:2px solid #d6b3a0;border-radius:50%;z-index:1}.music.playing .record{animation-play-state:running}.music:hover .record-sleeve{transform:rotate(-2deg) translateX(-4px)}.music-top{margin-top:0;gap:13px;position:relative;z-index:3}.music-title strong{font-size:22px!important;color:#f7eddc;line-height:1.4}.music-title small{font-size:11px;color:#d3d7cd}.play{width:42px;height:42px;border:1px solid #e1eef055;background:#67bcc9;color:#162b35;font-size:0!important;position:relative;box-shadow:0 4px 12px #0003;transition:transform .25s,background .25s}.play:hover{transform:scale(1.07);background:#e5b846}.play:before{content:"";display:block;margin:auto;border-left:10px solid #18333c;border-top:7px solid transparent;border-bottom:7px solid transparent;width:0;height:0;transform:translateX(2px)}.music.playing .play:before{width:10px;height:13px;border:0;border-left:3px solid #18333c;border-right:3px solid #18333c;transform:none}.audio-bottom{margin-top:15px;position:relative;z-index:3}.audio-bottom label{font-size:12px;color:#ffe2a0}.audio-bottom input{accent-color:#edc65b}.track-times{display:flex;justify-content:space-between;padding-right:82px;color:#d0dbd8;font-size:10px;line-height:1.5;margin-top:4px}.music-title{overflow:hidden}.music .card-label{pointer-events:none}
@media(max-width:1000px) and (min-width:761px){.music{grid-column:span 4}.record-scene{height:220px}.clock,.essay{grid-column:span 2}.contact{grid-column:span 4}}
@media(max-width:760px){.card-label{font-size:10px}.social small{font-size:11px}.clock .digits{font-size:43px}.music{min-height:365px;padding:22px}.record-scene{height:202px;margin:25px 0 10px;max-width:300px}.record-sleeve{width:185px;height:185px;left:0;top:0}.music .record{width:175px;height:175px;left:36%;top:6px}.music-title strong{font-size:20px!important}.notes-art{width:115px;height:115px;right:4%;top:125px;opacity:.5;transform:rotate(-13deg) scale(.65);transform-origin:top right}.notes-index>p{max-width:90%}.notes-index h1{font-size:38px}.route-nav strong{font-size:10px}.route-back{font-size:12px}.contact{min-height:220px}.contact>a{font-size:15px}.atmosphere:before{width:90vw;filter:blur(65px)}.atmosphere:after{width:80vw;filter:blur(65px)}.background-gold{width:75vw;filter:blur(65px)}.gallery-word{font-size:43vw}.notes-watermark{font-size:40vw}.reading-page .notes-watermark{font-size:40vw}}
@media(prefers-reduced-motion:reduce){.atmosphere:before,.atmosphere:after,.background-gold,.route-arriving>header,.route-arriving>.layout,.route-arriving>.route-page{animation:none!important}.route-back,.fall-card{transition:none}.fall-card:hover{transform:none}.music .record{animation:none!important}}