@font-face{font-family:DM Sans;font-style:normal;font-display:swap;font-weight:400;src:url(./dm-sans-latin-400-normal-CW0RaeGs.woff2) format("woff2"),url(./dm-sans-latin-400-normal-BwCSEQnW.woff) format("woff")}@font-face{font-family:DM Sans;font-style:normal;font-display:swap;font-weight:500;src:url(./dm-sans-latin-500-normal-B9HHJjqV.woff2) format("woff2"),url(./dm-sans-latin-500-normal-Dr3UlScf.woff) format("woff")}@font-face{font-family:DM Sans;font-style:normal;font-display:swap;font-weight:600;src:url(./dm-sans-latin-600-normal-Aqo67rzb.woff2) format("woff2"),url(./dm-sans-latin-600-normal-BmdmIIQ2.woff) format("woff")}@font-face{font-family:DM Sans;font-style:normal;font-display:swap;font-weight:700;src:url(./dm-sans-latin-700-normal-DvUfVpUG.woff2) format("woff2"),url(./dm-sans-latin-700-normal-CUSSCpQX.woff) format("woff")}@font-face{font-family:Fraunces;font-style:normal;font-display:swap;font-weight:500;src:url(./fraunces-latin-500-normal-DnGCNyPD.woff2) format("woff2"),url(./fraunces-latin-500-normal-BTR4KCeb.woff) format("woff")}@font-face{font-family:Fraunces;font-style:normal;font-display:swap;font-weight:600;src:url(./fraunces-latin-600-normal-BFCDtZfi.woff2) format("woff2"),url(./fraunces-latin-600-normal-DL5QCzvS.woff) format("woff")}:root{font-family:DM Sans,sans-serif;color:#443d37;background:#faf4e9;font-synthesis:none;--accent:#a84e3d;--muted:#786b60;--line:#d8cabe;--cream:#faf4e9}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button{transition:background .14s,color .14s,border-color .14s,transform .14s}button:active{transform:translateY(1px)}.page{position:relative;max-width:1440px;margin:auto;padding:0 48px;isolation:isolate}.page:before{content:"";position:fixed;z-index:8;pointer-events:none;inset:0;opacity:.032;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='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.header{height:92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d8cabe88}.wordmark{display:flex;gap:12px;align-items:center;font:500 23px Fraunces,serif;letter-spacing:-.7px}.jelly-logo{width:35px;height:35px;color:var(--accent);transform:rotate(-8deg)}.sound{display:flex;align-items:center;gap:9px;min-height:44px;padding:0 4px 0 12px;border:0;background:none;font-size:13px}.sound svg{width:19px;height:19px}.sound[aria-pressed=true]{color:var(--accent)}.playground{position:relative;min-height:530px;display:grid;grid-template-columns:36% 64%;align-items:center}.invitation{position:relative;z-index:2;padding:0 0 34px;pointer-events:none}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2.2px;color:var(--accent);display:flex;align-items:center;gap:9px;margin:0 0 24px}.eyebrow:before{content:"";height:5px;width:5px;flex:none;border-radius:50%;background:var(--accent)}h1{font:500 76px/.99 Fraunces,serif;letter-spacing:-4px;margin:0;max-width:440px}h1 em{font-weight:500;font-style:italic;color:var(--accent)}.intro{font-size:15px;line-height:1.8;margin:24px 0 35px;max-width:260px;color:var(--muted)}.gesture{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--muted)}.gesture svg{width:22px;height:25px;transform:rotate(-12deg)}.stage-wrap{position:relative;width:100%;height:530px;min-width:0}.stage{width:100%;height:100%;position:absolute;inset:0;touch-action:none;cursor:grab;outline-offset:-6px}.stage:active{cursor:grabbing}.stage canvas{display:block;width:100%;height:100%}.stage-horizon{position:absolute;inset:12px -35px 15px -15px;border-radius:50%;background:radial-gradient(ellipse at 50% 59%,#e9c8b780,transparent 67%);z-index:-1;pointer-events:none}.plate-caption{position:absolute;bottom:53px;left:28px;pointer-events:none;display:flex;align-items:center;gap:12px}.plate-caption:before{content:"";height:1px;width:30px;background:#c4aca0}.plate-caption .micro{font-size:8px;letter-spacing:1.7px;line-height:1.8;color:var(--muted)}.flavor-caption{font:500 18px Fraunces,serif;margin:1px 0 0}.status{position:absolute;top:58px;right:11px;display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);letter-spacing:.2px;pointer-events:none}.status-dot{width:5px;height:5px;border-radius:100%;background:#9ba186}.status[data-moving=true] .status-dot{background:var(--accent)}.squish{position:absolute;bottom:56px;right:14px;min-height:44px;display:flex;align-items:center;gap:8px;border:1px solid #d8cabe;background:#faf4e9b3;padding:0 15px;border-radius:99px;font-size:11px}.squish svg{width:15px;height:15px}.squish:hover,.reset:hover{background:#f0ded1}.controls-section{position:relative;max-width:780px;margin:0 auto}.tray{position:relative;display:grid;grid-template-columns:1.2fr 1fr auto;gap:30px;align-items:center;padding:20px 26px;background:#fffaf0e6;border:1px solid #d8cabe;border-radius:24px;box-shadow:0 8px 32px #84634908}.control-heading{font-size:10px;font-weight:500;margin:0 0 11px;letter-spacing:.2px}.flavors{display:flex;gap:6px}.flavor{min-height:44px;border:1px solid transparent;padding:0 10px 0 7px;background:transparent;display:flex;align-items:center;gap:7px;border-radius:99px;font-size:11px}.flavor[aria-pressed=true]{border-color:var(--accent);background:#f7ece1}.flavor:hover{background:#f0ded166}.swatch{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1px #443d3710}.stiffness-header{display:flex;justify-content:space-between}.stiffness-value{font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums}input[type=range]{display:block;width:100%;margin:0;height:44px;appearance:none;background:transparent;cursor:pointer;--fill:45%}input[type=range]::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,var(--accent) var(--fill),#e3d9cb var(--fill));border-radius:3px}input[type=range]::-moz-range-track{height:3px;background:#e3d9cb;border-radius:3px}input[type=range]::-moz-range-progress{height:3px;background:var(--accent)}input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:13px;margin-top:-5px;border-radius:50%;background:var(--accent);border:3px solid #fffaf0;box-shadow:0 0 0 1px var(--accent)}input[type=range]::-moz-range-thumb{width:8px;height:8px;border:3px solid #fffaf0;border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent)}.range-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;margin-top:3px}.drop{display:flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:0 25px;border:1px solid var(--accent);border-radius:99px;background:var(--accent);color:#fffaf0;font-size:13px;font-weight:500;box-shadow:0 4px 6px #a84e3d08}.drop:hover{background:#913d2e}.drop svg{width:17px;height:17px}.under-tray{display:flex;justify-content:center;align-items:center;position:relative;min-height:49px;color:var(--muted);font-size:10px;letter-spacing:.15px}.reset{position:absolute;right:13px;min-height:44px;display:flex;align-items:center;gap:5px;background:none;border:0;border-radius:99px;font-size:10px;padding:0 10px}.reset svg{width:13px;height:13px}.footer{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#817267;border-top:1px solid #d8cabe88;min-height:75px;margin-top:18px}.footer-left{display:flex;gap:8px;align-items:center}.footer-left svg{width:14px;height:14px;color:#ae7056}.footer a{color:inherit;text-decoration:none}.footer a:hover{color:var(--accent)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.fallback{padding:30px;line-height:1.8;text-align:center;position:absolute;inset:30% 0 auto}.stage-annotation{position:absolute;top:72px;left:34%;font:italic 400 14px Fraunces,serif;color:#987e6b;transform:rotate(-9deg);pointer-events:none;opacity:.8}.stage-annotation svg{position:absolute;width:30px;height:45px;top:17px;left:30px}.flavor-note{display:none}@media(min-width:1550px){.playground{min-height:630px}.stage-wrap{height:630px}.controls-section{margin-top:0}.footer{margin-top:36px}}@media(max-width:1100px)and (min-width:701px){.page{padding:0 32px}h1{font-size:65px;letter-spacing:-3px}.playground{grid-template-columns:36% 64%}.stage-wrap{height:540px}.tray{gap:20px;padding:20px}.flavor{padding:0 7px;gap:5px}.plate-caption{left:0}.squish,.status{right:0}.stage-annotation{left:25%}}@media(max-width:700px){.page{padding:0 20px}.header{height:58px}.wordmark{font-size:18px;gap:8px;letter-spacing:-.5px}.jelly-logo{width:27px;height:29px}.sound{font-size:10px;gap:6px;padding:0 0 0 10px}.sound svg{width:16px;height:16px}.playground{display:flex;flex-direction:column;align-items:stretch;min-height:0}.invitation{padding:29px 0 0}.eyebrow{font-size:8px;letter-spacing:1.8px;margin-bottom:15px;gap:7px}.eyebrow:before{height:4px;width:4px}h1{max-width:290px;font-size:40px;line-height:1.04;letter-spacing:-1.8px}.intro{font-size:14px;line-height:1.6;margin:13px 0 0;max-width:250px}.gesture{position:absolute;right:0;bottom:6px;font-size:9px;max-width:80px;gap:5px;line-height:1.4}.gesture svg{width:21px;flex:none}.stage-wrap{height:316px;margin-top:-5px}.stage-horizon{inset:-2px -20px -8px;background:radial-gradient(ellipse at 50% 62%,#e9c8b766,transparent 70%)}.status{top:19px;right:0;font-size:8px;gap:5px}.status-dot{width:4px;height:4px}.plate-caption{bottom:17px;left:0;gap:7px}.plate-caption:before{width:17px}.plate-caption .micro{font-size:6px;letter-spacing:1.2px}.flavor-caption{font-size:14px}.squish{bottom:14px;right:0;min-height:44px;padding:0 12px;font-size:9px;gap:6px}.squish svg{width:13px;height:13px}.stage-annotation{top:12px;left:29%;font-size:11px}.stage-annotation svg{width:20px;height:28px;top:11px;left:25px}.controls-section{width:100%;margin-top:4px}.tray{grid-template-columns:1fr 104px;gap:16px 22px;padding:17px 19px;border-radius:20px;box-shadow:0 6px 24px #84634908}.flavor-control{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px}.control-heading{font-size:9px;margin-bottom:8px}.flavor-control .control-heading{margin:0}.flavors{gap:3px}.flavor{min-height:44px;font-size:10px;padding:0 9px 0 7px;gap:6px}.swatch{width:13px;height:13px}.stiffness{min-width:0}.stiffness-header .control-heading{margin-bottom:5px}.stiffness-value{font-size:9px}.range-labels{font-size:8px}.drop{min-height:46px;padding:0 15px;font-size:11px;gap:9px}.drop svg{width:15px}.under-tray{font-size:9px;min-height:40px;justify-content:flex-start;padding-left:10px}.reset{right:5px;font-size:9px}.footer{min-height:55px;margin-top:8px;font-size:10px;gap:8px}.footer-left{gap:5px}.footer-left svg{width:12px;height:12px}}@media(max-width:359px){.page{padding:0 14px}.gesture{display:none}.tray{padding:15px 13px;gap:15px}.flavor{padding:0 7px}.flavors{gap:0}.intro{font-size:11px}.footer{font-size:7px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
