*{box-sizing:border-box}:root{color:#332d28;font-synthesis:none;text-rendering:optimizelegibility;background:#d8c9ad;font-family:Trebuchet MS,Arial,sans-serif}html{background:#d8c9ad}body{background:radial-gradient(circle at 15% 12%,#ffffff8c,#0000 18rem),radial-gradient(circle at 82% 80%,#6f5f4629,#0000 22rem),repeating-linear-gradient(0deg,#5a462d09 0 1px,#0000 1px 4px),#d8c9ad;min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,input:focus-visible{outline-offset:3px;outline:3px solid #4f6e92}.paper-stage{min-height:100vh;padding:28px 18px 42px}.loading-stage,.empty-stage,.maintenance-stage{place-items:center;display:grid}.scrapbook-loading{letter-spacing:.06em;text-transform:uppercase;background:#efe5cf;border:3px solid #7f7058;align-items:center;gap:12px;padding:14px 18px;font-weight:800;display:flex;box-shadow:5px 6px #4e3d2729}.film-dot{background:#b24d45;border-radius:50%;width:12px;height:12px;display:block}.album-header{background:#f4e9d3;border:1px solid #b7a486;width:min(1160px,100%);margin:0 auto 24px;padding:25px 28px 22px;position:relative;transform:rotate(-.25deg);box-shadow:7px 8px #493a2521,inset 0 0 0 8px #eee2c8,inset 0 0 0 10px #a88d68}.album-header:after{content:"";pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 3px,#5a462d06 3px 4px);position:absolute;inset:0}.album-label{color:#fff4df;letter-spacing:.14em;background:#5f7e95;padding:7px 12px;font-size:11px;font-weight:900;position:absolute;top:-10px;right:22px;transform:rotate(2deg);box-shadow:3px 3px #3c322633}.header-mainline{z-index:1;justify-content:space-between;align-items:flex-end;gap:20px;display:flex;position:relative}.album-kicker,.mini-label{letter-spacing:.19em;color:#836b4c;font-size:11px;font-weight:900}.album-header h1{color:#3b3027;text-shadow:2px 2px #d5bea0;margin:4px 0;font-family:Segoe Print,Comic Sans MS,cursive;font-size:clamp(34px,6vw,60px);line-height:.98}.album-meta{letter-spacing:.14em;color:#77634b;font-size:11px;font-weight:900}.header-actions{flex-wrap:wrap;justify-content:flex-end;gap:9px;display:flex}.button{text-transform:uppercase;letter-spacing:.12em;background:#f3ead7;border:2px solid #4d4338;padding:11px 14px;font-size:11px;font-weight:900;transition:transform .12s,box-shadow .12s,background .12s;box-shadow:3px 3px #3d31223b}.button:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:5px 5px #3d312233}.button-primary{color:#fff7e7;background:#cc6c56;border-color:#7a3e32}.button-secondary{color:#fff7e7;background:#6a8196;border-color:#40566b}.wide{width:100%}.compact{padding:8px 10px;font-size:10px}.content{width:min(1160px,100%);margin:0 auto}.album-book{padding:18px 62px 26px;position:relative}.page-sheet{transform-origin:50%;background:#f4ead5;border:1px solid #bda98a;max-width:980px;min-height:660px;margin:0 auto;animation-duration:.26s;animation-timing-function:ease-out;animation-fill-mode:both;position:relative;box-shadow:11px 14px #4c3b2629,inset 0 0 0 10px #eee1c6,inset 0 0 0 12px #9f8a68}.page-sheet:before{content:"";pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 3px,#5a462d06 3px 4px);position:absolute;inset:0}.page-next{animation-name:pageNext}.page-prev{animation-name:pagePrev}@keyframes pageNext{0%{opacity:.6;transform:translate(18px)rotate(.6deg)}to{opacity:1;transform:translate(0)rotate(0)}}@keyframes pagePrev{0%{opacity:.6;transform:translate(-18px)rotate(-.6deg)}to{opacity:1;transform:translate(0)rotate(0)}}.page-inner{min-height:660px;padding:22px 24px 30px;position:relative}.page-topline{color:#806a4d;letter-spacing:.16em;text-transform:uppercase;justify-content:space-between;gap:12px;padding:0 4px 12px;font-size:10px;font-weight:900;display:flex}.page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 26px;padding:8px 6px 20px;display:grid}.photo-card{text-align:left;break-inside:avoid;background:0 0;border:0;padding:0;transition:transform .15s;position:relative}.photo-card:hover{z-index:2;transform:translateY(-4px)rotate(0)!important}.photo-paper{background:#f7f0df;border:1px solid #c7b799;padding:11px 11px 14px;position:relative;overflow:hidden;box-shadow:6px 8px #4b3b2626}.photo-paper:before{content:"";pointer-events:none;border:1px solid #ffffffa6;position:absolute;inset:0}.photo-card img{aspect-ratio:4/3;object-fit:cover;background:#c9baa2;width:100%;display:block}.photo-caption{color:#5f5141;white-space:nowrap;text-overflow:ellipsis;padding:10px 4px 0;font-family:Segoe Print,Comic Sans MS,cursive;font-size:14px;overflow:hidden}.tilt-1{transform:rotate(-1.2deg)}.tilt-2{transform:rotate(.9deg)}.tilt-3{transform:rotate(-.5deg)}.tilt-4{transform:rotate(1.45deg)}.tilt-5{transform:rotate(-.8deg)}.is-unlocked .photo-paper{background:#fffdf6}.is-unlocked img{filter:saturate(.94)contrast(1.02)}.lock-overlay{color:#fff8e9;text-shadow:0 2px 3px #00000080;background:linear-gradient(#312a2314,#312a2342);flex-direction:column;justify-content:center;align-items:center;gap:4px;display:flex;position:absolute;inset:11px 11px 46px}.lock-icon{font-size:38px;line-height:1}.lock-overlay span{letter-spacing:.18em;font-size:12px;font-weight:900}.lock-overlay small{letter-spacing:.15em;font-size:9px;font-weight:800}.page-note{text-align:center;color:#75624a;padding-top:4px;font-family:Segoe Print,Comic Sans MS,cursive;font-size:13px;transform:rotate(-1deg)}.page-number{color:#80694c;font-family:Segoe Print,Comic Sans MS,cursive;font-size:15px;position:absolute;bottom:13px;right:26px}.page-nav{z-index:3;color:#4d4133;background:#f3e8d3;border:2px solid #8d7555;width:50px;height:72px;font-size:44px;line-height:1;position:absolute;top:50%;transform:translateY(-50%);box-shadow:4px 5px #3d31222e}.page-nav-left{left:8px}.page-nav-right{right:8px}.page-controls{color:#6f5a43;letter-spacing:.14em;justify-content:center;align-items:center;gap:14px;padding:24px 4px 4px;font-size:10px;font-weight:900;display:flex}.empty{text-align:center;color:#655846;padding:90px 20px}.empty-sticker{color:#fff6e8;background:#d46d59;border-radius:50%;place-items:center;width:70px;height:70px;margin:0 auto 20px;font-size:34px;display:grid;transform:rotate(-7deg);box-shadow:4px 5px #4232242e}.empty h2{margin:0 0 6px;font-family:Segoe Print,Comic Sans MS,cursive;font-size:32px}.empty p{margin:0;font-weight:700}.paper-note{background:#f5ead5;border:1px solid #bea98a;width:min(480px,100%);padding:50px 38px 42px;position:relative;transform:rotate(-1deg);box-shadow:8px 10px #493a2526}.paper-note h1{margin:10px 0 12px;font-family:Segoe Print,Comic Sans MS,cursive;font-size:42px;line-height:1}.paper-note p{color:#665744;font-weight:700;line-height:1.6}.paper-note code{background:#e3d4bb;padding:2px 5px}.maintenance-note{text-align:center}.maintenance-mark{color:#b24d45;margin-top:18px;font-family:Segoe Print,Comic Sans MS,cursive;font-size:48px}.tape{background:#dbc587b8;width:105px;height:28px;position:absolute;top:-12px;left:50%;transform:translate(-50%)rotate(-2deg);box-shadow:0 1px 2px #4d3b2426}.modal-backdrop,.viewer{z-index:100;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#3d2f20c2;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.unlock-modal,.scanner-card{background:#f4e7cf;border:2px solid #8a7658;width:min(480px,100%);padding:28px 28px 26px;position:relative;transform:rotate(-.7deg);box-shadow:10px 12px #30261b47}.tape-modal{background:#dcc283d9}.modal-close{color:#594c3c;background:0 0;border:0;width:38px;height:38px;font-size:31px;position:absolute;top:8px;right:10px}.modal-close.static{position:static}.unlock-preview{background:#fcf7ec;border:1px solid #c7b899;margin-bottom:18px;padding:9px;position:relative;box-shadow:4px 5px #4c3c2724}.unlock-preview img{aspect-ratio:4/3;object-fit:cover;filter:saturate(.62)contrast(.92);width:100%;display:block}.preview-lock{text-shadow:0 3px 4px #00000080;place-items:center;font-size:44px;display:grid;position:absolute;inset:0}.unlock-modal h2,.scanner-card h2{margin:4px 0 0;font-family:Segoe Print,Comic Sans MS,cursive;font-size:30px;line-height:1}.unlock-filename{color:#7b6953;white-space:nowrap;text-overflow:ellipsis;margin:4px 0 20px;font-size:12px;overflow:hidden}.unlock-form{gap:9px;display:grid}.unlock-form label{letter-spacing:.16em;color:#7c664b;font-size:10px;font-weight:900}.unlock-form input{color:#43372b;text-align:center;letter-spacing:.12em;background:#fff9ec;border:2px solid #ab9675;width:100%;padding:13px 12px;font-weight:900}.unlock-form input::placeholder{color:#b2a48f;letter-spacing:.06em}.or-line{color:#957f61;letter-spacing:.16em;align-items:center;gap:11px;margin:17px 0;font-size:9px;font-weight:900;display:flex}.or-line:before,.or-line:after{content:"";background:#c9b99e;flex:1;height:1px}.tiny-note{color:#88745a;margin:15px 0 0;font-size:10px;font-weight:700;line-height:1.5}.scanner-card{width:min(620px,100%)}.scanner-header{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:14px;display:flex}.scanner-frame{aspect-ratio:4/3;background:#201d19;border:8px solid #f7efdf;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ae9a79}.scanner-frame video{object-fit:cover;width:100%;height:100%;display:block}.scan-line{background:#e66f58;height:2px;position:absolute;top:50%;left:8%;right:8%;box-shadow:0 0 16px #e66f58cc}.scan-corners{border:3px solid #fff7e4cc;position:absolute;inset:12% 15%;box-shadow:inset 0 0 0 1px #00000040}.error-box{color:#703e34;background:#f5d9d0;border:2px solid #bd705d;margin:14px auto 0;padding:12px 14px;font-size:12px;font-weight:800;box-shadow:3px 4px #4d35281f}.viewer{background:#221d18e8;padding:45px 80px 88px}.viewer-paper{background:#f8f0de;max-width:min(1080px,92vw);max-height:84vh;padding:14px 14px 18px;transform:rotate(.25deg);box-shadow:10px 12px #00000047}.viewer-image{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:74vh;display:block}.viewer-caption{color:#665644;padding:10px 2px 0;font-family:Segoe Print,Comic Sans MS,cursive;font-size:14px}.viewer-close{color:#43382d;background:#f6eddc;border:2px solid #ddd0b8;width:45px;height:45px;font-size:29px;position:absolute;top:14px;right:18px;box-shadow:3px 4px #00000038}.viewer-nav{color:#43382d;background:#f6eddc;border:2px solid #ddd0b8;width:52px;height:68px;font-size:43px;position:absolute;top:50%;transform:translateY(-50%);box-shadow:3px 4px #00000038}.viewer-prev{left:16px}.viewer-next{right:16px}.viewer-toolbar{letter-spacing:.12em;color:#5d4c39;background:#f4e7cf;border:2px solid #8a7658;align-items:center;gap:13px;padding:9px 12px;font-size:10px;font-weight:900;display:flex;position:absolute;bottom:14px;left:50%;transform:translate(-50%);box-shadow:5px 6px #00000040}@media (width<=760px){.paper-stage{padding:16px 10px 28px}.album-header{padding:24px 17px 18px}.header-mainline{flex-direction:column;align-items:flex-start}.header-actions{justify-content:flex-start}.album-label{right:12px}.album-book{padding:12px 34px 18px}.page-sheet{min-height:auto}.page-inner{min-height:auto;padding:18px 14px 28px}.page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px;padding-inline:2px}.page-nav{width:38px;height:54px;font-size:32px}.page-nav-left{left:0}.page-nav-right{right:0}.page-topline{font-size:8px}.photo-paper{padding:7px 7px 10px}.lock-overlay{inset:7px 7px 37px}.photo-caption{padding-top:7px;font-size:12px}.page-note{font-size:11px}.page-number{right:18px}.page-controls{flex-wrap:wrap;gap:8px}.viewer{padding:40px 48px 82px}.viewer-prev{left:6px}.viewer-next{right:6px}.viewer-paper{padding:9px 9px 13px}}@media (width<=520px){.album-header h1{font-size:39px}.button{padding:10px 11px;font-size:10px}.unlock-modal,.scanner-card{padding:24px 18px}.paper-note{padding:44px 25px 36px}.album-book{padding-inline:26px}.page-grid{grid-template-columns:1fr}.page-nav{width:34px;height:48px;font-size:28px}.page-topline{flex-direction:column;gap:4px}.viewer{padding:40px 40px 80px}.viewer-nav{width:40px;height:54px;font-size:34px}.viewer-toolbar{bottom:8px}.viewer-image{max-height:72vh}}@media (prefers-reduced-motion:reduce){.page-sheet{animation:none}.button{transition:none}}