@font-face{font-family:Jinxuan;src:url('../assets/fonts/jinxuan-book.woff2?v=c8da34a2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Jinxuan;src:url('../assets/fonts/jinxuan-medium.woff2?v=f038b412') format('woff2');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Jinxuan;src:url('../assets/fonts/jinxuan-bold.woff2?v=dbc85cab') format('woff2');font-style:normal;font-weight:700;font-display:swap}
:root{--ink:#f5eefb;--muted:#bbb0cf;--lavender:#d5bbff;--line:rgba(215,192,250,.2);--purple:#160c2d;--accent:#e2baff;--font:Jinxuan,'PingFang TC',sans-serif;--pointer-x:0px;--pointer-y:0px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:#140b26;color:var(--ink);font:400 16px/1.8 var(--font);overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #e2c6ff;outline-offset:7px}::selection{background:#c7a0f6;color:#1c0a32}p,h1,h2,h3,figure{margin:0}h1,h2,h3{font-weight:700}h2{line-height:1.5}button{border:0}.section-shell{width:min(1320px,calc(100% - 112px));margin-inline:auto;position:relative}.filter-defs{position:absolute;width:0;height:0;overflow:hidden}.skip{position:fixed;top:-100px;left:20px;background:#fff;color:#1b0a2d;z-index:100;padding:12px}.skip:focus{top:10px}
.atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 82% 30%,#3b1b5d 0,transparent 50%),linear-gradient(145deg,#160c2d,#24103e 50%,#100920);pointer-events:none}.mist{position:absolute;border-radius:50%;will-change:transform;filter:blur(85px);opacity:.45;animation:drift 24s ease-in-out infinite alternate}.mist-a{width:65vw;height:55vw;max-width:950px;max-height:800px;top:-20%;right:-22%;background:#7136a0}.mist-b{width:50vw;height:50vw;background:#6c296c;top:55%;left:-25%;opacity:.27;animation-delay:-11s;animation-duration:32s}.mist-c{width:18vw;height:28vw;right:22%;top:35%;background:#af6aaa;filter:blur(100px);opacity:.17;animation-delay:-17s}.blur-ring{position:absolute;width:330px;height:330px;border:24px solid #9e6ed6;border-radius:50%;top:11%;left:64%;filter:blur(27px);opacity:.18;animation:float-ring 20s ease-in-out infinite alternate}.blur-square{position:absolute;width:120px;height:120px;background:#a574c8;top:70%;right:9%;filter:blur(19px);opacity:.16;transform:rotate(30deg);animation:drift 18s ease-in-out infinite alternate-reverse}.star{position:absolute;color:#d8b2fb;filter:blur(3px);opacity:.32;animation:drift 15s ease-in-out infinite alternate}.star-a{left:7%;top:67%;font-size:80px}.star-b{right:8%;top:19%;font-size:35px;animation-delay:-6s}.grain{position:fixed;inset:-100px;z-index:20;pointer-events:none;opacity:.085;background-image:url('../assets/noise.svg');mix-blend-mode:screen;animation:grain-shift .6s steps(3) infinite}.read-progress{position:fixed;top:0;left:0;width:100%;height:2px;z-index:40;background:linear-gradient(90deg,#c59af7,#f4d1ed);transform:scaleX(0);transform-origin:left}
.site-header{height:106px;position:absolute;top:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding-inline:56px;z-index:30}.wordmark{display:flex;align-items:center;gap:12px;font-size:28px;font-weight:700;line-height:1}.brand-orbit{font-size:35px;color:#dabafa}.brand-dot{color:#c8a3ef}.wordmark-note{font-size:10px;font-weight:400;letter-spacing:1.3px;border-left:1px solid var(--line);padding-left:15px;margin-left:5px}.site-header nav{display:flex;gap:33px;font-size:12px;letter-spacing:.1em}.site-header nav a{color:#ded2ec;transition:color .3s}.site-header nav a:hover{color:#fff}.site-header nav span{font:10px/1 monospace;opacity:.55;margin-right:4px}.motion-toggle{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--line);border-radius:30px;padding:8px 13px;font-size:10px;letter-spacing:.06em;color:#d2c2e1;transition:background .3s}.motion-toggle:hover{background:#ffffff0d}.motion-icon{width:12px;text-align:center;font-family:Arial,sans-serif;font-size:13px}.hero{min-height:850px;height:100svh;max-height:1100px;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:130px 0 85px}.hero-copy{position:relative;z-index:5;padding-bottom:20px}.eyebrow,.micro{font-family:var(--font);font-size:10px;letter-spacing:.18em;line-height:1.8;font-weight:400}.eyebrow{color:#c3b2d6;display:flex;align-items:center;gap:12px}.tiny-star{font-size:15px;color:#dfb7ef}.hero-name{position:relative;font-size:clamp(150px,18vw,255px);line-height:1.05;letter-spacing:-.065em;left:-.035em;margin:24px 0 12px;width:max-content;color:#fff4fa}.hero-name span{color:#d4adf1}.glow{position:relative;isolation:isolate}.glow::before{content:attr(data-glow);position:absolute;inset:0;z-index:-1;color:#dfb1ff;filter:url('#grain-glow');opacity:.9;pointer-events:none}.hero-name::before{opacity:1.1}.hero-tagline{font-size:clamp(28px,3.2vw,42px);line-height:1.5;letter-spacing:.08em}.hero-intro{margin-top:22px;font-size:14px;line-height:2;letter-spacing:.08em;color:var(--muted)}.explore-link{display:flex;align-items:center;gap:36px;width:max-content;font-size:12px;letter-spacing:.08em;margin-top:30px;padding-bottom:11px;border-bottom:1px solid #a98bbb}.explore-link span{font-size:22px;line-height:1;transition:transform .4s}.explore-link:hover span{transform:translate(3px,-3px)}.character-stage{position:relative;height:100%;min-height:630px;max-height:800px;align-self:center;z-index:3;transform:translate(var(--pointer-x),var(--pointer-y));transition:transform 1.2s ease-out}.character-media{position:absolute;inset:-5% -5% -3%;display:flex;align-items:center;justify-content:center}.character-poster{height:100%;width:100%;object-fit:contain;object-position:50% 50%;filter:drop-shadow(0 0 28px #bd85d51c);transition:opacity 1.3s}.character-media canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity 1.3s}.character-media.has-video .character-poster{opacity:0}.character-media.has-video canvas{opacity:1}.character-media video{display:none}.character-halo{position:absolute;width:80%;height:85%;border-radius:50%;top:3%;left:10%;background:radial-gradient(ellipse,#a96bbb36 0,#75458526 35%,transparent 70%);filter:blur(36px);animation:breathe 8s ease-in-out infinite}.floating-note{position:absolute;font-size:11px;letter-spacing:.08em;color:#dbc3ee;z-index:2}.note-top{right:-2%;top:12%;writing-mode:vertical-rl;display:flex;align-items:center;gap:12px}.note-top i{font-size:28px;font-style:normal}.note-bottom{bottom:15%;left:-5%;font-size:12px;font-style:italic;letter-spacing:.04em;line-height:1.65;transform:rotate(-8deg)}.coordinate{position:absolute;bottom:2%;right:0;font-size:9px;font-family:monospace;line-height:1.8;letter-spacing:.16em;color:#baa7ce;opacity:.7}.hero-orbit{position:absolute;z-index:1;right:-8%;top:20%;width:62%;height:63%;transform:rotate(-20deg);pointer-events:none}.hero-orbit i{position:absolute;inset:0;border:1px solid #bc8de82b;border-radius:50%}.hero-orbit i:nth-child(2){inset:7%;transform:rotate(35deg);border-style:dashed;opacity:.5}.hero-orbit i:nth-child(3){inset:-7% 23%;transform:rotate(60deg);border-color:#bc8de815}.hero-orbit::after{content:'';width:9px;height:9px;position:absolute;top:24%;left:2%;border-radius:50%;background:#d1a2ed;box-shadow:0 0 18px #b77fe7}.hero-bottom{position:absolute;bottom:30px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;color:#b7a4ca}.scroll-cue{font-size:10px;display:flex;align-items:center;gap:14px;letter-spacing:.12em}.scroll-line{width:35px;height:1px;background:#bd93df;position:relative;overflow:hidden}.scroll-line::after{content:'';position:absolute;inset:0;background:#fff;animation:scroll-line 2.5s infinite}.hero-bottom .micro{font-size:8px}.hero-bottom .micro span{margin-left:20px;font-size:17px}.entrance{animation:focus-in 1.8s cubic-bezier(.2,.65,.2,1) both}.hero-name{animation-delay:.15s}.hero-tagline{animation-delay:.25s}.hero-intro{animation-delay:.4s}.explore-link{animation-delay:.55s}.character-stage.entrance{animation-duration:2.4s;animation-delay:.2s}
.section-kicker{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:24px;font-size:10px;letter-spacing:.15em;color:#bba6d0}.section-kicker span:last-child{letter-spacing:.1em}.about{padding-top:80px;padding-bottom:120px}.about-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:100px;align-items:center;margin-top:100px}.about-heading{position:relative}.outline-star{display:block;font-size:60px;line-height:1;margin-bottom:28px;color:#b88edc}.about h2,.favorites h2{font-size:clamp(34px,4.5vw,58px);letter-spacing:.035em;line-height:1.6}.lavender{color:var(--lavender)}.about-copy{padding-top:50px;font-size:15px;line-height:2.2;letter-spacing:.04em;color:#cbbbdc}.about-copy p+p{margin-top:26px}.traits{display:flex;gap:12px;margin-top:33px}.traits span{font-size:11px;border:1px solid #b88ade40;border-radius:24px;padding:7px 14px;color:#dcc6f0}.traits i{font-style:normal;margin-right:8px;color:#c49bea}.manifesto{display:flex;align-items:center;justify-content:space-between;margin-top:95px;padding:35px 0;border-bottom:1px solid var(--line);border-top:1px solid var(--line)}.manifesto .micro{font-size:9px;color:#9e88b5}.manifesto p{font-size:19px;letter-spacing:.1em}.manifesto>span:last-child{font-size:34px;color:#c9a9e4}.mobile-break{display:none}.favorites{padding-bottom:100px}.favorites-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin:65px 0 60px}.favorites-heading>p{font-size:13px;line-height:2.2;color:#bdaacb;margin-bottom:10px;letter-spacing:.04em}.joy{display:grid;grid-template-columns:40px 95px 1.45fr 1fr auto;align-items:center;gap:25px;border-top:1px solid var(--line);min-height:165px;position:relative;padding:26px 10px;transition:background .6s}.joy:last-child{border-bottom:1px solid var(--line)}.joy::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 40% 50%,#9b5bdc19,transparent 75%);opacity:0;transition:opacity .6s}.joy:hover::before{opacity:1}.joy-number{font:10px/1 monospace;color:#a48dbd}.joy h3{font-size:23px;line-height:1.7;font-weight:500;letter-spacing:.06em}.joy h3 span{display:block;font-size:8px;font-weight:400;letter-spacing:.13em;color:#ab93c3;margin-top:9px}.joy>p{font-size:12px;line-height:2;color:#bdaccd}.joy-aside{font-size:10px;color:#bda4ce;white-space:nowrap}.joy-aside i{font-style:normal;margin-left:20px;font-size:22px}.joy-symbol{width:55px;height:55px;margin:auto;filter:blur(1.5px);opacity:.85;transition:filter .7s,transform .7s}.joy:hover .joy-symbol{filter:blur(0);transform:rotate(-8deg) scale(1.07)}.moon{width:48px;height:48px;border-radius:50%;box-shadow:inset 13px -6px 0 0 #c5a1ec;transform:rotate(-20deg)}.circles{position:relative}.circles i{position:absolute;top:10px;left:0;border:1px solid #d7abdb;background:#c084a120;width:36px;height:36px;border-radius:50%}.circles i+i{left:20px;top:0;background:#ddb2b033}.diamond{width:38px;height:48px;background:linear-gradient(120deg,#e3c0ef66,#9b6dbb33);border:1px solid #be9bdb;transform:rotate(30deg);box-shadow:0 0 25px #cb9ae82b}.cross{position:relative;width:40px;height:40px}.cross::before,.cross::after{content:'';position:absolute;left:19px;top:0;width:1px;height:40px;background:#aa8cbf;transform:rotate(45deg)}.cross::after{transform:rotate(-45deg)}.joy-no{opacity:.75}.portrait-section{padding-top:20px;padding-bottom:120px}.portrait-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:35px}.portrait-heading h2{font-size:29px;font-weight:500;letter-spacing:.06em;margin-top:12px}.portrait-heading>.micro{font-size:9px;color:#a891be}.turnaround{background:#f7f3ef;padding:35px 35px 20px;position:relative;border-radius:3px;box-shadow:0 30px 100px #09031355}.turnaround img{width:100%;height:auto;display:block;mix-blend-mode:multiply}.turnaround figcaption{display:flex;justify-content:space-around;color:#79637e;font-size:9px;letter-spacing:.15em;padding-top:18px;border-top:1px solid #79637e30;margin-top:8px}.favorite-person{padding-bottom:130px;isolation:isolate}.love-copy{text-align:center;padding:115px 0 20px}.love-prelude{font-size:17px;letter-spacing:.15em;line-height:2.3;color:#d7c4e3}.love-copy h2{width:max-content;max-width:100%;font-size:clamp(66px,12vw,160px);letter-spacing:-.035em;line-height:1.5;margin:10px auto 14px}.love-copy h2 span{color:#c69ee2}.love-note{font-size:15px;line-height:2;letter-spacing:.1em;color:#bea6d1}.love-sign{display:block;font-size:11px;letter-spacing:.1em;color:#d0aedc;margin-top:45px;font-style:italic}.love-orbit{position:absolute;left:50%;top:160px;transform:translateX(-50%) rotate(-20deg);width:76%;height:350px;z-index:-1;pointer-events:none}.love-orbit i{border:1px solid #bb8dd02b;position:absolute;inset:0;border-radius:50%;filter:blur(.5px)}.love-orbit i+i{transform:rotate(33deg);inset:20% 5%;border-color:#bb8dd014}.love-orbit span{position:absolute;top:0;left:20%;font-size:55px;color:#d8a5d7;filter:blur(2px);text-shadow:0 0 35px #d095ee;animation:heart-drift 10s ease-in-out infinite alternate}.site-footer{border-top:1px solid var(--line);padding:40px 0 45px;display:flex;justify-content:space-between;align-items:center}.footer-logo{font-size:33px;font-weight:700}.site-footer p{font-size:11px;color:#af98c4;letter-spacing:.13em}.back-top{font-size:9px;letter-spacing:.15em;color:#c6addb}.back-top span{margin-left:25px;font-size:20px}.reveal{opacity:1;transform:none;filter:none}.js-motion .reveal:not(.is-visible){opacity:0;transform:translateY(24px);filter:blur(10px)}.js-motion .reveal{transition:opacity 1.1s ease,filter 1.1s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
@keyframes drift{from{transform:translate(-20px,-20px) rotate(-8deg)}to{transform:translate(45px,40px) rotate(12deg)}}@keyframes float-ring{from{transform:translate(0,0) rotate(-15deg) scale(.85)}to{transform:translate(-100px,100px) rotate(30deg) scale(1.15)}}@keyframes breathe{50%{opacity:.55;transform:scale(1.06)}}@keyframes grain-shift{0%,100%{transform:translate(0,0)}25%{transform:translate(-20px,15px)}50%{transform:translate(15px,-25px)}75%{transform:translate(-10px,-10px)}}@keyframes focus-in{from{opacity:0;filter:blur(18px);translate:0 15px}to{opacity:1;filter:blur(0);translate:0 0}}@keyframes scroll-line{from{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes heart-drift{to{transform:translate(20px,-18px) rotate(15deg)}}
.motion-paused *,.motion-paused *::before,.motion-paused *::after{animation-play-state:paused!important}.motion-paused .entrance{animation:none;opacity:1;filter:none;translate:none}.motion-paused .reveal{transition:none!important;opacity:1!important;filter:none!important;transform:none!important}.motion-paused .character-stage{transform:none;transition:none}.motion-paused .grain{transform:none}
@media(min-width:1600px){.hero{min-height:900px}.hero-name{font-size:270px}}
@media(max-width:1100px){.section-shell{width:calc(100% - 72px)}.site-header{padding-inline:36px}.site-header nav{gap:20px}.wordmark-note{display:none}.hero{min-height:780px}.character-stage{min-height:590px}.hero-name{font-size:200px}.hero-orbit{right:-5%}.about-layout{gap:50px}.joy{grid-template-columns:25px 65px 1.3fr 1fr;gap:20px}.joy-aside{display:none}.joy h3{font-size:20px}.note-bottom{left:0;bottom:11%}.hero-tagline{font-size:32px}}
@media(max-width:760px){html{scroll-padding-top:30px}.section-shell{width:calc(100% - 44px)}.site-header{height:82px;padding-inline:22px}.wordmark{font-size:25px;gap:8px}.brand-orbit{font-size:29px}.site-header nav{display:none}.motion-toggle{font-size:10px;padding:7px 10px}.hero{height:auto;min-height:1000px;display:block;padding:125px 0 95px}.hero-copy{padding:0;position:relative;z-index:5;pointer-events:none}.hero-copy a{pointer-events:auto}.hero .eyebrow{font-size:8px;gap:8px;letter-spacing:.12em}.hero-name{font-size:180px;margin:15px 0 8px}.hero-tagline{font-size:28px;letter-spacing:.03em}.hero-intro{font-size:12px;line-height:1.9;margin-top:19px;max-width:80%}.explore-link{font-size:11px;margin-top:25px;gap:28px}.character-stage{height:530px;min-height:0;margin-top:-25px;width:100%;max-height:none}.character-media{inset:0 -5% 0 5%}.character-halo{top:0;left:18%;width:80%}.note-top{top:17%;right:2%;font-size:9px}.note-top i{font-size:22px}.note-bottom{left:1%;bottom:20%;font-size:11px}.coordinate{font-size:8px;bottom:0;right:0}.hero-orbit{width:110%;height:360px;top:auto;bottom:180px;right:-8%}.hero-bottom{bottom:25px}.hero-bottom>.micro{display:none}.scroll-cue{font-size:9px}.about{padding-top:45px;padding-bottom:70px}.section-kicker{font-size:8px;letter-spacing:.08em;padding-top:20px;gap:20px}.section-kicker span:last-child{font-size:9px;letter-spacing:.02em}.about-layout{display:block;margin-top:55px}.outline-star{font-size:42px;margin-bottom:20px}.about h2,.favorites h2{font-size:38px;line-height:1.65}.about-copy{padding-top:35px;font-size:13px}.about-copy p+p{margin-top:22px}.traits{margin-top:24px}.traits span{font-size:10px}.manifesto{margin-top:55px;display:block;padding:25px 0;position:relative}.manifesto .micro{font-size:8px}.manifesto p{font-size:18px;margin-top:15px;line-height:1.9}.mobile-break{display:block}.manifesto>span:last-child{position:absolute;right:0;top:53px;font-size:32px}.favorites{padding-bottom:60px}.favorites-heading{display:block;margin:40px 0}.favorites-heading>p{margin-top:22px;font-size:12px}.joy{grid-template-columns:20px 45px 1fr;gap:14px;min-height:175px;padding:27px 0}.joy h3{font-size:19px;letter-spacing:.02em;align-self:end}.joy h3 span{font-size:7px;letter-spacing:.08em;margin-top:6px}.joy>p{grid-column:3;font-size:11px;line-height:1.9;align-self:start}.joy-number{grid-row:1/3;align-self:start;padding-top:9px;font-size:9px}.joy-symbol{grid-row:1/3;align-self:center;transform:scale(.8)}.joy:hover .joy-symbol{transform:scale(.85)}.portrait-section{padding-top:10px;padding-bottom:70px}.portrait-heading{display:block;margin-bottom:23px}.portrait-heading h2{font-size:25px}.portrait-heading>.micro{display:none}.turnaround{padding:12px 8px 10px}.turnaround figcaption{font-size:6px;padding-top:9px;margin-top:2px;letter-spacing:.1em}.favorite-person{padding-bottom:70px}.love-copy{padding:75px 0 10px}.love-prelude{font-size:13px;letter-spacing:.08em}.love-copy h2{font-size:clamp(55px,17vw,100px);margin-top:20px;margin-bottom:22px}.love-note{font-size:12px;letter-spacing:.05em}.love-sign{font-size:9px;margin-top:30px}.love-orbit{top:145px;width:100%;height:210px}.love-orbit span{font-size:35px;left:4%;top:0}.site-footer{padding:28px 0;flex-wrap:wrap;gap:15px}.site-footer p{font-size:9px}.footer-logo{font-size:27px}.back-top{width:100%;text-align:right;font-size:8px}.back-top span{margin-left:15px;font-size:17px}.mist-a{width:130vw;height:110vw;top:0;right:-70%;filter:blur(60px)}.mist-b{width:90vw;height:90vw;top:60%;left:-50%;filter:blur(60px)}.blur-ring{width:230px;height:230px;left:30%;top:22%;filter:blur(22px);opacity:.15}.blur-square{right:-10%;width:90px;height:90px}.star-a{font-size:50px}.grain{opacity:.07}}
@media(min-width:560px) and (max-width:760px){.hero{min-height:1130px}.character-stage{height:640px;margin-top:-100px;margin-left:16%;width:84%}.hero-name{font-size:200px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js-motion .reveal:not(.is-visible){opacity:1;filter:none;transform:none}.character-stage{transform:none!important}}
/* Frosted-light treatment, matched to the supplied visual reference. */
.frosted-portal{position:absolute;right:0;top:12%;width:54%;height:82%;z-index:1;opacity:.42;transform:rotate(13deg);overflow:visible;pointer-events:none;animation:portal-drift 19s ease-in-out infinite alternate}
.hero-name{color:#fff0ed;text-shadow:0 0 2px #ffe7dc99}
.hero-name::before{opacity:1.2}
.love-copy h2::before{opacity:1.08}
@keyframes portal-drift{from{transform:translate(-12px,-8px) rotate(9deg);opacity:.35}to{transform:translate(14px,15px) rotate(16deg);opacity:.52}}
@media(max-width:760px){.frosted-portal{width:115%;height:540px;top:auto;bottom:100px;right:-13%;opacity:.4}.hero-name::before{opacity:.95}}
/* Fine-grain finish: low contrast film grain, smooth luminous cores, sparse dust. */
html{overflow-x:clip}main{overflow:clip}
.grain{opacity:.025;animation:none}
#glow-dust{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:8}
.hero-name::before{opacity:1.05}
.love-copy h2::before{opacity:1}
.hero-name{text-shadow:0 0 1.5px #ffe7dc66}
@media(max-width:760px){.grain{opacity:.022}}
/* Luminous gradient material: a smooth core with a fine texture inside the light. */
.hero-name,.love-copy h2{background:linear-gradient(120deg,#e7d8ff 5%,#d2b3ff 48%,#ac7ae9 100%);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:none}
.hero-name span,.love-copy h2 span{color:inherit}
.hero-name::after,.love-copy h2::after{content:attr(data-glow);position:absolute;inset:0;pointer-events:none;background-image:url('../assets/noise.svg');background-size:120px;background-clip:text;-webkit-background-clip:text;color:transparent;mix-blend-mode:soft-light;opacity:.11}
.custom-cursor{position:fixed;top:0;left:0;width:44px;height:49.5px;z-index:100;pointer-events:none;opacity:0;will-change:transform}
.custom-cursor svg{width:100%;height:100%;overflow:visible;transition:transform .18s,filter .3s}
.custom-cursor.is-link svg{transform:scale(1.12);filter:brightness(1.16)}
.custom-cursor.is-down svg{transform:scale(.88)}
@media(hover:hover) and (pointer:fine){.custom-cursor-ready,.custom-cursor-ready *{cursor:none!important}.custom-cursor-ready .custom-cursor{opacity:1}}
.joy-icon{width:94px;height:94px;filter:none;opacity:1;overflow:visible}
.joy:hover .joy-icon{filter:none;transform:scale(1.06)}
.holo-sign{fill:#b394ed10;stroke:url('#holo-spectrum');stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;filter:url('#holo-bloom')}
.holo-energy{transform-origin:60px 60px;animation:holo-flow 18s linear infinite}
.joy:nth-child(2){--holo-delay:-5s}.joy:nth-child(3){--holo-delay:-10s}.joy:nth-child(4){--holo-delay:-14s}
.joy .holo-energy{animation-delay:var(--holo-delay,0s)}
@keyframes holo-flow{to{transform:rotate(360deg)}}
.about-layout{grid-template-columns:.9fr 1.1fr;grid-template-rows:auto auto;column-gap:45px;row-gap:0;margin-top:55px;align-items:start}
.about-heading{grid-column:1;grid-row:1;padding-top:70px;z-index:2}
.about-copy{grid-column:1;grid-row:2;padding-top:20px;padding-bottom:30px;z-index:2}
.focus-portrait{grid-column:2;grid-row:1/3;position:relative;height:670px;isolation:isolate}
.focus-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.portrait-echo{filter:blur(17px) saturate(.25);opacity:.31;transform:translate(-15%,8%) scale(1.1);z-index:-1}
.focus-window{position:absolute;inset:5% 15% 4% 30%;background:linear-gradient(160deg,#0e071eb3,#24113c66);border:1px solid #dbc0ee80;box-shadow:0 0 45px #bb7ae512}
.portrait-sharp{clip-path:inset(5% 15% 4% 30%);filter:drop-shadow(0 0 18px #b68cce15)}
.portrait-caption{position:absolute;right:15%;top:0;font-size:8px;letter-spacing:.13em;color:#bea6d2}
.portrait-index{position:absolute;right:15%;bottom:0;font-size:8px;letter-spacing:.13em;color:#947ca9}
.about .manifesto{margin-top:45px}
@media(max-width:1100px) and (min-width:761px){.focus-portrait{height:630px}.about-layout{gap:0 15px}.about-heading{padding-top:45px}.about h2{font-size:42px}.about-copy{font-size:13px}}
@media(max-width:760px){.joy{grid-template-columns:18px 68px 1fr;gap:12px}.joy-icon{width:76px;height:76px;margin-left:-4px;transform:none}.joy:hover .joy-icon{transform:scale(1.04)}.joy h3{font-size:17px}.about-layout{display:flex;flex-direction:column;gap:0;margin-top:45px}.about-heading{padding-top:0}.focus-portrait{width:100%;height:440px;margin:28px 0 10px}.focus-window{inset:5% 12% 4% 30%}.portrait-sharp{clip-path:inset(5% 12% 4% 30%)}.portrait-caption,.portrait-index{right:12%}.about-copy{padding-top:14px}.custom-cursor{display:none}}
/* Compact northwest-pointing cursor, with grain only in its feathered aura. */
.custom-cursor{width:32px;height:36px}
/* Four editorial motion cards. */
.joy-controls{display:flex;align-items:center;justify-content:space-between;margin:0 0 20px;color:#b9a1cf}
.joy-controls .micro{font-size:9px}.joy-controls>div{display:flex;gap:10px}
.joy-controls button{width:38px;height:38px;border:1px solid var(--line);background:#ffffff04;border-radius:50%;font-size:18px;transition:background .3s,transform .3s}.joy-controls button:hover{background:#ac78d329;transform:translateY(-2px)}
.joy-list{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:10px 0 25px;overscroll-behavior-x:contain}.joy-list::-webkit-scrollbar{display:none}
.joy{flex:0 0 clamp(280px,31vw,370px);height:485px;min-height:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:0;padding:28px;border:1px solid #b899d12b!important;border-radius:22px;overflow:hidden;isolation:isolate;scroll-snap-align:start;background:linear-gradient(155deg,#48266a,#20132f 72%);transition:filter .7s,transform .7s,box-shadow .7s}
.joy:nth-child(2){background:linear-gradient(160deg,#552d45,#25132c 74%)}.joy:nth-child(3){background:linear-gradient(155deg,#3a326d,#1c1438 75%)}.joy:nth-child(4){background:linear-gradient(155deg,#293d50,#1d1832 75%);opacity:1}
.joy::before{inset:0;opacity:.09;z-index:1;pointer-events:none;background-image:url('../assets/noise.svg');background-size:125px;mix-blend-mode:soft-light}
.joy:hover::before{opacity:.09}.joy:hover{box-shadow:0 12px 35px #07021140}
.joy-number{position:absolute;top:26px;left:28px;font-size:11px;color:#e4c8f3;z-index:3}
.joy-icon{position:absolute;right:11px;top:8px;width:88px;height:88px;z-index:3;margin:0}
.joy h3{position:relative;z-index:3;font-size:23px;line-height:1.6;margin-bottom:15px;letter-spacing:.015em;font-weight:500}
.joy h3 span{font-size:8px;letter-spacing:.1em;margin-top:8px;color:#cfb3df}
.joy>p{position:relative;z-index:3;font-size:12px;color:#d6c1e1;line-height:1.9}
.joy-aside{display:block;position:relative;z-index:3;margin-top:22px;font-size:9px;color:#bfa6d0;width:100%;border-top:1px solid #d7b5e321;padding-top:13px}.joy-aside i{float:right;margin-left:0;font-size:15px;line-height:1}
.joy-art{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.joy-art::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 35%,#1b102a66 52%,#1b102acc 68%,#1b102a55 100%)}
.joy-art i{position:absolute;display:block;width:230px;height:230px;left:55px;top:72px;background:radial-gradient(circle at 28% 22%,#f0c1fa,#b579dc 35%,#6c3bb2 65%,#31174c 90%);border-radius:45% 55% 55% 45%;box-shadow:inset 2px 4px 12px #ffe3ff60,inset -15px -20px 35px #12062188,0 0 40px #b680ed29;filter:blur(.5px);animation:joy-sculpture 13s ease-in-out infinite alternate;transform:rotate(-25deg)}
.joy-art i+i{width:130px;height:130px;left:-50px;top:170px;filter:blur(10px);opacity:.5;animation-delay:-6s}
.joy:nth-child(2) .joy-art i{border-radius:38% 62% 45% 55%;background:radial-gradient(circle at 30% 20%,#ffddae,#eaa389 28%,#b7608b 60%,#51254c 88%);animation-delay:-4s}
.joy:nth-child(3) .joy-art i{background:conic-gradient(from 30deg,#a2a7ff,#ecc1ed,#9f80e9,#535cc6,#a2a7ff);border-radius:50%;mask-image:radial-gradient(ellipse,transparent 42%,#000 44%,#000 68%,transparent 70%);width:260px;height:245px;top:64px;left:38px;transform:rotate(-25deg);animation-delay:-8s}
.joy:nth-child(4) .joy-art i{background:radial-gradient(circle at 30% 24%,#b7d6d4,#83b2af 28%,#7477b4 65%,#343058 90%);border-radius:18% 82% 22% 78%;width:230px;height:195px;top:100px;left:55px;animation-delay:-11s}
@keyframes joy-sculpture{from{translate:-7px -5px;rotate:-8deg;scale:.95}to{translate:12px 12px;rotate:15deg;scale:1.06}}
@media(max-width:760px){.joy-list{gap:16px;padding-bottom:18px}.joy{flex-basis:86%;height:450px;padding:25px}.joy h3{font-size:22px}.joy h3 span{font-size:8px}.joy>p{font-size:12px}.joy-controls{margin-bottom:12px}.joy-controls .micro{font-size:8px}.joy-icon{width:83px;height:83px;right:9px;top:7px}.joy-art i{left:38px;top:70px;width:210px;height:210px}.joy:nth-child(3) .joy-art i{left:20px;width:240px;height:230px}.joy:nth-child(4) .joy-art i{left:35px}.joy-aside{font-size:9px}}
/* Subpixel edge grain is rendered from each title's glyphs, with stable noise. */
.lavender.glow{display:inline-block}
.text-halo{position:absolute;pointer-events:none;z-index:-1;mix-blend-mode:screen;max-width:none!important;opacity:1}
.glow.grain-rendered::before{opacity:.36}
.hero-name::after,.love-copy h2::after{display:none}
@media(prefers-reduced-motion:reduce){.joy-list{scroll-behavior:auto}}

/* User review: fixed navigation, edge defocus, and handwritten personal notes. */
@font-face{font-family:LiaoHand;src:url('../assets/fonts/liao-handwriting.woff2?v=47bc55c3') format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{--hand:LiaoHand,Jinxuan,'PingFang TC',sans-serif}
.note-bottom,.manifesto p,.love-note,.love-sign,.joy-aside{font-family:var(--hand);font-weight:400;font-style:normal}
.note-bottom{font-size:19px;line-height:1.3}.manifesto p{font-size:27px;letter-spacing:.03em}.love-note{font-size:24px;line-height:1.65;letter-spacing:.04em}.love-sign{font-size:20px;letter-spacing:.01em}.joy-aside{font-size:16px}.drag-hint{font:400 13px/1.6 var(--font);letter-spacing:.06em;color:#c5afd9;display:flex;gap:14px;align-items:center}.drag-hint span{font:18px/1 var(--font)}
.site-header{position:fixed;height:92px;isolation:isolate}
.site-header::before{content:'';position:absolute;inset:0 0 -54px;z-index:-1;pointer-events:none;background:linear-gradient(#160c2dcc,#160c2d66 60%,#160c2d00);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);mask-image:linear-gradient(#000 45%,#000c 65%,transparent);-webkit-mask-image:linear-gradient(#000 45%,#000c 65%,transparent)}
.site-header.is-scrolled::before{background:linear-gradient(#160c2de6,#160c2d88 60%,#160c2d00)}
.viewport-fade{position:fixed;bottom:0;left:0;right:0;height:68px;z-index:25;pointer-events:none;background:linear-gradient(transparent,#160c2d55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);mask-image:linear-gradient(transparent,#000);-webkit-mask-image:linear-gradient(transparent,#000)}
html{scroll-padding-top:140px}
.hero-name,.love-copy h2{padding-right:.14em;overflow:visible}
.hero-name{letter-spacing:-.055em}
.twin-symbol{right:-2%;top:8%;width:58%;height:86%;opacity:.52;filter:drop-shadow(0 0 6px #b386dc55) blur(.6px);animation:symbol-drift 19s ease-in-out infinite alternate}
@keyframes symbol-drift{from{transform:translate(-12px,-10px) rotate(-8deg);filter:drop-shadow(0 0 5px #b386dc44) blur(.5px)}to{transform:translate(18px,18px) rotate(6deg);filter:drop-shadow(0 0 9px #b386dc66) blur(1.7px)}}
.focus-portrait{height:620px}
.focus-window{inset:1% 14% 27% 24%;background:linear-gradient(160deg,#0e071e80,#24113c33)}
.portrait-sharp{clip-path:inset(1% 14% 27% 24%)}
.portrait-echo{opacity:.25;filter:blur(21px) saturate(.3)}
.portrait-caption{right:14%;top:-4%}.portrait-index{right:14%;bottom:23%}
.turnaround{background:transparent;padding:20px 0 0;box-shadow:none}
.turnaround img{mix-blend-mode:normal;filter:drop-shadow(0 18px 26px #08021144)}
.turnaround figcaption{color:#bfa5d9;border-color:#bfa5d92b;padding-top:24px}

/* Direct dragging; soft noisy boundaries hint at the remaining cards. */
.joy-viewport{position:relative}
.joy-list{cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-x pan-y;scroll-padding-inline:8px;padding:10px 8px 25px}
.joy-list:focus-visible{outline:1px solid #c6a0ef88;outline-offset:10px;border-radius:22px}
.joy-list.is-dragging{scroll-behavior:auto;scroll-snap-type:none;cursor:grabbing}
.joy-list.is-dragging .joy{pointer-events:none}
.joy{flex-basis:clamp(290px,31vw,380px);height:530px;background:#1b102b!important}
.joy-art img,.joy-art video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}
.joy-art::after{background:linear-gradient(transparent 40%,#1b102b22 52%,#1b102baa 67%,#1b102be8)}
.joy-art img{animation:illustration-breathe 12s ease-in-out infinite alternate}
.joy:nth-child(2) .joy-art img{animation-delay:-3s}.joy:nth-child(3) .joy-art img{animation-delay:-6s}.joy:nth-child(4) .joy-art img{animation-delay:-9s}
.joy-video{opacity:0;transition:opacity .7s}.joy-video.is-ready{opacity:1}
.joy-art:has(.joy-video.is-ready) img{animation:none}
.joy::before{opacity:.035}.joy:hover::before{opacity:.035}
.joy h3{font-size:23px}.joy-number{color:#eedbff}
.joy-edge{position:absolute;top:10px;bottom:25px;width:var(--edge-width);z-index:9;pointer-events:none;opacity:0;transition:opacity .45s;background:transparent;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);mask-image:linear-gradient(90deg,transparent,#00000012 15%,#000000b3 38%,#00000080 65%,#0000001f 88%,transparent),linear-gradient(transparent,#000 28px,#000 calc(100% - 28px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#00000012 15%,#000000b3 38%,#00000080 65%,#0000001f 88%,transparent),linear-gradient(transparent,#000 28px,#000 calc(100% - 28px),transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.joy-edge-left{left:0}.joy-edge-right{right:0;transform:scaleX(-1)}
.has-left .joy-edge-left,.has-right .joy-edge-right{opacity:1}
.dragging-cards .custom-cursor svg{transform:scale(1.12);filter:brightness(1.2)}
@keyframes illustration-breathe{from{transform:scale(1.015) translateY(2px)}to{transform:scale(1.045) translateY(-3px)}}

/* A gently moving constellation around the favorite person's name. */
.love-mist{position:absolute;inset:17% 12% 14%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 30% 55%,#8d43c133,transparent 58%),radial-gradient(ellipse at 70% 40%,#c57ee22b,transparent 55%);filter:blur(40px);animation:love-atmosphere 12s ease-in-out infinite alternate}
.love-orbit{animation:love-orbit-drift 21s ease-in-out infinite alternate}
.love-orbit i:first-child{animation:orbit-tilt 15s ease-in-out infinite alternate}
.love-orbit i:nth-child(2){animation:orbit-tilt 18s ease-in-out -9s infinite alternate-reverse}
.love-orbit>span{animation:heart-float 7s ease-in-out infinite;filter:blur(1.2px)}
.orbit-mote{position:absolute;top:0;left:0;width:4px;height:4px;border-radius:50%;background:#d1adf4;box-shadow:0 0 12px 2px #c393ed66;offset-path:ellipse(48% 44% at 50% 50%);animation:orbit-travel 21s linear infinite;opacity:.6}
.orbit-mote:nth-of-type(2){animation-delay:-6s;width:2px;height:2px;opacity:.4}.orbit-mote:nth-of-type(3){animation-delay:-12s;width:3px;height:3px;opacity:.45}.orbit-mote:nth-of-type(4){animation-delay:-17s;width:2px;height:2px;opacity:.35}
.love-copy h2 .text-halo{animation:name-bloom 5s ease-in-out infinite alternate}
@keyframes love-atmosphere{to{transform:translate(18px,-12px) scale(1.12);opacity:.55}}
@keyframes love-orbit-drift{from{transform:translateX(-50%) rotate(-20deg)}to{transform:translateX(-50%) translateY(-13px) rotate(-12deg)}}
@keyframes orbit-tilt{to{rotate:10deg;scale:1.04}}
@keyframes orbit-travel{to{offset-distance:100%}}
@keyframes heart-float{0%,100%{transform:translate(0,0) rotate(-6deg) scale(1);opacity:.7}50%{transform:translate(16px,-14px) rotate(7deg) scale(1.08);opacity:1}}
@keyframes name-bloom{from{opacity:.65}to{opacity:1}}
@media(max-width:760px){
 .site-header{height:112px;align-items:flex-start;padding-top:23px}.site-header nav{display:flex;position:absolute;left:0;right:0;top:77px;justify-content:center;gap:27px;font-size:11px}.site-header nav span{font-size:9px}.site-header::before{bottom:-42px}.hero{padding-top:154px}.viewport-fade{height:45px}html{scroll-padding-top:148px}
 .note-bottom{font-size:17px}.manifesto p{font-size:24px}.love-note{font-size:21px}.love-sign{font-size:17px}.joy-aside{font-size:15px}.drag-hint{font-size:11px;gap:8px}.joy-controls .micro{font-size:7px;letter-spacing:.07em}
 .joy{height:500px;flex-basis:87%;padding:25px}.joy h3{font-size:22px}.joy-list{gap:16px;padding-inline:3px}
 .focus-portrait{height:460px;margin-bottom:-50px}.focus-window{inset:1% 10% 27% 20%}.portrait-sharp{clip-path:inset(1% 10% 27% 20%)}.portrait-caption,.portrait-index{right:10%}.portrait-caption{top:-4%}.portrait-index{bottom:23%}
 .twin-symbol{width:110%;height:540px;top:auto;bottom:105px;right:-8%}.turnaround{padding:10px 0 0}.turnaround figcaption{font-size:7px;padding-top:15px}
}
/* Smooth alpha falloff dissolves the cards into the actual page background.
   The blur/grain veil also fades on all four sides, without a tinted panel. */
.joy-viewport{--edge-width:clamp(112px,11vw,156px);--fade-left:0px;--fade-right:0px}
.joy-viewport.has-left{--fade-left:var(--edge-width)}
.joy-viewport.has-right{--fade-right:var(--edge-width)}
.joy-edge::after{content:'';position:absolute;inset:0;background:url('../assets/noise.svg');background-size:90px;opacity:.075;mix-blend-mode:soft-light}
.joy-list{--card-edge-mask:linear-gradient(90deg,transparent,#00000009 calc(var(--fade-left)*.12),#00000029 calc(var(--fade-left)*.28),#00000061 calc(var(--fade-left)*.45),#000000a8 calc(var(--fade-left)*.64),#000000e0 calc(var(--fade-left)*.82),#000 var(--fade-left),#000 calc(100% - var(--fade-right)),#000000e0 calc(100% - var(--fade-right)*.82),#000000a8 calc(100% - var(--fade-right)*.64),#00000061 calc(100% - var(--fade-right)*.45),#00000029 calc(100% - var(--fade-right)*.28),#00000009 calc(100% - var(--fade-right)*.12),transparent);mask-image:var(--card-edge-mask);-webkit-mask-image:var(--card-edge-mask)}
@media(max-width:760px){.joy-viewport{--edge-width:60px}.joy-edge{bottom:18px}}

/* An illustrated conversation: the typography and portrait share one stage. */
.about-composition{position:relative;isolation:isolate;height:720px;margin-top:62px}
.about-backdrop{position:absolute;inset:58px 15% 38px 18%;border:1px solid #c69bea40;border-radius:38px 38px 130px 38px;background:radial-gradient(ellipse at 65% 30%,#75499a42,transparent 65%),linear-gradient(145deg,#40235c38,#1b102730);overflow:hidden;z-index:0}
.about-backdrop::after{content:'';position:absolute;inset:0;background:url('../assets/noise.svg');background-size:100px;opacity:.08;mix-blend-mode:soft-light;pointer-events:none}
.about-ghost-type{position:absolute;left:4%;bottom:-30px;font-size:clamp(210px,30vw,390px);font-weight:700;line-height:1;letter-spacing:-.08em;color:#bc8bde0a;-webkit-text-stroke:1px #c49ee322;transform:rotate(-8deg)}
.about-frame-note{position:absolute;left:30px;top:23px;font-size:8px;letter-spacing:.16em;color:#c6a8df88}
.about-headline{position:absolute;left:0;top:130px;z-index:4;pointer-events:none}
.about-headline>.micro{display:block;margin-bottom:23px;color:#bfa5d4;font-size:9px;letter-spacing:.22em}
.about .about-headline h2{font-size:clamp(42px,4.5vw,64px);line-height:1.55;letter-spacing:.015em}
.about-headline h2>span{display:block;width:max-content}
.about-headline .about-title-second{margin-left:30px;margin-top:5px}
.about-character{position:absolute;left:28%;top:37px;width:50%;height:660px;z-index:2;pointer-events:none;mask-image:linear-gradient(#000 73%,#000e 82%,transparent 98%);-webkit-mask-image:linear-gradient(#000 73%,#000e 82%,transparent 98%)}
.about-character img,.about-character canvas{position:absolute;left:0;top:0;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;transition:opacity .7s}
.about-character canvas{opacity:0}.about-character.has-video canvas{opacity:1}.about-character.has-video img{opacity:0}.about-character video{display:none}
.about-dialogue{position:absolute;right:0;top:3px;width:32%;z-index:5}
.about-speech{position:relative;transform:rotate(-5deg);padding:25px 30px 31px;background:linear-gradient(145deg,#3e245bea,#241333f5);border:1px solid #d1a2f077;box-shadow:7px 8px 0 -1px #ab78d227,0 0 45px #be8deb0b;border-radius:8px 8px 8px 2px;animation:about-speech-drift 10s ease-in-out infinite alternate}
.about-speech::after{content:'';position:absolute;left:32px;bottom:-14px;width:25px;height:25px;background:#2a173d;border-right:1px solid #d1a2f077;border-bottom:1px solid #d1a2f077;transform:skew(-15deg) rotate(45deg)}
.about-speech>.micro{font-size:8px;letter-spacing:.19em;color:#c5a6df}.about-speech>p{font-size:25px;line-height:1.7;margin-top:9px}.about-speech strong{color:#e3c6ff}.about-speech .about-speech-detail{font-size:13px;color:#cfbddf;line-height:1.85;margin-top:5px}.about-speech-star{position:absolute;right:20px;bottom:18px;font-size:24px;color:#c798e5;filter:drop-shadow(0 0 9px #c284db55)}
.about-thoughts{position:absolute;right:1%;top:350px;z-index:4;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.about-thought{display:flex;align-items:center;gap:15px;border:1px solid #d3ade85c;background:#2b173bd9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:30px;padding:9px 23px;font-size:15px;letter-spacing:.09em;box-shadow:0 0 25px #c298ee0a;animation:about-thought-drift 8s ease-in-out infinite alternate}
.about-thought:first-child{margin-right:35px}.about-thought:nth-child(2){animation-delay:-4s}.about-thought>span{color:#cfa8f2;font-size:19px}.about-thought-note{font:21px/1.6 var(--hand);color:#c4a6da;transform:rotate(-5deg);margin-top:4px;margin-right:17px}
.about-footnote{position:absolute;left:4%;bottom:50px;z-index:4;max-width:310px}.about-footnote .micro{font-size:8px;color:#a78bbd;letter-spacing:.12em}.about-footnote p{font-size:14px;line-height:2.2;color:#c9b8da;margin-top:17px}.about-handline{display:block;font:24px/1.6 var(--hand);color:#d8b8ec;transform:rotate(-5deg);margin-top:17px}
.about-side-note{position:absolute;right:0;top:235px;writing-mode:vertical-rl;font-size:8px;letter-spacing:.18em;color:#ad8ec5;opacity:.7}
.about-crosshair{position:absolute;left:14%;top:19px;width:80px;height:80px;z-index:1;color:#c69fe4}.about-crosshair i{position:absolute;inset:0;border:1px solid #c59cda4d}.about-crosshair i::before,.about-crosshair i::after{content:'';position:absolute;width:5px;height:5px;border-radius:50%;background:#cfa5eb}.about-crosshair i::before{left:-3px;top:-3px}.about-crosshair i::after{right:-3px;bottom:-3px}.about-crosshair>span{position:absolute;right:-15px;top:25px;background:#28123d;border-radius:50%;font-size:28px;line-height:1;padding:5px}.about-crosshair small{position:absolute;left:8px;bottom:6px;font:8px monospace;opacity:.6}
.about-spark{position:absolute;pointer-events:none;z-index:3;color:#d7b0f1;animation:about-spark-drift 7s ease-in-out infinite alternate}.about-spark-one{right:10%;bottom:60px;font-size:44px;filter:blur(1px)}.about-spark-two{left:37%;bottom:42px;font-size:25px;opacity:.5;animation-delay:-3s}
.about .manifesto{margin-top:15px}
@keyframes about-speech-drift{to{transform:translateY(-7px) rotate(-3.5deg)}}
@keyframes about-thought-drift{to{transform:translate(-5px,-6px)}}
@keyframes about-spark-drift{to{transform:translate(5px,-10px) rotate(12deg);opacity:.35}}
@media(min-width:1440px){.about-composition{height:780px}.about-character{height:720px}.about-headline{top:170px}.about-thoughts{top:390px}.about-footnote{bottom:65px}}
@media(min-width:761px) and (max-width:1000px){.about-composition{height:700px}.about-headline{top:150px}.about .about-headline h2{font-size:42px}.about-headline .about-title-second{margin-left:12px}.about-character{left:25%;width:60%;top:65px;height:610px}.about-dialogue{width:37%;top:7px}.about-speech{padding:19px 23px 24px}.about-speech>p{font-size:22px}.about-speech .about-speech-detail{font-size:12px}.about-thoughts{right:-1%;top:365px}.about-thought{padding:8px 17px;font-size:13px}.about-footnote{left:1%;bottom:37px}.about-footnote p{font-size:12px}.about-handline{font-size:22px}}
@media(max-width:760px){
 .about-composition{height:1000px;margin-top:38px}
 .about-backdrop{inset:170px 0 246px 0;border-radius:28px 28px 80px 28px}
 .about-frame-note{top:19px;left:20px;font-size:6px}.about-ghost-type{font-size:250px;left:0;bottom:0}
 .about-headline{top:0;left:0}.about-headline>.micro{font-size:7px;margin-bottom:13px}
 .about .about-headline h2{font-size:clamp(34px,8.8vw,48px);line-height:1.45}.about-headline .about-title-second{margin-left:24px;margin-top:0}
 .about-character{left:-4%;top:260px;width:108%;height:540px;mask-image:linear-gradient(#000 70%,#000d 84%,transparent);-webkit-mask-image:linear-gradient(#000 70%,#000d 84%,transparent)}
 .about-dialogue{top:155px;right:1%;width:66%;max-width:290px}.about-speech{padding:13px 20px 19px;transform:rotate(-5deg)}.about-speech>.micro{font-size:6px}.about-speech>p{font-size:20px;margin-top:3px}.about-speech .about-speech-detail{font-size:11px;line-height:1.75}.about-speech-star{right:15px;bottom:14px;font-size:18px}.about-speech::after{left:auto;right:27px;width:18px;height:18px;bottom:-10px}
 .about-crosshair{left:8%;top:164px;width:48px;height:48px}.about-crosshair>span{font-size:20px;top:16px;right:-12px;padding:3px}.about-crosshair small{font-size:6px}
 .about-thoughts{top:604px;right:0;gap:8px}.about-thought{font-size:12px;padding:7px 17px;gap:12px}.about-thought:first-child{margin-right:23px}.about-thought>span{font-size:15px}.about-thought-note{font-size:20px;margin-top:2px;margin-right:5px}
 .about-footnote{left:7%;bottom:10px;max-width:none}.about-footnote p{font-size:13px;line-height:2;margin-top:13px}.about-footnote .micro{font-size:7px}.about-handline{font-size:23px;margin-top:13px}
 .about-side-note{top:345px;right:-9px;font-size:6px}.about-spark-one{right:6%;bottom:168px;font-size:32px}.about-spark-two{left:7%;bottom:275px;font-size:22px}.about .manifesto{margin-top:25px}
}
@media(min-width:560px) and (max-width:760px){.about-composition{height:1140px}.about-character{left:5%;width:90%;height:670px}.about-thoughts{top:720px}.about-backdrop{bottom:260px}.about-footnote{bottom:5px}}

/* Free dragging and comfortable card copy. */
.joy-list{scroll-snap-type:none;scroll-behavior:auto}
.joy{scroll-snap-align:none;height:570px}
.joy-number{font-size:13px}
.joy h3 span{font-size:11px;line-height:1.6;letter-spacing:.08em;margin-top:8px;color:#d8c4e6}
.joy>p{font-size:16px;line-height:1.85;color:#e0d1e9}
.joy-aside{font-size:20px;line-height:1.6;padding-top:13px;margin-top:19px;color:#d2b9e3}
.joy-aside i{font-size:18px;line-height:1.5}
.site-header nav{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap}
/* A compact speech balloon with visible, unhurried buoyancy. */
.about-dialogue{width:270px;right:2%;top:22px}
.about-speech{padding:18px 23px 23px;box-shadow:4px 5px 0 -1px #ab78d21f,0 0 35px #be8deb09;animation:about-speech-drift 6s ease-in-out infinite}
.about-speech>.micro{font-size:9px;letter-spacing:.14em}
.about-speech>p{font-size:25px;line-height:1.5;margin-top:8px}
.about-speech .about-speech-detail{font-size:14px;line-height:1.85;margin-top:6px}
.about-speech-star{right:17px;bottom:17px;font-size:18px;opacity:.8}
@keyframes about-speech-drift{0%,100%{transform:translate(0,0) rotate(-5deg)}50%{transform:translate(-8px,-15px) rotate(-2.5deg)}}
@media(min-width:761px) and (max-width:1000px){.about-dialogue{width:245px;right:0;top:6px}.about-speech{padding:16px 20px 21px}.about-speech>p{font-size:23px}.about-speech .about-speech-detail{font-size:13px}}
@media(max-width:760px){
 .site-header nav{left:0;right:0;transform:none}
 .joy{height:550px}.joy h3 span{font-size:11px}.joy>p{font-size:16px;line-height:1.85}.joy-aside{font-size:19px}.joy-number{font-size:12px}
 .about-dialogue{top:160px;right:1%;width:66%;max-width:260px}.about-speech{padding:13px 19px 19px}.about-speech>.micro{font-size:7px}.about-speech>p{font-size:21px;line-height:1.5;margin-top:5px}.about-speech .about-speech-detail{font-size:12px;line-height:1.8;margin-top:5px}.about-speech-star{right:13px;bottom:14px;font-size:15px}
}


/* A living floral editorial collage: foreground character, two memories, flowers over the frames. */
.favorite-person{padding-bottom:85px}
.love-editorial-header{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin:48px 0 20px}
.love-editorial-header .eyebrow{font-size:10px;letter-spacing:.22em;color:#bca0d1;margin-bottom:5px}
.love-editorial-title{font-size:clamp(86px,11.3vw,158px);letter-spacing:-.045em;line-height:1.12;width:max-content;max-width:100%;background:linear-gradient(115deg,#e6d5ff,#bb8ce7);background-clip:text;-webkit-background-clip:text;color:transparent}
.love-editorial-title span{color:inherit}
.love-editorial-intro{text-align:right;font-size:16px;line-height:1.9;color:#ddc8ec;padding-bottom:15px;letter-spacing:.05em}
.love-editorial-intro>span{display:block;font:23px/1.5 var(--hand);color:#bfa0d5;margin-top:12px}
.love-collage{position:relative;isolation:isolate;height:690px;margin-top:40px}
.memory-panel{position:absolute;left:0;width:100%;height:270px;border:1px solid #c8a3df60;background:#30203e;isolation:isolate;outline:none;transition:filter .8s,opacity .8s;overflow:hidden}
.memory-panel::after{content:'';position:absolute;inset:0;pointer-events:none;background:url('../assets/noise.svg');background-size:110px;opacity:.035;mix-blend-mode:soft-light}
.memory-hug{top:30px}.memory-kiss{top:360px}
.memory-media{position:absolute;inset:0 auto 0 0;width:60%;z-index:-1;mask-image:linear-gradient(90deg,#000 72%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 72%,transparent)}
.memory-kiss .memory-media{left:auto;right:0;mask-image:linear-gradient(270deg,#000 72%,transparent);-webkit-mask-image:linear-gradient(270deg,#000 72%,transparent)}
.memory-media img,.memory-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:0 15%;filter:saturate(.8) brightness(.88);transition:opacity .65s,filter .8s}
.memory-kiss .memory-media img,.memory-kiss .memory-media video{object-position:100% 15%}
.memory-media video{opacity:0}.memory-media.has-video video{opacity:1}.memory-media.has-video img{opacity:0}
.memory-panel figcaption{position:absolute;right:6%;top:40px;z-index:1}.memory-panel figcaption .micro{font-size:10px;letter-spacing:.13em;color:#bba0ce}.memory-panel figcaption p{font-size:23px;line-height:1.75;margin-top:18px;color:#e7d8f0}.memory-hand{display:block;font:25px/1.5 var(--hand);color:#bfa0d4;margin-top:20px;transform:rotate(-5deg)}
.memory-kiss figcaption{right:auto;left:6%}.memory-mark{position:absolute;right:30%;bottom:25px;font:48px var(--hand);color:#c8a4dc;opacity:.6;transform:rotate(12deg)}
.love-centerline{position:absolute;left:0;right:0;top:312px;display:flex;justify-content:space-between;padding:0 12px;font-size:9px;letter-spacing:.2em;color:#ad8ac6}
.frame-flower{position:absolute;width:180px;height:auto;z-index:6;pointer-events:none;filter:drop-shadow(0 5px 12px #0a041a66);animation:flower-sway 9s ease-in-out infinite alternate;transform-origin:50% 85%}
.frame-flower-top{right:-36px;top:-22px;rotate:15deg}.frame-flower-bottom{left:-43px;bottom:12px;rotate:-15deg;animation-delay:-4s}
.konata-gift{position:absolute;left:50%;top:-26px;transform:translateX(-50%);width:470px;height:705px;padding:0;background:none;z-index:5;isolation:isolate;outline:none}
.gift-media{position:absolute;inset:0 0 38px;display:block;filter:drop-shadow(1px 0 0 #d7b6ebcc) drop-shadow(-1px 0 0 #d7b6ebcc) drop-shadow(0 -1px 0 #d7b6ebcc) drop-shadow(0 12px 24px #0d061a66);transition:filter .8s;mask-image:linear-gradient(#000 91%,transparent 100%);-webkit-mask-image:linear-gradient(#000 91%,transparent 100%)}
.gift-poster,.gift-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;transition:opacity .45s}
.gift-poster-offer{opacity:0}.konata-gift.is-offering .gift-poster-hidden{opacity:0}.konata-gift.is-offering .gift-poster-offer{opacity:1}
.gift-canvas{opacity:0}.konata-gift.has-video .gift-canvas{opacity:1}.konata-gift.has-video .gift-poster{opacity:0}
.gift-caption{position:absolute;bottom:0;left:50%;transform:translateX(-50%) rotate(-3deg);white-space:nowrap;font:24px/1.5 var(--hand);color:#e1c7f0;text-shadow:0 0 14px #a16acb55;display:flex;gap:20px;align-items:center}
.gift-caption i{font:24px var(--font);font-style:normal}.gift-hint-touch{display:none}
#gift-video{display:none}
.love-collage.is-gifting .memory-panel{filter:blur(3px);opacity:.64}
.love-collage.is-gifting .frame-flower{filter:blur(1.2px) drop-shadow(0 5px 12px #0a041a66)}
.memory-panel:is(:hover,:focus-visible){filter:blur(0);opacity:1}
.memory-panel:is(:hover,:focus-visible) .memory-media img,.memory-panel:is(:hover,:focus-visible) .memory-media video{filter:saturate(.94) brightness(1)}
.love-collage:not(.is-gifting):has(.memory-panel:is(:hover,:focus-visible)) .gift-media{filter:blur(1.5px) drop-shadow(0 12px 24px #0d061a66)}
.konata-gift:focus-visible .gift-caption{outline:1px solid #e0baf0;outline-offset:8px;border-radius:4px}
.love-editorial-footer{display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid var(--line);padding-top:26px;margin-top:28px;color:#d2b7df}
.love-editorial-footer p{font:25px/1.6 var(--hand)}.love-editorial-footer>span{font:19px/1.5 var(--hand);letter-spacing:.04em}
@keyframes flower-sway{to{transform:translateY(-5px) rotate(3deg)}}
@media(max-width:1100px) and (min-width:761px){.konata-gift{width:420px;height:665px;top:0}.memory-panel figcaption{right:4%}.memory-kiss figcaption{left:4%}.memory-panel figcaption p{font-size:20px}.memory-hand{font-size:22px}.love-editorial-intro{font-size:14px}.love-editorial-intro>span{font-size:21px}.frame-flower{width:155px}}
@media(max-width:760px){
 .love-editorial-header{display:block;margin-top:33px}.love-editorial-header .eyebrow{font-size:8px}.love-editorial-title{font-size:clamp(70px,20vw,128px);line-height:1.2}.love-editorial-intro{text-align:left;font-size:14px;line-height:1.9;padding:12px 0 0}.love-editorial-intro>span{font-size:22px;margin-top:8px}
 .love-collage{height:925px;margin-top:30px}.memory-panel{height:220px}.memory-hug{top:80px}.memory-kiss{top:595px}
 .memory-media{width:100%;mask-image:linear-gradient(90deg,#000 70%,#0008);-webkit-mask-image:linear-gradient(90deg,#000 70%,#0008)}
 .memory-kiss .memory-media{mask-image:linear-gradient(270deg,#000 70%,#0008);-webkit-mask-image:linear-gradient(270deg,#000 70%,#0008)}
 .memory-media img,.memory-media video{object-position:0 0;filter:saturate(.8) brightness(.82)}.memory-kiss .memory-media img,.memory-kiss .memory-media video{object-position:100% 0}
 .memory-panel figcaption{top:17px;right:14px;text-align:right}.memory-panel figcaption .micro{font-size:7px;color:#e1caec}.memory-panel figcaption p{font-size:16px;line-height:1.7;margin-top:8px;text-shadow:0 2px 6px #160c2d}.memory-hand{font-size:21px;margin-top:10px}.memory-kiss figcaption{left:13px;right:auto;text-align:left}.memory-mark{display:none}
 .love-centerline{top:320px;font-size:7px;padding-inline:0;letter-spacing:.08em}
 .konata-gift{top:225px;width:100%;max-width:400px;height:550px}.gift-media{bottom:48px}.gift-caption{bottom:-85px;font-size:22px;gap:14px;background:#271339bd;padding:5px 14px;border:1px solid #c6a2dd33;border-radius:3px;backdrop-filter:blur(8px)}
 .frame-flower{width:105px}.frame-flower-top{right:-20px;top:40px;rotate:5deg}.frame-flower-bottom{left:-22px;bottom:93px;rotate:-25deg}
 .love-editorial-footer{margin-top:0;display:block;padding-top:24px}.love-editorial-footer p{font-size:24px}.love-editorial-footer>span{display:block;font-size:17px;margin-top:17px}
 .favorite-person{padding-bottom:60px}
}
@media(hover:none){.gift-hint-desktop{display:none}.gift-hint-touch{display:inline}}
/* Secondary card labels stay comfortably readable, including on a phone. */
.joy h3 span{font-size:12px}

@media(min-width:761px){.frame-flower-top{width:148px;top:-68px;right:-30px}.frame-flower-bottom{width:145px;left:-38px;bottom:-35px}}

@media(max-width:760px){
 .love-collage{height:1050px;margin-top:48px}.memory-hug{top:30px;height:225px}.memory-kiss{top:760px;height:230px}
 .konata-gift{top:225px;height:500px}.gift-caption{bottom:0}.love-centerline{top:275px}
 .frame-flower-top{width:90px;right:-20px;top:-45px}.frame-flower-bottom{width:100px;left:-22px;bottom:8px}
}

/* Intimate marginal notes, with room around the words. */
.memory-hand{text-align:right;margin-top:27px;transform-origin:right center}
.love-editorial-footer{display:block;padding:40px 0 15px}
.love-quote{width:max-content;max-width:100%;margin:0 auto}
.love-editorial-footer .love-quote p{font:clamp(26px,2.65vw,40px)/1.8 var(--hand);letter-spacing:.045em;color:#e3cbed;white-space:nowrap}
.love-quote cite{display:block;text-align:right;font:20px/1.6 var(--hand);font-style:normal;color:#baa0cc;letter-spacing:.04em;margin-top:14px;padding-right:4px}
@media(min-width:761px){
 .memory-hug figcaption{right:9%;width:235px}
 .memory-kiss figcaption{width:270px}
 .about-dialogue{right:6.5%}
 .about-handline{margin-left:35px}
 .about-thought-note{margin-right:52px}
}
@media(min-width:761px) and (max-width:1000px){.memory-hug figcaption{right:5%;width:200px}.memory-kiss figcaption{width:220px}.about-dialogue{right:4%}}
@media(max-width:760px){
 .memory-panel figcaption{width:168px;right:18px}
 .memory-kiss figcaption{left:13px;right:auto;width:170px}
 .memory-hand{font-size:20px;margin-top:20px;white-space:nowrap}
 .love-editorial-footer{padding-top:27px}
 .love-editorial-footer .love-quote p{font-size:27px;line-height:1.9;white-space:normal;text-wrap:balance}
 .love-quote cite{font-size:17px;margin-top:14px}
 .about-dialogue{right:5%}
 .about-handline{margin-left:22px}
 .about-thought-note{margin-right:25px}
}

@media(max-width:760px){.love-quote p>span{display:block;white-space:nowrap}.memory-hand{text-shadow:0 2px 8px #160c2dbb}}