main{padding:40px 32px 60px 32px;max-width:1400px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
main>*{width:100%;max-width:1200px}
#search-result,#advanced-search-panel,#search-bar,.real-transactions-section{width:100%;max-width:1200px;margin-left:auto;margin-right:auto}
main>h2{margin:60px 0 50px 0;padding:0 8px;font-size:32px;font-weight:700;color:#1f2937;text-align:center;position:relative}
main>h2::after{content:'';display:block;width:120px;height:4px;background:var(--brand-600);margin:16px auto 0;border-radius:2px}
#search-bar{margin-bottom:40px;padding:0 8px}
.advanced-search-panel{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;margin:0 0 40px 0;transition:all 0.3s ease}
.advanced-search-panel.hidden{display:none}
.advanced-search-content{padding:24px}
.advanced-search-content h3{margin:0 0 20px 0;font-size:18px;color:#333}
.search-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:24px}
.filter-group{display:flex;flex-direction:column}
.filter-group label{font-weight:600;color:#555;margin-bottom:8px;font-size:14px}
.filter-group input,.filter-group select{padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;transition:border-color 0.2s}
.filter-group input:focus,.filter-group select:focus{outline:none;border-color:var(--brand-600);box-shadow:0 0 0 3px rgba(79,70,229,0.1)}
.advanced-search-actions{display:flex;gap:12px;justify-content:flex-end}
.btn-outline{background:transparent;color:var(--brand-600);border:2px solid var(--brand-600)}
.btn-outline:hover{background:var(--brand-600);color:white}
.property-comparison{position:fixed;bottom:20px;right:20px;background:white;border:2px solid var(--brand-600);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,0.2);padding:16px;min-width:280px;max-width:320px;z-index:1000;animation:slideUp 0.3s ease}
@keyframes slideUp{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}
.comparison-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #e9ecef}
.comparison-title{display:flex;align-items:center;gap:8px;font-weight:600;color:#333}
.comparison-count{background:var(--brand-600);color:white;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600;min-width:24px;text-align:center}
.comparison-close-btn{background:none;border:none;font-size:24px;color:#999;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all 0.2s}
.comparison-close-btn:hover{background:#f3f4f6;color:#dc3545}
.comparison-list{max-height:200px;overflow-y:auto;margin-bottom:12px}
.comparison-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#f8f9fa;border-radius:6px;margin-bottom:6px;font-size:13px}
.comparison-item-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#333}
.comparison-remove{background:none;border:none;color:#dc3545;font-size:18px;cursor:pointer;padding:0 4px;line-height:1;transition:transform 0.2s}
.comparison-remove:hover{transform:scale(1.2)}
.comparison-actions{display:flex;gap:8px}
.comparison-btn{flex:1;padding:10px 16px;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:600;transition:all 0.2s}
.comparison-btn:disabled{opacity:0.5;cursor:not-allowed}
.compare-btn{background:var(--brand-600);color:white}
.compare-btn:not(:disabled):hover{background:var(--brand-700);transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,0.15)}
.comparison-toast{position:fixed;bottom:100px;right:20px;background:#333;color:white;padding:12px 20px;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.2);z-index:10001;opacity:0;transform:translateY(20px);transition:all 0.3s ease}
.comparison-toast.show{opacity:1;transform:translateY(0)}
.comparison-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn 0.2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.comparison-modal-content{background:white;border-radius:16px;max-width:1200px;width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,0.3);animation:slideDown 0.3s ease}
@keyframes slideDown{from{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}
.modal-header{padding:24px 28px;border-bottom:2px solid #e9ecef;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,var(--brand-600) 0%,var(--brand-700) 100%);color:white}
.modal-header h3{margin:0;font-size:24px;font-weight:700}
.modal-close{background:rgba(255,255,255,0.2);border:none;font-size:28px;color:white;cursor:pointer;padding:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all 0.2s}
.modal-close:hover{background:rgba(255,255,255,0.3);transform:rotate(90deg)}
.comparison-body{padding:28px;overflow-y:auto;flex:1}
.comparison-summary{background:linear-gradient(135deg,#fff3cd 0%,#ffe69c 100%);border:2px solid #ffc107;border-radius:12px;padding:20px;margin-bottom:24px;display:flex;align-items:center;gap:16px}
.summary-icon{font-size:48px;flex-shrink:0}
.summary-content{flex:1}
.summary-content strong{display:block;font-size:16px;color:#856404;margin-bottom:4px}
.summary-name{color:var(--brand-700);font-weight:700}
.summary-content p{margin:8px 0 0 0;color:#856404;font-size:14px}
.comparison-visual{margin-bottom:32px}
.comparison-visual h4{margin:0 0 16px 0;font-size:18px;color:#333;font-weight:600}
.risk-bars{display:flex;flex-direction:column;gap:16px}
.risk-bar-item{display:flex;flex-direction:column;gap:8px}
.risk-bar-label{display:flex;justify-content:space-between;align-items:center;font-size:14px}
.risk-property-name{font-weight:600;color:#333}
.risk-score{font-weight:700;font-size:16px}
.risk-bar-container{width:100%;height:24px;background:#e9ecef;border-radius:12px;overflow:hidden;position:relative}
.risk-bar{height:100%;border-radius:12px;transition:width 0.5s ease;position:relative}
.risk-bar::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);animation:shimmer 2s infinite}
@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.risk-level{font-size:12px;font-weight:600;text-align:right}
.risk-safe{color:#28a745}
.risk-warning{color:#ffc107}
.risk-danger{color:#dc3545}
.risk-unknown{color:#6b7280}
.comparison-table-wrapper{overflow-x:auto;margin-bottom:24px;border:1px solid #e9ecef;border-radius:8px}
.comparison-table{width:100%;border-collapse:collapse;background:white}
.comparison-section-header{background:var(--brand-600);color:white;font-weight:700;font-size:16px}
.comparison-section-header td{padding:16px 20px}
.comparison-category{background:#f8f9fa;font-weight:700;color:#333;width:180px;position:sticky;left:0;z-index:10;border-right:2px solid #e9ecef}
.comparison-table th{background:#f8f9fa;font-weight:600;color:#333;padding:16px 20px;text-align:center;border-bottom:2px solid #e9ecef;position:sticky;top:0;z-index:5}
.comparison-table th:first-child{position:sticky;left:0;z-index:15}
.comparison-label{background:#f8f9fa;font-weight:600;color:#555;padding:14px 20px;border-right:2px solid #e9ecef;position:sticky;left:0;z-index:10}
.comparison-table td{padding:14px 20px;text-align:center;border-bottom:1px solid #e9ecef;vertical-align:middle}
.comparison-table tbody tr:hover{background:#f8f9fa}
.risk-badge{display:inline-block;padding:6px 12px;border-radius:6px;font-weight:600;font-size:13px}
.risk-badge.risk-safe{background:#d4edda;color:#155724}
.risk-badge.risk-warning{background:#fff3cd;color:#856404}
.risk-badge.risk-danger{background:#f8d7da;color:#721c24}
.warning-count{display:inline-block;padding:4px 10px;background:#fff3cd;color:#856404;border-radius:12px;font-weight:600;font-size:12px}
.warning-list{font-size:13px;color:#666;text-align:left;max-width:300px;line-height:1.5}
.rate-high{color:#dc3545;font-weight:700}
.rate-medium{color:#ffc107;font-weight:600}
.rate-low{color:#28a745;font-weight:600}
.comparison-actions-footer{display:flex;gap:12px;justify-content:flex-end;padding-top:20px;border-top:2px solid #e9ecef}
.btn{padding:12px 24px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all 0.2s;font-size:14px}
.btn-primary{background:var(--brand-600);color:white}
.btn-primary:hover{background:var(--brand-700);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.15)}
.btn-outline{background:white;color:var(--brand-600);border:2px solid var(--brand-600)}
.btn-outline:hover{background:var(--brand-600);color:white}
.real-transactions-section{margin:40px 0;padding:32px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,0.06)}
#search-result{margin:40px 0;padding:0 8px}
.real-transactions-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:20px}
.header-left{flex:1;min-width:200px}
.header-right{display:flex;align-items:center;gap:12px}
.real-transactions-header h3{margin:0 0 4px 0;font-size:20px;color:#111827}
.real-transactions-header small{color:#6b7280;font-size:13px;display:block}
.month-select-label{font-size:14px;font-weight:600;color:#374151;white-space:nowrap}
.month-select{padding:8px 12px;border:1.5px solid #d1d5db;border-radius:6px;background:white;font-size:14px;font-weight:500;color:#111827;cursor:pointer;transition:all 0.2s;min-width:100px}
.month-select:hover{border-color:var(--brand-600);background:#f9fafb}
.month-select:focus{outline:none;border-color:var(--brand-600);box-shadow:0 0 0 3px rgba(25,118,210,0.1)}
.transactions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.transaction-card{border:1px solid #e5e7eb;border-radius:10px;padding:16px;background:#f9fafb;transition:transform 0.2s,box-shadow 0.2s}
.transaction-card:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,0.08)}
.transaction-card h4{margin:0 0 8px;font-size:16px;color:#1f2937}
.transaction-meta{display:flex;flex-direction:column;gap:4px;font-size:14px;color:#4b5563}
.transaction-price{font-weight:700;color:#2563eb}
.transaction-empty{padding:24px;text-align:center;border:1px dashed #e5e7eb;border-radius:10px;background:#fafafa;color:#6b7280}
.property-actions{display:flex;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid #eee}
.action-btn{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:13px;font-weight:600;transition:all 0.2s}
.review-btn{background:#28a745;color:white}
.review-btn:hover{background:#218838}
.report-btn{background:#dc3545;color:white}
.report-btn:hover{background:#c82333}
.card-actions{display:flex;align-items:center;gap:12px}
.compare-btn{padding:6px 12px;background:var(--brand-600);color:white;border:none;border-radius:4px;cursor:pointer;font-size:12px;font-weight:600;transition:all 0.2s}
.compare-btn:hover{background:var(--brand-700);transform:translateY(-1px)}
.compare-btn:disabled{background:#6c757d;cursor:not-allowed;transform:none}
.social-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:9999;display:flex;align-items:center;justify-content:center}
.social-modal.hidden{display:none}
.modal-form{background:white;border-radius:8px;max-width:500px;width:90%;max-height:80vh;overflow-y:auto}
.form-header{padding:20px 24px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center}
.form-header h3{margin:0;font-size:18px;color:#333}
.form-content{padding:24px}
.form-group{margin-bottom:20px}
.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#555}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;box-sizing:border-box}
.form-group textarea{resize:vertical;min-height:100px}
.rating-stars{display:flex;gap:4px;margin-top:8px}
.star{font-size:24px;color:#ddd;cursor:pointer;transition:color 0.2s}
.star.active{color:#ffc107}
.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}
.btn-cancel{background:#6c757d;color:white;border:none;padding:10px 20px;border-radius:4px;cursor:pointer}
.btn-submit{background:var(--brand-600);color:white;border:none;padding:10px 20px;border-radius:4px;cursor:pointer}
