:root{--green:#294d3f;--lime:#dbe9a8;--paper:#f7f8f2;--muted:#7e877e}*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:#273d32;font-family:"Microsoft YaHei",sans-serif}
button,input{font:inherit}
button{cursor:pointer}header
{height:94px;max-width:1200px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 32px}.logo{display:flex;gap:12px;font-size:38px;color:var(--green);text-decoration:none;align-items:center}.logo span{font-size:23px;font-weight:800;letter-spacing:2px}.logo small{display:block;font-size:9px;letter-spacing:3px;margin-top:5px}.demo{font-size:12px;border:1px solid #d9ded1;border-radius:30px;padding:9px 15px;color:#657263}main{max-width:1200px;margin:auto;padding:0 32px}.hero{border-radius:24px;background:#e8eddd;min-height:340px;padding:40px 55px;display:flex;justify-content:space-between;overflow:hidden;position:relative}.eyebrow{font-size:11px;letter-spacing:2px;color:#748365;margin:0 0 14px}h1{font-family:Georgia,"Microsoft YaHei",serif;font-size:52px;line-height:1.2;letter-spacing:3px;margin:0 0 19px;font-weight:600}.hero p:not(.eyebrow){font-size:13px;color:#647260;line-height:1.9}.hero-label{font-size:10px;display:inline-block;margin-top:12px;border-top:1px solid #bdc9ad;padding-top:12px}.hero-art{width:40%;position:relative;display:grid;place-items:center}.big-cup{width:135px;height:205px;transform:rotate(12deg);border-radius:12px 12px 36px 36px;background:linear-gradient(0deg,#bfd18b 0%,#dfdeb3 62%,#f2edda 64%);box-shadow:22px 24px 35px #40552b24;position:relative;display:grid;place-items:center;border:3px solid #f8fae7}.big-cup:before{content:'';position:absolute;top:-12px;left:-9px;right:-9px;height:19px;border-radius:50%;background:#f7f7e8;border:2px solid #d4d9bc}.big-cup i{position:absolute;width:8px;height:65px;background:#57755c;top:-65px;left:90px;transform:rotate(-8deg)}.big-cup b{font-size:22px;line-height:1.5;letter-spacing:4px;color:#39563e}.orbit{position:absolute;font-size:10px;letter-spacing:4px;top:10px;right:0;transform:rotate(16deg)}.leaf{position:absolute;bottom:4px;left:0;font-size:70px;color:#809957}.shop{display:flex;align-items:center;gap:15px;padding:30px 0;border-bottom:1px solid #dde2d5}.shop-icon{background:#f0e9db;border:1px solid #e1d8c6;border-radius:15px;width:58px;height:58px;display:grid;place-items:center;font-size:18px;font-weight:bold;color:#403d34}.shop h2{font-size:20px;margin:0 0 8px}.shop h2 span{font-size:13px;font-weight:normal;margin-left:8px}.shop p{font-size:11px;margin:0;color:var(--muted)}.store-tag{margin-left:auto;font-size:12px;background:#e9eddf;padding:7px 13px;border-radius:6px}.menu{display:flex;gap:35px;padding-top:30px}aside{width:150px;flex-shrink:0}aside>p{font-size:10px;letter-spacing:2px;color:#8c9487}nav{display:grid;gap:8px;margin-top:24px}nav button{border:0;text-align:left;background:transparent;color:#778172;border-radius:8px;padding:12px 15px;font-size:13px}nav button.active{background:var(--green);color:white}.aside-note{margin-top:65px;font-size:12px;line-height:2;color:#8a9480}.aside-note span{font-size:10px}.menu-main{flex:1;min-width:0}.menu-top{display:flex;justify-content:space-between;align-items:center}.menu-top h2{font-size:23px;margin:0}.menu-top .eyebrow{font-size:9px;margin-bottom:8px}.search{display:flex;gap:8px;background:#fff;border:1px solid #e2e6db;padding:10px 14px;border-radius:30px}.search input{width:145px;border:0;outline:none;background:none;font-size:12px}.data-note{font-size:11px;color:#858c7f;line-height:1.8;margin:17px 0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:#fff;border:1px solid #e5e9de;border-radius:15px;overflow:hidden}.art{height:155px;background:var(--tint,#eef0df);display:grid;place-items:center;position:relative}.mini-cup{width:61px;height:91px;border-radius:5px 5px 15px 15px;background:linear-gradient(0deg,var(--drink,#c6d5a5) 73%,#f8f5e6 74%);border:2px solid #fff9;transform:rotate(-6deg);box-shadow:8px 10px 15px #34422215;display:grid;place-items:center;font-size:11px;letter-spacing:2px;color:#46513d}.mini-cup:before{content:'';position:absolute;top:-6px;width:68px;height:10px;background:#f9f7ea;border-radius:50%}.art small{position:absolute;bottom:9px;right:10px;font-size:9px;color:#8e9780}.card-body{padding:15px}.badge{font-size:9px;color:#72874f;background:#edf3e3;padding:3px 6px;border-radius:4px}.badge.reference{color:#8b8071;background:#f4f0e8}.card h3{font-size:14px;margin:10px 0;min-height:38px;line-height:1.5}.card p{font-size:10px;color:#899181}.card-bottom{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#8a9285}.add{background:var(--green);color:white;border:0;width:29px;height:29px;border-radius:50%;font-size:19px}.add:disabled{background:#c5cbbd;cursor:default}footer{text-align:center;font-size:12px;line-height:2.2;padding:55px 0 120px;color:#78836f}footer span{font-size:10px}.cart-bar{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);width:min(640px,calc(100% - 32px));padding:18px 25px;border:0;border-radius:15px;background:var(--green);color:#fff;display:flex;justify-content:space-between;box-shadow:0 10px 35px #263c3230;font-size:13px}.cart-bar b{background:var(--lime);color:var(--green);border-radius:12px;padding:2px 7px;margin:0 6px}dialog{border:0;border-radius:20px;padding:30px;width:min(520px,calc(100% - 28px));max-height:88vh;color:#273d32;box-shadow:0 20px 80px #0003}dialog::backdrop{background:#20342670;backdrop-filter:blur(4px)}.close{position:absolute;right:14px;top:12px;border:0;background:#f0f2eb;border-radius:50%;height:30px;width:30px;font-size:22px;color:#596750}dialog h2{font-size:23px;margin:12px 25px 12px 0}fieldset{border:0;border-top:1px solid #e7ebdf;padding:16px 0;margin:0}legend{font-size:13px;padding:0 5px 0 0}.options{display:flex;flex-wrap:wrap;gap:8px}.option{font-size:12px;border:1px solid #dce2d3;padding:8px 11px;border-radius:7px;cursor:pointer}.option:has(input:checked){background:#e8efd9;border-color:#66835e}.option input{accent-color:var(--green)}.info{background:#f4f6ed;padding:14px;border-radius:10px;font-size:12px;line-height:1.9;margin:15px 0}.primary{background:var(--green);color:white;padding:14px;border:0;border-radius:9px;width:100%;margin-top:15px}.cart-item{padding:17px 0;border-bottom:1px solid #e3e8dc}.cart-item h3{font-size:14px;margin:0 0 8px}.cart-item p{font-size:11px;color:#808a76;line-height:1.8}.quantity{display:flex;gap:14px;align-items:center;font-size:13px}.quantity button{border:1px solid #dce2d5;background:#f4f6ef;border-radius:6px;padding:3px 10px}.quantity .remove{margin-left:auto;background:none;border:0;color:#8e776a;font-size:11px}#toast{position:fixed;top:25px;left:50%;transform:translateX(-50%);background:#294d3f;color:white;padding:12px 22px;border-radius:12px;display:none;z-index:10;font-size:13px}#pause-message{font-size:13px;line-height:1.9;color:#537042}a{color:inherit}button:focus-visible,input:focus-visible{outline:3px solid #97b76e;outline-offset:3px}
@media(max-width:800px){.grid{grid-template-columns:repeat(2,1fr)}aside{width:115px}.hero{padding:32px}.hero-art{width:35%}.orbit{display:none}.menu{gap:20px}}@media(max-width:540px){header{height:76px;padding:0 18px}.logo span{font-size:18px}.logo{font-size:29px}.demo{font-size:9px;padding:7px 9px}main{padding:0 16px}.hero{padding:27px 23px;min-height:290px;border-radius:16px}h1{font-size:38px}.hero p:not(.eyebrow){font-size:11px}.hero .eyebrow{font-size:9px;letter-spacing:0}.hero-art{width:28%}.big-cup{width:78px;height:129px}.big-cup b{font-size:15px}.big-cup i{left:47px;height:45px;top:-45px}.leaf{font-size:38px;left:-12px;bottom:12px}.hero-label{font-size:9px}.shop{padding:22px 0;gap:11px}.shop h2{font-size:18px}.shop h2 span{font-size:11px}.shop p{font-size:9px}.store-tag{display:none}.menu{display:block;padding-top:15px}aside{width:auto}aside>p,.aside-note{display:none}nav{display:flex;overflow:auto;margin:0 0 22px;gap:6px}nav button{white-space:nowrap;padding:10px 14px}.menu-top h2{font-size:21px}.search{padding:9px 10px}.search input{width:112px;font-size:11px}.data-note{font-size:10px}.grid{gap:11px}.art{height:135px}.card-body{padding:12px}.card h3{font-size:13px}.card-bottom{font-size:10px}.cart-bar{bottom:15px}.shop-icon{width:48px;height:48px}dialog{padding:25px}}