*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg,#fafafa);color:var(--ink,#252525);font:16px/1.55 Arial,Helvetica,sans-serif}a{color:inherit;text-underline-offset:3px}button,input{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid #597ef7;outline-offset:5px}button{border:0;background:none}img{max-width:100%;display:block}h1,h2,h3{font-size:inherit;font-weight:400}p{margin:0 0 20px}a:hover{opacity:.65}[hidden]{display:none!important}.muted{color:var(--muted,#858585)}.text-link{padding:0;text-decoration:underline;text-underline-offset:3px}.row{display:flex;align-items:center;justify-content:space-between;gap:20px}.links{display:flex;gap:18px;flex-wrap:wrap}.section-label{font-size:14px;color:var(--muted,#888);margin:0 0 24px}details summary{cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}details[open] summary{margin-bottom:18px}details p{color:var(--muted,#777)}dialog{width:min(760px,calc(100% - 32px));max-height:88dvh;overflow:auto;padding:32px;border:1px solid var(--line,#ddd);border-radius:12px;background:var(--bg,#fff);color:var(--ink,#222)}dialog::backdrop{background:#0008;backdrop-filter:blur(8px)}dialog h2{font-size:28px;line-height:1.2}dialog .close{float:right;font-size:13px;padding:5px}dialog p{line-height:1.7}.project-note{margin:25px 0;color:var(--muted,#888);font-size:14px}.endnote{margin-top:80px;font-size:13px;color:var(--muted,#888)}body.alt-theme{--bg:#f6f6f3;--ink:#262625;--muted:#70706d;--line:#ddd;--card:#eaeae6}@media(max-width:600px){body{font-size:15px}dialog{padding:22px}.row{gap:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
body{--bg:#161616;--ink:#f1f1ee;--muted:#94948f;--line:#363632;--card:#20201e}.form{max-width:875px;padding:55px 28px 80px;margin:auto}.form nav{margin-bottom:115px}.form-mark{font-size:38px;text-decoration:none}.form nav button{padding:5px 0;color:var(--muted);font-size:23px;border-bottom:2px solid transparent}.form nav [aria-pressed=true]{color:var(--ink);border-color:#6892d7}.form nav .links{gap:32px}.form header{font-size:23px;line-height:1.7;margin-bottom:60px}.form h1{font-weight:600;margin-bottom:8px}.form header p{margin:0}.playground{display:grid;grid-template-columns:190px 1fr;gap:30px;background:#ded8c4;border:1px solid #eee2cc;padding:35px;color:#334139;min-height:390px;align-items:center}.play-controls{background:#25382f;border:1px solid #627264;border-radius:18px;padding:23px 18px;color:#e3eadf;box-shadow:8px 12px 25px #0003}.play-controls>span{font-size:10px;letter-spacing:1px;display:block;margin-bottom:25px}.play-controls label{display:block;font-size:12px}.play-controls input{width:100%;accent-color:#a4c5ad;margin:12px 0 24px}.play-controls button{font-size:11px;padding:0}.shape-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;--radius:24%;--rotation:15deg}.shape-grid i{aspect-ratio:1;display:block;border-radius:var(--radius);background:linear-gradient(145deg,#cee4c5,#527469);box-shadow:2px 4px 8px #1d483738,inset 1px 1px 1px #ecfce3;transform:rotate(var(--rotation));border:1px solid #f3f5dd;transition:border-radius .15s,transform .15s}.shape-grid i:nth-child(3n){background:linear-gradient(145deg,#d8dfea,#7c96ad)}.form section{margin-top:68px}.form section h2{font-size:16px;color:var(--muted);margin:0 0 26px}.talks{display:grid;grid-template-columns:1fr 1fr;gap:25px}.talks button{padding:0;text-align:left;font-size:14px}.talk-art{aspect-ratio:1.6;background:#21211f;display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:13px;overflow:hidden}.motion-art i{width:50px;height:50px;background:#afc9bb;border-radius:50%;box-shadow:0 12px 40px #78af951f;animation:bounce 3s ease-in-out infinite}.motion-art i:nth-child(2){animation-delay:-1s;background:#c1c7d7}.motion-art i:nth-child(3){animation-delay:-2s;background:#d9c7ad}.system-art i{font:55px Georgia,serif;color:#d3d0bd}.system-art i:nth-child(2){font-family:Arial,sans-serif}.system-art i:nth-child(3){font-style:italic}.work-row{padding:16px 0;border-bottom:1px solid var(--line)}.work-row summary{display:flex;justify-content:space-between;align-items:center}.work-row summary>span{display:flex;align-items:center;gap:15px}.work-row summary i{font-style:normal;width:32px;height:32px;display:grid;place-content:center;background:#333831;border-radius:8px}.work-row time{color:var(--muted);font-size:14px}.work-row p{padding-left:47px;font-size:14px}.experiment-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.experiment-grid>div{height:300px;background:#222420;position:relative;display:grid;place-content:center;overflow:hidden}.experiment-grid span{position:absolute;bottom:18px;left:20px;font:10px monospace;color:#a5ad9f}.experiment-orbit i{position:absolute;inset:30%;border:1px solid #acba96;border-radius:50%;animation:orbit 8s linear infinite}.experiment-orbit i:nth-child(2){inset:20%;animation-delay:-3s}.experiment-orbit i:nth-child(3){inset:10%;animation-delay:-5s}.experiment-type{font:120px Georgia,serif;color:#d6d9c3}.experiment-type{animation:letter 5s ease-in-out infinite}@keyframes letter{50%{letter-spacing:15px}}@keyframes orbit{50%{transform:rotateY(65deg) rotateZ(120deg)}}@keyframes bounce{50%{transform:translateY(-18px)}}@media(max-width:650px){.form{padding:25px 22px}.form nav{margin-bottom:65px}.form nav button{font-size:17px}.form nav .links{gap:20px}.form header{font-size:19px;margin-bottom:35px}.playground{grid-template-columns:1fr;padding:22px;gap:30px}.play-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px 15px;padding:15px}.play-controls>span{grid-column:1/-1;margin:0 0 10px}.play-controls input{margin:0}.play-controls button{margin-top:8px}.shape-grid{padding:12px;gap:18px}.talks{gap:16px}.motion-art i{width:25px;height:25px}.talk-art{gap:8px}.system-art i{font-size:36px}.work-row time{font-size:12px}.experiment-grid{grid-template-columns:1fr}}
/* Keep the original UI inspiration visible in previews and downloads. */
.ui-inspiration-credit{max-width:960px;margin:32px auto 0;padding:22px 24px;border-top:1px solid var(--line,#e5e5df);font:13px/1.6 Helvetica,Arial,sans-serif;color:var(--muted,#74746c);text-align:center}.ui-inspiration-credit a{color:var(--ink,#35352f);text-decoration:underline;text-underline-offset:3px}.ui-inspiration-credit a:hover{opacity:.75}
