:root{--primary-color:#1e40af;--primary-dark:#1e3a8a;--primary-light:#3b82f6;--primary-lighter:#60a5fa;--secondary-color:#0ea5e9;--secondary-dark:#0284c7;--secondary-light:#38bdf8;--text-primary:#1e293b;--text-secondary:#475569;--text-muted:#64748b;--bg-primary:#ffffff;--bg-secondary:#f8fafc;--bg-tertiary:#f1f5f9;--bg-accent:#eff6ff;--success-color:#059669;--warning-color:#d97706;--error-color:#dc2626;--info-color:#0891b2;--accent-purple:#7c3aed;--accent-teal:#0d9488;--accent-amber:#d97706;--accent-rose:#e11d48;--shadow-sm:0 1px 2px 0 rgba(30,64,175,0.05);--shadow-md:0 4px 6px -1px rgba(30,64,175,0.1),0 2px 4px -1px rgba(30,64,175,0.06);--shadow-lg:0 10px 15px -3px rgba(30,64,175,0.1),0 4px 6px -2px rgba(30,64,175,0.05);--shadow-xl:0 20px 25px -5px rgba(30,64,175,0.1),0 10px 10px -5px rgba(30,64,175,0.04);--shadow-blue:0 4px 20px rgba(30,64,175,0.15);--radius-sm:0.25rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--font-family:'Microsoft YaHei',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;}*{box-sizing:border-box;}html{scroll-behavior:smooth;}body{font-family:var(--font-family);line-height:1.6;color:var(--text-primary);background-color:var(--bg-secondary);margin:0;padding:0;font-size:var(--font-size-base);}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg);}.site-header{background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);color:white;padding:var(--spacing-md) 0;box-shadow:var(--shadow-blue);position:sticky;top:0;z-index:1000;transition:all 0.3s ease;}.site-header.scrolled{padding:var(--spacing-sm) 0;background:rgba(30,64,175,0.95);backdrop-filter:blur(10px);}.site-title{font-size:var(--font-size-4xl);margin:0;text-align:center;text-shadow:2px 2px 4px rgba(0,0,0,0.3);font-weight:700;}.site-title a{color:white;text-decoration:none;}.site-description{text-align:center;margin:var(--spacing-sm) 0 0 0;opacity:0.9;font-size:var(--font-size-lg);}.main-navigation{background:var(--bg-primary);padding:var(--spacing-md) 0;box-shadow:var(--shadow-sm);border-bottom:1px solid var(--bg-tertiary);}.main-navigation ul{list-style:none;margin:0;padding:0;display:flex;justify-content:center;gap:var(--spacing-xl);flex-wrap:wrap;}.main-navigation a{text-decoration:none;color:var(--text-primary);font-weight:500;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all 0.3s ease;position:relative;overflow:hidden;}.main-navigation a::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(30,64,175,0.1),transparent);transition:left 0.5s;}.main-navigation a:hover::before{left:100%;}.main-navigation a:hover{background-color:var(--primary-color);color:white;transform:translateY(-2px);box-shadow:var(--shadow-md);}.search-form-container{background:var(--bg-primary);padding:var(--spacing-2xl);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);margin:var(--spacing-2xl) 0;position:relative;overflow:hidden;}.search-form-container::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));}.search-input-group{display:flex;gap:var(--spacing-md);position:relative;}.search-input{flex:1;padding:var(--spacing-lg);border:2px solid var(--bg-tertiary);border-radius:var(--radius-lg);font-size:var(--font-size-lg);transition:all 0.3s ease;background:var(--bg-primary);}.search-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(30,64,175,0.1);transform:translateY(-1px);}.search-button{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark));color:white;border:none;padding:var(--spacing-lg) var(--spacing-xl);border-radius:var(--radius-lg);font-size:var(--font-size-lg);cursor:pointer;transition:all 0.3s ease;display:flex;align-items:center;gap:var(--spacing-sm);font-weight:600;min-width:140px;justify-content:center;}.search-button:hover{background:linear-gradient(135deg,var(--primary-dark),var(--primary-color));transform:translateY(-2px);box-shadow:var(--shadow-lg);}.search-tips{margin-top:var(--spacing-md);text-align:center;color:var(--text-secondary);font-size:var(--font-size-base);font-weight:500;background:var(--bg-accent);padding:var(--spacing-md);border-radius:var(--radius-md);border-left:4px solid var(--primary-color);}.search-suggestions{position:absolute;top:100%;left:0;right:0;background:var(--bg-primary);border:1px solid var(--bg-tertiary);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:1000;max-height:300px;overflow-y:auto;}.suggestion-item{padding:var(--spacing-md);cursor:pointer;transition:all 0.2s ease;border-bottom:1px solid var(--bg-tertiary);color:var(--text-primary);font-weight:500;}.suggestion-item:hover{background:var(--bg-accent);color:var(--primary-color);transform:translateX(4px);border-left:3px solid var(--primary-color);}.suggestion-item:last-child{border-bottom:none;}.search-results-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--bg-primary);border:1px solid var(--bg-tertiary);border-radius:var(--radius-md);box-shadow:var(--shadow-xl);z-index:1000;max-height:400px;overflow-y:auto;}.search-result-item{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md);cursor:pointer;transition:all 0.2s ease;border-bottom:1px solid var(--bg-tertiary);}.search-result-item:hover{background:var(--bg-accent);transform:translateX(4px);border-left:3px solid var(--primary-color);}.search-result-item:last-child{border-bottom:none;}.result-info{flex:1;}.result-title{font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs);}.result-meta{display:flex;gap:var(--spacing-md);flex-wrap:wrap;font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:500;}.result-arrow{color:var(--primary-color);font-size:var(--font-size-lg);font-weight:bold;}.main-content{background:var(--bg-primary);margin:var(--spacing-2xl) 0;padding:var(--spacing-2xl);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);position:relative;}.main-content::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));border-radius:var(--radius-xl) var(--radius-xl) 0 0;}.dogs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--spacing-xl);margin:var(--spacing-xl) 0;}.dog-card{background:var(--bg-primary);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-md);transition:all 0.3s ease;position:relative;animation:fadeInUp 0.6s ease forwards;opacity:0;transform:translateY(30px);}.dog-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl);}.dog-card .dog-image{position:relative;overflow:hidden;height:250px;}.dog-card .dog-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease;}.dog-card:hover .dog-image img{transform:scale(1.05);}.dog-card .dog-info{padding:var(--spacing-lg);}.dog-card h3{margin:0 0 var(--spacing-md) 0;color:var(--text-primary);font-size:var(--font-size-xl);}.dog-card h3 a{text-decoration:none;color:var(--primary-color);transition:color 0.3s ease;}.dog-card h3 a:hover{color:var(--primary-dark);}.dog-card p{margin:var(--spacing-xs) 0;color:var(--text-primary);display:flex;align-items:center;gap:var(--spacing-sm);font-weight:500;background:var(--bg-secondary);padding:var(--spacing-sm);border-radius:var(--radius-sm);border-left:3px solid var(--secondary-color);}.stats-section{margin-top:var(--spacing-2xl);padding:var(--spacing-2xl);background:linear-gradient(135deg,var(--bg-secondary),var(--bg-tertiary));border-radius:var(--radius-xl);position:relative;overflow:hidden;}.stats-section::before{content:'';position:absolute;top:-50%;right:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(30,64,175,0.1) 0%,transparent 70%);animation:rotate 20s linear infinite;}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-xl);margin-top:var(--spacing-xl);position:relative;z-index:1;}.stat-item{text-align:center;padding:var(--spacing-xl);background:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:all 0.3s ease;position:relative;overflow:hidden;}.stat-item::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));}.stat-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);}.stat-item h3{font-size:var(--font-size-4xl);color:var(--primary-color);margin:0 0 var(--spacing-sm) 0;font-weight:700;}.stat-item p{margin:0;color:var(--text-primary);font-weight:600;font-size:var(--font-size-lg);background:var(--bg-accent);padding:var(--spacing-sm);border-radius:var(--radius-sm);margin-top:var(--spacing-sm);}.tracing-code-field{position:relative;}.tracing-code-field input{font-family:'Courier New',monospace;font-size:var(--font-size-xl);font-weight:bold;text-align:center;letter-spacing:2px;background:linear-gradient(135deg,var(--bg-secondary),var(--bg-tertiary));border:2px solid var(--primary-color);color:var(--primary-color);}.tracing-code-display{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;padding:var(--spacing-lg);border-radius:var(--radius-lg);text-align:center;font-family:'Courier New',monospace;font-size:var(--font-size-2xl);font-weight:bold;letter-spacing:3px;margin:var(--spacing-lg) 0;box-shadow:var(--shadow-lg);position:relative;overflow:hidden;}.tracing-code-display::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);animation:shimmer 2s infinite;}.verification-badge{display:inline-flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-xs);font-weight:500;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);margin-left:var(--spacing-sm);}.verification-badge.verified{color:white;background:var(--success-color);border:1px solid var(--success-color);}.qr-code-container{position:relative;text-align:center;width:200px;margin:0 auto var(--spacing-md) auto;overflow:visible;min-height:280px;}.qr-code-container .qr-code-title{color:var(--text-muted);font-weight:400;margin-bottom:var(--spacing-xs);font-size:var(--font-size-xs);display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs);}.qr-code-container .qr-code-title i{font-size:var(--font-size-base);}.qr-code-container canvas{width:200px;height:200px;display:block;margin:0 auto;max-width:100%;height:auto;}.download-qr-btn{display:none;}.download-qr-btn:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md);}.qr-success-message{display:none;}.qr-fallback-message{display:none;}.qr-code-fallback{text-align:center;padding:var(--spacing-xs);}.qr-code-fallback .qr-code-url{background:var(--bg-secondary);padding:var(--spacing-xs);border-radius:var(--radius-sm);font-family:'Courier New',monospace;font-size:var(--font-size-xs);word-break:break-all;margin:var(--spacing-xs) 0;border:1px solid var(--bg-tertiary);color:var(--text-secondary);}.qr-code-placeholder{color:var(--text-muted);font-style:italic;padding:var(--spacing-xs);text-align:center;font-size:var(--font-size-xs);}.loading{color:var(--primary-color);font-size:var(--font-size-xs);padding:var(--spacing-xs);text-align:center;font-weight:400;}.vaccination-section{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-xl);margin:var(--spacing-xl) 0;border-left:4px solid var(--success-color);}.vaccination-list{display:grid;gap:var(--spacing-lg);margin-top:var(--spacing-lg);}.vaccination-item{background:var(--bg-primary);padding:var(--spacing-lg);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border-left:4px solid var(--info-color);transition:all 0.3s ease;}.vaccination-item:hover{transform:translateX(4px);box-shadow:var(--shadow-md);}.vaccination-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md);}.vaccination-title{font-weight:600;color:var(--text-primary);font-size:var(--font-size-lg);}.vaccination-date{color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:600;background:var(--bg-accent);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);border-left:3px solid var(--info-color);}.vaccination-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md);margin-top:var(--spacing-md);}.vaccination-detail{display:flex;align-items:center;gap:var(--spacing-sm);}.vaccination-detail strong{color:var(--primary-color);min-width:80px;font-weight:600;background:var(--bg-secondary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);border-left:2px solid var(--primary-color);}.add-vaccination-btn{background:var(--success-color);color:white;border:none;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);cursor:pointer;font-weight:600;transition:all 0.3s ease;margin-top:var(--spacing-lg);}.add-vaccination-btn:hover{background:#38a169;transform:translateY(-2px);box-shadow:var(--shadow-md);}.vaccination-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:2000;backdrop-filter:blur(5px);}.modal-content{background:var(--bg-primary);border-radius:var(--radius-xl);padding:var(--spacing-2xl);max-width:600px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-xl);position:relative;}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-md);border-bottom:2px solid var(--bg-tertiary);}.modal-header h3{margin:0;color:var(--text-primary);}.close-modal{background:none;border:none;font-size:var(--font-size-2xl);cursor:pointer;color:var(--text-muted);transition:color 0.3s ease;}.close-modal:hover{color:var(--error-color);}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg);margin-bottom:var(--spacing-lg);}.form-group{margin-bottom:var(--spacing-lg);}.form-group label{display:block;margin-bottom:var(--spacing-sm);color:var(--text-primary);font-weight:600;font-size:var(--font-size-base);background:var(--bg-accent);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);border-left:3px solid var(--primary-color);}.form-group input,.form-group textarea,.form-group select{width:100%;padding:var(--spacing-md);border:2px solid var(--bg-tertiary);border-radius:var(--radius-md);font-size:var(--font-size-base);transition:all 0.3s ease;}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(30,64,175,0.1);background:var(--bg-accent);}.form-actions{display:flex;gap:var(--spacing-md);justify-content:flex-end;margin-top:var(--spacing-xl);padding-top:var(--spacing-lg);border-top:2px solid var(--bg-tertiary);}.btn-primary{background:var(--primary-color);color:white;border:none;padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-md);cursor:pointer;font-weight:600;transition:all 0.3s ease;}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md);}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:2px solid var(--bg-tertiary);padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-md);cursor:pointer;font-weight:600;transition:all 0.3s ease;}.btn-secondary:hover{background:var(--bg-secondary);border-color:var(--text-muted);}.member-level-badge{display:inline-flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:600;text-transform:uppercase;letter-spacing:0.5px;}.member-level-guest{background:var(--bg-tertiary);color:var(--text-muted);}.member-level-basic{background:linear-gradient(135deg,var(--secondary-color),var(--secondary-dark));color:white;}.member-level-premium{background:linear-gradient(135deg,var(--accent-purple),#6d28d9);color:white;}.member-level-admin{background:linear-gradient(135deg,var(--accent-teal),#0f766e);color:white;}.member-level-toggle{background:none;border:2px solid var(--primary-color);color:var(--primary-color);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);cursor:pointer;font-weight:600;transition:all 0.3s ease;}.member-level-toggle:hover{background:var(--primary-color);color:white;}.image-preview-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.9);display:flex;align-items:center;justify-content:center;z-index:2000;backdrop-filter:blur(10px);}.image-preview-content{position:relative;max-width:90%;max-height:90%;}.image-preview-content img{max-width:100%;max-height:100%;border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);}.close-preview{position:absolute;top:-40px;right:0;background:none;border:none;color:white;font-size:var(--font-size-3xl);cursor:pointer;transition:all 0.3s ease;}.close-preview:hover{transform:scale(1.2);}.notification{position:fixed;top:var(--spacing-lg);right:var(--spacing-lg);background:var(--bg-primary);padding:var(--spacing-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);z-index:3000;max-width:400px;border-left:4px solid var(--info-color);animation:slideInRight 0.3s ease;}.notification-success{border-left-color:var(--success-color);}.notification-error{border-left-color:var(--error-color);}.notification-warning{border-left-color:var(--warning-color);}.notification-message{color:var(--text-primary);font-weight:500;}.notification-close{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:var(--font-size-lg);transition:color 0.3s ease;}.notification-close:hover{color:var(--error-color);}@keyframes fadeInUp{to{opacity:1;transform:translateY(0);}}@keyframes slideInRight{from{transform:translateX(100%);opacity:0;}to{transform:translateX(0);opacity:1;}}@keyframes shimmer{0%{left:-100%;}100%{left:100%;}}@keyframes rotate{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}.animate-on-scroll{opacity:0;transform:translateY(30px);transition:all 0.6s ease;}.animate-on-scroll.animate-in{opacity:1;transform:translateY(0);}.back-to-top{position:fixed;bottom:var(--spacing-xl);right:var(--spacing-xl);background:var(--primary-color);color:white;border:none;width:50px;height:50px;border-radius:50%;cursor:pointer;font-size:var(--font-size-xl);box-shadow:var(--shadow-lg);transition:all 0.3s ease;opacity:0;visibility:hidden;transform:translateY(20px);}.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0);}.back-to-top:hover{background:var(--primary-dark);transform:translateY(-4px);box-shadow:var(--shadow-xl);}.site-footer{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark));color:white;text-align:center;padding:var(--spacing-2xl) 0;margin-top:var(--spacing-2xl);box-shadow:var(--shadow-blue);}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);}.footer-info h4{color:var(--primary-light);margin-bottom:var(--spacing-md);}.footer-links{display:flex;justify-content:center;gap:var(--spacing-lg);flex-wrap:wrap;}.footer-links a{color:white;text-decoration:none;transition:color 0.3s ease;}.footer-links a:hover{color:var(--primary-light);}@media (max-width:768px){.container{padding:0 var(--spacing-md);}.site-title{font-size:var(--font-size-3xl);}.main-navigation ul{flex-direction:column;gap:var(--spacing-sm);}.search-input-group{flex-direction:column;}.search-button{min-width:auto;}.dogs-grid{grid-template-columns:1fr;}.stats-grid{grid-template-columns:1fr;}.form-row{grid-template-columns:1fr;}.form-actions{flex-direction:column;}.qr-code-container{position:static;margin:var(--spacing-md) auto;text-align:center;width:180px;overflow:visible;min-height:240px;}.back-to-top{bottom:var(--spacing-lg);right:var(--spacing-lg);}.footer-content{grid-template-columns:1fr;text-align:center;}.footer-links{flex-direction:column;gap:var(--spacing-sm);}}@media (max-width:480px){.main-content{padding:var(--spacing-lg);margin:var(--spacing-lg) 0;}.search-form-container{padding:var(--spacing-lg);}.modal-content{padding:var(--spacing-lg);width:95%;}.notification{right:var(--spacing-sm);left:var(--spacing-sm);max-width:none;}.qr-code-container{width:160px;overflow:visible;min-height:200px;}}@media print{.site-header,.main-navigation,.search-form-container,.back-to-top,.qr-code-container{display:none !important;}.main-content{box-shadow:none;margin:0;padding:0;}.dog-card{break-inside:avoid;box-shadow:none;border:1px solid #ccc;}}.text-highlight{background:linear-gradient(120deg,var(--bg-accent) 0%,var(--bg-accent) 100%);background-repeat:no-repeat;background-size:100% 0.2em;background-position:0 88%;transition:background-size 0.25s ease-in;}.text-highlight:hover{background-size:100% 100%;}.dog-card:hover,.stat-item:hover,.vaccination-item:hover{border-color:var(--primary-color);border-width:2px;}.form-group label::before{content:'📝 ';margin-right:var(--spacing-xs);}.search-tips::before{content:'💡 ';margin-right:var(--spacing-xs);}.stat-item h3{animation:countUp 2s ease-out;}@keyframes countUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}.btn-primary:hover,.btn-secondary:hover,.search-button:hover{transform:translateY(-3px);box-shadow:var(--shadow-blue);}.main-navigation a:hover{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;transform:translateY(-3px);box-shadow:var(--shadow-blue);}.suggestion-item:hover,.search-result-item:hover{background:linear-gradient(135deg,var(--bg-accent),var(--bg-secondary));border-left:4px solid var(--primary-color);transform:translateX(6px);}.form-group input:focus,.form-group textarea:focus,.form-group select:focus,.search-input:focus{border-width:3px;box-shadow:0 0 0 4px rgba(30,64,175,0.15);transform:translateY(-2px);}.dog-card .dog-info{background:linear-gradient(135deg,var(--bg-primary),var(--bg-secondary));}.vaccination-item{background:linear-gradient(135deg,var(--bg-primary),var(--bg-accent));border-left:5px solid var(--info-color);}.vaccination-item:hover{background:linear-gradient(135deg,var(--bg-accent),var(--bg-secondary));border-left:5px solid var(--primary-color);}.stats-section{background:linear-gradient(135deg,var(--bg-secondary),var(--bg-accent),var(--bg-tertiary));}.site-header{background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 50%,var(--primary-dark) 100%);}.search-form-container{background:linear-gradient(135deg,var(--bg-primary),var(--bg-accent));border:2px solid transparent;background-clip:padding-box;}.search-form-container::before{background:linear-gradient(90deg,var(--primary-color),var(--secondary-color),var(--accent-purple));}.main-content{background:linear-gradient(135deg,var(--bg-primary),var(--bg-secondary));}.main-content::before{background:linear-gradient(90deg,var(--primary-color),var(--secondary-color),var(--accent-teal));}@media (max-width:768px){.search-tips{font-size:var(--font-size-sm);padding:var(--spacing-sm);}.form-group label{font-size:var(--font-size-sm);padding:var(--spacing-xs) var(--spacing-sm);}.stat-item p{font-size:var(--font-size-base);padding:var(--spacing-xs);}.dog-card p{font-size:var(--font-size-sm);padding:var(--spacing-xs);}}@media print{.site-header,.main-navigation,.search-form-container,.back-to-top{display:none !important;}.main-content{margin:0 !important;padding:var(--spacing-md) !important;box-shadow:none !important;background:white !important;}.dog-card{break-inside:avoid;margin-bottom:var(--spacing-lg) !important;box-shadow:none !important;border:1px solid #ccc !important;}*{color:black !important;background:white !important;}}
:root{--primary-color:#667eea;--secondary-color:#764ba2;--success-color:#48bb78;--warning-color:#ed8936;--error-color:#f56565;--text-color:#2d3748;--bg-color:#ffffff;--border-color:#e2e8f0;--shadow:0 4px 6px -1px rgba(0,0,0,0.1);--border-radius:8px;--transition:all 0.3s ease;}.dog-tracing-info h3{background:none;color:var(--primary-color);padding:15px 25px;border-radius:var(--border-radius);margin-bottom:25px;text-align:center;font-size:1.4em;font-weight:bold;box-shadow:none;display:inline-block;margin-left:50%;transform:translateX(-50%);min-width:300px;max-width:500px;}.tracing-section h4{background:none;color:var(--primary-color);padding:0;border-radius:0;margin-bottom:20px;border-left:none;display:flex;align-items:center;font-size:1.2em;font-weight:600;position:relative;}.verification-badge{display:inline-block;padding:4px 8px;border-radius:12px;font-size:0.75em;font-weight:600;margin-left:10px;vertical-align:middle;}.verification-badge.verified{background:linear-gradient(135deg,#f59e0b,#d97706);color:white;box-shadow:0 2px 8px rgba(245,158,11,0.3);}.field-verified{display:inline-block;margin-left:8px;color:#f59e0b;font-size:1.1em;animation:fadeInScale 0.3s ease-in-out;}.field-verified i{filter:drop-shadow(0 2px 4px rgba(245,158,11,0.3));}.tracing-label i{margin-right:6px;color:var(--primary-color);width:16px;text-align:center;}.tracing-section h4 i,.tracing-section h5 i{margin-right:8px;color:var(--primary-color);}.search-tips h3 i,.system-stats h2 i,.recent-dogs-section h2 i,.features-section h2 i{margin-right:10px;color:var(--primary-color);font-size:0.9em;}.tip-icon i{font-size:1.5em;color:#667eea;margin-bottom:10px;}.stat-icon i{font-size:2em;color:#667eea;margin-bottom:15px;}.feature-icon i{font-size:2.5em;color:#667eea;margin-bottom:20px;}@keyframes fadeInScale{0%{opacity:0;transform:scale(0.8);}100%{opacity:1;transform:scale(1);}}.qr-code-container{position:relative;text-align:center;width:120px;margin:0;overflow:visible;min-height:140px;background:white;border-radius:8px;padding:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1);border:1px solid #667eea;float:right;margin-left:20px;margin-bottom:10px;}.qr-code-container::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));}.qr-code-container canvas,.qr-code-container img{border:none;border-radius:6px;width:120px;height:120px;max-width:100%;height:auto;box-shadow:0 2px 8px rgba(102,126,234,0.15);transition:transform 0.3s ease,box-shadow 0.3s ease;display:block;margin:0 auto;}.qr-code-container canvas:hover,.qr-code-container img:hover{transform:scale(1.02);box-shadow:0 4px 12px rgba(102,126,234,0.25);}.qr-code-fallback{text-align:center;padding:40px 20px;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;border-radius:12px;margin:20px 0;box-shadow:0 8px 25px rgba(102,126,234,0.2);position:relative;overflow:hidden;}.qr-code-fallback::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,0.1) 0%,transparent 70%);animation:rotate 20s linear infinite;}@keyframes rotate{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}.qr-code-title{font-size:1.8em;font-weight:bold;margin-bottom:15px;position:relative;z-index:1;}.qr-code-url{background:rgba(255,255,255,0.15);padding:15px;border-radius:8px;margin:15px 0;word-break:break-all;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2);position:relative;z-index:1;}.qr-code-tip{font-size:1em;opacity:0.9;position:relative;z-index:1;}.download-qr-btn{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;border:none;padding:12px 24px;border-radius:8px;cursor:pointer;margin-top:15px;font-weight:bold;transition:all 0.3s ease;box-shadow:0 4px 15px rgba(102,126,234,0.3);position:relative;overflow:hidden;}.download-qr-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:left 0.5s;}.download-qr-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(102,126,234,0.4);}.download-qr-btn:hover::before{left:100%;}.qr-code-loading{display:flex;flex-direction:column;align-items:center;padding:40px;}.qr-code-loading::after{content:'';width:40px;height:40px;border:4px solid rgba(102,126,234,0.2);border-top:4px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin-top:20px;}@keyframes spin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}.dog-image{cursor:pointer;border-radius:var(--border-radius);transition:var(--transition);max-width:100%;height:auto;}.dog-image:hover{transform:scale(1.05);box-shadow:var(--shadow);}.image-preview-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.9);display:flex;justify-content:center;align-items:center;z-index:9999;cursor:pointer;}.image-preview-content{max-width:90%;max-height:90%;position:relative;}.image-preview-content img{max-width:100%;max-height:100%;border-radius:var(--border-radius);box-shadow:0 10px 30px rgba(0,0,0,0.5);}.close-preview{position:absolute;top:-40px;right:0;color:white;font-size:2em;cursor:pointer;background:none;border:none;}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);display:flex;justify-content:center;align-items:center;z-index:10000;}.modal-content{background:var(--bg-color);border-radius:var(--border-radius);box-shadow:0 20px 40px rgba(0,0,0,0.3);max-width:600px;width:90%;max-height:90vh;overflow-y:auto;position:relative;}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 25px;border-bottom:1px solid var(--border-color);}.modal-header h3{margin:0;color:var(--primary-color);}.close-modal{font-size:2em;cursor:pointer;color:var(--text-color);background:none;border:none;padding:0;line-height:1;}.close-modal:hover{color:var(--error-color);}.modal .vaccination-form{padding:25px;margin:0;box-shadow:none;border:none;}.vaccination-section{background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:25px;margin:20px 0;box-shadow:var(--shadow);}.vaccination-record{background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:20px;margin:15px 0;box-shadow:var(--shadow);}.vaccination-record h3{color:var(--primary-color);margin-bottom:15px;border-bottom:2px solid var(--primary-color);padding-bottom:5px;}.vaccination-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin:15px 0;}.vaccination-detail{display:flex;flex-direction:column;}.vaccination-detail label{font-weight:bold;color:var(--text-color);margin-bottom:5px;}.vaccination-detail span{color:var(--text-color);padding:8px 12px;background:#f7fafc;border-radius:4px;border-left:4px solid var(--primary-color);}.vaccination-form{background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:25px;margin:20px 0;box-shadow:var(--shadow);}.vaccination-form h2{color:var(--primary-color);margin-bottom:20px;text-align:center;}.form-group{margin-bottom:20px;}.form-group label{display:block;font-weight:bold;margin-bottom:5px;color:var(--text-color);}.form-group input,.form-group textarea,.form-group select{width:100%;padding:12px;border:1px solid var(--border-color);border-radius:var(--border-radius);font-size:1em;transition:var(--transition);}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(102,126,234,0.1);}.form-buttons{display:flex;gap:10px;justify-content:center;margin-top:25px;}.btn{padding:12px 24px;border:none;border-radius:var(--border-radius);cursor:pointer;font-size:1em;font-weight:bold;transition:var(--transition);text-decoration:none;display:inline-block;text-align:center;}.btn-primary{background:var(--primary-color);color:white;}.btn-primary:hover{background:var(--secondary-color);transform:translateY(-2px);}.btn-secondary{background:var(--warning-color);color:white;}.btn-secondary:hover{background:#dd6b20;transform:translateY(-2px);}.search-container{background:var(--bg-color);border-radius:var(--border-radius);box-shadow:var(--shadow);padding:30px;margin:30px 0;}.search-form{display:flex;gap:10px;margin-bottom:20px;}.search-input{flex:1;padding:15px;border:2px solid var(--border-color);border-radius:var(--border-radius);font-size:1.1em;transition:var(--transition);}.search-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(102,126,234,0.1);}.search-results{margin-top:20px;}.search-result-item{background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:20px;margin:10px 0;transition:var(--transition);cursor:pointer;}.search-result-item:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--primary-color);}.search-results-container{position:absolute;top:100%;left:0;right:0;background:white;border:1px solid #e1e5e9;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.15);z-index:1000;max-height:400px;overflow-y:auto;margin-top:5px;}.search-results-list{padding:0;}.search-result-item{padding:15px;border-bottom:1px solid #f0f0f0;cursor:pointer;transition:background-color 0.2s ease;}.search-result-item:hover{background-color:#f8f9fa;}.search-result-item:last-child{border-bottom:none;}.result-title{font-weight:600;color:#333;margin-bottom:5px;font-size:16px;}.result-code{color:#007cba;font-size:14px;margin-bottom:3px;}.result-name{color:#666;font-size:14px;margin-bottom:8px;}.result-link{color:#007cba;text-decoration:none;font-size:14px;font-weight:500;}.result-link:hover{text-decoration:underline;}.search-suggestions{padding:20px;text-align:center;}.suggestion-item{color:#666;margin-bottom:8px;font-size:14px;}.suggestion-item:first-child{color:#dc3545;font-weight:600;font-size:16px;}.main-search-form{position:relative;}.stats-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:30px 0;}.stat-card{background:var(--bg-color);border-radius:var(--border-radius);padding:25px;box-shadow:var(--shadow);text-align:center;transition:var(--transition);}.stat-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,0.15);}.stat-number{font-size:2.5em;font-weight:bold;color:var(--primary-color);margin-bottom:10px;}.stat-label{color:var(--text-color);font-size:1.1em;}@media (max-width:768px){.search-form{flex-direction:column;}.form-buttons{flex-direction:column;}.vaccination-details{grid-template-columns:1fr;}.stats-container{grid-template-columns:1fr;}.qr-code-container{padding:20px;margin:20px 0;overflow:visible;min-height:190px;}.qr-code-container canvas,.qr-code-container img{width:130px;height:130px;max-width:100%;height:auto;display:block;margin:0 auto;}.image-preview-content{max-width:95%;max-height:95%;}}@keyframes fadeIn{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}.fade-in{animation:fadeIn 0.5s ease-out;}@keyframes slideIn{from{transform:translateX(-100%);}to{transform:translateX(0);}}.slide-in{animation:slideIn 0.3s ease-out;}.loading{display:flex;justify-content:center;align-items:center;padding:40px;}.loading::after{content:'';width:40px;height:40px;border:4px solid var(--border-color);border-top:4px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;}@keyframes spin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}.theme-primary{color:var(--primary-color);}.theme-secondary{color:var(--secondary-color);}.theme-success{color:var(--success-color);}.theme-warning{color:var(--warning-color);}.theme-error{color:var(--error-color);}.bg-primary{background-color:var(--primary-color);}.bg-secondary{background-color:var(--secondary-color);}.bg-success{background-color:var(--success-color);}.bg-warning{background-color:var(--warning-color);}.bg-error{background-color:var(--error-color);}.dog-image{cursor:pointer;border-radius:var(--border-radius);transition:var(--transition);max-width:100%;height:auto;display:block;object-fit:contain;max-height:400px;}.dog-image:hover{transform:scale(1.05);box-shadow:var(--shadow);}.no-image-placeholder{width:100%;height:200px;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));display:flex;align-items:center;justify-content:center;color:white;font-size:3em;border-radius:var(--border-radius);opacity:0.8;}.dog-photo-container{text-align:center;margin:20px 0;background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 50%,#f1f5f9 100%);border-radius:var(--border-radius);padding:30px;position:relative;overflow:hidden;min-height:500px;display:flex;align-items:center;justify-content:center;}.dog-photo-container::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 80%,rgba(102,126,234,0.05) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(118,75,162,0.05) 0%,transparent 50%),linear-gradient(45deg,transparent 30%,rgba(102,126,234,0.02) 50%,transparent 70%);pointer-events:none;}.dog-photo-container::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient( 45deg,transparent,transparent 10px,rgba(102,126,234,0.01) 10px,rgba(102,126,234,0.01) 20px );pointer-events:none;}.dog-photo-container img{max-width:80%;max-height:400px;border-radius:var(--border-radius);box-shadow:0 8px 25px rgba(0,0,0,0.15);position:relative;z-index:1;background:white;padding:10px;}.lineage-photo{margin-top:15px;text-align:center;}.lineage-photo img{max-width:200px;max-height:200px;border-radius:var(--border-radius);box-shadow:var(--shadow);}.search-result-image,.post-card-image{position:relative;overflow:hidden;border-radius:var(--border-radius);margin-bottom:15px;}.search-result-image img,.post-card-image img{width:100%;height:200px;object-fit:cover;border-radius:var(--border-radius);}.search-result-image .no-image-placeholder,.post-card-image .no-image-placeholder{height:200px;font-size:2em;}.tracing-search-hero{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;padding:60px 20px;text-align:center;border-radius:var(--border-radius);margin-bottom:40px;box-shadow:var(--shadow);}.hero-title{font-size:2.5em;margin-bottom:15px;font-weight:bold;}.hero-subtitle{font-size:1.2em;margin-bottom:20px;opacity:0.9;}.hero-authority{font-size:1.1em;margin-bottom:40px;opacity:0.85;color:#e8f4fd;font-weight:500;text-align:center;line-height:1.6;padding:15px 20px;background:rgba(255,255,255,0.1);border-radius:8px;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2);}.main-search-container{max-width:600px;margin:0 auto 40px;}.main-search-form{width:100%;}.search-input-group{display:flex;background:white;border-radius:0;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,0.1);}.main-search-input{flex:1;padding:18px 20px;border:none;font-size:1.1em;outline:none;}.main-search-input::placeholder{color:#999;}.main-search-btn{background:var(--primary-color);color:white;border:none;padding:18px 30px;cursor:pointer;font-size:1.1em;font-weight:bold;transition:var(--transition);display:flex;align-items:center;gap:8px;}.main-search-btn:hover{background:var(--secondary-color);transform:translateY(-2px);}.search-icon{font-size:1.2em;}.search-tips{margin-top:40px;}.search-tips h3{margin-bottom:30px;font-size:1.5em;}.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;max-width:800px;margin:0 auto;}.tip-item{background:linear-gradient(135deg,#f8fafc,#e2e8f0);padding:25px;border-radius:var(--border-radius);text-align:center;transition:var(--transition);border:1px solid #e2e8f0;}.tip-item:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(102,126,234,0.15);}.tip-icon{font-size:2.5em;margin-bottom:20px;}.tip-content h4{color:var(--text-color);margin-bottom:12px;font-size:1.2em;}.tip-content p{color:#64748b;font-size:0.95em;}.system-stats{background:var(--bg-color);padding:40px 20px;border-radius:var(--border-radius);box-shadow:var(--shadow);margin-bottom:40px;}.system-stats h2{text-align:center;margin-bottom:30px;color:var(--primary-color);font-size:1.8em;}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;max-width:800px;margin:0 auto;}.stat-card{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;padding:30px 20px;border-radius:var(--border-radius);text-align:center;transition:var(--transition);}.stat-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,0.2);}.stat-icon{font-size:2.5em;margin-bottom:15px;}.stat-number{font-size:2.5em;font-weight:bold;margin-bottom:10px;}.stat-label{font-size:1.1em;color:#64748b;}.recent-dogs-section{background:var(--bg-color);padding:40px 20px;border-radius:var(--border-radius);box-shadow:var(--shadow);margin-bottom:40px;}.recent-dogs-section h2{text-align:center;margin-bottom:30px;color:var(--primary-color);}.recent-dogs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;}.recent-dog-card{background:white;border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--shadow);transition:var(--transition);}.recent-dog-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,0.15);}.recent-dog-card .dog-image{height:200px;overflow:hidden;}.recent-dog-card .dog-image img{width:100%;height:100%;object-fit:cover;}.recent-dog-card .dog-info{padding:20px;}.recent-dog-card h3{margin-bottom:10px;color:var(--text-color);}.recent-dog-card .tracing-code{color:var(--primary-color);font-weight:bold;margin-bottom:15px;}.recent-dog-card .view-details{display:inline-block;background:var(--primary-color);color:white;padding:8px 16px;border-radius:var(--border-radius);text-decoration:none;font-weight:bold;transition:var(--transition);}.recent-dog-card .view-details:hover{background:var(--secondary-color);transform:translateY(-2px);}.features-section{background:var(--bg-color);padding:40px 20px;border-radius:var(--border-radius);box-shadow:var(--shadow);}.features-section h2{text-align:center;margin-bottom:30px;color:var(--primary-color);}.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:1200px;margin:0 auto;}.feature-item{text-align:center;padding:30px 20px;background:white;border-radius:var(--border-radius);box-shadow:var(--shadow);transition:var(--transition);}.feature-item:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,0.15);}.feature-icon{font-size:3em;margin-bottom:20px;}.feature-item h3{margin-bottom:15px;color:var(--primary-color);font-size:1.3em;}.feature-item p{color:#64748b;line-height:1.6;}@media (max-width:768px){.hero-title{font-size:2em;}.hero-subtitle{font-size:1.1em;}.hero-authority{font-size:1em;padding:12px 15px;margin-bottom:30px;}.dog-tracing-info h3{min-width:250px;max-width:90%;font-size:1.2em;padding:12px 20px;}.tracing-section h4{min-width:200px;max-width:90%;font-size:1.1em;padding:10px 15px;}.verification-badge{font-size:0.7em;padding:3px 6px;margin-left:8px;}.field-verified{margin-left:6px;font-size:1em;}.tip-icon i,.stat-icon i,.feature-icon i{font-size:1.2em;margin-bottom:8px;color:#667eea;}.search-input-group{flex-direction:column;}.main-search-btn{border-radius:0 0 var(--border-radius) var(--border-radius);}.main-search-input{border-radius:var(--border-radius) var(--border-radius) 0 0;}.tips-grid{grid-template-columns:1fr;}.stats-grid{grid-template-columns:repeat(2,1fr);}.features-grid{grid-template-columns:repeat(2,1fr);gap:20px;}.recent-dogs-grid{grid-template-columns:1fr;}}@media (max-width:480px){.stats-grid{grid-template-columns:1fr;}.hero-title{font-size:1.8em;}.hero-authority{font-size:0.95em;padding:10px 12px;margin-bottom:25px;}.dog-tracing-info h3{min-width:200px;max-width:95%;font-size:1.1em;padding:10px 15px;}.tracing-section h4{min-width:180px;max-width:95%;font-size:1em;padding:8px 12px;}.verification-badge{font-size:0.65em;padding:2px 5px;margin-left:6px;}.field-verified{margin-left:4px;font-size:0.9em;}.tip-icon i,.stat-icon i,.feature-icon i{font-size:1em;margin-bottom:6px;color:#667eea;}.main-search-input{padding:16px 20px;font-size:1em;border-radius:12px;border:2px solid #e2e8f0;transition:all 0.3s ease;}.main-search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,0.1);outline:none;}.main-search-btn{padding:16px 24px;font-size:1.1em;font-weight:600;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:12px;box-shadow:0 4px 15px rgba(102,126,234,0.3);border:none;color:white;transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;}.main-search-btn:hover{background:linear-gradient(135deg,#5a67d8 0%,#6b46c1 100%);transform:translateY(-2px);box-shadow:0 6px 20px rgba(102,126,234,0.4);}.main-search-btn:active{transform:translateY(0);box-shadow:0 2px 10px rgba(102,126,234,0.3);}.search-icon{font-size:1.2em;}.features-grid{grid-template-columns:repeat(2,1fr);gap:15px;padding:0 10px;}.feature-item{padding:20px 15px;min-height:auto;}.feature-icon{font-size:2.5em;margin-bottom:15px;}.feature-item h3{font-size:1.1em;margin-bottom:10px;}.feature-item p{font-size:0.9em;line-height:1.4;}}@media (max-width:360px){.features-grid{grid-template-columns:repeat(2,1fr);gap:10px;padding:0 5px;}.feature-item{padding:15px 10px;}.feature-icon{font-size:2em;margin-bottom:10px;}.feature-item h3{font-size:1em;margin-bottom:8px;}.feature-item p{font-size:0.8em;line-height:1.3;}.hero-title{font-size:1.6em;}.hero-authority{font-size:0.9em;padding:8px 10px;}.main-search-btn{padding:14px 20px;font-size:1em;min-height:45px;}.search-icon{font-size:1.1em;}.main-search-input{padding:14px 18px;font-size:0.95em;}.qr-code-container{padding:15px;margin:15px 0;overflow:visible;min-height:160px;}.qr-code-container canvas,.qr-code-container img{width:120px;height:120px;max-width:100%;height:auto;}}@media (max-width:768px){.qr-code-container{width:100px;min-height:120px;padding:6px;float:none;margin:0 auto 15px auto;display:block;}.qr-code-container canvas,.qr-code-container img{width:100px;height:100px;}}@media (max-width:480px){.qr-code-container{width:90px;min-height:110px;padding:5px;}.qr-code-container canvas,.qr-code-container img{width:90px;height:90px;}}.entry-header{position:relative;margin-bottom:20px;overflow:hidden;}.tracing-code-display{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;padding:8px 15px;border-radius:6px;font-weight:bold;margin-bottom:15px;display:inline-block;box-shadow:0 2px 8px rgba(102,126,234,0.2);}.entry-content{margin-top:10px;}.dog-tracing-info{margin-top:15px;}@media (max-width:768px){.entry-header{margin-bottom:15px;}.tracing-code-display{padding:6px 12px;font-size:14px;margin-bottom:10px;}.entry-content{margin-top:5px;}.dog-tracing-info{margin-top:10px;}}@media (max-width:480px){.tracing-code-display{padding:5px 10px;font-size:13px;margin-bottom:8px;}}.site-header .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;}.user-auth-section{display:flex;align-items:center;gap:10px;}.auth-buttons{display:flex;gap:10px;}.auth-btn{display:inline-flex;align-items:center;gap:5px;padding:8px 16px;border-radius:6px;text-decoration:none;font-weight:500;font-size:14px;transition:all 0.3s ease;border:2px solid transparent;}.login-btn{background-color:#f8f9fa;color:#495057;border-color:#dee2e6;}.login-btn:hover{background-color:#e9ecef;border-color:#adb5bd;color:#212529;}.register-btn{background-color:#007bff;color:white;border-color:#007bff;}.register-btn:hover{background-color:#0056b3;border-color:#0056b3;color:white;}.logout-btn{background-color:#dc3545;color:white;border-color:#dc3545;}.logout-btn:hover{background-color:#c82333;border-color:#c82333;color:white;}.user-info{display:flex;align-items:center;gap:10px;}.welcome-text{font-size:14px;color:white;font-weight:500;}@media (max-width:768px){.site-header .container{flex-direction:column;gap:15px;}.user-auth-section{width:100%;justify-content:center;}.auth-buttons{width:100%;justify-content:center;}.auth-btn{flex:1;justify-content:center;max-width:120px;}}.auth-page{max-width:450px;margin:50px auto;padding:40px;background:white;border-radius:15px;box-shadow:0 10px 30px rgba(0,0,0,0.1);border:1px solid #e9ecef;}.auth-page h1{text-align:center;margin-bottom:30px;color:var(--primary-color);font-size:2em;font-weight:700;}.auth-form{display:flex;flex-direction:column;gap:20px;}.form-group{display:flex;flex-direction:column;gap:8px;}.form-group label{font-weight:600;color:#495057;display:flex;align-items:center;gap:8px;}.form-group label i{color:var(--primary-color);width:16px;}.form-group input{padding:12px 16px;border:2px solid #e9ecef;border-radius:8px;font-size:16px;transition:all 0.3s ease;background:white;color:#495057;}.form-group input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(102,126,234,0.1);}.form-group input::placeholder{color:#a0aec0;}.form-group small{font-size:0.875rem;color:#718096;margin-top:4px;}.auth-submit-btn{background:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);color:white;padding:14px 20px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;}.auth-submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(102,126,234,0.3);}.auth-submit-btn:active{transform:translateY(0);}.auth-links{text-align:center;margin-top:30px;padding-top:20px;border-top:1px solid #e9ecef;}.auth-links p{margin:10px 0;color:#495057;}.auth-links a{color:var(--primary-color);text-decoration:none;font-weight:500;transition:all 0.3s ease;}.auth-links a:hover{color:var(--secondary-color);text-decoration:underline;}.error-message{background:linear-gradient(135deg,#fed7d7 0%,#feb2b2 100%);color:#c53030;padding:15px;border-radius:8px;margin-bottom:20px;border:1px solid #feb2b2;display:flex;align-items:center;gap:10px;font-weight:500;}.success-message{background:linear-gradient(135deg,#c6f6d5 0%,#9ae6b4 100%);color:#22543d;padding:15px;border-radius:8px;margin-bottom:20px;border:1px solid #9ae6b4;display:flex;align-items:center;gap:10px;font-weight:500;}@media (max-width:768px){.auth-page{margin:30px auto;padding:30px 20px;max-width:100%;}.auth-page h1{font-size:1.75em;}}@media (max-width:480px){.auth-page{margin:20px auto;padding:25px 15px;}.auth-page h1{font-size:1.5em;}.form-group input{padding:10px 12px;font-size:16px;}.auth-submit-btn{padding:12px 16px;font-size:16px;}}.login-required-container{max-width:500px;margin:30px auto;text-align:center;}.login-required-message{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;padding:40px 30px;border-radius:15px;box-shadow:0 10px 30px rgba(0,0,0,0.2);}.login-required-message i{font-size:48px;margin-bottom:20px;display:block;opacity:0.9;}.login-required-message h2{font-size:24px;margin-bottom:15px;font-weight:600;}.login-required-message p{font-size:16px;margin-bottom:30px;opacity:0.9;line-height:1.6;}.login-required-buttons{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;}.login-required-buttons .auth-btn{min-width:140px;padding:12px 20px;font-size:16px;border-radius:8px;font-weight:600;transition:all 0.3s ease;}.login-required-buttons .login-btn{background-color:rgba(255,255,255,0.2);color:white;border-color:rgba(255,255,255,0.3);}.login-required-buttons .login-btn:hover{background-color:rgba(255,255,255,0.3);border-color:rgba(255,255,255,0.5);transform:translateY(-2px);}.login-required-buttons .register-btn{background-color:#28a745;color:white;border-color:#28a745;}.login-required-buttons .register-btn:hover{background-color:#218838;border-color:#1e7e34;transform:translateY(-2px);}@media (max-width:768px){.login-required-container{margin:20px auto;}.login-required-message{padding:30px 20px;}.login-required-message h2{font-size:20px;}.login-required-message p{font-size:14px;}.login-required-buttons{flex-direction:column;align-items:center;}.login-required-buttons .auth-btn{width:100%;max-width:200px;}}
.acf-vaccination-section{margin:2rem 0;padding:1.5rem;background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);border-radius:16px;border:1px solid #e2e8f0;box-shadow:0 4px 6px -1px rgba(0,0,0,0.1);min-width:0;}.acf-vaccination-section .section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #e2e8f0;}.acf-vaccination-section .section-header h4{margin:0;font-size:1.5rem;font-weight:700;color:#1a202c;display:flex;align-items:center;gap:0.5rem;}.add-vaccination-btn,.add-first-vaccination-btn{background:none;color:var(--primary-color);border:1px solid var(--primary-color);padding:0.75rem 1.5rem;border-radius:8px;font-weight:600;cursor:pointer;transition:all 0.3s ease;font-size:0.875rem;display:flex;align-items:center;gap:0.5rem;}.add-vaccination-btn:hover,.add-first-vaccination-btn:hover{transform:translateY(-2px);background:var(--primary-color);color:white;box-shadow:0 4px 15px rgba(102,126,234,0.3);}.vaccination-list{display:grid;gap:1.5rem;}.vaccination-record{background:white;border-radius:10px;padding:1.2rem;box-shadow:0 2px 4px rgba(0,0,0,0.1);border:1px solid #e2e8f0;transition:all 0.3s ease;position:relative;overflow:visible;box-sizing:border-box;width:100%;max-width:100%;min-height:auto;}.vaccination-record::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:none;}.vaccination-record:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,0.15);}.vaccination-header{margin-bottom:1rem;min-height:0;overflow:visible;box-sizing:border-box;width:100%;max-width:100%;height:auto;}.vaccination-header h3{margin:0 0 0.5rem 0;font-size:1rem;font-weight:600;color:#2d3748;line-height:1.3;word-wrap:break-word;overflow-wrap:break-word;hyphens:auto;max-width:100%;}.vaccination-meta{display:flex;flex-wrap:wrap;gap:0.75rem;font-size:0.75rem;color:#718096;margin-bottom:0.5rem;align-items:center;}.vaccination-date,.vaccine-batch{display:flex;align-items:center;gap:0.25rem;padding:0.15rem 0.3rem;background:#f7fafc;border-radius:4px;border:1px solid #e2e8f0;font-size:0.7rem;white-space:nowrap;}.vaccination-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0.8rem;margin-bottom:0.8rem;}.vaccination-detail{display:flex;align-items:flex-start;gap:0.5rem;padding:0.6rem 0.75rem;background:#f7fafc;border-radius:6px;border:1px solid #e2e8f0;font-size:0.85rem;min-height:40px;word-wrap:break-word;overflow-wrap:break-word;}.vaccination-detail strong{color:#2d3748;font-weight:600;min-width:80px;flex-shrink:0;font-size:0.8rem;}.vaccination-detail span{color:#4a5568;line-height:1.4;font-size:0.85rem;flex:1;word-wrap:break-word;overflow-wrap:break-word;}.next-due-date.overdue{color:#e53e3e;font-weight:600;}.next-due-date:not(.overdue){color:#38a169;font-weight:600;}.certificate-link{color:#667eea;text-decoration:none;font-weight:500;transition:color 0.3s ease;}.certificate-link:hover{color:#764ba2;text-decoration:underline;}.vaccination-detail.notes{grid-column:1 / -1;}.vaccination-detail.notes span{white-space:pre-line;}.vaccination-detail{overflow:visible;white-space:normal;}.vaccination-detail span{white-space:normal;word-break:break-word;hyphens:auto;}.vaccination-record .vaccination-header h3{font-size:1rem;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word;hyphens:auto;max-width:100%;min-height:auto;display:block;overflow:visible;color:#2d3748;font-weight:600;margin:0 0 0.5rem 0;}.vaccination-actions{display:flex;gap:0.75rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #e2e8f0;}.edit-vaccination-btn,.delete-vaccination-btn{padding:0.5rem 1rem;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all 0.3s ease;font-size:0.875rem;display:flex;align-items:center;gap:0.25rem;}.edit-vaccination-btn{background:#4299e1;color:white;}.edit-vaccination-btn:hover{background:#3182ce;transform:translateY(-1px);}.delete-vaccination-btn{background:#f56565;color:white;}.delete-vaccination-btn:hover{background:#e53e3e;transform:translateY(-1px);}.no-vaccinations{text-align:center;padding:3rem 1rem;color:#718096;}.no-vaccinations p{margin:0 0 1.5rem 0;font-size:1.125rem;}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:2000;backdrop-filter:blur(5px);}.modal-content{background:white;border-radius:16px;padding:2rem;max-width:700px;width:95%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 25px -5px rgba(0,0,0,0.1);position:relative;}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #e2e8f0;}.modal-header h3{margin:0;color:#2d3748;font-size:1.125rem;font-weight:600;}.close-modal{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#718096;transition:color 0.3s ease;padding:0.5rem;border-radius:50%;}.close-modal:hover{color:#e53e3e;background:#fed7d7;}.vaccination-form{display:flex;flex-direction:column;gap:1rem;}.vaccination-form .form-group label{white-space:normal;word-wrap:break-word;overflow-wrap:break-word;hyphens:auto;min-height:1.2em;}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start;}.form-group{display:flex;flex-direction:column;gap:0.5rem;min-width:0;}.form-group label{font-weight:600;color:#2d3748;font-size:0.85rem;margin-bottom:0.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2;}.form-group input,.form-group textarea{padding:0.75rem;border:2px solid #e2e8f0;border-radius:8px;font-size:0.9rem;transition:all 0.3s ease;min-height:44px;width:100%;box-sizing:border-box;}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,0.1);}.form-group small{color:#718096;font-size:0.8rem;margin-top:0.25rem;line-height:1.4;}.form-actions{display:flex;gap:1rem;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #e2e8f0;}.submit-btn,.cancel-btn{padding:0.5rem 1rem;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all 0.3s ease;font-size:0.875rem;display:flex;align-items:center;gap:0.5rem;}.submit-btn{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;flex:1;}.submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px rgba(102,126,234,0.4);}.submit-btn:disabled{opacity:0.6;cursor:not-allowed;}.cancel-btn{background:#e2e8f0;color:#4a5568;}.cancel-btn:hover{background:#cbd5e0;}.loading{display:inline-block;width:20px;height:20px;border:3px solid rgba(255,255,255,0.3);border-radius:50%;border-top-color:white;animation:spin 1s ease-in-out infinite;}@keyframes spin{to{transform:rotate(360deg);}}@media (max-width:768px){.acf-vaccination-section{padding:var(--spacing-sm);margin:var(--spacing-xs);}.acf-vaccination-section .section-header{flex-direction:column;gap:var(--spacing-sm);align-items:flex-start;}.acf-vaccination-section .section-header h4{font-size:var(--font-size-base);margin-bottom:var(--spacing-sm);}.vaccination-details{grid-template-columns:1fr;gap:var(--spacing-sm);}.form-row{grid-template-columns:1fr;gap:1rem;}.vaccination-actions{flex-direction:column;gap:var(--spacing-sm);}.edit-vaccination-btn,.delete-vaccination-btn{width:100%;justify-content:center;padding:var(--spacing-sm);font-size:var(--font-size-xs);}.modal-content{width:95%;margin:20px auto;max-height:90vh;overflow-y:auto;}.form-actions{flex-direction:column;gap:var(--spacing-sm);}.submit-btn,.cancel-btn{width:100%;justify-content:center;padding:var(--spacing-sm);font-size:var(--font-size-xs);}.vaccination-record{padding:var(--spacing-sm);margin-bottom:var(--spacing-sm);}.vaccination-header h3{font-size:0.9rem;margin-bottom:var(--spacing-xs);}.vaccination-meta{flex-direction:column;gap:var(--spacing-xs);align-items:flex-start;}.vaccination-date,.vaccine-batch{font-size:var(--font-size-xs);}.vaccination-detail{flex-direction:column;align-items:flex-start;gap:var(--spacing-xs);}.vaccination-detail strong{font-size:var(--font-size-xs);min-width:auto;}.vaccination-detail span{font-size:var(--font-size-xs);width:100%;word-break:break-word;}}@media (max-width:480px){.vaccination-meta{flex-direction:column;gap:4px;}.vaccination-detail{flex-direction:column;gap:4px;}.vaccination-detail strong{font-size:var(--font-size-xs);min-width:auto;}.vaccination-detail span{font-size:var(--font-size-xs);width:100%;}.vaccination-record{padding:var(--spacing-xs);margin-bottom:var(--spacing-xs);border-radius:var(--radius-sm);}.vaccination-header h3{font-size:0.85rem;line-height:1.3;}.vaccination-date,.vaccine-batch{font-size:var(--font-size-xs);line-height:1.4;}.modal-content{width:98%;margin:10px auto;padding:var(--spacing-sm);}.modal-header{padding:var(--spacing-sm);}.modal-header h3{font-size:var(--font-size-sm);}.close-modal{font-size:var(--font-size-lg);padding:var(--spacing-xs);}.form-group{gap:var(--spacing-xs);}.form-group label{font-size:0.75rem;}.form-group input,.form-group textarea{padding:var(--spacing-xs);font-size:var(--font-size-xs);}.form-group small{font-size:var(--font-size-xs);}.form-actions{margin-top:var(--spacing-md);padding-top:var(--spacing-sm);}.submit-btn,.cancel-btn{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs);border-radius:var(--radius-sm);}}.vaccination-record{animation:fadeInUp 0.6s ease-out;}@keyframes fadeInUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}.success-message,.error-message{padding:1rem;border-radius:8px;margin:1rem 0;font-weight:500;}.success-message{background:#c6f6d5;color:#22543d;border:1px solid #9ae6b4;}.error-message{background:#fed7d7;color:#742a2a;border:1px solid #feb2b2;}.vaccination-record .vaccination-header h3,.acf-vaccination-section .vaccination-record .vaccination-header h3,.vaccination-section .vaccination-record .vaccination-header h3,body .vaccination-record .vaccination-header h3,body .acf-vaccination-section .vaccination-record .vaccination-header h3,body .vaccination-section .vaccination-record .vaccination-header h3{font-size:1rem !important;line-height:1.4 !important;word-wrap:break-word !important;overflow-wrap:break-word !important;hyphens:auto !important;max-width:100% !important;min-height:auto !important;display:block !important;overflow:visible !important;color:#2d3748 !important;font-weight:600 !important;margin:0 0 0.5rem 0 !important;white-space:normal !important;text-overflow:unset !important;-webkit-line-clamp:unset !important;-webkit-box-orient:unset !important;box-sizing:border-box !important;padding:0 !important;border:none !important;background:none !important;width:100% !important;height:auto !important;min-width:0 !important;max-height:none !important;visibility:visible !important;opacity:1 !important;position:static !important;z-index:auto !important;clip:auto !important;clip-path:none !important;transform:none !important;filter:none !important;text-indent:0 !important;letter-spacing:normal !important;word-spacing:normal !important;text-transform:none !important;text-decoration:none !important;text-align:left !important;vertical-align:baseline !important;direction:ltr !important;unicode-bidi:normal !important;writing-mode:horizontal-tb !important;text-orientation:mixed !important;text-rendering:auto !important;-webkit-font-smoothing:auto !important;-moz-osx-font-smoothing:auto !important;font-feature-settings:normal !important;font-variant:normal !important;font-stretch:normal !important;font-style:normal !important;font-variant-ligatures:normal !important;font-variant-caps:normal !important;font-variant-numeric:normal !important;font-variant-east-asian:normal !important;font-kerning:auto !important;font-optical-sizing:auto !important;font-variation-settings:normal !important;}.vaccination-record .vaccination-header h3,.acf-vaccination-section .vaccination-record .vaccination-header h3,.vaccination-section .vaccination-record .vaccination-header h3,body .vaccination-record .vaccination-header h3,body .acf-vaccination-section .vaccination-record .vaccination-header h3,body .vaccination-section .vaccination-record .vaccination-header h3,html body .vaccination-record .vaccination-header h3,html body .acf-vaccination-section .vaccination-record .vaccination-header h3,html body .vaccination-section .vaccination-record .vaccination-header h3{display:block !important;visibility:visible !important;opacity:1 !important;position:static !important;z-index:auto !important;font-size:1rem !important;line-height:1.4 !important;color:#2d3748 !important;font-weight:600 !important;text-align:left !important;white-space:normal !important;margin:0 0 0.5rem 0 !important;padding:0 !important;border:none !important;background:none !important;width:100% !important;height:auto !important;min-width:0 !important;max-width:100% !important;min-height:auto !important;max-height:none !important;overflow:visible !important;text-overflow:unset !important;word-wrap:break-word !important;overflow-wrap:break-word !important;hyphens:auto !important;-webkit-line-clamp:unset !important;-webkit-box-orient:unset !important;display:block !important;transform:none !important;filter:none !important;clip:auto !important;clip-path:none !important;font-family:inherit !important;font-style:normal !important;font-variant:normal !important;font-stretch:normal !important;text-transform:none !important;text-decoration:none !important;letter-spacing:normal !important;word-spacing:normal !important;box-sizing:border-box !important;direction:ltr !important;unicode-bidi:normal !important;writing-mode:horizontal-tb !important;text-orientation:mixed !important;text-rendering:auto !important;-webkit-font-smoothing:auto !important;-moz-osx-font-smoothing:auto !important;}
:root{--primary-color:#667eea;--secondary-color:#764ba2;--success-color:#10b981;--warning-color:#f59e0b;--error-color:#ef4444;--bg-color:#f8fafc;--text-color:#2d3748;--border-radius:12px;--shadow:0 4px 20px rgba(0,0,0,0.1);--transition:all 0.3s ease;}*{margin:0;padding:0;box-sizing:border-box;}body{font-family:'Microsoft YaHei',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.6;color:var(--text-color);background:var(--bg-color);}.container{max-width:1200px;margin:0 auto;padding:20px;}.tracing-search-hero{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));padding:40px 20px;border-radius:var(--border-radius);text-align:center;color:white;margin-bottom:30px;}.hero-title{font-size:2.5em;margin-bottom:15px;font-weight:bold;}.hero-authority{background:rgba(255,255,255,0.2);padding:12px 20px;border-radius:25px;display:inline-block;margin-bottom:30px;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.3);}.main-search-container{max-width:600px;margin:0 auto;}.search-input-group{display:flex;background:white;border-radius:0;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,0.1);}.main-search-input{flex:1;padding:15px 20px;border:none;font-size:1.1em;outline:none;}.main-search-btn{background:var(--primary-color);color:white;border:none;padding:15px 25px;cursor:pointer;font-size:1.1em;transition:var(--transition);}.main-search-btn:hover{background:var(--secondary-color);}.search-tips{margin-top:30px;}.search-tips h3{color:white;margin-bottom:20px;font-size:1.3em;}.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;max-width:800px;margin:0 auto;}.tip-item{background:linear-gradient(135deg,#f8fafc,#e2e8f0);padding:25px;border-radius:var(--border-radius);text-align:center;transition:var(--transition);border:1px solid #e2e8f0;}.tip-item:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(102,126,234,0.15);}.tip-icon i{font-size:2.5em;color:#667eea;margin-bottom:20px;}.tip-content h4{color:var(--text-color);margin-bottom:12px;font-size:1.2em;}.tip-content p{color:#64748b;font-size:0.95em;}.system-stats{background:white;padding:30px 20px;border-radius:var(--border-radius);box-shadow:var(--shadow);margin-bottom:30px;}.system-stats h2{text-align:center;margin-bottom:25px;color:var(--primary-color);font-size:1.8em;}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;max-width:800px;margin:0 auto;}.stat-card{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:white;padding:25px 15px;border-radius:var(--border-radius);text-align:center;transition:var(--transition);}.stat-card:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,0.2);}.stat-icon i{font-size:2em;color:#667eea;margin-bottom:15px;}.stat-number{font-size:2.2em;font-weight:bold;margin-bottom:8px;}.stat-label{font-size:1em;color:#64748b;}.features-section{background:white;padding:30px 20px;border-radius:var(--border-radius);box-shadow:var(--shadow);margin-bottom:30px;}.features-section h2{text-align:center;margin-bottom:25px;color:var(--primary-color);font-size:1.8em;}.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1200px;margin:0 auto;}.feature-item{background:linear-gradient(135deg,#f8fafc,#e2e8f0);padding:25px;border-radius:var(--border-radius);text-align:center;transition:var(--transition);border:1px solid #e2e8f0;}.feature-item:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(102,126,234,0.15);}.feature-icon i{font-size:2.5em;color:#667eea;margin-bottom:20px;}.feature-item h3{color:var(--text-color);margin-bottom:12px;font-size:1.2em;}.feature-item p{color:#64748b;font-size:0.95em;}.dog-tracing-info{background:white;border-radius:var(--border-radius);box-shadow:var(--shadow);overflow:hidden;margin-bottom:30px;}.dog-tracing-info h3{background:none;color:var(--primary-color);padding:15px 20px;margin:0;font-size:1.3em;text-align:center;}.section-divider{height:3px;background:none;margin:0;}.tracing-section{padding:25px 20px;border-bottom:1px solid #e2e8f0;}.tracing-section:last-child{border-bottom:none;}.tracing-section h4{color:var(--primary-color);margin-bottom:20px;font-size:1.2em;display:flex;align-items:center;gap:10px;background:none;padding:0;border:none;}.verification-badge{background:var(--success-color);color:white;padding:4px 8px;border-radius:12px;font-size:0.7em;margin-left:auto;}.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:15px;}.tracing-field{display:flex;align-items:center;padding:12px 15px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;transition:var(--transition);}.tracing-field:hover{background:#f1f5f9;transform:translateX(3px);}.tracing-label{font-weight:bold;color:var(--text-color);min-width:120px;display:flex;align-items:center;gap:8px;}.tracing-value{flex:1;color:#64748b;}.field-verified{color:var(--success-color);margin-left:10px;}.dog-photo-container{text-align:center;margin:20px 0;background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 50%,#f1f5f9 100%);border-radius:var(--border-radius);padding:30px;position:relative;overflow:hidden;min-height:500px;display:flex;align-items:center;justify-content:center;}.dog-photo-container::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 80%,rgba(102,126,234,0.05) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(118,75,162,0.05) 0%,transparent 50%),linear-gradient(45deg,transparent 30%,rgba(102,126,234,0.02) 50%,transparent 70%);pointer-events:none;}.dog-photo-container::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient( 45deg,transparent,transparent 10px,rgba(102,126,234,0.01) 10px,rgba(102,126,234,0.01) 20px );pointer-events:none;}.dog-image{max-width:80%;height:auto;border-radius:var(--border-radius);box-shadow:0 8px 25px rgba(0,0,0,0.15);transition:var(--transition);cursor:pointer;object-fit:contain;max-height:400px;position:relative;z-index:1;background:white;padding:10px;}.dog-image:hover{transform:scale(1.02);box-shadow:0 8px 25px rgba(0,0,0,0.2);}.lineage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;}.lineage-item{background:#f8fafc;padding:20px;border-radius:var(--border-radius);border:1px solid #e2e8f0;}.lineage-item h5{color:var(--primary-color);margin-bottom:15px;font-size:1.1em;display:flex;align-items:center;gap:8px;}.lineage-photo{margin-top:15px;text-align:center;}.lineage-photo img{max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,0.1);}.vaccination-section{background:white;border-radius:var(--border-radius);box-shadow:var(--shadow);overflow:hidden;margin-bottom:30px;}.section-header{background:none;color:var(--primary-color);padding:20px;display:flex;justify-content:space-between;align-items:center;}.section-header h4{margin:0;font-size:1.3em;display:flex;align-items:center;gap:10px;}.add-vaccination-btn{background:rgba(255,255,255,0.2);color:white;border:1px solid rgba(255,255,255,0.3);padding:8px 16px;border-radius:20px;cursor:pointer;transition:var(--transition);backdrop-filter:blur(10px);}.add-vaccination-btn:hover{background:rgba(255,255,255,0.3);transform:translateY(-2px);}.vaccination-list{padding:20px;}.vaccination-record{background:#f8fafc;border-radius:var(--border-radius);padding:20px;margin-bottom:15px;border:1px solid #e2e8f0;}.vaccination-record:last-child{margin-bottom:0;}.vaccination-header{margin-bottom:15px;}.vaccination-header h3{color:var(--primary-color);margin-bottom:8px;font-size:1.2em;}.vaccination-meta{display:flex;gap:20px;font-size:0.9em;color:#64748b;}.vaccination-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;}.vaccination-detail{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e2e8f0;}.vaccination-detail:last-child{border-bottom:none;}.vaccination-detail strong{color:var(--text-color);}.vaccination-detail span{color:#64748b;}@media (max-width:768px){.hero-title{font-size:2em;}.search-input-group{flex-direction:column;}.main-search-btn{border-radius:0 0 var(--border-radius) var(--border-radius);}.main-search-input{border-radius:var(--border-radius) var(--border-radius) 0 0;}.tips-grid,.stats-grid{grid-template-columns:1fr;}.features-grid{grid-template-columns:repeat(2,1fr);}.info-grid{grid-template-columns:1fr;}.lineage-grid{grid-template-columns:1fr;}.vaccination-meta{flex-direction:column;gap:5px;}.section-header{flex-direction:column;gap:15px;text-align:center;}.dog-photo-container{padding:20px;margin:15px 0;}.dog-image{max-height:300px;}}@media (max-width:480px){.container{padding:15px;}.hero-title{font-size:1.8em;}.hero-authority{font-size:0.9em;padding:10px 15px;}.dog-photo-container{padding:15px;margin:10px 0;}.dog-image{max-height:250px;}.main-search-input{padding:16px 20px;font-size:1em;border-radius:12px;border:2px solid #e2e8f0;transition:all 0.3s ease;}.main-search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,0.1);outline:none;}.main-search-btn{padding:16px 24px;font-size:1.1em;font-weight:600;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:12px;box-shadow:0 4px 15px rgba(102,126,234,0.3);border:none;color:white;transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;}.main-search-btn:hover{background:linear-gradient(135deg,#5a67d8 0%,#6b46c1 100%);transform:translateY(-2px);box-shadow:0 6px 20px rgba(102,126,234,0.4);}.main-search-btn:active{transform:translateY(0);box-shadow:0 2px 10px rgba(102,126,234,0.3);}.tracing-field{flex-direction:column;align-items:flex-start;gap:8px;}.tracing-label{min-width:auto;}.features-grid{grid-template-columns:repeat(2,1fr);gap:15px;padding:0 10px;}.feature-item{padding:20px 15px;min-height:auto;}.feature-icon i{font-size:2.5em;margin-bottom:15px;}.feature-item h3{font-size:1.1em;margin-bottom:10px;}.feature-item p{font-size:0.9em;line-height:1.4;}}@media (max-width:360px){.features-grid{grid-template-columns:repeat(2,1fr);gap:10px;padding:0 5px;}.feature-item{padding:15px 10px;}.feature-icon i{font-size:2em;margin-bottom:10px;}.feature-item h3{font-size:1em;margin-bottom:8px;}.feature-item p{font-size:0.8em;line-height:1.3;}.hero-title{font-size:1.6em;}.hero-authority{font-size:0.9em;padding:8px 10px;}.main-search-btn{padding:14px 20px;font-size:1em;min-height:45px;}.main-search-input{padding:14px 18px;font-size:0.95em;}}.critical-styles{display:none;}.lazy-load{opacity:0;transition:opacity 0.3s ease;}.lazy-load.loaded{opacity:1;}@media print{.main-search-container,.search-tips,.system-stats,.features-section,.add-vaccination-btn{display:none;}.dog-tracing-info{box-shadow:none;border:1px solid #ccc;}.tracing-field{border:1px solid #ccc;margin-bottom:10px;}}