@import"https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600&family=Kalam:wght@300;400&family=EB+Garamond:ital,wght@0,400;0,500;1,400&display=swap";:root{--hand:"Kalam","Caveat",cursive;--hand-display:"Caveat",cursive;--serif:"EB Garamond",Georgia,serif;--ink:oklch(.24 .05 255);--ink-soft:color-mix(in oklch,var(--ink) 60%,transparent);--ink-faint:color-mix(in oklch,var(--ink) 30%,transparent)}*{box-sizing:border-box}body,html{color:var(--ink);font-family:var(--serif);height:100%;margin:0;padding:0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body{overflow:hidden}#root{z-index:1}#root,.app{height:100vh;position:relative;width:100vw}.app{overflow:hidden}.paper-bg{pointer-events:none;z-index:0}.content{height:100vh;position:relative;width:100vw;z-index:1}.handwritten{font-family:var(--hand);font-weight:400;letter-spacing:.01em}.corner-mark{font-family:var(--serif);font-size:13px;font-style:italic;font-weight:500;left:36px;letter-spacing:.18em;opacity:.85;pointer-events:none;position:fixed;text-transform:uppercase;top:28px;z-index:30}.mark-row{align-items:center;display:flex;gap:10px}.mark-name{font-family:var(--hand-display);font-size:22px;font-style:normal;font-weight:600;letter-spacing:0;text-transform:none}.mark-dot{font-style:normal;opacity:.5}.mark-sub{font-size:11px;opacity:.75}.counter{align-items:baseline;bottom:28px;display:flex;font-family:var(--hand);font-size:18px;gap:4px;letter-spacing:.04em;opacity:.8;pointer-events:none;position:fixed;right:36px;z-index:30}.counter .num{font-size:24px;font-weight:500}.counter .slash{opacity:.5;padding:0 2px}.counter .den{font-size:16px;opacity:.6}.scroll-hint{animation:bob 2.4s ease-in-out infinite;bottom:28px;font-family:var(--hand);font-size:16px;left:50%;letter-spacing:.05em;opacity:.45;pointer-events:none;position:fixed;transform:translate(-50%);z-index:30}@keyframes bob{0%,to{opacity:.4;transform:translate(-50%)}50%{opacity:.65;transform:translate(-50%,4px)}}.feed-scroller{height:100vh;overflow-y:auto;scroll-behavior:smooth;scroll-snap-type:y mandatory}.feed-scroller::-webkit-scrollbar{display:none}.feed-scroller{-ms-overflow-style:none;scrollbar-width:none}.feed-page-wrap{height:100vh;scroll-snap-align:start;scroll-snap-stop:always}.feed-page,.feed-page-wrap{align-items:center;display:flex;justify-content:center}.feed-page{height:100%;width:100%}.feed-inner{align-items:center;display:grid;gap:56px;grid-template-columns:180px auto 180px;padding:0 40px}.feed-margin{display:flex;flex-direction:column;gap:28px}.feed-margin.left{align-items:flex-end;padding-bottom:60px;text-align:right}.feed-margin.right{align-items:flex-start;padding-top:60px;text-align:left}.margin-block{display:flex;flex-direction:column;gap:4px}.meta-label{font-family:var(--serif);font-size:10px;font-style:italic;letter-spacing:.22em;opacity:.45;text-transform:uppercase}.meta-value{font-size:22px}.meta-value,.tag-line{font-family:var(--hand);font-weight:400;opacity:.9}.tag-line{font-size:15px;letter-spacing:.02em;line-height:1.6}.feed-frame-wrap{cursor:zoom-in;outline:none;position:relative;transition:transform .4s cubic-bezier(.2,.7,.2,1)}.feed-frame-wrap:hover{transform:translateY(-4px) scale(1.012)}.feed-frame-wrap:focus-visible{outline:none}.feed-frame-wrap:focus-visible .sketch-frame:after{border:1px dashed var(--ink-faint);border-radius:4px;content:"";inset:-16px;position:absolute}.zoom-hint{bottom:-32px;font-size:14px;opacity:0;pointer-events:none;position:absolute;right:0;transform:rotate(-2deg);transition:opacity .3s ease}.feed-frame-wrap:hover .zoom-hint{opacity:.55}.grid-view{height:100vh;overflow-y:auto;padding:90px 60px 60px}.grid-view::-webkit-scrollbar{width:8px}.grid-view::-webkit-scrollbar-track{background:transparent}.grid-view::-webkit-scrollbar-thumb{background:var(--ink-faint);border-radius:4px}.grid-inner{-moz-column-gap:50px;column-gap:50px;-moz-column-width:300px;column-width:300px;margin:0 auto;max-width:1400px}.grid-cell{-moz-column-break-inside:avoid;break-inside:avoid;page-break-inside:avoid;align-items:center;cursor:zoom-in;display:flex;flex-direction:column;gap:16px;margin:0 0 50px;outline:none;transition:transform .4s cubic-bezier(.2,.7,.2,1);width:100%}.grid-cell:hover{transform:translateY(-4px)}.grid-caption{align-items:center;display:flex;flex-direction:column;font-size:18px;gap:2px;text-align:center}.grid-date{font-size:13px;font-style:italic;opacity:.55}.scattered-view{height:100vh;overflow:auto;padding:90px 40px 60px}.scattered-view::-webkit-scrollbar{height:8px;width:8px}.scattered-view::-webkit-scrollbar-thumb{background:var(--ink-faint);border-radius:4px}.scattered-inner{margin:0 auto;position:relative}.scattered-cell{cursor:zoom-in;outline:none;position:absolute;transform-origin:center;transition:transform .5s cubic-bezier(.2,.7,.2,1)}.scattered-cell:hover{transform:rotate(0) translateY(-6px) scale(1.04)!important;z-index:5}.scattered-caption{bottom:-28px;font-size:16px;left:0;opacity:.7;position:absolute;right:0;text-align:center}.animate-in{animation:drawIn .9s cubic-bezier(.2,.7,.2,1) backwards}@keyframes drawIn{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.grid-cell.animate-in,.scattered-cell.animate-in{animation:drawInTilt .9s cubic-bezier(.2,.7,.2,1) backwards}@keyframes drawInTilt{0%{opacity:0}to{opacity:1}}.zoom-overlay{align-items:center;animation:fadeIn .35s ease;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:color-mix(in oklch,#f7f4ec 92%,transparent);cursor:zoom-out;display:flex;inset:0;justify-content:center;position:fixed;z-index:100}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.zoom-stage{align-items:center;animation:zoomPop .4s cubic-bezier(.2,.7,.2,1);cursor:default;display:flex;flex-direction:column;gap:18px;position:relative}@keyframes zoomPop{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.zoom-meta-top{align-items:baseline;display:flex;font-size:22px;gap:12px;opacity:.9}.zoom-meta-sep{opacity:.4}.zoom-meta-bottom{font-size:16px;letter-spacing:.04em;opacity:.7}.zoom-frame-wrap{align-items:center;display:flex;justify-content:center}.zoom-close{background:none;border:none;cursor:pointer;font-family:var(--hand);font-size:16px;opacity:.55;padding:6px 10px;position:absolute;right:0;top:-56px;transition:opacity .2s ease}.zoom-close:hover{opacity:1}.sketch-frame{-webkit-user-select:none;-moz-user-select:none;user-select:none}@media(max-width:900px){.feed-inner{gap:16px;grid-template-columns:1fr;padding:60px 24px}.feed-margin{align-items:flex-start!important;flex-direction:row;flex-wrap:wrap;gap:20px;padding:0!important;text-align:left!important}.feed-margin.right{padding-top:0!important}.feed-margin.left{padding-bottom:0!important}.corner-mark{left:20px;top:16px}.counter{bottom:20px;right:20px}}
