:root{--paper:#f5eedf;--ink:#352d23;--muted:#837769;--orange:#dc5537;--line:#d8cdbb;--cream:#fffdf6;--serif:Georgia,'Times New Roman',serif;--sans:'Hiragino Kaku Gothic ProN','Noto Sans JP',Meiryo,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #366b67;outline-offset:4px}a{color:inherit;text-decoration:none}button{border:0}button:disabled{cursor:default;opacity:.4}.header{max-width:1280px;margin:auto;padding:24px 44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px;font-size:20px;font-weight:900;letter-spacing:.06em}.brand-small{display:block;font-size:8px;letter-spacing:.13em;margin-top:3px}.header nav{display:flex;gap:24px;align-items:center;font-size:12px;font-weight:700}.icon-btn{background:none;padding:8px;font-size:12px}.layout{max-width:1180px;margin:44px auto 50px;padding:0 34px;display:grid;grid-template-columns:1fr 560px;gap:66px;align-items:center}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.19em;color:#8b7052}.intro h1{font-size:clamp(42px,4.9vw,66px);font-weight:900;line-height:1.35;letter-spacing:-.045em;margin:28px 0 20px}.intro h1 span{color:var(--orange)}.lead{font-size:16px;line-height:1.9;font-weight:500;letter-spacing:.02em}.flavors{display:flex;gap:9px;margin:28px 0}.flavor{border:1px solid var(--line);background:transparent;padding:10px 14px;border-radius:30px;display:flex;gap:7px;align-items:center;font-size:12px}.flavor.selected{border-color:var(--ink);background:#fffaf0}.flavor i{width:13px;height:13px;border-radius:50%;border:1px solid #0002}.vanilla{background:#f5e1a5}.strawberry{background:#eeb0ae}.matcha{background:#a9b87a}.how-mini{display:grid;grid-template-columns:24px 1fr;align-items:center;gap:14px 10px;margin:35px 0}.how-mini p{margin:0;font-size:13px}.step-number{font:italic 16px var(--serif);color:#a28b6e}.best{padding:21px 0 17px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}.best>span:first-child{font-size:12px}.best strong{font:32px var(--serif);color:var(--orange)}.best small{font:12px var(--sans)}.best-note{font-size:10px;color:var(--muted);width:100%;margin-top:6px}.desktop-hint{font-size:10px;line-height:1.8;color:var(--muted);margin-top:18px}.game-shell{border:1px solid #cbbca6;background:#fffaf0;border-radius:24px;box-shadow:0 18px 40px #8b6c4010;overflow:hidden;position:relative}.game-top{height:80px;display:flex;justify-content:space-between;align-items:center;padding:16px 25px;background:repeating-linear-gradient(90deg,#e5a18b 0,#e5a18b 30px,#f0c8b6 30px,#f0c8b6 60px);border-bottom:1px solid #c9957b}.shop-tag{font-size:8px;font-weight:800;letter-spacing:.18em;background:#fff7e8;padding:6px 12px;border:1px solid #745444;transform:rotate(-5deg);text-align:center}.shop-tag b{font:900 21px var(--serif);letter-spacing:.06em}.height{display:flex;align-items:center;gap:13px}.height>span{font-size:10px;font-weight:700}.height strong{font:38px var(--serif);font-variant-numeric:tabular-nums}.height small{font:11px var(--sans)}.reset{background:#fff8e891;border:1px solid #74544466;width:33px;height:33px;border-radius:50%;font-size:24px;line-height:1}.canvas-wrap{position:relative;height:410px;overflow:hidden;background:#f9f3e6}.canvas-wrap canvas{width:100%;height:100%;display:block;touch-action:none}.stage-note{position:absolute;top:19px;left:10px;right:10px;text-align:center;font-size:12px;color:#87715a;pointer-events:none;letter-spacing:.05em}.corner{position:absolute;bottom:14px;font-size:7px;letter-spacing:.16em;color:#9d8c78}.corner.left{left:18px}.corner.right{right:18px}.balance{display:flex;gap:13px;align-items:center;padding:15px 24px 12px;font-size:10px;border-top:1px solid #ded3c0}.balance-track{flex:1;position:relative;height:7px;background:linear-gradient(90deg,#e9866c,#dfd6b8 25%,#dfd6b8 75%,#e9866c);border-radius:10px}.safe-zone{position:absolute;left:40%;width:20%;height:100%;background:#97aa8c;border-radius:10px}.balance-needle{position:absolute;left:50%;height:15px;top:-4px;width:3px;background:var(--ink);border:1px solid #fff;transform:translateX(-50%);border-radius:3px}.balance>span:last-child{min-width:50px;text-align:right}.controls{padding:0 20px;display:grid;grid-template-columns:1fr 135px;gap:10px}.pour{background:var(--orange);color:#fff9eb;border-radius:13px;padding:14px 10px;font-size:17px;font-weight:700;box-shadow:0 4px 0 #9e3926;touch-action:none;user-select:none;-webkit-user-select:none}.pour small{display:block;font-size:9px;font-weight:400;margin-top:5px;opacity:.85}.pour-icon{margin-right:9px}.pour.active{transform:translateY(3px);box-shadow:0 1px 0 #9e3926;background:#c2452a}.finish{border:1px solid #b4a88e;border-radius:13px;background:#fffdf7;font-size:14px;font-weight:700}.finish span{display:block;margin-top:5px;font:20px var(--serif)}.pause-note{font-size:10px;text-align:center;color:var(--muted);margin:15px 8px 17px;min-height:15px}.below{max-width:1112px;margin:0 auto 45px;border-top:1px solid var(--line);padding:27px 0 0;display:flex;justify-content:space-between;align-items:center}.below h2{font-size:18px;font-weight:700;margin:12px 0}.below p{font-size:12px;line-height:1.9;color:var(--muted)}.text-link{font-size:12px;border-bottom:1px solid var(--ink);padding-bottom:7px;white-space:nowrap}footer{padding:25px 44px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:10px;color:var(--muted);max-width:1280px;margin:auto}footer div{display:flex;gap:22px}footer button{background:none;padding:0;font-size:10px;color:inherit}dialog{border:1px solid #cbbca6;border-radius:23px;background:var(--paper);padding:27px;max-width:430px;width:calc(100% - 30px);max-height:92dvh;overflow:auto;text-align:center;color:var(--ink);box-shadow:0 20px 100px #30200e44}dialog::backdrop{background:#352d237d;backdrop-filter:blur(5px)}dialog h2{font-size:26px;margin:12px 0 7px}dialog>p:not(.eyebrow){font-size:12px;line-height:1.7}dialog .close{position:absolute;right:12px;top:9px;font-size:25px;background:none}.result-score{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#resultCard{width:100%;max-height:36dvh;object-fit:contain;border-radius:8px;margin:10px 0}.primary{display:block;width:100%;background:var(--orange);color:#fff;border-radius:9px;padding:14px;font-weight:700;font-size:14px}.share-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.share-buttons button{border:1px solid #b8aa91;background:#fff9ee;border-radius:9px;padding:12px 6px;font-size:12px}.share-status{min-height:16px;color:var(--muted);font-size:10px!important;margin-bottom:0}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 20px;border-radius:8px;font-size:12px;z-index:10;display:none;width:max-content;max-width:90vw}.document{max-width:780px;margin:45px auto 80px;padding:0 24px;line-height:1.95;font-size:14px}.document h1{font-size:32px}.document h2{font-size:20px;margin-top:35px}.document p,.document li{color:#655b4c}.document .back{display:inline-block;color:var(--orange);font-weight:700;margin-bottom:20px}.document .notice{background:#e8ddc8;border-radius:12px;padding:20px}.document button{padding:12px 18px;background:var(--ink);color:white;border-radius:8px}.ad-slot{margin:170px auto 40px;max-width:900px}
@media(min-width:1300px){.layout{margin-top:54px;margin-bottom:65px}}@media(max-width:1000px){.layout{grid-template-columns:1fr 500px;gap:30px;padding:0 26px}.intro h1{font-size:45px}.below{margin-left:26px;margin-right:26px}.flavor{padding:8px 10px}.header{padding:20px 26px}}@media(max-width:800px){.header{padding:13px 18px}.brand{font-size:16px}.brand img{width:27px;height:33px}.brand-small{font-size:6px}.header nav{gap:10px;font-size:10px}.icon-btn{font-size:10px;padding:6px}.layout{display:flex;flex-direction:column;margin:20px auto 30px;padding:0 16px;gap:17px;max-width:590px}.intro{width:100%;position:relative}.eyebrow{font-size:8px}.intro>.eyebrow{margin:0 0 5px}.intro h1{font-size:32px;line-height:1.3;margin:0;letter-spacing:-.04em}.intro h1 br{display:none}.lead{font-size:11px;margin:7px 0 0;line-height:1.6}.lead br{display:none}.how-mini,.desktop-hint{display:none}.flavors{margin:13px 0 0;gap:7px}.flavor{padding:6px 11px;font-size:10px}.flavor i{width:10px;height:10px}.best{position:absolute;right:0;bottom:0;border:0;display:block;padding:0;text-align:right}.best>span:first-child{font-size:9px;display:block}.best strong{font-size:23px}.best small{font-size:10px}.best-note{display:none}.game-shell{width:100%;border-radius:18px}.game-top{height:60px;padding:10px 17px}.shop-tag{font-size:6px;padding:4px 9px}.shop-tag b{font-size:15px}.height strong{font-size:30px}.height>span{font-size:9px}.reset{width:28px;height:28px;font-size:21px}.canvas-wrap{height:clamp(220px,36dvh,350px)}.stage-note{top:12px;font-size:11px}.balance{padding:13px 17px 10px;font-size:9px;gap:9px}.controls{padding:0 13px;grid-template-columns:1fr 105px;gap:8px}.pour{font-size:15px;padding:12px 8px}.pour small{font-size:8px}.finish{font-size:12px}.finish span{font-size:17px;margin-top:4px}.pause-note{font-size:9px;margin:12px 6px 14px}.below{display:block;margin:0 22px 30px;padding-top:24px}.below h2{font-size:17px}.below p{font-size:11px}.text-link{display:inline-block;margin-top:8px}footer{padding:20px;display:block;font-size:9px}footer div{margin-top:15px;gap:17px;flex-wrap:wrap}.document{margin-top:30px}.document h1{font-size:25px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

@media(max-width:380px){.best{position:static;display:flex;justify-content:space-between;align-items:center;text-align:left;margin-top:12px}.header nav{gap:4px}.brand{font-size:14px}.controls{grid-template-columns:minmax(0,1fr) 88px}.pour small{font-size:7px}}

.metrics-panel{max-width:1120px;margin:18px auto;padding:22px 26px;border:1px solid #d7c5ac;border-radius:12px;display:flex;align-items:center;gap:24px;background:#fffaf0;font-size:14px}.metrics-panel[hidden]{display:none}.metrics-panel p{margin:7px 0;line-height:1.65}.metrics-panel a{color:#79583a}.metrics-choices{display:flex;gap:10px;flex-shrink:0}.metrics-choices button{border:1px solid #9d8160;border-radius:8px;background:#fffdf7;color:#473828;padding:12px 18px;cursor:pointer;font:inherit;min-height:44px}.metrics-choices button:hover{background:#f1e5d0}@media(max-width:720px){.metrics-panel{margin:15px;display:block;padding:18px}.metrics-choices{margin-top:14px}.metrics-choices button{flex:1}footer div{flex-wrap:wrap}}

/* Timing-stack edition */
.header .brand-small{letter-spacing:.2em}.intro h1{line-height:1.24}.height strong b{font:inherit}.height small{margin-left:5px}.game-actions{display:flex;gap:8px}.pause-btn{font:700 15px var(--sans)}.canvas-wrap{height:430px}.canvas-wrap canvas{cursor:pointer;touch-action:manipulation}.stage-note{font-weight:700;color:#7b6a53;top:18px;letter-spacing:0}.feedback{position:absolute;top:18%;left:8px;right:8px;text-align:center;color:var(--orange);font-size:24px;font-weight:900;letter-spacing:.03em;pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .12s,transform .15s;text-shadow:0 2px #fff9e8}.feedback.visible{opacity:1;transform:translateY(0)}.feedback small{display:block;font-size:12px;color:#8c774f;margin-top:7px}.score-strip{display:flex;align-items:center;gap:22px;padding:13px 24px 16px;border-top:1px solid #ded3c0}.score-strip>div{display:flex;flex-direction:column;gap:4px}.score-strip span{font-size:9px;color:#8b765b}.score-strip strong{font:24px Georgia;font-variant-numeric:tabular-nums}.score-strip .goal{flex:1;gap:8px;text-align:center}.goal-track{height:5px;overflow:hidden;background:#e6dcc8;border-radius:5px}.goal-track i{display:block;background:#81996c;height:100%;width:0;transition:width .2s}.combo-stat{text-align:right;min-width:52px}.combo-stat strong{color:var(--orange)}.pour{touch-action:manipulation}.pour:active{transform:translateY(3px);box-shadow:0 1px 0 #9e3926}.pour:disabled{opacity:.75}.controls{grid-template-columns:minmax(0,1fr) 130px}.resume-overlay{position:absolute;inset:0;z-index:3;background:#faf4e8e8;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;backdrop-filter:blur(5px)}.resume-overlay[hidden]{display:none}.resume-overlay>span{font:42px Georgia;color:var(--orange)}.resume-overlay strong{font-size:21px}.resume-overlay small{font-size:13px}.best small{margin-left:5px}.corner{pointer-events:none}.pause-note{padding:0 7px}.controls button:focus-visible,.reset:focus-visible,.resume-overlay:focus-visible{outline:3px solid #3a6158;outline-offset:-4px}.finish:disabled{color:#9c8e78;background:#f1e9d9;opacity:.65}.game-shell .pause-note{min-height:17px}.below{margin-top:0}
@media(max-width:800px){.intro h1{font-size:31px}.intro h1 br{display:none}.intro h1 span{margin-left:.16em}.canvas-wrap{height:clamp(260px,38dvh,380px)}.score-strip{padding:10px 16px 13px;gap:16px}.score-strip strong{font-size:21px}.score-strip span{font-size:8px}.feedback{font-size:21px;top:17%}.feedback small{font-size:10px}.controls{grid-template-columns:minmax(0,1fr) 105px}.height{gap:7px}.height small{font-size:9px}.game-actions{gap:6px}.game-top{padding:10px 13px}.stage-note{font-size:10px;top:12px}.best{max-width:100px}.intro:lang(en) h1{font-size:27px}.intro:lang(en) .lead{max-width:100%}.pause-note{line-height:1.6}.below h2{line-height:1.6}}
@media(max-width:380px){.best{max-width:none}.intro:lang(en) h1{font-size:25px}.controls{grid-template-columns:minmax(0,1fr) 88px}.height>span{display:none}}
@media(prefers-reduced-motion:reduce){.feedback,.goal-track i{transition:none}}
