:root{--paper:#f7f6f0;--ink:#273f35;--muted:#73796e;--line:#dddfd3;--green:#254e41;--accent:#dfebba}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #aa7143;outline-offset:5px}.wrap{max-width:1200px;width:calc(100% - 112px);margin-inline:auto}.header{display:flex;align-items:center;justify-content:space-between;height:108px;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:12px;font-family:Georgia,serif;font-size:25px}.brand-mark{background:var(--green);color:var(--paper);width:36px;height:36px;text-align:center;line-height:32px;border-radius:50%;font-size:31px}nav{display:flex;align-items:center;gap:36px;font-size:13px}.nav-contact{border:1px solid #b5beb0;border-radius:30px;padding:12px 20px}nav a:hover,.text-link:hover{color:#839052}.hero{padding-block:80px 78px;display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;margin:0 0 30px}.greeting{font-size:17px;margin:0 0 18px}h1{font-size:clamp(36px,4.2vw,58px);line-height:1.3;letter-spacing:-2px;font-weight:500;margin:0 0 26px}h1 span{display:block}h1 span:last-child{color:#74835a}.intro{color:var(--muted);font-size:14px;line-height:2;max-width:370px}.hero-actions{display:flex;gap:26px;align-items:center;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:16px 23px;background:var(--green);color:white;border:0;border-radius:5px;font-size:13px;transition:background .2s,transform .2s}.button:hover{background:#39634c;transform:translateY(-2px)}.text-link{font-size:13px}.status{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);margin:34px 0 0}.status>span:first-child{width:6px;height:6px;border-radius:50%;background:#839b60}.hero-art{position:relative;background:#eeeede;padding:22px 24px 18px;border-radius:160px 160px 8px 8px;min-width:0}.art-top{display:flex;justify-content:space-between;align-items:center;margin:16px 24px 10px;font-size:8px;letter-spacing:2px}.art-top span:last-child{font-size:24px}.botanical{height:310px;position:relative;overflow:hidden}.sun{position:absolute;right:20px;top:20px;width:98px;height:98px;background:#e2c886;border-radius:50%}.arch{position:absolute;left:25px;bottom:0;width:215px;height:270px;border-radius:130px 130px 0 0;background:#dfdfc9}.stem{position:absolute;left:53%;top:74px;width:3px;height:170px;background:#435844;transform:rotate(-10deg)}.leaf{position:absolute;background:#627751;border-radius:0 90% 0 90%;width:93px;height:44px;left:29%;top:92px;transform:rotate(16deg)}.leaf-two{left:51%;top:64px;transform:rotate(-65deg);background:#354d39}.leaf-three{left:29%;top:151px;transform:rotate(10deg);background:#8f9c73}.leaf-four{left:51%;top:123px;transform:rotate(-57deg)}.vase{position:absolute;bottom:16px;left:39%;height:111px;width:106px;border-radius:8px 8px 46% 46%;background:repeating-linear-gradient(90deg,#b87c5a 0px,#b87c5a 5px,#c68c68 6px,#c68c68 9px);transform:rotate(-3deg)}.art-ground{position:absolute;bottom:0;width:100%;height:16px;background:#d4d7bd}.art-bottom{display:flex;justify-content:space-between;font-size:10px;color:#686e58;margin-top:17px}.art-bottom span:first-child{font-family:Georgia,serif;font-style:italic}.floating-note{position:absolute;right:-22px;bottom:65px;background:#faf9ed;box-shadow:0 7px 22px #30452a12;font:italic 20px Georgia,serif;padding:19px 23px;transform:rotate(-9deg)}.portrait{display:block;width:100%;height:310px;object-fit:cover;border-radius:130px 130px 4px 4px}.ticker{border-block:1px solid var(--line)}.ticker>div{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:19px;font-size:10px;letter-spacing:2px}.ticker span{font-size:22px;color:#89986b}.section{padding-block:82px}.about{display:grid;grid-template-columns:1fr 1.35fr;gap:80px;border-bottom:1px solid var(--line)}h2{font-size:32px;line-height:1.5;font-weight:500;letter-spacing:-1px;margin:0}.scribble{display:block;margin-top:20px;font:italic 18px Georgia,serif;color:#92966e}.about-copy{padding-top:28px}.about-copy p{font-size:14px;color:var(--muted);line-height:2.1;margin:0 0 16px}.tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}.tags span{font-size:11px;border:1px solid #d5d9c8;padding:8px 14px;border-radius:30px}.section-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.section-top>p{font-size:12px;color:var(--muted);margin-bottom:9px}.section-top .eyebrow{margin-bottom:20px}.filters{display:flex;gap:9px;margin:30px 0}.filter{border:1px solid transparent;background:transparent;color:var(--muted);padding:9px 17px;border-radius:30px;font-size:12px}.filter.active{background:var(--green);color:white}.filter:hover{border-color:var(--green)}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.project{min-width:0}.project-open{display:block;text-align:left;border:0;background:transparent;padding:0;width:100%;color:inherit}.cover{height:235px;position:relative;overflow:hidden;border-radius:7px;transition:transform .25s;background:#e5e7d6}.project-open:hover .cover{transform:translateY(-5px)}.cover img{width:100%;height:100%;object-fit:cover}.shapes:before{content:'';position:absolute;width:130px;height:170px;left:19%;top:30px;background:#b3bc95;border-radius:90px 90px 0 0;transform:rotate(-14deg)}.shapes:after{content:'';position:absolute;width:115px;height:115px;right:14%;bottom:26px;background:#dfb88b;border-radius:50%;box-shadow:-15px 15px 0 #f5f1dd}.letter{background:#e9dfd4;display:grid;place-items:center}.letter:before{content:'Dear, everyday.\A\A 在平凡的日子里\A 收藏一些小小的光。\A\A With love, C.';white-space:pre-line;background:#faf7ee;width:62%;padding:26px 20px;font:italic 13px/1.7 Georgia,serif;color:#777866;transform:rotate(-8deg);box-shadow:6px 8px 0 #c7bba12e}.landscape{background:#dce4df}.landscape:before{content:'';position:absolute;background:#f6edce;border-radius:50%;width:58px;height:58px;right:45px;top:35px}.landscape:after{content:'';position:absolute;width:125%;height:180px;border-radius:50% 80% 0 0;left:-30px;top:115px;background:#83957b;transform:rotate(-12deg);box-shadow:60px 40px 0 20px #496551}.project-meta{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin:19px 0 11px}.project h3{font-size:19px;font-weight:500;margin:0;display:flex;justify-content:space-between}.project h3 span{font-size:21px}.project p{font-size:12px;line-height:1.9;color:var(--muted);margin-top:12px}.contact{background:#e9eddc;border-radius:9px;padding:45px 48px 25px;margin-bottom:65px}.contact .eyebrow{margin-bottom:22px}.contact-row{display:flex;justify-content:space-between;align-items:center}.contact h2{font-size:30px;max-width:520px}.contact-row p{font-size:13px;color:var(--muted);line-height:1.8}.contact-star{font-size:104px;line-height:1;color:#798c59}.contact-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:20px}.contact-placeholder{font-size:12px;color:var(--muted)}.copy-button{border:0;border-bottom:1px solid #aab49a;padding:7px 0;background:transparent;color:var(--green);font-size:12px}.socials{display:flex;flex-wrap:wrap;gap:22px;margin-top:22px;font-size:12px}.socials a:hover{text-decoration:underline}#feedback{font-size:12px;min-height:18px;margin-bottom:0}.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-block:28px}.footer .brand{font-size:20px}.footer p,.footer>span{font-size:10px;color:var(--muted)}.skip{position:absolute;left:20px;top:-100px;padding:12px;background:var(--green);color:white;z-index:10}.skip:focus{top:10px}dialog{border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);padding:46px;max-width:580px;width:calc(100% - 32px)}dialog::backdrop{background:#16291dc0}dialog h2{font-size:28px}#dialog-detail{white-space:pre-line;line-height:2;color:var(--muted);font-size:14px;margin-block:22px}.close-dialog{position:absolute;top:12px;right:17px;background:transparent;border:0;font-size:28px;color:var(--green)}[hidden]{display:none!important}@media(min-width:1450px){.hero{padding-block:100px}.botanical,.portrait{height:370px}.stem{top:120px}.leaf{margin-top:45px}}@media(max-width:900px){.wrap{width:calc(100% - 64px)}.hero{gap:35px}.hero-actions{gap:15px}.project-grid{gap:18px}.cover{height:190px}.about{gap:40px}.footer p{display:none}.floating-note{right:-10px;font-size:16px}}@media(max-width:650px){.wrap{width:calc(100% - 40px)}.header{height:82px}.brand{font-size:22px}nav{gap:15px;font-size:12px}.nav-contact{padding:9px 12px}.hero{grid-template-columns:1fr;padding-block:45px;gap:40px}h1{font-size:43px}.hero-art{max-width:390px;width:100%;margin-inline:auto}.hero .eyebrow{font-size:8px;letter-spacing:1.7px}.ticker>div{font-size:8px;letter-spacing:.5px;gap:8px}.ticker span{font-size:16px}.ticker span:last-child{display:none}.section{padding-block:52px}.about{grid-template-columns:1fr;gap:16px}.about-copy{padding-top:0}h2{font-size:28px}.section-top{display:block}.section-top>p{margin-top:15px}.project-grid{grid-template-columns:1fr;gap:28px}.cover{height:260px}.letter:before{width:55%}.contact{padding:30px 25px 20px;margin-bottom:40px}.contact h2{font-size:26px}.contact-star{font-size:50px;margin-left:8px}.footer{gap:10px}.footer>span{font-size:9px}.eyebrow{margin-bottom:20px}dialog{padding:40px 25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
:root{color-scheme:light}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;padding:9px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink)}
.theme-toggle:hover{background:var(--line)}
.theme-toggle svg{width:20px;height:20px}
.sun-icon{display:none}
:root[data-theme="dark"]{color-scheme:dark;--paper:#18231e;--ink:#e4eadf;--muted:#b1bcad;--line:#3b4b40;--green:#b4cca0;--accent:#354b36}
[data-theme="dark"] .moon-icon{display:none}
[data-theme="dark"] .sun-icon{display:block}
[data-theme="dark"] .button,[data-theme="dark"] .filter.active{color:#18231e}
[data-theme="dark"] .button:hover{background:#c8dfb6}
[data-theme="dark"] .brand-mark,[data-theme="dark"] .skip{color:#18231e}
[data-theme="dark"] h1 span:last-child{color:#b6c993}
[data-theme="dark"] .hero-art{background:#303c30}
[data-theme="dark"] .art-bottom{color:#c2c9b2}
[data-theme="dark"] .floating-note{background:#3e4c39;color:#e4eadf}
[data-theme="dark"] .arch{background:#45513b}
[data-theme="dark"] .sun{background:#b79e64}
[data-theme="dark"] .art-ground{background:#536045}
[data-theme="dark"] .contact{background:#2a382b}
[data-theme="dark"] .scribble,[data-theme="dark"] .contact-star,[data-theme="dark"] .ticker span{color:#b3c58f}
[data-theme="dark"] .tags span,[data-theme="dark"] .nav-contact{border-color:#64745a}
[data-theme="dark"] .cover{filter:brightness(.78)}
@media(max-width:650px){.header{flex-wrap:wrap;gap:12px;height:auto;min-height:82px;padding-block:18px}nav{gap:12px}.theme-toggle{width:36px;height:36px}}
.language-toggle{flex-shrink:0;min-width:40px;min-height:40px;border:1px solid var(--line);border-radius:20px;background:transparent;color:var(--ink);font-size:12px;padding:8px}
.language-toggle:hover{background:var(--line)}
.about-copy .education{font-size:12px;color:var(--ink);border-left:2px solid var(--green);padding-left:14px;margin-bottom:24px;line-height:1.9}
.ticker>div{display:block;text-align:center;line-height:1.8}
html[lang="en"] .letter:before{content:'Dear, everyday.\A\A In ordinary moments,\A a little light remains.\A\A With love, C.'}
html[lang="zh-CN"] .letter:before{content:'致每一个日常：\A\A 在平凡的日子里\A 收藏一些小小的光。\A\A 满怀热爱，Claudia'}
@media(max-width:650px){.header{justify-content:center}.header nav{flex-wrap:wrap;justify-content:center;gap:10px}.language-toggle{min-width:36px;min-height:36px}html[lang="en"] .hero-actions{flex-wrap:wrap}html[lang="en"] h1{font-size:40px}}
.filters{flex-wrap:wrap}
