@import"https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600&family=Kalam:wght@300;400&display=swap";:root{--hand:"Kalam",cursive;--hand-display:"Caveat",cursive;--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(--hand);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{display:flex;flex-direction:column;overflow:hidden}.paper-bg{pointer-events:none;z-index:0}.gallery-nav{align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:color-mix(in oklch,currentColor 4%,transparent);border-bottom:.5px solid color-mix(in oklch,currentColor 12%,transparent);display:flex;flex:0 0 auto;height:56px;justify-content:space-between;padding:0 32px;position:relative;z-index:20}.gallery-nav .nav-left{align-items:baseline;display:flex;gap:12px}.gallery-nav .nav-left .nav-name{font-family:var(--hand-display);font-size:22px;font-weight:600;line-height:1}.gallery-nav .nav-left .nav-sub{font-size:11px;font-style:italic;letter-spacing:.18em;opacity:.55;text-transform:uppercase}.app[data-theme=dark] img{filter:invert(1) hue-rotate(180deg)}.app[data-theme=dark] .sketch-frame{background:#16161a}.content{flex:1 1 auto;min-height:0;position:relative;width:100%;z-index:1}.handwritten{font-family:var(--hand);font-weight:400;letter-spacing:.01em}.corner-mark{font-family:var(--hand-display);font-size:15px;font-weight:500;left:36px;letter-spacing:.04em;opacity:.85;pointer-events:none;position:fixed;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;line-height:1;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:100%;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{scroll-snap-align:start;scroll-snap-stop:always}.feed-page,.feed-page-wrap{align-items:center;display:flex;height:100%;justify-content:center}.feed-page{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(--hand-display);font-size:14px;letter-spacing:.04em;opacity:.5}.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:100%;overflow-y:auto;padding:40px 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{align-items:flex-start;display:flex;gap:50px;justify-content:center;margin:0 auto;max-width:1400px}.grid-col{display:flex;flex:0 0 auto;flex-direction:column;gap:50px}.grid-cell{align-items:center;cursor:zoom-in;display:flex;flex-direction:column;gap:16px;outline:none;transition:transform .4s cubic-bezier(.2,.7,.2,1)}.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){.gallery-nav{height:52px;padding:0 16px}.gallery-nav .nav-left{gap:10px}.gallery-nav .nav-left .nav-name{font-size:19px}.gallery-nav .nav-left .nav-sub{font-size:10px;letter-spacing:.16em}.feed-inner{display:flex;flex-direction:column;gap:14px;height:100%;justify-content:center;padding:24px 16px;width:100%}.feed-margin{align-items:flex-start!important;flex:0 0 auto;flex-direction:row;flex-wrap:wrap;gap:18px;padding:0!important;text-align:left!important}.feed-margin.left{padding-bottom:0!important}.feed-margin.right{padding-top:0!important}.feed-frame-wrap{align-items:center;display:flex;flex:0 0 auto;justify-content:center}.grid-view{padding:24px 20px 60px}.counter{bottom:16px;right:16px}}