*{box-sizing:border-box}:root{--shutter-size:72px;--grip-inset:1rem}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:#1c1c1e}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:radial-gradient(#ffffff06 1px,#0000 1px) 0 0/3px 3px,linear-gradient(#1c1c1e,#2a2a2d 45%,#1a1a1c);flex-direction:column;display:flex}#camera{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed}#tray{flex:1;justify-content:center;align-items:center;margin:1.5rem;display:flex;position:relative}#tray:before{content:"";z-index:-1;background:linear-gradient(#141415,#1d1d1f);border-radius:14px;position:absolute;inset:0;box-shadow:inset 0 3px 8px #000000b3,0 1px #ffffff0f}.print{touch-action:none;cursor:grab;background:#f4f1ea;position:absolute;box-shadow:0 4px 16px #00000080}.animating{transition:transform .6s ease-out}.print-window{background:#2b2d2f;position:absolute}.print-image{opacity:0;width:100%;height:100%;display:block}#drawer{left:50%;bottom:calc(env(safe-area-inset-bottom) + 3 * var(--grip-inset) + var(--shutter-size) + 1rem);transform-origin:bottom;background:linear-gradient(90deg,#2a2a2d 0 6px,#0000 6px calc(100% - 6px),#2a2a2d calc(100% - 6px)),linear-gradient(#000,#111114);border:3px solid #3a3a3d;border-color:#0a0a0b #3a3a3d #4a4a4d;border-radius:8px;width:200px;height:80px;margin-left:-100px;transition:transform .4s ease-out;position:fixed;transform:scaleY(0);box-shadow:inset 0 6px 14px #000000e6,0 -2px #3a3a3d}#drawer.open{transform:none}.film-pack{touch-action:none;cursor:grab;background:repeating-linear-gradient(#3a3a3d 0 2px,#1e1e20 2px 5px) 50% calc(100% - 8px)/60% 18px no-repeat,linear-gradient(135deg,#4a4a4d,#2a2a2c 50%,#1e1e20);border-radius:6px;width:120px;height:140px;position:absolute;box-shadow:inset 0 1px #fff3,inset 0 -2px #00000080,0 8px 20px #0009}.film-pack:before{content:"";background:linear-gradient(160deg,#26262a,#050506 60%);border-radius:2px;position:absolute;inset:10px 10px 36px;box-shadow:inset 0 2px 4px #000000e6}#message{text-align:center;margin:0 1.5rem}#controls{margin:0 .75rem var(--grip-inset);padding:var(--grip-inset) .75rem;background:radial-gradient(#ffffff0f 1px,#0000 1.5px) 0 0/4px 4px,radial-gradient(#00000059 1px,#0000 1.5px) 2px 2px/4px 4px,#202022;border-radius:18px;grid-template-columns:1fr auto 1fr;align-items:center;display:grid;box-shadow:inset 0 1px #ffffff14,inset 0 -2px 6px #00000080,0 -1px #0009}#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:#f4f1ea;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);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{color:inherit;font:inherit;background:#3a3a3c;border:none;border-radius:8px;padding:.5rem 1rem}#print-share,#print-delete{margin-left:auto}#album-screen{background:radial-gradient(circle at 30% 20%,#4a3326,#2a1c14 70%)}#album-book{--edge:repeating-linear-gradient(to right, #3a3835 0 1px, #121211 1px 2px);touch-action:none;flex:1;margin:1rem 1.5rem 0;position:relative}#album-book:before,#album-book:after{content:"";background:var(--edge);position:absolute;top:3px;bottom:3px;box-shadow:0 6px 18px #00000080}#album-book:before{width:calc(min(var(--turned,0), 6) * 2px);right:100%}#album-book:after{width:calc(min(var(--unturned,0), 6) * 2px);left:100%}.album-page{background:linear-gradient(90deg,#00000080,#0000 8%),radial-gradient(#ffffff08 1px,#0000 1px) 0 0/4px 4px,#1d1d1b;border-radius:2px 6px 6px 2px;grid-template:1fr 1fr/1fr 1fr;gap:1.5rem;padding:1rem;display:grid;position:absolute;inset:0;box-shadow:4px 6px 18px #0009}.album-page.animating{transition-duration:.35s}.album-page.cover{background:linear-gradient(90deg,#00000073,#0000 6%),radial-gradient(circle at 30% 20%,#6b4630,#3d281b 75%);justify-content:center;align-items:center;display:flex}.cover-title{letter-spacing:.05em;color:#d9b866;text-shadow:0 -1px #0009,0 1px #ffffff26;margin:0;font:italic 600 2.5rem Georgia,serif}.album-empty{color:#8e8e93;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:rotate(var(--tilt)) scale(.82)}.tape{--x:-30%;--y:-10%;--angle:-45deg;width:30%;height:11%;transform:translate(var(--x), var(--y)) rotate(var(--angle));pointer-events:none;background:#f0e8cd99;position:absolute;box-shadow:0 1px 1px #00000026}.tape.top-left{top:0;left:0}.tape.top-right{--x:30%;--angle:45deg;top:0;right:0}.tape.bottom-left{--y:10%;--angle:45deg;bottom:0;left:0}.tape.bottom-right{--x:30%;--y:10%;bottom:0;right:0}#print-space{flex:1;justify-content:center;align-items:center;margin:0 1.5rem;display:flex;position:relative}#print-space .print{cursor:default}#confirm-delete{left:1.5rem;right:1.5rem;bottom:calc(env(safe-area-inset-bottom) + .5rem);text-align:center;background:#2c2c2e;border-radius:12px;padding:1rem;position:absolute}#confirm-delete[hidden]{display:none}#confirm-delete p{margin:0 0 1rem}#confirm-delete #delete-confirm{background:#e5484d;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{color:#f2f2f7;font-variant-numeric:tabular-nums;text-align:center;text-shadow:0 1px 1px #000c;background:linear-gradient(160deg,#ffffff2e,#0000 45%),linear-gradient(#000,#2a2a2c 45% 55%,#000);border:3px solid #0a0a0b;border-color:#0a0a0b #4a4a4d #5a5a5e #0a0a0b;border-radius:4px;justify-self:end;min-width:3ch;padding:.25rem .5rem;font:600 1.125rem ui-monospace,monospace;box-shadow:inset 0 2px 4px #000c}#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}