:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#faf7f1;--paper:#fff;--ink:#23201b;--muted:#6f675c;--line:#e7e0d4;--soft:#f2ede4;--accent:#c4532f;--accent-ink:#fff;--radius:14px;--serif:"Fraunces", Georgia, "Times New Roman", serif;--sans:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.5}a{color:inherit}button{font:inherit;color:inherit}.top{justify-content:space-between;align-items:center;max-width:1180px;margin:0 auto;padding:22px 24px 0;display:flex}.brand{font-family:var(--serif);letter-spacing:-.01em;align-items:center;gap:10px;font-size:21px;font-weight:600;text-decoration:none;display:inline-flex}.brand img{width:28px;height:28px}main{max-width:1180px;margin:0 auto;padding:0 24px 80px}.home h1{font-family:var(--serif);letter-spacing:-.02em;margin:44px 0 28px;font-size:clamp(34px,5vw,52px);font-weight:500;line-height:1.05}.grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:28px 24px;display:grid}.card{border-radius:var(--radius);text-decoration:none;display:block}.card .pic{aspect-ratio:16/10;border-radius:var(--radius);background:var(--soft);position:relative;overflow:hidden}.card .pic img{object-fit:cover;width:100%;height:100%;transition:transform .5s cubic-bezier(.2,.7,.2,1);display:block}.card:hover .pic img{transform:scale(1.035)}.card .play{background:#ffffffeb;border-radius:50%;place-items:center;width:40px;height:40px;display:grid;position:absolute;bottom:12px;right:12px;box-shadow:0 2px 10px #281e141f}.card h2{font-family:var(--serif);letter-spacing:-.01em;margin:14px 0 2px;font-size:22px;font-weight:500}.card p{color:var(--muted);margin:0;font-size:14.5px}.card:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.back{color:var(--muted);margin:26px 0 0;font-size:14.5px;text-decoration:none;display:inline-block}.back:hover{color:var(--ink)}.recipe h1{font-family:var(--serif);letter-spacing:-.02em;margin:10px 0 4px;font-size:clamp(32px,4.6vw,48px);font-weight:500;line-height:1.08}.meta{color:var(--muted);margin:0 0 22px}.player{background:var(--paper);border:1px solid var(--line);border-radius:calc(var(--radius) + 4px);padding:10px;box-shadow:inset 0 1px #fffc,0 10px 30px -18px #3c2d1940}.screen{aspect-ratio:16/9;border-radius:var(--radius);background:#efe9df;position:relative;overflow:hidden}.screen canvas{cursor:pointer;width:100%;height:100%;display:block;position:absolute;inset:0}.badge{opacity:0;pointer-events:none;background:#ffffffeb;border-radius:999px;align-items:center;gap:6px;padding:6px 12px 6px 10px;font-size:14px;font-weight:600;transition:opacity .25s,transform .25s;display:flex;position:absolute;top:14px;left:14px;transform:translateY(-4px);box-shadow:0 2px 10px #281e141f}.badge.on{opacity:1;transform:none}.big-play{cursor:pointer;background:#fffffff0;border:0;border-radius:50%;place-items:center;width:76px;height:76px;margin:-38px 0 0 -38px;transition:opacity .2s,transform .2s;display:grid;position:absolute;top:50%;left:50%;box-shadow:0 6px 24px #281e142e}.big-play svg{width:30px;height:30px;margin-left:4px}.big-play.hide{opacity:0;pointer-events:none;transform:scale(.9)}.loading{color:var(--muted);place-items:center;font-size:15px;display:grid;position:absolute;inset:0}.caption{align-items:flex-start;gap:14px;min-height:74px;padding:16px 8px 6px;display:flex}.caption .num{background:var(--accent);width:34px;height:34px;color:var(--accent-ink);border-radius:50%;flex:none;place-items:center;margin-top:1px;font-size:15px;font-weight:600;display:grid}.caption p{font-family:var(--serif);letter-spacing:-.005em;margin:0;font-size:clamp(19px,2.2vw,23px);line-height:1.35}.controls{align-items:center;gap:6px;padding:6px 4px 4px;display:flex}.icon-btn{cursor:pointer;background:0 0;border:0;border-radius:50%;flex:none;place-items:center;width:42px;height:42px;display:grid}.icon-btn:hover{background:var(--soft)}.icon-btn.main{background:var(--ink);color:#fff}.icon-btn.main:hover{background:#000}.icon-btn svg{width:20px;height:20px}.icon-btn:focus-visible,.seg:focus-visible,.steps li button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.segments{flex:1;gap:4px;margin:0 10px;display:flex}.seg{cursor:pointer;background:0 0;border:0;flex:1;align-items:center;height:22px;padding:0;display:flex}.seg i{background:var(--line);border-radius:3px;width:100%;height:5px;display:block;position:relative;overflow:hidden}.seg i b{background:var(--accent);width:0;position:absolute;inset:0}.seg:hover i{background:#ddd3c3}.count{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;margin-right:4px;font-size:14px}.speed{border:1px solid var(--line);cursor:pointer;font-variant-numeric:tabular-nums;background:0 0;border-radius:999px;padding:4px 10px;font-size:13.5px;font-weight:600}.speed:hover{background:var(--soft)}.details{grid-template-columns:minmax(240px,1fr) 2fr;gap:40px;margin-top:40px;display:grid}.details h2{font-family:var(--serif);margin:0 0 12px;font-size:24px;font-weight:500}.ingredients ul{margin:0;padding:0;list-style:none}.ingredients li{border-bottom:1px solid var(--line);padding:10px 0}.steps ol{counter-reset:s;margin:0;padding:0;list-style:none}.steps li button{text-align:left;cursor:pointer;background:0 0;border:0;border-radius:12px;align-items:flex-start;gap:14px;width:100%;padding:12px;display:flex}.steps li button:hover{background:var(--soft)}.steps li .n{border:1.5px solid var(--line);width:28px;height:28px;color:var(--muted);border-radius:50%;flex:none;place-items:center;font-size:13.5px;font-weight:600;display:grid}.steps li.done .n{background:var(--soft);border-color:var(--soft)}.steps li.active button{background:#fbefe9}.steps li.active .n{background:var(--accent);border-color:var(--accent);color:#fff}.steps li span.t{padding-top:2px}.keys{color:var(--muted);margin-top:28px;font-size:13.5px}kbd{font-family:var(--sans);border:1px solid var(--line);background:var(--paper);border-bottom-width:2px;border-radius:5px;padding:1px 6px;font-size:12px}.notfound{padding:80px 0}body.shot .top,body.shot .back,body.shot h1,body.shot .meta,body.shot .caption,body.shot .controls,body.shot .details{display:none}body.shot .player{border:0;padding:0}body.shot .screen{aspect-ratio:auto;border-radius:0;position:fixed;inset:0}@media (width<=760px){.top{padding:16px 16px 0}main{padding:0 16px 60px}.grid{grid-template-columns:1fr}.player{margin:0 -6px;padding:6px}.screen{aspect-ratio:4/3}.details{grid-template-columns:1fr;gap:28px}.count{display:none}.segments{margin:0 4px}.keys{display:none}}
