.login-page{height:100vh;display:flex;align-items:center;justify-content:center;background:var(--deep);padding:20px}.login-card{width:100%;max-width:400px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-lg);padding:40px 32px}.login-header{text-align:center;margin-bottom:32px}.login-icon{font-size:48px;display:block;margin-bottom:16px}.login-header h1{font-family:Playfair Display,serif;font-size:28px;color:#fff;font-weight:700;margin-bottom:4px}.login-header p{font-family:Sacramento,cursive;font-size:22px;color:var(--coral-light)}.login-form{display:flex;flex-direction:column;gap:20px}.login-field{display:flex;flex-direction:column;gap:6px}.login-field label{font-size:13px;font-weight:500;color:#ffffff80}.login-field input{width:100%;padding:12px 16px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:var(--white);font-family:DM Sans,sans-serif;font-size:15px;outline:none;transition:all .3s ease}.login-field input:focus{border-color:var(--coral);background:#ff6b6b0f;box-shadow:0 0 0 4px #ff6b6b1a}.login-field input::placeholder{color:#fff3}.login-error{background:#ff6b6b1f;border:1px solid rgba(255,107,107,.3);border-radius:var(--radius-sm);padding:10px 14px;font-size:13px;color:var(--coral-light);text-align:center}.login-btn{width:100%;padding:14px;border:none;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--coral),#FF8E6B);color:#fff;font-family:DM Sans,sans-serif;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease}.login-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-glow-coral)}.login-btn:disabled{opacity:.7;cursor:default}.booth-page{height:100vh;background:var(--deep);display:flex;flex-direction:column;overflow:hidden}.booth-topbar{height:56px;background:#ffffff0a;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;justify-content:space-between;padding:0 24px;flex-shrink:0}.booth-topbar-left{display:flex;align-items:center;gap:16px}.booth-logo-icon{width:36px;height:36px;background:linear-gradient(135deg,var(--coral),var(--gold));border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px}.booth-event-name{font-family:Playfair Display,serif;font-size:18px;color:#fff;font-weight:700}.booth-event-name span{font-family:Sacramento,cursive;font-size:22px;color:var(--coral-light);margin-left:8px}.booth-topbar-right{display:flex;align-items:center;gap:16px}.booth-counter{background:#ffffff0f;padding:6px 14px;border-radius:20px;color:#fff9;font-size:13px;font-weight:500;display:flex;align-items:center;gap:6px}.booth-counter strong{color:var(--gold);font-weight:700}.booth-status{color:var(--mint)}.status-dot{width:8px;height:8px;background:var(--mint);border-radius:50%;display:inline-block;animation:recBlink 1.5s ease-in-out infinite}.btn-logout{padding:6px 14px;border-radius:20px;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;color:#ffffff80;font-family:DM Sans,sans-serif;font-size:12px;cursor:pointer;transition:all .2s ease}.btn-logout:hover{background:#ff6b6b26;border-color:var(--coral);color:var(--coral-light)}.booth-content{flex:1;display:flex;gap:0;padding:16px;overflow:hidden;min-height:0}.booth-left{width:76%;display:flex;flex-direction:column;gap:16px;padding-right:16px;min-height:0;height:100%;overflow:hidden;flex-shrink:0}.webcam-container{flex:1;background:#1a1225;border-radius:var(--radius-lg);overflow:hidden;position:relative;border:2px solid rgba(255,255,255,.06);min-height:0}.webcam-video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);display:block}.captured-preview{width:100%;height:100%;object-fit:cover;display:block}.webcam-overlay-tl,.webcam-overlay-tr,.webcam-overlay-bl,.webcam-overlay-br{position:absolute;width:40px;height:40px;border-color:var(--coral);border-style:solid;border-width:0;pointer-events:none}.webcam-overlay-tl{top:20px;left:20px;border-top-width:3px;border-left-width:3px;border-radius:8px 0 0}.webcam-overlay-tr{top:20px;right:20px;border-top-width:3px;border-right-width:3px;border-radius:0 8px 0 0}.webcam-overlay-bl{bottom:20px;left:20px;border-bottom-width:3px;border-left-width:3px;border-radius:0 0 0 8px}.webcam-overlay-br{bottom:20px;right:20px;border-bottom-width:3px;border-right-width:3px;border-radius:0 0 8px}.webcam-rec{position:absolute;top:20px;left:80px;display:flex;align-items:center;gap:8px;font-size:12px;color:#fff9;font-weight:500;letter-spacing:1px}.rec-dot{width:8px;height:8px;background:var(--coral);border-radius:50%;animation:recBlink 1.5s ease-in-out infinite}@keyframes recBlink{0%,to{opacity:1}50%{opacity:.3}}.countdown-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10}.countdown-number{font-family:Playfair Display,serif;font-size:120px;font-weight:700;color:#fff;text-shadow:0 0 60px rgba(255,107,107,.5);animation:countPulse 1s ease-in-out}@keyframes countPulse{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:1}}.captured-badge{position:absolute;top:20px;left:50%;transform:translate(-50%);background:var(--mint);color:#fff;padding:8px 20px;border-radius:20px;font-size:14px;font-weight:600;z-index:5}.message-input-container{flex-shrink:0}.message-input{width:100%;padding:14px 20px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:var(--white);font-family:DM Sans,sans-serif;font-size:15px;outline:none;transition:all .3s ease}.message-input:focus{border-color:var(--coral);background:#ff6b6b0f;box-shadow:0 0 0 4px #ff6b6b1a}.message-input::placeholder{color:#ffffff40}.booth-controls{display:flex;align-items:center;justify-content:center;gap:16px;padding:8px 0;flex-shrink:0}.btn-capture{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--coral),#FF8E6B);border:4px solid rgba(255,255,255,.2);cursor:pointer;position:relative;box-shadow:0 0 #ff6b6b66;transition:all .3s ease}.btn-capture:after{content:"📸";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:28px}.btn-capture:hover:not(:disabled){transform:scale(1.05);box-shadow:0 0 0 8px #ff6b6b26}.btn-capture:disabled{opacity:.6;cursor:default}.btn-booth-secondary{padding:12px 24px;border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.15);background:#ffffff0f;color:#ffffffb3;font-family:DM Sans,sans-serif;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px}.btn-booth-secondary:hover{background:#ffffff1a;color:#fff}.btn-booth-save{padding:12px 24px;border-radius:var(--radius-sm);border:none;background:var(--mint);color:#fff;font-family:DM Sans,sans-serif;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px}.btn-booth-save:hover:not(:disabled){background:#5ab868;transform:translateY(-1px)}.btn-booth-save:disabled{opacity:.7;cursor:default}.booth-right{width:24%;display:flex;flex-direction:column;background:#ffffff08;border-radius:var(--radius-lg);border:1px solid rgba(255,255,255,.06);overflow:hidden;min-height:0}.gallery-header{padding:20px;border-bottom:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.gallery-header h3{font-family:Playfair Display,serif;font-size:16px;color:#fff;font-weight:700}.gallery-count{background:var(--coral);color:#fff;font-size:12px;font-weight:700;padding:2px 10px;border-radius:20px}.gallery-scroll{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;min-height:0}.gallery-scroll::-webkit-scrollbar{width:4px}.gallery-scroll::-webkit-scrollbar-track{background:transparent}.gallery-scroll::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}.gallery-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;gap:8px;color:#fff6}.gallery-empty-icon{font-size:48px;margin-bottom:8px}.gallery-empty p{font-size:14px}.gallery-empty-sub{font-size:12px!important;color:#ffffff40}.gallery-item{border-radius:var(--radius-sm);overflow:hidden;position:relative;aspect-ratio:4/3;cursor:pointer;transition:all .2s ease;flex-shrink:0}.gallery-item:hover{transform:scale(1.02)}.gallery-img{width:100%;height:100%;object-fit:cover;display:block}.gallery-item-overlay{position:absolute;bottom:0;left:0;right:0;padding:24px 12px 8px;background:linear-gradient(transparent,#000000b3);display:flex;justify-content:space-between;align-items:flex-end}.gi-info{display:flex;flex-direction:column;gap:2px}.gi-time{font-size:12px;color:#fffc;font-weight:600}.gi-message{font-size:11px;color:#fff9;font-style:italic;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gi-timeago{font-size:11px;color:#fff6;white-space:nowrap}.lightbox-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:100;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.lightbox-content{position:relative;max-width:90vw;max-height:90vh;cursor:default;display:flex;flex-direction:column;align-items:center}.lightbox-img{max-width:90vw;max-height:80vh;object-fit:contain;border-radius:var(--radius-lg);box-shadow:0 20px 60px #00000080}.lightbox-message{margin-top:16px;font-size:16px;color:#fffc;font-style:italic;text-align:center}.lightbox-time{margin-top:8px;font-size:13px;color:#fff6}.lightbox-close{position:absolute;top:-12px;right:-12px;width:36px;height:36px;border-radius:50%;border:none;background:#ffffff26;color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease}.lightbox-close:hover{background:#ff6b6b99}@media(max-width:900px){.booth-content{flex-direction:column}.booth-left{width:100%;padding-right:0}.booth-right{width:100%;max-height:300px}.webcam-container{min-height:300px}}@media(max-width:600px){.booth-topbar{flex-wrap:wrap;height:auto;padding:8px 12px;gap:8px}.booth-event-name{font-size:14px}.booth-event-name span{display:none}.booth-counter{font-size:11px;padding:4px 10px}.booth-content{padding:8px}.btn-capture{width:60px;height:60px}.btn-capture:after{font-size:22px}.webcam-container{min-height:250px}}:root{--coral: #FF6B6B;--coral-light: #FF8E8E;--peach: #FFECD2;--gold: #FFD93D;--gold-dark: #E6C235;--mint: #6BCB77;--lavender: #B399D4;--deep: #2D2438;--deep-mid: #3D3148;--deep-light: #4D4158;--cream: #FFF8F0;--white: #FFFFFF;--gray-100: #F7F5F2;--gray-200: #EDE9E3;--gray-300: #D4CFC7;--gray-400: #9E9890;--gray-500: #6B665E;--shadow-soft: 0 4px 24px rgba(45, 36, 56, .08);--shadow-medium: 0 8px 32px rgba(45, 36, 56, .12);--shadow-strong: 0 12px 48px rgba(45, 36, 56, .18);--shadow-glow-coral: 0 8px 32px rgba(255, 107, 107, .3);--shadow-glow-gold: 0 8px 32px rgba(255, 217, 61, .3);--radius-sm: 12px;--radius-md: 18px;--radius-lg: 24px;--radius-xl: 32px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:DM Sans,sans-serif;background:var(--deep);color:var(--white);overflow-x:hidden}