/* Reference-led material pass: real texture assets, editable text, sparse accents. */
:root{--cotton:url('/public/media/cotton-paper-v1.webp');--lace:url('/public/media/crochet-lace-v1.webp');--water:url('/public/media/hero-aqua-reference-clean.webp')}
.bluepink .arch-scene{inset:0;width:100%;height:100%;mask-image:none;opacity:1;z-index:-2;transform:translate(var(--water-x,0px),var(--water-y,0px)) scale(1.008)}
.bluepink .arch-scene>img{object-fit:cover;object-position:center;filter:saturate(.72) brightness(1.055)}
.bluepink .arch-scene::after{background:linear-gradient(100deg,#fff9f920 35%,#fff6fa28 80%)}
.hero.bluepink::before{background:#f4f4f1}
.hero.bluepink::after{height:70px;background:linear-gradient(0deg,#eaf3f3,transparent)}
.cover-header{padding:0 7.5%;height:17vh;max-height:140px;color:#75676d}
.cover-header .brand{font:14px var(--serif);letter-spacing:8px}.cover-header .brand::after{width:180px;background:#ac9ca555}
.cover-header nav{gap:35px}.cover-header nav a{font:13px var(--serif);letter-spacing:1px}
.cover-lace{display:none}.cover-years{display:none}
.bluepink .hero-copy{position:absolute;left:7.7%;top:26%;width:46%;margin:0;padding:0}
.bluepink h1{position:relative;display:inline-block;font-family:'Songti SC','SimSun',serif;font-style:italic;font-weight:400;font-size:clamp(98px,9.5vw,178px);letter-spacing:.04em;line-height:1.05;color:#7f9675}
.bluepink h1::after{content:'';position:absolute;right:-42px;top:38%;width:25px;height:35px;background:#829a79;clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%)}
.bluepink h1>span{font:italic 400 clamp(28px,2.5vw,46px)/1.4 var(--serif);letter-spacing:.24em;color:#829a79;margin:8px 0 0 12px;white-space:nowrap}
.bluepink .hero-copy::before{content:'';position:absolute;left:-36px;top:82px;width:90%;height:130px;border-bottom:1px solid #849c7c;border-left:1px solid #849c7c;border-radius:50%;transform:rotate(-10deg);pointer-events:none;opacity:.8}
.bluepink .hero-copy::after{content:'';position:absolute;left:10%;top:-14%;width:78%;height:75%;border:1px solid #a0aaa32e;border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;transform:rotate(-18deg);pointer-events:none}
.bluepink .hero-disciplines{font-family:'Songti SC','SimSun',serif;font-size:clamp(17px,1.65vw,29px);letter-spacing:2px;margin-top:43px;color:#75656b;white-space:normal}
.bluepink .cover-description{font-family:'Songti SC','SimSun',serif;font-size:clamp(14px,1.3vw,23px);letter-spacing:.7px;max-width:100%;line-height:1.85;color:#786b72;margin-top:28px;padding-left:17px;border-left:3px solid #e7adc5}
.cover-annotations{font:clamp(12px,1.14vw,20px)/1.3 var(--serif);letter-spacing:.2px;color:#9f617c}.cover-annotation span{background:#fad6e7dd;padding:3px 8px;margin-bottom:0}
.annotation-top{left:51%;top:19.2%}.annotation-top span+span{margin-left:-12px}.annotation-bottom{left:52%;right:auto;bottom:16%}
.cover-annotation::after{width:85px;height:43px;border-color:#c580a1;transform:skewX(35deg)}.annotation-bottom::after{left:100%;right:auto;border-left:0;border-right:1px solid #c580a1;top:-22px;transform:skewX(-28deg)}
.cover-dots.top{top:16%;left:4.5%;height:135px;width:115px;background-size:12px 12px;opacity:.22}.cover-dots.bottom{height:130px;width:140px;bottom:3%;right:3%;opacity:.2}
.cover-scroll{left:7.7%;bottom:7%;color:#827881;font-size:13px;letter-spacing:1px}
.world-water::before{background:linear-gradient(110deg,#eef7f466,#f9e7ef66),var(--water) center/cover;filter:blur(5px) saturate(.6) brightness(1.09);opacity:.47}
/* Cotton paper rather than flat UI surfaces. */
.envelope-backing{position:absolute;inset:-12px 9px -14px;background:linear-gradient(#bdd9e477,#b9d6e755),var(--cotton) center/cover;transform:rotate(-4deg);box-shadow:0 8px 14px #6d879820;clip-path:polygon(0 1%,8% 0,15% 2%,24% 0,40% 1%,57% 0,70% 1%,85% 0,100% 2%,99% 98%,89% 99%,77% 98%,65% 100%,46% 98%,34% 100%,20% 99%,0 100%)}
.envelope-back{background:linear-gradient(#aecbd977,#bdd8e477),var(--cotton) center/cover}
.envelope-flap{background:linear-gradient(130deg,#aacbdf88,#dceaf044),var(--cotton) center/cover;box-shadow:0 3px 4px #72849366}
.envelope-front{background:linear-gradient(110deg,#e9eef233,#e7dce533),var(--cotton) center/cover}
.envelope-front::after{background:var(--lace) no-repeat center/contain;width:57%;height:65px;left:auto;right:-10px;bottom:-13px;transform:rotate(-5deg);opacity:.94;filter:drop-shadow(0 2px 1px #7d6e6826)}
.envelope-address button span{font:italic 32px var(--serif);letter-spacing:3px;color:#9d6e87;bottom:43px}
.envelope-address button::before{width:65px;height:62px;left:calc(50% - 32px);top:46%;border-radius:45% 52% 46% 50%;box-shadow:inset 0 3px 4px #ffe7ef,inset 0 -3px 4px #b77d9c,0 3px 4px #81748744;background:radial-gradient(ellipse at 35% 20%,#f6cbdc,#dfa8c2 65%,#bc81a1)}
.envelope-address button::after{top:calc(46% + 9px);width:47px;height:44px;left:calc(50% - 23px)}
.seal-star{position:absolute;top:calc(46% + 19px);left:calc(50% - 12px);width:24px;height:25px;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);background:linear-gradient(130deg,#fff0f2,#b27b99);z-index:1}
.welcome-sheet{background:linear-gradient(#fffaf750,#fffaf740),var(--cotton) center/cover;box-shadow:0 18px 45px #5d7b8426,0 3px 0 #e6dfd9,0 5px 0 #fff8f4}
.welcome-label{display:inline-block;background:#edcbdca3;padding:5px 10px;transform:rotate(-2deg);font-size:13px;letter-spacing:3px}
.binder{background:linear-gradient(#b6cddc88,#d5c3d277),var(--cotton) center/cover;border:1px solid #fff8f1}
.binder::after{background:linear-gradient(#e7becf99,#d5b3c677),var(--cotton) center/cover;inset:18px -3px -14px;transform:rotate(-.6deg)}
.paper-half:first-child{background:linear-gradient(90deg,#fffaf74d 90%,#d8ccc987),var(--cotton) center/cover}
.paper-half:last-child{background:linear-gradient(90deg,#d0c8c4a6,#fffaf733 7%),var(--cotton) right center/cover}
.paper-half::after{content:'';pointer-events:none;position:absolute;bottom:0;left:0;right:0;height:10px;background:#fdf9f3;clip-path:polygon(0 35%,4% 60%,8% 25%,12% 70%,15% 30%,18% 50%,22% 10%,26% 60%,30% 30%,35% 65%,39% 20%,43% 70%,47% 35%,52% 55%,56% 20%,60% 60%,66% 30%,70% 70%,74% 20%,78% 60%,82% 30%,87% 55%,92% 10%,96% 65%,100% 30%,100% 100%,0 100%)}
.contents-page h3{position:relative;z-index:1;font-size:clamp(39px,3.5vw,62px);margin-bottom:31px;margin-top:6px}
.contents-page h3 span{display:inline-block;padding:8px 18px 10px;background:linear-gradient(#efbace99,#efc7dba1),var(--cotton) center/cover;transform:rotate(-3deg);box-shadow:0 4px 6px #7e5c6b16;clip-path:polygon(0 2%,7% 0,18% 3%,28% 0,40% 3%,52% 0,67% 3%,80% 0,92% 3%,100% 0,99% 98%,90% 96%,80% 100%,67% 96%,50% 100%,35% 96%,20% 100%,7% 97%,0 100%)}
.contents-page nav{gap:6px;position:relative;z-index:1}
.contents-page nav button{padding:9px 12px;min-height:59px;border:0;background:linear-gradient(#fffaf75c,#fffaf75c),var(--cotton) center/cover;box-shadow:0 2px 2px #88787c15;position:relative}
.contents-page nav button:nth-child(even){transform:rotate(-.5deg)}
.contents-page nav button::before{content:'';position:absolute;left:-7px;top:8px;width:5px;height:calc(100% - 16px);background:radial-gradient(ellipse,#c6b5b0 45%,#fffcf4 55%,transparent 65%) 0 0/5px 11px}
.contents-page nav button:disabled{background:linear-gradient(#fffaf73d,#fffaf73d),var(--cotton) center/cover}
.contents-foot{z-index:1}.paper-lace{position:absolute;pointer-events:none;bottom:-8px;right:10%;width:50%;height:75px;background:var(--lace) center/contain no-repeat;transform:rotate(-7deg);opacity:.95;filter:drop-shadow(0 2px 1px #6b635b25)}
.contents-page .paper-lace{right:5%;width:42%}
.account{position:relative}.account .work-image{transform:rotate(-1.3deg);border:4px solid #fffdf8;padding:2px;box-shadow:0 4px 10px #65596724}
.account.xiaohongshu .work-image{transform:rotate(1.3deg)}
.account::before{content:'';position:absolute;top:-8px;left:35%;width:30%;height:16px;background:linear-gradient(#e8dac2a3,#eadbc49e),var(--fiber);transform:rotate(-3deg);z-index:2;pointer-events:none;clip-path:polygon(3% 0,100% 0,97% 20%,100% 40%,97% 70%,100% 100%,0 100%,3% 70%,0 45%)}
.account .work-image{overflow:visible}.account figcaption{padding-top:3px}
.book-tabs{position:absolute;right:-20px;top:16%;display:flex;flex-direction:column;gap:16px;z-index:2}.book-tabs button{width:28px;height:62px;padding:0;border:0;border-radius:0 5px 5px 0;background:linear-gradient(#edc8d6bb,#edc8d6bb),var(--cotton) center/cover;color:#856476;box-shadow:3px 3px 5px #67727b20;font:12px var(--serif)}
.book-tabs button+button{background:linear-gradient(#c2dbe9aa,#c2dbe9aa),var(--cotton) center/cover;color:#617b8d}
.book-tabs button[aria-current]{box-shadow:3px 3px 5px #67727b20,inset -2px 0 #fff8}
.binder-rings i{position:relative;height:13px;border-radius:50%;background:linear-gradient(#fffffa,#8c9095 32%,#fafafa 48%,#d4d6d7 66%,#797e87);border:1px solid #9b9b9c;box-shadow:0 3px 3px #5e4d533d}
.binder-rings i::before,.binder-rings i::after{content:'';position:absolute;width:5px;height:15px;border-radius:50%;top:0;background:linear-gradient(90deg,#7e7d7d,#fff6);z-index:-1}.binder-rings i::before{left:0}.binder-rings i::after{right:0}
.analysis-page h4{display:inline-block;background:#c3dbe677;padding:5px 9px;transform:rotate(-1deg);margin-bottom:20px}
.analysis-summary{border-top-color:#c79fb555}.real-metric{color:#ad6f88}
@media(min-width:1001px) and (max-height:800px){.contents-page h3{margin-bottom:18px}.contents-page h3 span{padding:5px 15px 8px}.contents-page nav button{min-height:57px;padding:7px 12px}.paper-lace{height:62px}}
@media(min-width:1700px){.contents-page nav button{min-height:78px}.bluepink .hero-copy::before{top:135px;height:160px}.cover-header{padding-left:7.5%}.bluepink .hero-disciplines{margin-top:45px}}
@media(max-width:1000px) and (min-width:701px){.bluepink h1{font-size:95px}.bluepink .hero-disciplines{font-size:17px}.bluepink .cover-description{font-size:14px}.cover-header .brand::after{width:70px}.cover-annotations{font-size:11px}.cover-annotation::after{width:40px}.contents-page nav button{padding:8px 7px}}
@media(max-width:700px){.hero.bluepink{height:100svh;min-height:800px;padding:0;background:#f8f5f3}.bluepink .arch-scene{inset:0;width:100%;height:100%;mask-image:none;transform:none}.bluepink .arch-scene>img{object-fit:cover;object-position:55% center}.bluepink .arch-scene::after{background:linear-gradient(180deg,#fffaf786 0%,#fffaf790 40%,#fff7fa08 65%)}.bluepink .hero-copy{top:18%;left:9%;width:83%}.bluepink h1{font-size:86px}.bluepink h1>span{font-size:28px;letter-spacing:.21em}.bluepink h1::after{width:16px;height:24px;right:-24px}.bluepink .hero-copy::before{top:53px;left:-10px;height:99px;width:84%}.bluepink .hero-copy::after{display:none}.bluepink .hero-disciplines{font-size:16px;letter-spacing:0;margin-top:35px}.bluepink .cover-description{font-size:14px;line-height:1.9;margin-top:18px;max-width:320px}.cover-header{height:90px;padding:0 8%}.cover-header .brand{font-size:10px;letter-spacing:4px}.cover-header nav a{font-size:11px;letter-spacing:0}.cover-header nav{gap:15px}.annotation-top{top:auto;bottom:27%;left:8%;font-size:10px}.annotation-bottom{left:auto;right:16%;bottom:15%;font-size:10px}.cover-annotation::after{width:25px;height:20px}.cover-scroll{bottom:5%;left:8%;font-size:12px}.cover-dots.top{top:13%;left:4%;height:80px;width:55px}.cover-dots.bottom{display:none}}
@media(max-width:650px){.contents-page{min-height:495px}.contents-page h3{margin-bottom:25px}.contents-page h3 span{padding:7px 15px}.contents-page nav button{min-height:60px;padding:7px 10px}.paper-half:first-child{background:linear-gradient(180deg,#fffaf744 95%,#dbd1cda6),var(--cotton) center/cover}.paper-half:last-child{background:linear-gradient(180deg,#d1c9c499,#fffaf733 3%),var(--cotton) center/cover}.contents-foot{bottom:18px}.paper-lace{width:40%;height:55px;bottom:0}.book-tabs{right:-15px;gap:12px}.book-tabs button{width:20px;height:50px;font-size:11px}.binder-rings i{width:12px;height:33px}.envelope-address button span{font-size:27px;bottom:26px}.envelope-address button::before{top:40%;width:54px;height:52px;left:calc(50% - 27px)}.envelope-address button::after{top:calc(40% + 7px);width:40px;height:38px;left:calc(50% - 20px)}.seal-star{top:calc(40% + 16px);width:21px;height:22px;left:calc(50% - 10px)}.envelope-front::after{height:40px;bottom:-6px}.welcome-sheet{background:linear-gradient(#fffaf755,#fffaf755),var(--cotton) center/cover}.account::before{top:-6px}.account .work-image{transform:rotate(-1deg)}.world-water::before{filter:none;opacity:.3}}
@media(prefers-reduced-motion:reduce){.bluepink .arch-scene{transform:none}}
.paper-lace{bottom:22px;height:55px;width:42%}.contents-page .paper-lace{bottom:22px}
@media(max-width:650px){.paper-lace,.contents-page .paper-lace{bottom:14px;height:44px;width:37%}}