:root{--ucd-blue:#022851;--ucd-blue-2:#13639e;--ucd-gold:#ffbf00;--ink:#1f2933;--muted:#5d6b78;--line:#d7e0e7;--surface:#fff;--surface-2:#f5f8fa;--success:#286140;--shadow:0 12px 30px rgba(2,40,81,.10);--radius:16px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#eef3f6;color:var(--ink);font-family:"Helvetica Neue",Arial,sans-serif;line-height:1.45}button,input,select{font:inherit}.skip-link{position:absolute;left:-9999px;top:0}.skip-link:focus{left:12px;top:12px;z-index:999;background:#fff;padding:10px 14px;border:2px solid var(--ucd-blue)}
.app-shell{max-width:1440px;margin:0 auto;padding:24px}.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;background:linear-gradient(110deg,var(--ucd-blue),#064f86);color:#fff;padding:30px 34px;border-radius:var(--radius);border-bottom:5px solid var(--ucd-gold)}.eyebrow,.step-label{margin:0 0 4px;text-transform:uppercase;letter-spacing:.09em;font-size:.76rem;font-weight:800}.hero .eyebrow{color:#ffe59a}.hero h1{font-size:clamp(2rem,4vw,3.35rem);line-height:1.04;margin:0}.lede{max-width:780px;margin:12px 0 0;color:#e7f0f7;font-size:1.04rem}.data-note{background:#f5f8fa;border:1px solid var(--line);border-top:0;padding:12px 18px;color:#425466}.workspace{display:grid;grid-template-columns:minmax(280px,360px) 1fr;gap:20px;margin-top:20px}.filters-panel,.results-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.filters-panel{padding:20px;align-self:start;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto}.results-panel{padding:22px;min-width:0}.panel-heading,.results-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.panel-heading h2,.results-toolbar h2{margin:0;color:var(--ucd-blue)}.filter-count{white-space:nowrap;font-size:.78rem;background:#e8f1f8;color:var(--ucd-blue);padding:5px 8px;border-radius:999px;font-weight:700}.filter-group{border:0;padding:0;margin:20px 0}.filter-group label,.filter-group legend{font-weight:800;color:#213d55;display:block;margin-bottom:8px}.filter-group select,.filter-group input,.toolbar-actions select,.search-field input{width:100%;border:1px solid #9fb1bf;border-radius:8px;padding:10px 11px;background:#fff;color:var(--ink)}.filter-group select:focus,.filter-group input:focus,.toolbar-actions select:focus,.search-field input:focus{outline:3px solid rgba(255,191,0,.35);border-color:var(--ucd-blue)}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.choice{display:flex;align-items:flex-start;gap:7px;padding:8px;border:1px solid var(--line);border-radius:8px;background:#fafcfd;font-size:.9rem}.choice:has(input:checked){border-color:#5c88a8;background:#eaf4fb}.choice input{margin-top:2px;accent-color:var(--ucd-blue)}
.button{border:0;border-radius:8px;padding:10px 16px;font-weight:800;cursor:pointer}.button-secondary{background:#fff;color:var(--ucd-blue);border:2px solid #b9cad8}.hero .button-secondary{border-color:#fff}.button:hover{transform:translateY(-1px)}.full-width{width:100%}.results-summary{margin:4px 0 0;color:var(--muted)}.toolbar-actions{display:flex;gap:8px;min-width:min(420px,48%)}.search-field{flex:1}.plant-type-row{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.chip{border:1px solid #a9bbc8;background:#fff;color:var(--ucd-blue);border-radius:999px;padding:7px 12px;font-weight:750;cursor:pointer}.chip.is-active{background:var(--ucd-blue);color:#fff;border-color:var(--ucd-blue)}
.plant-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:15px}.plant-card{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#fff;display:flex;flex-direction:column;min-height:260px}.plant-card:hover{box-shadow:0 8px 20px rgba(2,40,81,.11);border-color:#aabcc8}.card-banner{background:#eef3f6;padding:10px 16px;min-height:70px;display:flex;align-items:center;justify-content:flex-start}.card-banner[hidden]{display:none}.plant-thumbnail{width:58px;height:58px;object-fit:cover;border-radius:8px;border:1px solid #c9d6df;background:#fff;display:block}.card-body{padding:16px;display:flex;flex-direction:column;gap:9px;flex:1}.card-body h3{margin:0;color:var(--ucd-blue);font-size:1.12rem}.scientific{font-family:Georgia,serif;font-style:italic;color:var(--muted);margin:0}.meta-row{display:flex;gap:6px;flex-wrap:wrap}.tag{font-size:.76rem;background:#eef3f6;border-radius:999px;padding:4px 7px;color:#3f5668}.why{font-size:.86rem;color:#405364;background:#f7fafc;padding:8px 9px;margin-top:2px}.details-button{margin-top:auto;background:none;border:0;padding:5px 0;color:#075b9a;text-align:left;font-weight:800;cursor:pointer}.details-button:hover{text-decoration:underline}.empty-state{text-align:center;padding:50px 20px;background:var(--surface-2);border-radius:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.plant-dialog{width:min(900px,calc(100vw - 24px));max-height:92vh;border:0;border-radius:16px;padding:0;box-shadow:0 24px 80px rgba(0,0,0,.28)}.plant-dialog::backdrop{background:rgba(5,20,35,.58)}.dialog-header{display:flex;justify-content:space-between;gap:20px;padding:22px 24px;border-bottom:1px solid var(--line);background:#f6f9fb;position:sticky;top:0;z-index:2}.dialog-header h2{margin:0;color:var(--ucd-blue)}.icon-button{border:0;background:#fff;border-radius:999px;width:38px;height:38px;font-size:1.7rem;cursor:pointer;color:var(--ucd-blue)}.dialog-content{padding:22px 24px}.detail-section{margin-bottom:26px}.detail-section h3{color:var(--ucd-blue);margin:0 0 8px;padding-bottom:5px;border-bottom:1px solid var(--line)}.detail-section p{margin:7px 0}.detail-list{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.match-table{width:100%;border-collapse:collapse}.match-table th,.match-table td{text-align:left;padding:9px;border-bottom:1px solid var(--line);vertical-align:top}.match-table th{width:34%;color:#3a5368}.check{color:var(--success);font-weight:900}.miss{color:#8a5d00}.external-links a{color:#075b9a;font-weight:700;text-decoration:none}.external-links a:hover{text-decoration:underline}
@media(max-width:900px){.app-shell{padding:12px}.workspace{grid-template-columns:1fr}.filters-panel{position:static;max-height:none}.results-toolbar{flex-direction:column}.toolbar-actions{min-width:0;width:100%}.hero{align-items:flex-start;flex-direction:column}.hero .button{display:none}}
@media(max-width:560px){.choice-grid{grid-template-columns:1fr}.toolbar-actions{flex-direction:column}.results-panel,.filters-panel{padding:16px}.plant-grid{grid-template-columns:1fr}.hero{padding:24px 20px}.dialog-content{padding:18px}.match-table th{width:40%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button:hover{transform:none}}

.filter-help{margin:-2px 0 8px;color:var(--muted);font-size:.82rem;line-height:1.35}


/* Expanded plant-detail profile */
.detail-section-highlight{background:#f7fafc;border:1px solid var(--line);border-radius:12px;padding:14px}
.detail-grid{display:grid;grid-template-columns:minmax(155px,220px) 1fr;gap:0;margin:0}
.detail-field{display:contents}
.detail-field dt,.detail-field dd{margin:0;padding:8px 10px;border-bottom:1px solid var(--line)}
.detail-field dt{font-weight:800;color:#3a5368;background:#f8fafb}
.detail-field dd{min-width:0;overflow-wrap:anywhere}
.detail-field a,.detail-section a{color:#075b9a;font-weight:700;text-decoration:none}
.detail-field a:hover,.detail-field a:focus,.detail-section a:hover,.detail-section a:focus{text-decoration:underline}
.compact-links{margin-top:12px}
.compact-table th{width:42%}
.detail-note{font-size:.82rem;color:var(--muted);font-style:italic;margin-top:12px}
@media(max-width:620px){
  .detail-grid{grid-template-columns:1fr}
  .detail-field{display:block;border-bottom:1px solid var(--line);padding:7px 0}
  .detail-field dt,.detail-field dd{display:block;border:0;padding:2px 0;background:transparent}
}