*{box-sizing:border-box}@font-face{font-family:Indie Flower;font-display:block;src:url(/assets/indie-flower-latin-CzUxbIJz.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Indie Flower;font-display:block;src:url(/assets/indie-flower-latin-ext-CN8kxkPe.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Permanent Marker;font-display:block;src:url(/assets/permanent-marker-latin-CMzatmOF.woff2)format("woff2")}:root{--shutter-size:72px;--grip-inset:1rem;--logo-font:"Futura", "Avenir Next", "Century Gothic", system-ui, sans-serif;--print-paper:#f4f1ea;--biro-ink:#1d2340;--strip-black:#000;--strip-orange:#f28c1e;--strip-blue:#7cc6ee}html,body{overscroll-behavior:none;color:#f2f2f7;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;height:100%;margin:0;font-family:system-ui,sans-serif;overflow:hidden}html{background:#111113}body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);isolation:isolate;background:linear-gradient(#18181a,#111113);grid-template:"logo""well"minmax(0,1fr)"drawer""message""grip"/minmax(0,1fr);display:grid}#camera{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed}#wordmark{color:#f2f2f7;font:500 1.15rem / 1 var(--logo-font);letter-spacing:.06em;text-align:center;grid-area:logo;margin-top:.75rem}#tray{grid-area:well;justify-content:center;align-items:center;margin:1rem 1.5rem .75rem;display:flex;position:relative}#tray:before{content:"";z-index:-1;background:#0b0b0c;border-radius:14px;position:absolute;inset:0;box-shadow:inset 0 1px 3px #000c,0 0 0 1px #ffffff0f}#how-to{color:#2b2610;pointer-events:none;background:linear-gradient(#fff3a3,#ffe873 30%,#fbe066);border-bottom-right-radius:18px 4px;grid-area:well;place-self:end start;width:10.5rem;margin:0 0 .25rem .75rem;padding:1rem .9rem .9rem;font-size:.85rem;font-weight:500;line-height:1.35;rotate:3deg;box-shadow:0 1px 2px #0006,6px 10px 14px -6px #000000b3}#how-to ol{counter-reset:step;gap:.4rem;margin:0;padding:0;list-style:none;display:grid}#how-to li{counter-increment:step;align-items:center;gap:.5rem;display:flex}#how-to li:before{content:counter(step);border:1.5px solid;border-radius:50%;flex:none;place-items:center;width:1.4rem;height:1.4rem;font-size:.75rem;font-weight:700;display:grid}#how-to-reload{border-top:1.5px dashed #2b261066;margin:.6rem 0 0;padding-top:.5rem;font-size:.75rem}.print{background:var(--print-paper);touch-action:none;cursor:grab;position:absolute;box-shadow:0 4px 16px #00000080}#tray .print{z-index:1}.animating{transition:transform .6s ease-out}.print-logo,.print-date{text-align:center;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute;inset-inline:0}.print-date{color:var(--biro-ink)}.print-window{background:#2b2d2f;position:absolute}.print-image{opacity:0;width:100%;height:100%;display:block}#drawer{background:linear-gradient(90deg,#2a2a2d 0 6px,#0000 6px calc(100% - 6px),#2a2a2d calc(100% - 6px)),linear-gradient(#000,#111114);border-radius:8px;grid-area:drawer;height:72px;margin:0 1.5rem .75rem;position:relative;overflow:hidden;box-shadow:inset 0 6px 14px #000000e6,0 -2px #3a3a3d}#drawer:before{content:"FILM";background:linear-gradient(90deg, transparent calc(100% - 44px), var(--strip-black) calc(100% - 44px) calc(100% - 32px), var(--strip-orange) calc(100% - 32px) calc(100% - 20px), var(--strip-blue) calc(100% - 20px) calc(100% - 8px), transparent calc(100% - 8px)), #26262a;color:#8e8e93;letter-spacing:.3em;place-items:center;padding-right:48px;font:700 .7rem system-ui,sans-serif;transition:transform .5s ease-in-out;display:grid;position:absolute;inset:0}#drawer.open:before{transform:translateY(100%)}#film-pack-spot{pointer-events:none;grid-area:well;place-self:start center;margin-top:2.5rem}.film-pack{z-index:1;color:#1c1c1e;touch-action:none;cursor:grab;pointer-events:auto;background:#f4f1ea;border-radius:3px;align-content:end;justify-items:center;gap:4px;width:120px;height:140px;padding:0 8px 10px 0;display:grid;position:relative;box-shadow:inset -8px 0 #d8d2c4,inset 0 -3px #c9c2b2,0 8px 20px #0009}.film-pack-strips{border-radius:3px;position:absolute;inset:0;overflow:hidden}.film-pack-strips:before{content:"";background:var(--strip-blue);width:120px;height:10px;box-shadow:0 10px 0 var(--strip-orange), 0 20px 0 var(--strip-black);position:absolute;top:9px;left:-46px;rotate:-45deg}.film-pack-name{font:700 .85rem / 1 var(--logo-font);letter-spacing:.02em}.film-pack-print{background:#2b2d2f;border:2px solid #fff;border-bottom-width:8px;width:30px;height:36px;box-shadow:0 1px 2px #0006}.film-pack small{font:600 .55rem system-ui,sans-serif}#message{text-align:center;grid-area:message;margin:0 1.5rem}#controls{margin:0 .75rem var(--grip-inset);padding:var(--grip-inset) .75rem;background:#1a1a1c;border-radius:18px;grid-area:grip;grid-template-columns:1fr auto 1fr;align-items:center;display:grid;box-shadow:0 0 0 1px #ffffff0d}:where([data-posture]:not([data-posture=phone])) #wordmark{margin-top:1rem;font-size:2rem}:where([data-posture]:not([data-posture=phone])) #how-to{align-self:start;width:12rem;margin:2.25rem 0 0 2.5rem;font-size:.95rem}:where([data-posture]:not([data-posture=phone])) #film-pack-spot{align-self:center;margin-top:0}[data-posture=fold-across]{--hinge-start:env(viewport-segment-bottom 0 0);--hinge-end:env(viewport-segment-top 0 1)}[data-posture=fold-down]{--hinge-start:env(viewport-segment-right 0 0);--hinge-end:env(viewport-segment-left 1 0)}:where([data-posture=fold-across]) body{grid-template-rows:3rem calc(var(--hinge-start) - env(safe-area-inset-top) - 3rem) calc(var(--hinge-end) - var(--hinge-start)) minmax(0, 1fr) auto auto auto;grid-template-areas:"logo""well"".""pack""drawer""message""grip"}:where([data-posture=fold-across]) #film-pack-spot{grid-area:pack}:where([data-layout=b]) body{--column:clamp(17rem, 30vw, 22rem);grid-template-columns:minmax(0, 1fr) var(--column);grid-template-areas:"well logo""well pack""well drawer""well message""well grip"}:where([data-layout=b]) #wordmark{margin-bottom:.5rem;font-size:1.6rem}:where([data-layout=b]) #tray{margin-bottom:1rem}:where([data-layout=b]) #film-pack-spot{grid-area:pack}@media (orientation:landscape) and (height<=499px){:where([data-layout=b]) #film-pack-spot{grid-area:well;align-self:center}}:where([data-posture=fold-down]) body{grid-template-columns:calc(var(--hinge-start) - env(safe-area-inset-left)) calc(var(--hinge-end) - var(--hinge-start)) 1fr var(--column) 1fr;grid-template-areas:"well. .logo.""well. .pack.""well. .drawer.""well. .message.""well. .grip."}#album{background:0 0;border:none;justify-content:center;justify-self:start;align-items:center;width:56px;height:56px;padding:0;display:flex;position:relative}.album-print{background:var(--print-paper);position:absolute;box-shadow:0 2px 6px #00000080}.screen{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);z-index:2;background:#1c1c1e;flex-direction:column;display:flex;position:fixed;inset:0}.screen[hidden]{display:none}.bar{align-items:center;gap:1rem;margin:1rem 1.5rem;display:flex}.bar p{margin:0 0 0 auto}.bar button,#confirm-delete button{--vinyl:linear-gradient(#6a4329, #4e301c);background:radial-gradient(#0003 1px, transparent 1.5px) 0 0 / 4px 4px, var(--vinyl);color:#ecd9a8;text-shadow:0 -1px #0000008c;border:none;border-radius:6px;padding:.6rem 1.15rem;font:600 1rem American Typewriter,Courier New,serif;position:relative;box-shadow:inset 0 1px #ffffff1f,0 1px #1e0f05cc,2px 4px 6px #00000073}.bar button:after,#confirm-delete button:after{content:"";pointer-events:none;border:1px dashed #e6c37d73;border-radius:4px;position:absolute;inset:3px}.bar button:active,#confirm-delete button:active{translate:1px 2px;box-shadow:inset 0 1px #ffffff14,0 1px 2px #00000073}.bar button:focus-visible,#confirm-delete button:focus-visible{outline-offset:3px;outline:2px solid #ecd9a8}#print-delete,#confirm-delete #delete-confirm{--vinyl:linear-gradient(#7c2b2b, #561b1c);color:#f3d6c4}#album-page{clip-path:var(--torn);color:#1f1408;font-variant-numeric:tabular-nums;background:linear-gradient(#ffffff59,#0000 30% 75%,#fff3),#faeec4eb;padding:.3rem .9rem;font:700 1.1rem American Typewriter,Courier New,serif;rotate:-2deg}#album-page:empty{visibility:hidden}#album-turns{align-items:center;gap:.75rem;margin-left:auto;display:flex}#album-turns p{margin:0}.bar .album-turn{padding-block:.3rem .5rem;font-size:1.6rem;line-height:1;display:none}:where([data-posture]:not([data-posture=phone])) .bar .album-turn{display:block}.album-turn:disabled{opacity:.4}#print-bar{grid-template-columns:1fr auto 1fr;display:grid}#print-close{grid-column:1;justify-self:start}#print-share{grid-column:2}#print-delete{grid-column:3;justify-self:end}#album-screen,#print-screen{--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .55 0 0 0 -.25'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");--wood:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.002 .09' numOctaves='4' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 0 0 0 -.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)'/%3E%3C/svg%3E");--card:#cfa043;--torn:polygon(0 4%, 3% 0, 97% 6%, 100% 0, 98% 22%, 100% 41%, 97% 60%, 100% 79%, 98% 100%, 4% 96%, 0 100%, 3% 80%, 0 62%, 2% 40%, 0 21%);background:radial-gradient(ellipse 120% 80% at 25% 15%, #ffd2962e, #00000073 75%), var(--wood), #5a3b24}#album-book{perspective:2200px;touch-action:none;flex:1;margin:1rem 1.5rem 0;position:relative}.album-leaf{transform-origin:0;transform-style:preserve-3d;will-change:transform;position:absolute;inset:0}.album-leaf.animating{transition-duration:.55s;transition-timing-function:cubic-bezier(.3,.7,.2,1)}.album-page{backface-visibility:hidden;background:linear-gradient(90deg, #3c230059, #3c230014 4%, transparent 9%), radial-gradient(ellipse 130% 90% at 20% 10%, #fff5d259, transparent 60%), var(--grain), repeating-linear-gradient(0deg, #ffffff12 0 1px, transparent 1px 6px), var(--card);border-radius:2px 4px 4px 2px;grid-template:1fr 1fr/1fr 1fr;padding:8% 6% 8% 9%;display:grid;position:absolute;inset:0;box-shadow:6px 10px 14px #00000080}.leaf-back{transform:rotateY(180deg)}.leaf-shade{z-index:1;border-radius:inherit;opacity:calc(var(--lift,0) * .55 + var(--cast,0));pointer-events:none;background:linear-gradient(90deg,#140a00e6,#140a0080);position:absolute;inset:0}.album-leaf.animating .leaf-shade{transition:opacity .55s cubic-bezier(.3,.7,.2,1)}.leaf-back:after{content:"";opacity:calc((1 - var(--lift,0)) * .8);pointer-events:none;background:linear-gradient(270deg,#140a0099,#140a0033);position:absolute;inset:0}.album-page:not(.cover,.leaf-back):after{content:"";background:linear-gradient(315deg, transparent 48%, #a07a2c 50%, #dcb764 62%, var(--card) 80%);border-top-left-radius:70% 30%;width:1.75rem;height:1.75rem;position:absolute;bottom:0;right:0}.album-page.cover{background:linear-gradient(90deg, #0006, #ffffff0f 3%, transparent 6%), radial-gradient(ellipse 120% 80% at 25% 15%, #ffdcaa24, transparent 60%), radial-gradient(#00000038 1px, transparent 1.5px) 0 0 / 4px 4px, var(--grain), #5e3a22;border-radius:3px 6px 6px 3px;justify-content:center;align-items:center;display:flex;container-type:inline-size}.album-page.cover:after{content:"";border:2px dashed #e1be7880;border-radius:4px;position:absolute;inset:.75rem .75rem .75rem 1.25rem}.cover-title{color:#4a2c18;text-shadow:0 1px #fff3,0 -1px #0009;margin:0;font:700 min(2.75rem,14cqi) American Typewriter,Courier New,serif}.album-empty{color:#5e4718;grid-area:1/1/-1/-1;place-self:center;margin:0}.album-cell{justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;position:relative}.album-cell .album-print{transform:translate(var(--nudge-x), var(--nudge-y)) rotate(var(--tilt)) scale(calc(var(--print-scale,.82) * var(--lay-down-scale)));background:linear-gradient(160deg,#ffffff80,#0000 40%,#78643c1f),#f4f1e8;box-shadow:0 0 0 .5px #00000026,1px 1px 1px #2814004d,4px 7px 10px -3px #28140073}.album-cell .album-print.taken-out{background:#ecc966;box-shadow:inset 0 0 3px #78500040}.album-cell .album-print.taken-out>*{visibility:hidden}.album-cell .print-window:after{content:"";background:linear-gradient(125deg,#ffffff29,#0000 35% 70%,#ffffff0f);position:absolute;inset:0;box-shadow:inset 0 0 2px #00000080}.tape{width:var(--length);aspect-ratio:7/2;filter:drop-shadow(0 .5px .5px #3c280059);pointer-events:none;position:absolute}.tape:before{content:"";clip-path:var(--torn);background:linear-gradient(#ffffff59,#0000 30% 75%,#fff3),#faeec49e;position:absolute;inset:0}.tape.top-left{rotate:calc(-40deg + var(--twist));top:-2%;left:-9%}.tape.top-right{rotate:calc(40deg + var(--twist));top:-2%;right:-9%}.tape.bottom-left{rotate:calc(40deg + var(--twist));bottom:-2%;left:-9%}.tape.bottom-right{rotate:calc(-40deg + var(--twist));bottom:-2%;right:-9%}.tape.top{translate:-50%;rotate:var(--twist);top:-4%;left:50%}.album-cell .album-print.laying-down{animation:.45s ease-out lay-down}.album-cell .album-print.laying-down>.tape{visibility:hidden}@property --lay-down-scale{syntax:"<number>";inherits:false;initial-value:1}@keyframes lay-down{0%{opacity:0;--lay-down-scale:1.5}}.album-cell .album-print.taping>.tape{animation:.25s ease-out backwards tape-down}.album-cell .album-print.taping>.tape:nth-of-type(2){animation-delay:.15s}@keyframes tape-down{0%{clip-path:inset(-2px 100% -2px -2px)}to{clip-path:inset(-2px)}}#print-space{flex:1;justify-content:center;align-items:center;margin:1.5rem 1.5rem 0;display:flex;position:relative}#print-space .print{z-index:1}#album-book.spread{--print-scale:.92}#album-book.spread .album-leaf{left:50%}#album-book.spread .album-page{padding:5% 4% 5% 6%}#album-book.spread .leaf-back{background:linear-gradient(270deg, #3c230059, #3c230014 4%, transparent 9%), radial-gradient(ellipse 130% 90% at 20% 10%, #fff5d259, transparent 60%), var(--grain), repeating-linear-gradient(0deg, #ffffff12 0 1px, transparent 1px 6px), var(--card);padding:5% 6% 5% 4%}@media (orientation:landscape) and (height<=499px){#album-screen{flex-direction:row}#album-book{margin:1rem 0 1rem 1.5rem}#album-screen .bar{flex-direction:column-reverse;justify-content:space-between;margin:1rem 1.25rem}#album-screen .bar p{margin:0}}:where(html:not([data-posture=fold-across])) #print-screen{background:#190f08bf}:where([data-posture=landscape]) #print-screen{flex-direction:row}:where([data-posture=landscape]) #print-space{margin:1.5rem 0 1.5rem 1.5rem}:where([data-posture=landscape],[data-posture=fold-across]) #print-bar{grid-template:none / auto;align-content:end;gap:1rem}:where([data-posture=landscape],[data-posture=fold-across]) :is(#print-close,#print-share,#print-delete){grid-area:auto;align-self:auto}:where([data-posture=fold-across]) #print-space{margin-bottom:1.5rem}:where([data-posture=fold-across]) #print-bar{position:absolute;bottom:1.5rem;right:0}:where([data-posture]:not([data-posture=phone])) :is(#album-screen,#print-screen){--wood:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2400' height='1200'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.0005 .09' numOctaves='4' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 0 0 0 -.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)'/%3E%3C/svg%3E")}:where([data-posture=fold-down]) #print-screen[data-side=left]{right:calc(100vw - var(--hinge-start))}:where([data-posture=fold-down]) #print-screen[data-side=right]{left:var(--hinge-end)}:where([data-posture=fold-across]) #album-screen{padding-top:var(--hinge-end)}:where([data-posture=fold-across]) #print-screen{height:var(--hinge-start);bottom:auto}#confirm-delete{left:1.5rem;right:1.5rem;bottom:calc(env(safe-area-inset-bottom) + .5rem);background:linear-gradient(160deg, #ffffff80, transparent 40%, #78643c1f), var(--grain), #f4f1e8;color:#2b2116;text-align:center;border-radius:2px;padding:1.25rem 1rem 1rem;font-family:American Typewriter,Courier New,serif;position:absolute;rotate:-1deg;box-shadow:1px 1px 1px #2814004d,4px 8px 14px #00000080}#confirm-delete[hidden]{display:none}#confirm-delete p{margin:0 0 1rem}#confirm-delete #delete-confirm{margin-left:1rem}#shutter{width:var(--shutter-size);height:var(--shutter-size);-webkit-tap-highlight-color:transparent;background:radial-gradient(circle at 35% 30%,#ff8a80,#e5484d 45%,#a3242a) padding-box padding-box,conic-gradient(#d8d8dc,#8e8e93,#f2f2f7,#8e8e93,#d8d8dc) border-box;border:5px solid #0000;border-radius:50%;grid-column:2;padding:0;transition:transform 60ms,box-shadow 60ms;box-shadow:0 4px #0a0a0b,0 6px 12px #0009,inset 0 -3px 6px #00000059}#shutter:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px #0a0a0b,0 2px 4px #0009,inset 0 3px 6px #0006}#shutter:disabled{filter:saturate(.3)brightness(.6)}#counter{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.counter-window{--h:1.5rem;perspective:140px;background:#000;border:3px solid #0a0a0b;border-color:#0a0a0b #4a4a4d #5a5a5e #0a0a0b;border-radius:5px;grid-column:3;justify-self:end;width:3.25rem;height:2.75rem;position:relative;overflow:hidden}.counter-window:after{content:"";background:linear-gradient(160deg,#fff3,#0000 40%),linear-gradient(#000000e6,#0000 38% 62%,#000000e6);position:absolute;inset:0;box-shadow:inset 0 2px 4px #000c}.counter-drum{--step:calc(360deg / var(--faces));--r:calc(var(--h) / (2 * tan(180deg / var(--faces))));transform-style:preserve-3d;transform:translateZ(calc(-1 * var(--r))) rotateX(calc(var(--n,0) * var(--step)));transition:transform .9s cubic-bezier(.34,1.35,.64,1);position:absolute;inset:0}.counter-face{height:var(--h);margin-top:calc(var(--h) / -2);color:#f2f2f7;font:600 1.125rem / var(--h) ui-monospace, monospace;text-align:center;backface-visibility:hidden;transform:rotateX(calc(var(--i) * var(--step) * -1)) translateZ(var(--r));background:linear-gradient(#141416,#2a2a2c 50%,#141416);position:absolute;top:50%;left:0;right:0}#permission-text{margin:auto 1.5rem}#permission-text h1{font-size:1.5rem}#permission-close{color:inherit;font:inherit;background:#3a3a3c;border:none;border-radius:8px;padding:.5rem 1.5rem}