:root{--primary-color:#ff9800;--primary-hover:#e68900;--secondary-color:#4caf50;--secondary-hover:#43a047;--background-color:#f8f9fa;--surface-color:#fff;--text-color:#2c3e50;--text-muted:#6c757d;--border-color:#e9ecef;--white:#fff;--alert-red:#f44336;--shadow-sm:0 2px 4px #0000000d;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 8px 24px #0000001f;--font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-xxl:48px;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-full:9999px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--background-color);color:var(--text-color);-webkit-tap-highlight-color:transparent;line-height:1.6}.container{width:100%;max-width:1200px;padding:0 var(--spacing-md);margin:0 auto}@media (width>=768px){.container{padding:0 var(--spacing-lg)}}.app-layout{flex-direction:column;min-height:100vh;display:flex}.main-content{gap:var(--spacing-xxl);padding-top:var(--spacing-lg);padding-bottom:var(--spacing-xxl);flex-direction:column;flex:1;display:flex}.navbar-header{background-color:var(--surface-color);border-bottom:1px solid var(--border-color);z-index:100;box-shadow:var(--shadow-sm);position:sticky;top:0}.navbar-container{flex-direction:row;justify-content:space-between;align-items:center;height:64px;display:flex}.navbar-brand{align-items:center;gap:var(--spacing-sm);color:var(--text-color);font-size:1.2rem;font-weight:700;display:flex}.navbar-logo{font-size:1.5rem}.navbar-nav{gap:var(--spacing-xs);-webkit-overflow-scrolling:touch;display:flex;overflow-x:auto}.nav-btn{padding:var(--spacing-sm) var(--spacing-md);color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;background:0 0;border:none;font-size:.95rem;font-weight:500;transition:all .2s}.nav-btn:hover{color:var(--primary-color);background-color:#ff980014}.nav-btn.active{color:var(--primary-color);background-color:#ff98001f;font-weight:600}.btn{border-radius:var(--radius-md);cursor:pointer;border:none;justify-content:center;align-items:center;padding:12px 20px;font-size:1rem;font-weight:600;transition:transform .15s,background-color .2s,box-shadow .2s;display:inline-flex}.btn:active{transform:scale(.98)}.btn-primary{background-color:var(--primary-color);color:var(--white);box-shadow:0 4px 10px #ff98004d}.btn-primary:hover{background-color:var(--primary-hover)}.btn-secondary{background-color:var(--secondary-color);color:var(--white);box-shadow:0 4px 10px #4caf504d}.btn-secondary:hover{background-color:var(--secondary-hover)}.btn-outline{border:1.5px solid var(--primary-color);color:var(--primary-color);background-color:#0000;width:100%}.btn-outline:hover{background-color:#ff98001a}.hero-section{width:100%}.hero-card{border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-xl);gap:var(--spacing-xl);box-shadow:var(--shadow-md);background:linear-gradient(135deg,#fff 0%,#fff8f0 100%);flex-direction:column;display:flex}@media (width>=768px){.hero-card{padding:var(--spacing-xxl);flex-direction:row;align-items:center}}.hero-content{gap:var(--spacing-md);flex-direction:column;flex:1;display:flex}.hero-badge{color:var(--primary-color);border-radius:var(--radius-full);background-color:#ff98001f;align-self:flex-start;padding:6px 12px;font-size:.85rem;font-weight:700}.hero-title{color:var(--text-color);font-size:1.8rem;font-weight:800;line-height:1.25}@media (width>=768px){.hero-title{font-size:2.4rem}}.hero-description{color:var(--text-muted);max-width:540px;font-size:1.05rem}.hero-actions{gap:var(--spacing-md);margin-top:var(--spacing-sm);flex-direction:column;display:flex}@media (width>=480px){.hero-actions{flex-direction:row}}.hero-illustration{justify-content:center;align-items:center;display:flex}.hero-avatar-box{background-color:var(--surface-color);border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-md);border:1px solid var(--border-color);flex-direction:column;align-items:center;display:flex;position:relative}.hero-emoji{font-size:4rem;line-height:1}.hero-stat-badge{margin-top:var(--spacing-sm);background-color:var(--secondary-color);color:var(--white);border-radius:var(--radius-md);flex-direction:column;align-items:center;padding:4px 12px;display:flex}.stat-value{font-size:1rem;font-weight:800}.stat-label{font-size:.75rem}.section-title{color:var(--text-color);margin-bottom:var(--spacing-xs);font-size:1.5rem;font-weight:700}.section-subtitle{color:var(--text-muted);font-size:.95rem}.section-header{margin-bottom:var(--spacing-lg)}.quick-actions-grid{gap:var(--spacing-lg);margin-top:var(--spacing-lg);grid-template-columns:1fr;display:grid}@media (width>=600px){.quick-actions-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=900px){.quick-actions-grid{grid-template-columns:repeat(3,1fr)}}.action-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:var(--spacing-lg);gap:var(--spacing-sm);box-shadow:var(--shadow-sm);flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex}.action-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.action-icon{margin-bottom:var(--spacing-xs);font-size:2rem}.action-title{font-size:1.15rem;font-weight:600}.action-description{color:var(--text-muted);margin-bottom:var(--spacing-sm);flex:1;font-size:.9rem}.highlights-grid{gap:var(--spacing-md);grid-template-columns:1fr;display:grid}@media (width>=600px){.highlights-grid{grid-template-columns:repeat(2,1fr)}}.highlight-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:var(--spacing-lg);box-shadow:var(--shadow-sm)}.highlight-header{margin-bottom:var(--spacing-sm);justify-content:space-between;align-items:center;display:flex}.highlight-label{font-size:1rem;font-weight:600}.highlight-target{border-radius:var(--radius-sm);padding:4px 8px;font-size:.85rem;font-weight:700}.status-optimal{color:var(--secondary-color);background-color:#4caf5026}.status-info{color:var(--primary-color);background-color:#ff980026}.highlight-description{color:var(--text-muted);font-size:.9rem}.ratings-grid{gap:var(--spacing-lg);grid-template-columns:1fr;display:grid}@media (width>=600px){.ratings-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=900px){.ratings-grid{grid-template-columns:repeat(3,1fr)}}.rating-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:var(--spacing-lg);box-shadow:var(--shadow-sm)}.rating-card-header{margin-bottom:var(--spacing-xs);justify-content:space-between;align-items:center;display:flex}.rating-tag{color:#1976d2;border-radius:var(--radius-full);background-color:#e3f2fd;padding:2px 8px;font-size:.75rem;font-weight:700}.rating-stars{color:var(--text-color);font-size:.85rem;font-weight:600}.rating-brand{margin-top:var(--spacing-xs);font-size:1.1rem;font-weight:700}.rating-type{color:var(--text-muted);margin-bottom:var(--spacing-md);font-size:.85rem}.rating-metrics{padding-top:var(--spacing-sm);border-top:1px solid var(--border-color);justify-content:space-between;display:flex}.metric{flex-direction:column;display:flex}.metric-label{color:var(--text-muted);font-size:.75rem}.metric-value{font-size:.95rem;font-weight:700}.app-footer{background-color:var(--surface-color);border-top:1px solid var(--border-color);padding:var(--spacing-xl) 0;margin-top:auto}.footer-container{gap:var(--spacing-md);text-align:center;flex-direction:column;align-items:center;display:flex}@media (width>=600px){.footer-container{text-align:left;flex-direction:row;justify-content:space-between}}.footer-logo{font-size:1.1rem;font-weight:700}.footer-tagline,.footer-links{color:var(--text-muted);font-size:.85rem}.pet-tabs-nav{gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);border-bottom:2px solid var(--border-color);padding-bottom:var(--spacing-xs);display:flex}.pet-tab-btn{padding:var(--spacing-sm) var(--spacing-lg);color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm) var(--radius-sm) 0 0;background:0 0;border:none;border-bottom:3px solid #0000;font-size:1.05rem;font-weight:600;transition:all .2s}.pet-tab-btn:hover{color:var(--primary-color);background-color:#ff98000d}.pet-tab-btn.active{color:var(--primary-color);border-bottom-color:var(--primary-color);background-color:#ff98001a}.pet-panel{display:none}.pet-panel.active{animation:.25s ease-in-out fadeIn;display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.single-rating-grid{grid-template-columns:1fr;max-width:500px}.tag-dog{color:#e65100;background-color:#fff3e0}.search-modal{z-index:1000;opacity:0;pointer-events:none;justify-content:center;align-items:flex-start;width:100vw;height:100vh;padding-top:10vh;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}.search-modal:before{content:"";z-index:-1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:auto;background:#0006;width:100vw;height:100vh;position:fixed;top:0;left:0}.search-modal.active{opacity:1;pointer-events:auto}.search-modal-content{background:var(--surface-color);border-radius:var(--radius-md);z-index:1001;width:90%;max-width:600px;box-shadow:var(--shadow-lg);max-height:80vh;padding:2rem;position:relative;overflow-y:auto}.search-modal-content .modal-close-btn{cursor:pointer;color:var(--text-color);background:0 0;border:none;font-size:1.5rem;position:absolute;top:1rem;right:1rem}.search-modal-content .modal-title{text-align:center;margin-bottom:1rem}.search-input-wrapper{margin-bottom:1.5rem}.search-input-wrapper input{border:1px solid var(--border-color);border-radius:var(--radius-sm);outline:none;width:100%;padding:.75rem 1rem;font-size:1rem;transition:border-color .2s}.search-input-wrapper input:focus{border-color:var(--primary-color)}.search-results{flex-direction:column;gap:1rem;display:flex}.search-results .rating-card{box-shadow:var(--shadow-sm);margin:0}.sponsor-modal{z-index:1000;opacity:0;pointer-events:none;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}.sponsor-modal.active{opacity:1;pointer-events:auto}.sponsor-modal .modal-overlay{background:#00000080;width:100%;height:100%;position:absolute;top:0;left:0}.sponsor-modal-content{background:var(--surface-color);border-radius:var(--radius-md);text-align:center;z-index:1001;width:90%;max-width:500px;box-shadow:var(--shadow-lg);padding:2rem;position:relative}.sponsor-modal-content .modal-close-btn{cursor:pointer;color:var(--text-color);background:0 0;border:none;font-size:1.5rem;position:absolute;top:1rem;right:1rem}.sponsor-modal-content .modal-title{margin-bottom:1rem}.sponsor-modal-content .modal-text{color:var(--text-muted);margin-bottom:2rem}.sponsor-modal-content .sponsor-btn{display:inline-block}.sponsor-modal-content .modal-small-text{color:var(--text-muted);margin-top:1rem;font-size:.8rem}.view-section{animation:.25s ease-in-out fadeIn;display:block}.about-content{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:var(--spacing-lg);box-shadow:var(--shadow-sm);line-height:1.6}.about-content p{margin-bottom:var(--spacing-md)}.about-content p:last-child{margin-bottom:0}.submit-product-form{gap:var(--spacing-md);background:var(--white);max-width:800px;padding:var(--spacing-lg);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;margin:0 auto;display:flex}.form-row{gap:var(--spacing-md);flex-direction:column;display:flex}@media (width>=768px){.form-row{flex-direction:row}}.form-group{gap:var(--spacing-xs);flex-direction:column;flex:1;display:flex}.form-group label{color:var(--text-color);font-weight:500}.form-group input[type=text],.form-group input[type=file],.form-group textarea{padding:var(--spacing-sm);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-family:inherit;font-size:1rem}.form-group input:focus,.form-group textarea:focus{border-color:var(--primary-color);outline:none;box-shadow:0 0 0 3px #ff980033}.form-actions{margin-top:var(--spacing-sm);justify-content:flex-end;display:flex}.app-view{display:none}.app-view.active{animation:.25s ease-in-out fadeIn;display:block}.form-label{color:var(--text-color);margin-bottom:var(--spacing-xs);font-weight:500;display:inline-block}.form-input,.form-select{border:1px solid var(--border-color);border-radius:var(--radius-sm);background-color:var(--surface-color);outline:none;width:100%;padding:.75rem 1rem;font-family:inherit;font-size:1rem;transition:border-color .2s,box-shadow .2s}.form-input:focus,.form-select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #ff980033}.filter-chips-row{gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);flex-wrap:wrap;display:flex}.filter-chip{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-full);color:var(--text-muted);cursor:pointer;padding:8px 16px;font-size:.95rem;font-weight:500;transition:all .2s}.filter-chip:hover{color:var(--primary-color);border-color:var(--primary-color);background-color:#ff98000d}.filter-chip.active{background-color:var(--primary-color);color:var(--white);border-color:var(--primary-color);box-shadow:var(--shadow-sm)}.btn-text-link{color:var(--primary-color);cursor:pointer;font-family:inherit;font-weight:600;font-size:inherit;background:0 0;border:none;padding:0;-webkit-text-decoration:underline #0000;text-decoration:underline #0000;transition:text-decoration-color .2s}.btn-text-link:hover{-webkit-text-decoration-color:var(--primary-color);text-decoration-color:var(--primary-color)}@media (width>=768px){.mobile-bottom-nav{display:none!important}}.form-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232c3e50' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 1rem center;background-repeat:no-repeat;background-size:1em;padding-right:2.5rem}.form-input[type=file]{padding:0;line-height:1.5}.form-input[type=file]::file-selector-button{background-color:var(--primary-color);color:var(--white);border-radius:var(--radius-sm) 0 0 var(--radius-sm);cursor:pointer;border:none;margin-right:1rem;padding:.75rem 1rem;font-weight:500;transition:background-color .2s}.form-input[type=file]::file-selector-button:hover{background-color:var(--primary-hover)}.score-grade{margin-bottom:.25rem;font-size:3rem;font-weight:800;line-height:1}.grade-a{color:var(--secondary-color)}.grade-b{color:#8bc34a}.grade-c{color:var(--primary-color)}.grade-d{color:#ff5722}.grade-e{color:var(--alert-red)}.score-number-group{justify-content:center;align-items:baseline;display:flex}.score-circle{flex-direction:column;justify-content:center;align-items:center;display:flex}.product-profiles{border-top:1px solid var(--border-color);margin-top:1rem;padding-top:.5rem}.product-profile-score{justify-content:space-between;align-items:center;padding:.25rem 0;font-size:.85rem;display:flex}.profile-name{color:var(--text-muted)}.profile-grade{font-weight:600}.products-grid{gap:var(--spacing-lg);margin-top:var(--spacing-lg);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.product-card{background:var(--surface-color);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:var(--shadow-sm);border:1px solid var(--border-color);gap:var(--spacing-sm);flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex}.product-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.product-header{margin-bottom:var(--spacing-xs);justify-content:space-between;align-items:center;display:flex}.rating-tag{border-radius:var(--radius-full);background:var(--border-color);color:var(--text-color);padding:4px 8px;font-size:.85rem;font-weight:600}.rating-score{font-size:1.1rem;font-weight:700}.score-high{color:var(--secondary-color)}.product-title{color:var(--text-color);margin:0;font-size:1.25rem}.product-subtitle{color:var(--text-muted);margin-bottom:var(--spacing-sm);flex-grow:1;font-size:.9rem}.product-stats{gap:var(--spacing-xs);margin-bottom:var(--spacing-sm);flex-wrap:wrap;display:flex}.stat-pill{background-color:var(--background-color);border:1px solid var(--border-color);border-radius:var(--radius-full);color:var(--text-color);padding:4px 10px;font-size:.8rem}.product-profiles{gap:var(--spacing-xs);border-top:1px solid var(--border-color);padding-top:var(--spacing-sm);flex-direction:column;margin-top:auto;display:flex}.product-profile-score{justify-content:space-between;align-items:center;font-size:.9rem;display:flex}.profile-name{color:var(--text-color);font-weight:500}.profile-grade{border-radius:var(--radius-sm);padding:2px 6px;font-weight:600}.profile-grade.grade-a{color:#2e7d32;background:#e8f5e9}.profile-grade.grade-b{color:#1565c0;background:#e3f2fd}.profile-grade.grade-c{color:#f57f17;background:#fffde7}.profile-grade.grade-d{color:#e65100;background:#fff3e0}.profile-grade.grade-e{color:#c62828;background:#ffebee}