@import "https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Noto+Sans+SC:wght@400;500;700;900&family=Noto+Serif+SC:wght@600;900&display=swap";:root{color:#f7f3e9;font-synthesis:none;--red:#b5262e;--gold:#d4ad62;--paper:#f4eee1;--ink:#1d2522;--muted:#9ba29e;--line:#ffffff24;background:#090b0a;font-family:Noto Sans SC,sans-serif}*{box-sizing:border-box}body{background:#090b0a;min-width:900px;min-height:100vh;margin:0;overflow:hidden}button,input,select{font:inherit;letter-spacing:0}button{cursor:pointer;border:0}button:disabled{opacity:.42;cursor:not-allowed}.device-frame{background:#151917;width:min(100vw,177.778vh);height:min(100vh,56.25vw);min-height:506px;margin:auto;position:relative;overflow:hidden;box-shadow:0 0 80px #000}.app-screen,.camera-screen,.welcome-screen,.login-screen,.status-screen,.complete-screen{position:absolute;inset:0;overflow:hidden}.device-header{border-bottom:1px solid var(--line);z-index:10;background:#111513;grid-template-columns:1fr auto 48px;align-items:center;gap:18px;height:70px;padding:0 24px;display:grid}.brand-button{color:#f7f3e9;background:0 0;align-items:center;gap:11px;width:max-content;padding:0;font-weight:900;display:flex}.brand-button b{background:var(--red);place-items:center;width:38px;height:38px;font:24px Bebas Neue;display:grid}.brand-button span{font-size:14px}.device-state{color:#e7e3d9;text-align:right;grid-template-columns:8px auto;align-items:center;gap:0 8px;font-size:11px;display:grid}.device-state i{background:#5d625f;border-radius:50%;width:8px;height:8px}.device-state i.online{background:#4cc477;box-shadow:0 0 10px #4cc477}.device-state small{color:var(--muted);grid-column:2;font-size:9px}.square-button,.back-button{color:#fff;background:#272d2a;border-radius:4px;place-items:center;width:44px;height:44px;display:grid}.square-button.light{background:#ffffff24;border:1px solid #ffffff40}.primary-button,.secondary-button,.start-button,.shutter-button{border-radius:4px;justify-content:center;align-items:center;gap:10px;min-height:50px;padding:0 22px;font-weight:800;display:flex}.primary-button,.start-button{color:#fff;background:var(--red)}.secondary-button{color:#e9e5dc;border:1px solid var(--line);background:#2a302d}.text-button{color:var(--muted);background:0 0;padding:10px}.inline-error{color:#9b1d2b;background:#f7e5e5;padding:9px 12px;font-size:11px}.login-screen{color:var(--ink);background:#e9e4d9;grid-template-columns:1.35fr .65fr;display:grid}.login-visual{position:relative;overflow:hidden}.login-visual img{object-fit:cover;filter:saturate(.75);width:100%;height:100%}.login-visual:after{content:"";background:linear-gradient(90deg,#0a0f0d1a,#0a0f0db8);position:absolute;inset:0}.login-visual>div{z-index:2;color:#fff;position:absolute;bottom:9%;left:7%}.login-visual span{color:var(--gold);font:20px Bebas Neue}.login-visual h1{margin:8px 0;font:900 76px/.84 Bebas Neue}.login-visual p{margin:0;font-size:13px}.login-panel{flex-direction:column;justify-content:center;gap:12px;padding:8%;display:flex}.login-panel>svg{color:var(--red)}.login-panel h2{margin:0 0 8px;font:900 28px Noto Serif SC}.login-panel label,.form-grid label{color:#68716d;gap:6px;font-size:10px;display:grid}.login-panel input,.form-grid input,.form-grid select{width:100%;height:42px;color:var(--ink);background:#fff;border:1px solid #c6cac6;border-radius:3px;padding:0 12px}.welcome-bg{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.welcome-shade{background:linear-gradient(90deg,#090d0bbd,#090d0b29 65%,#090d0b73);position:absolute;inset:0}.welcome-top,.welcome-footer{z-index:2;justify-content:space-between;align-items:center;display:flex;position:absolute;left:4%;right:4%}.welcome-top{letter-spacing:0;font:17px Bebas Neue;top:4%}.welcome-footer{color:#ffffffb8;border-top:1px solid #ffffff52;padding-top:13px;font-size:9px;bottom:3%}.welcome-copy{z-index:2;max-width:72%;position:absolute;top:50%;left:7%;transform:translateY(-48%)}.welcome-copy p{color:#e5d6b7;margin:0;font-size:12px}.welcome-copy h1{margin:10px 0 18px;font:900 64px/1 Noto Serif SC}.wedding-meta{align-items:center;gap:12px;font-size:11px;display:flex}.wedding-meta i{background:var(--gold);border-radius:50%;width:3px;height:3px}.start-button{color:#851c27;background:#f4eee1;min-width:190px;margin-top:28px;font-size:15px}.screen-title{height:90px;color:var(--ink);background:#efeae0;align-items:center;gap:18px;padding:14px 30px;display:flex}.screen-title>div:not(.selection-status){display:grid}.screen-title span,.settings-header span,.proof-copy>span{color:var(--red);font:14px Bebas Neue}.screen-title h1,.settings-header h1{margin:0;font:900 26px Noto Serif SC}.screen-title p{color:#77807c;margin:2px 0 0;font-size:10px}.upload-button,.settings-upload{color:#3d4944;cursor:pointer;background:#fff;border:1px solid #c8c1b3;border-radius:4px;align-items:center;gap:8px;margin-left:auto;padding:10px 14px;font-size:11px;font-weight:700;display:flex}.upload-button input,.settings-upload input{display:none}.template-grid{background:#dad6cc;grid-template-columns:repeat(3,1fr);gap:20px;height:calc(100% - 230px);padding:22px 4%;display:grid}.template-card{text-align:left;color:var(--ink);background:#f7f3ea;border:3px solid #0000;border-radius:5px;grid-template-columns:42% 1fr;align-items:center;gap:14px;padding:14px;display:grid;position:relative;box-shadow:0 8px 24px #1a221f14}.template-card.selected{border-color:var(--red)}.template-preview{background:#c8c5bc;place-items:center;height:100%;min-height:160px;display:grid;overflow:hidden}.template-preview img{object-fit:contain;width:100%;height:100%}.template-card>div:last-of-type{gap:7px;display:grid}.template-card span{color:#7c847f;font-size:10px}.template-card strong{font:900 20px Noto Serif SC}.template-card>i{color:#fff;background:var(--red);border-radius:50%;place-items:center;width:28px;height:28px;display:grid;position:absolute;top:10px;right:10px}.flow-footer{height:70px;color:var(--muted);background:#161a18;justify-content:space-between;align-items:center;padding:0 4%;font-size:10px;display:flex}.flow-footer .primary-button{min-width:210px}.flow-footer .secondary-button{min-width:160px}.camera-screen{background:#070908}.camera-screen .device-header{background:#0c100ec2;position:absolute;top:0;left:0;right:0}.camera-screen video{object-fit:cover;width:100%;height:100%;transform:scaleX(-1)}.camera-vignette{background:linear-gradient(#0000004d,#0000 35%,#00000080);position:absolute;inset:0}.camera-copy{z-index:2;position:absolute;top:14%;left:5%}.camera-copy span{color:var(--gold);font:16px Bebas Neue}.camera-copy h1{margin:6px 0;font:900 34px Noto Serif SC}.camera-copy p{color:#d4d8d5;margin:0;font-size:11px}.camera-guide{position:absolute;inset:18% 25% 17%}.camera-guide i{border-style:solid;border-color:#ffffffbf;width:50px;height:50px;position:absolute}.camera-guide i:first-child{border-width:2px 0 0 2px;top:0;left:0}.camera-guide i:nth-child(2){border-width:2px 2px 0 0;top:0;right:0}.camera-guide i:nth-child(3){border-width:0 0 2px 2px;bottom:0;left:0}.camera-guide i:nth-child(4){border-width:0 2px 2px 0;bottom:0;right:0}.camera-actions{justify-content:center;gap:18px;display:flex;position:absolute;bottom:5%;left:0;right:0}.shutter-button{color:#1a211e;background:#f5f0e4;min-width:220px}.shutter-button span{color:#fff;background:var(--red);border-radius:50%;place-items:center;width:34px;height:34px;display:grid}.countdown-layer{background:#04060547;place-items:center;display:grid;position:absolute;inset:0}.countdown-layer b{text-shadow:0 20px 50px #000;font:240px/.8 Bebas Neue;animation:.35s ease-out count}@keyframes count{0%{opacity:0;transform:scale(1.45)}}.selection-screen{background:#dcd8cf}.selection-status{color:#fff;background:#2b332f;margin-left:auto;padding:9px 14px;font-size:10px}.photo-grid{justify-content:center;align-items:center;gap:18px;height:calc(100% - 230px);padding:20px 4%;display:flex;overflow-x:auto}.photo-card{height:88%;color:var(--ink);background:#f7f3ea;border:3px solid #0000;flex:0 0 min(20%,250px);grid-template-rows:1fr auto auto;gap:7px;padding:9px;display:grid;position:relative;box-shadow:0 10px 28px #141c181f}.photo-card.selected{border-color:var(--red);transform:translateY(-5px)}.photo-card img{object-fit:cover;width:100%;height:100%;min-height:0}.photo-card b{text-align:center;font-size:11px}.photo-card button{color:#fff;background:#29312d;justify-content:center;align-items:center;gap:7px;height:34px;font-size:10px;display:flex}.proof-screen{background:#d8d3c8}.proof-layout{grid-template-columns:1.15fr .85fr;height:calc(100% - 70px);display:grid}.final-proof{background:#c8c4ba;place-items:center;padding:28px;display:grid}.final-proof img{object-fit:contain;max-width:88%;max-height:92%;box-shadow:0 18px 42px #12181547}.proof-copy{color:var(--ink);background:#f3eee4;flex-direction:column;justify-content:center;padding:8%;display:flex}.proof-copy h1{margin:7px 0 22px;font:900 32px Noto Serif SC}.proof-copy dl{border-top:1px solid #d4cdbf;border-bottom:1px solid #d4cdbf;grid-template-columns:1fr auto;gap:10px;margin:0 0 22px;padding:14px 0;font-size:11px;display:grid}.proof-copy dt{color:#78817c}.proof-copy dd{margin:0;font-weight:700}.proof-copy .text-button{align-self:center}.status-screen{background:#171b19;place-content:center;justify-items:center;display:grid}.status-screen>svg{color:var(--gold)}.status-screen>span,.complete-copy>span{color:var(--gold);margin-top:15px;font:16px Bebas Neue}.status-screen h1{margin:5px;font:900 38px Noto Serif SC}.status-screen p{color:var(--muted);margin:0;font-size:11px}.progress-track{background:#343a37;width:420px;height:5px;margin:28px 0 9px;overflow:hidden}.progress-track i{background:var(--gold);height:100%;transition:width .4s;display:block}.status-screen>b{font:24px Bebas Neue}.complete-screen{color:var(--ink);background:#e9e4d8;grid-template-columns:1.1fr .9fr;display:grid}.complete-art{background:#292f2c;place-items:center;padding:4%;display:grid}.complete-art img{max-width:80%;max-height:90%;box-shadow:0 16px 40px #000}.complete-copy{flex-direction:column;justify-content:center;align-items:flex-start;padding:9%;display:flex}.complete-copy>i{color:#fff;background:#28724f;border-radius:50%;place-items:center;width:56px;height:56px;display:grid}.complete-copy h1{margin:6px 0;font:900 40px Noto Serif SC}.complete-copy p{color:#69726e;font-size:13px;line-height:1.8}.complete-qr{background:#fff;border:1px solid #cbc4b6;align-items:center;gap:12px;margin:8px 0 18px;padding:12px;font-size:10px;display:flex}.complete-copy .primary-button{min-width:190px}.complete-copy small{color:#8b928e;margin-top:8px}.settings-screen{color:var(--ink);background:#d8d3c8}.settings-header{background:#eee9df;align-items:center;gap:16px;height:82px;padding:12px 28px;display:flex}.settings-header>div{display:grid}.logout-button{color:#7d1e29;background:#fff;border:1px solid #cabfb0;align-items:center;gap:8px;height:42px;margin-left:auto;padding:0 14px;display:flex}.settings-layout{grid-template-columns:1fr 1fr;gap:18px;height:calc(100% - 152px);padding:18px 3%;display:grid;overflow:auto}.settings-layout section{background:#f5f1e8;border:1px solid #c9c3b8;padding:18px}.settings-layout h2{align-items:center;gap:8px;margin:0 0 15px;font:900 16px Noto Serif SC;display:flex}.settings-layout h2 svg{color:var(--red)}.form-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.form-grid .wide{grid-column:1/-1}.settings-upload{width:max-content;margin:15px 0 0}.settings-footer{height:70px;color:var(--muted);background:#171b19;justify-content:space-between;align-items:center;padding:0 3%;font-size:10px;display:flex}.settings-footer .primary-button{min-width:170px}@media (aspect-ratio<=16/9){.device-frame{width:100vw;height:56.25vw}}
