:root{--bg: #0d1117;--panel: #161b22;--panel-2: #1c2230;--fg: #e7edf3;--muted: #8b97a6;--writer: #ffd43b;--cloud: #4dabf7;--reader: #9775fa;--wire: #6b7785;--cell: clamp(96px, 11vw, 138px);--cell-sm: var(--cell);--ice-body: calc(2 * var(--cell-sm) + .7rem);font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);line-height:1.5}#app{max-width:1200px;margin:0 auto;padding:1.5rem 1.25rem 2rem}body.hide-header .intro,body.hide-controls .controls{display:none}body.hide-header.hide-controls #app{padding:2.5rem 1rem 1.5rem}.intro .crumb{margin:0 0 .4rem;font-size:.78rem}.intro .crumb a{color:var(--muted);text-decoration:none}.intro .crumb a:hover{color:var(--cloud)}.intro h1{margin:0 0 .3rem;font-size:1.5rem}.intro-body{display:grid;grid-template-columns:1fr 1fr;column-gap:2rem;align-items:start}.intro summary{list-style:none;cursor:pointer}.intro summary::-webkit-details-marker{display:none}.intro summary h1{display:inline-block}.intro-hint{display:none;color:var(--reader);font-size:.8rem;font-weight:600}.intro-hint:after{content:"▾ Tap to read how this works"}.intro[open] .intro-hint:after{content:"▴ Tap to hide"}@media(min-width:761px){.intro summary{pointer-events:none}}.intro p{margin:0 0 .75rem;color:var(--muted);font-size:.9rem;max-width:70ch}.contrast{margin:0 0 1.25rem;padding-left:1.1rem;max-width:70ch;color:var(--muted);font-size:.9rem}.contrast li{margin-bottom:.35rem}.contrast li strong:first-child{color:var(--fg)}.ink-writer{color:var(--writer)}.ink-cloud{color:var(--cloud)}.ink-reader{color:var(--reader)}.intro .hl{color:var(--fg)}.stage{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(2rem,6vw,5rem)}.wires{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}.wires path{fill:none;stroke:var(--wire);stroke-width:2}.wires marker path{fill:var(--wire);stroke:none}h2{margin:0 0 .5rem;font-size:.95rem;display:flex;align-items:center;gap:.4rem}h3,.commit-label,.store-name{font-size:.66rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.view{display:block;margin-inline:auto;width:var(--cell);height:var(--cell);border-radius:8px;background:#1b2530}.actor{text-align:center}.actor.writer h2{justify-content:center}.readers{display:flex;flex-direction:column;gap:1.5rem;position:relative;z-index:3}.reader-row{display:flex;align-items:center;gap:.9rem}.reader-frame{position:relative;width:var(--cell);height:var(--cell)}.read-ghost{position:absolute;top:0;right:0;bottom:0;left:0;width:var(--cell);height:var(--cell);border-radius:8px;pointer-events:none;opacity:0}.analysis{text-align:left}.analysis .q{font-size:.68rem;color:var(--muted);max-width:8ch;margin-bottom:.25rem}.analysis .a{font-size:1.4rem;font-weight:800;color:var(--fg)}.analysis .a.unknown{color:var(--muted)}.cloud{position:relative;border:2.5px solid var(--cloud);border-radius:18px;padding:1.6rem 1.4rem 1rem;display:flex;flex-direction:column;gap:1rem}.cloud-label{position:absolute;top:-.85rem;left:50%;transform:translate(-50%);background:var(--bg);padding:0 .6rem;color:var(--cloud);font-weight:700;font-size:.95rem}.cloud-row{display:flex;justify-content:center}.store{text-align:center}.store-name{display:inline-flex;align-items:center;gap:.4rem;margin-bottom:.4rem}.tag{font-size:.56rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:.12rem .4rem;border-radius:999px}.tag-zarr,.tag-icechunk{background:#ffffff12;color:var(--muted)}.commits{display:flex;align-items:flex-start;gap:.7rem;width:var(--ice-body);position:relative}.commit-flash{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.6);font-size:1.4rem;font-weight:800;color:var(--writer);letter-spacing:.04em;background:#0d1117eb;padding:.25rem .7rem;border-radius:999px;border:1px solid color-mix(in srgb,var(--writer) 55%,transparent);box-shadow:0 0 14px #ffd43b73;pointer-events:none;opacity:0;z-index:10;white-space:nowrap}.commit-flash.flashing{animation:commit-flash 1.4s ease forwards}@keyframes commit-flash{0%{transform:translate(-50%,-50%) scale(.6);opacity:0}12%{transform:translate(-50%,calc(-50% - .4rem)) scale(1.2);opacity:1}22%{transform:translate(-50%,calc(-50% - .7rem)) scale(1);opacity:1}to{transform:translate(-50%,calc(-50% - 3rem)) scale(1);opacity:0}}.commit{display:flex;flex-direction:column;align-items:center;gap:.3rem;width:var(--cell-sm)}.commit-label{white-space:nowrap;font-variant-numeric:tabular-nums}.commit .view{width:var(--cell-sm);height:var(--cell-sm)}.commit-label{color:var(--muted)}.commit-main .commit-label{color:var(--fg)}.commit-stack{position:relative}.commit-stack .view{position:relative;z-index:2}.commit-stack .commit-label{position:relative;z-index:3}.stack-layer{position:absolute;left:0;bottom:0;width:var(--cell-sm);height:var(--cell-sm);border-radius:8px;outline:1px solid rgba(255,255,255,.25)}.stack-layer.l1{transform:translate(4px,-5px);z-index:1;opacity:.5}.stack-layer.l2{transform:translate(8px,-10px);z-index:0;opacity:.32}.commit-label em{font-style:normal;font-weight:800}.commit-session{position:relative}.commit-session .view{outline:2px dashed color-mix(in srgb,var(--writer) 60%,transparent);outline-offset:-2px;opacity:.6}.commit-session:after{content:"";position:absolute;inset:auto 0 0 0;height:var(--cell-sm);border-radius:8px;pointer-events:none;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.08) 0,rgba(255,255,255,.08) 2px,transparent 2px,transparent 7px)}.promote-ghost{position:absolute;left:0;bottom:0;width:var(--cell-sm);height:var(--cell-sm);border-radius:8px;pointer-events:none;opacity:0;z-index:3}.promote-ghost.promoting{animation:promote .5s ease}@keyframes promote{0%{transform:translate(0);opacity:1}85%{opacity:1}to{transform:translate(calc(var(--cell-sm) + .7rem));opacity:0}}.controls{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1.75rem;padding:.8rem 1rem;background:var(--panel);border-radius:12px;font-size:.85rem}.controls button{background:var(--reader);color:#06231b;border:0;border-radius:8px;padding:.45rem .9rem;font-size:.85rem;font-weight:700;cursor:pointer}.controls button:hover{filter:brightness(1.08)}.controls label{display:flex;align-items:center;gap:.45rem;color:var(--muted)}.controls input[type=range]{accent-color:var(--cloud)}.controls select{background:var(--panel-2, #1b2530);color:inherit;border:1px solid rgba(255,255,255,.18);border-radius:6px;padding:.25rem .4rem;font:inherit}.controls-right{display:flex;align-items:center;gap:1rem;margin-left:auto}#chunksLabel{display:inline-block;width:3.2em;text-align:left;font-variant-numeric:tabular-nums}@media(max-width:760px){:root{--cell: clamp(96px, min(40vw, (100vh - 30rem) / 4), 132px)}.intro .intro-hint{display:block;margin-top:.15rem}.intro-body{grid-template-columns:1fr}.intro h1{font-size:1.2rem}.intro p,.contrast{font-size:.78rem}.intro p{margin-bottom:.5rem}.contrast{margin-bottom:.8rem}.stage{grid-template-columns:1fr;gap:1.75rem;justify-items:center}.cloud{flex-direction:row;align-items:stretch;justify-content:center;gap:1rem;padding:1.4rem .9rem .9rem}.store{display:flex;flex-direction:column;align-items:center;width:var(--cell)}[data-store=zarr]{justify-content:center}.cloud-label{left:.9rem;transform:none}.commits{flex-direction:column;align-items:center;gap:.7rem;width:var(--cell-sm)}.readers{flex-direction:row;flex-wrap:nowrap;justify-content:center;gap:1rem}.readers .actor{width:var(--cell)}.readers .actor h2{justify-content:center;white-space:nowrap;font-size:.72rem}.reader-row{flex-direction:column;align-items:center;gap:.4rem}.analysis{text-align:center}.analysis .q{max-width:none}.controls{gap:.5rem .9rem;padding:.6rem .7rem;margin-top:1.25rem;font-size:.78rem}.controls input[type=range]{width:4.5rem}.controls .toggle{margin-left:0}@keyframes promote{0%{transform:translateY(0);opacity:1}85%{opacity:1}to{transform:translateY(calc(var(--cell-sm) + .7rem));opacity:0}}}@media(max-width:760px)and (max-height:780px){:root{--cell: min(42vw, calc((100vw - 6.5rem)/2) )}}