twombly 0.3.0 → 0.4.0

package/dist/ui/assets/index-DBaMyh-f.css

@@ -0,0 +1 @@
+:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--canvas:oklch(97% 0 0);--surface:oklch(100% 0 0);--surface-2:oklch(95.5% 0 0);--surface-hover:oklch(0% 0 0/.05);--surface-pressed:oklch(0% 0 0/.09);--solid:oklch(0% 0 0);--on-solid:oklch(100% 0 0);--island:oklch(0% 0 0);--island-line:transparent;--island-hover:oklch(100% 0 0/.11);--text:oklch(0% 0 0);--secondary:oklch(42% 0 0);--muted:oklch(53% 0 0);--line:oklch(0% 0 0/.09);--line-subtle:oklch(0% 0 0/.06);--icon-muted:.58;--icon-secondary:.72;--frame-bg:oklch(100% 0 0);--accent:#06f;--selection:#0066ff1f;--guide:#06f9;--signal:#06f;--signal-soft:#0066ff21;--signal-soft-hover:#06f3;--danger:oklch(56% .21 27);--danger-soft:oklch(96% .025 25);--live:oklch(50% .14 150);--live-soft:oklch(96% .03 150);--backdrop:oklch(0% 0 0/.24);--shadow:0 0 0 .5px var(--line), 0 4px 8px -2px oklch(0% 0 0/.1), 0 14px 32px -8px oklch(0% 0 0/.3);--shadow-sm:0 0 0 1px var(--line);--pill:999px;--radius-menu:18px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}:root[data-color-scheme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--canvas:oklch(17.8% 0 0);--surface:oklch(16% 0 0);--surface-2:oklch(22% 0 0);--surface-hover:oklch(100% 0 0/.07);--surface-pressed:oklch(100% 0 0/.11);--solid:oklch(100% 0 0);--on-solid:oklch(0% 0 0);--island-line:oklch(100% 0 0/.13);--text:oklch(98.5% 0 0);--secondary:oklch(80% 0 0);--muted:oklch(66% 0 0);--line:oklch(100% 0 0/.09);--line-subtle:oklch(100% 0 0/.06);--icon-muted:.6;--icon-secondary:.74;--accent:#06f;--selection:#0066ff2e;--guide:#0066ffa6;--signal:#06f;--signal-soft:#06f3;--signal-soft-hover:#0066ff47;--danger:oklch(72% .18 25);--danger-soft:oklch(28% .06 25);--live:oklch(80% .15 150);--live-soft:oklch(28% .05 150);--backdrop:oklch(0% 0 0/.6);--shadow:0 0 0 .5px var(--line), 0 4px 8px -2px oklch(0% 0 0/.3), 0 14px 32px -8px oklch(0% 0 0/.5)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--canvas);color:var(--text);font:400 13px/18px var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}button,input,textarea{font:inherit;color:inherit}button{cursor:default;background:0 0;border:0;padding:0}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}a{color:inherit}.muted{color:var(--muted)}.spacer{flex:1}.full-message{height:100%;color:var(--muted);place-items:center;display:grid}.stage{background:var(--canvas);touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:clip}.world{transform-origin:0 0;--inv:1;--zoom:1;width:0;height:0;position:absolute;top:0;left:0}.empty-canvas{color:var(--muted);pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.frame{transition:opacity .12s ease-out;position:absolute;top:0;left:0}.frame-surface{background:var(--frame-bg);box-shadow:0 0 0 calc(1px * var(--inv)) var(--line);position:absolute;inset:0;overflow:hidden}.frame iframe{background:#fff;border:0;width:100%;height:100%;display:block;position:absolute;inset:0}[data-dragging] .frame iframe{pointer-events:none!important}.frame-poster{object-fit:cover;object-position:top left;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;position:absolute;inset:0}.frame-shield{cursor:var(--stage-cursor,default);position:absolute;inset:0}.stage[data-role=guest][data-tool=move] .frame-shield{cursor:pointer}.frame.selected .frame-surface,.frame.interacting .frame-surface{box-shadow:0 0 0 calc(1.5px * var(--inv)) var(--accent)}.frame-title{width:calc(100% * var(--zoom));height:26px;transform:scale(var(--inv));transform-origin:0 100%;color:var(--muted);white-space:nowrap;align-items:flex-end;padding-bottom:6px;font-size:12px;line-height:16px;display:flex;position:absolute;bottom:100%;left:0}.frame-title span{text-overflow:ellipsis;overflow:hidden}.frame.selected .frame-title,.frame.interacting .frame-title{color:var(--accent)}.frame-title input{border-radius:var(--pill);background:var(--surface-2);width:100%;max-width:280px;height:20px;color:var(--text);-webkit-user-select:text;user-select:text;border:0;outline:0;margin-left:-4px;padding:0 4px;font-size:12px}.frame-handle{border:1px solid var(--accent);border-radius:var(--pill);width:8px;height:8px;transform:scale(var(--inv));touch-action:none;background:#fff;position:absolute}.frame-handle.nw{cursor:nwse-resize;top:-4px;left:-4px}.frame-handle.ne{cursor:nesw-resize;top:-4px;right:-4px}.frame-handle.sw{cursor:nesw-resize;bottom:-4px;left:-4px}.frame-handle.se{cursor:nwse-resize;bottom:-4px;right:-4px}.frame-actions{z-index:1;transform:scale(var(--inv)) translate(var(--step-x,0), var(--step-y,0));transform-origin:100% 100%;opacity:0;pointer-events:none;padding-bottom:10px;transition:opacity .12s ease-out;display:flex;position:absolute;bottom:100%;right:0}.frame-actions[data-visible]{opacity:1;pointer-events:auto}.frame-actions:has(:focus-visible){opacity:1;pointer-events:auto}@media (hover:hover){.frame:hover>.frame-actions{opacity:1;pointer-events:auto}}.frame-focus{border-radius:var(--pill);background:var(--surface);width:28px;height:28px;box-shadow:var(--shadow-sm);color:var(--text);cursor:default;justify-content:center;align-items:center;transition:background-color .1s;display:flex}.frame-focus svg{opacity:var(--icon-muted);transition:opacity .1s}.frame-focus:hover{background:linear-gradient(var(--surface-hover) 0 0), var(--surface)}.frame-focus:hover svg{opacity:var(--icon-secondary)}.frame-focus:active{background:linear-gradient(var(--surface-pressed) 0 0), var(--surface)}.frame:hover>.frame-title,.frame.selected>.frame-title{padding-right:34px}.stage[data-tool=pencil] .frame:not(.focused) .frame-actions{display:none}.stage[data-focus] .frame:not(.focused){opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease-out,visibility 0s .12s}.stage[data-focus] .frame-surface{box-shadow:none}.frame-title{transition:opacity .12s ease-out}.stage[data-focus] .frame-title{opacity:0;pointer-events:none}.stage[data-returning] .frame,.stage[data-returning] .frame *{pointer-events:none!important}@media (prefers-reduced-motion:reduce){.frame,.stage[data-focus] .frame:not(.focused),.frame-actions{transition:none}}.guide{background:var(--guide);pointer-events:none;z-index:1000000;position:absolute}.marquee{background:var(--selection);box-shadow:0 0 0 calc(1px * var(--inv)) var(--accent);pointer-events:none;z-index:1000000;position:absolute}.cursors{pointer-events:none;z-index:40;position:absolute;inset:0;overflow:hidden}.cursor{will-change:transform;transition:opacity .18s ease-out;position:absolute;top:-4px;left:-3px}.cursor svg{filter:drop-shadow(0 1px 2px #00000040);display:block}.cursor-label{border-radius:var(--pill);color:#fff;white-space:nowrap;text-overflow:ellipsis;max-width:180px;padding:3px 7px;font-size:12px;font-weight:500;line-height:16px;position:absolute;top:18px;left:16px;overflow:hidden;box-shadow:0 1px 3px #0003}.chat-anchor{z-index:41;will-change:transform;position:fixed;top:0;left:0}.chat-bubble{color:#fff;white-space:pre;border-radius:4px 16px 16px;padding:7px 12px;font-size:13px;font-weight:500;line-height:18px;transition:opacity .3s ease-out;position:absolute;top:14px;left:13px;box-shadow:0 1px 3px #0003}.cursor .chat-bubble{animation:.12s ease-out chat-in;top:18px;left:16px}.chat-bubble.fading{opacity:0}.chat-anchor .chat-bubble.fading{opacity:1}.chat-anchor .chat-bubble.fading :is(.chat-line,.chat-previous){opacity:0;transition:opacity .3s ease-out}.chat-previous{opacity:.7}.chat-line{align-items:center;display:flex}.chat-caret{background:#fff;flex:none;width:1.5px;height:16px;margin-left:1px;animation:1s step-end infinite chat-caret}.chat-placeholder{color:#ffffffb3}@keyframes chat-caret{50%{opacity:0}}@keyframes chat-in{0%{opacity:0;transform-origin:0 0;transform:scale(.96)}}.follow-ring{pointer-events:none;z-index:60;position:fixed;inset:0}.follow-tab{border-radius:var(--pill);color:#fff;white-space:nowrap;z-index:61;align-items:center;gap:6px;height:28px;padding:0 10px;font-size:12px;font-weight:500;display:flex;position:fixed;top:50px;left:50%;transform:translate(-50%)}.face{color:#fff;border-radius:50%;flex:none;justify-content:center;align-items:center;font-weight:500;line-height:1;display:inline-flex;position:relative;overflow:hidden}.face img{object-fit:cover;width:100%;height:100%;display:block}.face.more{background:var(--surface-2);width:24px;height:24px;color:var(--text);font-size:10px}.faces{flex-direction:row-reverse;align-items:center;padding:0 6px 0 10px;display:flex}.face-button{box-shadow:0 0 0 2px var(--surface);border-radius:50%;margin-left:-6px;transition:transform .1s ease-out;position:relative}.face-button:hover{z-index:2;transform:translateY(-1px)}.face-button.following{box-shadow:0 0 0 2px var(--surface), 0 0 0 3.5px var(--peer);z-index:2}.face-button .face{display:flex}.chrome{z-index:50;-webkit-user-select:none;user-select:none;cursor:default}.shell{border-radius:var(--pill);background:var(--surface);height:38px;box-shadow:var(--shadow-sm);align-items:center;gap:2px;padding:3px;display:flex;position:fixed}:root[data-color-scheme=dark] .stage :is(.shell,.frame-focus){--surface:oklch(25% 0 0);box-shadow:none}.shell-divider{background:var(--line);flex:none;width:1px;height:20px;margin:0 4px}.top-left,.top-right,.toolbar{top:calc(6px + env(safe-area-inset-top))}.top-left{max-width:calc(50vw - 48px);left:6px}.top-right{right:6px}.wordmark{color:var(--text);flex:none;padding-right:2px;display:inline-flex}.wordmark svg{width:auto;height:14px;display:block}.canvas-name{border-radius:var(--pill);text-overflow:ellipsis;white-space:nowrap;min-width:0;height:32px;color:var(--muted);text-align:left;padding:0 8px;line-height:32px;transition:background-color .1s,color .1s;display:block;overflow:hidden}button.canvas-name:hover{background:var(--surface-hover);color:var(--text)}.canvas-name-field{border-radius:var(--pill);background:var(--surface-hover);flex:0 auto;grid-template-columns:minmax(0,max-content);min-width:48px;height:32px;display:inline-grid}.canvas-name-field:after{content:attr(data-value) " ";visibility:hidden;white-space:pre;grid-area:1/1;height:0;padding:0 8px;overflow:hidden}.canvas-name-input{-webkit-user-select:text;user-select:text;background:0 0;border:0;grid-area:1/1;width:0;min-width:100%;height:32px;padding:0 8px}.canvas-name-input:focus-visible,.frame-title input:focus-visible,.canvas-card-rename:focus-visible{outline:0}.canvas-name-input::selection{background:color-mix(in oklch, var(--accent) 32%, transparent)}.frame-title input::selection{background:color-mix(in oklch, var(--accent) 32%, transparent)}.canvas-card-rename::selection{background:color-mix(in oklch, var(--accent) 32%, transparent)}.primary-button{border-radius:var(--pill);background:var(--solid);height:32px;color:var(--on-solid);flex:none;justify-content:center;align-items:center;padding:0 12px;font-weight:500;transition:opacity .1s;display:inline-flex}.primary-button:hover{opacity:.85}.primary-button:disabled{opacity:.4}.sign-in{border-radius:var(--pill);height:32px;color:var(--secondary);align-items:center;padding:0 10px;font-weight:500;text-decoration:none;transition:background-color .1s;display:inline-flex}.sign-in:hover{background:var(--surface-hover)}.icon-button{border-radius:var(--pill);width:28px;height:28px;color:var(--text);flex:none;justify-content:center;align-items:center;transition:background-color .1s;display:inline-flex}.icon-button svg,.tool svg{opacity:var(--icon-muted);transition:opacity .1s}.icon-button:hover{background:var(--surface-hover)}.icon-button:hover svg,.tool:hover svg{opacity:var(--icon-secondary)}.icon-button:active:not(:disabled),.tool:active{background:var(--surface-pressed)}.icon-button:disabled{opacity:.4}.icon-button.small{border-radius:var(--pill);width:24px;height:24px}.icon-button.on,.icon-button.danger-text{background:0 0}.icon-button.on{color:var(--signal)}.icon-button.danger-text{color:var(--danger)}.icon-button.on svg,.icon-button.danger-text svg{opacity:1}.shell .icon-button{border-radius:var(--pill);width:32px;height:32px}.link-button{font-size:12px;font-weight:500;text-decoration:none}.link-button:hover{text-decoration:underline}.link-button.quiet{color:var(--muted)}.link-button.danger{color:var(--danger)}.toolbar{left:50%;transform:translate(-50%)}.tool{border-radius:var(--pill);width:32px;height:32px;color:var(--text);justify-content:center;align-items:center;transition:background-color .1s,color .1s;display:flex}.tool:hover{background:var(--surface-hover)}.tool.on,.shell .icon-button.on{background:var(--signal-soft);color:var(--signal)}.tool.on:hover,.shell .icon-button.on:hover{background:var(--signal-soft-hover)}.tool.on svg,.tool.on:hover svg{opacity:1}.zoom{right:6px;bottom:calc(6px + env(safe-area-inset-bottom))}.zoom-value{border-radius:var(--pill);min-width:44px;height:32px;color:var(--secondary);text-align:center;font-variant-numeric:tabular-nums;font-size:12px;transition:background-color .1s}.zoom-value:hover{background:var(--surface-hover)}.notice{border-radius:var(--pill);background:var(--island);color:#fff;height:32px;box-shadow:inset 0 0 0 1px var(--island-line);white-space:nowrap;align-items:center;gap:6px;max-width:min(560px,100vw - 24px);padding:0 12px;display:flex;position:fixed;bottom:12px;left:50%;transform:translate(-50%)}.notice span{text-overflow:ellipsis;overflow:hidden}.working-bubble{left:50%;bottom:calc(6px + env(safe-area-inset-bottom));color:var(--secondary);white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;gap:8px;padding:0 14px 0 12px;font-size:12px;transition:opacity .15s ease-out,transform .15s ease-out,visibility .15s;transform:translate(-50%)translateY(8px)scale(.97)}.working-bubble[data-show]{opacity:1;visibility:visible;transition:opacity .2s cubic-bezier(.22,1,.36,1),transform .2s cubic-bezier(.22,1,.36,1),visibility;transform:translate(-50%)}.working-scribble{flex:none}.working-scribble path{fill:none;stroke:var(--signal);stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;animation:1.8s cubic-bezier(.65,0,.35,1) infinite paused scribble}.working-bubble[data-show] .working-scribble path{animation-play-state:running}@keyframes scribble{0%{stroke-dashoffset:1px}55%{stroke-dashoffset:0}to{stroke-dashoffset:-1px}}.reconnecting{border-radius:var(--pill);background:var(--surface);height:28px;box-shadow:var(--shadow-sm);color:var(--muted);padding:5px 10px;font-size:12px;position:fixed;top:50px;left:50%;transform:translate(-50%)}.share-group{align-items:center;gap:6px;display:flex;position:fixed}.share-group .shell{position:static}.share-group .shell:empty{display:none}.share-group .primary-button{height:38px}.share-split{flex:none;gap:1px;display:inline-flex}.share-split .primary-button:first-child{border-radius:var(--pill) 6px 6px var(--pill);gap:4px;min-width:84px;padding:0 10px 0 12px}.share-split .primary-button:not(:first-child){border-radius:6px var(--pill) var(--pill) 6px;width:28px;padding:0 3px 0 0}.share-sharing,.share-sharing:hover{background:var(--surface-2);color:var(--muted);opacity:1;position:relative;overflow:hidden}.share-sharing i{background:var(--surface-pressed);transition:width .2s ease-out;position:absolute;inset:0 auto 0 0}.share-sharing span{position:relative}.share-uploading,.share-uploading:hover{background:linear-gradient(var(--signal-soft) 0 0), var(--surface);min-width:120px;color:var(--signal);opacity:1;position:relative;overflow:hidden}.share-uploading i{background:var(--signal-soft-hover);transition:width .2s ease-out;position:absolute;inset:0 auto 0 0}.share-uploading span{position:relative}.share-note{max-width:240px;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;padding:0 8px;font-size:12px;line-height:32px;overflow:hidden}.share-menu{width:212px}.share-menu .canvas-menu-item{padding:0 12px}.share-menu-link{color:oklch(100% 0 0/.6);text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:text;user-select:text;padding:6px 12px;font-size:12px;overflow:hidden}.modal-backdrop{background:var(--backdrop);z-index:70;place-items:center;display:grid;position:fixed;inset:0}.name-prompt{border-radius:var(--radius-menu);background:var(--surface);width:320px;max-width:calc(100vw - 32px);box-shadow:var(--shadow);gap:6px;padding:8px;display:flex}.name-prompt input{border-radius:var(--pill);background:var(--surface-2);-webkit-user-select:text;user-select:text;border:0;flex:1;min-width:0;height:32px;padding:0 10px}.name-prompt .primary-button{border-radius:var(--pill)}.huddle-faces{align-items:center;display:inline-flex}.huddle-bar{align-items:center;gap:2px;padding-left:7px;display:inline-flex}.huddle-bar .huddle-faces{padding-right:5px}.huddle-face{--level:0;box-shadow:0 0 0 2px var(--surface), 0 0 0 calc(2px + var(--level) * 2px) color-mix(in oklab, var(--live) calc(min(1, var(--level) * 10) * 100%), transparent);border-radius:50%;margin-left:-5px;transition:box-shadow .1s ease-out;display:inline-flex;position:relative}.huddle-faces .huddle-face:first-child{margin-left:0}.huddle-face.muted{box-shadow:0 0 0 2px var(--surface)}.huddle-face.muted:after{content:"";width:12px;height:12px;box-shadow:0 0 0 1.5px var(--surface);background:var(--danger) no-repeat center / 8px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M3 3l18 18'/%3E%3Cpath d='M8 8v3.5a4 4 0 0 0 6.5 3.1M16 11.5V6.5a4 4 0 0 0-7.6-1.7'/%3E%3C/svg%3E");border-radius:50%;position:absolute;bottom:-3px;right:-3px}.huddle-bar.joining .huddle-face{opacity:.55}.shell .huddle-leave,.shell .huddle-leave:hover{background:var(--danger-soft);color:var(--danger)}.huddle-leave svg,.huddle-leave:hover svg{opacity:1}.huddle-button.live{border-radius:var(--pill);height:32px;color:var(--live);align-items:center;gap:6px;padding:0 6px 0 8px;transition:background-color .1s;display:inline-flex}.huddle-button.live:hover{background:var(--surface-hover)}.huddle-button.live .huddle-faces .face{box-shadow:0 0 0 2px var(--surface);margin-left:-5px}.huddle-button.live .huddle-faces .face:first-child{margin-left:0}.huddle-notice{white-space:nowrap;align-items:center;gap:8px;height:32px;padding:0 0 0 6px;display:inline-flex}.huddle-notice b{font-weight:500}.huddle-notice .join{border-radius:var(--pill);background:var(--live-soft);height:32px;color:var(--live);align-items:center;padding:0 10px;font-weight:500;display:inline-flex}.huddle-error{height:32px;color:var(--muted);white-space:nowrap;align-items:center;padding:0 8px;display:inline-flex}.comments-layer{pointer-events:none;z-index:30;position:absolute;inset:0;overflow:hidden}.comments-layer>*{pointer-events:auto}.comment-pin{background:var(--surface);width:32px;max-width:32px;height:32px;max-height:32px;box-shadow:var(--shadow);text-align:left;touch-action:none;border-radius:16px 16px 16px 0;align-items:flex-start;gap:8px;padding:4px;transition:max-width .1s ease-in-out,max-height .1s ease-in-out,padding .1s ease-in-out;display:flex;position:absolute;overflow:hidden;transform:translateY(-100%)}.comment-pin.new{background:var(--accent)}.comment-pin.active,.comment-pin.unread{box-shadow:0 0 0 2px var(--accent), var(--shadow)}.comment-pin.resolved .face{opacity:.45}.comment-pin-preview{opacity:0;flex-direction:column;gap:0;min-width:0;font-size:11px;line-height:16px;transition:opacity .1s ease-in-out;display:flex}.comment-pin-preview b{font-weight:500}.comment-pin-head{white-space:nowrap}.comment-pin-text{-webkit-line-clamp:2;word-break:break-word;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.comment-pin.expanded{z-index:5;width:240px;max-width:240px;height:auto;max-height:112px;padding:12px}.comment-pin.expanded .face{width:26px!important;height:26px!important}.comment-pin.expanded .comment-pin-preview{opacity:1;flex:1}.composer{background:var(--surface);box-shadow:0 0 0 1px var(--accent), var(--shadow);-webkit-user-select:text;user-select:text;cursor:auto;border-radius:13px;flex-direction:column;display:flex;position:absolute}.composer-input{align-items:flex-start;gap:8px;padding:8px 16px;display:flex}.composer-input textarea{flex:1;min-width:0}.composer textarea,.thread-reply textarea{resize:none;-webkit-user-select:text;user-select:text;background:0 0;border:0;outline:0;width:100%;padding:0;font-size:13px;line-height:24px;display:block;overflow-y:auto}.composer textarea::placeholder,.thread-reply textarea::placeholder{color:var(--muted)}.composer-actions{border-top:1px solid var(--line);align-items:center;height:40px;padding:4px 8px;display:none}.composer.has-text .composer-actions{display:flex}.composer:not(.has-text) .composer-input{padding-right:8px}.send-button{background:var(--solid);width:24px;height:24px;color:var(--on-solid);border-radius:50%;flex:none;justify-content:center;align-items:center;display:inline-flex}.send-button:disabled{background:var(--surface-2);color:var(--muted)}.emoji-wrap{display:inline-flex;position:relative}.emoji-menu{border-radius:var(--radius-menu);background:var(--surface);box-shadow:var(--shadow);z-index:5;grid-template-columns:repeat(6,28px);gap:2px;padding:4px;display:grid;position:absolute;top:calc(100% + 6px);left:0}.emoji-menu button{border-radius:var(--pill);width:28px;height:28px;font-size:16px}.emoji-menu button:hover{background:var(--surface-hover)}.comment-card{background:var(--surface);max-height:min(520px,100vh - 72px);box-shadow:var(--shadow);cursor:auto;border-radius:13px;flex-direction:column;font-size:11px;line-height:16px;display:flex;position:absolute}.thread-header{border-bottom:1px solid var(--line);flex:none;align-items:center;height:42px;padding:4px 8px 4px 16px;display:flex}.thread-title{flex:1;font-weight:550}.thread-actions{align-items:center;gap:4px;display:flex}.menu-wrap{display:inline-flex;position:relative}.menu{border-radius:var(--radius-menu);background:var(--island);min-width:140px;box-shadow:inset 0 0 0 1px var(--island-line), var(--shadow);z-index:6;padding:4px;position:absolute;top:calc(100% + 4px);right:0}.menu button{border-radius:var(--pill);color:#fff;text-align:left;white-space:nowrap;width:100%;height:28px;padding:0 8px;font-size:12px;display:block}.menu button:hover{background:var(--island-hover)}.thread-list{-webkit-user-select:text;user-select:text;flex:1;min-height:0;padding:8px 0 0;overflow-y:auto}.thread-comment{padding:4px 16px 8px;position:relative}.thread-comment-head{align-items:center;gap:8px;height:32px;display:flex}.thread-comment-name{font-size:13px;font-weight:500;line-height:24px}.thread-comment-time{font-size:13px;line-height:24px}.thread-comment-more{opacity:0;margin-left:auto;position:relative}.thread-comment:hover .thread-comment-more,.thread-comment-more:focus-within{opacity:1}.thread-comment-text{white-space:pre-wrap;word-break:break-word;padding-left:32px;font-size:13px;line-height:24px}.thread-reply{flex:none;align-items:flex-start;gap:8px;padding:8px 16px 16px;display:flex}.thread-reply>.face{margin-top:8px}.thread-reply-field{background:var(--surface-2);border-radius:8px;flex:1;align-items:flex-start;gap:8px;min-width:0;padding:8px 8px 8px 12px;display:flex;position:relative;box-shadow:inset 0 0 0 1px #0000}.thread-reply-field:focus-within{box-shadow:inset 0 0 0 1px var(--accent)}.thread-reply-field textarea{flex:1;min-width:0}.comments-panel{border-radius:var(--radius-menu);background:var(--surface);width:248px;box-shadow:var(--shadow-sm);flex-direction:column;display:flex;position:fixed;top:50px;bottom:50px;right:6px}.comments-panel-head{border-bottom:1px solid var(--line-subtle);flex:none;justify-content:space-between;align-items:center;height:42px;padding:0 12px 0 16px;font-size:12px;font-weight:500;display:flex}.resolved-toggle{color:var(--muted);align-items:center;gap:4px;font-weight:400;display:flex}.resolved-toggle input{accent-color:var(--accent);margin:0}.comments-panel-list{flex:1;min-height:0;padding:6px;overflow-y:auto}.comments-empty{margin:0;padding:10px;font-size:12px}.comments-panel-item{text-align:left;border-radius:8px;width:100%;padding:8px 10px;font-size:12px;line-height:16px;display:block}.comments-panel-item:hover{background:var(--surface-hover)}.comments-panel-item.active{background:var(--selection)}.comments-panel-item>span{display:block}.comments-panel-item b{font-weight:500}.comments-panel-face{width:24px;margin-bottom:4px;position:relative}.comments-panel-face .face{display:flex}.unread-dot{background:var(--accent);width:8px;height:8px;box-shadow:0 0 0 1.5px var(--surface);border-radius:50%;position:absolute;top:-1px;right:-3px}.comments-panel-text{-webkit-line-clamp:3;word-break:break-word;-webkit-box-orient:vertical;overflow:hidden;display:-webkit-box!important}body:has(.home){overflow:auto}.home{flex-direction:column;min-height:100%;display:flex}.home-top .wordmark svg{height:18px}.home-top{justify-content:space-between;align-items:center;height:56px;padding:0 20px;display:flex}.home-me{border-radius:50%;transition:box-shadow .1s;display:flex}.home-me:hover,.home-me[data-popup-open]{box-shadow:0 0 0 3px var(--surface-hover)}.home-main{flex:1;width:100%;max-width:1360px;margin:0 auto;padding:24px 20px}.install{text-align:center;flex-direction:column;align-items:center;gap:20px;padding-top:22vh;display:flex}.install h1{letter-spacing:-.028em;margin:0;font-size:24px;font-weight:500;line-height:32px}.canvas-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px;margin:0;padding:0;list-style:none;display:grid}.canvas-card{min-width:0;display:block;position:relative}.canvas-card-link{z-index:1;border-radius:var(--radius-menu);outline:0;position:absolute;inset:0}.canvas-card-meta{font-size:12px;display:block}.canvas-card-name{text-overflow:ellipsis;white-space:nowrap;margin-top:10px;font-weight:500;display:block;overflow:hidden}.canvas-card-rename{z-index:2;border-radius:var(--pill);background:var(--surface-2);width:calc(100% + 8px);height:24px;color:var(--text);font:inherit;-webkit-user-select:text;user-select:text;border:0;outline:0;margin:7px 0 -3px -8px;padding:0 8px;font-weight:500;display:block;position:relative}.canvas-thumb{aspect-ratio:16/10;border-radius:var(--radius-menu);background:var(--surface-2);box-shadow:var(--shadow-sm);transition:box-shadow .18s cubic-bezier(.22,1,.36,1);overflow:hidden}.canvas-card:hover .canvas-thumb,.canvas-card[data-popup-open] .canvas-thumb{box-shadow:var(--shadow)}.canvas-card:has(.canvas-card-more[data-popup-open]) .canvas-thumb{box-shadow:var(--shadow)}.canvas-card-link:focus-visible~.canvas-thumb{box-shadow:0 0 0 2px var(--accent)}.canvas-thumb svg{width:100%;height:100%;display:block}.canvas-thumb rect{fill:var(--frame-bg);stroke:var(--line);stroke-width:1px;vector-effect:non-scaling-stroke}.canvas-thumb g:has(image) rect{fill:#0000}.canvas-thumb image{opacity:0;transition:opacity .2s}.canvas-thumb image.loaded{opacity:1}.canvas-card-more,.canvas-card-heart{z-index:2;border-radius:var(--pill);background:var(--surface);width:28px;height:28px;box-shadow:var(--shadow-sm);place-items:center;display:grid;position:absolute;top:8px}.canvas-card-more{color:var(--secondary);opacity:0;transition:opacity .1s,transform .18s cubic-bezier(.22,1,.36,1),color .1s;right:8px;transform:scale(.8)}.canvas-card-more:hover,.canvas-card-more[data-popup-open]{color:var(--text)}.canvas-card:hover .canvas-card-more,.canvas-card-more[data-popup-open],.canvas-card-more:focus-visible{opacity:1;transform:none}.canvas-card:hover .canvas-card-more:active{transform:scale(.92)}.canvas-card-heart{color:oklch(58% .22 12);pointer-events:none;animation:.18s cubic-bezier(.22,1,.36,1) tool-pop;left:8px}@media (hover:none){.canvas-card-more{opacity:1;transform:none}}@media (width<=900px){.canvas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=560px){.canvas-grid{grid-template-columns:minmax(0,1fr)}}.canvas-menu-positioner{z-index:60}.canvas-menu{border-radius:var(--radius-menu);background:var(--island);min-width:160px;box-shadow:inset 0 0 0 1px var(--island-line), var(--shadow);transform-origin:var(--transform-origin);outline:0;padding:4px;transition:opacity .1s,transform .18s cubic-bezier(.22,1,.36,1)}.canvas-menu[data-starting-style],.canvas-menu[data-ending-style]{opacity:0;transform:scale(.96)}.canvas-menu-item{border-radius:var(--pill);color:#fff;white-space:nowrap;cursor:default;-webkit-user-select:none;user-select:none;outline:0;align-items:center;gap:8px;height:32px;padding:0 12px 0 7px;display:flex}.canvas-menu-item svg{stroke-width:2px;flex:none}.canvas-menu-item[data-highlighted]{background:var(--island-hover)}.canvas-menu-item.danger{color:oklch(72% .19 27)}.canvas-menu-item.danger[data-highlighted]{background:oklch(72% .19 27/.18)}.canvas-menu-separator{background:oklch(100% 0 0/.13);height:1px;margin:4px 8px}.canvas-menu-check{flex:none;display:flex}.canvas-menu-check[data-unchecked]{visibility:hidden}.shell .icon-button[data-popup-open]{background:var(--surface-pressed)}.shell .icon-button[data-popup-open] svg{opacity:1}.canvas-delete{z-index:71;border-radius:var(--radius-menu);background:var(--surface);width:320px;max-width:calc(100vw - 32px);box-shadow:var(--shadow);outline:0;flex-direction:column;gap:16px;padding:16px;transition:opacity .1s,transform .18s cubic-bezier(.22,1,.36,1);display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.canvas-delete[data-starting-style],.canvas-delete[data-ending-style]{opacity:0;transform:translate(-50%,-50%)scale(.96)}.canvas-delete-backdrop{transition:opacity .15s}.canvas-delete-backdrop[data-starting-style],.canvas-delete-backdrop[data-ending-style]{opacity:0}.canvas-delete-title{overflow-wrap:anywhere;margin:0;font-size:13px;font-weight:500;line-height:18px}.canvas-delete-error{color:var(--danger);margin:-8px 0 0;font-size:12px}.canvas-delete-actions{justify-content:flex-end;align-items:center;gap:4px;display:flex}.canvas-delete-cancel{border-radius:var(--pill);height:32px;color:var(--secondary);padding:0 12px;font-weight:500;transition:background-color .1s}.canvas-delete-cancel:hover{background:var(--surface-hover)}.primary-button.canvas-delete-confirm{background:var(--danger);color:#fff}.home-foot{color:var(--muted);justify-content:center;gap:16px;padding:16px;font-size:12px;display:flex}.home-foot a{text-decoration:none;transition:color .1s}.home-foot a:hover{color:var(--text)}@media (width<=700px){.toolbar{top:calc(50px + env(safe-area-inset-top));left:6px;transform:none}.top-left{max-width:calc(100vw - 150px)}.follow-tab,.reconnecting,.comments-panel{top:94px}}@media (width<=640px){.working-bubble{bottom:calc(50px + env(safe-area-inset-bottom))}.comments-panel{display:none}.comment-card,.composer{width:calc(100vw - 16px)!important;left:8px!important}.faces .face-button:nth-child(n+4){display:none}}.toolbar{transition:width .24s cubic-bezier(.22,1,.36,1)}.toolbar-clip{border-radius:var(--pill);width:100%;height:32px;overflow:hidden}.toolbar-row{align-items:center;gap:2px;width:max-content;height:32px;display:flex;position:relative}.tool-slider{border-radius:var(--pill);background:var(--signal-soft);pointer-events:none;height:32px;transition:transform .24s cubic-bezier(.22,1,.36,1),width .24s cubic-bezier(.22,1,.36,1);position:absolute;top:0;left:0}.tool-slider[data-hidden]{opacity:0}.toolbar .tool{flex:none;position:relative}.toolbar .tool svg{stroke-width:2px}.toolbar .tool[aria-pressed=true]{color:var(--signal)}.toolbar .tool[aria-pressed=true] svg{opacity:1}.toolbar .tool.held{background:var(--signal-soft)}.toolbar .shell-divider{margin:0 4px}.pencil-tray{align-items:center;gap:6px;margin:0 6px 0 4px;display:flex}.swatch{width:20px;height:20px;box-shadow:inset 0 0 0 1px var(--line);animation:.18s cubic-bezier(.22,1,.36,1) backwards tool-pop;animation-delay:calc(var(--i,0) * 25ms);border-radius:50%;flex:none;transition:transform .1s}.swatch:hover{transform:scale(1.12)}.swatch:active{transform:scale(.9)}.swatch.closed{width:24px;height:24px}.swatch.current{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--signal)}.size-choice{border-radius:var(--pill);width:28px;height:28px;color:var(--secondary);animation:.18s cubic-bezier(.22,1,.36,1) backwards tool-pop;animation-delay:calc(var(--i,0) * 25ms);flex:none;justify-content:center;align-items:center;transition:background-color .1s;display:flex}.size-choice:hover{background:var(--surface-hover)}.size-choice.current{background:var(--surface-hover);color:var(--signal)}.size-choice.closed{width:24px;height:24px}@keyframes tool-pop{0%{opacity:0;transform:scale(.8)}}.strokes{pointer-events:none;z-index:1000000;position:absolute;top:0;left:0;overflow:visible}.stroke-selection{fill:none;stroke:var(--accent);stroke-width:1.5px;vector-effect:non-scaling-stroke}.stage[data-tool=move] .stroke-mine{pointer-events:auto;cursor:pointer}@media (prefers-reduced-motion:reduce){.toolbar,.tool-slider,.canvas-menu,.canvas-delete,.canvas-delete-backdrop,.canvas-card-more{transition:none}.canvas-card-heart,.swatch,.size-choice{animation:none}.working-bubble,.working-bubble[data-show]{transition:opacity .2s ease-out,visibility .2s;transform:translate(-50%)}.working-scribble path{stroke-dashoffset:0;animation:none}}

package/dist/ui/assets/rolldown-runtime-WkwZ5CU-.js

@@ -0,0 +1 @@
+var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t,t.exports),e=null),t.exports),s=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},c=(n,r,o)=>(o=n==null?{}:e(i(n)),s(r||!n||!n.__esModule||!a.call(n,`default`)?t(o,`default`,{value:n,enumerable:!0}):o,n));export{c as n,o as t};

package/dist/ui/index.html

@@ -11,8 +11,11 @@
     <meta property="og:image:width" content="1200" />
     <meta property="og:image:height" content="630" />
     <meta name="twitter:card" content="summary_large_image" />
-    <script type="module" crossorigin src="/assets/index-B5osE1GC.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-Dw-Z6e31.css">
+    <script src="/theme.js"></script>
+    <script type="module" crossorigin src="/assets/index-COkd0b_O.js"></script>
+    <link rel="modulepreload" crossorigin href="/assets/rolldown-runtime-WkwZ5CU-.js">
+    <link rel="modulepreload" crossorigin href="/assets/agentPrompt-Bg7-ijHJ.js">
+    <link rel="stylesheet" crossorigin href="/assets/index-DBaMyh-f.css">
   </head>
   <body>
     <div id="root"></div>

package/dist/ui/legal.css

@@ -1,10 +1,34 @@
-:root { color-scheme: light dark; --text: #1e1e1e; --muted: #757575; --bg: #fff; }
-@media (prefers-color-scheme: dark) { :root { --text: #f5f5f5; --muted: #a0a0a0; --bg: #1e1e1e; } }
-body { margin: 0; background: var(--bg); color: var(--text); font: 14px/1.6 -apple-system, system-ui, sans-serif; }
-main { max-width: 620px; margin: 0 auto; padding: 48px 16px 96px; }
-h1 { font-size: 24px; font-weight: 600; margin: 32px 0 4px; }
-h2 { font-size: 14px; font-weight: 600; margin: 32px 0 4px; }
-a { color: inherit; }
-ul { padding-left: 20px; }
-.muted { color: var(--muted); }
-.wordmark { display: block; width: 75px; height: 18px; background: currentColor; mask: url(/twombly-wordmark.svg) no-repeat left center / contain; }
+/* Privacy and Terms. The app's tokens and the landing's type, on a plain page. theme.js sets the scheme. */
+:root { color-scheme: light; --bg: oklch(0.97 0 0); --text: oklch(0 0 0); --secondary: oklch(0.36 0 0); --muted: oklch(0.53 0 0); --line: oklch(0 0 0 / 9%); --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
+:root[data-color-scheme='dark'] { color-scheme: dark; --bg: oklch(0.178 0 0); --text: oklch(0.985 0 0); --secondary: oklch(0.8 0 0); --muted: oklch(0.66 0 0); --line: oklch(1 0 0 / 9%); }
+* { box-sizing: border-box; }
+body { margin: 0; background: var(--bg); color: var(--secondary); font: 400 15px/1.6 var(--font); -webkit-font-smoothing: antialiased; text-wrap: pretty; }
+a { color: inherit; text-decoration: none; }
+a:focus-visible { outline: 2px solid #0066FF; outline-offset: 2px; border-radius: 4px; }
+
+nav, main, footer { width: 100%; max-width: 640px; margin: 0 auto; padding-inline: 24px; }
+nav { padding-block: 20px; }
+.wordmark { display: block; width: 75px; height: 18px; background: var(--text); mask: url(/twombly-wordmark.svg) no-repeat left center / contain; }
+
+main { padding-block: 72px 24px; }
+h1 { margin: 0; color: var(--text); font-size: 40px; font-weight: 700; line-height: 1; letter-spacing: -0.02em; }
+.updated { margin: 12px 0 48px; color: var(--muted); font-size: 13px; }
+h2 { margin: 40px 0 8px; color: var(--text); font-size: 15px; font-weight: 600; letter-spacing: -0.012em; }
+p, ul { margin: 0 0 12px; }
+ul { padding-left: 18px; }
+li { margin-bottom: 6px; }
+li::marker { color: var(--muted); }
+strong { color: var(--text); font-weight: 500; }
+main a { color: var(--text); text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px; transition: text-decoration-color 150ms; }
+main a:hover { text-decoration-color: currentColor; }
+
+footer { display: flex; gap: 24px; padding-block: 48px 32px; color: var(--muted); font-size: 13px; }
+footer a:hover, footer a[aria-current] { color: var(--text); }
+
+@media (max-width: 640px) {
+  nav, main, footer { padding-inline: 16px; }
+  main { padding-top: 40px; }
+  h1 { font-size: 32px; }
+  .updated { margin-bottom: 32px; }
+}
+code { font: 13px ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--text); }

package/dist/ui/privacy.html

@@ -7,32 +7,36 @@
 <title>Privacy – Twombly</title>
 <link rel="icon" type="image/png" href="/favicon.png">
 <link rel="stylesheet" href="/legal.css">
+<script src="/theme.js"></script>
 </head>
 <body>
+<nav><a class="wordmark" href="/" aria-label="Twombly"></a></nav>
 <main>
-<p><a class="wordmark" href="/" aria-label="Twombly"></a></p>
 <h1>Privacy</h1>
-<p class="muted">Updated November 4, 2026</p>
+<p class="updated">Updated November 5, 2026</p>
 <p>Twombly is run by Materic, Inc. This explains what we keep, why, and what you can do about it.</p>
 <h2>What we keep</h2>
 <ul>
-<li><strong>Your Google account:</strong> your name, email address, profile picture and account ID, from signing in with Google. We don't read your Gmail, contacts, files or anything else in your Google account.</li>
+<li><strong>Your account:</strong> your name, email address, profile picture and account ID, from signing in with Google. We don't read your email, contacts, files or anything else in your Google account.</li>
 <li><strong>Shared canvases:</strong> the files, frame positions, titles and comments on any canvas you share.</li>
 <li><strong>Comments:</strong> the text and the name you gave. If you comment as a guest, we set a cookie so your comments stay yours on that browser.</li>
-<li><strong>Service logs:</strong> basic request data such as IP address and browser, held by our hosting provider, for keeping the service running and stopping abuse.</li>
+<li><strong>Usage:</strong> what happens on Twombly, such as signing in, sharing, opening a shared canvas, commenting and joining a huddle. It's recorded against your account or guest ID, never your name, email or what's on a canvas.</li>
+<li><strong>Service logs:</strong> basic request data such as IP address and browser, for keeping the service running and stopping abuse.</li>
 </ul>
 <h2>What stays on your computer</h2>
-<p>A canvas you haven't shared stays on your computer. Nothing is uploaded until you click Share. Signing in saves a token in your Mac's Keychain, or in a private file on other systems, so you stay signed in.</p>
+<p>A canvas you haven't shared stays on your computer. Nothing is uploaded until you click Share. Signing in saves a private token on your computer so you stay signed in.</p>
+<p>Once a day the Twombly tool sends a few counts, such as how many canvases and frames were made, with a random ID for the machine and the tool's version. When something breaks it sends an error report, with your home folder removed from any file path. Neither includes names, titles, files or comments. Run <code>twombly usage off</code> to stop both.</p>
 <h2>Shared links are public</h2>
 <p>Anyone with a shared link can see the canvas, its comments and who is present, and can join its huddle. Links are hard to guess and we ask search engines not to index them, but they aren't private. Don't share anything you wouldn't want the person you send it to, or anyone they send it to, to see.</p>
 <h2>Huddles</h2>
-<p>Huddle audio passes through Cloudflare to reach the other people in it. We don't record or store it.</p>
+<p>Huddle audio passes through our hosting provider to reach the other people in it. We don't record or store it.</p>
 <h2>Who else handles data</h2>
-<p>We use Cloudflare for hosting, storage and huddle audio, and Google for sign-in. We don't sell your data, use it for advertising, or use your canvases to train AI models.</p>
+<p>A hosting provider stores and serves Twombly and carries huddle audio, an analytics provider holds usage counts and error reports, and Google handles sign-in. We don't sell your data, use it for advertising, or use your canvases to train AI models.</p>
 <h2>Deleting things</h2>
 <p>Stop sharing a canvas, or delete it from your list, and its files and comments are deleted from our storage straight away. Backups and caches may take up to 30 days to clear. To delete your account, email us.</p>
 <h2>Contact</h2>
 <p>Email <a href="mailto:jaytel@materic.inc">jaytel@materic.inc</a> with any question, or to report a canvas that shouldn't be online.</p>
 </main>
+<footer><a href="/privacy" aria-current="page">Privacy</a><a href="/terms">Terms</a></footer>
 </body>
 </html>

package/dist/ui/terms.html

@@ -7,12 +7,13 @@
 <title>Terms – Twombly</title>
 <link rel="icon" type="image/png" href="/favicon.png">
 <link rel="stylesheet" href="/legal.css">
+<script src="/theme.js"></script>
 </head>
 <body>
+<nav><a class="wordmark" href="/" aria-label="Twombly"></a></nav>
 <main>
-<p><a class="wordmark" href="/" aria-label="Twombly"></a></p>
 <h1>Terms</h1>
-<p class="muted">Updated November 4, 2026</p>
+<p class="updated">Updated November 4, 2026</p>
 <p>These terms are between you and Materic, Inc. Using Twombly means you agree to them.</p>
 <h2>What you share</h2>
 <p>Your work stays yours. You give us permission to store it and show it to anyone with its link, only so the service can work. You're responsible for what you share, including having the rights to any code, images, fonts and data in it.</p>
@@ -32,5 +33,6 @@
 <h2>Contact</h2>
 <p>Email <a href="mailto:jaytel@materic.inc">jaytel@materic.inc</a>.</p>
 </main>
+<footer><a href="/privacy">Privacy</a><a href="/terms" aria-current="page">Terms</a></footer>
 </body>
 </html>

package/dist/ui/theme.js

@@ -0,0 +1,6 @@
+// Sets light or dark before the first paint. A file of its own because the interface's security rules refuse inline scripts. store.ts takes over from here.
+{
+  let theme = null;
+  try { theme = localStorage.getItem('twombly:theme'); } catch {}
+  document.documentElement.dataset.colorScheme = theme === 'light' || theme === 'dark' ? theme : matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "twombly",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Put design explorations on a shared canvas. Built for agents.",
   "type": "module",
   "bin": { "twombly": "dist/cli.js" },

package/dist/ui/assets/Landing-BKJA0CJt.js

@@ -1,111 +0,0 @@
-const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/LandingStage-DyrNB5Ea.js","assets/index-B5osE1GC.js","assets/index-Dw-Z6e31.css","assets/LandingStage-CqdIuQDE.css"])))=>i.map(i=>d[i]);
-import{_ as e,a as t,b as n,c as r,d as i,f as a,g as o,h as s,i as c,l,m as u,n as d,o as f,p,r as m,s as h,t as g,v as _,x as ee}from"./index-B5osE1GC.js";var v=ee(n(),1),y=e();function b(){return(0,y.jsxs)(`span`,{className:`landing-marks`,"aria-hidden":`true`,children:[(0,y.jsx)(`svg`,{viewBox:`0 0 24 24`,fill:`currentColor`,children:(0,y.jsx)(`path`,{d:`m4.7144 15.9555 4.7174-2.6471.079-.2307-.079-.1275h-.2307l-.7893-.0486-2.6956-.0729-2.3375-.0971-2.2646-.1214-.5707-.1215-.5343-.7042.0546-.3522.4797-.3218.686.0608 1.5179.1032 2.2767.1578 1.6514.0972 2.4468.255h.3886l.0546-.1579-.1336-.0971-.1032-.0972L6.973 9.8356l-2.55-1.6879-1.3356-.9714-.7225-.4918-.3643-.4614-.1578-1.0078.6557-.7225.8803.0607.2246.0607.8925.686 1.9064 1.4754 2.4893 1.8336.3643.3035.1457-.1032.0182-.0728-.164-.2733-1.3539-2.4467-1.445-2.4893-.6435-1.032-.17-.6194c-.0607-.255-.1032-.4674-.1032-.7285L6.287.1335 6.6997 0l.9957.1336.419.3642.6192 1.4147 1.0018 2.2282 1.5543 3.0296.4553.8985.2429.8318.091.255h.1579v-.1457l.1275-1.706.2368-2.0947.2307-2.6957.0789-.7589.3764-.9107.7468-.4918.5828.2793.4797.686-.0668.4433-.2853 1.8517-.5586 2.9021-.3643 1.9429h.2125l.2429-.2429.9835-1.3053 1.6514-2.0643.7286-.8196.85-.9046.5464-.4311h1.0321l.759 1.1293-.34 1.1657-1.0625 1.3478-.8804 1.1414-1.2628 1.7-.7893 1.36.0729.1093.1882-.0183 2.8535-.607 1.5421-.2794 1.8396-.3157.8318.3886.091.3946-.3278.8075-1.967.4857-2.3072.4614-3.4364.8136-.0425.0304.0486.0607 1.5482.1457.6618.0364h1.621l3.0175.2247.7892.522.4736.6376-.079.4857-1.2142.6193-1.6393-.3886-3.825-.9107-1.3113-.3279h-.1822v.1093l1.0929 1.0686 2.0035 1.8092 2.5075 2.3314.1275.5768-.3218.4554-.34-.0486-2.2039-1.6575-.85-.7468-1.9246-1.621h-.1275v.17l.4432.6496 2.3436 3.5214.1214 1.0807-.17.3521-.6071.2125-.6679-.1214-1.3721-1.9246L14.38 17.959l-1.1414-1.9428-.1397.079-.674 7.2552-.3156.3703-.7286.2793-.6071-.4614-.3218-.7468.3218-1.4753.3886-1.9246.3157-1.53.2853-1.9004.17-.6314-.0121-.0425-.1397.0182-1.4328 1.9672-2.1796 2.9446-1.7243 1.8456-.4128.164-.7164-.3704.0667-.6618.4008-.5889 2.386-3.0357 1.4389-1.882.929-1.0868-.0062-.1579h-.0546l-6.3385 4.1164-1.1293.1457-.4857-.4554.0608-.7467.2307-.2429 1.9064-1.3114Z`})}),(0,y.jsx)(`svg`,{viewBox:`0 0 24 24`,fill:`currentColor`,children:(0,y.jsx)(`path`,{d:`M22.2819 9.8211a5.9847 5.9847 0 0 0-.5157-4.9108 6.0462 6.0462 0 0 0-6.5098-2.9A6.0651 6.0651 0 0 0 4.9807 4.1818a5.9847 5.9847 0 0 0-3.9977 2.9 6.0462 6.0462 0 0 0 .7427 7.0966 5.98 5.98 0 0 0 .511 4.9107 6.051 6.051 0 0 0 6.5146 2.9001A5.9847 5.9847 0 0 0 13.2599 24a6.0557 6.0557 0 0 0 5.7718-4.2058 5.9894 5.9894 0 0 0 3.9977-2.9001 6.0557 6.0557 0 0 0-.7475-7.0729zm-9.022 12.6081a4.4755 4.4755 0 0 1-2.8764-1.0408l.1419-.0804 4.7783-2.7582a.7948.7948 0 0 0 .3927-.6813v-6.7369l2.02 1.1686a.071.071 0 0 1 .038.052v5.5826a4.504 4.504 0 0 1-4.4945 4.4944zm-9.6607-4.1254a4.4708 4.4708 0 0 1-.5346-3.0137l.142.0852 4.783 2.7582a.7712.7712 0 0 0 .7806 0l5.8428-3.3685v2.3324a.0804.0804 0 0 1-.0332.0615L9.74 19.9502a4.4992 4.4992 0 0 1-6.1408-1.6464zM2.3408 7.8956a4.485 4.485 0 0 1 2.3655-1.9728V11.6a.7664.7664 0 0 0 .3879.6765l5.8144 3.3543-2.0201 1.1685a.0757.0757 0 0 1-.071 0l-4.8303-2.7865A4.504 4.504 0 0 1 2.3408 7.872zm16.5963 3.8558L13.1038 8.364 15.1192 7.2a.0757.0757 0 0 1 .071 0l4.8303 2.7913a4.4944 4.4944 0 0 1-.6765 8.1042v-5.6772a.79.79 0 0 0-.407-.667zm2.0107-3.0231l-.142-.0852-4.7735-2.7818a.7759.7759 0 0 0-.7854 0L9.409 9.2297V6.8974a.0662.0662 0 0 1 .0284-.0615l4.8303-2.7866a4.4992 4.4992 0 0 1 6.6802 4.66zM8.3065 12.863l-2.02-1.1638a.0804.0804 0 0 1-.038-.0567V6.0742a4.4992 4.4992 0 0 1 7.3757-3.4537l-.142.0805L8.704 5.459a.7948.7948 0 0 0-.3927.6813zm1.0976-2.3654l2.602-1.4998 2.6069 1.4998v2.9994l-2.5974 1.4997-2.6067-1.4997Z`})})]})}var x=`twombly:show-copied`,S=.41960295031576633,C=.15,w=.2765523188064277,T=.5783555327868779,E=-44*Math.PI/180,D={x:Math.sin(E),y:-Math.cos(E)},O=(e,t=0,n=1)=>Math.min(n,Math.max(t,e)),k=(e,t,n)=>({x:e.x+t.x*n,y:e.y+t.y*n}),A=e=>Math.hypot(e.x,e.y),j=e=>{let t=A(e);return t<.001?{x:1,y:0}:{x:e.x/t,y:e.y/t}},M=(e,t,n,r)=>({start:e,outgoing:t,incoming:n,end:r});function N(e,t){let n=1-t;return{x:n**3*e.start.x+3*n*n*t*e.outgoing.x+3*n*t*t*e.incoming.x+t**3*e.end.x,y:n**3*e.start.y+3*n*n*t*e.outgoing.y+3*n*t*t*e.incoming.y+t**3*e.end.y}}function P(e,t){let n=O(t),r=Math.min(e.curves.length-1,Math.floor(n*e.curves.length)),i=n===1?1:n*e.curves.length-r,a=e.curves[r],o=1-i,s={x:3*(o*o*(a.outgoing.x-a.start.x)+2*o*i*(a.incoming.x-a.outgoing.x)+i*i*(a.end.x-a.incoming.x))*e.curves.length,y:3*(o*o*(a.outgoing.y-a.start.y)+2*o*i*(a.incoming.y-a.outgoing.y)+i*i*(a.end.y-a.incoming.y))*e.curves.length},c=j(s),l=1-(1-O((n-.99)/.01))**3,u=j({x:c.x*(1-l)+D.x*l,y:c.y*(1-l)+D.y*l});return{point:N(a,i),derivative:s,heading:u}}function F(e,t){let n=e=>!t||e.x>=t.x+20&&e.x<t.x+t.width-20&&e.y>=t.y+20&&e.y<t.y+t.height-20,r=e[0].start,i,a=0,o=0,s=0,c=0,l=n(r);for(let t of e)for(let e=1;e<=24;e++){let u=N(t,e/24),d=u.x-r.x,f=u.y-r.y,p=Math.hypot(d,f);if(a+=p,l&&=n(u),p>.01){let e=Math.atan2(f,d);if(i!==void 0){let t=Math.atan2(Math.sin(e-i),Math.cos(e-i));o+=t*t,s+=Math.abs(t),c=Math.max(c,Math.abs(t))}i=e}r=u}return{length:a,turnEnergy:o,totalTurn:s,sharpestTurn:c,inBounds:l}}function te(e,t,n){let r={x:t.x-e.x,y:t.y-e.y},i=A(r),a=j(r),o=[];if(i<=10)o.push([M(e,k(e,r,1/3),k(e,r,2/3),t)]);else{let n=Math.min(i*S,i*.9,640),r=Math.min(i*C,i*.9,640),s=k(e,D,n),c=k(t,D,-r);o.push([M(e,s,c,t)]),o.push([M(e,k(e,D,n*.65),k(t,D,-r*.65),t)]);let l=D.x*a.y-D.y*a.x<0?-1:1,u={x:a.y*l,y:-a.x*l},d=k({x:(e.x+t.x)/2,y:(e.y+t.y)/2},D,n*.16),f=Math.min(i*w,520),p=Math.min(i*T,440);for(let n of[.55,.8,1.05])for(let r of[.65,1,1.35])for(let i of[1,-1]){let l=k(d,u,f*n*i);o.push([M(e,s,k(l,a,-p*r),l),M(l,k(l,a,p*r),c,t)])}}let s=O((-.08-D.x*a.x-D.y*a.y)/.92);return o.map(e=>{let t=F(e,n),r=Math.max(0,t.length/Math.max(1,i)-1),a=e.length>1,o=t.length+320*r+140*t.turnEnergy+180*t.sharpestTurn+18*t.totalTurn+(a?45:0)+90*s,c=O(.42*O(r/.55)+.38*O(t.totalTurn/(1.4*Math.PI))+.2*O(t.turnEnergy/1.25))*.12,l=O((a?.9:1)*.9*((a?.04:0)+.28*s+.22*O((t.length-180)/760)+.42+c),.12,2.2);return{curves:e,...t,score:o,response:l}})}function I(e,t,n){let r=te(e,t,n),i=r.filter(e=>e.inBounds);return(i.length?i:r).reduce((e,t)=>t.score<e.score?t:e)}var L=(e=0)=>({value:e,velocity:0}),R=Math.atan2(D.y,D.x)*180/Math.PI,z=1600;function B(e,t,n,r,i){let a=2*Math.PI/n,o=r*a,s=a*Math.sqrt(1-r*r),c=e.value-t,l=(e.velocity+o*c)/s,u=Math.cos(s*i),d=Math.sin(s*i),f=Math.exp(-o*i);e.value=t+f*(c*u+l*d),e.velocity=f*(-o*(c*u+l*d)+s*(-c*d+l*u))}function V(e,t){return e+Math.atan2(Math.sin((t-e)*Math.PI/180),Math.cos((t-e)*Math.PI/180))*180/Math.PI}var ne=class{position;velocity={x:0,y:0};kind=`idle`;target;path;pathScale=1;progress=L();horizontal;vertical;axis=L();baseRotation=L();lean=L();stretch=L();heading=0;constructor(e){this.position={...e},this.target={...e},this.horizontal=L(e.x),this.vertical=L(e.y)}moveTo(e,t,n=!1){if(!Number.isFinite(e.x)||!Number.isFinite(e.y))return;if(this.target={...e},n){this.jumpTo(e);return}this.pathScale=Math.max(.001,t.z);let r=Math.hypot(e.x-this.position.x,e.y-this.position.y)*this.pathScale;if(r<.01&&Math.hypot(this.velocity.x,this.velocity.y)*this.pathScale<12){this.jumpTo(e);return}if(this.horizontal={value:this.position.x,velocity:this.velocity.x},this.vertical={value:this.position.y,velocity:this.velocity.y},this.kind=r<=196?`scoot`:`curve`,this.kind===`scoot`){this.path=void 0;return}let i=e=>({x:e.x*this.pathScale,y:e.y*this.pathScale});this.path=I(i(this.position),i(e),{x:-t.x,y:-t.y,width:t.width,height:t.height});let{derivative:a}=P(this.path,0),o=a.x**2+a.y**2,s=o?(this.velocity.x*a.x+this.velocity.y*a.y)*this.pathScale/o:0;this.progress={value:0,velocity:O(s,0,5/this.path.response)}}jumpTo(e){Object.assign(this.position,e),this.target={...e},this.velocity.x=this.velocity.y=0,this.horizontal=L(e.x),this.vertical=L(e.y),this.axis=L(),this.baseRotation=L(),this.lean=L(),this.stretch=L(),this.progress=L(),this.path=void 0,this.heading=0,this.kind=`idle`}translateBy(e,t){if(Number.isFinite(e)&&Number.isFinite(t)&&(e||t)&&(this.position.x+=e,this.position.y+=t,this.target.x+=e,this.target.y+=t,this.horizontal.value+=e,this.vertical.value+=t,this.path)){let n=n=>({x:n.x+e*this.pathScale,y:n.y+t*this.pathScale});this.path.curves=this.path.curves.map(e=>({start:n(e.start),outgoing:n(e.outgoing),incoming:n(e.incoming),end:n(e.end)}))}}advance(e,t=this.pathScale){if(!(e>0)||!Number.isFinite(e)||this.kind===`idle`&&this.deformationSettled())return!1;if(this.kind===`scoot`)B(this.horizontal,this.target.x,.24,.84,e),B(this.vertical,this.target.y,.24,.84,e),this.position.x=this.horizontal.value,this.position.y=this.vertical.value,this.velocity.x=this.horizontal.velocity,this.velocity.y=this.vertical.velocity;else if(this.kind===`curve`&&this.path){B(this.progress,1,this.path.response,.9,e);let{point:t,derivative:n,heading:r}=P(this.path,this.progress.value);this.position.x=t.x/this.pathScale,this.position.y=t.y/this.pathScale;let i=this.progress.value>=1?0:this.progress.velocity/this.pathScale;this.velocity.x=n.x*i,this.velocity.y=n.y*i,this.heading=V(this.heading,Math.atan2(r.y,r.x)*180/Math.PI-R)}let n=Math.hypot(this.velocity.x,this.velocity.y)*t,r=this.kind===`scoot`?O(n/z):0,i=n>12?Math.atan2(this.velocity.y,this.velocity.x)*180/Math.PI:this.axis.value;B(this.axis,V(this.axis.value,i),.07,.82,e),B(this.baseRotation,this.kind===`curve`?this.heading:V(this.baseRotation.value,0),.09,.86,e),B(this.stretch,r,.095,.72,e);let a=n>12?O(this.velocity.x*t/n*76*r,-76,76):0;return B(this.lean,a,.055,.76,e),Math.hypot(this.target.x-this.position.x,this.target.y-this.position.y)*t<.05&&n<12&&(this.kind!==`curve`||Math.abs(this.progress.value-1)<.001)&&(Object.assign(this.position,this.target),this.velocity.x=this.velocity.y=0,this.kind=`idle`,this.path=void 0),this.kind===`idle`&&this.deformationSettled()&&(this.baseRotation=L(),this.lean=L(),this.stretch=L()),!0}deformationSettled(){let e=V(0,this.baseRotation.value);return Math.abs(e)<.01&&Math.abs(this.baseRotation.velocity)<.1&&Math.abs(this.lean.value)<.01&&Math.abs(this.lean.velocity)<.1&&Math.abs(this.stretch.value)<1e-4&&Math.abs(this.stretch.velocity)<.001}get bodyTransform(){let e=O(this.stretch.value,0,1);return`rotate(${this.baseRotation.value+this.lean.value}deg) rotate(${this.axis.value}deg) scale(${1+.38*e}, ${1-.18*e}) rotate(${-this.axis.value}deg)`}},re={wide:{width:1280,height:720,columns:3},narrow:{width:640,height:760,columns:2}},H=440,U=340,W={top:84,right:64,bottom:64,left:64},G=[1,2,3,4,5,6],K=[{name:`Avery Kim`,color:`#3b82f6`},{name:`Mo Rivera`,color:`#10b981`},{name:`Jules Sato`,color:`#f59e0b`}],ie=[[`AK`,`#3b82f6`,`Avery Kim`,`commented on Checkout redesign`,`2m`],[`MR`,`#10b981`,`Mo Rivera`,`approved your pull request`,`14m`],[`JS`,`#f59e0b`,`Jules Sato`,`shared Q4 roadmap with you`,`1h`],[`TN`,`#ef4444`,`Tess Novak`,`mentioned you in Launch plan`,`3h`],[`RO`,`#8b5cf6`,`Rae Okafor`,`invited you to Brand review`,`5h`],[`LB`,`#0ea5e9`,`Lee Brandt`,`resolved your comment`,`1d`],[`NH`,`#ec4899`,`Noor Haddad`,`added you to Onboarding`,`2d`],[`IC`,`#14b8a6`,`Ines Costa`,`replied to your comment`,`2d`],[`DV`,`#f97316`,`Dev Varma`,`shared Pricing page with you`,`3d`]],ae=`#e5484d`,oe=5,se=_(.45,.28),ce=_(1.1,0),le=_(.3,0),q=(e,t)=>({x:e%t*496,y:Math.floor(e/t)*412});function ue(e,t,n){let r=.5,i=e-.5,a=t-.5;return`M ${r+n} ${r} H ${i-n} A ${n} ${n} 0 0 1 ${i} ${r+n} V ${a-n} A ${n} ${n} 0 0 1 ${i-n} ${a} H ${r+n} A ${n} ${n} 0 0 1 ${r} ${a-n} V ${r+n} A ${n} ${n} 0 0 1 ${r+n} ${r} Z`}function de({version:e,rows:t=4}){return(0,y.jsxs)(`div`,{className:`ld-design`,"data-v":e,children:[(0,y.jsx)(`h1`,{children:`Notifications`}),ie.slice(0,t).map(([e,t,n,r,i])=>(0,y.jsxs)(`div`,{className:`ld-n`,children:[(0,y.jsx)(`span`,{className:`ld-av`,style:{background:t},children:e}),(0,y.jsxs)(`div`,{children:[(0,y.jsx)(`div`,{className:`ld-t`,children:n}),(0,y.jsx)(`div`,{className:`ld-d`,children:r})]}),(0,y.jsx)(`span`,{className:`ld-w`,children:i})]},n))]})}function J({color:e,name:n,id:r}){return(0,y.jsxs)(`div`,{className:`cursor ld-cursor`,"data-cursor":r,style:{color:e},children:[(0,y.jsx)(`svg`,{width:`22`,height:`22`,viewBox:`0 0 24 24`,children:(0,y.jsx)(`path`,{d:t,fill:`currentColor`,stroke:`#fff`,strokeWidth:`1.5`,strokeLinejoin:`round`})}),n&&(0,y.jsx)(`span`,{className:`cursor-label`,style:{background:e},children:n})]})}function fe({id:e,person:t,text:n}){let{name:r,color:i}=K[t];return(0,y.jsxs)(`div`,{className:`comment-pin ld-pin`,"data-pin":e,children:[(0,y.jsx)(o,{name:r,picture:null,color:i}),(0,y.jsxs)(`span`,{className:`comment-pin-preview`,children:[(0,y.jsxs)(`span`,{className:`comment-pin-head`,children:[(0,y.jsx)(`b`,{children:r}),` `,(0,y.jsx)(`span`,{className:`muted`,children:`now`})]}),(0,y.jsx)(`span`,{className:`comment-pin-text`,children:n})]})]})}function pe(e,t){let n=re[t],r=t=>e.querySelector(t),i=r(`.ld-world`),a=r(`[data-zoom]`),o=r(`.ld-scene`),s=r(`.faces`),c=r(`.share-button`),l=r(`.share-sharing`),u=r(`.share-sharing i`),d=r(`.share-split`),f=r(`.ld-strokes path`),p=[...e.querySelectorAll(`.ld-frame`)],h=[...s.children],g={a:r(`[data-pin="a"]`),b:r(`[data-pin="b"]`)},ee={width:n.width,height:n.height,x:0,y:0,z:1},v=new Set,y=0,b=0,x=!1,S=e=>{y=requestAnimationFrame(S);let t=Math.min(50,e-b);b=e;for(let e of v)e(t)||v.delete(e)},C=e=>{e!==x&&(x=e,cancelAnimationFrame(y),e&&(b=performance.now(),y=requestAnimationFrame(S)))},w=e=>new Promise(t=>{let n=e;v.add(e=>(n-=e,n>0||(t(),!1)))}),T=(e,t)=>new Promise(n=>{let r=0;v.add(i=>(r+=i,r<e.ms?(t(e.at(r)),!0):(t(1),n(),!1)))}),E=(e,t)=>T({ms:e,at:t=>t/e,css:``},t),D={x:0,y:0,z:1},O=e=>{D=e,i.style.transform=`translate(${e.x}px, ${e.y}px) scale(${e.z})`,i.style.setProperty(`--inv`,String(1/e.z)),i.style.setProperty(`--zoom`,String(e.z)),a.textContent=`${Math.round(e.z*100)}%`},k=e=>{let t=G.slice(0,e).map((e,t)=>q(t,n.columns)),r=Math.max(...t.map(e=>e.x))+H,i=Math.max(...t.map(e=>e.y))+U,a={width:n.width-W.left-W.right,height:n.height-W.top-W.bottom},o=Math.min(1,a.width/r,a.height/i);return{z:o,x:W.left+(a.width-r*o)/2,y:W.top+(a.height-i*o)/2}},A=e=>{let t=D;return T(ce,n=>O({x:t.x+(e.x-t.x)*n,y:t.y+(e.y-t.y)*n,z:t.z+(e.z-t.z)*n}))},j=(e,t,r,i=k(G.length))=>{let a=q(e-1,n.columns);return{x:i.x+(a.x+H*t)*i.z,y:i.y+(a.y+U*r)*i.z}},M=e=>{let t=r(`[data-cursor="${e}"]`),n=t.querySelector(`svg`),i=new ne({x:0,y:0}),a=()=>{t.style.transform=`translate3d(${i.position.x}px, ${i.position.y}px, 0)`,n.style.transform=i.bodyTransform};return v.add(e=>(i.advance(e/1e3,1),a(),!0)),{el:t,place(e){i.jumpTo(e),t.style.opacity=`1`,a()},hide(){t.style.opacity=`0`},move(e){return i.moveTo(e,ee),new Promise(e=>v.add(()=>i.kind!==`idle`||(e(),!1)))}}},N=M(`you`),P=[M(`0`),M(`1`),M(`2`)],F=e=>T(se,t=>{e.style.opacity=String(Math.min(1,t*1.6)),e.style.scale=String(.6+.4*t)}),te=async e=>{await E(90,t=>{e.style.scale=String(1-.05*t)}),await E(120,t=>{e.style.scale=String(.95+.05*t)})},I=e=>(s.style.display=``,e.style.display=``,F(e)),L=(e,t)=>{e.style.left=`${t.x}px`,e.style.top=`${t.y}px`},R=()=>{let e=j(3,.5,.5),t=k(G.length),n=H*t.z*.56,r=U*t.z*.58;return Array.from({length:110},(t,i)=>{let a=i/109,o=-2.4+a*1.85*Math.PI*2,s=1+.06*Math.sin(a*9)+a*.05;return[e.x+Math.cos(o)*n*s+a*8,e.y+Math.sin(o)*r*s-a*6,.5]})},z=()=>{for(let e of p)e.style.opacity=`0`,e.style.scale=`0.6`;for(let e of h)e.style.opacity=`0`,e.style.scale=`0.6`,e.style.display=`none`;s.style.display=`none`;for(let e of Object.values(g))e.style.opacity=`0`,e.style.scale=`0.6`,e.classList.remove(`expanded`);for(let e of[N,...P])e.hide();c.style.display=``,l.style.display=`none`,d.style.display=`none`,f.setAttribute(`d`,``),o.style.opacity=`1`,s.style.opacity=`1`,O(k(1))},B=()=>{for(let e of[...p,...h,...Object.values(g)])e.style.opacity=`1`,e.style.scale=`1`;for(let e of h)e.style.display=``;s.style.display=``,L(g.a,j(2,.72,.34)),L(g.b,j(5,.3,.36)),g.b.classList.add(`expanded`),O(k(G.length)),f.setAttribute(`d`,m({points:R(),size:oe})),P[0].place(j(2,.34,.8)),P[1].place(j(5,.86,.7)),P[2].place(j(3,.92,.9))},V=async()=>{let t=1500;for(;;){z(),await w(t),t=500;for(let e=0;e<p.length;e++)F(p[e]),e&&A(k(e+1)),await w(e?720:1e3);await w(700),N.place({x:n.width*.74,y:n.height+30});let r=e.getBoundingClientRect(),i=r.width/n.width;await N.move((e=>{let t=e.getBoundingClientRect();return{x:(t.left+t.width/2-r.left)/i,y:(t.top+t.height/2-r.top)/i}})(c)),await te(c),c.style.display=`none`,l.style.display=``,u.style.width=`6%`,await T(_(1,0),e=>{u.style.width=`${6+94*e}%`}),l.style.display=`none`,d.style.display=``,d.dataset.copied=``,N.move(j(1,.8,1.08)),await w(1e3),delete d.dataset.copied,P[0].place({x:-30,y:n.height*.42}),I(h[2]),await P[0].move(j(2,.72,.34)),P[1].place({x:n.width*.3,y:n.height+30}),I(h[1]),L(g.a,j(2,.72,.34)),F(g.a),P[0].move(j(2,.34,.8)),await P[1].move(j(5,.3,.36)),L(g.b,j(5,.3,.36)),await F(g.b),await w(250),g.b.classList.add(`expanded`),P[1].move(j(5,.86,.7));let a=R();P[2].place({x:n.width+30,y:n.height*.3}),I(h[0]),await P[2].move({x:a[0][0],y:a[0][1]}),await E(1500,e=>{let t=Math.max(2,Math.ceil(e*a.length));f.setAttribute(`d`,m({points:a.slice(0,t),size:oe}));let[n,r]=a[t-1];P[2].place({x:n,y:r})}),await w(400),P[2].move(j(3,.92,.9)),await w(1400),P[0].move(j(1,.5,.42)),await w(1100),P[1].move(j(4,.72,.62)),await w(2200),await E(420,e=>{o.style.opacity=String(1-e),s.style.opacity=String(1-e)}),await T(le,()=>{})}};if(matchMedia(`(prefers-reduced-motion: reduce)`).matches)return z(),B(),()=>{};V();let K=new IntersectionObserver(([e])=>C(e.isIntersecting));return K.observe(e),()=>{K.disconnect(),C(!1),v.clear()}}function me(){let e=(0,v.useRef)(null),t=(0,v.useRef)(null),[n,c]=(0,v.useState)(0),d=n&&n<720?`narrow`:`wide`,m=re[d];(0,v.useLayoutEffect)(()=>{let t=new ResizeObserver(([e])=>c(e.contentRect.width));return t.observe(e.current),()=>t.disconnect()},[]),(0,v.useEffect)(()=>{if(n)return pe(t.current,d)},[d,n>0]);let g=n/m.width,_=25*g,[ee]=(0,v.useState)(()=>window.innerWidth*1.15/Math.min(1200,window.innerWidth-32)),b=(0,v.useMemo)(()=>G.map((e,t)=>q(t,m.columns)),[m.columns]);return(0,y.jsxs)(`div`,{ref:e,className:`ld-shell`,style:{height:n?m.height*g:void 0,borderRadius:_,"--ld-from":ee},"aria-hidden":`true`,children:[n>0&&(0,y.jsx)(`svg`,{className:`ld-draw`,children:(0,y.jsx)(`path`,{d:ue(n,m.height*g,_-.5),pathLength:`1`})}),n>0&&(0,y.jsxs)(`div`,{ref:t,className:`ld-stage ld-${d}`,style:{width:m.width,height:m.height,transform:`scale(${g})`},children:[(0,y.jsxs)(`div`,{className:`ld-scene`,children:[(0,y.jsx)(`div`,{className:`world ld-world`,children:G.map((e,t)=>(0,y.jsxs)(`div`,{className:`frame ld-frame`,style:{left:b[t].x,top:b[t].y,width:H,height:U},children:[(0,y.jsx)(`div`,{className:`frame-title`,children:(0,y.jsxs)(`span`,{children:[`V`,e]})}),(0,y.jsx)(`div`,{className:`frame-surface`,children:(0,y.jsx)(de,{version:e})})]},e))}),(0,y.jsx)(`svg`,{className:`ld-strokes`,width:m.width,height:m.height,children:(0,y.jsx)(`path`,{fill:ae})}),(0,y.jsx)(fe,{id:`a`,person:0,text:``}),(0,y.jsx)(fe,{id:`b`,person:1,text:`Can we try this one darker?`})]}),(0,y.jsx)(`div`,{className:`chrome shell top-left ld-rise`,children:(0,y.jsx)(`span`,{className:`canvas-name`,children:`Notification Explorations`})}),(0,y.jsx)(`div`,{className:`chrome shell toolbar ld-rise`,children:(0,y.jsx)(`div`,{className:`toolbar-clip`,children:(0,y.jsxs)(`div`,{className:`toolbar-row`,children:[(0,y.jsx)(`span`,{className:`tool-slider`,style:{width:50}}),(0,y.jsxs)(`span`,{className:`tool mode-tool`,"aria-pressed":`true`,children:[(0,y.jsx)(a,{size:18}),(0,y.jsx)(`span`,{className:`mode-chevron`,children:(0,y.jsx)(h,{size:12})})]}),(0,y.jsx)(`span`,{className:`tool`,children:(0,y.jsx)(l,{size:18})}),(0,y.jsx)(`span`,{className:`tool`,children:(0,y.jsx)(r,{size:18})}),(0,y.jsx)(`span`,{className:`shell-divider`}),(0,y.jsx)(`span`,{className:`tool`,children:(0,y.jsx)(p,{size:18})})]})})}),(0,y.jsxs)(`div`,{className:`chrome shell top-right ld-rise`,children:[(0,y.jsx)(`div`,{className:`faces`,children:[2,1,0].map(e=>(0,y.jsx)(`span`,{className:`face-button`,children:(0,y.jsx)(o,{name:K[e].name,picture:null,color:K[e].color})},e))}),(0,y.jsx)(`span`,{className:`primary-button share-button`,children:`Share`}),(0,y.jsxs)(`span`,{className:`primary-button share-sharing`,style:{display:`none`},children:[(0,y.jsx)(`i`,{}),(0,y.jsx)(`span`,{children:`Share`})]}),(0,y.jsxs)(`span`,{className:`share-split`,style:{display:`none`},children:[(0,y.jsxs)(`span`,{className:`primary-button`,children:[(0,y.jsxs)(`span`,{className:`ld-copied`,children:[(0,y.jsx)(f,{size:14}),`Copied`]}),(0,y.jsx)(`span`,{className:`ld-copy`,children:`Copy link`})]}),(0,y.jsx)(`span`,{className:`primary-button`,children:(0,y.jsx)(h,{size:14})})]})]}),(0,y.jsxs)(`div`,{className:`chrome shell zoom ld-rise`,children:[(0,y.jsx)(`span`,{className:`icon-button`,children:(0,y.jsx)(s,{})}),(0,y.jsx)(`span`,{className:`shell-divider`}),(0,y.jsx)(`span`,{className:`icon-button`,children:(0,y.jsx)(i,{})}),(0,y.jsx)(`span`,{className:`zoom-value`,"data-zoom":!0,children:`100%`}),(0,y.jsx)(`span`,{className:`icon-button`,children:(0,y.jsx)(u,{})})]}),(0,y.jsxs)(`div`,{className:`ld-cursors`,children:[(0,y.jsx)(J,{id:`0`,color:K[0].color,name:K[0].name}),(0,y.jsx)(J,{id:`1`,color:K[1].color,name:K[1].name}),(0,y.jsx)(J,{id:`2`,color:K[2].color,name:K[2].name}),(0,y.jsx)(J,{id:`you`,color:`#000`})]})]},d)]})}var Y=[[0,6],[.4,13],[.75,19],[.88,20.2],[1,22]],he=Y[1][0],ge=e=>Math.min(1,Math.max(0,e)),X=e=>{let t=Math.max(1,Y.findIndex(([t])=>t>=e)),[n,r]=Y[t-1],[i,a]=Y[t];return r+(e-n)/(i-n)*(a-r)},_e=e=>{if(e<Y[0][1]||e>=Y[Y.length-1][1])return 1;let t=Y.findIndex(([,t])=>t>=e);if(t<=0)return 0;let[n,r]=Y[t-1],[i,a]=Y[t];return n+(e-r)/(a-r)*(i-n)},ve=[[0,0],[.12,.5],[.28,1],[.58,.5],[.72,0],[.84,null]],ye=e=>[...ve].reverse().find(([t])=>e>=t)[1],be=Array.from({length:8},(e,t)=>{let n=t*Math.PI/4,r=e=>`${(12+Math.cos(n)*e).toFixed(2)} ${(12+Math.sin(n)*e).toFixed(2)}`;return`M${r(8.2)}L${r(10.6)}`}).join(``);function xe({rays:e}){let t=(0,v.useId)(),n=e===null;return(0,y.jsxs)(`svg`,{className:`light-glyph`,viewBox:`0 0 24 24`,"aria-hidden":`true`,children:[(0,y.jsxs)(`mask`,{id:t,children:[(0,y.jsx)(`rect`,{x:`-4`,y:`-4`,width:`32`,height:`32`,fill:`#fff`}),(0,y.jsx)(`circle`,{className:`light-cut`,cx:`6.5`,cy:`17.5`,r:`8`,fill:`#000`,style:{transform:n?`none`:`translate(-9px, 9px)`}})]}),(0,y.jsxs)(`g`,{className:`light-turn`,style:{transform:`rotate(${n?180:0}deg)`},children:[(0,y.jsx)(`circle`,{className:`light-core`,cx:`12`,cy:`12`,r:`9`,fill:`currentColor`,mask:`url(#${t})`,style:{transform:`scale(${n?1:.56})`,opacity:n?1:.7+.3*e}}),(0,y.jsx)(`path`,{className:`light-rays`,d:be,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,style:{transform:n?`rotate(-90deg) scale(0.5)`:`scale(${.74+.26*e})`,opacity:n?0:.55+.45*e}})]})]})}function Se({hour:e,onHour:t}){let[n,r]=(0,v.useState)(!1),[i,a]=(0,v.useState)(!1),[o,s]=(0,v.useState)(!1),c=(0,v.useRef)(null),l=n||i||o,u=_e(e),d=e=>{let n=c.current.getBoundingClientRect();t(X(ge((e.clientX-n.left)/n.width)))},f=e=>{e.currentTarget.setPointerCapture(e.pointerId),s(!0),d(e)},p=e=>{let n={ArrowLeft:-.05,ArrowDown:-.05,ArrowRight:.05,ArrowUp:.05}[e.key];n!==void 0&&(e.preventDefault(),t(X(ge(u+n))))},m=u>.85;return(0,y.jsx)(`div`,{className:`light-switch`,"data-open":l||void 0,"data-dragging":o||void 0,style:{"--x":u},onPointerEnter:e=>e.pointerType===`mouse`&&r(!0),onPointerLeave:e=>e.pointerType===`mouse`&&r(!1),onFocus:e=>e.target.matches(`:focus-visible`)&&a(!0),onBlur:()=>a(!1),children:(0,y.jsxs)(`div`,{className:`light-pill`,children:[(0,y.jsx)(`div`,{ref:c,className:`light-track`,role:`slider`,"aria-label":`Time of day`,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(u*100),"aria-valuetext":m?`Night`:u<he?`Morning`:`Evening`,tabIndex:0,onPointerDown:f,onPointerMove:e=>o&&d(e),onPointerUp:()=>s(!1),onPointerCancel:()=>s(!1),onKeyDown:p,children:(0,y.jsx)(`span`,{className:`light-dot`})}),(0,y.jsx)(`button`,{type:`button`,className:`light-toggle`,"aria-label":m?`Switch to day`:`Switch to night`,onClick:()=>t(X(m?he:1)),children:(0,y.jsx)(xe,{rays:ye(u)})})]})})}var Ce=[[0,`#1f283c`,`#0f1421`,`#2a3755`,`#0c1220`],[4.5,`#1a2132`,`#0d111d`,`#25304c`,`#0a0f1b`],[5.5,`#555b7c`,`#2c3149`,`#8f91b4`,`#3a4252`],[6.5,`#efc4ae`,`#8a7a84`,`#ffe1c9`,`#a79a78`],[7.5,`#f8e2c8`,`#a89c94`,`#fff5e4`,`#b9c39a`],[10,`#fcfaf4`,`#adaca6`,`#ffffff`,`#c9d8bb`],[13,`#ffffff`,`#acadac`,`#ffffff`,`#d3e0c8`],[16,`#faf2e3`,`#aaa193`,`#fffbf1`,`#c7d0a7`],[18,`#e9bd95`,`#a07f62`,`#ffdcb2`,`#a89a62`],[19,`#da9570`,`#7a5a50`,`#ffb78c`,`#6d5f4b`],[19.75,`#84678a`,`#4a4262`,`#b78fa8`,`#3b3550`],[20.75,`#2f3756`,`#1a1f33`,`#3f4a70`,`#141a2c`],[24,`#1f283c`,`#0f1421`,`#2a3755`,`#0c1220`]],we=e=>[1,3,5].map(t=>(parseInt(e.slice(t,t+2),16)/255)**2.2),Te=e=>`#${e.map(e=>Math.round(e**(1/2.2)*255).toString(16).padStart(2,`0`)).join(``)}`,Ee=new URLSearchParams(location.search).get(`hour`),De=()=>{if(Ee!==null)return Number(Ee);let e=new Date;return e.getHours()+e.getMinutes()/60};function Oe(){let[e,t]=(0,v.useState)(De);return(0,v.useEffect)(()=>{let e=()=>t(De()),n=window.setInterval(e,3e4);return document.addEventListener(`visibilitychange`,e),()=>{window.clearInterval(n),document.removeEventListener(`visibilitychange`,e)}},[]),e}function ke(e){let{lit:t,shade:n}=Ae(e),[r,i,a]=t.map((e,t)=>n[t]+(e-n[t])*.6);return{lit:Te(t),shade:Te(n),dark:.2126*r+.7152*i+.0722*a<.18}}function Ae(e){let t=Math.max(1,Ce.findIndex(([t])=>t>=e)),[n,...r]=Ce[t-1],[i,...a]=Ce[t],o=(e-n)/(i-n),s=o*o*(3-2*o),[c,l,u,d]=r.map((e,t)=>{let n=we(a[t]);return we(e).map((e,t)=>e+(n[t]-e)*s)}),f=2*Math.PI*(e-12.5)/24,p=(9+36*Math.abs(Math.cos(f)))*Math.PI/180,m=Math.sin(f)*52*Math.PI/180;return{lit:c,shade:l,sky:u,leaf:d,sun:[-Math.cos(p)*Math.cos(m),Math.sin(p),Math.cos(p)*Math.sin(m)]}}var Z={wind:1.1,gust:1,flutter:1.65,leafSize:1,shadow:.55,softness:1,sun:.61,skyLeaves:.29},je=`#version 300 es
-in vec2 a;
-void main() { gl_Position = vec4(a, 0., 1.); }`,Me=`#version 300 es
-precision highp float;
-out vec4 fragColor;
-uniform vec2 uRes;
-uniform float uTime;
-uniform vec3 uSun, uLit, uShade, uSky, uLeaf;
-uniform sampler2D uLeaves;
-// Tuning, from LIGHT below.
-uniform float uGust, uFlutter, uLeafSize, uShadow, uSoft, uSunStrength, uSkyLeaves;
-
-// How far the corners melt. Lower is softer.
-const float CORNER = 5.5;
-// Half the height of the box, and how much of the screen its far wall fills.
-const float HALF = 3.;
-const float FAR_WALL = .5;
-
-float dither(vec2 p) {
-  vec3 h = fract(p.xyx * .1031);
-  h += dot(h, h.yzx + 33.33);
-  return fract((h.x + h.y) * h.z);
-}
-
-float band(float x, float a, float b, float soft) {
-  return smoothstep(a - soft, a + soft, x) * (1. - smoothstep(b - soft, b + soft, x));
-}
-
-// Wind moving through the trees: gusts travel along the canopy, leaning the branches as they pass,
-// stirring the leaves and opening small gaps that let more light through.
-float foliage(vec2 zy) {
-  float t = uTime;
-  float gust = sin(t * .42 - zy.x * .3) + .6 * sin(t * .67 - zy.x * .5 + zy.y * .2 + 1.3);
-  float stir = (.12 + .2 * abs(gust)) * uFlutter;
-  vec2 lean = .6 * gust * uGust * vec2(1., .3);
-  vec2 flutter = stir * vec2(sin(t * 1.3 + zy.y * 1.7), cos(t * 1.1 + zy.x * 1.5));
-  float near = texture(uLeaves, (zy + lean + flutter) * .21 / uLeafSize + vec2(.17, .31)).r;
-  float far = texture(uLeaves, (zy + lean * .4 + flutter * .3) * .09 / uLeafSize + vec2(.61, .09)).r;
-  float gap = .03 * gust;
-  return max(smoothstep(.1 + gap, .42 + gap, near), .75 * smoothstep(.1, .4, far));
-}
-
-// Sun reaching a point through a tall opening down the left side, then through the leaves.
-// The further the light has travelled from the opening, the wider its edges.
-float sunlight(vec3 p, float wall) {
-  vec3 hit = p + uSun * ((-wall - p.x) / uSun.x);
-  float soft = (.25 + .07 * length(hit - p)) * uSoft;
-  float open = band(hit.y, -HALF + .3, HALF - .3, soft) * band(hit.z, -30., 60., soft);
-  float bar = mod(hit.z, 4.) - 2.;
-  open *= 1. - min(1., .22 / soft) * exp(-bar * bar / (soft * soft));
-  vec3 leaf = p + uSun * ((-wall - 3. - p.x) / uSun.x);
-  return open * (1. - uShadow * foliage(leaf.zy));
-}
-
-void main() {
-  float aspect = uRes.x / uRes.y;
-  vec2 p = (gl_FragCoord.xy - uRes * .5) / uRes.y;
-
-  // The far wall has the same shape as the screen, so the corners run straight to the screen's corners.
-  vec2 back = vec2(aspect, 1.) * .5 * FAR_WALL;
-  float wall = HALF * aspect;
-  float depth = HALF / back.y;
-
-  // How far past the far wall's outline this pixel is, and how much it belongs to each face.
-  vec2 reach = abs(p) / back;
-  vec3 weights = exp(CORNER * vec3(reach, 1.));
-  weights /= weights.x + weights.y + weights.z;
-  float besides = weights.x;
-  float above = weights.y;
-  float ahead = weights.z;
-
-  float leftFace = besides * (1. - smoothstep(-.1, .1, p.x / back.x));
-  float rightFace = besides - leftFace;
-  float floorFace = above * (1. - smoothstep(-.1, .1, p.y / back.y));
-  float ceilingFace = above - floorFace;
-
-  // Points on each face, for the sun.
-  float tWall = min(wall / max(abs(p.x), .01), depth);
-  float tFlat = min(HALF / max(abs(p.y), .01), depth);
-  vec3 onRight = vec3(wall, p.y * tWall, tWall);
-  vec3 onLeft = vec3(-wall, p.y * tWall, tWall);
-  vec3 onFloor = vec3(p.x * tFlat, -HALF, tFlat);
-  vec3 onBack = vec3(p.x * depth, p.y * depth, depth);
-
-  // Daylight fills the box from the left, thinning toward the right.
-  float x = p.x / (back.x * 2.);
-  float fill = 1. - .55 * smoothstep(-1.2, 1.5, x);
-  fill *= leftFace + floorFace + ahead * .9 + ceilingFace * .74 + rightFace * .8;
-
-  // The corners are only a slight gathering of shade where two faces meet.
-  float crease = 1. - max(besides, max(above, ahead));
-  fill *= 1. - crease * .3;
-  vec3 color = mix(uShade, uLit, fill);
-
-  // Sun.
-  vec3 s = uSun;
-  float sun = 0.;
-  if (floorFace > .02) sun += floorFace * sunlight(onFloor, wall) * min(1., s.y * 3.);
-  if (ahead > .02) sun += ahead * sunlight(onBack, wall) * min(1., max(-s.z, 0.) * 2.5);
-  if (rightFace > .02) sun += rightFace * sunlight(onRight, wall) * min(1., -s.x * 2.);
-  color += uLit * sun * uSunStrength;
-
-  // The left side is the light itself: bright sky with trees far out of focus.
-  color = mix(color, mix(uSky, uLeaf, foliage(onLeft.zy) * uSkyLeaves), leftFace);
-
-  color = pow(min(color, vec3(1.)), vec3(1. / 2.2));
-  // A single level of 8-bit noise: invisible, but it stops the gradients from banding.
-  color += (dither(gl_FragCoord.xy + 17.) - .5) / 255.;
-  fragColor = vec4(color, 1.);
-}`;function Ne(){let e=1024,t=document.createElement(`canvas`);t.width=t.height=e;let n=t.getContext(`2d`),r=606,i=()=>(r=r*16807%2147483647)/2147483647;n.fillStyle=`#000`,n.fillRect(0,0,e,e),n.fillStyle=n.strokeStyle=`#fff`,n.lineCap=`round`;for(let t=0;t<22;t++){let t=i()*e,r=i()*e,a=i()*Math.PI*2,o=260+i()*460;for(let e=0;e<o;e+=14){a+=(i()-.5)*.3;let s=t+Math.cos(a)*14,c=r+Math.sin(a)*14;if(n.lineWidth=Math.max(1.5,6*(1-e/o)),n.beginPath(),n.moveTo(t,r),n.lineTo(s,c),n.stroke(),t=s,r=c,!(i()>.42))for(let e of[-1,1]){if(i()>.8)continue;let o=a+e*(.5+i()*.7),s=34+i()*40;n.save(),n.translate(t+Math.cos(o)*s*.55,r+Math.sin(o)*s*.55),n.rotate(o),n.beginPath(),n.ellipse(0,0,s*.55,s*.2,0,0,Math.PI*2),n.fill(),n.restore()}}}return Pe(t)}function Pe(e){let t=document.createElement(`canvas`);t.width=t.height=128;let n=t.getContext(`2d`,{willReadFrequently:!0});n.drawImage(e,0,0,128,128);let r=n.getImageData(0,0,128,128),i=Float32Array.from({length:16384},(e,t)=>r.data[t*4]);for(let e=0;e<6;e++){let t=new Float32Array(16384);for(let n=0;n<128;n++)for(let r=0;r<128;r++){let a=0;for(let t=-13;t<=13;t++){let o=e%2?(n+t+128)%128*128+r:n*128+(r+t+128)%128;a+=i[o]}t[n*128+r]=a/27}i=t}return i.forEach((e,t)=>{r.data[t*4]=r.data[t*4+1]=r.data[t*4+2]=e}),n.putImageData(r,0,0),t}function Fe({hour:e}){let t=(0,v.useRef)(null),n=(0,v.useRef)(e),r=(0,v.useRef)(null);return(0,v.useEffect)(()=>{n.current=e,r.current?.()},[e]),(0,v.useEffect)(()=>{let e=t.current,i=e.getContext(`webgl2`,{antialias:!1,alpha:!1});if(!i)return;let a=i.createProgram();for(let[e,t]of[[i.VERTEX_SHADER,je],[i.FRAGMENT_SHADER,Me]]){let n=i.createShader(e);i.shaderSource(n,t),i.compileShader(n),i.attachShader(a,n)}i.bindAttribLocation(a,0,`a`),i.linkProgram(a),i.useProgram(a),i.bindBuffer(i.ARRAY_BUFFER,i.createBuffer()),i.bufferData(i.ARRAY_BUFFER,new Float32Array([-1,-1,3,-1,-1,3]),i.STATIC_DRAW),i.enableVertexAttribArray(0),i.vertexAttribPointer(0,2,i.FLOAT,!1,0,0),i.bindTexture(i.TEXTURE_2D,i.createTexture()),i.texImage2D(i.TEXTURE_2D,0,i.RGBA,i.RGBA,i.UNSIGNED_BYTE,Ne()),i.texParameteri(i.TEXTURE_2D,i.TEXTURE_MIN_FILTER,i.LINEAR),i.texParameteri(i.TEXTURE_2D,i.TEXTURE_WRAP_S,i.REPEAT),i.texParameteri(i.TEXTURE_2D,i.TEXTURE_WRAP_T,i.REPEAT);let o=e=>i.getUniformLocation(a,e),s=(t,n)=>{let{clientWidth:r,clientHeight:a}=e;(e.width!==r||e.height!==a)&&(e.width=r,e.height=a,i.viewport(0,0,r,a));let s=Ae(n);i.uniform2f(o(`uRes`),r,a),i.uniform1f(o(`uTime`),t),i.uniform1f(o(`uGust`),Z.gust),i.uniform1f(o(`uFlutter`),Z.flutter),i.uniform1f(o(`uLeafSize`),Z.leafSize),i.uniform1f(o(`uShadow`),Z.shadow),i.uniform1f(o(`uSoft`),Z.softness),i.uniform1f(o(`uSunStrength`),Z.sun),i.uniform1f(o(`uSkyLeaves`),Z.skyLeaves),i.uniform3fv(o(`uSun`),s.sun),i.uniform3fv(o(`uLit`),s.lit),i.uniform3fv(o(`uShade`),s.shade),i.uniform3fv(o(`uSky`),s.sky),i.uniform3fv(o(`uLeaf`),s.leaf),i.drawArrays(i.TRIANGLES,0,3)};if(matchMedia(`(prefers-reduced-motion: reduce)`).matches){r.current=()=>s(0,n.current);let t=new ResizeObserver(()=>s(0,n.current));return t.observe(e),()=>{r.current=null,t.disconnect()}}let c=n.current,l=performance.now(),u=l/1e3,d=requestAnimationFrame(function e(t){c+=(n.current-c)*(1-Math.exp((l-t)*.002)),u+=(t-l)/1e3*Z.wind,l=t,s(u,c),d=requestAnimationFrame(e)});return()=>cancelAnimationFrame(d)},[]),(0,y.jsx)(`canvas`,{ref:t,className:`window-light`,"aria-hidden":`true`})}var Ie=new URLSearchParams(location.search).get(`hero`)!==`1`,Le=(0,v.lazy)(()=>g(()=>import(`./LandingStage-DyrNB5Ea.js`),__vite__mapDeps([0,1,2,3]))),Re=[[`A`,`canvas`,`for`,`your`],[`agent’s`,`explorations`]],ze=_(.8,0),Be=_(1.1,0),Ve=.1,He=3,Ue=.14,Q=8,We=500,$=32,Ge=1500;function Ke(){let e=(0,v.useRef)(null),t=(0,v.useRef)(null);return(0,v.useEffect)(()=>{if(matchMedia(`(prefers-reduced-motion: reduce)`).matches)return;let n=[0,0,0,0],r=[0,0,0,0],i=0,a=!1,o=()=>{let e=!0;r.forEach((t,i)=>{r[i]=t+(n[i]-t)*Ue,Math.abs(n[i]-r[i])>.01&&(e=!1)}),e&&r.splice(0,4,...n);let[a,s,c,l]=r.map(e=>e.toFixed(2));t.current&&(t.current.style.transform=r.some(Boolean)?`perspective(${We}px) translate(${a}px, ${s}px) rotateX(${c}deg) rotateY(${l}deg)`:``),i=e?0:requestAnimationFrame(o)},s=()=>{i||=requestAnimationFrame(o)},c=(e,t)=>Math.max(-t,Math.min(t,e)),l=()=>{a&&(a=!1,n.fill(0),s())},u=t=>{if(t.pointerType!==`mouse`||!e.current)return;let r=e.current.getBoundingClientRect();if(t.clientX<=r.left-$||t.clientX>=r.right+$||t.clientY<=r.top-$||t.clientY>=r.bottom+$)return l();a=!0;let i=t.clientX-r.left-r.width/2,o=t.clientY-r.top-r.height/2;n[0]=c(i*Ve,He),n[1]=c(o*Ve,He),n[2]=c(-o/(r.height/2)*Q,Q),n[3]=c(i/(r.width/2)*Q,Q),s()};return window.addEventListener(`pointermove`,u),document.documentElement.addEventListener(`pointerleave`,l),()=>{cancelAnimationFrame(i),window.removeEventListener(`pointermove`,u),document.documentElement.removeEventListener(`pointerleave`,l)}},[]),[e,t]}function qe(){let[e,t]=(0,v.useState)(!1),n=(0,v.useRef)(0);(0,v.useEffect)(()=>()=>window.clearTimeout(n.current),[]);let r=()=>{t(!0),window.clearTimeout(n.current),n.current=window.setTimeout(()=>t(!1),Ge)};return[e,e=>{navigator.clipboard?.writeText(e).then(r).catch(()=>{})},r]}function Je(){let[e,t,n]=qe(),[r,i]=Ke();return(0,v.useEffect)(()=>(window.addEventListener(x,n),()=>window.removeEventListener(x,n)),[]),(0,y.jsx)(`span`,{ref:r,className:`landing-magnet`,children:(0,y.jsx)(`div`,{ref:i,className:`landing-cta`,children:(0,y.jsxs)(`button`,{type:`button`,className:`landing-button`,"data-copied":e||void 0,onClick:()=>t(d),children:[(0,y.jsxs)(`span`,{className:`landing-states`,children:[(0,y.jsxs)(`span`,{className:`landing-state`,children:[(0,y.jsx)(b,{}),(0,y.jsx)(`span`,{className:`landing-label`,children:`Copy agent prompt`})]}),(0,y.jsxs)(`span`,{className:`landing-state`,"aria-hidden":`true`,children:[(0,y.jsx)(`svg`,{className:`landing-check`,viewBox:`0 0 18 18`,children:(0,y.jsx)(`path`,{d:`M3.5 9.5 7.25 13.25 14.5 5`,pathLength:`1`})}),(0,y.jsx)(`span`,{className:`landing-done`,children:`Copied`})]})]}),(0,y.jsx)(`span`,{className:`landing-sr`,"aria-live":`polite`,children:e?`Copied`:``})]})})})}function Ye(){let e=0;return(0,y.jsx)(`h1`,{className:`landing-title`,children:Re.map((t,n)=>(0,y.jsxs)(v.Fragment,{children:[n>0&&(0,y.jsx)(`br`,{}),t.map(t=>(0,y.jsxs)(v.Fragment,{children:[(0,y.jsx)(`span`,{className:`landing-word`,style:{"--delay":`${100+e++*80}ms`},children:t}),` `]},t))]},n))})}function Xe(){let e=Oe(),[t,n]=(0,v.useState)(null),r=t??e,{lit:i,shade:a,dark:o}=ke(r);return(0,v.useEffect)(()=>{document.body.style.background=i,document.body.style.colorScheme=o?`dark`:`light`},[i,o]),(0,y.jsxs)(`div`,{className:`landing`,"data-dark":o||void 0,style:{"--lit":i,"--shade":a,"--word-ease":ze.css,"--word-ms":`${ze.ms}ms`,"--rise-ease":Be.css,"--rise-ms":`${Be.ms}ms`},children:[(0,y.jsx)(Fe,{hour:r}),(0,y.jsxs)(`nav`,{className:`landing-nav`,"aria-label":`Main`,children:[(0,y.jsx)(`a`,{className:`wordmark`,href:`/`,children:(0,y.jsx)(c,{})}),(0,y.jsxs)(`div`,{className:`landing-nav-end`,children:[(0,y.jsx)(Se,{hour:r,onHour:n}),(0,y.jsx)(`a`,{className:`landing-sign-in`,href:`/auth/google/start?next=/`,children:`Sign in`})]})]}),(0,y.jsxs)(`main`,{className:`landing-hero`,children:[(0,y.jsx)(Ye,{}),(0,y.jsx)(`p`,{className:`landing-body`,children:`Then share, comment, and huddle with one link.`}),(0,y.jsx)(`div`,{className:`landing-actions`,children:(0,y.jsx)(Je,{})}),Ie?(0,y.jsx)(`div`,{className:`landing-slot`,children:(0,y.jsx)(v.Suspense,{fallback:null,children:(0,y.jsx)(Le,{dark:o})})}):(0,y.jsx)(me,{})]}),(0,y.jsxs)(`footer`,{className:`landing-foot`,children:[(0,y.jsx)(`a`,{href:`/privacy`,children:`Privacy`}),(0,y.jsx)(`a`,{href:`/terms`,children:`Terms`})]})]})}export{Xe as Landing,x as t};