:root{--paper: #f1f2f4;--ink: #161c2c;--muted: #5d6577;--hair: #c9ced8;--tekhelet: #2a4a9e;--serif: "Spectral", "David Libre", "Iowan Old Style", Georgia, serif;--mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;--gutter: clamp(16px, 5vw, 72px);--measure: 1240px;--slate: #16181e;--slate-ink: #d6dae3;--slate-muted: #6f7787;--slate-hair: #2c303b;--slate-blue: #8fa9f0}@media(prefers-color-scheme:dark){:root{--paper: #0e1322;--ink: #e3e7ef;--muted: #98a1b5;--hair: #2a3350;--tekhelet: #8fa9f0}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-weight:300;font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:var(--hair)}a:hover{color:var(--tekhelet);text-decoration-color:currentColor}:focus-visible{outline:2px solid var(--tekhelet);outline-offset:3px}img{display:block;max-width:100%;height:auto}.bd-calm img,.verso--book.bd-calm img.back-photo{filter:saturate(.5) contrast(.88) brightness(1.04) sepia(.12)}h1,h3{margin:0;font-weight:300}.langs{position:absolute;top:10px;right:10px;z-index:2;color:var(--muted);font-size:.85rem}.langs>button{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:none;color:inherit;cursor:pointer;transition:color .2s}.langs>button:hover,.langs>button[aria-expanded=true]{color:var(--ink)}.langs svg{fill:none;stroke:currentColor;stroke-width:1}.langs nav{position:absolute;top:calc(100% + 6px);right:0;display:grid;gap:.35em;padding:.7em 1em;background:var(--paper);border:1px solid var(--hair);white-space:nowrap;text-align:right;visibility:hidden;clip-path:inset(0 0 100% 0);transform:translateY(-6px);transition:clip-path .35s cubic-bezier(.2,.7,.2,1),transform .35s cubic-bezier(.2,.7,.2,1),visibility 0s .35s}.langs>button[aria-expanded=true]+nav{visibility:visible;clip-path:inset(0 0 0 0);transform:none;transition-delay:0s}@media(prefers-reduced-motion:reduce){.langs nav{transition:none}}.langs nav button{padding:0;border:0;background:none;color:inherit;font:inherit;text-align:inherit;cursor:pointer}.langs [aria-current]{color:var(--ink)}.hero{padding-bottom:clamp(56px,10vw,128px)}.hero-text{display:grid;gap:.6em 4rem;align-items:baseline}@media(min-width:880px){.hero-text{grid-template-columns:1fr 1fr}}.hero h1{--name: .8;font-size:calc(var(--name) * clamp(2.2rem,4.6vw,3.6rem));line-height:1.05;letter-spacing:-.01em;color:var(--muted)}.hero h1:lang(he){--name: 1}.hero-text p{max-width:32em;margin:0;color:var(--muted)}.abyme{display:none}main{max-width:var(--measure);margin:0 auto;padding:0 var(--gutter) clamp(80px,12vw,160px)}.field{padding-block:clamp(56px,10vw,128px) 0}.works{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));column-gap:clamp(24px,3vw,48px);row-gap:clamp(40px,5vw,64px);margin:0;padding:0;list-style:none}.work{display:grid;min-width:0;grid-row:span 2;grid-template-rows:subgrid;row-gap:0}.work-body{grid-row:2;padding-top:18px;text-align:center}.works:not(:has(.plate)) .work-body{padding-top:0}.verso{display:none}@media(hover:hover){.work{grid-row:span 1;grid-template-rows:auto}.work>*{grid-area:1 / 1}.work-body{z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1em;text-shadow:0 0 4px var(--paper),0 0 10px var(--paper);opacity:0;transition:opacity .2s ease;pointer-events:none}.work-body a{pointer-events:auto}.work:is(.turned,:focus-within) .work-body{opacity:1;transition-delay:.45s}.work:has(.plate--code:focus-within) .work-body{opacity:0}.work.work--back .work-body{opacity:0}.work{--flip: var(--lit, 0)}.work:is(.turned,:focus-within){--flip: 1}.work:has(.plate--code:focus-within){--flip: 0}.plate,.verso,.spine{backface-visibility:hidden;transition:transform 1s cubic-bezier(.45,.05,.25,1)}.plate{transform:perspective(900px) rotateY(calc(var(--flip) * 180deg)) translateZ(calc(var(--depth, 0px) / 2))}.verso{display:grid;place-items:center;container-type:size;transform:perspective(900px) rotateY(calc(var(--flip) * 180deg - 180deg)) translateZ(calc(var(--depth, 0px) / 2))}.plate--ink{backface-visibility:visible}.plate--ink img{opacity:calc(1 - .9 * var(--flip));transition:opacity 1s ease}.work:has(.verso--code) .work-body{--paper: var(--slate);--muted: var(--slate-muted);--tekhelet: var(--slate-blue);color:var(--slate-ink)}.work:has(.plate--ink) .work-body{--muted: var(--tekhelet);color:var(--tekhelet)}@media(prefers-reduced-motion:reduce){.plate,.verso,.spine,.plate--ink img{transition:none}}}.spine{display:none}.verso--book img.back-photo{inset:0;width:100%;height:100%;opacity:1;filter:none;transform:none}.verso-face{position:relative;display:block}.verso--book .verso-face{width:min(100cqw,100cqh * var(--ratio));aspect-ratio:var(--ratio);overflow:hidden;border-radius:3px 1px 1px 3px;background:var(--paper);box-shadow:var(--lift)}.verso--rtl .verso-face{border-radius:1px 3px 3px 1px}.bubble{display:none}.verso--book img{position:absolute;inset:-15%;width:130%;max-width:none;height:130%;object-fit:cover;opacity:.5;filter:blur(14px) saturate(1.2);transform:scaleX(-1)}.verso--book .barcode{position:absolute;right:9%;bottom:6%;width:28%;aspect-ratio:1.6;padding:4% 5% 9%;background:repeating-linear-gradient(90deg,#111 0 1px,transparent 1px 3px,#111 3px 5px,transparent 5px 6px,#111 6px 7px,transparent 7px 10px,#111 10px 13px,transparent 13px 14px) content-box,#fff;box-shadow:0 0 0 1px #0000001a}.verso--hung{align-items:center}.verso--hung .verso-face{width:100%;padding:var(--frame);background:var(--grain-h),linear-gradient(#0000001f,#0000001f),var(--walnut);box-shadow:inset 0 0 0 1px #0000004d,0 2px 3px #00000024,0 14px 28px -12px #0006}.verso--hung .canvas{--pine: #c6a572;display:block;aspect-ratio:var(--ratio);background:linear-gradient(90deg,transparent 46%,var(--pine) 46% 54%,transparent 54%),linear-gradient(transparent 44%,var(--pine) 44% 56%,transparent 56%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='l'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.28 0 0 0 0 0.18 0 0 0 0.55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23l)'/%3E%3C/svg%3E"),#dccfb3;box-shadow:inset 0 0 0 7px var(--pine),inset 0 0 0 8px #0000002e,inset 0 0 14px 8px #0000001f}:is(.plate--hung,.verso--hung) .hanger{--ring-y: 30%;--peak-y: -15%;--brass: linear-gradient(135deg, #f3dc95, #c9a14a 45%, #8a6424);position:absolute;inset:0;pointer-events:none}.plate--hung .hanger{clip-path:inset(-80px -20px 100% -20px)}.hanger .d-ring{position:absolute;top:var(--ring-y);left:calc(var(--frame) / 2);width:7px;height:9px;border:1.5px solid #b48c3c;border-left:0;border-radius:0 50% 50% 0;transform:translate(-1px,-50%);filter:drop-shadow(0 1px .5px rgb(0 0 0 / .45))}.hanger .d-ring--right{left:auto;right:calc(var(--frame) / 2);border-left:1.5px solid #b48c3c;border-right:0;border-radius:50% 0 0 50%;transform:translate(1px,-50%)}.hanger .d-ring:before{content:"";position:absolute;top:-1.5px;left:-2.5px;width:4px;height:12px;border-radius:1.5px;background:radial-gradient(circle at 50% 72%,#5b4319 0 .9px,transparent 1.3px),var(--brass);box-shadow:0 0 0 .5px #00000059}.hanger .d-ring--right:before{left:auto;right:-2.5px}.hanger .wire{position:absolute;top:var(--peak-y);left:calc(var(--frame) / 2 + 4px);width:calc(100% - var(--frame) - 8px);height:calc(var(--ring-y) - var(--peak-y));overflow:visible;filter:drop-shadow(0 1.5px .6px rgb(0 0 0 / .35))}.hanger .wire path{fill:none;stroke:#8a9198;stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke}.hanger .wire .wire-twist{stroke:#ffffff8c;stroke-width:.6;stroke-dasharray:.8 1}.hanger .hook{position:absolute;top:var(--peak-y);left:50%;width:8px;height:11px;border-radius:4px 4px 1.5px 1.5px;background:radial-gradient(circle at 45% 30%,#fff3c4 0 .6px,#6b5020 1px 1.6px,transparent 2px),var(--brass);box-shadow:inset 0 0 0 .5px #00000059,1px 2px 2px #00000080;transform:translate(-50%,-9.5px)}.hanger .hook:after{content:"";position:absolute;left:-1px;bottom:-3px;width:10px;height:5px;border:1.8px solid #b08a3a;border-top:0;border-radius:0 0 4px 4px}.verso--code{border:1px solid var(--slate-hair);border-radius:4px;background:var(--slate);cursor:text}.chords{display:none}@media(hover:hover)and (min-width:760px){main{max-width:none;padding:0}.ring{--tile: 17cqmin;--edge: 2cqmin;--inset: calc(var(--edge) + var(--tile));position:relative;height:100svh;padding:0;container-type:size}.ring .hero{position:absolute;top:50%;left:50%;z-index:1;width:52cqmin;aspect-ratio:1;display:grid;place-items:center;padding:0;border-radius:50%;background:radial-gradient(closest-side,var(--paper) 62%,transparent);transform:translate(-50%,-50%);text-align:center}.ring .hero-text{grid-template-columns:none;gap:.25em;justify-items:center}.ring .hero h1{font-size:calc(var(--name) * 4cqmin);text-wrap:balance}.ring .hero-text p{font-size:max(15px,2cqmin)}.ring .hero-text{grid-template-rows:1fr auto 1fr;height:100%}.ring .hero h1{align-self:end}.ring .hero-text p{align-self:start}.ring .abyme{--s: .26;--zoom: calc(3 * var(--s));display:block;position:relative;width:calc(var(--s) * 100cqw);height:calc(var(--s) * 100cqh);--flip: 0}.ring .abyme:is(.turned,:focus-visible){--flip: 1}.ring .abyme:is(:link,:visited,:hover){color:inherit;text-decoration:none}.abyme-picture,.abyme-url{position:absolute;inset:0;transition:transform 1s cubic-bezier(.45,.05,.25,1)}.abyme-picture{overflow:hidden;background:var(--paper);transform:perspective(900px) rotateY(calc(var(--flip) * 180deg))}.abyme-picture>.ring{opacity:calc(1 - .6 * var(--flip));transition:opacity 1s ease}.abyme-url{display:grid;place-items:center;color:var(--tekhelet);font-size:.9rem;text-shadow:0 0 4px var(--paper),0 0 10px var(--paper);backface-visibility:hidden;transform:perspective(900px) rotateY(calc(var(--flip) * 180deg - 180deg))}.abyme-picture>.ring{position:absolute;top:0;left:0;width:100cqw;height:100cqh;transform:scale(var(--s));transform-origin:0 0}.chords{display:block;position:absolute;top:var(--inset);left:var(--inset);width:calc(100% - 2 * var(--inset));height:calc(100% - 2 * var(--inset));overflow:visible}.chord{stroke:var(--tekhelet);stroke-opacity:calc(.5 + .5 * var(--lit, 0));stroke-width:calc((1px + 1px * var(--lit, 0)) / var(--zoom, 1));vector-effect:non-scaling-stroke;transition:stroke-opacity .2s ease,stroke-width .2s ease}.ring .works{display:block;position:absolute;inset:0}.ring .work{--out: calc(var(--tile) * var(--reach));position:absolute;left:calc(50% + var(--cos) * (50% - var(--inset) + var(--out)) - var(--tile) * var(--w) / 2);top:calc(50% + var(--sin) * (50% - var(--inset) + var(--out)) - var(--tile) * var(--h) / 2);width:calc(var(--tile) * var(--w));height:calc(var(--tile) * var(--h));grid-template-rows:100%}.ring .plate{height:100%;aspect-ratio:auto}.ring .work-body{opacity:var(--lit, 0);padding:.5em}.ring .work h3{font-size:clamp(.95rem,1.6cqmin,1.15rem)}.ring .work-body .where{font-size:.72rem;line-height:1.35}.ring .bubble{--gap: 14px;--pop: .94;display:block;position:absolute;z-index:5;left:50%;top:50%;border-radius:3px 1px 1px 3px;overflow:hidden;box-shadow:0 18px 40px -14px #0009;transform:translate(calc(-50% - var(--cos) * (50% + var(--tile) * var(--w) / 2 + var(--gap))),calc(-50% - var(--sin) * (50% + var(--tile) * var(--h) / 2 + var(--gap)))) scale(var(--pop));opacity:0;visibility:hidden;transition:opacity .25s ease,transform .25s ease,visibility 0s linear .25s}.ring .bubble--rtl{border-radius:1px 3px 3px 1px}.ring .bubble img{display:block;width:auto;max-width:min(560px,60vw);height:auto;max-height:min(520px,60vh)}.ring .work:is(.turned,:focus-within) .bubble{--pop: 1;opacity:1;visibility:visible;transition:opacity .45s ease .7s,transform .45s cubic-bezier(.2,.7,.3,1) .7s,visibility 0s linear .7s}.ring .work{--depth: calc(var(--tile) * var(--w) * var(--thick, 0))}.ring .spine{display:flex;justify-content:center;transform:perspective(900px) rotateY(calc(var(--flip) * 180deg)) translate(-50%) rotateY(-90deg)}.ring .spine img{width:var(--depth);max-width:none;height:100%}.ring .plate--code{padding:3%;font-size:.72rem}.ring .work{animation:come-in 1.6s cubic-bezier(.16,1,.3,1) backwards paused;animation-delay:calc(var(--at, 0ms) - var(--since, 0ms))}.chord{animation:draw .9s ease-in-out backwards paused;animation-delay:calc(var(--at, 0ms) + .32s - var(--since, 0ms))}.ring.ready :is(.work,.chord){animation-play-state:running}@keyframes come-in{0%{opacity:0;scale:.86;translate:calc(var(--cos) * var(--tile) * -.25) calc(var(--sin) * var(--tile) * -.25)}}@keyframes draw{0%{stroke-dasharray:calc(var(--len) * 1px) calc(var(--len) * 1px);stroke-dashoffset:calc(var(--from, 1) * var(--len) * 1px)}to{stroke-dasharray:calc(var(--len) * 1px) calc(var(--len) * 1px);stroke-dashoffset:0}}@media(prefers-reduced-motion:reduce){.ring .work,.chord{animation:none}}}.plate{margin:0;aspect-ratio:1}.plate a{display:block;height:100%}.plate img{width:100%;height:100%;object-fit:contain}.plate--book,.verso--book{--x: 1;--lift: 0 10px 18px -8px rgb(0 0 0 / .35)}.plate--rtl,.verso--book{--x: -1}.verso--rtl{--x: 1}.bubble{--x: -1}.bubble--rtl{--x: 1}.plate--book{display:grid;place-items:center;container-type:size}.plate--book a{position:relative;width:min(100cqw,100cqh * var(--ratio));height:auto;aspect-ratio:var(--ratio);border-radius:1px 3px 3px 1px;box-shadow:var(--lift)}.plate--rtl a{border-radius:3px 1px 1px 3px}.plate--book img{border-radius:inherit;object-fit:cover}.plate--book a:after,.verso--book .verso-face:after,.bubble:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(calc(var(--x) * 90deg),rgb(0 0 0 / .28),rgb(255 255 255 / .2) 1.2%,rgb(0 0 0 / .22) 2.8%,rgb(255 255 255 / .14) 3.8%,transparent 7%),linear-gradient(115deg,rgb(255 255 255 / .12),transparent 35%);box-shadow:inset 0 0 0 1px #00000014;pointer-events:none}.plate--hung{display:flex;align-items:center}.plate--hung,.verso--hung{--frame: 13px;--walnut: #563a29;--grain-h: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='60'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.003 0.18' numOctaves='4' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.07 0 0 0 0 0.03 2.6 0 0 0 -1.05'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");--grain-v: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='1600'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.18 0.003' numOctaves='4' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.07 0 0 0 0 0.03 2.6 0 0 0 -1.05'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}.plate--hung a{position:relative;isolation:isolate;width:100%;height:auto;padding:var(--frame);--profile: rgb(0 0 0 / .3) 0, rgb(0 0 0 / .12) 13%, rgb(255 228 190 / .2) 24%, rgb(0 0 0 / .04) 46%, rgb(0 0 0 / .36) 70%, rgb(255 228 190 / .1) 82%, rgb(255 228 190 / .34) 87% 91%, rgb(0 0 0 / .6) 91%;background:linear-gradient(to bottom,var(--profile)) top / 100% var(--frame) no-repeat,linear-gradient(to top,var(--profile)) bottom / 100% var(--frame) no-repeat,var(--grain-h),linear-gradient(#ffe4be29 50%,#0000005c 50%),var(--walnut);box-shadow:0 0 0 1px #0000008c,0 2px 3px #0003,0 14px 28px -12px #00000080}.plate--hung a:before,.plate--hung a:after{content:"";position:absolute;inset:0;z-index:-1;background:var(--moulding),var(--grain-v),linear-gradient(var(--shade),var(--shade)),var(--walnut)}.plate--hung a:before{--moulding: linear-gradient(to right, var(--profile)) left / var(--frame) 100% no-repeat;--shade: rgb(255 228 190 / .1);clip-path:polygon(0 0,var(--frame) var(--frame),var(--frame) calc(100% - var(--frame)),0 100%)}.plate--hung a:after{--moulding: linear-gradient(to left, var(--profile)) right / var(--frame) 100% no-repeat;--shade: rgb(0 0 0 / .3);clip-path:polygon(100% 0,100% 100%,calc(100% - var(--frame)) calc(100% - var(--frame)),calc(100% - var(--frame)) var(--frame))}.plate--hung img{height:auto}.plate--hung .sight{position:absolute;inset:var(--frame);box-shadow:inset 0 0 0 1px #0000008c,inset 3px 4px 5px -1px #00000080;pointer-events:none}.plate--code{--ink: var(--slate-ink);--muted: var(--slate-muted);--hair: var(--slate-hair);--tekhelet: var(--slate-blue);display:flex;flex-direction:column;min-width:0;overflow:hidden;padding:8% 8% 7%;border:1px solid var(--hair);border-radius:4px;background:var(--slate);color:var(--ink);font-family:var(--mono);font-weight:300;font-size:clamp(.8rem,1.15vw,.95rem);cursor:text}.plate--code:focus-within{border-color:var(--tekhelet)}.plate--code pre{flex:1;display:flex;flex-direction:column;min-width:0;margin:0;font:inherit}.plate--code .klipse-snippet{flex:1}.plate--code .CodeMirror{height:100%;border:0;background:transparent;color:var(--ink);font:inherit;line-height:1.6}.plate--code .CodeMirror-cursor{border-left-color:var(--ink)}.plate--code .CodeMirror-selected{background:var(--hair)!important}.plate--code .cm-s-default span{color:inherit}.plate--code .cm-s-default .cm-comment{color:var(--muted)}.plate--code .cm-s-default .cm-keyword{color:#c79bea}.plate--code .cm-s-default .cm-number{color:#eea476}.plate--code .cm-s-default .cm-operator{color:#89d4f0}.plate--code .klipse-result{padding-top:.9em;border-top:1px solid var(--hair)}.plate--code .klipse-result .CodeMirror{height:auto;color:var(--tekhelet)}.plate--code .klipse-result .cm-s-default span{color:var(--tekhelet)}@media(prefers-color-scheme:dark){.plate--ink img{filter:invert(1) hue-rotate(180deg)}}.work h3{font-size:1.4rem;font-weight:400;line-height:1.25}.work-body p{max-width:30em;margin:.4em auto 0}.work-body a{text-decoration:none}.work-body .where{margin-top:.1em;color:var(--muted);font-size:.9rem}
