:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}input,select,textarea{font-size:16px;-webkit-text-size-adjust:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;flex-direction:column;justify-content:space-between;place-items:center;min-width:320px;min-height:100vh;-webkit-text-size-adjust:100%}h1{font-size:3.2em;line-height:1.1}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.vanilla:hover{filter:drop-shadow(0 0 2em #f7df1eaa)}.card{padding:2em}.read-the-docs{color:#888}button{border-radius:12px;border:1px solid rgba(255,255,255,.2);padding:.75rem 1.5rem;font-size:1rem;font-weight:600;font-family:inherit;background-color:#ffffff1a;color:#fff;cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 2px 6px #0000001a;letter-spacing:.3px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);touch-action:manipulation}#postControls{display:flex}button:hover{transform:translateY(-1px);background-color:#fff3;border-color:#ffffff4d;box-shadow:0 4px 10px #0003}button:active{transform:translateY(0);background-color:#ffffff26;box-shadow:0 2px 6px #0000001a}button:disabled{background-color:#8e8e9333;color:#aeaeb2cc;border-color:#8e8e934d;cursor:not-allowed;transform:none;box-shadow:0 1px 3px #0000001a}button:disabled:hover{transform:none;background-color:#8e8e9333;box-shadow:0 1px 3px #0000001a}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}body{font-family:sans-serif;text-align:center;background-color:#000}.content-wrapper{margin:10vh auto}h1{font-family:Sacramento,cursive}.splash-screen{background-color:#080202;height:100dvh;width:100%;display:flex;flex-direction:column;justify-content:center;position:fixed;z-index:9999;opacity:1;visibility:visible;transition:opacity .6s ease,visibility .6s ease}.splash-screen h2{font-family:Fleur De Leah,cursive;font-weight:400;font-style:normal;font-size:35px}.splash-screen .start-button{width:100%;text-align:center;position:absolute;bottom:20vh}.splash-screen .start-button #actionBtn{background:#b8b8b8a8;color:#fff;font-size:1.25rem;font-weight:700;padding:1rem 2.5rem;border-radius:16px;border:1px solid rgba(255,255,255,.4);cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 4px 12px #0003;letter-spacing:.5px;min-width:200px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.splash-screen .start-button #actionBtn:hover{transform:translateY(-2px);background:#007aff4d;border-color:#007aff80;box-shadow:0 6px 16px #0000004d}.splash-screen .start-button #actionBtn:active{transform:translateY(0);background:#007aff40;box-shadow:0 4px 12px #0003}.splash-screen .start-button p{color:#fff;font-weight:600;margin:0}.splash-screen .start-button .title{font-style:italic}.splash-screen .start-button .small-text{font-size:8px;margin-top:12px}.splash-screen.removed{opacity:0;visibility:hidden}.brides-greeting-section{display:flex;justify-content:center;align-items:center;flex-direction:column;height:100%;width:100%;position:fixed}.brides-greeting-section .vtt-container{width:80%;margin-top:20px}.selfie-section{display:none;background-color:#000;width:100%;height:100dvh;flex-direction:column;align-items:center;justify-content:space-around}.selfie-section h2{color:#fff}.selfie-section #camera{width:100%;height:70vh;object-fit:cover}.selfie-section #photoPreview,.selfie-section #photoCanvas{display:none;width:100%;height:70vh;object-fit:cover}.selfie-section.active{display:flex}.selfie-section div[style*="margin-top:0.75rem"] button{background:#ffffff1a;color:#fff;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;border-radius:12px;border:1px solid rgba(255,255,255,.2);cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 2px 6px #0000001a;letter-spacing:.3px;margin:0 .25rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.selfie-section div[style*="margin-top:0.75rem"] button:hover{transform:translateY(-1px);background:#fff3;border-color:#ffffff4d;box-shadow:0 4px 10px #0003}.selfie-section div[style*="margin-top:0.75rem"] button:active{transform:translateY(0);background:#ffffff26;box-shadow:0 2px 6px #0000001a}.selfie-section div[style*="margin-top:0.75rem"] button:disabled{background:#8e8e9333;color:#aeaeb2cc;border-color:#8e8e934d;cursor:not-allowed;transform:none;box-shadow:0 1px 3px #0000001a}.selfie-section div[style*="margin-top:0.75rem"] button:disabled:hover{transform:none;background:#8e8e9333;box-shadow:0 1px 3px #0000001a}.selfie-section div[style*="margin-top:0.75rem"] button#takePhotoBtn{background:#34c75933;border-color:#34c75966;box-shadow:0 2px 6px #34c75933}.selfie-section div[style*="margin-top:0.75rem"] button#takePhotoBtn:hover{background:#34c7594d;border-color:#34c75980;box-shadow:0 4px 10px #34c7594d}.selfie-section div[style*="margin-top:0.75rem"] button#submitSelfieBtn{background:#ff950033;border-color:#ff950066;box-shadow:0 2px 6px #ff950033}.selfie-section div[style*="margin-top:0.75rem"] button#submitSelfieBtn:hover{background:#ff95004d;border-color:#ff950080;box-shadow:0 4px 10px #ff95004d}.name-section{height:100dvh;width:100%;display:none;background-color:#fff;flex-direction:column;justify-content:center;align-items:center}.name-section h2{color:#000}.name-section #nameActions button{background:#007aff33;color:#fff;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;border-radius:12px;border:1px solid rgba(0,122,255,.4);cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 2px 6px #0000001a;letter-spacing:.3px;margin:0 .25rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.name-section #nameActions button:hover{transform:translateY(-1px);background:#007aff4d;border-color:#007aff80;box-shadow:0 4px 10px #0003}.name-section #nameActions button:active{transform:translateY(0);background:#007aff40;box-shadow:0 2px 6px #0000001a}.name-section #nameActions button#restartBtn{background:#ff3b3033;border-color:#ff3b3066;box-shadow:0 2px 6px #ff3b3033}.name-section #nameActions button#restartBtn:hover{background:#ff3b304d;border-color:#ff3b3080;box-shadow:0 4px 10px #ff3b304d}.name-section #nameActions button#submitNameBtn{background:#34c75933;border-color:#34c75966;box-shadow:0 2px 6px #34c75933}.name-section #nameActions button#submitNameBtn:hover{background:#34c7594d;border-color:#34c75980;box-shadow:0 4px 10px #34c7594d}.active-flex{display:flex}.guest-wishes-section{text-align:center;max-width:500px;display:none;flex-direction:column;align-items:center;justify-content:center;background:#000;width:100%;height:100dvh}.guest-wishes-section h2{color:#fff}.guest-wishes-section #visualizer,.guest-wishes-section #visualizer2{width:100%;height:120px;background:#111;border-radius:8px;display:block;margin:.75rem auto}.guest-wishes-section .record-btn{background:#ffffff1a;color:#fff;font-size:1.1rem;font-weight:600;padding:.875rem 2rem;border-radius:12px;border:1px solid rgba(255,255,255,.2);cursor:pointer;transition:all .2s ease-in-out;max-width:200px;margin:0;box-shadow:0 2px 8px #0000001a;letter-spacing:.5px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.guest-wishes-section .record-btn:hover{transform:translateY(-1px);background:#fff3;border-color:#ffffff4d;box-shadow:0 4px 12px #0003}.guest-wishes-section .record-btn:active{transform:translateY(0);background:#ffffff26;box-shadow:0 2px 6px #0000001a}.guest-wishes-section .record-btn.idle{background:#007aff33;border-color:#007aff66}.guest-wishes-section .record-btn.recording{background:#ff3b3033;border-color:#ff3b3066;box-shadow:0 2px 8px #ff3b3033;animation:pulse 1.2s infinite}.guest-wishes-section .record-btn.stopped{background:#34c75933;border-color:#34c75966;box-shadow:0 2px 8px #34c75933}.guest-wishes-section .record-btn.preview{background:#ff950033;border-color:#ff950066;box-shadow:0 2px 8px #ff950033}.guest-wishes-section .record-btn.playing{background:#5856d633;border-color:#5856d666;box-shadow:0 2px 8px #5856d633}.guest-wishes-section #postControls{margin-top:1.5rem;display:none;gap:.75rem;justify-content:center;flex-wrap:wrap}.guest-wishes-section #postControls button{background:#ffffff1a;color:#fff;padding:.75rem 1.5rem;border-radius:12px;border:1px solid rgba(255,255,255,.2);cursor:pointer;font-size:1rem;font-weight:600;min-width:120px;transition:all .2s ease-in-out;box-shadow:0 1px 3px #0000001a;letter-spacing:.3px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.guest-wishes-section #postControls button:hover{transform:translateY(-1px);background:#fff3;border-color:#ffffff4d;box-shadow:0 3px 8px #0003}.guest-wishes-section #postControls button:active{transform:translateY(0);background:#ffffff26;box-shadow:0 1px 3px #0000001a}.guest-wishes-section #postControls button#restartRecordingBtn{background:#ff3b3033;color:#fff;border-color:#ff3b3066;box-shadow:0 2px 6px #ff3b3033}.guest-wishes-section #postControls button#restartRecordingBtn:hover{background:#ff3b304d;border-color:#ff3b3080;box-shadow:0 3px 8px #ff3b304d}.guest-wishes-section #postControls button#saveRecordingBtn{background:#34c75933;color:#fff;border-color:#34c75966;box-shadow:0 2px 6px #34c75933}.guest-wishes-section #postControls button#saveRecordingBtn:hover{background:#34c7594d;border-color:#34c75980;box-shadow:0 3px 8px #34c7594d}.guest-wishes-section audio{display:none;margin-top:1rem;width:100%}@keyframes pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}to{transform:scale(1);opacity:1}}#lyricsBox{transition:opacity .4s ease;opacity:1;color:#fff}#lyricsBox.fade-out{opacity:0}.button-17{align-items:center;appearance:none;background-color:#fff;border-radius:24px;border-style:none;box-shadow:#0003 0 3px 5px -1px,#00000024 0 6px 10px,#0000001f 0 1px 18px;box-sizing:border-box;color:#3c4043;cursor:pointer;display:inline-flex;fill:currentcolor;font-family:Google Sans,Roboto,Arial,sans-serif;font-size:14px;font-weight:500;height:48px;justify-content:center;letter-spacing:.25px;line-height:normal;max-width:100%;overflow:visible;padding:2px 24px;position:relative;text-align:center;text-transform:none;transition:box-shadow .28s cubic-bezier(.4,0,.2,1),opacity 15ms linear 30ms,transform .27s cubic-bezier(0,0,.2,1) 0ms;user-select:none;-webkit-user-select:none;touch-action:manipulation;width:auto;will-change:transform,opacity;z-index:0}.button-17:hover{background:#f6f9fe;color:#174ea6}.button-17:active{box-shadow:0 4px 4px #3c40434d,0 8px 12px 6px #3c404326;outline:none}.button-17:focus{outline:none;border:2px solid #4285f4}.button-17:not(:disabled){box-shadow:#3c40434d 0 1px 3px,#3c404326 0 4px 8px 3px}.button-17:not(:disabled):hover{box-shadow:#3c40434d 0 2px 3px,#3c404326 0 6px 10px 4px}.button-17:not(:disabled):focus{box-shadow:#3c40434d 0 1px 3px,#3c404326 0 4px 8px 3px}.button-17:not(:disabled):active{box-shadow:#3c40434d 0 4px 4px,#3c404326 0 8px 12px 6px}.button-17:disabled{box-shadow:#3c40434d 0 1px 3px,#3c404326 0 4px 8px 3px}