html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff8f0;color:#343a40;min-height:100vh}#root{min-height:100vh}:root{--primary-brown: #6F4E37;--primary-dark: #4A3526;--primary-light: #D4A574;--cream: #FFF8F0;--cream-dark: #F5E6D3;--red-flag: #DC3545;--red-flag-light: #FFE5E5;--red-flag-dark: #A71D2A;--green-flag: #28A745;--green-flag-light: #E5FFE5;--green-flag-dark: #1E7B34;--gray-100: #F8F9FA;--gray-200: #E9ECEF;--gray-300: #DEE2E6;--gray-400: #CED4DA;--gray-500: #ADB5BD;--gray-600: #6C757D;--gray-700: #495057;--gray-800: #343A40;--gray-900: #212529;--white: #FFFFFF;--black: #000000;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .15);--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--transition-fast: .15s ease;--transition-normal: .3s ease}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:var(--cream);color:var(--gray-800);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{min-height:100vh;display:flex;flex-direction:column}.signup-page,.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,var(--primary-brown) 0%,var(--primary-dark) 100%)}.signup-container,.login-container{width:100%;max-width:480px;background:var(--white);border-radius:var(--radius-xl);padding:40px;box-shadow:var(--shadow-lg)}.signup-header,.login-header{text-align:center;margin-bottom:32px}.signup-header h1,.login-header h1{font-size:2.5rem;color:var(--primary-brown);margin-bottom:8px}.signup-header p,.login-header p{color:var(--gray-600);font-size:1.1rem}.signup-form,.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600;color:var(--gray-700);font-size:.95rem}.form-group input,.form-group textarea{padding:12px 16px;border:2px solid var(--gray-300);border-radius:var(--radius-md);font-size:1rem;transition:border-color var(--transition-fast)}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--primary-brown)}.form-group textarea{resize:vertical;min-height:100px}.verification-section{background:var(--gray-100);padding:20px;border-radius:var(--radius-lg);margin:8px 0}.verification-section label{font-weight:600;color:var(--gray-700);display:block;margin-bottom:4px}.verification-info{color:var(--gray-600);font-size:.9rem;margin-bottom:16px}.model-loading{display:flex;align-items:center;justify-content:center;gap:12px;padding:20px;color:var(--gray-600)}.spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.camera-btn,.capture-btn,.retry-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border:none;border-radius:var(--radius-md);font-size:1rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.camera-btn{background:var(--primary-brown);color:var(--white);width:100%}.camera-btn:hover{background:var(--primary-dark)}.camera-container{display:flex;flex-direction:column;gap:12px;position:relative}.camera-video{width:100%;border-radius:var(--radius-md);background:var(--gray-800);display:block}.camera-loading{position:absolute;top:0;left:0;right:0;bottom:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000000b3;color:var(--white);border-radius:var(--radius-md);gap:8px;pointer-events:none}.capture-btn{background:var(--green-flag);color:var(--white)}.capture-btn:hover:not(:disabled){background:var(--green-flag-dark)}.capture-btn:disabled{opacity:.7;cursor:not-allowed}.captured-image-container{display:flex;flex-direction:column;gap:12px}.captured-image{width:100%;border-radius:var(--radius-md)}.verification-result{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:var(--radius-md);font-weight:500}.verification-result.success{background:var(--green-flag-light);color:var(--green-flag-dark)}.verification-result.error{background:var(--red-flag-light);color:var(--red-flag-dark)}.retry-btn{background:var(--gray-200);color:var(--gray-700)}.retry-btn:hover{background:var(--gray-300)}.error-message{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--red-flag-light);color:var(--red-flag-dark);border-radius:var(--radius-md);font-size:.95rem}.submit-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;background:var(--primary-brown);color:var(--white);border:none;border-radius:var(--radius-md);font-size:1.1rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.submit-btn:hover:not(:disabled){background:var(--primary-dark);transform:translateY(-1px)}.submit-btn:disabled{background:var(--gray-400);cursor:not-allowed}.login-link,.signup-link{text-align:center;color:var(--gray-600);margin-top:8px}.login-link button,.signup-link button{background:none;border:none;color:var(--primary-brown);font-weight:600;cursor:pointer;text-decoration:underline}.app-header{background:var(--white);border-bottom:1px solid var(--gray-200);position:sticky;top:0;z-index:100}.header-content{max-width:600px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between}.header-logo{display:flex;align-items:center;gap:8px;cursor:pointer}.logo-icon{font-size:1.5rem}.logo-text{font-size:1.25rem;font-weight:700;color:var(--primary-brown)}.header-user{display:flex;align-items:center;gap:16px}.user-info{display:flex;align-items:center;gap:6px;color:var(--gray-700);font-weight:500}.logout-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--gray-100);border:none;border-radius:var(--radius-md);color:var(--gray-700);font-size:.9rem;cursor:pointer;transition:all var(--transition-fast)}.logout-btn:hover{background:var(--gray-200)}.feed-page{min-height:100vh;background:var(--cream)}.feed-main{padding:20px 20px 100px}.feed-container{max-width:600px;margin:0 auto}.feed-header{margin-bottom:24px}.feed-header h2{font-size:1.5rem;color:var(--primary-brown);margin-bottom:16px}.filter-tabs{display:flex;gap:8px;flex-wrap:wrap}.filter-tab{padding:8px 16px;border:2px solid var(--gray-300);background:var(--white);border-radius:var(--radius-full);font-size:.9rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.filter-tab.active{background:var(--primary-brown);border-color:var(--primary-brown);color:var(--white)}.filter-tab.red.active{background:var(--red-flag);border-color:var(--red-flag)}.filter-tab.green.active{background:var(--green-flag);border-color:var(--green-flag)}.search-bar{display:flex;gap:12px;margin-bottom:16px}.search-input-wrapper{flex:1;display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--white);border:2px solid var(--gray-300);border-radius:var(--radius-lg)}.search-input-wrapper input{flex:1;border:none;outline:none;font-size:1rem;background:transparent}.search-input-wrapper svg{color:var(--gray-500)}.filter-toggle{display:flex;align-items:center;gap:6px;padding:10px 16px;background:var(--white);border:2px solid var(--gray-300);border-radius:var(--radius-lg);cursor:pointer;font-size:.95rem;font-weight:500;transition:all var(--transition-fast);position:relative}.filter-toggle:hover,.filter-toggle.active{border-color:var(--primary-brown);color:var(--primary-brown)}.filter-badge{position:absolute;top:-4px;right:-4px;width:10px;height:10px;background:var(--red-flag);border-radius:var(--radius-full)}.expanded-filters{background:var(--white);border-radius:var(--radius-lg);padding:16px;margin-bottom:16px;box-shadow:var(--shadow-sm)}.filter-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}.filter-row:last-child{margin-bottom:0}.filter-group{flex:1;min-width:140px;position:relative}.filter-group label{display:block;font-size:.85rem;font-weight:600;color:var(--gray-600);margin-bottom:6px}.filter-group select,.filter-group input{width:100%;padding:10px 12px;border:2px solid var(--gray-300);border-radius:var(--radius-md);font-size:.95rem;background:var(--white)}.filter-group select:focus,.filter-group input:focus{outline:none;border-color:var(--primary-brown)}.city-filter,.city-input{position:relative}.city-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--white);border:2px solid var(--gray-300);border-radius:var(--radius-md);box-shadow:var(--shadow-md);list-style:none;max-height:200px;overflow-y:auto;z-index:100;margin-top:4px}.city-dropdown li{padding:10px 12px;cursor:pointer;transition:background var(--transition-fast)}.city-dropdown li:hover{background:var(--cream)}.location-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--primary-light);border:none;border-radius:var(--radius-md);color:var(--primary-dark);cursor:pointer;font-size:.95rem;font-weight:500;transition:all var(--transition-fast)}.location-btn:hover:not(:disabled){background:var(--primary-brown);color:var(--white)}.location-btn:disabled{opacity:.6;cursor:not-allowed}.clear-filters{display:flex;align-items:center;gap:4px;padding:8px 12px;background:transparent;border:1px solid var(--gray-400);border-radius:var(--radius-md);color:var(--gray-600);cursor:pointer;font-size:.85rem;transition:all var(--transition-fast);margin-top:8px}.clear-filters:hover{background:var(--gray-100);color:var(--red-flag);border-color:var(--red-flag)}.loading-feed{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--gray-600)}.loading-feed .spinner{margin-bottom:12px}.post-info-bar{display:flex;gap:16px;padding:8px 16px;background:var(--cream);font-size:.85rem;flex-wrap:wrap}.post-subject,.post-location{display:flex;align-items:center;gap:6px;color:var(--gray-600)}.post-subject svg,.post-location svg{color:var(--primary-brown)}.post-subject strong{color:var(--gray-800)}.location-section{margin-bottom:16px;padding:16px;background:var(--cream);border-radius:var(--radius-md)}.location-section>label{display:flex;align-items:center;gap:6px;font-weight:600;margin-bottom:12px;color:var(--gray-700)}.location-section .location-btn{margin-bottom:12px}.location-inputs{display:flex;gap:12px}.location-inputs .form-group{flex:1}.selected-location{padding:8px 12px;background:var(--green-flag-light);color:var(--green-flag-dark);border-radius:var(--radius-md);font-size:.9rem;font-weight:500;margin-top:8px}.empty-feed{text-align:center;padding:60px 20px;color:var(--gray-600)}.posts-list{display:flex;flex-direction:column;gap:16px}.post-card{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;border-left:4px solid var(--gray-400)}.post-card.red{border-left-color:var(--red-flag)}.post-card.green{border-left-color:var(--green-flag)}.post-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 0}.post-user{display:flex;align-items:center;gap:12px}.user-avatar{width:40px;height:40px;border-radius:var(--radius-full);background:var(--primary-light);color:var(--primary-dark);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem}.post-meta{display:flex;flex-direction:column}.user-name{font-weight:600;color:var(--gray-800)}.post-time{font-size:.85rem;color:var(--gray-500)}.post-flag{display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:var(--radius-full);font-size:.8rem;font-weight:600}.post-card.red .post-flag{background:var(--red-flag-light);color:var(--red-flag-dark)}.post-card.green .post-flag{background:var(--green-flag-light);color:var(--green-flag-dark)}.post-content{padding:16px}.post-content p{font-size:1rem;line-height:1.6;color:var(--gray-800);white-space:pre-wrap;word-break:break-word}.post-actions{display:flex;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--gray-200)}.vote-buttons{display:flex;gap:4px;margin-right:8px}.vote-btn{display:flex;align-items:center;gap:4px;padding:8px 12px;border:2px solid transparent;border-radius:var(--radius-md);font-size:.9rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.vote-btn:disabled{opacity:.5;cursor:not-allowed}.green-vote{background:var(--gray-100);color:var(--gray-600)}.green-vote:hover:not(:disabled){background:var(--green-flag-light);color:var(--green-flag)}.green-vote.active{background:var(--green-flag-light);border-color:var(--green-flag);color:var(--green-flag)}.red-vote{background:var(--gray-100);color:var(--gray-600)}.red-vote:hover:not(:disabled){background:var(--red-flag-light);color:var(--red-flag)}.red-vote.active{background:var(--red-flag-light);border-color:var(--red-flag);color:var(--red-flag)}.action-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--gray-100);border:none;border-radius:var(--radius-md);color:var(--gray-600);font-size:.9rem;cursor:pointer;transition:all var(--transition-fast)}.action-btn:hover{background:var(--gray-200)}.comments-btn.active{background:var(--primary-light);color:var(--primary-dark)}.delete-btn:hover{background:var(--red-flag-light);color:var(--red-flag)}.comments-section{padding:16px;background:var(--gray-100);border-top:1px solid var(--gray-200)}.comments-list{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}.comment{display:flex;gap:12px}.comment-avatar{width:32px;height:32px;border-radius:var(--radius-full);background:var(--gray-300);color:var(--gray-700);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem;flex-shrink:0}.comment-content{flex:1;background:var(--white);padding:10px 14px;border-radius:var(--radius-md)}.comment-header{display:flex;align-items:center;gap:8px;margin-bottom:4px}.comment-user{font-weight:600;font-size:.9rem;color:var(--gray-800)}.comment-time{font-size:.8rem;color:var(--gray-500)}.comment-content p{font-size:.95rem;color:var(--gray-700)}.no-comments{text-align:center;color:var(--gray-500);font-size:.9rem;padding:12px 0}.comment-form{display:flex;gap:8px}.comment-form input{flex:1;padding:10px 14px;border:2px solid var(--gray-300);border-radius:var(--radius-md);font-size:.95rem}.comment-form input:focus{outline:none;border-color:var(--primary-brown)}.comment-form button{padding:10px 14px;background:var(--primary-brown);color:var(--white);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.comment-form button:hover:not(:disabled){background:var(--primary-dark)}.comment-form button:disabled{background:var(--gray-400);cursor:not-allowed}.create-post-fab{position:fixed;bottom:24px;right:24px;width:60px;height:60px;border-radius:var(--radius-full);background:var(--primary-brown);color:var(--white);border:none;box-shadow:var(--shadow-lg);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);z-index:50}.create-post-fab:hover{background:var(--primary-dark);transform:scale(1.05)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;padding:20px;z-index:200}.modal{background:var(--white);border-radius:var(--radius-xl);width:100%;max-width:500px;max-height:90vh;overflow-y:auto}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--gray-200)}.modal-header h3{font-size:1.25rem;color:var(--primary-brown)}.close-btn{background:none;border:none;color:var(--gray-500);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:color var(--transition-fast)}.close-btn:hover{color:var(--gray-800)}.create-post-modal form{padding:24px;display:flex;flex-direction:column;gap:20px}.flag-selector label{font-weight:600;color:var(--gray-700);display:block;margin-bottom:12px}.flag-options{display:flex;gap:12px}.flag-option{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border:2px solid var(--gray-300);border-radius:var(--radius-md);background:var(--white);font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.flag-option.red:hover,.flag-option.red.active{border-color:var(--red-flag);background:var(--red-flag-light);color:var(--red-flag-dark)}.flag-option.green:hover,.flag-option.green.active{border-color:var(--green-flag);background:var(--green-flag-light);color:var(--green-flag-dark)}.char-count{text-align:right;font-size:.85rem;color:var(--gray-500);margin-top:4px}.modal-actions{display:flex;gap:12px;justify-content:flex-end}.cancel-btn{padding:12px 24px;background:var(--gray-200);border:none;border-radius:var(--radius-md);font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.cancel-btn:hover{background:var(--gray-300)}.modal-actions .submit-btn.red{background:var(--red-flag)}.modal-actions .submit-btn.red:hover:not(:disabled){background:var(--red-flag-dark)}.modal-actions .submit-btn.green{background:var(--green-flag)}.modal-actions .submit-btn.green:hover:not(:disabled){background:var(--green-flag-dark)}@media (max-width: 600px){.signup-container,.login-container{padding:24px}.signup-header h1,.login-header h1{font-size:2rem}.header-content{padding:10px 16px}.logout-btn span{display:none}.feed-main{padding:16px}.filter-tabs{gap:6px}.filter-tab{padding:6px 12px;font-size:.85rem}.create-post-fab{bottom:16px;right:16px;width:56px;height:56px}.modal{max-height:100vh;border-radius:0}.flag-options{flex-direction:column}}@supports (padding-top: env(safe-area-inset-top)){.app-header{padding-top:env(safe-area-inset-top)}.create-post-fab{bottom:calc(24px + env(safe-area-inset-bottom));right:calc(24px + env(safe-area-inset-right))}}.app-loading{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:linear-gradient(135deg,var(--primary-brown) 0%,var(--primary-dark) 100%);color:var(--white)}.app-loading p{font-size:1.2rem;opacity:.9}.loading-feed{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:60px 20px;color:var(--gray-600)}.password-input-wrapper{position:relative;display:flex;align-items:center}.password-input-wrapper input{width:100%;padding-right:48px}.password-toggle{position:absolute;right:12px;background:none;border:none;color:var(--gray-500);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center}.password-toggle:hover{color:var(--gray-700)}.anonymous-note{text-align:center;color:var(--gray-600);font-size:.95rem;padding:12px;background:var(--cream);border-radius:var(--radius-md)}.anonymous-note strong{color:var(--primary-brown)}.username-badge{padding:4px 10px;background:var(--cream);border-radius:var(--radius-full);font-size:.85rem;font-weight:600;color:var(--primary-brown)}.post-image{width:100%;max-height:400px;object-fit:cover;border-radius:var(--radius-md);margin-top:12px}.image-upload-section{margin-top:8px}.add-image-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;background:var(--gray-100);border:2px dashed var(--gray-300);border-radius:var(--radius-md);color:var(--gray-600);font-weight:500;cursor:pointer;transition:all var(--transition-fast);width:100%}.add-image-btn:hover{background:var(--gray-200);border-color:var(--gray-400)}.image-preview-container{position:relative}.image-preview{width:100%;max-height:200px;object-fit:cover;border-radius:var(--radius-md)}.remove-image-btn{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:var(--radius-full);background:var(--red-flag);color:var(--white);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.remove-image-btn:hover{background:var(--red-flag-dark)}.verification-result-container{display:flex;flex-direction:column;gap:12px}.camera-video{transform:scaleX(-1)}@media (max-width: 600px){.username-badge{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}