@font-face{font-family:Caveat;src:url('assets/display.woff2?v=1.1.0')}@font-face{font-family:Noto;src:url('assets/sans.woff2?v=1.1.0');font-weight:100 900}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{--tone:#b9e6e5;--deep:#075a69;--accent:#087e91;margin:0;color:#123b40;background:var(--tone);font:15px/1.8 Noto,sans-serif;transition:background 1.2s}body[data-tone=mango]{--tone:#f6d99c;--deep:#693b1f;--accent:#af561d}body[data-tone=hibiscus]{--tone:#efc2cc;--deep:#672b47;--accent:#a83358}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #194df0;outline-offset:5px}button:disabled{opacity:.35;cursor:default}h1,h2,h3,p{margin:0}h1{font-size:clamp(32px,4.3vw,64px);font-weight:600;line-height:1.45;letter-spacing:.02em}h2{font-size:30px;line-height:1.5;font-weight:500}h3{font-size:23px;line-height:1.6}p+p{margin-top:20px}.script{font-family:Caveat,cursive;font-weight:600;line-height:.95}.eyebrow{font-size:11px;letter-spacing:.2em;font-weight:600;margin-bottom:24px}.rail{position:fixed;inset:0 auto 0 0;width:92px;background:#fffdf7;z-index:30;display:flex;align-items:center;flex-direction:column;padding:26px 10px;box-shadow:1px 0 0 #173e3a12}.brand{font-size:11px;line-height:1.1;text-align:center;font-weight:800;letter-spacing:1px}.brand span{display:block;font-size:40px;color:#087e91;margin-bottom:12px}.rail nav{display:flex;flex-direction:column;gap:35px;margin-top:65px;font-size:11px;writing-mode:vertical-rl;letter-spacing:.16em}.rail nav a:hover{color:#af561d}.rail>button{margin-top:auto;border:1px solid #bed0c8;border-radius:50%;background:none;width:36px;height:36px}.rail small{font-size:9px;line-height:1.5;letter-spacing:.18em;margin-top:18px;text-align:center}main{margin-left:92px;overflow:hidden}.skip{position:fixed;left:100px;top:-100px;z-index:100;background:#fff;padding:12px}.skip:focus{top:0}.hero{min-height:850px;height:100svh;max-height:1120px;position:relative;padding:30px 6% 45px;background:linear-gradient(125deg,#ffffffaa,transparent 72%);isolation:isolate}.hero-photo{position:absolute;inset:0;background:linear-gradient(90deg,#d9eeebf2,#d9eeeb80 60%,#d9eeeb25),url('assets/island.webp') center/cover;opacity:.45;z-index:-2;mask-image:linear-gradient(#000 55%,transparent)}header{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.18em;position:relative;z-index:3}header a{border-bottom:1px solid}.hero-copy{position:relative;z-index:3;width:50%;padding-top:90px}.aloha{font-size:clamp(100px,12vw,180px);color:var(--deep);transform:rotate(-9deg);margin:0 0 12px -8px;transition:color 1s}.hero-copy>p:not(.aloha){margin:24px 0 32px;line-height:2}.pill{display:inline-flex;align-items:center;justify-content:center;padding:14px 25px;border:1px solid currentColor;border-radius:30px;font-size:13px;font-weight:600;background:#fffaf165;transition:transform .3s,box-shadow .3s}.pill:hover{transform:translateY(-3px);box-shadow:0 8px 20px #143b3b20}.dark{background:#123b40;color:#fffdf3;border-color:#123b40}.hero-stage{position:absolute;right:4%;top:13%;width:50%;height:73%;perspective:1000px}.hero-stage>img{position:absolute;width:68%;height:96%;object-fit:contain;left:13%;top:0;filter:drop-shadow(20px 25px 16px #16484722);animation:float 7s ease-in-out infinite;transition:opacity .35s,transform .6s}.orbit{position:absolute;width:90%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#ffffff70,transparent 65%);border:1px solid #fff8;top:12%;left:0;transform:rotate(-20deg) scaleY(.7)}.floating-note{position:absolute;top:0;right:4%;font-size:40px;color:var(--deep);transform:rotate(11deg);z-index:2}.round-stamp{position:absolute;left:0;top:54%;border:1px solid currentColor;border-radius:50%;width:102px;height:102px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;line-height:1.6;letter-spacing:.15em;transform:rotate(-15deg)}.flavour-tag{position:absolute;right:0;bottom:5%;padding:15px 22px;background:#fff9e9;box-shadow:4px 10px 30px #21483d18;transform:rotate(4deg);display:flex;flex-direction:column;max-width:260px;z-index:3}.flavour-tag:before{content:'';position:absolute;top:-10px;left:35%;width:70px;height:22px;background:#fff8;transform:rotate(-8deg)}.flavour-tag small{font-size:9px;letter-spacing:.16em}.flavour-tag strong{font-size:22px}.flavour-tag span{font-size:11px}.hero-bottom{position:absolute;bottom:30px;left:6%;right:6%;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.1em;gap:20px}.tone-tabs{display:flex;gap:10px}.tone-tabs button{border:1px solid transparent;background:#fff5;border-radius:30px;padding:9px 15px;display:flex;align-items:center;gap:8px;font-size:12px}.tone-tabs button[aria-pressed=true]{border-color:currentColor;background:#fffa}.tone-tabs i{width:12px;height:12px;border-radius:50%;display:block}.blue{background:#48b8ce}.orange{background:#ecab3e}.pink{background:#d46b87}.leaf{position:absolute;width:290px;fill:var(--deep);opacity:.12;pointer-events:none;right:-70px;bottom:-120px;transform:rotate(-50deg);z-index:1;transition:fill 1.2s}.hero>.leaf{left:-120px;bottom:-100px;transform:rotate(60deg);width:380px}.collection{padding:100px 6% 100px;position:relative;background:#fff6dfaa}.section-head{position:relative;display:grid;grid-template-columns:1fr auto;gap:12px 30px}.section-head>.eyebrow{grid-column:1/-1;margin:0}.section-head .script{font-size:75px;display:inline-block;transform:rotate(-5deg);margin:0 0 20px}.section-head>p:last-child{font-size:13px;align-self:end;margin-bottom:10px}.collection-controls{margin:45px 0 10px;display:flex;justify-content:space-between;align-items:center;gap:10px}.filter{border:0;border-bottom:1px solid transparent;padding:10px 12px;background:none;font-size:12px}.filter.active{border-color:currentColor;font-weight:700}.arrow{border:1px solid #123b4040;border-radius:50%;width:38px;height:38px;background:none;margin-left:7px}.tea-belt{display:flex;align-items:flex-end;gap:32px;overflow:auto;scroll-snap-type:x mandatory;padding:90px 25px 45px;scrollbar-width:thin;scrollbar-color:#79988c transparent;min-height:520px}.tea-card{flex:0 0 calc((100% - 64px)/3);min-width:240px;position:relative;background:#c6e3de;padding:210px 24px 24px;scroll-snap-align:center;transition:transform .5s,box-shadow .5s;border-radius:50% 50% 6px 6px / 15% 15% 6px 6px;isolation:isolate}.tea-card:nth-child(2){margin-bottom:32px;background:#f0d59a;transform:rotate(2deg)}.tea-card:nth-child(3){background:#ebc1c7;transform:rotate(-2deg)}.tea-card:hover,.tea-card:focus-within{transform:translateY(-10px) rotate(0);box-shadow:0 22px 22px #123b4018}.tea-card img{position:absolute;left:15%;top:-90px;width:70%;height:290px;object-fit:contain;filter:drop-shadow(8px 15px 8px #0002);transition:transform .5s}.tea-card:hover img,.tea-card:focus-within img{transform:rotate(-7deg) translateY(-8px)}.tea-card h3{font-size:22px;margin:10px 0}.tea-card .number{font-family:Caveat;font-size:36px;position:absolute;left:15px;top:20px;opacity:.6}.tea-card p{font-size:12px}.tea-card .badge{position:absolute;top:145px;right:12px;background:#91354e;color:white;padding:5px 9px;font-size:9px;transform:rotate(8deg)}.heart{position:absolute;right:13px;top:13px;width:37px;height:37px;border:1px solid #ffffff9c;background:#fff8;border-radius:50%;font-size:23px;z-index:3}.heart[aria-pressed=true]{color:#9e2947;background:#fff}.card-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #123b4025;margin-top:18px;padding-top:15px;font-size:12px}.details{border:0;background:none;padding:3px 0;border-bottom:1px solid}.card-reveal{font-size:11px;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s,opacity .5s}.tea-card:hover .card-reveal,.tea-card:focus-within .card-reveal{max-height:80px;opacity:1;padding-top:12px}.belt-caption{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.1em}.empty{padding:70px 0}.brew{padding:110px 7% 130px;display:grid;grid-template-columns:30% 1fr;gap:30px;position:relative;color:var(--deep);transition:color 1s}.brew-title{padding-top:20px}.brew-title h2{font-size:100px;transform:rotate(-7deg);margin-bottom:35px}.brew-title>p:last-child{line-height:2.2}.brew-notebook{background:#fff9e9;padding:42px 42px 65px;color:#254247;transform:rotate(2deg);position:relative;box-shadow:10px 18px 0 #7b67400a,0 25px 45px #7b674022;z-index:2}.tape{position:absolute;left:40%;top:-15px;width:110px;height:35px;background:#fff9;transform:rotate(-9deg)}.brew-tabs{display:flex;border-bottom:1px solid #25424740;margin-top:25px}.brew-tabs button{border:0;background:none;padding:13px 20px;border-bottom:3px solid transparent}.brew-tabs button[aria-selected=true]{border-bottom-color:#bc681f}.brew-steps{display:flex;gap:20px;margin:28px 0}.brew-step{flex:1}.brew-step b{display:block;font:44px Caveat;color:#9b5120}.brew-step strong{display:block;font-size:15px;margin:8px 0}.brew-step p{font-size:12px}#brew-note{font-size:12px}.small-note{font-size:10px;line-height:1.8;opacity:.8;margin-top:20px}.peel{position:absolute;bottom:0;right:0;background:linear-gradient(135deg,transparent 0 17%,#f0e1bd 18%);width:135px;height:45px;border:0;transition:transform .4s;transform-origin:right bottom;font-size:11px}.peel:hover{transform:rotateY(-15deg) rotateX(12deg);box-shadow:-6px -4px 12px #0001}#brew-tip{background:#f2e6c9;padding:20px;margin-top:24px;font-size:13px}.ingredient-note{position:absolute;left:5%;bottom:45px;width:30%;background:#fff4d8;padding:20px 25px;transform:rotate(-8deg);box-shadow:0 12px 25px #0001;z-index:3}.ingredient-note .script{font-size:35px}.ingredient-note p{font-size:11px;margin-top:10px}.ingredient-note svg{width:150px;display:block;margin-top:5px}.mix{position:relative;min-height:900px;padding:90px 7% 100px;display:grid;grid-template-columns:1fr 1fr;gap:10px 4%;background:#ffffff35;isolation:isolate}.mix-heading{grid-column:1/-1;z-index:3}.mix-heading .script{font-size:90px;display:inline-block;transform:rotate(-5deg);margin-bottom:10px}.mix-heading h2{font-size:26px}.mix-stage{position:relative;min-height:600px;align-self:end}.mix-stage img{position:absolute;left:8%;width:80%;height:100%;object-fit:contain;z-index:2;filter:drop-shadow(20px 25px 16px #813c4520);transform:rotate(-8deg);transition:transform .5s}.mix-stage:hover img{transform:rotate(4deg) translateY(-8px)}.sun-disc{position:absolute;width:95%;aspect-ratio:1;top:20%;border-radius:50%;background:#fff2bf80}.mix-scribble{position:absolute;left:-8%;top:22%;font-size:38px;transform:rotate(-14deg);z-index:4}.new-label{position:absolute;right:-10%;bottom:6%;background:#ffe8a7;padding:15px 30px;z-index:4;transform:rotate(7deg);font-size:12px;box-shadow:0 8px 15px #0001}.recipe-paper{align-self:center;position:relative;background:#fffdf0;padding:38px;transform:rotate(-3deg);box-shadow:0 20px 45px #44262d18;z-index:3;margin-top:-50px}.paper-index{position:absolute;top:-17px;right:25px;background:#7c334f;color:white;padding:7px 13px;font-size:10px;letter-spacing:.1em}.recipe-paper h3{font-size:27px;margin-bottom:25px}.recipe-paper label{display:block;font-size:12px}.recipe-paper select{display:block;width:100%;padding:12px;border:0;border-bottom:1px solid #25424770;background:transparent;border-radius:0;color:#123b40;margin-bottom:20px}.recipe-fields{display:grid;grid-template-columns:90px 1fr;gap:25px}.recipe-fields label{white-space:nowrap}.recipe-fields input{width:100%;accent-color:#963657;margin-top:22px}.recipe-fields output{float:right;margin-left:5px}.recipe-output{border-top:1px dashed #123b4050;padding-top:15px}.recipe-output p{display:flex;justify-content:space-between;font-size:13px;margin:8px 0}.recipe-output strong{font-size:19px}.recipe-paper #mix-method{font-size:11px;margin:20px 0}.recipe-paper .pill{width:100%}.mix>.leaf{right:-90px;bottom:-90px;width:400px}.island{position:relative;padding:110px 6% 110px;display:grid;grid-template-columns:56% 1fr;gap:5%;background:#fff9e9;color:#123b40}.island-photo{position:relative;margin-top:65px;align-self:start}.island-photo img{width:100%;height:490px;object-fit:cover;border-radius:180px 0 0 0}.photo-caption{position:absolute;left:25px;bottom:25px;padding:8px 13px;background:#fffaf0c9;font-size:9px;letter-spacing:.14em}.island-copy{position:relative}.island-copy h2{font-size:95px;margin-left:-100px;margin-bottom:28px;position:relative;z-index:2;text-shadow:0 2px 0 #fff9e9}.island-copy h3{font-size:20px}.island-copy>p:not(.eyebrow){font-size:13px;margin-top:25px}.text-link{display:inline-block;font-size:12px;border-bottom:1px solid;margin-top:25px}footer{position:relative;padding-top:180px}.wave-art{position:absolute;top:0;left:0;width:100%;height:200px}.wave-art svg{width:100%;height:100%}.footer-inner{background:#fff6de;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:60px 6% 40px}.footer-brand{font-size:23px;font-weight:800;letter-spacing:.05em;line-height:1.3}.footer-brand span{display:block;font-size:12px;font-weight:400;letter-spacing:.35em;margin-top:10px}.footer-inner .script{font-size:40px}.footer-inner>a:last-child{font-size:12px}.fineprint{background:#fff6de;display:flex;justify-content:space-between;padding:20px 6%;font-size:10px;border-top:1px solid #123b4020;gap:20px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%) translateY(100px);padding:13px 24px;background:#123b40;color:white;border-radius:30px;z-index:90;transition:transform .3s;font-size:12px}#toast.show{transform:translateX(-50%)}dialog{border:0;background:#fff9e9;color:#123b40;padding:45px;max-width:500px;width:90%;box-shadow:0 20px 80px #0003}dialog::backdrop{background:#123b4066;backdrop-filter:blur(5px)}dialog h2{font-size:28px;margin-bottom:20px}dialog p{font-size:14px}dialog dt{font-weight:600;margin-top:15px}dialog dd{margin:0;font-size:13px}.dialog-close{position:absolute;right:15px;top:10px;border:0;background:none;font-size:30px}dialog .pill{margin-top:20px}.paused *{animation-play-state:paused!important}.paused{scroll-behavior:auto}.shift{transform:translateY(var(--shift,0px))}button,a,img{user-select:none}@keyframes float{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-16px) rotate(-3deg)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.shift{transform:none!important}}
@media(min-width:1600px){main{max-width:1800px;margin-right:auto}.hero-copy{padding-top:130px}}@media(max-width:1050px){.rail{width:70px}main{margin-left:70px}.hero{min-height:800px}.hero-copy{padding-top:100px}.hero-copy>p:not(.aloha){font-size:13px}.hero-stage{right:1%;width:52%;top:18%;height:65%}.floating-note{font-size:30px}.round-stamp{width:80px;height:80px;font-size:9px}.hero-bottom>span{display:none}.section-head .script{font-size:60px}.tea-card{flex-basis:42%}.brew{grid-template-columns:27% 1fr;padding-left:5%;padding-right:5%;gap:22px}.brew-title h2{font-size:74px}.brew-notebook{padding:30px 25px 60px}.brew-notebook h3{font-size:20px}.brew-steps{gap:12px}.recipe-paper{padding:28px}.mix-stage{min-height:530px}.mix-scribble{font-size:30px}.island-copy h2{font-size:75px}.island-photo img{height:500px}.footer-inner .script{font-size:30px}}
@media(max-width:700px){html{scroll-padding-top:85px}.rail{inset:0 0 auto;width:100%;height:70px;flex-direction:row;padding:8px 16px;gap:15px;justify-content:space-between}.brand{font-size:9px;text-align:left;padding-left:35px;position:relative}.brand span{position:absolute;left:0;top:-5px;font-size:27px}.rail nav{writing-mode:horizontal-tb;margin:0;flex-direction:row;gap:15px;letter-spacing:0;font-size:10px}.rail nav a:nth-child(4){display:none}.rail>button{margin:0;width:28px;height:28px;font-size:12px;flex-shrink:0}.rail small{display:none}main{margin:70px 0 0}.hero{height:auto;min-height:1010px;max-height:none;padding:20px 7% 90px}header{font-size:8px;letter-spacing:.12em}header a{display:none}.hero-copy{width:100%;padding-top:32px}.aloha{font-size:112px;margin-bottom:5px}.hero-copy h1{font-size:36px}.hero-copy>p:not(.aloha){font-size:12px;margin:18px 0}.hero-copy .pill{padding:10px 18px;font-size:11px}.hero-stage{top:430px;right:5%;width:90%;height:490px}.hero-stage>img{width:65%;left:18%;height:93%;top:0}.floating-note{right:0;font-size:30px;top:20px}.round-stamp{left:0;top:46%;width:75px;height:75px}.flavour-tag{bottom:4%;right:0;padding:12px 17px;max-width:220px}.flavour-tag strong{font-size:18px}.hero-bottom{bottom:22px;left:7%;right:7%;gap:8px;flex-wrap:wrap}.hero-bottom>a{font-size:9px}.tone-tabs{gap:6px}.tone-tabs button{font-size:11px;padding:7px 10px}.hero>.leaf{width:260px;left:-130px}.collection{padding:65px 6%}.section-head{display:block}.section-head .script{font-size:54px;margin-top:20px}.section-head h2{font-size:23px}.section-head>p:last-child{margin-top:20px;font-size:12px}.collection-controls{margin-top:25px;gap:3px}.filter{padding:8px;font-size:10px}.arrow{width:30px;height:30px;margin-left:3px}.tea-belt{padding:95px 12px 30px;gap:25px;min-height:510px}.tea-card{flex-basis:83%;min-width:220px;padding-top:215px}.tea-card img{height:290px}.belt-caption{font-size:8px;gap:10px}.brew{display:block;padding:60px 7% 85px}.brew-title{padding:0 0 40px}.brew-title h2{font-size:76px;line-height:.9;margin-bottom:20px}.brew-title>p:last-child{font-size:13px;margin-left:50%}.brew-notebook{padding:30px 22px 65px;transform:rotate(1.5deg)}.brew-notebook h3{font-size:20px}.brew-steps{display:block;margin-top:20px}.brew-step{position:relative;padding-left:45px;margin-bottom:22px}.brew-step b{position:absolute;left:0;top:-12px;font-size:38px}.brew-step strong{font-size:15px}.brew-step p{font-size:12px}.ingredient-note{position:relative;left:-5%;bottom:auto;width:70%;margin-top:20px;padding:15px 20px}.ingredient-note svg{display:none}.mix{display:block;padding:70px 7% 75px;min-height:0}.mix-heading .script{font-size:65px}.mix-heading h2{font-size:22px}.mix-stage{height:500px;min-height:0;margin-top:15px}.mix-stage img{height:100%;width:85%;left:7%}.mix-scribble{left:-1%;top:24%;font-size:28px}.new-label{right:-3%;bottom:7%;padding:12px 20px;font-size:11px}.recipe-paper{margin:10px 0 0;transform:rotate(-2deg);padding:30px 23px}.recipe-paper h3{font-size:24px}.island{display:flex;flex-direction:column;padding:60px 7%;gap:45px}.island-photo{margin:0}.island-photo img{height:330px;border-radius:100px 0 0 0}.island-copy h2{margin:-110px 0 25px 25px;font-size:78px;line-height:1;color:#fff9e9;text-shadow:0 2px 8px #123b40a0}.island-copy .eyebrow{margin-bottom:130px;margin-top:5px}.island-copy>p:not(.eyebrow){font-size:13px}.footer-inner{flex-wrap:wrap;padding:35px 7%;gap:25px}.footer-inner .script{font-size:32px;order:3;width:100%}.footer-brand{font-size:20px}.fineprint{padding:20px 7%;font-size:9px;flex-direction:column;gap:10px}.wave-art{height:150px}footer{padding-top:145px}dialog{padding:35px 25px}#toast{width:max-content;max-width:90%;text-align:center}.card-reveal{max-height:80px;opacity:1;padding-top:10px}}
@media(min-width:701px){.rail nav{writing-mode:horizontal-tb;gap:26px}.rail nav a{writing-mode:vertical-rl}}

[hidden]{display:none!important}.recipe-fields>*{min-width:0}.recipe-fields input{min-width:0;max-width:100%}.brew{background:color-mix(in srgb,var(--tone) 30%,#f6d99c)}.mix{background:color-mix(in srgb,var(--tone) 30%,#efc2cc)}
@media(min-width:1051px){.tea-card{flex-basis:35%}}
.recipe-fields input{display:block}.recipe-fields label{white-space:normal}#toast{visibility:hidden;opacity:0}#toast.show{visibility:visible;opacity:1}@media(max-width:700px){.island-copy h2{margin:0 0 25px;color:#123b40;text-shadow:none;font-size:64px}.island-copy .eyebrow{margin:0 0 25px}}