:root{color-scheme:dark;background:#111;color:#eee;font-family:system-ui,sans-serif}body{margin:0}.camera{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;grid-template-rows:1fr auto}.viewfinder{width:100%;height:100%;object-fit:cover;grid-row:1 / 3}.counters,.controls{position:relative;z-index:1;display:flex;justify-content:space-around;padding:12px;background:#0006}.counters{align-self:start}.controls{align-self:end;align-items:center}.shutter{width:72px;height:72px;border-radius:50%;border:6px solid #fff;background:transparent}.pending{color:#ffd166}.rejected{color:#ff8a7a}.notice,.error,.countdown,.rejected,.unsent{padding:16px;text-align:center}.unsent{margin:0;background:#2a2416;color:#ffd166;cursor:pointer}.join{max-width:420px;margin:10vh auto;padding:16px;display:grid;gap:12px}.gallery .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:4px}.item{cursor:pointer;border:0;padding:0;margin:0}.item img{width:100%;aspect-ratio:1;object-fit:cover;display:block}.item .symbol{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:2.5rem;background:#1c1c1c}.viewer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#000000eb;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.viewer-body{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:100%;max-height:100%}.viewer-media{display:flex;align-items:center;justify-content:center;max-width:100vw;max-height:80vh}.viewer-media img,.viewer-media video{max-width:100vw;max-height:80vh;object-fit:contain}.voice-placeholder{display:grid;justify-items:center;gap:8px;padding:32px;color:#eee}.voice-placeholder .mic{font-size:4rem}.voice-placeholder audio{width:min(80vw,360px)}.viewer-caption{text-align:center;color:#eee;margin:0}.viewer-caption .badge{margin-left:8px;padding:2px 8px;border-radius:999px;background:#ffd166;color:#111;font-size:.8em}.viewer-actions{display:flex;gap:12px;justify-content:center}.viewer-error{margin:0;color:#ff8a7a;text-align:center}.viewer-actions a,.viewer-actions button{min-height:44px;min-width:44px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid #444;background:#222;color:#eee;text-decoration:none}.viewer-actions button:disabled{opacity:.5}.viewer-close,.viewer-prev,.viewer-next{position:absolute;min-width:44px;min-height:44px;border:none;border-radius:50%;background:#00000080;color:#fff;font-size:1.5rem;line-height:1;display:flex;align-items:center;justify-content:center}.viewer-close{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}.viewer-prev{left:max(12px,env(safe-area-inset-left));top:50%;transform:translateY(-50%)}.viewer-next{right:max(12px,env(safe-area-inset-right));top:50%;transform:translateY(-50%)}.viewer-prev:disabled,.viewer-next:disabled{opacity:.3}