@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{height:100%;font-family:var(--hand);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;padding:0}body{overflow:hidden}#root{z-index:1}#root,.app{width:100vw;height:100vh;position:relative}.app{flex-direction:column;display:flex;overflow:hidden}.paper-bg{z-index:0;pointer-events:none}.gallery-nav{z-index:20;background:color-mix(in oklch,currentColor 4%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:.5px solid color-mix(in oklch,currentcolor 12%,transparent);flex:none;justify-content:space-between;align-items:center;height:56px;padding:0 32px;display:flex;position:relative}.gallery-nav .nav-left{align-items:baseline;gap:12px;display:flex}.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{letter-spacing:.18em;text-transform:uppercase;opacity:.55;font-size:11px;font-style:italic}.app[data-theme=dark] img{filter:invert()hue-rotate(180deg)}.app[data-theme=dark] .sketch-frame{background:#16161a}.content{z-index:1;flex:auto;width:100%;min-height:0;position:relative}.handwritten{font-family:var(--hand);letter-spacing:.01em;font-weight:400}.corner-mark{z-index:30;font-family:var(--hand-display);letter-spacing:.04em;opacity:.85;pointer-events:none;font-size:15px;font-weight:500;position:fixed;top:28px;left:36px}.mark-row{align-items:center;gap:10px;display:flex}.mark-name{font-family:var(--hand-display);letter-spacing:0;text-transform:none;font-size:22px;font-style:normal;font-weight:600;line-height:1}.mark-dot{opacity:.5;font-style:normal}.mark-sub{opacity:.75;font-size:11px}.counter{z-index:30;font-family:var(--hand);letter-spacing:.04em;opacity:.8;pointer-events:none;align-items:baseline;gap:4px;font-size:18px;display:flex;position:fixed;bottom:28px;right:36px}.counter .num{font-size:24px;font-weight:500}.counter .slash{opacity:.5;padding:0 2px}.counter .den{opacity:.6;font-size:16px}.scroll-hint{z-index:30;font-family:var(--hand);opacity:.45;letter-spacing:.05em;pointer-events:none;font-size:16px;animation:2.4s ease-in-out infinite bob;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}@keyframes bob{0%,to{opacity:.4;transform:translate(-50%)}50%{opacity:.65;transform:translate(-50%,4px)}}.feed-scroller{scroll-snap-type:y mandatory;scroll-behavior:smooth;height:100%;overflow-y:auto}.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{justify-content:center;align-items:center;height:100%;display:flex}.feed-page{width:100%}.feed-inner{grid-template-columns:180px auto 180px;align-items:center;gap:56px;padding:0 40px;display:grid}.feed-margin{flex-direction:column;gap:28px;display:flex}.feed-margin.left{text-align:right;align-items:flex-end;padding-bottom:60px}.feed-margin.right{text-align:left;align-items:flex-start;padding-top:60px}.margin-block{flex-direction:column;gap:4px;display:flex}.meta-label{font-family:var(--hand-display);letter-spacing:.04em;opacity:.5;font-size:14px}.meta-value{font-size:22px}.meta-value,.tag-line{font-family:var(--hand);opacity:.9;font-weight:400}.tag-line{letter-spacing:.02em;font-size:15px;line-height:1.6}.feed-frame-wrap{cursor:zoom-in;outline:none;transition:transform .4s cubic-bezier(.2,.7,.2,1);position:relative}.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{content:"";border:1px dashed var(--ink-faint);border-radius:4px;position:absolute;inset:-16px}.zoom-hint{opacity:0;pointer-events:none;font-size:14px;transition:opacity .3s;position:absolute;bottom:-32px;right:0;transform:rotate(-2deg)}.feed-frame-wrap:hover .zoom-hint{opacity:.55}.grid-view{height:100%;padding:40px 60px 60px;overflow-y:auto}.grid-view::-webkit-scrollbar{width:8px}.grid-view::-webkit-scrollbar-track{background:0 0}.grid-view::-webkit-scrollbar-thumb{background:var(--ink-faint);border-radius:4px}.grid-inner{justify-content:center;align-items:flex-start;gap:50px;max-width:1400px;margin:0 auto;display:flex}.grid-col{flex:none;gap:50px}.grid-cell,.grid-col{flex-direction:column;display:flex}.grid-cell{cursor:zoom-in;outline:none;align-items:center;gap:16px;transition:transform .4s cubic-bezier(.2,.7,.2,1)}.grid-cell:hover{transform:translateY(-4px)}.grid-caption{text-align:center;flex-direction:column;align-items:center;gap:2px;font-size:18px;display:flex}.grid-date{opacity:.55;font-size:13px;font-style:italic}.scattered-view{height:100vh;padding:90px 40px 60px;overflow:auto}.scattered-view::-webkit-scrollbar{width:8px;height: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;transform-origin:50%;outline:none;transition:transform .5s cubic-bezier(.2,.7,.2,1);position:absolute}.scattered-cell:hover{z-index:5;transform:rotate(0)translateY(-6px)scale(1.04)!important}.scattered-caption{text-align:center;opacity:.7;font-size:16px;position:absolute;bottom:-28px;left:0;right:0}.animate-in{animation:.9s cubic-bezier(.2,.7,.2,1) backwards drawIn}@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:.9s cubic-bezier(.2,.7,.2,1) backwards drawInTilt}@keyframes drawInTilt{0%{opacity:0}to{opacity:1}}.zoom-overlay{z-index:100;-webkit-backdrop-filter:blur(8px);cursor:zoom-out;background:oklch(96.7267% .0110735 89.7229/.92);justify-content:center;align-items:center;animation:.35s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.zoom-stage{cursor:default;flex-direction:column;align-items:center;gap:18px;animation:.4s cubic-bezier(.2,.7,.2,1) zoomPop;display:flex;position:relative}@keyframes zoomPop{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.zoom-meta-top{opacity:.9;align-items:baseline;gap:12px;font-size:22px;display:flex}.zoom-meta-sep{opacity:.4}.zoom-meta-bottom{opacity:.7;letter-spacing:.04em;font-size:16px}.zoom-frame-wrap{justify-content:center;align-items:center;display:flex}.zoom-close{font-family:var(--hand);cursor:pointer;opacity:.55;background:0 0;border:none;padding:6px 10px;font-size:16px;transition:opacity .2s;position:absolute;top:-56px;right:0}.zoom-close:hover{opacity:1}.sketch-frame{-webkit-user-select:none;user-select:none}@media (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{letter-spacing:.16em;font-size:10px}.feed-inner{flex-direction:column;justify-content:center;gap:14px;width:100%;height:100%;padding:24px 16px;display:flex}.feed-margin{flex-flow:wrap;flex:none;gap:18px;text-align:left!important;align-items:flex-start!important;padding:0!important}.feed-margin.left{padding-bottom:0!important}.feed-margin.right{padding-top:0!important}.feed-frame-wrap{flex:none;justify-content:center;align-items:center;display:flex}.grid-view{padding:24px 20px 60px}.counter{bottom:16px;right:16px}}