:root{--paper:#f5ecd9;--ink:#343d31;--muted:#858271;--red:#ad452f;--green:#546a42;--line:#dcd3be}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;background-image:radial-gradient(#837b5d12 .65px,transparent .65px);background-size:5px 5px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #729058;outline-offset:5px}button:disabled{cursor:default;opacity:.52}header{max-width:1200px;margin:auto;height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 36px;border-bottom:1px solid var(--line)}.brand{text-decoration:none;color:var(--ink);font-family:Georgia,serif;font-weight:bold;font-size:27px;letter-spacing:-1.3px;display:flex;align-items:center}.brand-icon{font-family:serif;display:grid;place-items:center;width:38px;height:38px;margin-right:10px;background:var(--red);border-radius:50%;color:var(--paper);font-size:26px;font-weight:normal}.brand-dot{color:var(--red)}.header-note{font-size:9px;letter-spacing:2px;color:var(--muted)}.round{border:1px solid var(--line);border-radius:30px;background:transparent;padding:7px 13px;color:var(--ink);font-size:19px}.round span{font:10px system-ui;color:var(--muted)}main{max-width:1050px;margin:auto;padding:0 32px}.intro{text-align:center;padding:37px 0 29px}.eyebrow{font-size:9px;font-weight:650;letter-spacing:2.5px;color:var(--red)}.eyebrow span{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--red);margin-right:6px;vertical-align:middle}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(38px,5vw,60px);font-weight:400;letter-spacing:-2.8px;line-height:1.12;margin:13px 0}h1 em{color:var(--red);font-weight:400}.intro p{font-size:13px;color:var(--muted);margin:13px 0 0}.game{background:#faf5e9;border:1px solid #d2c5a9;border-radius:18px;box-shadow:0 16px 45px #6250390b;overflow:hidden;position:relative}.game-top{height:78px;display:flex;justify-content:space-between;align-items:center;padding:0 28px;border-bottom:1px solid var(--line);background:#fffaf0}.open-sign{font-size:9px;letter-spacing:1.5px;color:var(--muted);display:flex;align-items:center;gap:8px}.open-sign>span:first-child{width:6px;height:6px;background:#baab8a;border-radius:50%}.playing .open-sign>span:first-child{background:var(--green);box-shadow:0 0 0 4px #546a4212}.stats{display:flex;gap:42px}.stats>div{display:flex;flex-direction:column;text-align:center;min-width:80px}.stat-label{font-size:8px;letter-spacing:1.7px;color:var(--muted);margin-bottom:3px}.stats strong{font:23px Georgia,serif;font-variant-numeric:tabular-nums}.stats small{font-size:15px;color:var(--muted)}.pause{border:1px solid var(--line);background:transparent;border-radius:8px;color:var(--ink);height:34px;width:34px;font-weight:bold}.play-area{display:grid;grid-template-columns:53% 47%;min-height:416px}.illustration{position:relative;overflow:hidden;background:#e9e4cd;background-image:linear-gradient(90deg,#d6d0b030 1px,transparent 1px);background-size:55px 100%;border-right:1px solid var(--line);display:flex;align-items:flex-end;justify-content:center;padding-bottom:30px}.illustration:after{position:absolute;content:"";bottom:0;width:100%;height:25px;background:#ede2c7;border-top:1px solid #dccbac}.samovar{position:relative;z-index:1;width:100%;max-width:490px;height:auto;margin-bottom:-4px}.window{position:absolute;left:36px;top:32px;width:100px;height:121px;border:7px solid #c1b89a;box-shadow:0 5px 0 #aca080;border-radius:50px 50px 0 0;background:#cbd4c7;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;transform:rotate(-3deg)}.window i{border:2px solid #c1b89a;background:linear-gradient(145deg,#dde2cd88,#aabfb922)}.window span{position:absolute;top:40px;left:14px;color:#f5f2de;font-size:33px}.hanging-note{position:absolute;right:27px;top:36px;font:italic 17px Georgia,serif;color:#7a775d;padding:8px 0;border-top:1px solid #aaa484;border-bottom:1px solid #aaa484;transform:rotate(5deg)}.scene-caption{position:absolute;bottom:6px;left:20px;right:20px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:1.2px;z-index:2;color:#928169}.scene-caption span{font:italic 10px Georgia,serif;letter-spacing:0}.service{padding:28px 30px 24px;display:flex;flex-direction:column;gap:19px}.meter-label{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1.6px}.meter-label strong{font:27px Georgia,serif;letter-spacing:-1px}.thermometer{height:10px;border-radius:6px;background:#e8dfcb;position:relative;margin:12px 0 8px}.ideal-zone{position:absolute;left:62.5%;width:16.6667%;height:10px;background:#bac69e}.ideal-zone:after{content:"";position:absolute;inset:-3px;border:1px dashed #7e9161;border-radius:4px}#heat-fill{height:100%;width:48.333%;background:#c18d54;border-radius:6px;opacity:.5;transition:width .12s}#heat-needle{position:absolute;left:48.333%;width:3px;height:18px;top:-4px;background:#675539;border-radius:2px;transition:left .12s}.meter-scale{display:flex;justify-content:space-between;font-size:8px;color:var(--muted)}.meter-scale span:nth-child(2){color:var(--green)}.water{display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1px}.water strong{font-size:12px}.water #water-drops{display:flex;gap:7px}.drop{display:block;width:10px;height:13px;border-radius:70% 40% 65% 50%;transform:rotate(-35deg);background:#8ca4a0;border:1px solid #7a9490}.drop.empty{background:transparent;border-color:#d7d6c4}.order{border:1px solid var(--line);border-radius:12px;background:#fffaf0;padding:20px;flex:1;min-height:225px;position:relative}.order-tag{font-size:8px;letter-spacing:1.7px;color:var(--muted)}h2{font-family:Georgia,serif;font-size:26px;font-weight:400;line-height:1.22;letter-spacing:-.6px;margin:10px 0}.welcome p{font-size:11px;line-height:1.7;color:var(--muted);max-width:250px;margin:12px 0 18px}.start{border:0;border-radius:8px;background:var(--red);padding:13px 16px;color:#fff3dc;display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;font-size:12px;transition:background .15s,transform .15s}.start:hover{background:#903923;transform:translateY(-1px)}.start span{font-size:18px}.welcome-note{display:block;font-size:8px;text-align:center;color:#a39880;margin-top:9px}.order-top{display:flex;justify-content:space-between;align-items:center}.combo{color:var(--red);font-size:11px;font-weight:600}.customer-title{display:flex;gap:12px;align-items:center;margin:17px 0}.avatar{width:58px;height:58px;background:#eae9d7;border:1px solid #dedec4;border-radius:50%;display:grid;place-items:center;font-size:35px;flex-shrink:0}.customer-title h2{font-size:22px;margin:0 0 5px}.customer-title p{font:italic 12px/1.4 Georgia,serif;color:var(--muted);margin:0}.cups{display:flex;gap:8px;margin:16px 0 20px}.tea-cup{font-size:25px;filter:grayscale(1);opacity:.25;position:relative}.tea-cup.filled{filter:none;opacity:1}.tea-cup.filled:after{content:"✓";position:absolute;color:var(--green);right:-3px;top:-6px;font:700 15px system-ui}.patience-label{display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}.patience{height:5px;background:#e9e2d3;margin-top:8px;border-radius:5px;overflow:hidden}#patience-fill{height:100%;background:#879868;width:100%;transition:width .12s}.controls{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:12px;padding:20px 25px;background:#fffaf0;border-top:1px solid var(--line)}.controls button{background:#f3ebd8;border:1px solid #d5c6a7;border-radius:10px;display:flex;align-items:center;gap:11px;padding:13px 14px;text-align:left;color:var(--ink);transition:transform .1s,background .1s}.controls button:not(:disabled):hover{background:#e9dec5;transform:translateY(-2px)}.controls button:not(:disabled):active{transform:translateY(1px)}.controls .pour-button{background:var(--green);border-color:var(--green);color:#fff7e4}.controls .pour-button:not(:disabled):hover{background:#405630}.controls strong{display:block;font-size:11px;font-weight:600}.controls small{display:block;font-size:8px;opacity:.65;margin-top:3px}.control-icon{font-size:25px;line-height:1}.controls kbd{margin-left:auto;font:8px system-ui;border:1px solid currentColor;border-radius:3px;opacity:.4;padding:2px 4px}.message-bar{display:flex;gap:9px;align-items:center;justify-content:center;background:#efe6d2;border-top:1px solid #e1d6bf;padding:10px 15px;font-size:10px;color:#8b7c61;min-height:36px}.message-icon{color:#ad7953}.how-to{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding:25px 22px 32px}.how-to>div{display:flex;gap:12px;align-items:center}.how-to>div>span{font:italic 26px Georgia,serif;color:#b7ab92}.how-to p{margin:0;color:var(--muted);font-size:10px;line-height:1.9}.how-to strong{font-weight:500;color:#5c6151}footer{max-width:1128px;margin:0 auto;padding:23px 0 30px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#98917d;font-size:8px;letter-spacing:.6px}footer i{color:var(--red);font-style:normal}.result{text-align:center}.result-score{font:44px Georgia,serif;color:var(--red);margin:4px 0}.result p{font-size:11px;color:var(--muted);margin:8px 0}.result .start{margin-top:16px}.reaction{position:absolute;top:48%;left:44%;z-index:4;font:24px Georgia,serif;color:var(--green);pointer-events:none}.reaction.pop{animation:pop 1s ease-out forwards}.steam{opacity:.3}.playing .steam{opacity:.9}.steam path{animation:steam 3s infinite ease-in-out}.steam path:nth-child(2){animation-delay:-1s}.steam path:nth-child(3){animation-delay:-2s}.fire{opacity:.45;transform-origin:250px 327px}.playing .fire{animation:fire .7s infinite alternate;opacity:.85}.pause-overlay{position:absolute;inset:0;background:#f5ecd9e8;backdrop-filter:blur(6px);z-index:6;display:grid;place-items:center;text-align:center;padding:30px}.pause-overlay>div{width:280px}.pause-overlay h2{font-size:42px;margin:18px 0}.pause-overlay p{color:var(--muted);font-size:13px;margin-bottom:24px}[hidden]{display:none!important}.low-time{color:var(--red)!important}.shake{animation:shake .3s ease-in-out}@keyframes steam{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-12px);opacity:.9}}@keyframes fire{to{transform:scale(.9,1.12)}}@keyframes pop{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-65px);opacity:0}}@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}@media(max-width:800px){header{height:74px;padding:0 22px}.header-note{display:none}.intro{padding:26px 0}.game-top{padding:0 18px;height:68px}.stats{gap:16px}.stats>div{min-width:65px}.open-sign{font-size:7px;letter-spacing:.6px}.service{padding:22px 20px}.hanging-note{right:15px;font-size:14px}.window{left:15px;width:75px;height:100px}.controls{gap:8px;padding:15px}.controls button{padding:11px 9px;gap:8px}.controls kbd{display:none}.control-icon{font-size:21px}.controls strong{font-size:10px}footer{margin:0 25px;gap:20px}footer>span:nth-child(2){display:none}}@media(max-width:560px){main{padding:0 14px}.brand{font-size:24px}.intro h1{font-size:42px;letter-spacing:-2px}.intro p{font-size:11px;max-width:260px;margin:12px auto 0}.game{border-radius:13px}.game-top{height:64px;padding:0 14px}.open-sign{display:none}.stats{gap:20px}.stats strong{font-size:22px}.stat-label{font-size:7px}.stats>div{min-width:54px}.play-area{grid-template-columns:1fr;min-height:0}.illustration{height:230px;border-right:0;border-bottom:1px solid var(--line);padding:0}.samovar{width:285px;position:absolute;bottom:-9px;left:50%;transform:translateX(-50%)}.scene-caption{bottom:5px;font-size:6px}.window{top:20px;left:24px;height:100px;width:75px}.hanging-note{top:30px;right:22px;font-size:13px}.illustration:after{height:21px}.service{padding:18px 20px;gap:12px}.temperature{margin-bottom:1px}.meter-label strong{font-size:23px}.thermometer{margin-top:7px}.water{margin:0}.order{min-height:0;padding:17px}.welcome h2{font-size:25px;margin:9px 0}.welcome h2 br{display:none}.welcome p{margin:10px 0 14px;max-width:none}.welcome-note{display:none}.customer-title{margin:12px 0}.avatar{width:45px;height:45px;font-size:28px}.customer-title h2{font-size:22px}.cups{margin:8px 0 10px}.tea-cup{font-size:23px}.controls{padding:12px 10px;gap:6px;grid-template-columns:1fr 1.1fr 1fr}.controls button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;padding:11px 3px;min-height:78px}.controls small{font-size:7px}.controls strong{font-size:9px}.message-bar{font-size:9px;min-height:45px;text-align:center;padding:9px 14px}.how-to{gap:12px;padding:22px 8px}.how-to>div{flex-direction:column;gap:3px;align-items:flex-start}.how-to>div>span{font-size:22px}.how-to p{font-size:8px}.reaction{top:40%;left:52%}.result-score{font-size:37px}.result h2{font-size:25px}footer{font-size:7px;padding-top:18px}.best-stat{display:flex}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
