:root{--espresso:#583512;--mocha:#80552B;--latte:#D8C4A5;--cream:#F7F2E9;color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 56px);scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0;background:var(--latte);font-family:'Nunito Sans','Cairo',system-ui,sans-serif;color:var(--espresso)}
.menu{width:min(100%,480px);margin:0 auto;background:var(--cream)}
.page{container-type:inline-size;aspect-ratio:9/16;display:flex;flex-direction:column;align-items:center;background:var(--cream);padding-top:9cqw}
nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;display:flex;gap:8px;overflow-x:auto;padding:10px 12px;background:var(--cream);border-bottom:2px solid var(--latte)}
nav a{flex:none;text-decoration:none;font:800 14px 'Nunito',sans-serif;color:var(--espresso);background:var(--latte);padding:7px 14px;border-radius:999px}
.logo{width:84cqw;aspect-ratio:1/.76;overflow:hidden;margin-top:2cqw}
.logo img{display:block;width:150%;max-width:none;margin-left:-20%;margin-top:-10%;mix-blend-mode:multiply}
.cover .hd{margin-top:16cqw}
.hd{display:flex;align-items:center;justify-content:center;gap:4cqw}
.bean{flex:none;width:9cqw;height:9cqw}
.title{margin:0;background:var(--espresso);color:var(--cream);font:900 12.5cqw/1 'Nunito',sans-serif;letter-spacing:.04em;padding:3.4cqw 8cqw 4cqw;border-radius:999px;box-shadow:0 1.8cqw 0 var(--mocha);white-space:nowrap;position:relative}
.title.sm{font-size:9cqw;padding:2.6cqw 7cqw 3.2cqw}
.title::before{content:"";position:absolute;inset:1.2cqw;border:.5cqw dashed var(--latte);border-radius:999px}
.title span{display:inline-block}
.title span:nth-child(odd){transform:translateY(-.6cqw) rotate(-3deg)}
.title span:nth-child(even){transform:translateY(.6cqw) rotate(3deg)}
.tag{margin:12cqw 12cqw 0;text-align:center;font:800 5.6cqw/1.3 'Nunito',sans-serif;color:var(--mocha)}
ul{list-style:none;margin:8cqw 0 0;padding:0 9cqw;width:100%;font-family:'Cairo','Nunito Sans',sans-serif}
li{display:flex;align-items:baseline;padding:1.5cqw 0}
li .n{font-weight:700;font-size:5cqw;line-height:1.5}
li i{flex:1;border-bottom:.6cqw dotted var(--latte);margin:0 2.5cqw;transform:translateY(-1.2cqw)}
li b{font:900 5.4cqw 'Nunito','Cairo',sans-serif;color:var(--espresso);direction:rtl}
.ft{margin-top:auto;width:100%;min-height:26cqw;background:var(--latte);border-radius:9cqw 9cqw 0 0;display:flex;align-items:center;justify-content:center;gap:3cqw;padding:0 6cqw}
ul{margin-bottom:9cqw}
.ft p{margin:0;font:800 4.6cqw 'Nunito',sans-serif;text-align:center}
.ft .bean{width:8cqw;height:8cqw}

/* ===== replaces former inline styles ===== */
.sprite{position:absolute}
.bean{color:var(--mocha)}
.bean-l{transform:rotate(-30deg)}
.bean-r{transform:rotate(30deg)}
.bean-fl{transform:rotate(-20deg)}
.bean-fr{transform:rotate(20deg)}