:root{--paper: #f6f0e2;--paper-2: #efe6d2;--ink: #241e17;--ink-soft: rgba(36, 30, 23, .74);--ink-faint: rgba(36, 30, 23, .4);--seal: #a6401f;--seal-deep: #d4704c;--cream: #f3ecdb;--font-display: "Noto Serif SC", "Noto Serif CJK SC", "Songti SC", "STSong", "SimSun", serif;--font-latin: "EB Garamond", Georgia, "Times New Roman", serif;--brew-top: #f0f6f4;--brew-bottom: #eaf3ec;--water: 0;--ease-tea: cubic-bezier(.22, .61, .36, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-display);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.141 0 0 0 0 0.118 0 0 0 0 0.09 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.brew{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-2;background:linear-gradient(180deg,var(--brew-top),var(--brew-bottom));transition:background .4s linear;will-change:background}::selection{background:var(--seal);color:var(--cream)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}:focus-visible{outline:2px solid var(--seal);outline-offset:5px}.kicker{display:flex;align-items:center;gap:16px;font-family:var(--font-latin);font-size:13px;font-weight:600;letter-spacing:.44em;text-transform:uppercase;color:var(--seal);margin-bottom:30px}.kicker:after{content:"";width:56px;height:1px;background:currentColor;opacity:.55}.stage__title{font-size:clamp(44px,6.4vw,88px);font-weight:600;letter-spacing:.05em;line-height:1.16}.stage__verse{margin-top:34px;font-size:clamp(20px,2.4vw,30px);letter-spacing:.08em;line-height:1.9}.stage__body{margin-top:26px;max-width:34em;font-size:clamp(16px,1.5vw,19px);letter-spacing:.02em;line-height:2.15;color:var(--ink-soft)}.stage__inner{opacity:0;transform:translateY(30px);transition:opacity 1.1s var(--ease-tea),transform 1.1s var(--ease-tea)}.stage.is-in .stage__inner{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.stage__inner{opacity:1;transform:none}}.site-head{position:absolute;top:26px;left:30px;z-index:30;display:flex;gap:14px;align-items:baseline;font-family:var(--font-latin);font-size:15px;letter-spacing:.32em;transition:color .9s var(--ease-tea)}.site-head__sub{font-family:var(--font-display);font-size:12px;letter-spacing:.5em;color:var(--ink-faint);transition:color .9s var(--ease-tea)}[data-tone=deep] .site-head{color:var(--cream)}[data-tone=deep] .site-head__sub{color:#f3ecdb80}.stage{position:relative;min-height:100vh;display:grid;align-items:center;padding:14vh 7vw}.stage__inner{max-width:1120px;margin:0 auto;width:100%}.stage--hero{overflow:hidden}.hero{padding-top:6vh}.hero__left{max-width:680px}.hero__chwrap{position:relative;display:inline-block}.hero__ch{font-size:clamp(150px,26vw,380px);font-weight:600;line-height:.95;letter-spacing:.02em;position:relative;z-index:1}@media(prefers-reduced-motion:no-preference){.hero__ch{animation:breathe 16s var(--ease-tea) infinite}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.007)}}.hero__cap{position:absolute;right:-52px;bottom:4%;writing-mode:vertical-rl;font-size:13px;letter-spacing:.5em;color:var(--ink-soft);z-index:1}.hero__tag{margin-top:30px;font-size:clamp(18px,2vw,26px);letter-spacing:.12em;color:var(--ink);position:relative;z-index:1}.hero__hint{position:absolute;left:7vw;bottom:32px;display:flex;gap:10px;align-items:center;font-size:12px;letter-spacing:.34em;color:var(--ink-faint);transition:color .9s var(--ease-tea)}.hero__hint:hover{color:var(--seal)}.hero__hint-arrow{display:inline-block;animation:drop 2.8s var(--ease-tea) infinite}@keyframes drop{0%,to{transform:translateY(0);opacity:.35}50%{transform:translateY(6px);opacity:.9}}.steam{position:absolute;left:12%;right:30%;bottom:18%;height:62%;pointer-events:none;z-index:0}.steam__puff{position:absolute;bottom:0;width:16px;height:88px;border-radius:999px;background:radial-gradient(ellipse at center,#fff,#ffffff8c 30%,#241e1721 68%,#241e1700 78%);filter:blur(5px);opacity:0;left:calc(var(--i) * 24%);animation:rise calc(9s + var(--i) * 1.6s) var(--ease-tea) infinite;animation-delay:calc(var(--i) * -2.6s)}@keyframes rise{0%{transform:translateY(0) translate(0) scaleY(.85);opacity:0}22%{opacity:.7}to{transform:translateY(-240px) translate(10px) scaleY(1.25);opacity:0}}.dial{position:fixed;z-index:40;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--ink);--dial-top: calc(100vh - 150px) ;--dial-right: 26px;top:var(--dial-top);right:var(--dial-right);width:104px;transform:translateY(0);transition:top .9s var(--ease-tea),right .9s var(--ease-tea),width .9s var(--ease-tea),transform .9s var(--ease-tea),color .9s var(--ease-tea)}.dial--full{--dial-top: 50%;--dial-right: clamp(24px, 5vw, 80px);width:264px;transform:translateY(-50%)}.dial--compact{padding:9px 9px 6px;border-radius:50%;background:#f6f0e2b8;gap:0}[data-tone=deep] .dial--compact{background:#271c12c7}.dial__svg{width:100%;height:auto;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}.dial__svg:active{cursor:grabbing}.dial__rim{fill:none;stroke:currentColor;stroke-width:1;opacity:.14}.dial__track{fill:none;stroke:currentColor;stroke-width:1.6;opacity:.2}.dial__tick{stroke:currentColor;opacity:.32}.dial__value{fill:none;stroke:var(--seal);stroke-width:4;stroke-linecap:round}.dial__knob{fill:var(--seal);stroke:var(--paper);stroke-width:1.6;transform-origin:center;transition:transform .5s var(--ease-tea)}.dial__svg:hover .dial__knob{transform:scale(1.18)}.dial__num{font-family:var(--font-display);font-size:44px;font-weight:600;fill:currentColor;letter-spacing:.02em}.dial__unit{font-family:var(--font-latin);font-size:15px;letter-spacing:.22em;fill:currentColor;opacity:.66}.dial__meta{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:-34px}.dial__name{font-size:13px;letter-spacing:.5em;color:var(--ink-faint)}.dial__state{font-size:14px;letter-spacing:.24em;color:var(--ink-soft)}.dial input[type=range]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.dial:focus-within{outline:2px solid var(--seal);outline-offset:10px;border-radius:50%}.dial--compact .dial__meta{display:none}.dial--compact .dial__num{font-size:34px}.dial--compact .dial__unit{font-size:13px}[data-tone=deep] .dial{color:var(--cream)}[data-tone=deep] .dial__name,[data-tone=deep] .dial__state{color:#f3ecdb9e}.ruler{position:fixed;left:22px;top:50%;transform:translateY(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;gap:22px;padding:4px 0}.ruler__line{position:absolute;left:50%;top:6px;bottom:6px;width:1px;background:#241e171f;transition:background .9s}.ruler__line:after{content:"";position:absolute;left:0;top:0;width:100%;height:calc(var(--water) * 100%);background:#241e1780;transition:background .9s}.ruler__item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:7px;color:var(--ink-faint);font-size:12px;letter-spacing:.18em;transition:color .9s var(--ease-tea)}.ruler__dot{width:7px;height:7px;border-radius:99px;background:currentColor;opacity:.45;transition:background .4s,opacity .4s}.ruler__item:hover,.ruler__item.is-active{color:var(--ink)}.ruler__item.is-active .ruler__dot{background:var(--seal);opacity:1}[data-tone=deep] .ruler__line{background:#f3ecdb29}[data-tone=deep] .ruler__line:after{background:#f3ecdb8c}[data-tone=deep] .ruler__item{color:#f3ecdb80}[data-tone=deep] .ruler__item:hover,[data-tone=deep] .ruler__item.is-active{color:var(--cream)}[data-tone=deep] .ruler__item.is-active .ruler__dot{background:var(--seal-deep)}.stage--leaf .stage__inner{display:grid;grid-template-columns:minmax(260px,400px) minmax(0,1fr);gap:clamp(40px,8vw,120px);align-items:center}.leaf{width:100%;max-width:380px;color:var(--ink);transition:transform 1.4s var(--ease-tea)}.leaf:hover{transform:rotate(-1.4deg) translateY(-6px)}.leaf__svg{display:block;width:100%;height:auto}.leaf__p{fill:none;stroke:currentColor;stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:1;stroke-linecap:round;transition:stroke-dashoffset 7.5s var(--ease-tea)}.leaf__p--outline{stroke-width:2.6;transition-duration:7.5s}.leaf__p--mid{stroke-width:2;opacity:.85;transition-duration:6s;transition-delay:1.2s}.leaf__p--veins{stroke-width:1.4;opacity:.62;transition-duration:2.6s;transition-delay:5.2s}.leaf.is-drawn .leaf__p{stroke-dashoffset:0}.strips{display:flex;gap:clamp(10px,2.2vw,26px);margin-top:54px;margin-right:clamp(0px,11vw,160px)}.strip{flex:1 1 0;min-width:84px;opacity:0;transform:translateY(20px)}.strips.is-in .strip{opacity:1;transform:none;transition:opacity .9s var(--ease-tea) calc(var(--i) * .13s),transform .9s var(--ease-tea) calc(var(--i) * .13s)}.strip__bar{height:clamp(130px,25vh,215px);border-radius:3px;box-shadow:inset 0 0 0 1px #241e1714;transition:transform .7s var(--ease-tea)}.strip:hover .strip__bar{transform:scaleY(1.05)}.strip__name{margin-top:14px;font-size:14px;letter-spacing:.14em}.strip__meta{margin-top:4px;font-family:var(--font-latin);font-size:12px;letter-spacing:.14em;color:var(--ink-faint)}.stage--time .stage__inner{display:grid;grid-template-columns:minmax(230px,300px) minmax(0,1fr);gap:clamp(40px,8vw,120px);align-items:center}.timer{display:flex;flex-direction:column;align-items:center;gap:20px}.timer__dial{position:relative;width:100%;max-width:280px;aspect-ratio:1}.timer__dial svg{display:block;width:100%;height:auto}.timer__dial.is-done{animation:done-pulse 1.2s var(--ease-tea)}@keyframes done-pulse{0%{transform:scale(1)}35%{transform:scale(1.05)}to{transform:scale(1)}}.timer__track{stroke:currentColor;stroke-width:10;opacity:.13}.timer__progress{stroke:var(--seal);stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .2s linear}.timer__readout{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.timer__group{display:flex;align-items:baseline;gap:4px}.timer__num{font-size:clamp(44px,5vw,62px);font-weight:600;font-variant-numeric:tabular-nums;line-height:1}.timer__unit{font-size:14px;letter-spacing:.2em;color:var(--ink-faint)}.timer__word{font-size:clamp(40px,5vw,56px);font-weight:600;letter-spacing:.3em;color:var(--seal)}.timer__note{font-size:14px;letter-spacing:.2em;color:var(--ink-soft);text-align:center}.timer__again{border:1px solid var(--seal);color:var(--seal);padding:11px 30px;font-size:13px;letter-spacing:.32em;transition:background .5s var(--ease-tea),color .5s var(--ease-tea)}.timer__again:hover{background:var(--seal);color:var(--cream)}.stage--deep{background:#271c12e6;color:var(--cream);align-content:center}.stage--deep .kicker{color:var(--seal-deep)}.stage--deep .stage__body{color:#f3ecdbc7}.seal{margin-top:44px;width:76px;height:76px;display:grid;place-items:center;border:2px solid var(--seal-deep);color:var(--seal-deep);font-size:36px;font-weight:600;transform:rotate(3deg);transition:transform 1s var(--ease-tea)}.seal:hover{transform:rotate(-2deg) scale(1.05)}.aftertaste__ghost{position:absolute;right:4%;bottom:22%;font-size:clamp(220px,30vw,460px);font-weight:700;line-height:1;color:#f3ecdb0d;pointer-events:none}.site-foot{position:absolute;left:7vw;right:7vw;bottom:26px;display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between;padding-top:22px;border-top:1px solid rgba(243,236,219,.16);font-family:var(--font-latin);font-size:12px;letter-spacing:.1em;color:#f3ecdb8c}@media(max-width:1080px){.ruler{display:none}}@media(max-width:860px){.stage{padding:12vh 6vw}.site-head{position:absolute}.dial--full{--dial-top: calc(100vh - 150px) ;--dial-right: 18px;width:104px;transform:none}.dial--full .dial__meta{display:none}.dial--full .dial__num{font-size:34px}.dial--full .dial__unit{font-size:13px}.hero__cap{right:auto;left:104%;bottom:10%}.stage--leaf .stage__inner,.stage--time .stage__inner{grid-template-columns:1fr;gap:40px}.leaf{max-width:240px}.strips{flex-wrap:wrap;padding-bottom:130px;margin-right:0}.strip{flex:1 1 28%;min-width:84px}.site-foot{left:6vw;right:6vw;padding-right:120px}}@media(max-width:520px){.strip{flex:1 1 42%}.hero__ch{font-size:clamp(120px,38vw,220px)}.hero__hint{left:6vw}.timer__dial{max-width:220px}}