@property --sky-cell{syntax:"<length>";inherits:true;initial-value:30px}.sky{touch-action:manipulation;-webkit-tap-highlight-color:transparent;width:100%;container-type:inline-size}.sky-in{grid-template-columns:minmax(0,1fr);justify-items:center;gap:16px;display:grid}.sky-plate{--sky-rcw:calc(var(--sky-rc) * 1ch + 22px);--sky-cell:clamp(22px, calc((100cqw - var(--sky-rcw) - 10px) / var(--sky-w)), var(--sky-max));grid-template-columns:var(--sky-rcw) auto;font-family:var(--mono);font-variant-numeric:tabular-nums;grid-template-rows:auto auto;font-size:12px;font-weight:500;line-height:1;display:grid}@container (min-width:640px){.sky-in{grid-template-columns:auto minmax(220px,260px);justify-content:center;place-items:start stretch;gap:18px 36px}.sky-plate{--sky-cell:clamp(22px, calc((100cqw - 300px - var(--sky-rcw)) / var(--sky-w)), var(--sky-max));font-size:13px}}.sky-corner{grid-area:1/1}.sky-cols{grid-area:1/2;grid-template-columns:repeat(var(--sky-w), var(--sky-cell));margin-bottom:8px;padding:0 1px;display:grid}.sky-col{min-height:calc(var(--sky-cc) * 1.34em + 8px);color:var(--bone);flex-direction:column;justify-content:flex-end;align-items:center;gap:.34em;padding-bottom:7px;display:flex}.sky-rows{grid-area:2/1;grid-template-rows:repeat(var(--sky-h), var(--sky-cell));margin-right:8px;padding:1px 0;display:grid}.sky-row{color:var(--bone);white-space:nowrap;justify-content:flex-end;align-items:center;gap:1ch;padding-right:8px;display:flex}.sky-col[data-state=done],.sky-row[data-state=done]{color:var(--bone-3)}.sky-col[data-state=off],.sky-row[data-state=off]{color:var(--signal)}.sky-col[data-lit]{box-shadow:inset 0 -2px 0 var(--bone)}.sky-row[data-lit]{box-shadow:inset -2px 0 0 var(--bone)}.sky-grid{grid-area:2/2;grid-template-columns:repeat(var(--sky-w), var(--sky-cell));grid-template-rows:repeat(var(--sky-h), var(--sky-cell));border:1px solid var(--bone-2);outline:1px solid var(--bone-4);outline-offset:3px;background:var(--ink);cursor:crosshair;touch-action:none;-webkit-touch-callout:none;display:grid}.sky-grid:focus-visible{outline:1px solid var(--bone-4);outline-offset:3px}.sky-grid[data-keys],.sky-grid[data-keys]:focus-visible{outline-color:var(--signal)}.sky-grid[aria-disabled]{cursor:default}.sky-line{display:contents}.sky-cell{border-right:1px solid var(--bone-4);border-bottom:1px solid var(--bone-4);position:relative}.sky-cell[data-r5]{border-right-color:var(--bone-3)}.sky-cell[data-b5]{border-bottom-color:var(--bone-3)}.sky-cell[data-re]{border-right:0}.sky-cell[data-be]{border-bottom:0}.sky-cell[data-m="1"]:before,.sky-glyph[data-m="1"]{content:"";background:var(--bone);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}.sky-cell[data-m="1"]:before{position:absolute;inset:8%}.sky-cell[data-m="2"]:before,.sky-glyph[data-m="2"]{content:"";background:var(--bone-3);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 1L9 9M9 1L1 9' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 1L9 9M9 1L1 9' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E") 50%/contain no-repeat}.sky-glyph[data-m="2"]{background:currentColor}.sky-cell[data-m="2"]:before{position:absolute;inset:33%}@media (hover:hover){.sky-grid:not([aria-disabled]) .sky-cell:hover:after{content:"";border:1px solid var(--bone-3);position:absolute;inset:2px}}.sky-grid[data-keys] .sky-cell[data-cursor]:after{content:"";border:1px solid var(--signal);position:absolute;inset:2px}.sky[data-done] .sky-cell[data-m="2"]:before{opacity:0;transition:opacity .24s steps(3,end)}.sky[data-done] .sky-cell[data-m="1"]:before{animation:.38s step-end both sky-light;animation-delay:var(--sky-d,0s)}@keyframes sky-light{0%{background:var(--bone);transform:scale(1)}15%{background:var(--signal);transform:scale(1.25)}65%{background:var(--signal);transform:scale(1)}to{background:var(--bone);transform:scale(1)}}@media (prefers-reduced-motion:reduce){.sky[data-done] .sky-cell[data-m="1"]:before{animation:none}}.sky-tools{align-content:start;gap:10px;width:100%;max-width:420px;display:grid}.sky-voice{font-family:var(--serif);letter-spacing:-.01em;color:var(--bone-2);margin:0;font-size:17px;font-style:italic;line-height:1.3}.sky-modes,.sky-acts{gap:6px;display:flex}.sky-mode,.sky-act{flex:1;gap:8px;min-height:38px;padding:0 10px}.sky-mode[aria-pressed=true]{border-color:var(--signal);color:var(--signal);box-shadow:inset 0 0 0 1px var(--signal)}.sky-glyph{width:13px;height:13px;display:inline-block}.sky-mode[aria-pressed=true] .sky-glyph[data-m="1"]{background:var(--signal)}.sky-status{white-space:nowrap;text-overflow:ellipsis;min-height:1.5em;margin:0;overflow:hidden}.sky-help{color:var(--bone-2);margin:0;font-size:12px;line-height:1.45}.sky-keys{display:none}@container (min-width:640px){.sky-keys{display:inline}}
.stew{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:start;gap:16px 22px;width:100%;display:grid}.stew-notes ol{gap:4px;margin:8px 0 0;padding:0;list-style:none;display:grid}.stew-notes li{border:1px solid var(--bone-4);justify-content:space-between;align-items:center;gap:12px;padding:5px 8px;display:flex}.stew-notes li[data-wrong]{border-color:var(--signal);box-shadow:inset 2px 0 0 var(--signal)}.stew-row{gap:4px;display:flex}.stew-pips{gap:3px;font-size:15px;line-height:1;display:inline-flex}.stew-pips b{color:var(--bone);font-weight:400}.stew-pips i{color:var(--bone-2);font-style:normal}.stew-jar{border:1px solid var(--bone-2);width:34px;height:34px;font-family:var(--mono);letter-spacing:.04em;color:var(--bone);place-items:center;font-size:12px;font-weight:600;display:inline-grid}.stew-jar[data-small]{width:26px;height:26px;font-size:10.5px}.stew-kitchen{align-content:start;gap:8px;display:grid}.stew-pantry-head{justify-content:space-between;align-items:center;display:flex}.stew-pencil{min-height:30px;padding:0 10px}.stew-pencil[aria-pressed=true]{color:var(--signal)}.stew-pantry{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px;display:grid}.stew-item{border:1px solid var(--bone-4);background:var(--ink);color:inherit;font:inherit;text-align:left;cursor:pointer;grid-template-columns:auto 1fr;align-items:center;gap:8px;padding:6px 8px;display:grid}.stew-item:hover:not([disabled]){border-color:var(--bone-2)}.stew-item[data-used]{opacity:.4}.stew-item[data-struck] .stew-jar{color:var(--bone-3);border-color:var(--bone-4);background-image:linear-gradient(to top right, transparent calc(50% - 1px), var(--signal) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px))}.stew-item[data-struck] .label{text-decoration:line-through}.stew-pot{gap:8px;display:flex}.stew-slot{border:1px dashed var(--bone-3);background:var(--ink);cursor:pointer;place-items:center;width:52px;height:52px;padding:0;display:grid}.stew-slot[data-full]{border-style:solid;border-color:var(--bone)}.stew-slot .stew-jar{border:0}.stew-foot{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px;margin-top:4px;display:grid}.stew-foot>.label{align-items:center;min-height:2.8em;display:flex}.stew-notes{grid-area:1/1}.stew-help{border:1px solid var(--bone-4);color:var(--bone-2);grid-area:2/1;gap:6px;padding:10px 12px;font-size:12.5px;line-height:1.45;display:grid}.stew-help p,.stew-help ul{margin:0}.stew-help ul{gap:3px;padding-left:1.1em;display:grid}.stew-example{align-items:center;gap:12px;display:flex}.stew-kitchen{grid-area:1/2/span 2}.stew-steps{gap:4px;margin-top:8px;padding:0 9px;display:flex}.stew-steps>span:not(.stew-steps-what){text-align:center;width:26px}.stew-steps-what{margin-left:4px}.stew-notes .stew-steps+ol{margin-top:2px}.stew-marks{white-space:nowrap;align-items:center;gap:8px;display:inline-flex}.stew-yours{color:var(--signal);align-items:center;gap:3px;font-size:15px;line-height:1;display:inline-flex}.stew-yours b,.stew-yours i{font-style:normal;font-weight:400}.stew-yours .label{color:var(--signal)}@media (max-width:760px){.stew{grid-template-columns:minmax(0,1fr)}.stew-notes,.stew-help,.stew-kitchen{grid-area:auto/1}}@media (max-width:380px){.stew-yours>.label:first-child{display:none}}
