:root{--paper:#fff5e8;--red:#a51f16;--red-bright:#c13624;--ink:#3c3025;--muted:#9a7356;--line:#e7c9ac;--serif:"Songti SC","Noto Serif CJK SC","Source Han Serif SC","SimSun",serif;--ease:cubic-bezier(.22,.7,.2,1)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#e5d9ca;color:var(--ink);font-family:var(--serif);-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{color:inherit;cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:active{transform:scale(.965)}button:focus-visible,input:focus-visible{outline:2px solid var(--red);outline-offset:4px}button{transition:transform .2s,background .25s,box-shadow .25s,color .25s}button[hidden],[hidden]{display:none!important}p,h1,h2,h3{margin:0}button svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.exhibition{position:relative;isolation:isolate;width:100%;max-width:480px;height:100%;height:100dvh;overflow:hidden;background:var(--paper);margin:auto}.paper-grain{position:absolute;z-index:10;pointer-events:none;inset:0;opacity:.23;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.62' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23976e48' opacity='.18' filter='url(%23n)' d='M0 0h200v200H0z'/%3E%3C/svg%3E")}.pages{position:absolute;inset:0}.page{position:absolute;inset:0;visibility:hidden;opacity:0;pointer-events:none;background:radial-gradient(ellipse at 70% 25%,#fffaf2b3,transparent 60%),var(--paper);transition:opacity .55s var(--ease),transform .55s var(--ease),visibility .55s}.page.active{visibility:visible;opacity:1;pointer-events:auto;transform:none;z-index:2}.page.enter-forward{transform:translateY(24px);opacity:0}.page.enter-back{transform:translateY(-24px);opacity:0}.page-scroll{height:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:95px 23px 88px}.page-scroll::-webkit-scrollbar{display:none}.topbar{position:absolute;z-index:6;top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;height:90px;padding:calc(13px + env(safe-area-inset-top,0px)) 15px 12px;background:linear-gradient(var(--paper) 65%,#fff5e800)}.icon-button{width:38px;height:38px;display:grid;place-items:center;color:var(--red);padding:7px}.brand{padding:0;text-align:center;color:var(--red)}.brand strong{display:block;font-size:23px;letter-spacing:2px;font-weight:800;line-height:1.15}.brand span{display:block;font-size:8px;letter-spacing:1.1px;color:#85512e;line-height:1.2;margin-top:4px}.art{display:block;overflow:hidden;position:relative}.art svg{width:100%;height:100%;display:block}.eyebrow{font-family:Georgia,serif;font-size:9px;letter-spacing:1.6px;color:#875331}.english{font-family:Georgia,serif;letter-spacing:3px;color:#8c502c}.cover .page-scroll{position:relative;padding:0;min-height:100%;overflow:hidden}.cover-heading{position:absolute;top:6.3%;left:0;right:0;text-align:center;z-index:2}.cover-heading .eyebrow{font-size:8px;letter-spacing:2px}.cover h1{font-size:65px;line-height:1.24;letter-spacing:1px;color:var(--red);font-weight:900;text-shadow:1px 2px 0 #f3c098}.cover h1 span{margin-left:10px}.cover-subtitle{font-size:14px;letter-spacing:6px;margin-top:5px}.invitation-copy{position:absolute;top:24%;width:100%;z-index:3;text-align:center}.invitation-copy h2{font-size:40px;letter-spacing:10px;color:var(--red);font-weight:500;margin-left:10px}.invitation-copy .english{font-size:14px;letter-spacing:4px;margin:5px 0 16px}.question{font-size:14px;letter-spacing:2px}.vertical-tag{position:absolute;right:16px;top:5px;writing-mode:vertical-rl;font-size:9px;color:#a57f5f;letter-spacing:4px}.cover-art{position:absolute;left:0;right:0;top:37%;height:54%;-webkit-mask-image:linear-gradient(transparent,#000 10%,#000 84%,transparent);mask-image:linear-gradient(transparent,#000 10%,#000 84%,transparent)}.enter-button{position:absolute;bottom:8.8%;left:50%;transform:translateX(-50%);display:flex;gap:27px;align-items:center;justify-content:center;white-space:nowrap;min-height:46px;padding:10px 25px;color:#fff8ed;background:linear-gradient(120deg,#c53a29,#991c15);box-shadow:0 5px 15px #a73e2528;border:1px solid #d7875a;border-radius:30px;z-index:3;font-size:16px;letter-spacing:3px}.enter-button:active{transform:translateX(-50%) scale(.96)}.arrow{font-size:22px;letter-spacing:0}.cover-hint{position:absolute;bottom:3.1%;text-align:center;width:100%;font-size:10px;letter-spacing:2px;color:#856347;z-index:3}.chevrons{display:block;width:12px;height:12px;border-top:1px solid currentColor;border-left:1px solid currentColor;transform:rotate(45deg);position:relative;margin:0 auto 4px;animation:float-arrow 2.4s ease-in-out infinite}.chevrons:after{content:"";position:absolute;inset:4px -5px -5px 4px;border-top:1px solid currentColor;border-left:1px solid currentColor}@keyframes float-arrow{0%,100%{translate:0 2px;opacity:.5}50%{translate:0 -3px;opacity:1}}.contents-heading{padding:23px 12px 22px}.contents-heading h2{color:var(--red);font-size:57px;line-height:1.25;font-weight:600;letter-spacing:6px}.contents-heading .english{font-size:15px;letter-spacing:5px}.fine-rule{display:block;width:29px;height:1px;background:var(--red);margin-top:16px}.chapter-list{display:grid;gap:14px}.chapter-card{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:97px;border:1px solid #edc7a8;border-radius:16px 4px;padding:12px 10px;background:linear-gradient(135deg,#fff9f0,#fff3e5b0);box-shadow:0 5px 12px #c88d5d24;text-align:left}.chapter-card:before{content:"";pointer-events:none;position:absolute;inset:4px;border:1px solid #efd5bd;border-radius:12px 2px}.brush-number{position:relative;color:var(--red);font-family:Georgia,serif;display:grid;place-items:center;width:57px;height:57px;font-size:35px;font-style:italic;flex-shrink:0;isolation:isolate}.brush-number:before{content:"";position:absolute;inset:0;border:3px solid #e8ad8b75;border-left-width:5px;border-bottom-width:2px;border-radius:50% 46% 51% 44%;transform:rotate(-19deg);box-shadow:inset 0 0 0 2px #fff7e980,0 0 0 2px #f0b18f20}.card-copy{border-left:1px solid #c75c42;padding-left:12px;flex:1}.card-copy strong{display:block;color:var(--red);font-size:25px;letter-spacing:2px;line-height:1.3}.card-copy small{display:block;font-size:10px;line-height:1.6;white-space:nowrap;margin-top:5px;color:#784e32}.round-arrow{border:1px solid var(--red);border-radius:50%;height:27px;width:27px;display:grid;place-items:center;font-size:28px;line-height:1;color:var(--red);flex-shrink:0;padding:0 0 4px}.contents-quote{text-align:center;color:var(--red);font-size:19px;letter-spacing:3px;padding:27px 0 0}.contents-art{height:218px;margin:-3px -23px -46px;-webkit-mask-image:linear-gradient(transparent,#000 10%,#000 75%,transparent);mask-image:linear-gradient(transparent,#000 10%,#000 75%,transparent)}.contents-start{display:flex!important;margin:0 auto;position:relative;z-index:1;gap:22px}.text-button{font-size:11px;color:var(--red);padding:9px 0;letter-spacing:1px}.contents-page .page-scroll{padding-bottom:78px}.page-footer{position:absolute;bottom:0;left:0;right:0;z-index:5;height:calc(60px + env(safe-area-inset-bottom,0px));padding:8px 23px calc(8px + env(safe-area-inset-bottom,0px));background:linear-gradient(#fff5e800,var(--paper) 30%);display:flex;align-items:center;gap:15px;color:#9a785e}.chapter-dots{display:flex;gap:4px}.chapter-dots button{width:20px;height:30px;position:relative}.chapter-dots button:after{content:"";display:block;width:6px;height:6px;margin:auto;background:#dfc1a6;border-radius:50%;transition:all .3s}.chapter-dots button[aria-current=true]:after{background:var(--red);width:8px;height:8px;box-shadow:0 0 0 3px #bf372517}#page-position{font-size:9px;letter-spacing:1px;margin-right:auto}#footer-next{width:36px;height:35px;color:var(--red);display:grid;place-items:center;padding-top:12px}.chapter-heading{text-align:center;margin:0 -10px 25px}.chapter-heading .brush-number{width:63px;height:63px;font-size:39px;margin:0 auto 6px}.chapter-heading h2{font-size:43px;color:var(--red);font-weight:800;letter-spacing:4px;line-height:1.35}.chapter-heading>p{font-size:13px;letter-spacing:1.3px;margin-top:5px}.chapter h3{position:relative;font-size:21px;color:var(--red);letter-spacing:1px;line-height:1.45;font-weight:700;padding-left:13px;margin-bottom:9px}.chapter h3:before{content:"";position:absolute;left:0;top:7px;width:3px;height:21px;background:linear-gradient(#edb693,#ab2117)}.chapter article>p,.ip-story p{font-size:13px;line-height:1.85;letter-spacing:.6px}.chapter article{margin-bottom:21px}.origin-story>p,.kiln-story>p{padding-left:13px}.image-button{width:100%;padding:0}.excavation{height:112px;margin-top:-6px;-webkit-mask-image:linear-gradient(transparent,#000 18%,#000 84%,transparent);mask-image:linear-gradient(transparent,#000 18%,#000 84%,transparent)}.image-note{display:block;text-align:right;color:#9b785d;font-size:9px;letter-spacing:.6px;line-height:1.6}.image-note>span{display:inline-block;color:var(--red);font-size:15px;vertical-align:-1px;margin-left:4px}.era-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:14px}.era-tabs button{padding:3px 0 8px;border-bottom:1px solid #e3c4a7;opacity:.65}.era-tabs button[aria-selected=true]{opacity:1;border-bottom:2px solid var(--red);background:linear-gradient(transparent,#e9c7a526)}.era-tabs .art{height:72px;width:100%}.era-tabs strong,.era-tabs small{display:block}.era-tabs strong{font-size:15px;margin-top:3px;font-weight:500}.era-tabs small{font-size:10px;margin-top:4px;white-space:nowrap}.era-description{padding:11px 12px;background:#f1dfca52;margin-top:10px;min-height:72px;border-left:1px solid #c54e35}.era-description>span{font-size:12px;color:var(--red)}.era-description>p{font-size:11px;line-height:1.8;margin-top:4px}.ribbon{height:94px;margin:-9px -23px -20px;-webkit-mask-image:linear-gradient(transparent,#000 15%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 15%,#000 70%,transparent)}.next-chapter{position:relative;display:flex;justify-content:space-between;align-items:center;width:100%;border-top:1px solid #dcb99a;padding:17px 0 4px;color:var(--red);font-size:12px;letter-spacing:1px}.next-chapter>span:last-child{font-size:20px}.kiln{height:114px;margin-top:-2px;-webkit-mask-image:linear-gradient(transparent,#000 10%,#000 83%,transparent);mask-image:linear-gradient(transparent,#000 10%,#000 83%,transparent)}.formula{display:flex;align-items:center;justify-content:space-around;margin-top:11px}.formula button{display:flex;flex-direction:column;align-items:center;padding:0}.formula b{color:var(--red);font-size:20px;font-weight:400;align-self:flex-start;margin-top:22px}.material{display:grid;place-items:center;border:1px solid #edcdb4;box-shadow:inset 0 0 7px #daa57233,0 1px 4px #c6905722;border-radius:50%;width:57px;height:57px;font-family:Georgia,serif;color:var(--red);background:radial-gradient(#fffaf0,#fae6d3)}.copper{font-size:28px;text-shadow:8px 3px 0 #a8351f,-8px 5px 0 #bc4a2b,1px -6px 0 #cf5532}.flame{font-size:43px;color:#d54b1d}.heat{font-size:17px;letter-spacing:-1px}.heat sup{font-size:10px}.formula strong{font-size:14px;margin-top:8px;font-weight:500}.formula small{font-size:10px;margin-top:3px}.process-note{margin-top:12px;min-height:35px;background:#f0dfca4d;padding:7px 9px;font-size:10px!important;color:#976644;line-height:1.8!important}.section-line{display:flex;align-items:center;justify-content:space-between}.section-line>span{font-size:9px;color:#a28066}.firing-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.firing-tabs button{padding:0 0 9px;opacity:.7;border-bottom:1px solid transparent}.firing-tabs button[aria-selected=true]{border-bottom:2px solid var(--red);opacity:1}.firing-tabs .art{height:82px;border-radius:13px;box-shadow:0 3px 9px #9d62471b;transition:box-shadow .3s}.firing-tabs button[aria-selected=true] .art{box-shadow:0 0 0 2px var(--red),0 3px 9px #9d62471b}.firing-tabs strong,.firing-tabs small{display:block;font-weight:400}.firing-tabs strong{font-size:17px;margin-top:9px}.firing-tabs small{font-size:10px;margin-top:3px}.firing-note{font-size:10px!important;line-height:1.8!important;color:#946346;margin-top:10px;min-height:34px}.relic-link{display:flex;flex-wrap:wrap;width:100%;justify-content:space-between;gap:8px;border:1px solid #e4c2a5;border-radius:3px;padding:12px;color:var(--red);font-size:11px;margin:17px 0 21px}.relic-link>span:last-child{font-size:10px;color:#a07b5c}.ip-story{display:flex;position:relative;align-items:center;gap:0;min-height:155px}.ip-story>div{width:64%;z-index:1}.ip-story h3{font-size:20px;white-space:nowrap}.ip-story p{font-size:12px;padding-left:13px;line-height:1.85}.ip-story .text-button{font-size:9px;margin-left:13px}.ip-character{width:41%;height:163px;margin-left:-4%;padding:0;transform-origin:bottom center;-webkit-mask-image:linear-gradient(#000 88%,transparent);mask-image:linear-gradient(#000 88%,transparent)}.ip-character.wave{animation:wave .7s ease-in-out 2}@keyframes wave{0%,100%{rotate:0deg}30%{rotate:-7deg}70%{rotate:6deg}}.ip-speech{position:absolute;right:0;bottom:-12px;background:#fffaf1;box-shadow:0 3px 10px #89513720;padding:5px 9px!important;border-radius:8px;font-size:10px!important;color:var(--red);z-index:2}.maker>p{margin-bottom:12px}.cup-stage{position:relative;display:flex;align-items:center;justify-content:space-around;height:155px;border:1px solid #edc9ae;border-radius:20px 6px;background:radial-gradient(ellipse at center,#fffaf0,#f9e7d966);box-shadow:inset 0 0 0 4px #fffaf18a,0 4px 9px #bb86562b}.cup-stage .round-arrow{width:30px;height:30px;font-size:29px}#cup-preview{width:184px;height:142px;filter:drop-shadow(0 6px 5px #92634022);transition:opacity .2s}#cup-preview svg{display:block;width:100%;height:100%}.cup-stage-label{position:absolute;bottom:7px;left:0;right:0;text-align:center;font-size:9px;color:#936949;letter-spacing:3px}.maker-options{display:flex;justify-content:space-between;align-items:center;margin:13px 0}.pattern-options{display:flex;gap:3px}.pattern-options button{font-size:10px;padding:6px 9px;border-radius:15px;border:1px solid #e5c6aa}.pattern-options button[aria-pressed=true]{color:var(--red);background:#ba352510;border-color:#bd5e41}.color-options{display:flex;gap:5px}.color-options button{height:28px;width:28px;display:grid;place-items:center;position:relative;border:1px solid transparent;border-radius:50%}.color-options button:after{content:"";display:block;width:16px;height:16px;border-radius:50%;background:var(--swatch)}.color-options button[aria-pressed=true]{border-color:var(--swatch)}.primary-button{width:100%;padding:12px 18px;display:flex;justify-content:center;align-items:center;gap:24px;background:linear-gradient(115deg,#c63827,#a11e17);color:#fff7e9;border:1px solid #cf7451;border-radius:24px;box-shadow:0 4px 9px #b1572e24;letter-spacing:2px;font-size:14px;min-height:44px}.products .popsicle-art{height:84px;width:100%;padding:0;margin-top:9px}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}.product-grid button{padding:0}.product-grid .art{height:99px;width:100%}.product-grid span:not(.art),.product-grid small{display:block}.product-grid span:not(.art){font-size:12px;margin-top:6px;color:var(--red)}.product-grid small{font-size:9px;color:#987151;margin-top:4px}.products .image-note{text-align:center;margin-top:14px}.ending{text-align:center;margin-top:25px}.ending .fine-rule{margin:0 auto 15px}.ending>p{font-size:17px;letter-spacing:3px;color:var(--red)}.ending .text-button{margin:10px 9px}.menu-overlay{position:absolute;inset:0;z-index:20;padding:125px 30px 40px;background:radial-gradient(ellipse at 80% 0,#f1d9c5,transparent 65%),#fff5e8f9;backdrop-filter:blur(12px);animation:menu-in .35s var(--ease)}@keyframes menu-in{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}.close-menu{position:absolute;right:18px;top:22px;font-size:36px;font-family:Georgia,serif}.menu-overlay h2{font-size:29px;color:var(--red);margin:15px 0 32px}.menu-overlay nav{display:grid}.menu-overlay nav button{font-size:22px;display:flex;align-items:center;text-align:left;padding:17px 0;border-bottom:1px solid #dfc0a4;color:var(--red);letter-spacing:3px}.menu-overlay nav span{font-family:Georgia,var(--serif);font-size:15px;font-style:italic;letter-spacing:1px;min-width:43px;color:#b77f5a}.menu-overlay nav b{margin-left:auto;font-size:20px;font-weight:400;color:#ab7957}.menu-bottom{font-size:10px;letter-spacing:5px;color:#997456;margin-top:45px}.modal-backdrop{position:absolute;inset:0;z-index:30;background:#3f221b70;backdrop-filter:blur(5px);display:flex;align-items:flex-end;justify-content:center;padding:18px 12px calc(16px + env(safe-area-inset-bottom,0px));animation:menu-in .3s var(--ease)}.modal-card{position:relative;width:100%;max-height:92%;overflow:auto;background:var(--paper);padding:33px 23px 24px;border:1px solid #e6c3a3;border-radius:22px 22px 8px 8px;box-shadow:0 -10px 50px #28130a26;scrollbar-width:none}.modal-close{position:absolute;top:6px;right:7px;font-size:30px;z-index:2;font-family:Georgia,serif}.modal-card h2{font-size:25px;color:var(--red);letter-spacing:2px;margin:7px 0 13px}.modal-card p{font-size:12px;line-height:1.85;letter-spacing:.4px}.modal-card .detail-art{max-height:320px;height:230px;margin:8px -12px 17px}.modal-card .detail-caption{font-size:9px;color:#a38266;margin-top:12px}.modal-card .text-button{margin-top:12px}.modal-card .primary-button{margin-top:16px}.modal-card .poster-image{display:block;max-height:50vh;width:auto;max-width:100%;margin:0 auto 15px;border:1px solid #e5c4a7;box-shadow:0 4px 12px #ac785c22}.poster-actions{display:flex;align-items:center;gap:12px}.poster-actions .primary-button{flex:1}.poster-actions .text-button{min-width:65px}.poster-help{text-align:center;font-size:10px!important;color:#9b7556}.share-url{margin:16px 0 12px;display:block;font-size:11px}.share-url input{margin-top:8px;width:100%;background:#fffbf4;border:1px solid #d6b597;border-radius:4px;padding:11px;font-family:Arial,sans-serif;font-size:12px;color:#70503c}.qr-wrap{width:180px;height:180px;background:white;padding:4px;margin:16px auto}.qr-wrap svg{height:100%;width:100%}.share-note{font-size:10px!important;color:#8f6e54;text-align:center}.toast{position:absolute;bottom:85px;left:50%;translate:-50% 0;background:#663a2ff0;color:#fff7eb;padding:11px 16px;border-radius:7px;font-size:12px;z-index:50;max-width:85%;text-align:center;line-height:1.6;width:max-content;box-shadow:0 3px 12px #3f1f1722}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{position:fixed;inset:30% 0;text-align:center}.poster-render{position:absolute;left:-9999px;top:0}body:has(.modal-backdrop:not([hidden])) .page-scroll{overflow:hidden}
.qr-wrap img{display:block;width:100%;height:100%;object-fit:contain}
@media(min-width:600px){body{display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 35% 25%,#f2e9dd,#d5c3b0)}.exhibition{height:min(812px,calc(100dvh - 36px));width:375px;max-width:375px;border-radius:18px;box-shadow:0 25px 70px #76543836,0 0 0 1px #b2987c44;margin:0}.modal-card{max-height:95%}}
@media(max-width:350px){.page-scroll{padding-left:17px;padding-right:17px}.contents-art,.ribbon{margin-left:-17px;margin-right:-17px}.chapter-heading h2{font-size:38px}.chapter-heading>p{font-size:11px}.card-copy strong{font-size:22px}.chapter-card{gap:7px;padding-left:7px;padding-right:7px}.card-copy{padding-left:8px}.brush-number{width:49px;height:49px;font-size:31px}.card-copy small{font-size:9px}.cover h1{font-size:56px}.cover-subtitle{font-size:12px;letter-spacing:5px}.pattern-options button{padding:6px}.ip-story h3{font-size:18px}.ip-story p{font-size:11px}.chapter h3{font-size:19px}}
@media(max-height:660px){.cover-heading{top:4.5%}.cover h1{font-size:53px}.cover-subtitle{font-size:12px}.invitation-copy{top:25%}.invitation-copy h2{font-size:32px}.invitation-copy .english{font-size:11px;margin-bottom:8px}.question{font-size:11px}.cover-art{top:38%;height:52%}.cover-hint{font-size:8px}.enter-button{bottom:9%;min-height:39px;font-size:13px}.menu-overlay{padding-top:75px}.menu-overlay nav button{padding:13px 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}