diff --git a/plants/templates/plants/plant_detail.html b/plants/templates/plants/plant_detail.html
index 653415c..d8b56c4 100644
--- a/plants/templates/plants/plant_detail.html
+++ b/plants/templates/plants/plant_detail.html
@@ -1,109 +1,121 @@
+{# plants/templates/plants/plant_detail.html #}
 {% extends "plants/base.html" %}
+{% load plant_extras %}
 {% block title %}{{ plant.name }} — BloomBase{% endblock %}
 {% block content %}
 
-<div class="d-flex align-items-center gap-2 mb-2">
-    <a href="{% url 'plant_list' %}" class="btn btn-sm btn-outline-secondary">←</a>
-    <h5 class="mb-0 flex-grow-1">{{ plant.name }}</h5>
-    <a href="{% url 'plant_edit' plant.pk %}" class="btn btn-sm btn-outline-secondary">✏️</a>
+<!-- Hero image -->
+<div class="relative h-[220px] overflow-hidden" id="plant-hero-container">
+  {% if plant.species and plant.species.api_image_url %}
+  <img src="{{ plant.species.api_image_url }}" alt="{{ plant.name }}" class="w-full h-full object-cover">
+  {% elif plant.thumbnail_url %}
+  <img src="{{ plant.thumbnail_url }}" alt="{{ plant.name }}" class="w-full h-full object-cover">
+  {% else %}
+  <div class="w-full h-full bg-[#D8F3DC] flex items-center justify-center text-6xl">🌿</div>
+  {% endif %}
+  <div class="absolute inset-x-0 bottom-0 h-16 bg-gradient-to-t from-white to-transparent"></div>
+  <!-- Back -->
+  <a href="{% url 'plant_list' %}" class="btn-pill absolute top-3 left-3 no-underline">← Back</a>
+  <!-- Edit -->
+  <a href="{% url 'plant_edit' plant.pk %}" class="btn-pill absolute top-3 right-3 no-underline">Edit</a>
+  <!-- Favorite (UI only) -->
+  <button class="btn-pill absolute top-3 right-16">🤍</button>
 </div>
 
-<div id="plant-hero-container">
-{% if plant.species and plant.species.api_image_url %}
-<img src="{{ plant.species.api_image_url }}" class="plant-hero rounded mb-3" alt="{{ plant.species.common_name }}">
-{% elif plant.thumbnail_url %}
-<img src="{{ plant.thumbnail_url }}" class="plant-hero rounded mb-3" alt="{{ plant.name }}">
-{% else %}
-<div class="plant-hero-placeholder rounded mb-3">🌿</div>
-{% endif %}
-</div>
+<div class="px-4 pt-3 pb-4">
 
-<div class="d-flex justify-content-between align-items-start mb-1">
-    <div>
-        <h6 class="mb-0">{{ plant.name }}</h6>
-        <div class="d-flex align-items-center gap-1">
-            {% if plant.species %}<small class="text-muted fst-italic">{{ plant.species.scientific_name }}</small>{% endif %}
-            <a href="https://www.google.com/search?q={{ plant.species.scientific_name|default:plant.name|urlencode }}" target="_blank" rel="noopener" title="Search on Google">
-                <img src="https://www.google.com/favicon.ico" width="14" height="14" style="opacity:0.7;vertical-align:middle;">
-            </a>
-        </div>
-    </div>
-    <span class="badge {% if plant.is_indoor %}bg-info{% else %}bg-success{% endif %}">
-        {% if plant.is_indoor %}Indoor{% else %}Outdoor{% endif %}
-    </span>
-</div>
+  <!-- Plant name + latin -->
+  <h1 class="font-nunito font-black text-[22px] text-[#1A1208] mb-0.5">{{ plant.name }}</h1>
+  {% if plant.species %}
+  <div class="flex items-center gap-1.5 mb-3">
+    <span class="font-nunito font-bold text-[13px] text-[#F07040] italic">{{ plant.species.scientific_name }}</span>
+    <a href="https://www.google.com/search?q={{ plant.species.scientific_name|default:plant.name|urlencode }}"
+       target="_blank" rel="noopener">
+      <img src="https://www.google.com/favicon.ico" width="13" height="13" style="opacity:0.65;vertical-align:middle;">
+    </a>
+  </div>
+  {% endif %}
 
-{% if plant.location %}<p class="text-muted small mb-2">📍 {{ plant.location.name }}</p>{% endif %}
+  {% if plant.location %}
+  <p class="font-nunito text-[11px] font-semibold text-[#B0A090] mb-3">
+    📍 {{ plant.location.name }}
+  </p>
+  {% endif %}
 
-{% if plant.watering or plant.sunlight or plant.species %}
-<div class="mb-3">
+  <!-- Care row -->
+  {% if plant.watering or plant.sunlight or plant.species %}
+  <div class="flex justify-around py-3 border-t border-b border-[#F5EDE4] mb-4">
     {% if plant.watering %}
-    <span class="care-chip" style="background:#e3f2fd; color:#1565c0;">{{ plant.get_watering_display }}</span>
-    {% elif plant.species.watering %}
-    <span class="care-chip" style="background:#e3f2fd; color:#1565c0;">💧 {{ plant.species.watering }}</span>
+    <div class="flex flex-col items-center gap-1">
+      <span class="text-xl">💧</span>
+      <span class="font-nunito font-bold text-[9px] text-[#B0A090] text-center">{{ plant.get_watering_display }}</span>
+    </div>
+    {% elif plant.species and plant.species.watering %}
+    <div class="flex flex-col items-center gap-1">
+      <span class="text-xl">💧</span>
+      <span class="font-nunito font-bold text-[9px] text-[#B0A090] text-center">{{ plant.species.watering }}</span>
+    </div>
     {% endif %}
     {% if plant.sunlight %}
-    <span class="care-chip" style="background:#fff9c4; color:#7d4a00;">{{ plant.get_sunlight_display }}</span>
-    {% elif plant.species.sunlight %}
-    <span class="care-chip" style="background:#fff9c4; color:#7d4a00;">☀️ {{ plant.species.sunlight }}</span>
-    {% endif %}
-    {% if plant.species.max_height_cm %}
-    <span class="care-chip" style="background:#f3e5f5; color:#4a148c;">📏 up to {{ plant.species.max_height_cm }} cm</span>
-    {% endif %}
-    {% if plant.species.frost_hardiness_c is not None %}
-    <span class="care-chip" style="background:#e3f2fd; color:#0d47a1;">❄️ {{ plant.species.frost_hardiness_c }}°C</span>
-    {% endif %}
-    {% if plant.species.planting_density_m2 %}
-    <span class="care-chip" style="background:#f9fbe7; color:#558b2f;">🌿 {{ plant.species.planting_density_m2 }}/m²</span>
-    {% endif %}
-    {% if plant.species.growth_rate %}
-    <span class="care-chip" style="background:#e8f5e9; color:#1b5e20;">🌱 {{ plant.species.growth_rate }}</span>
-    {% endif %}
-</div>
-{% endif %}
-{% if plant.species and plant.species.vpc_slug %}
-<div class="mb-3">
-    <form method="post" action="{% url 'vpc_species_reset' plant.species.pk %}">
-        {% csrf_token %}
-        <input type="hidden" name="next" value="{% url 'plant_detail' plant.pk %}">
-        <button type="submit" class="btn btn-sm btn-outline-secondary"
-                onclick="return confirm('Reset species data to original VPC values?')">
-            ↩ Reset to original VPC data
-        </button>
-    </form>
-</div>
-{% endif %}
-
-{% load plant_extras %}
-{% if plant.bloom_months %}
-<div class="mb-3 p-2 rounded" style="background:#d8f3dc; border-left:4px solid #52b788;">
-    <strong>🌸 Bloom</strong>
-    <div class="mt-1">{% month_strip plant.bloom_months %}</div>
-</div>
-{% endif %}
-
-{% if plant.notes %}
-<div class="card mb-3">
-    <div class="card-body py-2">
-        <small class="text-muted">{{ plant.notes|linebreaksbr }}</small>
+    <div class="flex flex-col items-center gap-1">
+      <span class="text-xl">☀️</span>
+      <span class="font-nunito font-bold text-[9px] text-[#B0A090] text-center">{{ plant.get_sunlight_display }}</span>
+    </div>
+    {% elif plant.species and plant.species.sunlight %}
+    <div class="flex flex-col items-center gap-1">
+      <span class="text-xl">☀️</span>
+      <span class="font-nunito font-bold text-[9px] text-[#B0A090] text-center">{{ plant.species.sunlight }}</span>
     </div>
-</div>
-{% endif %}
-
-{% if plant.pruning_months %}
-{% include "plants/partials/pruning_strip.html" %}
-{% endif %}
-
-<div id="photo-gallery">
-    {% include "plants/partials/photo_gallery.html" %}
-</div>
-
-<div class="d-flex flex-wrap gap-2 mt-2">
-    <a href="{% url 'plant_card' plant.pk %}" class="btn btn-sm btn-outline-secondary">🪧 Plant card</a>
-    {% if plant.card_photos.all %}
-    <a href="{% url 'crop_thumbnail' plant.pk %}" class="btn btn-sm btn-outline-secondary">✂️ Crop thumbnail</a>
     {% endif %}
-    <a href="{% url 'plant_delete' plant.pk %}" class="btn btn-sm btn-outline-danger">Delete plant</a>
-</div>
+    {% if plant.species and plant.species.frost_hardiness_c is not None %}
+    <div class="flex flex-col items-center gap-1">
+      <span class="text-xl">🌡️</span>
+      <span class="font-nunito font-bold text-[9px] text-[#B0A090] text-center">{{ plant.species.frost_hardiness_c }}°C min</span>
+    </div>
+    {% endif %}
+    {% if plant.species and plant.species.max_height_cm %}
+    <div class="flex flex-col items-center gap-1">
+      <span class="text-xl">📏</span>
+      <span class="font-nunito font-bold text-[9px] text-[#B0A090] text-center">{{ plant.species.max_height_cm }} cm</span>
+    </div>
+    {% endif %}
+  </div>
+  {% endif %}
 
+  <!-- Bloom strip -->
+  {% if plant.bloom_months %}
+  <div class="mb-4 p-3 rounded-2xl bg-[#D8F3DC]">
+    <p class="font-nunito font-bold text-[11px] text-[#1b4332] mb-1">🌸 Bloom months</p>
+    {% month_strip plant.bloom_months %}
+  </div>
+  {% endif %}
+
+  <!-- Notes -->
+  {% if plant.notes %}
+  <div class="bg-white rounded-2xl px-4 py-3 border border-[#F0E4D4] mb-4">
+    <p class="font-nunito text-[13px] text-[#6B7280]">{{ plant.notes|linebreaksbr }}</p>
+  </div>
+  {% endif %}
+
+  <!-- Pruning -->
+  {% if plant.pruning_months %}
+  {% include "plants/partials/pruning_strip.html" %}
+  {% endif %}
+
+  <!-- Photo gallery -->
+  <div id="photo-gallery" class="mb-4">
+    {% include "plants/partials/photo_gallery.html" %}
+  </div>
+
+  <!-- Action buttons -->
+  <div class="flex flex-col gap-2 mt-2">
+    <a href="{% url 'plant_edit' plant.pk %}" class="btn-bloom no-underline">Edit this plant</a>
+    <a href="{% url 'plant_card' plant.pk %}" class="btn-bloom-outline no-underline">🪧 Plant card</a>
+    <a href="{% url 'plant_delete' plant.pk %}"
+       class="font-nunito font-bold text-[13px] text-center text-[#DC2626] py-2 no-underline">
+      Delete plant
+    </a>
+  </div>
+
+</div>
 {% endblock %}
diff --git a/plants/views/plants.py b/plants/views/plants.py
index 1931250..5c793fc 100644
--- a/plants/views/plants.py
+++ b/plants/views/plants.py
@@ -42,6 +42,7 @@ def plant_detail(request, pk):
         'pruning_status': pruning_status(plant, today),
         'log_form': PruningLogForm(initial={'pruned_on': today}),
         'today': today,
+        'active_tab': 'garden',
     })