@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap");.general-mold{display:flex;flex-direction:column;height:calc(100vh);padding-top:0;margin-top:0}.headerGeneralMold{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;background-color:var(--header-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow);height:var(--header-height)}.content-container{min-height:10vh}:root{--backgroundColor1:#00b3ff;--backgroundColor2:#25c6ff;--backgroundColor3:#a0dbff;--backgroundColor4:#d9f2ff;--backgroundColor5:#fff;--color1:#2c3e50;--color2:#3498db;--color3:#fff;--color4:#2b95c8;--color5:#2bc6c8;--gradient-color1:hwb(0 15% 90%);--gradient-color2:#1a4565;--gradient-color3:#4dd7f0;--gradient-color4:#f2f2f2;--bg-primary:#f9fafb;--bg-secondary:#e5e7eb;--card-bg:hsla(0,0%,100%,.95);--header-bg:hsla(0,0%,100%,.9);--text-primary:#1f2937;--text-secondary:#4b5563;--text-muted:#6b7280;--accent:#3b82f6;--accent-hover:#2563eb;--error:#ef4444;--shadow:0 4px 12px rgba(0,0,0,.1);--transition:all 0.3s ease;--border-radius:0.75rem;--header-height:60px}.dark{--bg-primary:#1f2937;--bg-secondary:#374151;--card-bg:rgba(55,65,81,.95);--header-bg:rgba(55,65,81,.9);--text-primary:#f9fafb;--text-secondary:#d1d5db;--text-muted:#9ca3af;--accent:#60a5fa;--accent-hover:#3b82f6;--error:#f87171;--shadow:0 4px 12px rgba(0,0,0,.3)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Montserrat,sans-serif;background:linear-gradient(to bottom right,var(--bg-primary),var(--bg-secondary));min-height:100vh;color:var(--text-primary);transition:var(--transition)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--bg-primary);display:flex;justify-content:center;align-items:center;z-index:10000;overflow:hidden;margin:0;padding:0}.modal-content-memories{position:relative;border-radius:8px}.close-button{position:absolute;top:15px;right:15px;background:hsla(0,0%,100%,.2);border:none;border-radius:50%;width:40px;height:40px;font-size:1.5rem;color:#fff;cursor:pointer;justify-content:center}.close-button,.header{z-index:100;display:flex;align-items:center}.header{position:fixed;top:0;left:0;right:0;justify-content:space-between;padding:.75rem 1.5rem;background-color:var(--header-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow);height:var(--header-height)}.button{background:var(--accent);color:#fff;border:none;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;transition:var(--transition)}.button:hover{background:var(--accent-hover);transform:scale(1.05)}.visibility{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;padding:.25rem .75rem;border-radius:20px;background:rgba(16,185,129,.1);color:#10b981}.visibility-icon{font-size:1.25rem}.content-container{display:flex;flex-direction:column;padding:1rem;gap:1.5rem;height:calc(100vh - var(--header-height));overflow-y:auto}.content-container.dual-content{flex-direction:row}.left-container,.right-container{background:var(--card-bg);border-radius:var(--border-radius);padding:1.5rem;box-shadow:var(--shadow);transition:var(--transition);display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;height:100%}.left-container.full-width,.right-container.full-width{width:100%}.content-container.dual-content .left-container,.content-container.dual-content .right-container{flex:1 1;min-width:0}.content-container.dual-content .left-container{margin-right:.75rem}.content-container.dual-content .right-container{margin-left:.75rem}.left-container::-webkit-scrollbar,.right-container::-webkit-scrollbar{width:8px}.left-container::-webkit-scrollbar-track,.right-container::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:4px}.left-container::-webkit-scrollbar-thumb,.right-container::-webkit-scrollbar-thumb{background:var(--accent);border-radius:4px}.left-container::-webkit-scrollbar-thumb:hover,.right-container::-webkit-scrollbar-thumb:hover{background:var(--accent-hover)}@media (max-width:768px){.content-container.dual-content{flex-direction:column}.content-container.dual-content .left-container,.content-container.dual-content .right-container{margin:0}.header{padding:.75rem 1rem}.visibility-label{display:none}}@media (max-width:480px){.header{padding:.75rem}.left-container,.right-container{padding:1rem}}.card-content{padding:1rem}.card-title{font-size:1.5rem;margin-bottom:1rem;color:var(--accent)}.card-text{line-height:1.6;margin-bottom:1.5rem;color:var(--text-secondary)}.card-list{list-style:none;margin:1rem 0}.card-list li{padding:.5rem 0;border-bottom:1px solid var(--bg-secondary);display:flex;align-items:center}.card-list li:before{content:"•";color:var(--accent);margin-right:.75rem;font-size:1.2rem}.demo-actions{display:flex;gap:1rem;margin-top:1.5rem}.demo-button{padding:.75rem 1.5rem;border-radius:8px;background:var(--accent);color:#fff;border:none;cursor:pointer;font-weight:600;transition:var(--transition)}.demo-button:hover{background:var(--accent-hover);transform:translateY(-2px)}.demo-button.secondary{background:transparent;border:2px solid var(--accent);color:var(--accent)}.menu{position:fixed;top:0;left:-300px;width:300px;height:100vh;background:#fff;transition:left .3s ease;padding:20px;box-shadow:2px 0 5px rgba(0,0,0,.5);z-index:9990}.menu-open{left:0}.menu-closed{left:-300px}.menu-content{display:flex;flex-direction:column;gap:20px}.user-info{display:flex;align-items:center;gap:10px}.user-image{width:40px;height:40px;border-radius:50%}.menu-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:30px}.menu-item{padding-left:10px;width:100%}.menu-link{text-decoration:none}.logout-link,.menu-link{color:var(--text-primary)}.logout-link{cursor:pointer}.plan-status{display:flex;flex-direction:column;gap:5px}.menu-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);z-index:999}.menu.dark-mode{background:var(--bg-primary)}.menu.dark-mode,.menu.dark-mode .logout-link,.menu.dark-mode .menu-link{color:var(--text-primary)}.menu-overlay.dark-mode{background:rgba(0,0,0,.7)}.animate.background-pulse{animation:backgroundPulse 8s ease-in-out infinite}@keyframes backgroundPulse{0%,to{opacity:.9}50%{opacity:1}}.animate.shape-breathing{animation:breathing 5s ease-in-out infinite;transform-origin:center}@keyframes breathing{0%,to{transform:scale(1) rotate(0deg);opacity:.8}25%{transform:scale(1.03) rotate(.5deg);opacity:.9}50%{transform:scale(1.01) rotate(-.5deg);opacity:1}75%{transform:scale(.99) rotate(.3deg);opacity:.95}}.animate.line-flow{animation:lineFlow 4s ease-in-out infinite;stroke-dasharray:100;stroke-dashoffset:100}@keyframes lineFlow{0%{stroke-dashoffset:100;opacity:.5}50%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-100;opacity:.5}}.animate.memory-dot{animation:dotFloat 4s ease-in-out infinite}@keyframes dotFloat{0%,to{transform:translateY(0) scale(1);opacity:.8}50%{transform:translateY(-6px) scale(1.1);opacity:1}}.animate.organic-border{animation:organicBorder 7s ease-in-out infinite}@keyframes organicBorder{0%{stroke-dashoffset:0;opacity:.7}50%{stroke-dashoffset:20;opacity:1}to{stroke-dashoffset:0;opacity:.7}}#modal-root,.modalOverlay{position:fixed;top:0;left:0;z-index:10000}.modalOverlay{right:0;bottom:0;background-color:var(--bg-primary,rgba(0,0,0,.8));display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;box-sizing:border-box;margin:0;padding:0}.modalOverlay,body.modal-open{overflow:hidden}.modalContentMemories{background:var(--bg-primary,#000)}.floating-controls{position:absolute;top:0;left:0;width:100%;z-index:1000;padding:15px;display:flex;flex-direction:column;align-items:center;background:rgba(0,0,0,.5);opacity:1;transition:opacity .3s ease}.floating-controls.hidden{opacity:0;pointer-events:none}.floating-controls.visible{opacity:1;pointer-events:auto}.closeButton{position:absolute;top:15px;right:15px;background:var(--bg-secondary);color:var(--text-primary);border:none;border-radius:50%;width:40px;height:40px;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .3s ease}.closeButton:focus,.closeButton:hover{background:hsla(0,0%,100%,.3);outline:none}.save-message{margin-top:10px;font-size:14px;color:#fff;background:rgba(0,0,0,.7);padding:8px 16px;border-radius:4px;text-align:center}.collage-pre-container{flex-wrap:wrap;width:100%}.collage-container,.collage-pre-container{display:flex;justify-content:center;align-items:center;height:100vh}.collage-container{width:100vw;flex-direction:column}.collage-title{font-size:24px;font-weight:700;color:#fff;text-align:center}.controls{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:10px}.emoji-indicators{display:flex;gap:12px}.emoji{background:none;border:none;font-size:18px;color:#ccc;cursor:pointer;transition:color .3s ease}.emoji.active{color:#000000b4}.play-pause-button{background:var(--bg-secondary);border:none;border-radius:50%;width:40px;height:40px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center}.open-collage-button,.save-memory-button{margin-top:15px;padding:12px 24px;background-color:#007bff;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:16px;width:100%;transition:background-color .3s ease;position:relative}.open-collage-button:focus,.open-collage-button:hover,.save-memory-button:focus,.save-memory-button:hover{background-color:#0056b3;outline:none}.save-memory-button.loading{cursor:not-allowed;opacity:.7}.save-memory-button .spinner{display:inline-block;width:16px;height:16px;border:2px solid #fff;border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite;margin-right:8px;vertical-align:middle}@keyframes spin{to{transform:rotate(1turn)}}.groups-wrapper{position:absolute;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center}.group-container{display:grid;position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .5s ease-in-out}.group-container.visible{opacity:1;z-index:1}.group-container.hidden{opacity:0;z-index:0}.group-container.single,.group-container.video-only{grid-template-columns:1fr;align-items:center;justify-items:center}.group-container.double{grid-template-columns:repeat(2,1fr);gap:10px}.group-container.triple{grid-template-columns:repeat(3,1fr);gap:10px}.group-container.quad{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:10px}.media-item{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.background-media{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;filter:blur(8px);transform:scale(1.05);opacity:.7;z-index:1}.media{position:relative;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;z-index:2;border-radius:.5em}.group-container.single .media,.group-container.video-only .media{width:100%;height:100%;object-fit:contain}.group-container.single .background-media,.group-container.video-only .background-media{object-fit:cover}.placeholder{background:#000;width:100%;height:100%}.no-access,.no-media{font-size:18px;text-align:center;color:#666;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.audio-selection{border:1px solid #ccc;border-radius:8px;max-height:50vh;overflow-y:auto;padding:0 15px 15px;margin:0 0 20px}.audio-selection h3{font-size:18px;margin-bottom:15px;font-weight:600}.audio-item{gap:10px;margin-bottom:12px;padding:8px;border-radius:4px;transition:background .3s ease}.audio-item,.audio-item label{display:flex;align-items:center}.audio-item label{flex:1 1;gap:8px;font-size:16px}.audio-type-buttons{display:flex;gap:8px}.audio-type-button{padding:6px 12px;border:1px solid #007bff;border-radius:4px;background-color:#fff;cursor:pointer;font-size:14px;transition:background-color .3s ease,color .3s ease}.audio-type-button.active{background-color:#007bff;color:#fff}.preview-button{padding:6px 12px;border:1px solid #28a745;border-radius:4px;background-color:#fff;cursor:pointer;font-size:14px;transition:background-color .3s ease,color .3s ease}.preview-button:focus,.preview-button:hover{background-color:#28a745;color:#fff;outline:none}@media (max-width:768px){.collage-container{padding:0}.collage-title{font-size:20px}.groups-wrapper{min-height:100vh}.group-container.single,.group-container.video-only{grid-template-columns:1fr}.group-container.double,.group-container.triple{grid-template-columns:1fr;grid-template-rows:auto;gap:8px}.group-container.double .media-item,.group-container.triple .media-item{height:auto;min-height:calc((100% - 8px) / 2)}.group-container.triple .media-item{min-height:calc((100% - 16px) / 3)}.group-container.quad{grid-template-columns:1fr;grid-template-rows:repeat(4,auto);gap:8px}.group-container.video-only .media-item{height:100%}.background-media,.media{width:100%;max-height:100%;height:auto;object-fit:contain}.group-container.single .background-media,.group-container.single .media,.group-container.video-only .background-media,.group-container.video-only .media{object-fit:contain}.audio-selection{max-height:40vh;padding:10px}.audio-item{flex-wrap:wrap}.floating-controls{padding:10px}.collage-title{font-size:18px}.controls{gap:10px}.emoji{font-size:16px}.play-pause-button{width:35px;height:35px;font-size:18px}.closeButton{width:35px;height:35px;font-size:1.2rem}.save-message{font-size:12px;padding:6px 12px}}.pulse{animation:pulse .3s ease}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10%)}}.bar.animate{animation:bounce 1.5s infinite}.bar:first-child.animate{animation-delay:0s}.bar:nth-child(2).animate{animation-delay:.3s}.bar:nth-child(3).animate{animation-delay:.6s}.bar:nth-child(4).animate{animation-delay:.9s}.bar:nth-child(5).animate{animation-delay:1.2s}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.rotate-infinite{animation:rotate 2s linear infinite}