/* Reading: a tactile editorial collage. Variance 9 / Motion 7 / Density 3.
   Original print-based aesthetic. Paper objects are square; UI controls are pills.
   The canvas is deliberately a fixed pale paper colour, with one coral UI accent. */
@font-face{font-family:Anton;src:url('assets/anton.ttf') format('truetype');font-display:swap;font-weight:400}
@font-face{font-family:Space;src:url('assets/space-grotesk.ttf') format('truetype');font-display:swap;font-weight:300 700}
:root{color-scheme:light;--paper:#eae8e2;--ink:#242320;--muted:#6c6a64;--red:#f45c43;--rule:#24232025;--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper)}body{font-family:Space,Arial,sans-serif;color:var(--ink)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--red);outline-offset:7px}.site{min-height:100dvh;isolation:isolate}.site:after{position:fixed;inset:0;z-index:25;pointer-events:none;content:'';opacity:.07;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' opacity='.4' filter='url(%23g)' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}.header{height:80px;margin:0 4%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule);position:relative;z-index:20}.header h1{font-size:40px;letter-spacing:-3px;margin:0;font-weight:700;line-height:1}.header h1 span{color:var(--red)}.header p{font-size:13px;margin:0;position:absolute;left:50%;translate:-50% 0}.header>button{font-size:12px;padding:12px 0}.header>button span{font-size:18px;margin-left:18px}.header>button:hover{text-decoration:underline;text-underline-offset:5px}.board{position:relative;isolation:isolate;perspective:1400px;height:calc(100dvh - 163px);min-height:650px;max-width:1800px;margin:auto;overflow:hidden}.board-thought{position:absolute;left:6%;bottom:12%;font-size:23px;letter-spacing:-.045em;line-height:1.2;margin:0;z-index:0;pointer-events:none}.artifact{position:absolute;top:0;left:0;display:block;padding:0;cursor:grab;touch-action:none;user-select:none;transform-style:preserve-3d;will-change:transform;text-align:left;opacity:0}.ready .artifact{opacity:1}.artifact:active{cursor:grabbing}.artifact:focus-visible{outline-offset:12px}.piece{display:block;width:100%;height:100%;position:relative;overflow:hidden;background:#f6f5f0;box-shadow:0 2px 3px #3c352b13,0 10px 24px #3c352b19,0 35px 55px -25px #3c352b3d;transition:box-shadow .25s}.artifact.is-dragging .piece{box-shadow:0 5px 6px #3c352b13,0 24px 45px #3c352b29,0 65px 65px -30px #3c352b38}.piece:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 1px #30291d0b;pointer-events:none}.artifact-poster{width:clamp(300px,26.5vw,400px);aspect-ratio:.77}.poster-print{background:var(--red);padding:6.5% 7%;display:flex;flex-direction:column;justify-content:space-between}.poster-word{font-family:Anton,Impact,sans-serif;font-size:clamp(100px,9.8vw,152px);letter-spacing:-.025em;line-height:.94}.poster-asterisk{align-self:center;display:block;font-family:Arial,sans-serif;font-weight:bold;font-size:clamp(120px,12vw,180px);line-height:.9;rotate:-12deg}.poster-copy{font-family:Anton,Impact,sans-serif;font-size:clamp(32px,3vw,46px);line-height:1.05;letter-spacing:-.005em}.poster-bottom{display:flex;justify-content:space-between;align-items:center;font-size:9px;margin-top:12px}.poster-bottom>span:last-child{font-size:22px}.artifact-water{width:clamp(310px,30vw,455px);aspect-ratio:1.4}.artifact-flower{width:clamp(210px,18vw,275px);aspect-ratio:.72}.photograph{padding:12px 12px 0;display:flex;flex-direction:column}.photograph img{display:block;width:100%;height:calc(100% - 38px);flex:1 1 0;min-height:0;object-fit:cover;pointer-events:none}.water-print img{object-position:50% 54%}.flower-print img{object-position:50% 42%}.print-caption{display:flex;justify-content:space-between;align-items:center;flex:0 0 38px;font-size:10px;padding:0 2px}.print-caption>span:last-child{font-size:18px}.artifact-sketch{width:clamp(250px,22vw,325px);aspect-ratio:1.48}.sketch-print{padding:20px 23px;background:#f6f4e9;display:flex;flex-direction:column;justify-content:space-between}.sketch-label{font-size:9px}.sketch-placeholder{font-size:clamp(30px,3vw,44px);font-weight:500;line-height:1;letter-spacing:-.06em;position:relative}.sketch-placeholder>span{position:absolute;right:2px;top:15px;font-size:40px;font-weight:400;color:var(--red)}.sketch-edit{font-size:9px;display:flex;justify-content:space-between}.sketch-edit>span{font-size:17px}.sketch-print canvas{position:absolute;inset:23px 15px;width:calc(100% - 30px);height:calc(100% - 46px);pointer-events:none;display:none}.sketch-print.has-drawing canvas{display:block}.sketch-print.has-drawing .sketch-placeholder{opacity:0}.footer{height:83px;margin:0 4%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:35px;border-top:1px solid var(--rule);position:relative;z-index:20}.footer p{font-size:11px;margin:0;color:var(--muted)}.shuffle{border-radius:100px;background:var(--red);font-size:12px;padding:13px 24px;display:flex;gap:30px;align-items:center;transition:background .2s}.shuffle:hover{background:#f16a53}.shuffle>span{font-size:21px;line-height:1}.tidy{justify-self:end;font-size:12px;padding:12px 0}.tidy>span{margin-left:20px;font-size:18px}.tidy:hover{text-decoration:underline;text-underline-offset:5px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
dialog{color:var(--ink);background:var(--paper);border:0;margin:auto;padding:0}dialog::backdrop{background:#29282070;backdrop-filter:blur(12px)}.viewer{width:calc(100vw - 40px);height:calc(100dvh - 40px);max-width:1600px;max-height:1100px;overflow:auto;padding:65px 6% 40px}.close-viewer{font-size:11px;display:flex;align-items:center;gap:24px;padding:10px 0;position:absolute;right:35px;top:20px;z-index:5}.close-viewer>span{font-size:24px;line-height:.8}.viewer-layout{height:100%;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr);align-items:center;gap:8%}.viewer-media{display:flex;justify-content:center;align-items:center;min-width:0;height:100%;min-height:0}.viewer-media .piece{width:auto;max-width:100%;max-height:100%;height:auto;flex-shrink:1}.viewer-media .photograph{padding:14px 14px 0;display:flex}.viewer-media .photograph img{width:100%;height:calc(100% - 40px);min-height:0;object-fit:cover}.viewer-media .water-print{width:100%;aspect-ratio:1.4}.viewer-media .flower-print{height:100%;aspect-ratio:.72}.viewer-media .poster-print{width:min(100%,500px);height:auto;max-height:100%;aspect-ratio:.77;padding:6%}.viewer-media .poster-word{font-size:clamp(100px,11vw,185px)}.viewer-media .poster-copy{font-size:clamp(35px,3.7vw,62px)}.viewer-media .poster-asterisk{font-size:clamp(120px,15vw,230px)}.viewer-text{padding-right:10px}.viewer-kind{font-size:11px;color:var(--muted);margin:0 0 22px}.viewer-text h2{font-family:Anton,Impact,sans-serif;font-size:clamp(45px,5vw,76px);font-weight:400;line-height:1.02;text-transform:uppercase;margin:0 0 26px;max-width:400px}.viewer-text>p:last-of-type{font-size:15px;line-height:1.7;max-width:310px}.next-piece{margin-top:35px;border-bottom:1px solid var(--ink);font-size:11px;padding:0 0 10px;display:flex;gap:28px;align-items:center}.next-piece span{font-size:19px}.about-dialog{width:min(650px,calc(100vw - 32px));padding:75px 45px 45px}.about-dialog>p{font-size:14px;line-height:1.7;max-width:430px}.about-dialog>p:first-of-type{font-size:11px}.about-dialog h2{font-family:Anton,Impact,sans-serif;font-size:clamp(40px,5vw,64px);font-weight:400;line-height:1.05;margin:25px 0 30px}.about-back{font-size:12px;border-bottom:1px solid var(--ink);padding:0 0 10px;margin-top:30px;display:flex;gap:30px;align-items:center}.about-back span{font-size:19px}.drawing-dialog{width:min(1100px,calc(100vw - 32px));height:min(800px,calc(100dvh - 32px));padding:30px;overflow:hidden}.drawing-header{height:115px;display:flex;justify-content:space-between;align-items:flex-start;position:relative}.drawing-header>div>span{font-size:11px}.drawing-header h2{font-family:Anton,Impact,sans-serif;text-transform:uppercase;font-size:55px;font-weight:400;line-height:1;margin:15px 0 0}.drawing-header .close-viewer{right:0;top:0}.drawing-dialog>canvas{display:block;width:100%;height:calc(100% - 180px);background:#faf9f2;cursor:crosshair;touch-action:none;border:1px solid var(--rule)}.drawing-tools{display:flex;align-items:center;justify-content:flex-end;gap:25px;height:65px;font-size:11px}.drawing-tools p{margin-right:auto;color:var(--muted)}.drawing-tools button{font-size:11px;border-bottom:1px solid var(--ink);padding:8px 0}.drawing-tools button:disabled{opacity:.35;cursor:default}.noscript{position:fixed;bottom:110px;left:5%;font-size:14px}
::view-transition-group(selected-piece){animation-duration:600ms;animation-timing-function:cubic-bezier(.2,.75,.15,1)}::view-transition-old(selected-piece),::view-transition-new(selected-piece){height:100%;mix-blend-mode:normal}
@media(max-width:1000px) and (min-width:701px){.artifact-poster{width:300px}.poster-word{font-size:110px}.poster-copy{font-size:34px}.poster-asterisk{font-size:140px}.artifact-flower{width:220px}.artifact-water{width:330px}.artifact-sketch{width:265px}.board-thought{font-size:19px;left:4%;bottom:8%}.viewer-layout{gap:5%;grid-template-columns:1.2fr 1fr}.viewer-text h2{font-size:47px}}
@media(max-width:700px){.header{height:76px;margin:0 6%}.header h1{font-size:35px}.header p{display:none}.header>button{font-size:11px}.board{height:calc(100dvh - 155px);min-height:640px}.board-thought{display:none}.artifact-poster{width:230px}.poster-word{font-size:85px}.poster-copy{font-size:26px}.poster-asterisk{font-size:110px}.poster-bottom{font-size:7px}.poster-bottom>span:last-child{font-size:18px}.artifact-flower{width:145px}.artifact-water{width:220px}.artifact-sketch{width:180px}.photograph{padding:8px 8px 0}.print-caption{font-size:8px;flex-basis:28px}.print-caption>span:last-child{font-size:15px}.sketch-print{padding:14px}.sketch-label{font-size:7px}.sketch-placeholder{font-size:28px}.sketch-placeholder>span{font-size:28px}.sketch-edit{font-size:7px}.sketch-edit>span{font-size:14px}.footer{height:79px;margin:0 6%;gap:15px;grid-template-columns:1fr auto}.footer p{position:absolute;top:-30px;left:0;font-size:10px;color:var(--ink)}.shuffle{justify-self:start;padding:12px 20px;font-size:11px;gap:25px}.tidy{font-size:11px}.tidy>span{font-size:16px}.viewer{padding:65px 22px 32px;width:calc(100vw - 20px);height:calc(100dvh - 20px)}.close-viewer{right:22px;top:16px;font-size:10px;gap:18px}.viewer-layout{display:flex;flex-direction:column;gap:35px;height:auto}.viewer-media{width:100%;height:48dvh;flex-shrink:0}.viewer-media .flower-print{height:100%;width:auto}.viewer-media .poster-print{height:100%;width:auto;max-width:100%;padding:6%}.viewer-media .poster-word{font-size:clamp(78px,24vw,115px)}.viewer-media .poster-copy{font-size:clamp(24px,7.5vw,38px)}.viewer-media .poster-asterisk{font-size:clamp(80px,30vw,135px)}.viewer-text{width:100%;padding:0}.viewer-kind{font-size:10px;margin-bottom:16px}.viewer-text h2{font-size:45px;margin-bottom:20px}.viewer-text>p:last-of-type{font-size:13px;max-width:none}.next-piece{margin-top:25px}.about-dialog{padding:65px 26px 32px}.about-dialog>p{font-size:13px}.drawing-dialog{padding:20px}.drawing-header{height:110px}.drawing-header h2{font-size:44px}.drawing-tools{gap:20px}.drawing-tools p{display:none}.drawing-dialog>canvas{height:calc(100% - 175px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
@media(prefers-reduced-transparency:reduce){dialog::backdrop{background:var(--paper);backdrop-filter:none}}