:root{--red:#A20000;--ink:#FFFFFF;--black:#000000;--card:#0C0C0C;--input:#161616;--border:#252525;--muted:#8A8A8A;--max:1260px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px;background:#000}
body{margin:0;background:#000;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip;min-width:0}
body,button,input{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif}
button,a,input{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.52}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #E54B4B;outline-offset:4px}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{width:min(var(--max),calc(100% - 72px));margin-inline:auto;min-width:0}
.header{min-height:104px;padding-top:env(safe-area-inset-top,0px);display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid #242424}
.brand{display:flex;align-items:center;gap:22px;flex-shrink:0;min-width:0}
.brand-word{font-size:33px;letter-spacing:-2.6px;font-weight:950;font-style:italic;line-height:1;transform:skew(-3deg)}
.brand-word span,.footer-brand span{color:var(--red)}
.brand-detail{font-size:9px;font-weight:790;line-height:1.4;letter-spacing:1.55px;color:#777;border-left:1px solid #363636;padding-left:17px}
.header-nav{display:flex;align-items:center;gap:32px;font-size:12px;font-weight:640;color:#aaa}
.header-nav a:hover{color:white}
.header-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;border-radius:7px;font-size:11px;font-weight:880;letter-spacing:1.1px;line-height:1.2;white-space:nowrap;border:1px solid transparent;transition:background .2s ease,transform .2s ease,color .2s ease}
.header-cta:hover,.btn:hover{transform:translateY(-1px)}
.header-cta{padding:15px 18px;background:var(--red);color:#fff}
.header-cta svg,.btn svg{width:16px;height:16px}
.btn-primary{background:var(--red);color:#fff;border-color:var(--red)}
.btn-primary:not(:disabled):hover,.header-cta:hover{background:#BF1111}
.btn-neutral{background:#1A1A1A;border-color:#303030;color:white}
.btn-neutral:not(:disabled):hover{background:#262626}
.btn-ghost{background:transparent;border-color:#595959;color:#fff}
.hero{min-height:506px;padding:68px 0 60px;display:grid;grid-template-columns:minmax(0,1fr) 305px;align-items:center;gap:32px;border-bottom:1px solid #242424}
.eyebrow{display:flex;align-items:center;gap:10px;color:#B1B1B1;letter-spacing:2.2px;font-size:10px;font-weight:820}
.eyebrow-mark{width:23px;height:2px;background:var(--red)}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(48px,6.3vw,90px);line-height:.96;letter-spacing:-.076em;font-weight:950;margin:30px 0 27px;max-width:850px;white-space:nowrap}
.hero-red,.accent-dot,.red-dot{color:var(--red)}.white-dot{color:#fff}
.hero-copy>p{max-width:475px;color:#999;font-size:15px;line-height:1.8;margin:0}
.hero-actions{margin-top:29px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.hero-actions .btn{padding:18px 23px}
.hero-secondary{border-left:1px solid #414141;padding-left:18px;color:#656565;font-size:9px;line-height:1.8;letter-spacing:1.3px;font-weight:750}
.hero-decoration{min-height:338px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.hero-decoration::before{content:"";position:absolute;width:258px;height:258px;border-radius:50%;background:radial-gradient(circle,#A2000024,transparent 68%);filter:blur(30px)}
.hero-film{position:relative;transform:rotate(12deg);width:132px;background:#A20000;padding:21px 17px 22px;box-shadow:22px 25px 70px #A2000024;display:grid;gap:10px;border:2px solid #B31A1A}
.film-frame{background:#050505;height:49px;display:flex;align-items:center;justify-content:center;color:#393939;font-weight:900;font-size:17px;letter-spacing:-1px}
.film-hole{height:7px;background:repeating-linear-gradient(90deg,#000 0 6px,transparent 6px 15px);opacity:.6}
.decoration-caption{position:absolute;bottom:8px;right:0;color:#555;font-size:8px;letter-spacing:1.8px;font-weight:800}
.studio-section,.custom-section{padding-top:76px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:27px}
.kicker{color:#A3A3A3;letter-spacing:2px;font-size:10px;font-weight:850;margin-bottom:13px}
h2{font-size:clamp(28px,4.2vw,49px);font-weight:950;letter-spacing:-.055em;line-height:1.02;margin:0}
.section-note{font-size:12px;line-height:1.7;color:#777;margin:0;text-align:right}
.studio-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:17px;align-items:stretch}
.card{background:#0C0C0C;border:1px solid #252525;border-radius:15px;padding:20px;min-width:0;overflow:hidden}
.card-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;min-width:0}
.micro-title{font-size:10px;font-weight:850;letter-spacing:1.6px;color:#C7C7C7}
.micro-divider{color:#515151;margin:0 5px}
.camera-badge,.ready-badge{display:inline-flex;align-items:center;gap:7px;font-size:9px;color:#919191;font-weight:750;letter-spacing:1px;white-space:nowrap}
.status-circle,.ready-badge span{width:6px;height:6px;border-radius:50%;background:#666}
.camera-badge.is-on{color:#eee}.camera-badge.is-on .status-circle,.ready-badge span{background:var(--red)}
.camera-surface{position:relative;aspect-ratio:1.38;background:linear-gradient(135deg,#141414,#080808);border-radius:9px;overflow:hidden;isolation:isolate}
.camera-surface::after{content:"";pointer-events:none;position:absolute;z-index:3;inset:11px;border:1px solid #ffffff25;border-radius:2px}
#cameraVideo{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .3s ease}
#cameraVideo.video-on{opacity:1}#cameraVideo.mirrored{transform:scaleX(-1)}
.camera-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:2;gap:0;text-align:center;background:radial-gradient(circle at 50% 40%,#171717,#070707 75%);padding:20px}
.camera-placeholder[hidden]{display:none}
.camera-outline{color:#A20000;width:54px;height:54px;stroke-width:1.45;margin-bottom:17px}
.camera-placeholder strong{font-size:clamp(12px,1.8vw,17px);font-weight:940;letter-spacing:-.2px}
.camera-placeholder p{font-size:12px;line-height:1.6;color:#8D8D8D;margin:9px 0 18px}
.camera-open{padding:12px 16px}
.camera-overlay-top,.camera-overlay-bottom{position:absolute;z-index:4;display:flex;align-items:center;justify-content:space-between;left:24px;right:24px;gap:6px;color:#eee;font-size:9px;font-weight:770;letter-spacing:1.15px;pointer-events:none;text-shadow:0 1px 7px black}
.camera-overlay-top{top:24px}.camera-overlay-bottom{bottom:24px}.camera-overlay-bottom svg{width:13px;height:13px;vertical-align:middle;margin-right:3px}
.rec-pill{background:#0009;padding:6px 8px;border-radius:3px;color:#fff}.rec-pill i{display:inline-block;vertical-align:middle;width:6px;height:6px;background:var(--red);border-radius:50%;margin-right:4px}
.countdown-overlay{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#0007;backdrop-filter:blur(2px)}
.countdown-overlay[hidden]{display:none}
.countdown-ring{display:grid;place-items:center;width:112px;height:112px;border-radius:50%;border:2px solid #fff;color:white;background:#A2000080}
.countdown-ring span{font-size:67px;font-weight:950;line-height:1}
.countdown-overlay p{font-size:11px;font-weight:880;letter-spacing:2px;margin:15px 0 0}
.flash-layer{position:absolute;inset:0;background:white;z-index:11;opacity:0;pointer-events:none;transition:opacity .15s}
.flash-layer.flash{opacity:.94;transition:none}
.camera-buttons{margin-top:14px;display:flex;gap:10px;min-width:0}
.camera-buttons .btn{min-height:56px}.btn-start{flex:1;min-width:0;justify-content:space-between;padding:16px 19px}
.btn-start .arrow-right{font-size:19px;font-weight:400;margin-left:auto}
.btn-switch{padding:14px 19px;min-width:92px}
.camera-info{font-size:11px;color:#8A8A8A;min-height:18px;line-height:1.5;margin:12px 0 21px}
.camera-info.error{color:#F58080}
.shots-heading{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #282828;padding-top:19px;margin-bottom:12px}
.shots-heading>span{font-size:11px;color:#888;font-variant-numeric:tabular-nums;font-weight:840;letter-spacing:1px}
.shots-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;min-width:0}
.shot-tile{background:#131313;border:1px dashed #444;position:relative;aspect-ratio:1.08;border-radius:6px;min-width:0;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#666;transition:border .2s ease,background .2s}
.shot-tile[disabled]{opacity:.5}.shot-tile.has-photo{border:1px solid #3c3c3c;padding:0}
.shot-tile img{width:100%;height:100%;object-fit:cover}
.shot-num{font-weight:800;font-size:14px;letter-spacing:-.4px}
.shot-tile.has-photo .shot-num{position:absolute;top:5px;left:5px;font-size:9px;color:white;background:#0008;border-radius:2px;padding:4px 5px}
.shot-tile.has-photo::after{content:"↻";display:flex;align-items:center;justify-content:center;position:absolute;right:5px;bottom:5px;width:18px;height:18px;background:#000b;border-radius:50%;color:white;font-size:14px}
.shot-footer{margin-top:17px;display:flex;justify-content:space-between;align-items:center;gap:14px}
.upload-button,.text-button{display:inline-flex;gap:9px;align-items:center;background:none;border:0;color:#E7E7E7;font-size:10px;font-weight:850;letter-spacing:1.1px;cursor:pointer;padding:8px 0}
.upload-button svg{width:14px;height:14px}
.upload-button:hover,.text-button:hover{color:white}.text-button{color:#727272}
.text-button span{font-size:17px;color:#A20000;line-height:0}
.result-card{display:flex;flex-direction:column}
.preview-box{background:radial-gradient(circle at 49% 31%,#232323,#0A0A0A 65%);border:1px solid #222;min-height:340px;flex:1;border-radius:8px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:20px 18px}
.preview-box:before{position:absolute;content:"";pointer-events:none;inset:0;background:linear-gradient(90deg,transparent 48.5%,#ffffff04 50%,transparent 51.5%)}
.paper-shadow{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-width:0;max-height:590px;filter:drop-shadow(13px 19px 19px #0008)}
#stripCanvas{display:block;max-width:100%;max-height:580px;width:auto;height:auto;object-fit:contain;image-rendering:auto;user-select:none}
.preview-corner{position:absolute;right:14px;bottom:13px;font-size:9px;font-weight:850;letter-spacing:1.3px;color:#686868}
.result-buttons{display:flex;gap:10px;margin-top:15px}.result-buttons>.btn{min-height:54px;padding:13px 16px}.result-buttons .btn-primary{flex:1;min-width:0}.result-buttons .share-button{flex:0 0 auto}
.download-note{margin:13px 0 0;font-size:11px;line-height:1.5;color:#777}.download-note strong{color:#ccc;font-weight:650}
.custom-section{padding-bottom:80px}.settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.setting-card{padding:22px;border-radius:11px;background:#0D0D0D;border:1px solid #242424;min-width:0;display:flex;flex-direction:column;gap:15px}
.setting-label{display:flex;gap:10px;align-items:center;color:var(--red);font-weight:850;font-size:10px;letter-spacing:1.2px}
.setting-label span{color:#D2D2D2}
.setting-card p{color:#747474;font-size:11px;line-height:1.55;margin:0}
.segmented{display:flex;background:#171717;padding:5px;border:1px solid #2D2D2D;border-radius:7px;gap:4px;min-width:0}
.segmented button{flex:1;min-width:0;border:1px solid transparent;background:transparent;color:#858585;border-radius:4px;font-size:10px;font-weight:800;letter-spacing:.4px;min-height:41px;padding:7px 2px;touch-action:manipulation}
.segmented button.is-active{background:#A20000;color:white;box-shadow:0 3px 10px #0003}
.swatch-row{display:flex;gap:12px;align-items:center;min-height:50px;flex-wrap:wrap}
.swatch{width:33px;height:33px;border-radius:6px;background:var(--swatch);border:2px solid #3c3c3c;outline:2px solid transparent;outline-offset:3px;flex-shrink:0}
.swatch.selected{outline-color:#A20000;border-color:#f0f0f0}
#paperName{font-size:10px;font-weight:800;letter-spacing:.8px;margin-left:auto;color:#999}
.caption-input{width:100%;min-width:0;background:#181818;color:white;border:1px solid #393939;min-height:45px;border-radius:6px;padding:10px 12px;font-size:13px;outline:none}
.caption-input:focus{border-color:#A20000}
.toggle-label{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:10px;font-weight:810;letter-spacing:.6px;color:#B2B2B2;user-select:none}
.toggle-label input{position:absolute;opacity:0;width:1px;height:1px}
.toggle-track{display:inline-flex;width:32px;height:18px;background:#3c3c3c;border-radius:18px;align-items:center;padding:2px;transition:.2s;flex-shrink:0}
.toggle-track::before{content:"";width:14px;height:14px;background:#fff;border-radius:50%;transition:transform .2s}
.toggle-label input:checked+.toggle-track{background:#A20000}
.toggle-label input:checked+.toggle-track::before{transform:translateX(14px)}
.toggle-label input:focus-visible+.toggle-track{outline:2px solid white;outline-offset:3px}
.end-panel{border-top:1px solid #272727;border-bottom:1px solid #272727;padding-top:24px;padding-bottom:49px}
.end-line{display:flex;justify-content:space-between;font-size:9px;font-weight:850;color:#666;letter-spacing:1.5px}
.end-content{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-top:28px}
.end-content p{font-size:clamp(28px,4.5vw,55px);font-weight:940;letter-spacing:-.055em;line-height:1.06;margin:0}.end-content p span{color:var(--red)}
.end-content>a{font-size:10px;font-weight:880;letter-spacing:.8px;display:flex;gap:9px;align-items:center;border-bottom:1px solid #A20000;padding-bottom:8px}
.footer{min-height:112px;padding-bottom:env(safe-area-inset-bottom,0px);display:flex;align-items:center;justify-content:space-between;gap:20px}
.footer-brand{font-size:21px;letter-spacing:-1px;font-style:italic;font-weight:950}
.footer p,.footer>span:last-child{font-size:9px;color:#6d6d6d;font-weight:800;letter-spacing:1.25px;margin:0}
.toast{position:fixed;z-index:50;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:#202020;color:white;border:1px solid #444;box-shadow:0 15px 40px #000b;border-radius:8px;padding:13px 17px;font-size:12px;max-width:min(400px,calc(100vw - 28px));pointer-events:none;opacity:0;transition:opacity .18s,transform .18s;text-align:center}
.toast.show{transform:translate(-50%,0);opacity:1}
@media(max-width:1060px){.hero{grid-template-columns:minmax(0,1fr) 210px;gap:5px}.hero-film{transform:rotate(9deg) scale(.86)}h1{font-size:clamp(48px,6.8vw,70px)}.wrap{width:min(var(--max),calc(100% - 48px))}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.wrap{width:calc(100% - 32px)}.header{min-height:80px;gap:9px}.brand{gap:12px}.brand-word{font-size:28px}.brand-detail{font-size:7px;letter-spacing:1px;padding-left:10px}.header-nav{display:none}.header-cta{padding:12px 13px;font-size:9px}.header-cta svg{width:12px;height:12px}.hero{padding:54px 0 44px;min-height:unset;display:block}.hero-decoration{display:none}.eyebrow{font-size:9px}h1{font-size:clamp(37px,8.5vw,64px);margin:24px 0 20px}.hero-copy>p{font-size:13px;max-width:430px}.hero-actions{margin-top:25px}.studio-section,.custom-section{padding-top:52px}.section-heading{align-items:start}.section-note{font-size:10px}.studio-grid{grid-template-columns:1fr;gap:15px}.card{padding:16px}.camera-surface{aspect-ratio:1.32}.preview-box{min-height:380px}.paper-shadow{max-height:610px}#stripCanvas{max-height:585px}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.end-panel{margin-top:0}}
@media(max-width:560px){.brand-detail{display:none}.header-cta{font-size:9px;padding:12px 11px}.brand-word{font-size:28px}.hero{padding:49px 0 42px}h1{font-size:clamp(33px,9.5vw,52px);letter-spacing:-.07em}.hero-copy>p{font-size:13px;line-height:1.7}.hero-actions{gap:14px}.hero-secondary{font-size:8px;padding-left:12px;letter-spacing:.7px}.hero-actions .btn{padding:15px 14px;font-size:10px}.section-heading{display:block}.section-note{display:none}h2{font-size:35px}.card-heading{gap:6px}.micro-title{font-size:9px;letter-spacing:1px}.camera-badge,.ready-badge{font-size:8px;letter-spacing:.2px}.camera-placeholder p{font-size:10px}.camera-overlay-top,.camera-overlay-bottom{left:17px;right:17px;font-size:8px}.camera-overlay-top{top:20px}.camera-overlay-bottom{bottom:20px}.camera-buttons .btn{min-height:52px}.btn-start{padding:12px;font-size:10px}.btn-switch{padding:12px;min-width:75px;font-size:9px;gap:6px}.shots-grid{gap:6px}.preview-box{min-height:375px;padding:18px}.settings-grid{grid-template-columns:1fr}.setting-card{padding:19px}.segmented button{font-size:11px}.custom-section{padding-bottom:56px}.end-panel{padding-top:19px;padding-bottom:37px}.end-content{align-items:start;flex-direction:column;gap:21px}.end-content p{font-size:37px}.footer{min-height:105px}.footer p{display:none}.footer>span:last-child{font-size:8px}}
@media(max-width:345px){.wrap{width:calc(100% - 24px)}.brand-word{font-size:25px}.header-cta{font-size:8px;padding:10px}.header-cta svg{display:none}h1{font-size:32px}.hero-actions .btn{padding:14px 11px}.hero-secondary{font-size:7px}.result-buttons>.btn{font-size:9px;gap:6px;padding:12px 11px}.camera-overlay-bottom{font-size:7px}.camera-info{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* STRIP. v2 — faithful brand, responsive photo studio and scrapbook customization */
.brand-wordmark{display:block;width:clamp(128px,14vw,174px);height:auto;max-height:87px;object-fit:contain;flex-shrink:0}
.footer-wordmark{display:block;width:104px;height:auto;max-height:66px;object-fit:contain;flex-shrink:0}
.header{min-height:110px}
.hero{min-height:445px;padding-top:52px;padding-bottom:45px}
.hero h1{margin-bottom:0}
.hero-actions{margin-top:31px}
.shot-tile{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;transition:border-color .15s,transform .12s,box-shadow .12s;overflow:visible}
.shot-tile img{position:absolute;inset:0;border-radius:5px;pointer-events:none}
.shot-tile.has-photo{border-color:#505050;isolation:isolate}
.shot-tile.has-photo .shot-num{z-index:1}
.shot-tile.has-photo:after{content:"↻";z-index:1}
.shot-tile.is-dragging{border-color:#A20000;box-shadow:0 12px 25px #000d;cursor:grabbing;opacity:.94}
.shot-tile.drop-target{border:2px solid #E00000;box-shadow:0 0 0 3px #A2000038}
.shot-grip{position:absolute;top:5px;right:5px;border-radius:3px;padding:0 4px;background:#000a;color:#FFFFFF;font-size:18px;font-weight:800;z-index:1;line-height:18px;pointer-events:none}
.drag-hint{font-size:9px;line-height:1.6;letter-spacing:.55px;color:#777;font-weight:800;margin:11px 0 0}
.drag-hint span{color:#A20000;margin:0 5px}
.preview-box{overflow:hidden}
.paper-shadow{max-height:645px}
#stripCanvas{max-height:620px}
/* Keep camera controls centered between permanent recording/status overlay labels. */
.camera-placeholder{inset:52px 14px 56px;padding:8px 15px;gap:0;justify-content:center}
.camera-placeholder strong{line-height:1.25}
.camera-placeholder p{font-size:clamp(10px,1.3vw,12px);line-height:1.45;margin:12px 0 15px}
.camera-open{min-height:47px;padding:12px 20px}
.edge-card{grid-column:span 2}
.edge-style-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.edge-style-grid button{min-width:0;min-height:95px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border:1px solid #353535;background:#171717;color:#B6B6B6;border-radius:8px;font-size:10px;font-weight:820;letter-spacing:.3px;padding:8px 5px}
.edge-style-grid button.is-active,.logo-options button.is-active{background:#240606;color:#fff;border-color:#A20000;box-shadow:0 0 0 1px #A200003a inset}
.edge-visual{display:block;width:min(75%,90px);height:35px;background:#faf8f3;box-shadow:1px 3px 4px #0009;flex-shrink:0}
.edge-clean{border-radius:1px}
.edge-soft{clip-path:polygon(0 4%,8% 0,17% 3%,26% 0,39% 6%,52% 0,65% 5%,75% 1%,86% 4%,100% 0,96% 20%,100% 37%,97% 52%,100% 70%,95% 85%,100% 99%,84% 96%,73% 100%,60% 97%,46% 100%,31% 96%,18% 100%,6% 95%,0 100%,3% 75%,0 56%,4% 33%)}
.edge-rough{clip-path:polygon(0 10%,12% 0,24% 9%,42% 0,54% 8%,74% 0,85% 8%,100% 0,92% 21%,100% 44%,90% 59%,100% 80%,91% 100%,75% 92%,61% 100%,45% 91%,25% 100%,8% 89%,0 100%,8% 81%,0 60%,10% 42%)}
.edge-deckled{clip-path:polygon(0 2%,5% 0,10% 3%,15% 0,20% 4%,25% 0,30% 5%,35% 0,40% 5%,45% 0,50% 4%,55% 0,60% 4%,65% 0,70% 5%,75% 0,80% 5%,85% 0,90% 4%,95% 0,100% 4%,96% 20%,100% 50%,96% 70%,100% 98%,90% 96%,80% 100%,70% 96%,60% 100%,50% 96%,40% 100%,30% 96%,20% 100%,10% 96%,0 100%,4% 70%,0 45%,4% 20%)}
.edge-vintage{background:#dfc6a1;clip-path:polygon(0 7%,14% 0,28% 6%,45% 2%,60% 8%,82% 0,100% 9%,96% 40%,100% 68%,92% 100%,71% 95%,49% 100%,22% 91%,0 100%,7% 70%,0 43%)}
.edge-polaroid{height:41px;background:linear-gradient(#8b8b8b,#8b8b8b) 6px 5px/calc(100% - 12px) 23px no-repeat,#fff;border:1px solid #bdbdbd}
.range-setting{display:grid;gap:9px}
.range-label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:10px;letter-spacing:.7px;color:#C8C8C8;font-weight:800}
.range-label output{color:#FFFFFF;font-variant-numeric:tabular-nums}
.range-setting input[type=range]{width:100%;accent-color:#A20000;min-height:26px;touch-action:pan-y;cursor:pointer}
.mini-label{font-size:10px;color:#C8C8C8;letter-spacing:.7px;font-weight:800}
.edge-papers{display:flex;flex-wrap:wrap;gap:13px;align-items:center}
.edge-papers button{width:32px;height:32px;background:var(--swatch);border:2px solid #454545;outline:2px solid transparent;outline-offset:3px;border-radius:7px}
.edge-papers button.selected{outline-color:#A20000;border-color:#F0F0F0}
.detail-toggles{display:grid;gap:14px;padding-top:5px}
.logo-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.logo-options button{min-width:0;border:1px solid #3B3B3B;border-radius:8px;background:#171717;color:#B9B9B9;padding:10px 3px;min-height:95px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;font-size:10px;font-weight:840;letter-spacing:.2px}
.logo-options img{width:auto;height:52px;max-width:88%;object-fit:contain}
.logo-options .no-logo{font-size:31px;font-weight:400;color:#999;line-height:52px}
.photo-actions[hidden]{display:none}
.photo-actions{position:fixed;z-index:80;inset:0;background:#000d;display:grid;place-items:center;padding:calc(18px + env(safe-area-inset-top)) 18px calc(18px + env(safe-area-inset-bottom));backdrop-filter:blur(4px)}
.photo-actions-panel{background:#111;border:1px solid #3C3C3C;border-radius:17px;max-width:420px;width:100%;padding:24px;display:grid;gap:11px;box-shadow:0 20px 90px #000b}
.photo-actions-heading{display:flex;align-items:start;justify-content:space-between;gap:12px}
.photo-actions-heading .kicker{margin:0 0 8px}
.photo-actions-heading h3{font-size:26px;letter-spacing:-.5px;margin:0}
.photo-actions-panel>p{color:#999;font-size:12px;line-height:1.5;margin:0 0 7px}
.photo-actions-panel .btn{min-height:51px;padding:13px;letter-spacing:.7px;font-size:11px}
.actions-close{width:34px;height:34px;background:#1D1D1D;color:#FFF;border:1px solid #444;border-radius:50%;font-size:26px;line-height:25px}
.footer{gap:18px}
@media(max-width:1060px){.edge-card{grid-column:span 2}}
@media(max-width:760px){
  .header{min-height:calc(86px + env(safe-area-inset-top,0px))}
  .brand-wordmark{width:135px;max-height:70px}
  .hero{min-height:0;padding-top:44px;padding-bottom:40px}
  .hero-actions{margin-top:23px}
  .camera-placeholder{inset:49px 10px 51px;padding:5px 10px}
  .camera-placeholder p{margin:10px 0 12px}
  .paper-shadow{max-height:660px}
  #stripCanvas{max-height:635px}
  .edge-card{grid-column:span 2}
}
@media(max-width:560px){
  .header{min-height:calc(78px + env(safe-area-inset-top,0px))}
  .brand-wordmark{width:124px}
  .hero{padding-top:36px;padding-bottom:38px}
  .hero-actions{margin-top:23px}
  .camera-placeholder{inset:40px 9px 43px;padding:3px 8px}
  .camera-placeholder strong{font-size:12px}
  .camera-placeholder p{font-size:10px;margin:7px 0 10px;line-height:1.35}
  .camera-open{min-height:40px;padding:9px 12px;font-size:10px}
  .camera-overlay-top{top:14px}
  .camera-overlay-bottom{bottom:13px}
  .edge-card{grid-column:span 1}
  .edge-style-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .edge-style-grid button{font-size:9px;min-height:78px;gap:6px}
  .edge-visual{height:27px}
  .logo-options button{min-height:82px;font-size:9px}
  .logo-options img{height:43px}
  .logo-options .no-logo{font-size:29px;line-height:43px}
  .drag-hint{font-size:8px}
  .footer-wordmark{width:96px}
}
@media(max-width:345px){
  .brand-wordmark{width:112px}
  .edge-style-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .camera-placeholder strong{font-size:11px}
  .camera-placeholder p{font-size:9px}
  .camera-open{min-height:38px;font-size:9px}
  .camera-placeholder{inset:37px 8px 38px;padding:0 8px}
  .camera-overlay-top,.camera-overlay-bottom{left:11px;right:11px}
  .footer>span:last-child{display:none}
}
