@import url("https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,400;6..96,500;6..96,600&family=Noto+Serif+SC:wght@400;500;600;700&display=swap");*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#090a0c;color:#e9e4dc;font-family:"Noto Serif SC",serif}a,button{color:inherit;font:inherit}.opening{height:100svh;overflow:hidden;position:relative;background:#050607}.openingShade{position:absolute;inset:0;background:linear-gradient(90deg,#050506d9,#05050678 42%,transparent 78%),linear-gradient(0deg,#050506d9,transparent 60%)}.openingCopy{position:absolute;left:8vw;top:31%;z-index:2}.archiveIntro>p,.contact>p,.letter>p,.museumHero p,.openingCopy p,.sectionLabel p{font:10px monospace;letter-spacing:.21em;color:#aaa}.opening h1{margin:26px 0 10px;font:600 clamp(60px,9.2vw,154px)/.8 Bodoni Moda,serif;letter-spacing:-.08em}.openingCopy>span{letter-spacing:.6em;font-size:13px}.opening button{display:block;margin-top:48px;padding:14px 21px;border:1px solid #f2ebe0;background:#ebe4d9;color:#0b0c0d;cursor:pointer;transition:.3s}.opening button:hover{background:#b97870;color:#fff}.opening button b{margin-left:15px;color:#a42628;font-size:18px}.museum{background:#0b0c0e}.museumNav{position:sticky;top:0;z-index:10;height:76px;padding:0 5vw;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:#0b0c0eed;border-bottom:1px solid #ffffff17;backdrop-filter:blur(12px);font-size:10px;letter-spacing:.14em}.wordmark{font:600 18px Bodoni Moda,serif;text-decoration:none;letter-spacing:-.05em}.museumNav nav{display:flex;gap:25px}.museumNav nav a{text-decoration:none;opacity:.8;transition:.2s}.museumNav nav a:hover{color:#c77970;opacity:1}.museumNav>span{justify-self:end;color:#aa8b83}.museumHero{min-height:74vh;padding:19vh 11vw 8vh;position:relative;background:radial-gradient(circle at 78% 45%,#29333a 0,transparent 28%),linear-gradient(115deg,#101216,#070809 70%);overflow:hidden}.museumHero:after{content:"DOLL";position:absolute;right:-.06em;bottom:-.28em;color:#ffffff05;font:600 clamp(180px,35vw,560px)/1 Bodoni Moda,serif;letter-spacing:-.13em}.museumHero h1{position:relative;z-index:1;margin:40px 0;font:500 clamp(48px,7.1vw,112px)/1.22 "Noto Serif SC",serif;letter-spacing:-.1em}.archive em,.contact em,.letter em,.museumHero em{color:#c48178;font-style:normal}.museumHero>span{font:10px monospace;letter-spacing:.2em;color:#918f8d}.letter{min-height:82vh;padding:155px 12vw;display:grid;grid-template-columns:25% 1fr;gap:6vw;background:#0d0e10}.letter h1{margin:0;font:500 clamp(38px,5.3vw,84px)/1.3 "Noto Serif SC",serif;letter-spacing:-.09em}.letter article{max-width:420px;margin:65px 0 0 43%;color:#bdb6ae;font-size:14px;line-height:2.15}.letter blockquote{color:#d9b9ad}.focus{padding:100px 5vw 120px;background:#131417}.sectionLabel{display:flex;justify-content:space-between;border-bottom:1px solid #ffffff1d;margin-bottom:34px}.sectionLabel span{font:10px monospace;color:#9a938c;letter-spacing:.12em}.focusWork{min-height:74vh;display:grid;grid-template-columns:minmax(0,1fr) 34%;position:relative}.focusWork>img{width:100%;height:74vh;-o-object-fit:cover;object-fit:cover;filter:brightness(.76) saturate(.64)}.focusText{padding:8vw 3.5vw;background:#101113;display:flex;flex-direction:column}.focusText p{font:10px monospace;letter-spacing:.15em;color:#aaa}.focusText h2{margin:20px 0;font:500 clamp(45px,5vw,82px)/.9 Bodoni Moda,serif;letter-spacing:-.07em}.focusText>span{color:#bfb8b0;font-size:14px;line-height:2}.focusControls{margin-top:auto;display:flex;gap:8px}.focusControls button{width:44px;height:44px;border:1px solid #ffffff35;background:transparent;cursor:pointer}.focusControls button:hover{border-color:#c48178;color:#c48178}.archive{padding:150px 8vw;background:#0a0b0d;display:grid;grid-template-columns:27% 1fr;gap:7vw}.archiveIntro{position:sticky;top:130px;align-self:start}.archiveIntro h2{margin:25px 0;font:500 clamp(42px,4.8vw,76px)/1.2 "Noto Serif SC",serif;letter-spacing:-.1em}.archiveIntro>span{display:block;max-width:240px;color:#99928a;font-size:13px;line-height:2}.workGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:55px 24px}.workGrid button{padding:0;text-align:left;border:0;background:transparent;cursor:pointer;position:relative}.workGrid img{display:block;width:100%;aspect-ratio:4/5;-o-object-fit:cover;object-fit:cover;filter:brightness(.75) saturate(.6);transition:filter .5s,transform .6s}.workGrid button.active img,.workGrid button:hover img{filter:brightness(1) saturate(.85);transform:scale(1.012)}.workGrid i{display:block;margin-top:13px;color:#bd7972;font:10px monospace;font-style:normal}.workGrid strong{display:block;margin-top:5px;font-size:19px;font-weight:500}.workGrid small{display:block;min-height:40px;margin-top:6px;color:#989189;font-size:12px;line-height:1.7}.contact{padding:150px 8vw 35px;text-align:center;background:radial-gradient(circle at 50% 25%,#342324 0,transparent 35%),#0d0e10}.contact h1{margin:32px 0 55px;font:500 clamp(40px,5.4vw,86px)/1.28 "Noto Serif SC",serif;letter-spacing:-.1em}.contactBox{display:inline-flex;align-items:center;gap:22px;padding:14px 30px 14px 14px;border:1px solid #ffffff2d;text-align:left}.contactBox img{width:118px;height:118px}.contactBox small,.contactBox span,.contactBox strong{display:block}.contactBox strong{font-size:22px}.contactBox span{margin-top:8px;color:#c3bdb5;font:11px monospace}.contactBox small{margin-top:15px;color:#857e78;font-size:11px}footer{margin-top:115px;color:#5f5a55;font:10px monospace;letter-spacing:.15em}@media(max-width:800px){.museumNav{grid-template-columns:1fr auto}.museumNav nav,.museumNav>span{display:none}.archive,.letter{display:block;padding:100px 8vw}.letter h1{margin-top:45px}.letter article{margin:48px 0 0}.focus{padding:70px 5vw}.focusWork{display:block}.focusWork>img{height:65vh}.focusText{min-height:310px;padding:45px 9vw}.archiveIntro{position:static;margin-bottom:65px}.workGrid{gap:35px 14px}.contact{padding-top:110px}.openingCopy{top:31%}.opening h1{font-size:clamp(54px,15vw,90px)}}.shardStage{overflow:hidden;background:#060708}.shardStage,.wholeDoll{position:absolute;inset:0}.wholeDoll{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;opacity:0;transform:scale(1.035);filter:brightness(.76) saturate(.8);animation:wholeReveal .55s 1.85s both}.shard{position:absolute;inset:-1px;background-image:url(https://raw.githubusercontent.com/gisngisn/brokenporcelain/main/public/broken-dall-fragments.png);background-size:cover;background-position:50%;will-change:transform,opacity;animation:shardJoin 1.85s cubic-bezier(.16,.9,.2,1) both}.shard.one{clip-path:polygon(0 0,36% 0,28% 36%,0 49%);transform:translate(-52%,-32%) rotate(-18deg)}.shard.two{clip-path:polygon(36% 0,67% 0,55% 34%,28% 36%);transform:translate(8%,-55%) rotate(15deg);animation-delay:.08s}.shard.three{clip-path:polygon(67% 0,100% 0,100% 32%,55% 34%);transform:translate(56%,-38%) rotate(23deg);animation-delay:.15s}.shard.four{clip-path:polygon(0 49%,28% 36%,49% 58%,27% 100%,0 100%);transform:translate(-55%,19%) rotate(20deg);animation-delay:.13s}.shard.five{clip-path:polygon(28% 36%,55% 34%,72% 59%,49% 58%);transform:translate(-16%,-5%) scale(1.35);animation-delay:.05s}.shard.six{clip-path:polygon(55% 34%,100% 32%,100% 68%,72% 59%);transform:translate(52%,8%) rotate(-23deg);animation-delay:.11s}.shard.seven{clip-path:polygon(27% 100%,49% 58%,72% 59%,67% 100%);transform:translate(-8%,58%) rotate(-16deg);animation-delay:.18s}.shard.eight{clip-path:polygon(67% 100%,72% 59%,100% 68%,100% 100%);transform:translate(53%,44%) rotate(18deg);animation-delay:.03s}.openingCopy{opacity:0;transform:translateY(26px);animation:none}.openingCopy.revealed{animation:copyIn .8s cubic-bezier(.16,1,.3,1) both}.letter blockquote{margin:42px 0 0;padding:18px 0 0;border-top:1px solid #ffffff24;color:#d7b4a8;font-size:16px;line-height:1.8}@keyframes shardJoin{0%{opacity:0;filter:blur(10px) brightness(.35)}15%{opacity:1}to{transform:translate(0) rotate(0) scale(1);filter:blur(0) brightness(1)}}@keyframes wholeReveal{to{opacity:1}}@keyframes copyIn{0%{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){.shard{background-size:auto 100%;background-repeat:no-repeat}.openingCopy.revealed{animation-delay:0s}}.shard{background-image:url(https://raw.githubusercontent.com/gisngisn/brokenporcelain/main/public/doll.webp)!important}.museumHero:before{content:"";position:absolute;inset:18% 15% 8% 40%;background:linear-gradient(112deg,transparent 0 44%,#e6d8c21c 47%,#f3d9ae55 50%,#b9876722 53%,transparent 56%);filter:blur(12px);mix-blend-mode:screen;animation:fractureLight 6s ease-in-out infinite;z-index:1}.heroCrackLight{position:absolute;z-index:1;left:49%;top:10%;height:84%;width:2px;background:linear-gradient(180deg,transparent,#d2c2ab99 25%,#fff0ce 50%,transparent 84%);box-shadow:0 0 28px #d7af7a66;transform:rotate(13deg);opacity:.6;animation:crackPulse 4.5s ease-in-out infinite}.museumHero h1,.museumHero>p,.museumHero>span{position:relative;z-index:2}@keyframes fractureLight{0%,to{transform:translateX(-14%) skewX(-7deg);opacity:.25}50%{transform:translateX(18%) skewX(5deg);opacity:.75}}@keyframes crackPulse{0%,to{opacity:.25;filter:blur(1px)}50%{opacity:.9;filter:blur(0);box-shadow:0 0 42px #e4ba8266}}.shard{background-image:url(/doll.webp)!important}