@import"https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@500;600;700&display=swap";:root{font-family:-apple-system,BlinkMacSystemFont,PingFang TC,sans-serif;color:#fff;background:#102e24;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 90% 0%,#26523c55,transparent 50%),#102e24}button,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,select:focus-visible{outline:3px solid #edb87a;outline-offset:4px}.app{max-width:540px;margin:auto;padding:24px 24px max(22px,env(safe-area-inset-bottom))}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.brand{font-family:"Noto Serif TC",serif;font-size:29px;letter-spacing:4px;text-decoration:none;color:#fff}.brand>span{font-size:19px;color:#d4ae78}.brand small{display:block;font:9px sans-serif;letter-spacing:3px;margin-top:5px}.edition{font-size:13px;color:#c2d0c5;letter-spacing:3px}nav{display:flex;border-bottom:1px solid #6c89775c;gap:25px}nav button{flex:1;border:0;background:none;text-align:left;color:#a6b8ab;padding:13px 0 17px;font-size:12px;position:relative}nav span{font-size:20px;margin-left:14px}nav i{float:right;font-size:20px;font-style:normal}nav button[aria-pressed=true]{color:#efbe85}nav button[aria-pressed=true]:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#da8134}.intro{margin:26px 0 21px}.eyebrow{font-size:9px;letter-spacing:2.4px;color:#cfac79}h1{font:600 clamp(25px,6.7vw,34px)/1.5 "Noto Serif TC",serif;margin:9px 0}#instruction{font-size:15px;line-height:1.7;color:#c3cfc6;margin:5px 0}.stage{height:350px;position:relative;border:1px solid #66837055;background:radial-gradient(ellipse at 50% 65%,#31574255,transparent 65%),#0a211b;border-radius:18px;overflow:hidden}.stage-top,.stage-bottom{position:absolute;left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;z-index:2;pointer-events:none}.stage-top{top:20px;font-size:13px;color:#c2cdc3}.live-dot{font-size:8px;letter-spacing:1px}.live-dot:before{content:"";display:inline-block;background:#e09e53;width:5px;height:5px;border-radius:50%;margin-right:7px}.stage-bottom{bottom:24px}#gesture{font-size:14px;color:#cad4c9}#quantity{font-size:32px;font-weight:300;font-variant-numeric:tabular-nums}#quantity span{font-size:14px;margin-left:4px;color:#b9c7bb}canvas{width:100%;height:100%;display:block}#touchZone{position:absolute;inset:46px 0 76px;width:100%;border:0;background:transparent;z-index:1}.meter{position:absolute;bottom:0;height:3px;width:100%;background:#ffffff10}.meter>div{height:100%;background:#da8134;width:100%}.actions{display:flex;gap:12px;margin-top:20px}button.primary{flex:1;border:0;border-radius:12px;background:#da8134;color:#fff;padding:18px 23px;font-size:19px;text-align:left}.primary span{float:right}.reset{border:1px solid #72917b77;border-radius:12px;background:transparent;color:#e1e8df;padding:12px 19px;font-size:18px}.reset span{font-size:16px;margin-left:6px}footer{display:flex;justify-content:space-between;color:#a6b9ad;font-size:11px;margin-top:26px;letter-spacing:.5px}.choices{display:flex;gap:15px;margin-top:17px}.choices label{flex:1;color:#c7d4ca;font-size:13px}select{display:block;width:100%;margin-top:7px;background:#1d4334;color:#fff;border:1px solid #648070;border-radius:9px;padding:12px;font-size:17px}.sensor{margin-top:15px;padding:13px;width:100%;border:1px solid #ba9465;border-radius:9px;color:#efc597;background:transparent;font-size:16px}#sensorStatus{font-size:13px;color:#c5d2c9;line-height:1.6;margin:9px 0 0}body.drink .stage{height:310px}button:active{filter:brightness(1.15)}@media(min-width:700px){.app{padding-top:38px}.stage{height:390px}body.drink .stage{height:340px}}@media(max-width:360px){.app{padding-left:17px;padding-right:17px}.stage{height:310px}footer{font-size:10px}}:root{background:#080808;color:#eee;color-scheme:dark}body{background:radial-gradient(ellipse at 65% 0%,#202020,#090909 48%,#050505)}.app{max-width:550px}.brand{font-size:25px;letter-spacing:1px}.brand>span{color:#aaa;font-weight:400;margin:0 3px}.brand small{color:#aaa;font-size:9px;letter-spacing:3.7px;margin-top:9px}.edition{font:10px monospace;letter-spacing:2px;color:#929292}nav{border-color:#383838}nav button{color:#888}nav button[aria-pressed=true]{color:#fff}nav button[aria-pressed=true]:after{background:#fff;height:1px}.eyebrow{color:#aaa;font-size:9px;letter-spacing:2px}h1{font-weight:500;letter-spacing:.5px}#instruction{color:#bdbdbd;font-size:15px}.stage{border-radius:2px;border-color:#333;background:radial-gradient(ellipse at 55% 0%,#25252580,transparent 62%),linear-gradient(115deg,#030303,#111 48%,#020202);height:375px;box-shadow:0 18px 48px #0008,inset 0 0 65px #0009}.stage:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.075;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.55' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.stage-top{color:#bbb}.live-dot{color:#909090;letter-spacing:1.5px}.live-dot:before{background:#ccc}#gesture,#quantity span{color:#b5b5b5}#quantity{font:300 34px/1.2 Georgia,serif}.meter{height:1px}.meter>div{background:#eee}button.primary{background:#ededed;color:#111;border-radius:2px;font-weight:500}.reset{background:#111;border-color:#484848;border-radius:2px;color:#eee}.choices label{color:#bbb}select{background:#111;border-color:#454545;border-radius:2px;color:#eee}.sensor{border-color:#555;border-radius:2px;color:#ddd;background:#111}#sensorStatus{color:#aaa}footer{color:#999}button:focus-visible,select:focus-visible{outline-color:#fff}#action,#touchZone{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}body.drink .stage{height:335px}button:active{filter:brightness(.85)}@media(max-width:360px){.brand{font-size:22px}.edition{font-size:9px}.stage{height:330px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
