:root{color-scheme:light;--bg: #f8f8f8;--fg: #111111;--muted: #666666;--border: #e5e5e5;--link: #141414;--border-radius: 2rem}@font-face{font-family:Google Sans;src:url(/fonts/GoogleSans-Regular.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}*{box-sizing:border-box;border:0}body{margin:0;background:var(--bg);color:var(--fg);font-family:Google Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}.shell{width:100%;margin:0 auto 2rem;padding:0rem 1.5rem;display:grid;grid-template-columns:minmax(16rem,22rem) minmax(0,1fr);gap:3rem;align-items:start;max-width:100rem}.sidebar{min-width:0;position:sticky;top:0;align-self:start;padding-bottom:2rem}.sidebar-name{font-size:2.6rem;font-weight:800}.sidebar-name a{color:var(--fg)}.sidebar-inner{padding:1.2rem 0;display:flex;flex-direction:column}.sidebar-content{font-size:1.1rem}.sidebar-footer-row{margin-top:auto;padding-top:.5rem;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem}.sidebar-footer-row ul{margin:0;min-width:0}.sidebar-shader-link{display:block}.sidebar-shader-frame{width:100%;height:4rem;margin:0 0 1.25rem;overflow:hidden;background:#111}.sidebar-shader-canvas{width:100%;height:100%;display:block}.page{min-width:0;max-width:100%;padding:1.5rem 0 3rem}.corner-gif{width:6.5rem;pointer-events:none;padding-right:2rem}.corner-gif-canvas{width:100%;height:auto;display:block;image-rendering:auto;opacity:.3}.stack>*+*{margin-top:1rem}h1,h2,h3,h4,h5,h6{margin:0;line-height:1.2}p,ul,ol{margin:0 0 1rem}a{color:var(--link);font-weight:800;text-decoration:underline}hr{margin:3rem;border:0;height:.1rem;display:block;background:#000}ul{padding-left:2.5rem;line-height:1.7rem}ul li{position:relative}ul li::marker{content:""}ul li:before{content:"";position:absolute;left:-1.25rem;top:.48em;width:.62rem;height:.62rem;border:.2rem solid currentColor;box-sizing:border-box}.content>:first-child{margin-top:0}img{max-width:100%;height:auto;display:block;border:1px solid var(--border)}.caption{margin-top:.5rem;color:var(--muted);font-size:.9rem}.home-project{display:block;margin-top:2rem}.home-project-media{display:block;aspect-ratio:16 / 9;overflow:hidden}.home-project img{width:100%;height:100%;display:block;margin:0;border-radius:.1rem;object-fit:cover}.home-project-title{font-size:1.25rem;margin:1rem 0 0}.home-project-subtitle{margin:.25rem 0 0;color:var(--muted)}.project-header{margin-bottom:1.8rem}.project-title{font-size:1.5rem;font-weight:100;padding-top:1rem}.project-title>:first-child,.project-summary>:first-child,.project-side>:first-child,.project-description>:first-child{margin-top:0}.project-title>:last-child,.project-summary>:last-child,.project-side>:last-child,.project-description>:last-child{margin-bottom:0}.project-content{font-size:1.1rem}.project-content h1,h2{margin:1.6rem 0 1.5rem}.project-content h3{margin:1rem 0}.project-image{width:100%;margin:2rem 0;display:block}.project-image img{width:100%}.project-image-pair{width:100%;margin:2rem 0;display:grid;grid-template-columns:minmax(0,var(--left-width)) minmax(0,var(--right-width));gap:1rem;align-items:stretch}.project-image-pair-item{min-width:0;overflow:hidden}.project-image-pair-item img{width:100%;height:100%;object-fit:cover;display:block}.project-video{width:100%;margin:2rem 0;display:block}.project-video video{width:100%}.project-youtube{width:100%;margin:2rem 0;display:block}.project-youtube-frame{position:relative;width:100%;padding-top:56.25%}.project-youtube-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.project-summary{padding-top:1.7rem;display:grid;grid-template-columns:minmax(0,1fr) minmax(12rem,13.5rem);gap:2rem;align-items:start}.project-side{font-size:minmax(.2rem,1.1rem);border-left:.25rem solid var(--muted);padding-left:1.1rem}.project-pagination{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--border);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}.project-pagination-slot{min-width:0}.project-pagination-slot-right{text-align:right}.project-pagination-link{color:#000;display:inline-flex;max-width:100%}.project-pagination-link-next{align-items:flex-end}.project-pagination-label{font-size:1.4rem;letter-spacing:.04em}@media (max-width: 53rem){.shell{grid-template-columns:1fr;gap:2rem;padding-top:1.5rem}.sidebar{position:static}.sidebar-inner{max-height:none;padding:0;overflow:visible}.page{padding-top:0}.corner-gif{width:4rem}.sidebar-footer-row{gap:.5rem}.project-summary{grid-template-columns:1fr;gap:1rem}.project-image-pair{grid-template-columns:1fr}}body{overflow:hidden}#canvas{display:block;width:100vw;height:100vh}#loader{position:fixed;inset:0;display:flex;flex-direction:column;z-index:10;transition:opacity .3s ease;overflow:hidden;background:var(--muted);color:var(--color-text);gap:2rem}.loader-content{flex:1;width:100%;overflow-y:auto;padding:0 1rem 1rem;-webkit-overflow-scrolling:touch}.sort-dropdown{position:relative;display:flex;justify-content:flex-end;margin:.75rem 0}.sort-trigger{background:var(--color-background-code);border:1px solid var(--color-border);color:var(--color-text-muted);font-size:.625rem;letter-spacing:.1em;padding:.3rem .5rem;cursor:pointer;outline:none;min-width:6rem;text-align:center;border-radius:var(--border-radius)}.sort-trigger:hover,.sort-trigger.open{border-color:var(--color-primary-dark);color:var(--color-text)}.sort-menu{display:none;position:absolute;top:100%;right:0;z-index:50;background:var(--color-background-pre);border:1px solid var(--color-border);border-radius:var(--border-radius);min-width:6rem}.sort-menu.open{display:block}.sort-option{display:block;width:100%;background:none;border:none;color:var(--color-text-muted);font-size:.625rem;letter-spacing:.1em;padding:.4rem .5rem;cursor:pointer;text-align:left;white-space:nowrap;display:none}.sort-option:hover{background:var(--color-background-code);color:var(--color-text)}.sort-option.active{color:var(--color-primary-dark)}.loader-footer{width:100%;padding:.1rem;display:flex;justify-content:center;background:var(--color-background-pre);border-top:1px solid var(--color-border)}#loader.hidden{opacity:0;pointer-events:none}#loader h1{font-size:1.125rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:.5rem}#exp-list{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;width:100%;max-width:450px;margin:0 auto;padding:.5rem}.exp-btn{cursor:pointer;transition:all .1s ease;display:flex;flex-direction:column;align-items:center;padding:.8rem;width:100%;min-width:0;text-align:center;border-radius:0;border:0}.exp-btn:hover{background-color:--muted}.thumbnail-container{width:100%;aspect-ratio:.6;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center}.thumbnail{width:100%;height:100%;object-fit:cover;transition:opacity .3s ease}.exp-btn .title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:100%;padding-top:.9rem}.drafts-separator{grid-column:1 / -1;text-transform:uppercase;margin-top:1.5rem;margin-bottom:.5rem;text-align:left;border-bottom:2px solid var(--border);padding-bottom:.5rem;width:100%}#topper{width:100vh;background:var(--bg);position:fixed;top:.01rem;left:0;right:0;height:calc(5.5rem + var(--bottom-ui-offset))}#pause-btn{position:fixed;bottom:calc(5.5rem + var(--bottom-ui-offset));left:50%;transform:translate(-50%);z-index:20;background:--bg;border:0;font-size:1rem;cursor:pointer;width:3rem;height:3rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:opacity .2s ease;display:none}#pause-btn:hover{border-color:var(--color-primary-dark);color:var(--color-text)}#pause-btn.hidden{display:none}#back-btn{position:fixed;top:calc(1.5rem + var(--bottom-ui-offset));left:1.5rem;cursor:pointer;z-index:200;display:none;padding:1rem 1.4rem;border-radius:var(--border-radius)}#drafts-btn{position:fixed;bottom:calc(1.5rem + var(--bottom-ui-offset));cursor:pointer;transition:all .2s ease;display:none;padding:1rem 1.4rem;border-radius:var(--border-radius)}#back-btn.visible,#drafts-btn.visible,#info-btn.visible{display:block}#drafts-btn:hover{border-color:var(--color-primary-dark)}#info-btn{position:fixed;top:calc(1.5rem + var(--bottom-ui-offset));right:1.5rem;cursor:pointer;z-index:20;display:none;padding:1rem 1.4rem;border-radius:var(--border-radius)}#info-btn:hover{border-color:var(--color-primary-dark);color:var(--color-text)}#preset-container{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);z-index:20;display:none;flex-direction:row;align-items:stretch}#preset-container.visible{display:flex}#preset-prev,#preset-next{background:var(--bg);cursor:pointer;width:3rem;display:flex;align-items:center;font-size:.6875rem;justify-content:center;transition:border-color .2s ease,color .2s ease}#preset-prev{border-radius:var(--border-radius) 0 0 var(--border-radius)}#preset-next{border-radius:0 var(--border-radius) var(--border-radius) 0}#preset-name{background:var(--bg);white-space:nowrap;width:13rem;padding:1rem;text-align:center;transition:border-color .2s ease,color .2s ease}#preset-prev:hover,#preset-next:hover{border-color:var(--muted);background:var(--border)}#instructions{position:fixed;top:.01rem;left:0;right:0;z-index:15;pointer-events:none;white-space:normal;width:100%;text-align:center;overflow-wrap:anywhere;opacity:0;transition:opacity .3s ease;background:var(--bg);min-height:2rem;padding:2rem}#instructions.visible{opacity:1}.modal-overlay{position:fixed;top:0;left:0;width:100vw;background:#ffffffeb;backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:100;opacity:0;pointer-events:none;transition:opacity .2s ease}.modal-overlay.visible{opacity:1;pointer-events:auto}.modal-content{border-radius:var(--border-radius);padding:4rem;width:90%;height:100%}.modal-title{transition:all .2s ease;line-height:4rem;margin-top:2rem;margin-bottom:0rem}.modal-body{font-size:.8125rem;line-height:var(--line-height-content);color:var(--color-text-muted);margin-bottom:1.5rem;white-space:pre-wrap}.modal-close-btn{z-index:220;background:var(--fg);color:var(--bg);cursor:pointer;float:right;transition:all .2s ease;padding:1rem;border-radius:var(--border-radius)}.modal-close-btn:hover{border-color:var(--border)}