:root{--size:220px;--liquid-color-1:#f7b733;--liquid-color-2:#ff6b6b}.jar-wrap{width:var(--size);height:calc(var(--size)*1.2);justify-content:center;align-items:flex-end;display:flex}.jar{background:linear-gradient(#ffffff0f 0%,#ffffff05 45%,#ffffff03 55%,#ffffff05 100%),linear-gradient(#e6f0ff26,#c3dcff12);border:1px solid #82a0c82e;border-radius:24%/18%;width:55%;height:72%;position:relative;box-shadow:inset 0 2px 12px #ffffff0d}:root:not(.dark) .jar{border:2px solid #384e6e59;box-shadow:inset 0 2px 12px #ffffff0d,0 2px 8px #00000014}.jar:before{content:"";background:linear-gradient(#f6f6f6,#e8e8e8);border:1px solid #82a0c829;border-radius:10px;width:78%;height:16%;position:absolute;top:-12%;left:50%;transform:translate(-50%)}:root:not(.dark) .jar:before{border:1.5px solid #5064824d}.jar:after{content:"";opacity:.6;filter:blur(.6px);background:linear-gradient(#ffffffe6,#fff9);border-radius:6px;width:64%;height:8%;position:absolute;top:-6%;left:50%;transform:translate(-50%)}.highlight{opacity:.9;background:linear-gradient(#ffffffa6,#ffffff0f);border-radius:50%/60%;width:28%;height:38%;position:absolute;top:6%;left:8%;transform:rotate(-12deg)}.liquid{background:linear-gradient(180deg,var(--liquid-color-1),var(--liquid-color-2));border-radius:12%/10%;height:46%;animation:6s ease-in-out infinite slosh;position:absolute;bottom:8%;left:3%;right:3%}:root:not(.dark) .liquid{border:1px solid #00000014}.label{letter-spacing:.06em;color:#313131;background:#ffffffe6;border-radius:6px;justify-content:center;align-items:center;width:56%;height:18%;font-weight:800;display:flex;position:absolute;bottom:30%;left:50%;transform:translate(-50%)}.label small{color:#666;font-size:.6em;display:block}.lid{background:linear-gradient(#f2e0b8,#d0b573);border-radius:8px;width:84%;height:18%;position:absolute;top:-18%;left:50%;transform:translate(-50%)}:root:not(.dark) .lid{border:1.5px solid #64503240;box-shadow:0 1px 3px #0000001a}.ground{background:radial-gradient(#0000002e 0%,#00000005 60%,#0000 100%);border-radius:50%;width:70%;height:6%;position:absolute;bottom:-6%;left:50%;transform:translate(-50%)}.jar-paper-stack{--paper-color:#fff8dc;flex-direction:column;align-items:center;gap:0;width:70%;display:flex;position:absolute;bottom:8%;left:50%;transform:translate(-50%)}.jar-paper-stack .paper{z-index:1;margin-top:-20px;margin-left:10px}.jar-paper-stack .paper:first-child{margin-left:0}.paper{background:var(--paper-color,#fffdf7);opacity:.85;border-radius:4px;width:80%;height:26px;box-shadow:0 1px 2px #00000014}.paper.second{opacity:.9;height:30px;margin-left:20px;transform:rotate(-20deg)}.paper.small{opacity:.9;height:25px;margin-right:10px;transform:rotate(8deg)}.paper.medium{height:30px;margin-right:6px}:root:not(.dark) .paper{border:1px solid #50505026;box-shadow:0 1px 2px #0000001f}@keyframes slosh{0%{transform:translateY(0)rotate(0)}25%{transform:translateY(-1%)rotate(-1.2deg)}50%{transform:translateY(0)rotate(.6deg)}75%{transform:translateY(-.8%)rotate(-.6deg)}to{transform:translateY(0)rotate(0)}}
.jar-message{letter-spacing:.06em;color:#3c3c3c;background:#fff8dc;border-radius:6px;justify-content:center;align-items:center;width:65%;height:18%;font-weight:700;transition:transform .2s ease-in-out;display:flex;position:absolute;bottom:50%;left:50%;box-shadow:0 1px #0000001a,inset 0 -6px 12px #00000005}:root:not(.dark) .jar-message{border:1.5px solid #46464649;box-shadow:0 1px #0000001a,inset 0 -6px 12px #0000000a,0 1px 3px #00000014}