
:root{--paper:#f5f3eb;--ink:#232a28;--muted:#727871;--blue:#2854ed;--orange:#ef8054;--line:#dcded4;--serif:Georgia,"Noto Serif SC","Songti SC","SimSun",serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:6px}.skip{position:fixed;top:-70px;left:15px;background:var(--blue);color:white;padding:15px;z-index:30}.skip:focus{top:15px}header{max-width:1320px;margin:auto;padding:27px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:18px}.brand-mark{display:grid;place-items:center;width:42px;height:42px;background:var(--blue);color:white;border-radius:12px;font-family:var(--serif);font-size:25px;transform:rotate(-5deg)}.brand-sub{display:block;font-size:9px;letter-spacing:2px;margin-top:5px;font-weight:500}nav{display:flex;align-items:center;gap:32px;font-size:13px}nav a:hover,.text-link:hover{color:var(--blue)}.nav-contact{border:1px solid var(--ink);border-radius:50px;padding:10px 18px}.menu{display:none}.hero{max-width:1320px;padding:78px 5% 75px;margin:auto;display:grid;grid-template-columns:1.2fr 1fr;gap:45px;align-items:center}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:600;display:flex;align-items:center;gap:8px;margin:0 0 26px}.status-dot{width:7px;height:7px;background:var(--blue);border-radius:50%}h1{font-family:var(--serif);font-size:clamp(42px,4.6vw,67px);line-height:1.45;letter-spacing:-2px;font-weight:600;margin:0 0 27px}.accent{color:var(--blue);position:relative;white-space:nowrap}.underline{position:absolute;bottom:-7px;left:0;width:100%;height:10px;border-top:2px solid var(--blue);border-radius:50%;transform:rotate(-4deg)}.hero-lede{font-size:15px;line-height:1.95;color:#59615b;margin:0 0 29px}.hero-actions{display:flex;align-items:center;gap:28px}.button{display:inline-flex;gap:32px;padding:15px 21px;align-items:center;font-size:13px;border-radius:5px}.primary{background:var(--blue);color:white;transition:transform .2s,background .2s}.primary:hover{background:#183ac4;transform:translateY(-2px)}.text-link{font-size:13px;display:inline-flex;align-items:center;gap:15px;border-bottom:1px solid currentColor;padding-bottom:5px}.hero-note{font-size:10px;color:var(--muted);margin:26px 0 0}.hero-art{height:440px;position:relative;border:1px solid #daddd3;border-radius:160px 160px 10px 10px;overflow:hidden;background:#eeefe6}.art-grid{position:absolute;inset:0;background-image:linear-gradient(#d7dacd77 1px,transparent 1px),linear-gradient(90deg,#d7dacd77 1px,transparent 1px);background-size:30px 30px;mask-image:linear-gradient(transparent,#000,transparent)}.planet{position:absolute;top:113px;left:50%;transform:translateX(-50%) rotate(-10deg);width:200px;height:200px;background:var(--blue);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;color:white;box-shadow:inset -20px -15px 0 #1a43c2,0 20px 35px #2854ed20;z-index:2}.planet span{font-family:var(--serif);font-size:35px;letter-spacing:6px}.planet small{font-size:8px;letter-spacing:2px;margin-top:13px}.orbit{position:absolute;top:139px;left:calc(50% - 175px);width:350px;height:140px;border:1px solid #849385;border-radius:50%;transform:rotate(-30deg);z-index:3;pointer-events:none}.orbit-two{transform:rotate(55deg);border-color:#a6aea0;z-index:1}.block{position:absolute;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:10px;transform:rotate(-13deg);border-radius:7px;z-index:4;box-shadow:7px 9px 0 #bd5b36}.block i{width:18px;height:18px;border-radius:50%;background:#ffb38f;box-shadow:2px 3px 0 #d7744b}.block-one{left:30px;top:248px;background:var(--orange)}.block-two{right:43px;top:77px;background:#e3b638;box-shadow:7px 9px 0 #a88722;transform:rotate(18deg)}.block-two i{background:#ffdc7c;box-shadow:2px 3px 0 #c49a2f}.art-star{position:absolute;z-index:5}.star-one{font-size:57px;color:var(--orange);right:51px;bottom:87px}.star-two{font-size:26px;left:73px;top:77px;color:var(--blue)}.art-label{position:absolute;font-size:11px;z-index:4}.label-one{top:67px;left:40%;transform:rotate(-7deg);background:var(--paper);padding:8px 11px;border:1px solid var(--line)}.label-two{bottom:83px;left:30px;letter-spacing:1.6px;font-size:8px}.art-caption{position:absolute;bottom:0;left:0;right:0;border-top:1px solid #d1d5c8;padding:18px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.3px}.ticker{display:flex;align-items:center;justify-content:space-around;gap:25px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:21px 5%;font-family:var(--serif);font-size:17px;overflow:hidden;white-space:nowrap}.ticker b{font-size:19px;color:var(--blue);font-weight:400}.section{max-width:1320px;margin:auto;padding:95px 5%}h2{font-family:var(--serif);font-weight:500;font-size:38px;line-height:1.55;letter-spacing:-.8px;margin:0}.about{display:grid;grid-template-columns:1fr 1fr;gap:100px}.about-copy p{font-size:14px;line-height:2.1;color:#61695f;margin:0 0 20px}.about-copy .about-last{color:var(--ink)}.signature{font-family:var(--serif);font-size:28px;display:block;text-align:right;transform:rotate(-5deg);margin-top:30px}.signature span{color:var(--orange);font-size:36px;margin-left:10px}.works{border-top:1px solid var(--line)}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:42px}.section-heading .eyebrow{margin-bottom:15px}.project-list{border-top:1px solid var(--line)}.project{display:grid;grid-template-columns:210px 1fr 50px;gap:40px;align-items:center;padding:28px 0;border-bottom:1px solid var(--line)}.project-art{height:150px;border-radius:5px;overflow:hidden;position:relative;transition:transform .2s}.project:hover .project-art{transform:rotate(-2deg)}.art-thread{background:#e5eafe;display:flex;align-items:center;justify-content:center}.art-thread span{position:absolute;width:140px;height:52px;border:1px solid #7e95f4;border-radius:50%;transform:rotate(55deg)}.art-thread span:nth-child(2){transform:rotate(-55deg)}.art-thread span:nth-child(3){transform:rotate(0)}.art-thread b{font-size:24px;color:var(--blue);background:#e5eafe;padding:8px;z-index:1;font-family:var(--serif)}.art-prd{background:#eee7d9;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px}.art-prd span{border:1px solid #b8a889;background:#f7f0e4;font-size:10px;padding:6px 23px;border-radius:3px}.art-prd i{font-style:normal;color:#ae9770;font-size:11px}.art-icon{background:#e7ebe0;display:grid;grid-template-columns:repeat(2,45px);gap:7px;place-content:center}.art-icon span{background:#f7f9f1;border:1px solid #cbd3bf;border-radius:9px;display:grid;place-items:center;font-size:25px;height:45px;color:#566b45}.project-tag{font-size:9px;letter-spacing:1px;color:var(--muted)}h3{font-size:25px;font-weight:500;margin:12px 0 13px;letter-spacing:-.5px}.project h3 small{font-size:17px;margin-left:8px;color:var(--muted)}.project p{font-size:13px;line-height:1.9;color:#687164;margin:0 0 18px;max-width:610px}.project-footer{font-size:10px;color:#818779}.project-arrow{font-size:26px;justify-self:end;width:43px;height:43px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;transition:background .2s}.project:hover .project-arrow{background:var(--blue);color:white;border-color:var(--blue)}.interests{background:#eeefe6;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.section-aside{font-size:12px;line-height:1.9;color:var(--muted);margin:0}.interest-layout{display:grid;grid-template-columns:1.35fr 1fr;gap:45px}.interest-shelf{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.interest-shelf button{background:var(--paper);border:1px solid #d4d9cc;border-radius:5px;padding:20px 12px;display:flex;flex-direction:column;align-items:flex-start;color:var(--ink);font-size:13px;transition:background .2s,transform .2s}.interest-shelf button:hover{transform:translateY(-3px)}.interest-shelf button>span{font-size:24px;color:var(--blue);margin-bottom:13px;height:32px}.interest-shelf small{font-size:9px;color:var(--muted);margin-top:8px}.interest-shelf button[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:white}.interest-shelf button[aria-pressed=true]>span,.interest-shelf button[aria-pressed=true] small{color:#e1e9ff}.conversation{border:1px solid #cdd4c4;padding:28px;border-radius:5px;background:#f7f8f0;display:flex;flex-direction:column;justify-content:center}.conversation-label{font-size:9px;color:var(--muted);letter-spacing:2px}.conversation-symbol{font-size:45px;color:var(--orange);margin:20px 0 0}.conversation h3{font-family:var(--serif);font-size:24px;line-height:1.5}.conversation p{font-size:12px;line-height:1.95;color:#687164;margin:0 0 19px}.conversation .conversation-question{color:var(--ink);border-left:2px solid var(--orange);padding-left:12px}.conversation .text-link{align-self:start;margin-top:6px;font-size:11px}.contact{padding-top:100px;padding-bottom:85px}.contact-heading{display:flex;justify-content:space-between;align-items:center}.contact h2{font-size:50px;line-height:1.5}.contact h2 span{color:var(--blue)}.contact-spark{font-size:130px;color:var(--orange);padding-right:40px;transform:rotate(12deg)}.contact-lede{font-size:14px;line-height:2;color:#61695f;margin:25px 0}.invitation-tags{display:flex;gap:12px;margin-bottom:36px}.invitation-tags span{font-size:10px;border:1px solid var(--line);border-radius:25px;padding:9px 15px}.email-row{display:flex;align-items:center;justify-content:space-between;padding:23px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);gap:15px}.email-row a{font-size:clamp(16px,2.7vw,34px);letter-spacing:-1px;overflow-wrap:anywhere}.email-row a span{color:var(--blue);margin-left:20px}.email-row button{background:transparent;border:1px solid var(--line);border-radius:4px;padding:11px 16px;font-size:11px;white-space:nowrap}.email-row button:hover{background:#e5eafe}.copy-status{font-size:11px;color:var(--muted);margin:16px 0 25px;min-height:20px}.contact-github{font-size:11px;border-bottom:1px solid var(--line);padding-bottom:4px}footer{max-width:1320px;margin:auto;padding:25px 5%;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:9px;color:var(--muted)}footer p{font-family:var(--serif);font-size:12px}.footer-brand{font-size:13px;color:var(--ink)}.footer-brand .brand-mark{width:29px;height:29px;border-radius:8px;font-size:18px}
@media(min-width:1500px){.hero{padding-top:100px;padding-bottom:100px}}@media(max-width:950px){.hero{gap:20px;padding-top:60px}.hero-art{height:390px}.planet{width:160px;height:160px;top:112px}.planet span{font-size:29px}.orbit{width:280px;left:calc(50% - 140px);top:133px;height:110px}.block-two{right:25px}.hero-actions{gap:18px}.hero-note{max-width:260px;line-height:1.8}.about{gap:40px}.section{padding-top:70px;padding-bottom:70px}.interest-layout{gap:20px}.project{grid-template-columns:170px 1fr 40px;gap:25px}.project-art{height:140px}.conversation{padding:22px}.interest-shelf button{padding:16px 9px}h2{font-size:32px}nav{gap:20px}.contact-spark{font-size:100px}}
@media(max-width:680px){header{padding:20px 6%;position:relative}.brand{font-size:16px}.brand-mark{width:36px;height:36px}.menu{display:flex;align-items:center;gap:15px;background:transparent;border:1px solid var(--line);padding:8px 13px;border-radius:4px;font-size:12px}.menu span{font-size:18px}nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--paper);padding:25px 6%;z-index:10;border-bottom:1px solid var(--line);box-shadow:0 15px 20px #232a2810;align-items:start}nav.open{display:flex;flex-direction:column;gap:24px}.hero{grid-template-columns:1fr;padding:47px 6% 35px;gap:40px}h1{font-size:44px;letter-spacing:-1px}.hero .eyebrow{font-size:10px;margin-bottom:22px}.hero-lede{font-size:13px}.hero-note{max-width:none;font-size:10px}.hero-art{height:350px;max-width:430px;width:100%;justify-self:center;border-radius:120px 120px 7px 7px}.planet{top:90px}.orbit{top:117px}.block-one{top:210px}.block-two{top:58px;right:38px}.star-one{bottom:70px}.label-one{top:44px}.label-two{bottom:65px}.ticker{justify-content:start;gap:23px;font-size:14px;padding:18px 6%}.section{padding:60px 6%}.about{grid-template-columns:1fr;gap:25px}h2{font-size:31px}.about .eyebrow{margin-bottom:15px}.about-copy p{font-size:13px}.signature{font-size:24px}.section-heading{align-items:start;flex-direction:column;gap:18px;margin-bottom:29px}.project{grid-template-columns:88px 1fr 25px;gap:15px;align-items:start;padding:24px 0}.project-art{height:90px}.project h3{font-size:18px;overflow-wrap:anywhere;margin:8px 0 10px}.project h3 small{font-size:12px;margin-left:3px}.project p{font-size:11px;margin-bottom:10px}.project-footer{font-size:9px;line-height:1.8}.project-arrow{width:25px;height:25px;font-size:18px}.project-tag{font-size:8px}.art-thread span{width:76px;height:34px}.art-thread b{font-size:17px;padding:4px}.art-prd span{padding:3px 13px;font-size:8px}.art-prd i{font-size:8px}.art-icon{grid-template-columns:repeat(2,29px);gap:5px}.art-icon span{height:29px;font-size:18px}.interest-layout{grid-template-columns:1fr;gap:20px}.interest-shelf{gap:8px}.interest-shelf button{padding:16px 10px;font-size:11px}.interest-shelf small{font-size:8px}.interest-shelf button>span{font-size:23px;margin-bottom:8px}.conversation{padding:25px}.conversation-symbol{margin-top:15px;font-size:36px}.conversation h3{font-size:23px}.conversation p{font-size:12px}.contact h2{font-size:36px}.contact-spark{font-size:57px;padding-right:0}.contact .eyebrow{font-size:9px;letter-spacing:1px}.contact-lede{font-size:12px}.invitation-tags{gap:6px;flex-wrap:wrap;margin-bottom:25px}.invitation-tags span{font-size:9px;padding:8px 11px}.email-row{flex-wrap:wrap;gap:18px}.email-row a{font-size:21px;letter-spacing:-.5px}.email-row a span{margin-left:5px}.copy-status{font-size:10px}footer{flex-wrap:wrap;padding:24px 6%;gap:18px}footer p{margin:0;font-size:10px}footer>span{font-size:9px;width:65%}footer>a:last-child{margin-left:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

.header-controls{display:flex;align-items:center;gap:10px;margin-left:auto;margin-right:28px}#language-toggle{border:1px solid var(--line);background:transparent;border-radius:30px;padding:8px 12px;font-size:11px;min-width:46px}#language-toggle:hover{background:#e5eafe}html[lang=en] h1{font-family:Georgia,serif;font-size:clamp(36px,4.3vw,61px);line-height:1.3;letter-spacing:-1.5px}html[lang=en] .planet span{font-size:21px;letter-spacing:2px}html[lang=en] h2{font-size:34px;line-height:1.35}html[lang=en] .project:first-child h3 small{display:none}html[lang=en] .contact h2{font-size:47px}html[lang=en] .brand{font-size:15px}html[lang=en] .hero-note{line-height:1.8}html[lang=en] .interest-shelf button{font-size:12px}html[lang=en] .ticker{font-family:Georgia,serif}@media(max-width:950px){.header-controls{margin-right:18px}nav{gap:15px}html[lang=en] h2{font-size:29px}html[lang=en] .contact h2{font-size:40px}}@media(max-width:680px){.header-controls{margin-right:0;gap:8px}html[lang=en] h1{font-size:38px;letter-spacing:-1px}html[lang=en] h2{font-size:28px}html[lang=en] .contact h2{font-size:33px}html[lang=en] .interest-shelf button{font-size:10px}html[lang=en] .interest-shelf small{font-size:8px}html[lang=en] .brand-sub{font-size:8px;letter-spacing:1px}html[lang=en] .label-one{left:30%;font-size:9px}html[lang=en] .contact-spark{font-size:45px}}

@media(max-width:680px){html[lang=en] .hero-actions{gap:16px}html[lang=en] .hero-actions .button{gap:20px;white-space:nowrap;flex-shrink:0;padding:14px 16px}html[lang=en] .hero-actions .text-link{font-size:11px;gap:8px}html[lang=en] .hero-art .planet span{font-size:18px}}
footer .icp-link{flex:0 0 100%;order:1;margin:6px 0 0;text-align:center;font-size:11px;line-height:1.6;color:var(--muted);text-decoration:underline;text-underline-offset:3px}footer .icp-link:hover,footer .icp-link:focus,footer .icp-link:focus-visible{color:var(--blue)}

footer{flex-wrap:wrap}footer>a.icp-link:last-child{margin-left:0}
.hero-film{margin:0;border:1px solid #daddd3;border-radius:36px;overflow:hidden;background:#eeefe6}
.hero-film video{display:block;width:100%;height:auto;background:#e7e2d4}
.hero-film figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;padding:12px 14px;font-size:12px;line-height:1.5;color:var(--muted)}
#hero-sound{border:1px solid var(--ink);background:transparent;border-radius:999px;padding:7px 12px;font-size:12px;color:var(--ink);white-space:nowrap}
#hero-sound[aria-pressed="true"]{background:var(--blue);color:#fff;border-color:var(--blue)}
#hero-sound{background:#f5f3eb;border:1px solid var(--ink);box-shadow:0 8px 18px rgba(35,42,40,.12)}
.works-note{margin:12px 0 0;max-width:460px;font-size:13px;line-height:1.8;color:var(--muted)}
.art-view,.art-auth,.art-grok{display:grid;place-items:center;font-size:42px}
.art-view{background:#e5eafe;color:var(--blue)}
.art-auth{background:#eee7d9;color:var(--ink);font-family:var(--serif)}
.art-grok{background:#fde7df;color:var(--orange)}
.project.has-npm{grid-template-columns:210px 1fr auto}
.project-links{display:flex;flex-direction:column;gap:8px;justify-self:end}
.project-links a{font-size:11px;border:1px solid var(--line);border-radius:999px;padding:7px 10px;white-space:nowrap;text-align:center}
.project-links a:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
@media(max-width:950px){.project.has-npm{grid-template-columns:170px 1fr auto}}
@media(max-width:680px){.hero-film{border-radius:24px}.hero-film figcaption{align-items:flex-start;flex-direction:column}.project.has-npm{grid-template-columns:88px 1fr}.project-links{grid-column:2;flex-direction:row;justify-self:start;margin-top:8px}}
html[lang=en] .project:first-child h3 small{display:inline}
html[lang=en] a.project[href$="/CoThread"] h3 small{display:none}
header{position:relative;z-index:6;max-width:none;width:100%;box-sizing:border-box;padding-left:max(24px,calc((100% - 1200px) / 2));padding-right:max(24px,calc((100% - 1200px) / 2));background:linear-gradient(to bottom,rgba(245,243,235,.9),rgba(245,243,235,.45) 70%,rgba(245,243,235,0));border-bottom:0}
.hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;max-width:none;width:auto;height:auto;min-height:100svh;margin:calc(var(--header-h, 96px) * -1) 0 0;padding:calc(var(--header-h, 96px) + 28px) 0 108px;overflow:hidden;box-sizing:border-box}
.hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to bottom,rgba(245,243,235,.72),transparent 16%),linear-gradient(100deg,rgba(245,243,235,.94) 0%,rgba(245,243,235,.78) 32%,rgba(245,243,235,.34) 58%,rgba(245,243,235,.08) 100%)}
.hero-copy{position:relative;z-index:2;max-width:680px;padding:0 7vw 8px;will-change:transform,opacity}
.hero-film{position:absolute;inset:0;z-index:0;height:auto;margin:0;border:0;border-radius:0;background:#e7e2d4}
.hero-film video{width:100%;height:100%;object-fit:cover;object-position:76% 42%;transform-origin:center center;will-change:transform}
.hero-film figcaption{position:absolute;z-index:3;left:7vw;right:7vw;bottom:28px;padding:0;color:var(--ink)}
.hero-film figcaption span,.hero-sink{background:rgba(245,243,235,.94);border:1px solid rgba(35,42,40,.12);border-radius:999px;padding:8px 12px}
.hero-sink{position:absolute;z-index:3;left:50%;bottom:28px;transform:translateX(-50%);margin:0;font-size:11px;letter-spacing:.24em;color:var(--ink);white-space:nowrap}
.ticker,.about,.works,.contact,footer{position:relative;z-index:2}
.ticker{background:var(--paper);box-shadow:0 -28px 40px rgba(245,243,235,.8)}
@media(max-width:680px){
.hero{align-items:flex-end;min-height:100svh;padding:calc(var(--header-h, 76px) + 8px) 0 96px}
.hero-copy{padding:0 6vw}
.hero::before{background:linear-gradient(to top,rgba(245,243,235,.94) 0%,rgba(245,243,235,.72) 42%,rgba(245,243,235,.2) 100%)}
.hero-film figcaption{left:6vw;right:auto;bottom:22px;flex-direction:row}
.hero-film figcaption span{display:none}
.hero-film video{object-position:62% 28%}
.hero-sink{left:auto;right:6vw;bottom:22px;transform:none;letter-spacing:.12em}
}
