*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #f4f7f0;--color-surface: #ffffff;--color-primary: #3a7d44;--color-primary-dark: #2c5f34;--color-danger: #c0392b;--color-success: #27ae60;--color-text: #2d3436;--color-muted: #636e72;--color-border: #dfe6d5;--radius: 10px;--shadow: 0 2px 8px rgba(0, 0, 0, .08);--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh}.app{max-width:860px;margin:0 auto;padding:1.5rem 1rem 3rem}.app-header{text-align:center;margin-bottom:2rem}.app-header h1{font-size:2rem;color:var(--color-primary);letter-spacing:-.5px}.app-header p{color:var(--color-muted);margin-top:.25rem}.card{background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.25rem 1.5rem;margin-bottom:1.25rem}.section-title{font-size:1.1rem;font-weight:600;color:var(--color-primary);margin-bottom:.75rem}.zip-form{display:flex;gap:.5rem;flex-wrap:wrap}.zip-input{flex:1;min-width:140px;padding:.55rem .85rem;border:1.5px solid var(--color-border);border-radius:var(--radius);font-size:1rem;outline:none;transition:border-color .2s}.zip-input:focus{border-color:var(--color-primary)}.zip-input.invalid{border-color:var(--color-danger)}.btn{padding:.55rem 1.2rem;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius);font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s}.btn:hover:not(:disabled){background:var(--color-primary-dark)}.btn:disabled{opacity:.6;cursor:not-allowed}.error-msg{color:var(--color-danger);font-size:.875rem;margin-top:.4rem}.plant-grid{display:flex;flex-wrap:wrap;gap:.5rem}.plant-chip{padding:.35rem .85rem;border-radius:999px;border:1.5px solid var(--color-border);background:var(--color-surface);font-size:.9rem;cursor:pointer;transition:all .15s;-webkit-user-select:none;user-select:none}.plant-chip.selected{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.plant-chip:hover{border-color:var(--color-primary)}.forecast-grid{display:flex;gap:.6rem;flex-wrap:wrap}.forecast-day{flex:1;min-width:100px;text-align:center;padding:.6rem .4rem;border:1.5px solid var(--color-border);border-radius:var(--radius)}.forecast-day .day-name{font-weight:600;font-size:.85rem;color:var(--color-muted);margin-bottom:.2rem}.forecast-day .day-condition{font-size:.85rem;margin-bottom:.2rem}.forecast-day .day-temps{font-size:.9rem}.forecast-day .high{font-weight:700;color:#e67e22}.forecast-day .low{color:var(--color-muted);margin-left:.25rem}.result-card{border-left:4px solid var(--color-border)}.result-card.safe{border-left-color:var(--color-success)}.result-card.unsafe{border-left-color:var(--color-danger)}.result-card .plant-name{font-size:1rem;font-weight:700;margin-bottom:.3rem}.result-card .status-badge{display:inline-block;font-size:.8rem;font-weight:600;padding:.15rem .6rem;border-radius:999px;margin-bottom:.5rem}.result-card.safe .status-badge{background:#d5f5e3;color:#1e8449}.result-card.unsafe .status-badge{background:#fde8e8;color:var(--color-danger)}.result-card .reasons{list-style:none;font-size:.875rem;color:var(--color-muted)}.result-card .reasons li:before{content:"• ";color:var(--color-primary)}.result-card .plant-notes{font-size:.85rem;font-style:italic;color:var(--color-muted);margin-top:.5rem}.companion-list{display:flex;flex-direction:column;gap:.5rem}.companion-item{display:flex;align-items:flex-start;gap:.5rem;font-size:.875rem}.companion-badge{font-size:.75rem;font-weight:700;padding:.1rem .5rem;border-radius:999px;white-space:nowrap;margin-top:.1rem}.companion-badge.friend{background:#d5f5e3;color:#1e8449}.companion-badge.foe{background:#fde8e8;color:var(--color-danger)}.loading{text-align:center;color:var(--color-muted);padding:1rem 0}.empty-state{text-align:center;color:var(--color-muted);padding:.5rem 0;font-size:.9rem}.site-header{background:#e6f4ea;padding:1rem 1.5rem;border-bottom:2px solid #cde3d2}.navbar{display:flex;align-items:center}.brand{font-size:1.5rem;font-weight:600;color:#2f5d3a;display:flex;align-items:center;gap:.5rem}.seedling svg{display:block}main{padding:1rem}@media (max-width: 500px){.forecast-day{min-width:70px}.app-header h1{font-size:1.5rem}}