/* A contemporary chrome and cherry photo machine. */
:root{--paper:#edf0f2;--ink:#20232b;--cherry:#c52b49;--line:#cbd0d7}
body{background-color:var(--paper);background-image:radial-gradient(ellipse at 10% 15%,#e1e7f6,transparent 50%),linear-gradient(90deg,#8992a30b 1px,transparent 1px),linear-gradient(#8992a30b 1px,transparent 1px);background-size:auto,48px 48px,48px 48px;overflow-x:clip}.brand{font-family:Quick,sans-serif;font-size:26px;letter-spacing:-1.5px;font-style:normal;color:#25262e}.brand span{font-size:11px;color:#bd2947;letter-spacing:3px}.header-note{font-size:12px;color:#666c7a}
main{max-width:1190px;grid-template-columns:1.08fr 1fr;gap:80px;margin-top:20px}.booth{border:1px solid #fff;border-radius:48px;padding:36px 30px 24px;background:linear-gradient(135deg,#fe5877,#ca2549 32%,#9c173b 72%,#cf3154);box-shadow:inset 2px 2px 1px #ffb6c7,inset -3px -3px 1px #72192d,0 25px 70px #6d31432b;color:#fff6f8;transition:box-shadow .5s,transform .5s;transform:perspective(1200px) rotateY(var(--tilt-x,0deg)) rotateX(var(--tilt-y,0deg));transform-origin:50% 25%}.booth:before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,#fff2,transparent 25%,transparent 70%,#fff1);border-radius:inherit}.booth-top{font-size:11px;margin-bottom:24px}.booth-number{background:#ffffff12;border-color:#ffc4d155}.machine-title{font:600 clamp(36px,4vw,53px)/1.05 Quick,sans-serif;letter-spacing:-2px}.machine-title em{font-style:normal;color:#ffd9e2}.machine-title>span{font-size:53px;color:#e0ff9e;animation:booth-star 18s linear infinite}
.viewfinder{border:7px solid #d4d6df;border-radius:23px;height:245px;box-shadow:0 0 0 1px #fff9,0 5px 0 #6d173e,0 14px 30px #3a08254a,inset 0 0 20px #000}.viewfinder>img{transition:transform 1.2s cubic-bezier(.16,1,.3,1);transform:scale(1.04)}.printing .viewfinder>img{transform:scale(1.12)}.finder-corners{inset:18px;border-color:#fff5}.preview-label{font-size:12px;bottom:16px}.preview-label>span:last-child{padding:3px 8px;background:#160f2170;border-radius:5px}.machine-controls{font-size:10px;margin-top:22px}.status-lamp{font-size:13px}.status-lamp i{background:#e3ff9f;box-shadow:0 0 10px #e3ff9f}.slot{height:16px;border:3px solid #aaaebb;background:linear-gradient(#080c16,#373846);box-shadow:0 1px 0 #fff,0 3px 8px #370d2a55;overflow:hidden}.slot:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#e3ff9f,transparent);transform:translateX(-110%);opacity:0}.printing .slot:after{opacity:1;animation:scanner 1.3s ease-in-out infinite}.print-window{margin:0 24px;transition:max-height 3.2s cubic-bezier(.22,.61,.36,1)}.print-paper{transition:transform 3.2s cubic-bezier(.22,.61,.36,1);filter:drop-shadow(0 8px 7px #270f2870)}.print-paper:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#fff4 50%,transparent 65%);transform:translateX(-120%)}.printing .print-paper:after{animation:paper-gloss 3.5s ease forwards}.empty-print{padding-top:15px}.empty-print p{font-size:14px}.booth-bottom{font-size:11px}.booth.printing{box-shadow:inset 2px 2px 1px #ffc4d0,inset -3px -3px 1px #72192d,0 25px 90px #cb345740}
.editor{padding-top:24px}h1{font:600 clamp(58px,5.4vw,78px)/1.03 Quick,sans-serif;letter-spacing:-4px}h1 em{font-style:normal}.eyebrow{font-size:12px}.lead{color:#69717e}.setting-label{font-size:14px}.thumbnails{gap:12px;margin-bottom:18px}.thumbnails img{width:70px;height:80px;border-radius:3px;border-color:#fff;box-shadow:0 8px 15px #29334520;transition:transform .35s cubic-bezier(.16,1,.3,1)}.thumbnails img:hover{transform:translateY(-9px) rotate(0) scale(1.06)}.upload{font-size:14px;border:1px solid #bcc4d1;border-radius:10px;padding:9px 14px;background:#ffffff65;transition:background .2s,transform .2s}.upload:hover{background:#fff;transform:translateY(-2px)}.upload span{font-size:13px;color:#687482}.field-note{font-size:12px;color:#717781}.swatches{gap:14px}.swatch{font-size:14px;color:#535b69;min-height:44px;padding:5px 8px;border-radius:25px;transition:background .2s,transform .2s}.swatch.selected{background:#ffffffa0;box-shadow:0 3px 8px #2530520c}.swatch:hover{transform:translateY(-2px)}.swatch span{width:26px;height:26px}.swatch.selected span{outline-color:#657082}#message{font:400 17px/1.7 Thai,sans-serif;color:#313947;border-color:#aeb9c8}#message-length{font-size:12px;color:#6a7280}
.primary,.save{border-radius:100px;min-height:58px;font-size:16px}.primary{background:#212632;border:0;box-shadow:0 5px 18px #27304620;position:relative;overflow:hidden}.primary:hover{background:#c52b49;box-shadow:0 10px 30px #c52b4930;transform:translateY(-3px)}.primary span{transition:transform .3s}.primary:hover span{transform:translate(3px,3px)}.primary:disabled{opacity:.85;background:#424758}.save{background:#e1fbb4;border:1px solid #c7dba4;color:#273223}.save:hover{background:#d2f68b;transform:translateY(-2px)}#status{font-size:14px;color:#616d7d}.edition-note p{font-size:13px}.edition-note p>span{color:#77808d}.seal{border-color:#9ba6b7;outline-color:#9ba6b7;color:#64738b}.seal small{font-size:9px}footer{font-size:12px;color:#6c7685;border-color:#ced5df}.capture-pulse{position:absolute;inset:0;border:2px solid #fff;pointer-events:none;opacity:0;border-radius:15px}.flash.active+.capture-pulse{animation:focus-pulse .65s ease-out}.print-progress{height:3px;background:#ffffff18;border-radius:5px;margin:0 0 13px;overflow:hidden}.print-progress i{display:block;height:100%;width:0;background:#dfff98;box-shadow:0 0 10px #dfff98}.printing .print-progress i{animation:print-progress 5.6s cubic-bezier(.2,.65,.3,1) forwards}.has-print:not(.printing) .print-progress i{width:100%}
.booth.has-print .print-window{max-height:1400px}
@keyframes booth-star{to{transform:rotate(360deg)}}@keyframes scanner{to{transform:translateX(110%)}}@keyframes paper-gloss{to{transform:translateX(120%)}}@keyframes focus-pulse{0%{opacity:.8;transform:scale(.95)}100%{opacity:0;transform:scale(1.04)}}@keyframes print-progress{from{width:0}to{width:100%}}
@media(max-width:850px){main{gap:32px}.booth{padding:30px 23px 22px}.machine-title{font-size:38px}h1{font-size:58px;letter-spacing:-3px}.machine-controls>span:last-child{font-size:9px}}
@media(max-width:600px){header{padding:22px 22px}.brand{font-size:23px}.header-note{font-size:10px;max-width:115px}main{padding:0 20px;margin-top:0;max-width:450px;gap:32px}.booth{border-radius:35px;padding:29px 24px 20px;transform:none}.booth-top{font-size:10px}.machine-title{font-size:36px}.machine-title>span{font-size:45px}.viewfinder{height:190px}.preview-label{font-size:11px;left:9px;right:9px}.machine-controls>span:last-child{font-size:8px}.print-window{margin:0 20px}.booth-bottom{font-size:10px}.editor{padding-top:0}h1{font-size:56px;letter-spacing:-3px}.eyebrow{font-size:12px}.lead{font-size:16px}.field-note{font-size:12px}.swatches{gap:4px;justify-content:space-between}.swatch{font-size:13px;padding:5px}.download-ready #save{background:#e1fbb4;border-color:#b8d387;left:20px;width:calc(100% - 40px);bottom:16px;box-shadow:0 10px 40px #1a273540}footer{font-size:12px}.edition-note{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.booth{transform:none}.printing .print-progress i{width:100%}}

.sample-message{font:400 17px/1.7 Thai,sans-serif;color:#313947;border-bottom:1px solid #aeb9c8;padding:8px 0;margin:0 0 8px}.sample-order{display:inline-block;margin:12px 0 0;color:#a72f3d;font:500 14px/1.7 Thai,sans-serif;text-underline-offset:4px}.sample-order:focus-visible{outline:2px solid #a72f3d;outline-offset:5px}
