*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:#0a0a0a;width:100%;height:100%;overflow:hidden}.studio-credit{z-index:100;color:#e8e4dc57;letter-spacing:.08em;text-transform:uppercase;-webkit-user-select:text;user-select:text;font-family:ui-monospace,SF Mono,SFMono-Regular,Menlo,monospace;font-size:11px;text-decoration:none;transition:color .3s;position:fixed;bottom:28px;left:20px}.studio-credit:hover,.studio-credit:focus-visible{color:#e8e4dcd9}@media (width<=767px){.studio-credit{font-size:10px;bottom:22px;left:16px}}.grid-motion-wrap{-webkit-user-select:none;user-select:none;touch-action:none;overscroll-behavior:none;background:#0a0a0a;width:100vw;height:100dvh;overflow:hidden}.grid-motion-scene{justify-content:center;align-items:center;width:100%;height:100%;animation:1.2s ease-out both scene-fade-in;display:flex;position:relative;overflow:hidden}@keyframes scene-fade-in{0%{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}.grid-motion-scene:before{content:"";z-index:10;pointer-events:none;background:radial-gradient(#0000 30%,#0000008c 100%),linear-gradient(#00000040 0%,#0000 40% 60%,#00000059 100%);position:absolute;inset:0}.grid-motion-scene:after{content:"";z-index:11;pointer-events:none;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='150' height='150' filter='url(%23noise)'/%3E%3C/svg%3E");background-size:150px 150px;position:absolute;inset:0}.grid-motion-grid{transform-origin:50%;z-index:2;contain:layout style;flex-shrink:0;gap:10px;width:150vw;height:150vh;display:grid;position:relative}.grid-motion-row{will-change:transform;backface-visibility:hidden;gap:10px;display:grid;transform:translate(0,0)}.grid-motion-cell{position:relative}.grid-motion-item{aspect-ratio:1;opacity:.85;contain:paint;background:#111;border-radius:8px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.grid-motion-row:nth-child(odd) .grid-motion-item{opacity:.7}.grid-motion-image{background-position:50%;background-repeat:no-repeat;background-size:cover;position:absolute;inset:0}.grid-motion-text{text-align:center;color:#fff;z-index:1;padding:16px;font-size:1.25rem}@media (hover:hover){.grid-motion-item{transition:opacity .4s}.grid-motion-item:hover,.grid-motion-row:nth-child(odd) .grid-motion-item:hover{opacity:1}}@media (width<=767px){.grid-motion-grid{gap:6px;width:180vw;height:160vh}.grid-motion-row{gap:6px}.grid-motion-item{opacity:.8;border-radius:6px}.grid-motion-row:nth-child(odd) .grid-motion-item{opacity:.6}.grid-motion-scene:before{background:radial-gradient(#0000 20%,#0009 100%),linear-gradient(#0000004d 0%,#0000 35% 65%,#0006 100%)}.grid-motion-scene:after{opacity:.03}}.note{--ink:#0a0a0a;--recess:#070707;--rule:#e8e4dc1c;--rule-soft:#e8e4dc12;--bone:#e8e4dc;--bone-dim:#e8e4dc8f;--bone-faint:#e8e4dc57;--mono:ui-monospace, "SF Mono", SFMono-Regular, Menlo, monospace;--serif:"Iowan Old Style", Palatino, "Palatino Linotype", ui-serif, Georgia, serif;z-index:100;-webkit-user-select:text;user-select:text;touch-action:auto;flex-direction:column;align-items:flex-end;gap:14px;display:flex;position:fixed;bottom:20px;right:20px}.note-coin{background:var(--ink);cursor:pointer;border:0;border-radius:999px;flex-shrink:0;place-items:center;width:58px;height:58px;padding:0;transition:box-shadow .3s,transform .45s cubic-bezier(.16,1,.3,1);display:grid;position:relative;box-shadow:0 0 0 1px #e8e4dc24,0 10px 28px #000000b3}.note-coin-face{filter:saturate(.85)brightness(.9);background:url(/images/26Studio-300.png) 50%/104% no-repeat;border-radius:999px;transition:filter .3s;animation:22s linear infinite note-spin;position:absolute;inset:2px}@keyframes note-spin{to{transform:rotate(360deg)}}.note-coin-gloss{pointer-events:none;background:linear-gradient(155deg,#ffffff24 0%,#0000 38%);border-radius:999px;position:absolute;inset:2px;box-shadow:inset 0 1px 1px #fff6,inset 0 -3px 6px #0000008c,inset 0 0 0 1px #00000059}.note-wave{border:1px solid var(--bone);opacity:0;pointer-events:none;animation:4.2s cubic-bezier(.24,.6,.28,1) infinite note-pulse;animation-delay:calc(var(--w) * 1.4s);border-radius:999px;position:absolute;inset:0}@keyframes note-pulse{0%{opacity:.34;transform:scale(1)}70%{opacity:0}to{opacity:0;transform:scale(1.9)}}.note-coin-hint{white-space:nowrap;font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--bone-dim);opacity:0;pointer-events:none;font-size:.5625rem;transition:opacity .28s,transform .28s cubic-bezier(.16,1,.3,1);position:absolute;right:calc(100% + 14px);transform:translate(6px)}@media (hover:hover){.note-coin:hover{box-shadow:0 0 0 1px #e8e4dc52,0 10px 28px #000000b3}.note-coin:hover .note-coin-face{filter:saturate()brightness(1.06);animation-duration:5s}.note-coin:hover .note-coin-hint,.note-coin:focus-visible .note-coin-hint{opacity:1;transform:translate(0)}}.note[data-open=true] .note-coin{transform:scale(.9)}.note[data-open=true] .note-wave,.note[data-open=true] .note-coin-hint{display:none}.note-pop{background:var(--ink);border:1px solid var(--rule);transform-origin:100% 100%;border-radius:14px;flex-direction:column;width:366px;max-width:calc(100vw - 40px);animation:.42s cubic-bezier(.16,1,.3,1) both note-in;display:flex;overflow:hidden;box-shadow:inset 0 1px #e8e4dc12,0 20px 54px #000000bd}@keyframes note-in{0%{opacity:0;transform:translateY(16px)scale(.94)}to{opacity:1;transform:translateY(0)scale(1)}}.note-head{border-bottom:1px solid var(--rule-soft);align-items:center;gap:10px;padding:12px 10px 12px 14px;display:flex}.note-avatar{border-radius:999px;flex-shrink:0;width:30px;height:30px;position:relative;overflow:hidden;box-shadow:0 0 0 1px #e8e4dc29}.note-avatar-face{filter:saturate(.85)brightness(.95);background:url(/images/26Studio-150.png) 50%/104% no-repeat;animation:22s linear infinite note-spin;position:absolute;inset:0}.note-avatar-gloss{border-radius:999px;position:absolute;inset:0;box-shadow:inset 0 1px 1px #ffffff59,inset 0 -2px 4px #00000080}.note-who{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bone);flex-direction:column;flex:1;gap:2px;font-size:.625rem;display:flex}.note-who-sub{letter-spacing:.16em;color:var(--bone-faint);font-size:.5rem}.note-progress{background:var(--rule-soft);flex-shrink:0;height:1px;position:relative;overflow:hidden}.note-progress span{transform-origin:0;background:var(--bone);opacity:.7;transition:transform .5s cubic-bezier(.16,1,.3,1);position:absolute;inset:0}.note-close{width:26px;height:26px;color:var(--bone-faint);cursor:pointer;background:0 0;border:0;border-radius:7px;flex-shrink:0;place-items:center;transition:color .2s,background .2s;display:grid}.note-close svg{fill:none;stroke:currentColor;stroke-width:1.4px;stroke-linecap:round;width:10px;height:10px}@media (hover:hover){.note-close:hover{color:var(--bone);background:#e8e4dc14}}.note-thread{overscroll-behavior:contain;background:var(--recess);scrollbar-width:thin;scrollbar-color:var(--rule) transparent;flex-direction:column;flex:1;gap:8px;min-height:min(340px,100dvh - 240px);max-height:min(460px,100dvh - 200px);padding:16px 14px;display:flex;overflow-y:auto}.note-row{animation:.44s cubic-bezier(.16,1,.3,1) both note-rise;display:flex}.note-row-studio{justify-content:flex-start}.note-row-visitor{justify-content:flex-end}@keyframes note-rise{0%{opacity:0;transform:translateY(10px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.note-bubble{max-width:84%;font-family:var(--serif);overflow-wrap:anywhere;border-radius:14px;padding:10px 14px;font-size:.9375rem;line-height:1.5}.note-bubble-studio{color:var(--bone);background:#e8e4dc12;border-bottom-left-radius:4px}.note-bubble-visitor{background:var(--bone);color:#0b0b0b;border-bottom-right-radius:4px}.note-speaker{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.note-cursor{vertical-align:-.06em;background:currentColor;width:.42em;height:.86em;margin-left:.06em;animation:.9s step-end infinite note-blink;display:inline-block}@keyframes note-blink{0%,49%{opacity:.85}50%,to{opacity:.15}}.note-typing{align-items:center;gap:5px;padding:14px;display:flex}.note-typing i{background:var(--bone);border-radius:1px;width:4px;height:4px;animation:1.25s ease-in-out infinite note-tap}.note-typing i:nth-child(3){animation-delay:.16s}.note-typing i:nth-child(4){animation-delay:.32s}@keyframes note-tap{0%,62%,to{opacity:.22;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.note-replies{flex-wrap:wrap;justify-content:flex-end;gap:6px;padding-top:2px;display:flex}.note-reply{border:1px solid var(--rule);font-family:var(--serif);color:var(--bone-dim);cursor:pointer;animation:.4s cubic-bezier(.16,1,.3,1) both note-rise;animation-delay:calc(var(--i,0) * 70ms);background:0 0;border-radius:999px;padding:8px 14px;font-size:.875rem;transition:border-color .22s,color .22s,background .22s}@media (hover:hover){.note-reply:hover{color:var(--bone);background:#e8e4dc0d;border-color:#e8e4dc73}}.note-reply-mono{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;font-size:.5625rem}.note-error{border-top:1px solid var(--rule-soft);background:var(--recess);font-family:var(--mono);color:var(--bone);flex-shrink:0;padding:10px 16px;font-size:.625rem;line-height:1.5}.note-composer{border-top:1px solid var(--rule-soft);flex-shrink:0;align-items:flex-end;gap:6px;padding:10px;display:flex;position:relative}.note-composer[data-sending=true]:before{content:"";background:var(--bone);opacity:.6;width:38%;height:1px;animation:1.15s linear infinite note-transmit;position:absolute;top:-1px;left:0}@keyframes note-transmit{0%{transform:translate(-100%)}to{transform:translate(260%)}}.note-field{border:1px solid var(--rule-soft);background:var(--recess);resize:none;min-width:0;font-family:var(--serif);color:var(--bone);caret-color:var(--bone);border-radius:12px;flex:1;padding:9px 12px;font-size:.9375rem;line-height:1.45;transition:border-color .24s;overflow-y:auto}.note-field::placeholder{color:var(--bone-faint)}.note-field:focus{border-color:#e8e4dc42;outline:none}.note-field:disabled{cursor:not-allowed}.note-icon{width:34px;height:34px;color:var(--bone-faint);cursor:pointer;background:0 0;border:0;border-radius:999px;flex-shrink:0;place-items:center;transition:color .2s,background .24s,opacity .2s;display:grid}.note-icon svg{fill:none;stroke:currentColor;stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round;width:14px;height:10px;transition:transform .24s cubic-bezier(.16,1,.3,1)}.note-send:not(:disabled){background:var(--bone);color:#0b0b0b}.note-send:disabled{cursor:not-allowed}@media (hover:hover){.note-icon:not(.note-send):hover{color:var(--bone);background:#e8e4dc14}.note-icon:not(.note-send):hover svg{transform:translate(-2px)}.note-send:not(:disabled):hover svg{transform:translate(2px)}}.note-skip{border:1px solid var(--rule);height:34px;font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);cursor:pointer;background:0 0;border-radius:999px;flex-shrink:0;padding:0 14px;font-size:.5625rem;transition:border-color .22s,color .22s}@media (hover:hover){.note-skip:hover{color:var(--bone);border-color:#e8e4dc73}}.note-coin:focus-visible{outline:1px solid var(--bone);outline-offset:3px}.note-reply:focus-visible{border-color:var(--bone);color:var(--bone);background:#e8e4dc0f;outline:none}.note-close:focus-visible,.note-icon:focus-visible,.note-skip:focus-visible{outline:1px solid var(--bone);outline-offset:2px}@media (width<=520px){.note{bottom:14px;left:14px;right:14px}.note-pop{width:100%;max-width:none}.note-thread{min-height:min(380px,100dvh - 260px);max-height:calc(100dvh - 220px)}.note-coin-hint{display:none}}@media (prefers-reduced-motion:reduce){.note-coin,.note-coin-face,.note-coin-hint,.note-avatar-face,.note-wave,.note-pop,.note-row,.note-reply,.note-step,.note-icon svg,.note-progress span{transition:none;animation:none}.note-coin:hover .note-coin-face,.note-typing i,.note-cursor,.note-composer[data-sending=true]:before{animation:none}.note-cursor,.note-wave{display:none}}