:root{--ink:#41303f;--muted:#7d6371;--accent:#d46c91;--line:#eadfe0;--cream:#faf7f1;--wash:#f5e3eb;--tea:#f0a0b7;font-family:ui-rounded,'Hiragino Maru Gothic ProN','Trebuchet MS',sans-serif;color:var(--ink);background:var(--cream)}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.55}button:focus-visible,a:focus-visible,canvas:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button:active:not(:disabled){transform:translateY(2px)}[hidden]{display:none!important}.app{max-width:1480px;margin:auto;padding:27px 38px 15px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px}.wordmark{display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--ink);font-size:27px;font-weight:900;letter-spacing:-1.2px}.studio{margin-left:17px;font:11px 'Trebuchet MS',sans-serif;letter-spacing:1px;color:var(--muted);border-left:1px solid #d9c9cf;padding-left:21px}.logo{display:block;width:28px;height:32px;background:#ebbacb;border-radius:4px 4px 10px 10px;transform:rotate(-8deg);position:relative;margin:3px 3px 0}.logo i{position:absolute;width:4px;height:27px;left:17px;top:-10px;background:#846484;border-radius:3px;transform:rotate(13deg)}.logo b{position:absolute;left:6px;bottom:1px;font-size:18px;letter-spacing:2px}.header-actions{display:flex;gap:9px}.round{width:40px;height:40px;background:transparent;border:1px solid #e4d7db;border-radius:50%;display:grid;place-items:center}.round svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}main{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:36px;align-items:stretch}.art{position:relative;overflow:hidden;border-radius:30px;background:#edc9db;min-height:650px;height:calc(100svh - 144px);max-height:850px;isolation:isolate}.art-head{position:absolute;top:31px;left:33px;z-index:3;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2.1px;font-weight:800;color:#987185}h1{font:normal clamp(34px,3.7vw,54px)/1.05 Georgia,'Times New Roman',serif;letter-spacing:-2.4px;margin:15px 0;color:#70465e}h1 span{font-family:Georgia,serif;font-size:36px;display:inline-block;color:#fff5d2;transform:translate(7px,-7px)}.edition{position:absolute;right:27px;top:37px;display:flex;align-items:center;gap:9px;font-size:8px;font-weight:bold;letter-spacing:1.5px;color:#917b86;z-index:3}.edition i{height:1px;width:20px;background:#b294a3}#scene{display:block;width:100%;height:100%;outline-offset:-7px;touch-action:none;cursor:grab}#scene:active{cursor:grabbing}#grain{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.045;mix-blend-mode:multiply;z-index:2}.sparkle{position:absolute;z-index:3;color:#fff7e4;pointer-events:none}.one{left:21%;top:49%;font-size:38px;transform:rotate(12deg)}.two{right:14%;top:36%;font-size:24px}.three{right:24%;bottom:16%;font-size:38px}.cup-name{position:absolute;bottom:82px;left:27px;writing-mode:vertical-rl;transform:rotate(180deg);display:flex;gap:12px;font-size:9px;letter-spacing:2px;color:#88596e}.cup-name i{font:italic 12px Georgia,serif;letter-spacing:0;color:#aa8194}.gesture-hint{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);white-space:nowrap;border:1px solid #fff8;background:#fff4ee80;border-radius:30px;padding:9px 17px;font-size:10px;letter-spacing:.3px;color:#896d7a;z-index:3;pointer-events:none}.gesture-hint span{font-size:15px;margin-right:7px}.gesture-hint b{font-weight:400;margin:0 7px;color:#b69caa}#pop-word{position:absolute;top:16%;left:65%;font:bold italic 25px Georgia;color:#805167;opacity:0;transform:rotate(12deg);pointer-events:none;z-index:3}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#f1d9e7;color:#896276;z-index:5;font-size:15px}.recipe{padding:18px 0 0;display:flex;flex-direction:column}.recipe-heading h2{font:normal 29px/1.12 Georgia,serif;letter-spacing:-.8px;margin:11px 0 9px}.recipe-heading p{font-size:12px;line-height:1.65;color:var(--muted);margin:0}.recipe-step{padding-top:27px;margin-top:22px;border-top:1px solid var(--line)}.step-heading{display:flex;align-items:center;gap:9px;margin-bottom:17px}.step-no{font-size:9px;color:#ab929a;letter-spacing:1px}.step-heading h3{font-size:13px;margin:0;font-weight:800}.step-heading>span:last-child:not(.step-no){margin-left:auto;font-size:10px;color:var(--muted)}.flavours{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.flavour{padding:0;border:0;background:none;font-size:9px;display:flex;flex-direction:column;gap:9px;align-items:center}.flavour i{display:grid;place-items:center;background:var(--swatch);width:49px;height:49px;border-radius:17px;position:relative;border:3px solid var(--cream);box-shadow:0 0 0 1px transparent;transition:transform .2s,box-shadow .2s}.flavour i>span{font:normal 31px/1 Georgia,serif;color:#fff6e9;text-shadow:0 1px 2px #77442822}.flavour.selected i{box-shadow:0 0 0 1.5px var(--accent);transform:rotate(-7deg)}.flavour.selected>span{color:var(--accent);font-weight:800}.ingredients{display:grid;gap:8px}.ingredients button{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #e9dde1;background:#fffaf7;border-radius:15px;padding:11px 13px;min-height:62px;font-size:12px}.ingredients small{display:block;font-size:9px;color:#ab929a;margin-top:4px}.ingredients b{margin-left:auto;font-size:19px;font-weight:400;color:var(--accent)}.pearl-doodle{width:30px;height:30px;color:#694b57;font-size:19px;line-height:15px;letter-spacing:-5px;position:relative;padding-top:12px}.pearl-doodle i{position:absolute;left:6px;top:0;font-style:normal}.ice-doodle{font:bold 42px/25px Georgia;color:#8abcc8;width:30px;text-align:center}.fill-label{display:flex;justify-content:space-between;font-size:11px;margin:22px 0 10px}.fill-label span{color:var(--muted);font-size:10px}input[type=range]{width:100%;height:5px;accent-color:var(--accent);cursor:pointer;margin:0}.finish{margin-top:24px;padding-top:23px}.play-actions{display:flex;gap:10px}.play-actions button{flex:1;border:1px solid var(--line);border-radius:12px;background:transparent;padding:10px;font-size:12px}.play-actions span{margin-right:6px;color:var(--accent);font-size:19px;vertical-align:-1px}.sip{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--ink);color:#fff4ed;border:0;border-radius:15px;padding:16px 18px;width:100%;font-size:13px;font-weight:800;margin-top:13px;box-shadow:0 5px 0 #e5d9df;user-select:none;-webkit-user-select:none;touch-action:none}.sip svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sip-arrow{margin-left:auto;font-size:20px}.sip-note{text-align:center;font-size:10px;color:#ac959f;margin:13px 0}.recipe-footer{margin-top:auto;padding:22px 0 9px;color:#ad939c;font:italic 13px Georgia,serif;text-align:center}.recipe-footer span{font:22px Georgia;margin-right:5px}footer{display:flex;justify-content:space-between;padding-top:17px;font-size:8px;letter-spacing:1.2px;color:#b49ea6}footer span:last-child{font:italic 11px Georgia;letter-spacing:0}footer b{font-size:14px;margin-left:7px;font-weight:400;color:#c8a8b8}#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(20px);opacity:0;pointer-events:none;background:#594753;color:#fff6ee;border-radius:30px;padding:12px 20px;z-index:10;font-size:12px;transition:.25s}#toast.show{opacity:1;transform:translateX(-50%)}
@media(min-width:900px) and (max-height:780px){.app{padding-top:20px}header{margin-bottom:19px}.art{min-height:585px;height:calc(100svh - 116px)}.recipe{padding-top:7px}.recipe-step{margin-top:16px;padding-top:17px}.step-heading{margin-bottom:13px}.recipe-heading h2{font-size:27px}.fill-label{margin-top:16px}.recipe-footer{padding-top:12px}.sip{padding:13px 16px}.ingredients button{min-height:55px;padding:9px 12px}.recipe-footer{display:none}}
@media(max-width:899px){.app{padding:20px}main{grid-template-columns:minmax(0,1fr) 260px;gap:24px}.studio{display:none}.art{min-height:630px}.art-head{left:24px}.edition{display:none}.recipe-heading h2{font-size:25px}.flavour i{width:44px;height:44px}.cup-name{left:16px}}
@media(max-width:680px){.app{padding:17px 16px 12px}header{margin-bottom:19px}.wordmark{font-size:24px}.round{width:35px;height:35px}.logo{transform:rotate(-8deg) scale(.9)}main{display:flex;flex-direction:column;gap:0}.art{height:510px;min-height:0;max-height:none;border-radius:24px}.art-head{top:22px;left:23px}.eyebrow{font-size:8px;letter-spacing:1.5px}h1{font-size:34px;letter-spacing:-1.6px;margin-top:10px}h1 span{font-size:26px}.gesture-hint{font-size:9px;padding:7px 11px;bottom:15px}.cup-name{bottom:65px;font-size:8px}.cup-name i{display:none}.one{left:13%;font-size:30px}.two{right:10%}.three{right:18%;bottom:15%;font-size:29px}.recipe{padding:25px 6px 0}.recipe-heading h2{font-size:29px}.recipe-heading p{font-size:12px}.recipe-step{margin-top:20px;padding-top:20px}.flavours{gap:17px}.flavour{font-size:10px}.flavour i{width:57px;height:57px;border-radius:19px}.ingredients{grid-template-columns:1fr 1fr;gap:9px}.ingredients button{padding:10px;gap:8px;font-size:11px}.ingredients small{font-size:8px}.ingredients b{font-size:16px}.pearl-doodle,.ice-doodle{width:24px}.step-heading{margin-bottom:16px}.play-actions button{padding:12px}.sip{min-height:52px}.recipe-footer{margin-top:5px}footer span:first-child{font-size:7px}footer span:last-child{display:none}#toast{max-width:calc(100% - 30px);white-space:nowrap}#pop-word{top:17%;left:68%;font-size:21px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

@media(min-width:900px) and (max-height:780px){.recipe-step{margin-top:11px;padding-top:12px}.step-heading{margin-bottom:11px}.recipe-heading h2{font-size:25px}.recipe-heading p{font-size:11px}.ingredients button{min-height:49px;padding:8px 12px}.fill-label{margin-top:12px}.play-actions button{padding:6px}.sip{margin-top:10px;padding:11px 14px}.sip-note{margin-top:10px;margin-bottom:0}}
.preview-sip{display:none}
@media(max-width:680px){.preview-sip:not([hidden]){position:absolute;display:flex;align-items:center;gap:10px;bottom:18px;left:50%;transform:translateX(-50%);white-space:nowrap;z-index:4;border:0;border-radius:30px;padding:13px 23px;background:#594753;color:#fff4ed;font:800 12px 'Trebuchet MS',sans-serif;box-shadow:0 4px 12px #6a4d6533;touch-action:none;user-select:none}.preview-sip:active{transform:translateX(-50%) scale(.97)!important}body.has-straw .gesture-hint{display:none}}

@media(min-width:900px) and (max-height:780px){.recipe{padding-top:0}.recipe-step{margin-top:8px;padding-top:9px}.step-heading{margin-bottom:9px}.recipe-heading h2{margin:8px 0 5px}.flavour{gap:5px}.ingredients button{min-height:47px}.fill-label{margin:11px 0 4px}.sip-note{font-size:9px;margin-top:9px}.art{height:calc(100svh - 116px)}}

/* Quieter framing for the more realistic materials. */
#grain{opacity:.012}.sparkle{opacity:.45}.art-head .eyebrow{color:#725c66}h1{font-size:clamp(30px,3vw,42px)}.art{border-radius:24px}.cup-name i{display:none}

@media(min-width:900px) and (max-height:780px){.app{padding-bottom:4px}}
/* Public screenshot mode: the actual game scene, without its controls. */
body.cover .app{max-width:none;padding:0}body.cover header,body.cover aside,body.cover footer,body.cover .art-head,body.cover .edition,body.cover .sparkle,body.cover .cup-name,body.cover .gesture-hint,body.cover #pop-word,body.cover .preview-sip,body.cover #toast,body.cover .site-strip{display:none!important}body.cover main{display:block}body.cover .art{height:100svh;min-height:0;max-height:none;border-radius:0}body.cover #scene{outline:0}

.site-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;min-height:32px}.site-strip a{color:var(--ink);font-size:12px;text-decoration:none;padding:8px 0}.site-strip a:hover{text-decoration:underline}.site-strip [data-feedback-mount]{display:flex}h1 small{font:italic 16px Georgia,serif;letter-spacing:0}header{margin-bottom:20px}.app{padding-top:12px}@media(min-width:900px) and (max-height:780px){.art{height:calc(100svh - 157px);min-height:555px}.site-strip{margin-bottom:8px}header{margin-bottom:15px}}
