@font-face{font-family:Outfit;src:url(/assets/outfit-latin-wght-normal-Bc-8i84L.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}@font-face{font-family:Caveat;src:url(/assets/caveat-latin-500-normal-B9SDL8cy.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}:root{font-family:Outfit,Arial,sans-serif;color:#393345;background:#e9e5ef;font-synthesis:none;--ink: #393345;--muted: #6b6377;--orange: #c64b2b;--paper: #fffdf5;--motion: 1;--ease: cubic-bezier(.22, .8, .22, 1)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}button,a,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default}button[hidden],[hidden]{display:none!important}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #773cd1;outline-offset:5px}button:focus-visible{z-index:3}img{max-width:100%;display:block}::selection{background:#f9bb97;color:#302839}.site-wrap{width:min(1120px,calc(100% - 100px));margin:auto}.site-header{display:flex;align-items:center;gap:20px;min-height:98px}.header-note{font-size:.75rem;letter-spacing:.04em;color:var(--muted)}.personal-link{margin-left:auto;display:flex;align-items:center;gap:12px;min-height:44px;font-size:.875rem}.personal-link span{font-size:1.3rem}.person{display:grid;grid-template-columns:1.35fr 1fr;gap:60px;align-items:center;padding:30px 0 52px}.hand-note{font-family:Caveat,cursive;font-weight:500}.greeting{color:var(--orange);font-size:1.75rem;margin:0 0 4px;transform:rotate(-4deg);transform-origin:left center}.greeting span{display:inline-block;padding-left:6px;transform:rotate(-14deg)}h1{font-size:clamp(2.5rem,4.4vw,3.65rem);font-weight:650;letter-spacing:-.055em;margin:0;line-height:1.1}.person-copy{max-width:360px;padding-top:16px}.person-copy p{font-size:1.0625rem;line-height:1.6;margin:0 0 8px;max-width:34ch}.person-copy>span{font-size:.8125rem;color:var(--muted)}.bench-note{display:flex;align-items:center;gap:12px;font-size:.8125rem;letter-spacing:.01em;margin-bottom:32px}.tiny-spark{font-size:1.7rem;color:var(--orange);line-height:1}.dashed-line{flex:1;border-top:1px dashed #aea6b8;margin-left:12px}.objects{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:94px;padding:0 14px}.object-heading{display:flex;align-items:center;gap:10px;margin:0 0 26px}.object-heading h2{font-size:1.55rem;font-weight:550;letter-spacing:-.035em;margin:0}.object-index{font-size:.6875rem;border:1px solid #aaa1b8;border-radius:50%;width:24px;height:24px;display:grid;place-items:center;color:var(--muted);flex-shrink:0}.object-type{font-family:Caveat,cursive;font-size:1.25rem;color:var(--muted);margin-left:auto}.notepad{position:relative;isolation:isolate;padding:2px 10px 0 3px;min-height:351px;display:flex;flex-direction:column;align-items:center}.paper{position:relative;width:100%;padding:25px 28px 19px;background:var(--paper);border:1px solid #d2cdbf;border-radius:2px 2px 9px;box-shadow:0 6px 14px #3730420b;transform:rotate(-3deg);transition:transform .65s var(--ease);z-index:1;min-height:291px}.paper-shadow{position:absolute;inset:9px 10px 57px 3px;background:#f6f1e6;border:1px solid #cdc5b8;transform:rotate(1.5deg);border-radius:2px;box-shadow:0 3px #ded7c9,0 4px #bfb5a9,0 8px 16px #39334514}.paper:before{content:"";position:absolute;left:12px;top:19px;bottom:19px;border-left:1px solid #eac8bb}.paper-top{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:24px}.app-wordmark{font-weight:650;font-size:1.375rem;letter-spacing:-.07em}.app-wordmark>span{color:var(--orange)}.note-status{font-size:.6875rem;color:#716c64}.note-body{font-size:.9375rem;line-height:1.62;min-height:170px;max-width:100%;color:#51493f}.note-group{display:contents}.word{display:inline-block;white-space:pre;position:relative}.notepad.organized .note-group{display:block;margin-bottom:10px}.notepad.organized .paper{transform:rotate(.7deg)}.paper-bottom{display:flex;gap:10px;align-items:center;margin-top:18px;font-family:Caveat,cursive;font-size:1rem;color:#82746a}.paper-rule{width:34px;flex-shrink:0;border-top:1px solid #cabcad}.tidy-button{z-index:2;position:relative;display:flex;align-items:center;justify-content:center;gap:14px;background:#393345;color:#fffdf5;border:1px solid #282231;padding:0 20px;min-height:46px;box-shadow:0 4px #201b28;border-radius:9px;transform:rotate(-1deg);margin-top:12px;transition:transform .16s,box-shadow .16s}.tidy-button:active{transform:translateY(3px) rotate(-1deg);box-shadow:0 1px #201b28}.tidy-label{font-size:.8125rem}.tidy-button>span:last-child{font-size:1.2rem}.tidy-icon{display:flex;flex-direction:column;gap:3px;width:16px}.tidy-icon i{height:1px;width:16px;background:#fffdf5;transition:width .35s}.tidy-icon i:nth-child(2){width:10px}.notepad.organized .tidy-icon i:nth-child(2){width:16px}.notepad.organized .tidy-icon i:last-child{width:10px}.colour-object{height:351px;position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column}.orbit-wrap{width:320px;height:292px;position:relative;max-width:100%;flex-shrink:0}.colour-orbit{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(-12deg);transition:transform .85s cubic-bezier(.2,.85,.3,1.08)}.petal{position:absolute;width:160px;height:160px;left:-80px;top:-80px;border:none;border-radius:50%;background:var(--petal-colour);transform:rotate(var(--petal-angle)) translateY(-73px);box-shadow:inset 0 0 0 1px #39334512;transition:filter .2s,box-shadow .2s}.petal:hover{filter:brightness(1.035);box-shadow:inset 0 0 0 2px #39334533}.petal-dot{position:absolute;left:calc(50% - 3px);top:18px;width:6px;height:6px;border-radius:50%;background:#fffdf5;opacity:0;transition:opacity .2s}.petal[aria-pressed=true] .petal-dot{opacity:1}.colour-centre{position:absolute;width:122px;height:122px;left:calc(50% - 61px);top:calc(50% - 61px);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none;background:#f8f3e9;box-shadow:0 3px 10px #3933451a,inset 0 0 0 1px #fff8}.centre-mark{font-size:2rem;font-weight:600;line-height:1;letter-spacing:-.1em;margin-bottom:8px}.centre-mark>span{color:#c64b2b;font-size:1.2rem;vertical-align:top;margin-left:2px;display:inline-block;transition:color .3s}.colour-centre #colour-name{font-size:.6875rem;line-height:1.6}.colour-centre #colour-hex{font-family:monospace;font-size:.625rem;color:var(--muted)}.colour-hint{position:absolute;right:-15px;bottom:38px;transform:rotate(-9deg);font-size:1.45rem;color:#6a567e;margin:0}.colour-hint span{font-family:Outfit,sans-serif;display:inline-block;transform:rotate(-28deg);font-size:2.2rem;margin-left:5px}.study-label{font-size:.625rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin:18px 0 0}.project-description{font-size:.9375rem;line-height:1.5;margin:26px 0 13px;max-width:35ch;min-height:45px}.project-links{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;font-size:.8125rem}.project-links a{min-height:44px;display:inline-flex;align-items:center;gap:10px}.story-link{border-bottom:1px solid #b2a9bd}.story-link span{font-size:1.25rem;transition:transform .25s}.story-link:hover span{transform:rotate(90deg)}.visit-link{font-weight:550;gap:10px;display:inline-flex;align-items:center;min-height:44px}.visit-link span{display:grid;place-items:center;border-radius:50%;background:#f6f1e8;width:29px;height:29px;font-size:1rem;transition:background .2s,transform .2s}.visit-link:hover span{background:#f5ba9d;transform:rotate(15deg)}.bench-bottom{margin:40px 0 0;padding:20px 0;display:flex;align-items:center;gap:20px;border-top:1px dashed #b8b0c2}.demo-disclosure{font-size:.6875rem;line-height:1.7;color:var(--muted)}.demo-disclosure>span{display:block}.reset-button{display:flex;align-items:center;gap:8px;min-height:44px;background:none;border:none;font-size:.75rem;margin-left:auto;padding:0 4px;white-space:nowrap}.reset-button>span{font-size:1.5rem;transition:transform .45s}.reset-button:hover>span{transform:rotate(-55deg)}.stories{margin:50px 0}.project-story{padding:36px;background:#fffdf5;border-radius:20px;margin-bottom:24px}.enhanced .stories{display:none}.story-heading{border-bottom:1px solid #d3cbd2;padding-bottom:20px;margin-bottom:22px}.story-kicker{font-family:Caveat,cursive;font-size:1.2rem;color:#85634b}.story-heading h2{font-size:2.8rem;letter-spacing:-.045em;font-weight:600;line-height:1.1;margin:10px 0 12px}.story-heading>p{font-size:1rem;margin:0;line-height:1.5;max-width:45ch}.story-writing h3{font-size:.8125rem;font-weight:600;margin:0 0 10px}.story-writing>p{font-size:.9375rem;line-height:1.75;max-width:67ch;margin:0 0 16px}.story-writing>p:last-child{color:var(--muted);font-size:.8125rem}.real-preview{margin:26px 0}.real-preview img{width:100%;height:auto;border-radius:6px;border:1px solid #d6d1d7}.real-preview figcaption{font-size:.6875rem;line-height:1.6;color:var(--muted);margin-top:10px}.real-preview figcaption>span{float:right}.story-links{display:flex;gap:24px;align-items:center;flex-wrap:wrap;font-size:.875rem}.story-links>a{min-height:44px;display:inline-flex;align-items:center}.story-dialog{width:min(860px,calc(100% - 48px));max-height:calc(100dvh - 48px);border:1px solid #d3cbd6;border-radius:20px;padding:0;background:#fffdf5;color:var(--ink);box-shadow:0 20px 100px #30233f33;overflow:auto}.story-dialog::backdrop{background:#39334580}.dialog-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#f1ede4;padding:12px 24px;position:sticky;top:0;z-index:10;border-bottom:1px solid #d9d2c8;border-radius:19px 19px 0 0}.dialog-nav>span{font-family:Caveat,cursive;font-size:1.2rem}.close-story{display:flex;align-items:center;gap:9px;min-height:44px;border:0;background:none;font-size:.8125rem;padding:0}.close-story>span:first-child{font-size:1.25rem}.escape-label{border:1px solid #ccc3be;border-radius:4px;font-size:.625rem;padding:2px 5px;margin-left:8px}.story-dialog .project-story{margin:0;border-radius:0;background:transparent;padding:25px 36px 36px}.story-dialog[data-project=colorsum]{background:#f4f0fa}.story-dialog[data-project=colorsum] .dialog-nav{background:#e4ddef}.story-dialog[data-project=colorsum] .story-heading h2{color:#67518a}.dialog-is-open{overflow:hidden}.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip-link:focus{position:fixed;top:15px;left:15px;padding:14px;background:var(--ink);color:#fff;z-index:100}.future-preview{height:351px;object-fit:contain}.person>*,.project-object,.object-heading h2{min-width:0}h1,h2,h3,p{overflow-wrap:anywhere}@media(min-width:1400px){.site-wrap{width:1120px}.person{padding-block:40px 60px}.objects{gap:120px}.notepad{padding-inline:8px 18px}.colour-object{transform:translate(7px)}}@media(max-width:1000px){.site-wrap{width:calc(100% - 64px)}.objects{gap:50px;padding:0 5px}.person{gap:30px;padding-bottom:40px}.paper{padding:23px 20px 17px}.paper:before{left:8px}.note-body{font-size:.875rem}.orbit-wrap{transform:scale(.92);margin-inline:-10px}.colour-hint{right:-3px;font-size:1.2rem}.notepad,.colour-object{min-height:355px}.paper{min-height:295px}.project-links{gap:12px}.project-description{min-height:46px}}@media(max-width:760px){.site-wrap{width:calc(100% - 44px)}.site-header{min-height:78px;gap:12px}.header-note{font-size:.625rem;max-width:115px}.personal-link{font-size:.8125rem}.person{display:block;padding:23px 0 30px}.greeting{font-size:1.55rem}h1{font-size:clamp(2.2rem,7.9vw,3rem)}.person-copy{max-width:420px;padding-top:18px}.person-copy p{font-size:.9375rem;max-width:38ch}.person-copy>span{font-size:.75rem}.bench-note{margin-bottom:26px;font-size:.75rem;gap:8px}.tiny-spark{font-size:1.3rem}.dashed-line{margin-left:0}.objects{grid-template-columns:1fr;gap:42px;padding:0 7px}.object-heading{margin-bottom:20px}.object-heading h2{font-size:1.45rem}.notepad{min-height:0;padding:0 3px}.paper{padding:23px 26px;min-height:290px}.note-body{font-size:.9375rem;min-height:163px}.paper:before{left:12px}.paper-shadow{inset:7px 1px 57px 0}.paper-top{margin-bottom:19px}.tidy-button{margin-top:13px;min-height:48px}.project-description{min-height:0;margin:25px 0 7px;max-width:37ch;font-size:.9375rem}.project-links{gap:20px;justify-content:space-between}.project-colorsum{border-top:1px dashed #b5adbf;padding-top:28px}.colour-object{height:324px;min-height:0;margin-top:-5px}.orbit-wrap{transform:none;width:300px;height:282px}.colour-hint{right:0;bottom:16px;font-size:1.35rem}.study-label{margin-top:16px;align-self:flex-start;font-size:.625rem}.bench-bottom{margin-top:30px;align-items:flex-start;gap:10px;padding:16px 0;flex-wrap:wrap}.demo-disclosure{font-size:.625rem;max-width:55%}.reset-button{font-size:.6875rem;min-height:44px}.story-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 24px);border-radius:14px}.dialog-nav{padding:10px 16px;gap:8px;flex-wrap:wrap}.dialog-nav>span{font-size:1rem}.close-story{font-size:.75rem}.escape-label{display:none}.story-dialog .project-story,.project-story{padding:20px}.story-heading h2{font-size:2.35rem}.story-writing>p{font-size:.875rem}.real-preview figcaption>span{float:none;display:block}.story-links{gap:16px}.real-preview{margin:20px 0}.story-dialog .project-story{padding-bottom:30px}}@media(max-width:360px){.site-wrap{width:calc(100% - 34px)}.header-note{max-width:95px}.paper{padding-inline:20px}.note-body{font-size:.875rem}.notepad{min-height:355px}.colour-object{height:302px}.orbit-wrap{transform:scale(.86);width:280px;margin-top:-10px}.colour-hint{bottom:12px;font-size:1.2rem}.project-links{gap:8px;font-size:.75rem}.study-label{margin-top:0}.bench-bottom{display:block}.demo-disclosure{display:block;max-width:none}.reset-button{margin-top:8px}.person-copy p{font-size:.9375rem}.object-heading{flex-wrap:wrap}.header-note{display:none}}@media(prefers-reduced-motion:reduce){:root{--motion: 0}html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}.colour-hint{visibility:hidden}.enhanced .colour-hint{visibility:visible}html{overflow-x:clip}@media(min-width:761px){.site-header{min-height:82px}.person{padding-top:24px;padding-bottom:38px}.bench-note{margin-bottom:26px}.bench-bottom{margin-top:30px}}.preview-error{font-size:.875rem;line-height:1.6;padding:24px;border:1px dashed #b3a9c0;border-radius:8px}@media(max-width:760px){.paper{min-height:305px}.note-body{min-height:182px}.person .greeting{padding-bottom:3px}}.colour-object{height:auto;min-height:351px}.orbit-wrap{height:306px}.study-footer{width:100%;display:flex;justify-content:space-between;align-items:center;gap:8px 14px;flex-wrap:wrap;min-height:45px}.colour-hint{position:static;order:1;margin:0 0 0 auto;align-self:center}.study-label{order:0;margin:0;align-self:center}.tidy-button{max-width:100%}.tidy-label{min-width:0;line-height:1.35}.paper-top,.object-heading{flex-wrap:wrap}@media(max-width:760px){.colour-object{min-height:0}.orbit-wrap{height:304px}.study-footer{padding-top:10px;gap:7px}.colour-hint{font-size:1.35rem}.study-label{font-size:.625rem}}@media(max-width:360px){.orbit-wrap{height:286px}.study-footer{padding-top:0}.colour-hint{font-size:1.2rem}}.site-header{min-height:64px}.person{padding-top:0;align-items:end}.person-copy{padding-bottom:5px}.runner-wrap{margin:0 0 15px;max-width:540px}.runner{display:block;width:100%;border:0;padding:0;background:transparent;text-align:left}.runner svg{display:block;width:100%;height:104px;overflow:hidden}.runner-caption{display:flex;justify-content:space-between;gap:16px;font-size:.6875rem;color:var(--muted);margin-top:-5px}#runner-hint{color:var(--orange)}#runner-score{font-variant-numeric:tabular-nums}.blob-obstacle,#runner-obstacle[data-kind="1"] .paper-obstacle{display:none}#runner-obstacle[data-kind="1"] .blob-obstacle{display:block}.runner[data-state=idle] #runner-obstacle{opacity:.55}.runner[data-state=playing] .creature-body{animation:runner-step .18s steps(2) infinite}@keyframes runner-step{50%{transform:rotate(-4deg)}}.parting-note{display:grid;grid-template-columns:1fr 1.15fr;column-gap:90px;padding:40px 0 28px;margin-top:24px;border-top:1px solid #c6bece}.parting-note>.hand-note{font-size:2rem;margin:0;max-width:260px;line-height:1.1;color:var(--orange);transform:rotate(-3deg)}.parting-note>div p{font-size:.9375rem;line-height:1.7;max-width:48ch;margin:0 0 14px}.parting-note a{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem;gap:15px;text-decoration:underline;text-underline-offset:5px}.parting-note>.sign-off{grid-column:1 / -1;justify-self:end;max-width:none;font-size:1.35rem;margin:22px 0 6px;color:var(--muted);transform:rotate(-2deg)}@media(max-width:760px){.site-header{min-height:64px}.header-note{display:block;max-width:none;font-size:.6875rem}.person{padding-top:0}.runner-wrap{margin-bottom:19px}.runner svg{height:92px}.parting-note{grid-template-columns:1fr;gap:22px;padding-top:30px}.parting-note>.hand-note{max-width:none;font-size:1.8rem}.parting-note>.sign-off{justify-self:start;font-size:1.25rem;margin-top:2px}}@media(prefers-reduced-motion:reduce){.runner .creature-body{animation:none}}.colour-object{overflow:clip;overflow-clip-margin:18px}.runner:focus,.runner:focus-visible{outline:none}.runner:focus-visible #runner-hint{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}