.album-app{--bg:#6fd7a4;--ink:#111;--accent:#d7e86b;--white:#fff;--border-w:3px;--shadow-off:4px;--radius:14px}*{box-sizing:border-box}html,.album-app{margin:0;padding:0}.album-app{background:var(--bg);color:var(--ink);-webkit-tap-highlight-color:transparent;height:100vh;font-family:Inter,sans-serif;overflow:hidden}.album-app .album-container{background:var(--bg);flex-direction:column;max-width:430px;height:100vh;margin:0 auto;display:flex;position:relative}.topbar{z-index:40;background:var(--bg);border-bottom:var(--border-w) solid var(--ink);flex:none;justify-content:space-between;align-items:center;padding:16px 16px 10px;display:flex;position:sticky;top:0;box-shadow:0 4px 6px -1px #0000001a}.icon-btn{border:var(--border-w) solid var(--ink);background:var(--ink);width:38px;height:38px;box-shadow:var(--shadow-off) var(--shadow-off) 0 0 #0000008c;cursor:pointer;color:var(--white);border-radius:10px;flex:none;justify-content:center;align-items:center;padding:0;transition:transform 80ms,box-shadow 80ms;display:flex}.icon-btn:active{transform:translate(3px,3px);box-shadow:1px 1px #0000008c}.back-btn{border-color:var(--accent)}.pulse-btn{background:var(--white);border-color:var(--ink);color:var(--ink)}.icon-btn svg{width:19px;height:19px}.upload-section{flex:none;align-items:flex-start;gap:10px;padding:16px 16px 8px;display:flex}.upload-scroll{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex:auto;gap:10px;min-width:0;padding-bottom:2px;display:flex;overflow-x:auto}.upload-scroll::-webkit-scrollbar{display:none}.slot{border:var(--border-w) solid var(--ink);cursor:pointer;background:#ffffff2e;border-radius:18px;flex:none;justify-content:center;align-items:center;width:88px;height:88px;display:flex;position:relative;overflow:hidden}.slot.filled{background:var(--white);padding:0}.slot.placeholder{cursor:default;opacity:.55;border-style:dashed}.slot img{object-fit:cover;width:100%;height:100%;display:block}.slot svg{opacity:.85;width:22px;height:22px}.slot.glow{animation:.9s slotGlow}@keyframes slotGlow{0%{box-shadow:0 0 #fff0}35%{box-shadow:0 0 0 6px #ffffff8c,0 0 22px 6px #d7e86be6}to{box-shadow:0 0 #fff0}}.add-btn{border:var(--border-w) solid var(--ink);background:var(--white);width:88px;height:88px;box-shadow:var(--shadow-off) var(--shadow-off) 0 0 #00000059;cursor:pointer;border-radius:18px;flex:none;justify-content:center;align-items:center;transition:transform 80ms,box-shadow 80ms;display:flex}.add-btn:active{transform:translate(3px,3px);box-shadow:1px 1px #00000059}.add-btn svg{width:28px;height:28px}.puzzle-wrap{touch-action:none;flex:1;min-height:0;position:relative;overflow:hidden}.puzzle-canvas{transform-origin:0 0;will-change:transform;position:absolute;top:50%;left:50%}.puzzle-canvas.animated{transition:transform .9s cubic-bezier(.2,.8,.2,1)}.expand-btn{border:2.5px solid var(--ink);background:var(--white);cursor:pointer;z-index:5;border-radius:9px;justify-content:center;align-items:center;width:34px;height:34px;display:flex;position:absolute;box-shadow:3px 3px #00000059}.expand-btn svg{width:16px;height:16px}.expand-btn:active{transform:translate(2px,2px);box-shadow:1px 1px #00000059}.piece-outline{fill:none;stroke:var(--ink);stroke-width:2.6px;stroke-linejoin:round}.piece-group.just-added{animation:.6s cubic-bezier(.34,1.56,.64,1) pieceBounce}@keyframes pieceBounce{0%{opacity:0;transform:scale(.55)rotate(-8deg)}55%{opacity:1;transform:scale(1.08)rotate(2deg)}75%{transform:scale(.96)rotate(-1deg)}to{transform:scale(1)rotate(0)}}.piece-group.glow-now .piece-outline{animation:.9s pieceGlow}@keyframes pieceGlow{0%{stroke:var(--ink)}30%{stroke:var(--accent);stroke-width:5px}to{stroke:var(--ink);stroke-width:2.6px}}.flyer{border:3px solid var(--ink);z-index:999;pointer-events:none;border-radius:18px;width:88px;height:88px;position:fixed;overflow:hidden;box-shadow:4px 4px #00000059}.flyer img{object-fit:cover;width:100%;height:100%}.pulse-modal{z-index:50;color:#fff;background:#0b1220;flex-direction:column;display:none;position:absolute;inset:0}.pulse-modal.open{display:flex}.pulse-head{justify-content:space-between;align-items:center;padding:16px;display:flex}.pulse-title{letter-spacing:.02em;font-family:Fugaz One,cursive;font-size:20px}.pulse-close{color:#fff;cursor:pointer;background:0 0;border:2px solid #fff;border-radius:9px;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.globe-stage{flex:1;justify-content:center;align-items:center;display:flex;position:relative}.globe-stats{justify-content:center;gap:18px;padding:6px 16px 22px;font-family:Fira Sans Extra Condensed,sans-serif;display:flex}.globe-stats .stat{text-align:center}.globe-stats .num{color:var(--accent);font-size:20px;font-weight:700}.globe-stats .lbl{text-transform:uppercase;letter-spacing:.06em;opacity:.75;font-size:11.5px}.crop-modal{z-index:70;color:#fff;background:#0a0e14f5;flex-direction:column;display:none;position:absolute;inset:0}.crop-modal.open{display:flex}.crop-head{flex:none;justify-content:space-between;align-items:center;padding:16px;display:flex}.crop-title{font-family:Fugaz One,cursive;font-size:16px}.crop-btn{color:#fff;cursor:pointer;background:0 0;border:2px solid #fff;border-radius:10px;padding:7px 14px;font-size:13px;font-weight:700}.crop-btn.primary{background:var(--accent);color:#111;border-color:var(--accent)}.crop-stage{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative}.crop-frame{border:3px solid var(--accent);touch-action:none;cursor:grab;border-radius:22px;width:280px;height:280px;position:relative;overflow:hidden;box-shadow:0 0 0 2000px #0a0e14b3}.crop-frame:active{cursor:grabbing}.crop-frame img{transform-origin:0 0;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none;position:absolute;top:0;left:0}.crop-hint{text-align:center;opacity:.7;flex:none;padding:10px 16px 22px;font-size:12.5px}.crop-zoom-row{flex:none;align-items:center;gap:10px;padding:0 32px;display:flex}.crop-zoom-row input[type=range]{accent-color:var(--accent);flex:1}.toast{background:var(--ink);color:#fff;opacity:0;pointer-events:none;z-index:40;white-space:nowrap;border-radius:999px;padding:9px 16px;font-size:13px;font-weight:600;transition:opacity .25s;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.toast.show{opacity:1}