@import "https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&family=DM+Sans:wght@400;500;600&display=swap";:root{color:#171413;font-synthesis:none;text-rendering:geometricprecision;--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);background:#e9e6e6;font-family:DM Sans,Arial,sans-serif}*{box-sizing:border-box}html{scrollbar-gutter:stable;min-width:320px;min-height:100%}body{background:#e9e6e6;min-width:320px;min-height:100%;margin:0}button,input{font:inherit}button{color:inherit}.photo-ledge-page{min-height:100svh;padding:0 22px 22px;overflow:hidden}.photo-ledge-header{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:22px;min-height:251px;padding:38px 20px 25px;display:flex}.photo-ledge-header h1{letter-spacing:-.035em;margin:0;font-family:Caveat,Comic Sans MS,cursive;font-size:clamp(44px,4.05vw,60px);font-weight:700;line-height:.95}.photo-ledge-header>p:not(.eyebrow){color:#555;margin:0;font-size:clamp(17px,1.62vw,24px);line-height:1}.photo-ledge-header .eyebrow{color:#7c5a42;letter-spacing:.16em;text-transform:uppercase;margin:0 0 -8px;font-size:11px;font-weight:600}.photo-board-wrap{position:relative}.add-photo{z-index:50;color:#422817;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);min-height:46px;transition:transform .16s var(--ease-out-expo), box-shadow .16s var(--ease-out-expo);background:#fffffff0;border:1px solid #46261329;border-radius:999px;align-items:center;gap:8px;padding:0 18px;font-size:14px;font-weight:600;display:inline-flex;position:absolute;top:18px;right:18px;box-shadow:0 8px 24px #371c0c2e}.add-photo:hover{transform:translateY(-2px);box-shadow:0 12px 30px #371c0c40}.add-photo:active{transform:scale(.97)}.add-photo:focus-within{outline-offset:3px;outline:3px solid #fff}.add-photo>span{font-size:21px;font-weight:400;line-height:1}.add-photo input,.lightbox__replace input{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.photo-board{isolation:isolate;touch-action:none;background:#92613d;border-radius:20px;height:max(640px,100svh - 273px);min-height:640px;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff38,inset 0 -20px 50px #371c0c26}.photo-board__texture{z-index:0;opacity:.5;pointer-events:none;background-image:url(/images/photo-ledge/mosaic.png);background-position:0 0;background-repeat:repeat;background-size:355px 288px;position:absolute;inset:-96px 0}.photo-board:after{z-index:0;content:"";pointer-events:none;background:radial-gradient(circle at 50% 38%,#0000 30%,#401f0d1a);position:absolute;inset:0}.photo-board__hint{z-index:1;color:#ffffff85;margin:0;font-family:Caveat,cursive;font-size:17px;position:absolute;bottom:16px;right:25px;transform:rotate(-4deg)}.polaroid{cursor:grab;contain:layout style;touch-action:none;-webkit-user-select:none;user-select:none;will-change:transform;width:clamp(108px,14.3vw,206px);animation:photo-enter .62s var(--ease-spring) both;transition:box-shadow .18s var(--ease-out-expo), filter .18s var(--ease-out-expo);border:4px solid #fff;border-radius:16px;padding:7px 7px 18px;position:absolute;box-shadow:0 14px 30px #31190c33,0 2px 4px #31190c1a}.polaroid:nth-of-type(2){animation-delay:40ms}.polaroid:nth-of-type(3){animation-delay:80ms}.polaroid:nth-of-type(4){animation-delay:.12s}.polaroid:nth-of-type(5){animation-delay:.16s}.polaroid:nth-of-type(6){animation-delay:.2s}.polaroid:nth-of-type(7){animation-delay:.24s}.polaroid:nth-of-type(8){animation-delay:.28s}.polaroid:nth-of-type(9){animation-delay:.32s}.polaroid:hover{filter:saturate(1.04);scale:1.025;box-shadow:0 20px 42px #31190c47,0 3px 6px #31190c24}.polaroid--dragging{cursor:grabbing;filter:saturate(1.06);scale:1.055;box-shadow:0 30px 70px #2d140861,0 5px 10px #31190c2e}.polaroid__button{width:100%;cursor:inherit;background:0 0;border:0;flex-direction:column;align-items:stretch;gap:18px;padding:0;display:flex}.polaroid__button:focus-visible{outline-offset:8px;border-radius:8px;outline:3px solid #fff}.polaroid__image-frame{aspect-ratio:191/168;background:#ffffff59;border-radius:10px;width:100%;display:block;overflow:hidden}.polaroid__image-frame img{object-fit:cover;pointer-events:none;width:100%;height:100%;display:block}.polaroid__caption{text-align:center;text-overflow:ellipsis;white-space:nowrap;min-height:24px;font-family:Caveat,Comic Sans MS,cursive;font-size:clamp(13px,1.25vw,18px);font-weight:700;line-height:24px;display:block;overflow:hidden}.lightbox{z-index:1000;-webkit-backdrop-filter:blur(14px)saturate(.8);backdrop-filter:blur(14px)saturate(.8);cursor:zoom-out;animation:backdrop-enter .22s var(--ease-out-expo) both;background:#1f110bc7;place-items:center;padding:24px;display:grid;position:fixed;inset:0;overflow:auto}.lightbox__panel{cursor:default;width:min(92vw,680px);min-height:min(86vh,740px);animation:preview-enter .36s var(--ease-spring) both;place-items:center;display:grid;position:relative}.lightbox__close{z-index:2;color:#fff;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:70px;min-height:44px;transition:transform .16s var(--ease-out-expo), background .16s var(--ease-out-expo);background:#ffffff1a;border:1px solid #ffffff75;border-radius:999px;padding:0 16px;font-size:12px;font-weight:600;position:absolute;top:0;right:0}.lightbox__close:hover,.lightbox__replace:hover{background:#fff3;transform:translateY(-2px)}.lightbox__close:active,.lightbox__replace:active{transform:scale(.97)}.lightbox__close:focus-visible,.lightbox__replace:focus-visible{outline-offset:4px;outline:2px solid #fff}.lightbox__figure{flex-direction:column;align-items:center;gap:20px;margin:44px 0 0;display:flex}.lightbox__image-shell{border:7px solid #fff;border-radius:24px;width:min(70vw,480px);padding:14px 14px 24px;transform:rotate(-1.5deg);box-shadow:0 34px 100px #0000006b}.lightbox__image{object-fit:cover;background:#eee;border-radius:14px;width:100%;height:min(50vh,450px);display:block}.lightbox__caption{text-align:center;margin-top:18px;font-family:Caveat,cursive;font-size:clamp(26px,3vw,36px);font-weight:700;line-height:1}.lightbox__editor{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff1a;border:1px solid #ffffff3d;border-radius:22px;flex-direction:column;align-items:stretch;gap:12px;width:min(88vw,480px);padding:14px;display:flex}.lightbox__color-field{border:0;min-width:0;margin:0;padding:0}.lightbox__color-field legend,.lightbox__caption-field>span{color:#ffffffc2;letter-spacing:.08em;text-transform:uppercase;margin-bottom:7px;font-size:11px;font-weight:600}.lightbox__swatches{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.lightbox__swatch{cursor:pointer;width:42px;height:42px;transition:transform .16s var(--ease-spring), box-shadow .16s var(--ease-out-expo);border:3px solid #ffffffb8;border-radius:50%;padding:0;position:relative;box-shadow:0 3px 10px #00000029}.lightbox__swatch:hover{transform:translateY(-2px)scale(1.06)}.lightbox__swatch:active{transform:scale(.94)}.lightbox__swatch[aria-pressed=true]{transform:scale(.92);box-shadow:0 0 0 3px #342116,0 0 0 5px #fff}.lightbox__swatch:focus-visible,.lightbox__custom-color input:focus-visible{outline-offset:3px;outline:3px solid #fff}.lightbox__custom-color{color:#ffffffc2;cursor:pointer;place-items:center;gap:3px;min-width:54px;font-size:9px;font-weight:600;display:grid}.lightbox__custom-color input{cursor:pointer;background:#ffffff2e;border:2px solid #ffffffb8;border-radius:12px;width:42px;height:42px;padding:3px}.lightbox__custom-color input::-webkit-color-swatch-wrapper{padding:0}.lightbox__custom-color input::-webkit-color-swatch{border:0;border-radius:7px}.lightbox__editor-actions{align-items:flex-end;gap:12px;display:flex}.lightbox__caption-field{flex:1;display:grid}.lightbox__caption-field input{color:#342116;letter-spacing:normal;text-transform:none;background:#fffffff5;border:1px solid #ffffff6b;border-radius:14px;outline:0;width:100%;min-width:0;height:48px;padding:0 15px;font-size:15px;font-weight:500}.lightbox__caption-field input:focus-visible{outline-offset:3px;outline:3px solid #fff}.lightbox__replace{color:#342116;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);min-width:154px;min-height:48px;transition:transform .16s var(--ease-out-expo), background .16s var(--ease-out-expo);background:#fff;border:1px solid #fff;border-radius:14px;place-items:center;padding:0 22px;font-size:14px;font-weight:600;display:inline-grid}.lightbox__replace:hover{background:#f5ede7}.image-status{z-index:1200;color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);max-width:min(360px,100vw - 32px);animation:preview-enter .28s var(--ease-spring) both;background:#342116f0;border:1px solid #ffffff73;border-radius:16px;padding:14px 18px;font-size:14px;font-weight:600;position:fixed;bottom:22px;right:22px;box-shadow:0 18px 50px #1f110b47}.image-status--busy:before{content:"";border:2px solid #ffffff59;border-top-color:#fff;border-radius:50%;width:10px;height:10px;margin-right:10px;animation:.75s linear infinite status-spin;display:inline-block}.image-status--error{background:#70281ef5}@keyframes status-spin{to{transform:rotate(1turn)}}@keyframes photo-enter{0%{opacity:0;scale:.82}}@keyframes backdrop-enter{0%{opacity:0}}@keyframes preview-enter{0%{opacity:0;transform:scale(.92)translateY(18px)}}@media (width<=720px){.photo-ledge-page{padding:0 10px 10px}.photo-ledge-header{gap:16px;min-height:196px;padding-inline:8px}.photo-ledge-header h1{max-width:360px;font-size:42px}.photo-board{border-radius:16px;height:calc(100svh - 206px);min-height:700px}.add-photo{min-height:42px;padding:0 14px;top:12px;right:12px}.polaroid{border-width:3px;border-radius:11px;padding:5px 5px 9px}.polaroid__button{gap:7px}.polaroid__image-frame{border-radius:7px}.polaroid__caption{min-height:18px;font-size:13px;line-height:18px}.lightbox{padding:12px}.lightbox__panel{width:100%;min-height:92vh}.lightbox__image-shell{border-width:5px;border-radius:18px;width:min(88vw,430px);padding:9px 9px 18px}.lightbox__image{height:min(40vh,380px)}.lightbox__editor{width:min(92vw,430px)}.lightbox__swatches{gap:6px}.lightbox__swatch,.lightbox__custom-color input{width:38px;height:38px}.lightbox__editor-actions{flex-direction:column;align-items:stretch}.lightbox__replace{width:100%}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
