update

2026-07-13 10:33:42 +07:00 · 2026-07-13 10:33:42 +07:00 · 36d77a7c38
parent 90e28904fa
commit 36d77a7c38
42 changed files with 1010 additions and 46 deletions
--- a/Controllers/AuthController.cs
+++ b/Controllers/AuthController.cs
@ -0,0 +1,12 @@
+using Microsoft.AspNetCore.Mvc;
+
+namespace kehati.Controllers
+{
+    public class AuthController : Controller
+    {
+        public IActionResult Login()
+        {
+            return View();
+        }
+    }
+}
--- a/Controllers/KatalogController.cs
+++ b/Controllers/KatalogController.cs
@ -0,0 +1,218 @@
+using Microsoft.AspNetCore.Mvc;
+using kehati.Models;
+
+namespace kehati.Controllers
+{
+    public class KatalogController : Controller
+    {
+        public IActionResult Index()
+        {
+            var model = new HomeViewModel
+            {
+        
+                FeaturedLocations = new List<LokasiModel>
+                {
+                    new()
+                    {
+                        Slug = "tebet-eco-park",
+                        Name = "Tebet Eco Park"
+                    },
+                    new()
+                    {
+                        Slug = "hutan-kota-srengseng",
+                        Name = "Hutan Kota Srengseng",
+                        Image = "loc-srengseng.jpg"
+                    },
+                    new()
+                    {
+                        Slug = "mangrove-angke",
+                        Name = "Hutan Mangrove Angke"
+                    }
+                },
+
+                FeaturedSpesies = new List<SpesiesModel>
+                {
+                    new()
+                {
+                    Slug = "pohon-trembesi",
+                    Type = "flora",
+                    CommonName = "Pohon Trembesi",
+                    ScientificName = "Samanea saman",
+                    Description =
+                    "Pohon peneduh raksasa dengan tajuk lebar menyerupai payung. Sangat efektif menyerap karbon dioksida sehingga banyak ditanam di ruang publik Jakarta.",
+                    Habitat = "Tumbuh baik di dataran rendah tropis, tanah subur, sinar matahari penuh.",
+                    ConservationStatus = "Aman",
+                    Image = "sp-trembesi.jpg",
+                    LocationSlugs = new List<string>
+                    {
+                        "tebet-eco-park",
+                        "hutan-kota-gbk",
+                        "taman-menteng"
+                    }
+                },
+                new()
+                {
+                    Slug= "pohon-beringin",
+                    Type= "flora",
+                    CommonName= "Pohon Beringin",
+                    ScientificName= "Ficus benjamina",
+                    Description=
+                    "Pohon rindang dengan akar udara khas yang menjuntai. Simbol keteduhan dan sering dijumpai di taman kota serta ruang publik Jakarta.",
+                    Habitat= "Iklim tropis, tanah lembab, tahan terhadap polusi udara perkotaan.",
+                    ConservationStatus= "Aman",
+                    Image= "sp-beringin.jpg",
+                    LocationSlugs = new List<string> 
+                    {"hutan-kota-srengseng", "taman-menteng", "hutan-kota-gbk"}
+                },
+                new()
+                {
+                    Slug= "mangrove-rhizophora",
+                    Type= "flora",
+                    CommonName= "Bakau Merah",
+                    ScientificName= "Rhizophora mucronata",
+                    Description=
+                    "Tumbuhan bakau dengan akar tunjang khas. Berfungsi sebagai benteng alami pesisir Jakarta terhadap abrasi dan intrusi air laut.",
+                    Habitat= "Kawasan pesisir berlumpur, muara sungai, air payau.",
+                    ConservationStatus= "Dilindungi",
+                    Image= "sp-mangrove.jpg",
+                    LocationSlugs = new List<string> 
+                    {"muara-angke", "mangrove-pik"}
+                },
+                new()
+                {
+                    Slug= "bunga-kamboja",
+                    Type= "flora",
+                    CommonName= "Kamboja Putih",
+                    ScientificName= "Plumeria alba",
+                    Description=
+                    "Pohon hias berbunga harum dengan kelopak putih dan kuning di tengah. Populer di pekarangan dan taman kota.",
+                    Habitat= "Daerah tropis kering, tanah berdrainase baik.",
+                    ConservationStatus= "Aman",
+                    Image= "sp-kamboja.jpg",
+                    LocationSlugs = new List<string> 
+                    {"tebet-eco-park", "taman-menteng"}
+                },
+                new()
+                {
+                    Slug= "anggrek-bulan",
+                    Type= "flora",
+                    CommonName= "Anggrek Bulan",
+                    ScientificName= "Phalaenopsis amabilis",
+                    Description=
+                    "Bunga nasional Indonesia (Puspa Pesona). Berkelopak lebar putih murni, tumbuh menempel pada batang pohon.",
+                    Habitat= "Epifit pada pohon di hutan tropis lembab.",
+                    ConservationStatus= "Rentan",
+                    Image= "sp-anggrek.jpg",
+                    LocationSlugs = new List<string> 
+                    {"hutan-kota-srengseng", "tebet-eco-park"}
+                },
+                new()
+                {
+                    Slug= "bambu-kuning",
+                    Type= "flora",
+                    CommonName= "Bambu Kuning",
+                    ScientificName= "Bambusa vulgaris",
+                    Description=
+                    "Rumpun bambu berbatang kuning cerah yang tumbuh cepat. Berperan penting menyerap air tanah dan mencegah erosi.",
+                    Habitat= "Tanah lembab di tepi sungai, taman, dan hutan kota.",
+                    ConservationStatus= "Aman",
+                    Image= "sp-bambu.jpg",
+                    LocationSlugs = new List<string> 
+                    {"tebet-eco-park", "hutan-kota-srengseng"}
+                },
+                new()
+                {
+                    Slug= "burung-kutilang",
+                    Type= "fauna",
+                    CommonName= "Burung Kutilang",
+                    ScientificName= "Pycnonotus aurigaster",
+                    Description=
+                    "Burung pengicau kecil dengan tunggir kuning cerah. Salah satu burung liar paling umum di taman-taman Jakarta.",
+                    Habitat= "Taman kota, pekarangan, hutan sekunder.",
+                    ConservationStatus= "Aman",
+                    Image= "sp-kutilang.jpg",
+                    LocationSlugs = new List<string> 
+                    {"tebet-eco-park", "taman-menteng", "hutan-kota-gbk"}
+                },
+                new()
+                {
+                    Slug= "burung-madu-sriganti",
+                    Type= "fauna",
+                    CommonName= "Burung Madu Sriganti",
+                    ScientificName= "Cinnyris jugularis",
+                    Description=
+                    "Burung kecil berwarna cerah, jantan berdada hitam berkilau. Penghisap nektar bunga di taman dan hutan kota.",
+                    Habitat= "Taman berbunga, semak berbunga, pinggir hutan.",
+                    ConservationStatus= "Dilindungi",
+                    Image= "sp-madu-sriganti.jpg",
+                    LocationSlugs = new List<string> 
+                    {"tebet-eco-park", "hutan-kota-srengseng", "mangrove-pik"}
+                },
+                new()
+                {
+                    Slug= "kupu-kupu-raja",
+                    Type= "fauna",
+                    CommonName= "Kupu-kupu Raja",
+                    ScientificName= "Papilio memnon",
+                    Description=
+                    "Kupu-kupu besar berwarna hitam kebiruan dengan sayap lebar. Penyerbuk penting bagi berbagai tanaman berbunga.",
+                    Habitat= "Taman berbunga, hutan sekunder, pinggir sungai.",
+                    ConservationStatus= "Aman",
+                    Image= "sp-kupu-kupu.jpg",
+                    LocationSlugs = new List<string> 
+                    {"tebet-eco-park", "hutan-kota-srengseng"}
+                },
+                new()
+                {
+                    Slug= "biawak-air",
+                    Type= "fauna",
+                    CommonName= "Biawak Air",
+                    ScientificName= "Varanus salvator",
+                    Description=
+                    "Reptil besar semi-akuatik dengan lidah bercabang. Predator alami yang membantu mengendalikan populasi tikus di ekosistem kota.",
+                    Habitat= "Rawa, sungai, hutan mangrove.",
+                    ConservationStatus= "Dilindungi",
+                    Image= "sp-biawak.jpg",
+                    LocationSlugs = new List<string> 
+                    {"muara-angke", "mangrove-pik"}
+                },
+                new()
+                {
+                    Slug= "monyet-ekor-panjang",
+                    Type= "fauna",
+                    CommonName= "Monyet Ekor Panjang",
+                    ScientificName= "Macaca fascicularis",
+                    Description=
+                    "Primata berbulu abu-abu kecoklatan dengan ekor panjang. Hidup berkelompok di kawasan hutan yang tersisa.",
+                    Habitat= "Hutan mangrove, hutan sekunder, tepi sungai.",
+                    ConservationStatus= "Rentan",
+                    Image= "sp-monyet.jpg",
+                    LocationSlugs = new List<string> 
+                    {"muara-angke", "mangrove-pik"}
+                },
+                new()
+                {
+                    Slug= "elang-bondol",
+                    Type= "fauna",
+                    CommonName= "Elang Bondol",
+                    ScientificName= "Haliastur indus",
+                    Description=
+                    "Elang berkepala putih dengan tubuh coklat kemerahan. Maskot Provinsi DKI Jakarta dan simbol kekayaan hayati pesisir.",
+                    Habitat= "Pesisir, mangrove, muara sungai.",
+                    ConservationStatus= "Dilindungi",
+                    Image= "sp-elang-bondol.jpg",
+                    LocationSlugs = new List<string> 
+                    {"muara-angke", "mangrove-pik"}
+                },
+                }
+            };
+            return View(model);
+        }
+
+        public IActionResult Detail(string slug)
+        {
+            ViewBag.Slug = slug;
+            return View();
+        }
+    }
+}
--- a/Controllers/LokasiController.cs
+++ b/Controllers/LokasiController.cs
@ -0,0 +1,56 @@
+using Microsoft.AspNetCore.Mvc;
+using kehati.Models;
+
+namespace kehati.Controllers
+{
+    public class LokasiController : Controller
+    {
+        public IActionResult Index()
+        {
+            var model = new HomeViewModel
+            {
+                FeaturedLocations = new List<LokasiModel>
+                {
+                    new()
+                    {
+                        Slug = "tebet-eco-park",
+                        Name = "Tebet Eco Park",
+                        Region = "Jakarta Selatan",
+                        Area = "15.3 Ha",
+                        FloraCount = 45,
+                        FaunaCount = 20,
+                        Image = "loc-tebet.jpg"
+                    },
+                    new()
+                    {
+                        Slug = "hutan-kota-srengseng",
+                        Name = "Hutan Kota Srengseng",
+                        Image = "loc-srengseng.jpg",
+                        Region = "Jakarta Barat",
+                        Area = "15.3 Ha",
+                        FloraCount = 45,
+                        FaunaCount = 20
+                    },
+
+                    new()
+                    {
+                        Slug = "mangrove-angke",
+                        Name = "Hutan Mangrove Angke",
+                        Region = "Jakarta Barat",
+                        Area = "15.3 Ha",
+                        FloraCount = 45,
+                        FaunaCount = 20,
+                        Image = "loc-mangrove-pik.jpg"
+                    }
+                }
+            };
+            return View(model);
+        }
+
+        public IActionResult Detail(string slug)
+        {
+            ViewBag.Slug = slug;
+            return View();
+        }
+    }
+}
--- a/Controllers/MapController.cs
+++ b/Controllers/MapController.cs
@ -0,0 +1,62 @@
+using Microsoft.AspNetCore.Mvc;
+using kehati.Models;
+
+namespace kehati.Controllers
+{
+    public class MapController : Controller
+    {
+        public IActionResult Index()
+        {
+            var model = new HomeViewModel
+            {
+            FeaturedLocations = new List<LokasiModel>
+                {
+                    new()
+                    {
+                        Slug = "tebet-eco-park",
+                        Name = "Tebet Eco Park",
+                        Region = "Jakarta Selatan",
+                        Area = "15.3 Ha",
+                        Latitude = "-6.236993826064424",
+                        Longitude = "106.85290802883573",
+                        FloraCount = 45,
+                        FaunaCount = 20,
+                        Image = "loc-tebet.jpg"
+                    },
+                    new()
+                    {
+                        Slug = "hutan-kota-srengseng",
+                        Name = "Hutan Kota Srengseng",
+                        Image = "loc-srengseng.jpg",
+                        Region = "Jakarta Barat",
+                        Area = "15.3 Ha",
+                        Latitude = "",
+                        Longitude = "",
+                        FloraCount = 45,
+                        FaunaCount = 20
+                    },
+
+                    new()
+                    {
+                        Slug = "mangrove-angke",
+                        Name = "Hutan Mangrove Angke",
+                        Region = "Jakarta Barat",
+                        Area = "15.3 Ha",
+                        Latitude = "",
+                        Longitude = "",
+                        FloraCount = 45,
+                        FaunaCount = 20,
+                        Image = "loc-mangrove-pik.jpg"
+                    }
+                }
+            };
+            return View(model);
+        }
+
+        public IActionResult Detail(string slug)
+        {
+            ViewBag.Slug = slug;
+            return View();
+        }
+    }
+}
--- a/Controllers/TentangController.cs
+++ b/Controllers/TentangController.cs
@ -0,0 +1,12 @@
+using Microsoft.AspNetCore.Mvc;
+
+namespace kehati.Controllers
+{
+    public class TentangController : Controller
+    {
+        public IActionResult Index()
+        {
+            return View();
+        }
+    }
+}
--- a/Models/HomeViewModel.cs
+++ b/Models/HomeViewModel.cs
@ -4,8 +4,14 @@ namespace kehati.Models;

 public class HomeViewModel
 {
+    public string Query { get; set; } = "";
+    public string Type { get; set; } = "";
+    public string Status { get; set; } = "";
+    public string lokasi { get; set; } = "";
+    public string Results { get; set; } = "";
    public StatistikHomeModel Statistik { get; set; } = new();

    public List<LokasiModel> FeaturedLocations { get; set; } = new();
-    public List<SpesiesModel> FeaturedSpesies { get; set; } = new();
+    public List<SpesiesModel> FeaturedSpesies { get; set; } = new(); 
+    public List<string> ConservationStatuses { get; set; } = new(); 
 }
--- a/Models/LokasiModel.cs
+++ b/Models/LokasiModel.cs
@ -11,6 +11,8 @@ public class LokasiModel
    public string Region { get; set; } = "";

    public string Area { get; set; } = "";
+    public string Latitude { get; set; } = "";
+    public string Longitude { get; set; } = "";

    public int FloraCount { get; set; }

--- a/Views/Auth/Login.cshtml
+++ b/Views/Auth/Login.cshtml
@ -0,0 +1,4 @@
+@{
+    Layout = "_AuthLayout";
+    ViewData["Title"] = "Login";
+}
--- a/Views/Home/Index.cshtml
+++ b/Views/Home/Index.cshtml
@ -1,5 +1,5 @@
@{
-    ViewData["Title"] = "Home Page";
+    ViewData["Title"] = "Beranda";
    var statusColor = new Dictionary<string, string>
    {
        { "Aman", "bg-primary/10 text-primary border-primary/20" },
@ -44,13 +44,13 @@
            </p>
            <!-- Button -->
            <div class="mt-8 flex flex-wrap gap-3">
-                <a asp-controller="Lokasi"
+                <a asp-controller="lokasi"
                   asp-action="Index"
                   class="inline-flex items-center gap-2 rounded-lg bg-primary px-5 py-3 text-sm font-medium text-primary-foreground shadow-sm transition-all hover:bg-primary/90 hover:shadow-md">
                    Jelajahi Lokasi
                    <i data-lucide="arrow-right" class="h-4 w-4"></i>
                </a>
-                <a asp-controller="Katalog"
+                <a asp-controller="katalog"
                   asp-action="Index"
                   class="inline-flex items-center gap-2 rounded-lg border border-border bg-background/80 px-5 py-3 text-sm font-medium text-foreground backdrop-blur transition-colors hover:bg-secondary">
                    Lihat Katalog
--- a/Views/Katalog/Detail.cshtml
+++ b/Views/Katalog/Detail.cshtml
--- a/Views/Katalog/Index.cshtml
+++ b/Views/Katalog/Index.cshtml
@ -0,0 +1,130 @@
+@{
+    ViewData["Title"] = "Katalog";
+    var statusColor = new Dictionary<string, string>
+    {
+        { "Aman", "bg-primary/10 text-primary border-primary/20" },
+        { "Rentan", "bg-amber-100 text-amber-800 border-amber-200" },
+        { "Terancam", "bg-orange-100 text-orange-800 border-orange-200" },
+        { "Kritis", "bg-red-100 text-red-800 border-red-200" },
+        { "Dilindungi", "bg-emerald-100 text-emerald-800 border-emerald-200" }
+    };
+}
+
+<div class="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
+    <div class="max-w-2xl">
+        <div class="text-xs font-medium uppercase tracking-widest text-primary">
+            Katalog
+        </div>
+        <h1 class="mt-3 font-serif text-5xl leading-tight text-foreground">
+            Flora &amp; Fauna Jakarta
+        </h1>
+        <p class="mt-4 text-lg text-muted-foreground">
+            Telusuri spesies yang terdokumentasi di kawasan konservasi Jakarta.
+        </p>
+    </div>
+    <!-- Filter -->
+    <form method="get" asp-action="Index">
+        <div class="mt-10 rounded-2xl border border-border bg-card p-4 sm:p-5">
+            <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
+                <input
+                    type="text"
+                    name="query"
+                    value="@Model.Query"
+                    placeholder="Cari nama atau nama ilmiah..."
+                    class="w-full rounded-lg border border-input bg-background px-3 py-2" />
+
+                <select name="type" class="w-full rounded-lg border border-input bg-background px-3 py-2">
+                    <option value="all">Semua Jenis</option>
+                    <option value="flora" selected="@(Model.Type=="flora")">Flora</option>
+                    <option value="fauna" selected="@(Model.Type=="fauna")">Fauna</option>
+                </select>
+                <select name="status" class="w-full rounded-lg border border-input bg-background px-3 py-2">
+                <option value="all" selected="@(Model.Status == "all")">Semua Status</option>
+                <option value="Aman" selected="@(Model.Status == "Aman")">Aman</option>
+                <option value="Rentan" selected="@(Model.Status == "Rentan")">Rentan</option>
+                <option value="Terancam" selected="@(Model.Status == "Terancam")">Terancam</option>
+                <option value="Kritis" selected="@(Model.Status == "Kritis")">Kritis</option>
+                <option value="Dilindungi" selected="@(Model.Status == "Dilindungi")">Dilindungi</option>
+            </select>
+                <select name="lokasi" class="w-full rounded-lg border border-input bg-background px-3 py-2">
+                    <option value="all">Semua Lokasi</option>
+                    @foreach(LokasiModel loc in Model.FeaturedLocations)
+                    {
+                        <option value="@loc.Slug"
+                                selected="@(Model.lokasi==loc.Slug)">
+                            @loc.Name
+                        </option>
+                    }
+                </select>
+            </div>
+            <div class="mt-4">
+                <button type="submit" class="rounded-lg bg-primary px-5 py-2 text-primary-foreground">Cari</button>
+            </div>
+        </div>
+    </form>
+    <div class="mt-6 text-sm text-muted-foreground">
+        @Model.FeaturedSpesies.Count spesies ditemukan
+    </div>
+    @if(Model.FeaturedSpesies.Count == 0)
+    {
+        <div class="mt-16 rounded-2xl border border-dashed border-border p-12 text-center">
+            <p class="text-muted-foreground">
+                Tidak ada spesies yang cocok dengan filter Anda.
+            </p>
+        </div>
+    }
+    else
+    {
+        <div class="mt-6 grid gap-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
+            @foreach(var s in Model.FeaturedSpesies)
+            {
+                <a asp-controller="katalog"
+            asp-action="detail"
+            asp-route-slug="@s.Slug"
+            class="group block overflow-hidden rounded-2xl border border-border bg-card transition-all hover:-translate-y-1 hover:shadow-lg">
+                <!-- Image -->
+                <div class="relative aspect-[4/3] overflow-hidden bg-muted">
+                    <img src="~/images/@s.Image"
+                        alt="@s.CommonName"
+                        loading="lazy"
+                        asp-append-version="true"
+                        class="h-full w-full object-cover transition-transform duration-500 group-hover:scale-105" />
+
+                    <!-- Type Badge -->
+                    <div class="absolute left-3 top-3 flex items-center gap-1.5 rounded-full bg-background/90 px-2.5 py-1 text-[11px] font-medium capitalize backdrop-blur">
+                        @if(s.Type == "Flora")
+                        {
+                            <i data-lucide="leaf" class="h-3 w-3"></i>
+                        }
+                        else
+                        {
+                            <i data-lucide="bird" class="h-3 w-3"></i>
+                        }
+                        @s.Type
+                    </div>
+                </div>
+                <!-- Content -->
+                <div class="p-4">
+                    <div class="flex items-start justify-between gap-2">
+                        <h3 class="font-serif text-lg leading-tight text-foreground">
+                            @s.CommonName
+                        </h3>
+                    </div>
+                    <p class="mt-0.5 text-xs italic text-muted-foreground">
+                        @s.ScientificName
+                    </p>
+                    <!-- Status Badge -->
+                    <div class="mt-3">
+                        <span class="inline-flex items-center rounded-md border px-2.5 py-1 text-xs font-medium
+                            @(statusColor.ContainsKey(s.ConservationStatus)
+                                ? statusColor[s.ConservationStatus]
+                                : "")">
+                            @s.ConservationStatus
+                        </span>
+                    </div>
+                </div>
+            </a>
+            }
+        </div>
+    }
+</div>
--- a/Views/Lokasi/Detail.cshtml
+++ b/Views/Lokasi/Detail.cshtml
@ -0,0 +1,3 @@
+@{
+    ViewData["Title"] = "Lokasi Detail";
+}
--- a/Views/Lokasi/Index.cshtml
+++ b/Views/Lokasi/Index.cshtml
@ -0,0 +1,66 @@
+@{
+    ViewData["Title"] = "Lokasi";
+}
+
+<section class="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
+    <div class="max-w-2xl">
+        <div class="text-xs font-medium uppercase tracking-widest text-primary">
+          Lokasi Konservasi
+        </div>
+        <h1 class="mt-3 font-serif text-5xl leading-tight text-foreground">
+          Habitat yang kami jaga
+        </h1>
+        <p class="mt-4 text-lg text-muted-foreground">
+          Ruang hijau, hutan kota, dan kawasan mangrove yang menjadi rumah bagi flora
+          dan fauna Jakarta.
+        </p>
+    </div>
+    <div class="mt-8 grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+        @foreach(LokasiModel loc in Model.FeaturedLocations)
+        {
+            <a asp-controller="lokasi"
+                asp-action="detail"
+                asp-route-slug="@loc.Slug"
+                class="group block overflow-hidden rounded-2xl border border-border bg-card transition-all hover:-translate-y-1 hover:shadow-lg">
+                    <!-- Image -->
+                    <div class="relative aspect-[16/10] overflow-hidden bg-muted">
+                        <img src="~/images/@loc.Image"
+                            alt="@loc.Name"
+                            loading="lazy"
+                            asp-append-version="true"
+                            class="h-full w-full object-cover transition-transform duration-500 group-hover:scale-105" />
+                        <!-- Gradient -->
+                        <div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/10 to-transparent"></div>
+                        <!-- Overlay Text -->
+                        <div class="absolute inset-x-0 bottom-0 p-4 text-white">
+                            <div class="flex items-center gap-1.5 text-[11px] uppercase tracking-wider text-white/80">
+                                <i data-lucide="map-pin" class="h-3 w-3"></i>
+                                @loc.Region
+                            </div>
+                            <h3 class="mt-1 font-serif text-xl leading-tight">
+                                @loc.Name
+                            </h3>
+                        </div>
+                    </div>
+                    <!-- Footer Card -->
+                    <div class="flex items-center justify-between p-4 text-sm">
+                        <span class="text-muted-foreground">
+                            @loc.Area
+                        </span>
+                        <div class="flex gap-3 text-foreground">
+                            <span class="flex items-center gap-1">
+                                <i data-lucide="leaf"
+                                class="h-4 w-4 text-primary"></i>
+                                @loc.FloraCount Flora
+                            </span>
+                            <span class="flex items-center gap-1">
+                                <i data-lucide="bird"
+                                class="h-4 w-4 text-primary"></i>
+                                @loc.FaunaCount Fauna
+                            </span>
+                        </div>
+                    </div>
+                </a>
+        }
+    </div>
+</section>
--- a/Views/Map/Index.cshtml
+++ b/Views/Map/Index.cshtml
@ -0,0 +1,79 @@
+@{
+    ViewData["Title"] = "Map";
+}
+
+<div class="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
+
+    <div class="max-w-2xl">
+
+        <div class="text-xs font-medium uppercase tracking-widest text-primary">
+            Peta Interaktif
+        </div>
+
+        <h1 class="mt-3 font-serif text-5xl leading-tight text-foreground">
+            Sebaran Lokasi Konservasi
+        </h1>
+
+        <p class="mt-4 text-lg text-muted-foreground">
+            Titik-titik hijau di peta Jakarta. Klik setiap penanda untuk melihat detail lokasi.
+        </p>
+
+    </div>
+
+
+    <!-- Leaflet -->
+    <div class="mt-10 overflow-hidden rounded-2xl border border-border shadow-sm">
+
+        <div id="map" class="h-[600px] w-full"></div>
+
+    </div>
+
+
+    <!-- Daftar Lokasi -->
+    <div class="mt-10 grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
+
+        @foreach(LokasiModel loc in Model.FeaturedLocations)
+        {
+            <div class="rounded-xl border border-border bg-card p-4">
+
+                <div class="font-serif text-lg text-foreground">
+                    @loc.Name
+                </div>
+
+                <div class="mt-1 text-xs text-muted-foreground">
+                    @loc.Region · @loc.FloraCount spesies terdokumentasi
+                </div>
+
+            </div>
+        }
+    </div>
+</div>
+
+@section Scripts{
+
+<script>
+
+    var map = L.map('map').setView([-6.2088,106.8456],11);
+
+    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{
+        attribution:'© OpenStreetMap'
+    }).addTo(map);
+
+    @foreach(LokasiModel l in Model.FeaturedLocations)
+    {
+        <text>
+
+        L.marker([@l.Latitude,@l.Longitude])
+            .addTo(map)
+            .bindPopup(`
+                <strong>@l.Name - @l.Region</strong><br>
+                @l.FloraCount Flora terdokumentasi <br>
+                @l.FaunaCount Fauna terdokumentasi
+            `);
+
+        </text>
+    }
+
+</script>
+
+}
--- a/Views/Shared/_AuthLayout.cshtml
+++ b/Views/Shared/_AuthLayout.cshtml
@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>@ViewData["Title"] - Kehati</title>
+    <meta property="og:description" content="Jelajahi flora, fauna, dan lokasi konservasi di Jakarta bersama Dinas Lingkungan Hidup." />
+
+    <meta property="og:type" content="website" />
+
+    <meta property="og:site_name" content="Kehati Jakarta" />
+
+    <link rel="shortcut icon" href="https://adiwiyata.dinaslhdki.id/assets/logo-dinas.ico" type="image/x-icon" />
+
+    <!-- Twitter -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <script type="importmap"></script>
+    <link rel="stylesheet" href="~/css/app.css" />
+
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+
+    <link href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
+</head>
+<body>
+    @{
+        var currentPath = Context.Request.Path.Value?.ToLower();
+    }
+
+    @RenderBody()
+   
+    <script src="~/lib/jquery/dist/jquery.min.js"></script>
+    <script src="~/js/site.js" asp-append-version="true"></script>
+    <script src="https://unpkg.com/lucide@latest"></script>
+    <script>
+        const btn = document.getElementById('menuButton');
+        const menu = document.getElementById('mobileMenu');
+        const icon = document.getElementById('menuIcon');
+
+        btn.addEventListener('click', () => {
+
+            menu.classList.toggle('hidden');
+
+            if (menu.classList.contains('hidden')) {
+                icon.setAttribute('data-lucide', 'menu');
+            } else {
+                icon.setAttribute('data-lucide', 'x');
+            }
+
+            lucide.createIcons();
+        });
+
+        lucide.createIcons();
+    </script>
+    @await RenderSectionAsync("Scripts", required: false)
+</body>
+</html>
--- a/Views/Shared/_Layout.cshtml
+++ b/Views/Shared/_Layout.cshtml
@ -3,7 +3,7 @@
 <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>@ViewData["Title"] - kehati</title>
+    <title>@ViewData["Title"] - Kehati</title>
    <meta property="og:description" content="Jelajahi flora, fauna, dan lokasi konservasi di Jakarta bersama Dinas Lingkungan Hidup." />

    <meta property="og:type" content="website" />
@ -13,6 +13,7 @@
    <!-- Twitter -->
    <meta name="twitter:card" content="summary_large_image" />
    <script type="importmap"></script>
+    <link rel="shortcut icon" href="https://adiwiyata.dinaslhdki.id/assets/logo-dinas.ico" type="image/x-icon" />
    <link rel="stylesheet" href="~/css/app.css" />

    <link rel="preconnect" href="https://fonts.googleapis.com">
@ -34,20 +35,20 @@
            asp-action="Index"
            class="group flex items-center gap-2.5">

-                <span class="flex h-9 w-9 items-center justify-center rounded-lg bg-primary text-primary-foreground shadow-sm transition-transform group-hover:scale-105">
+                <span class="flex h-9 w-9 items-center justify-center rounded-lg text-primary-foreground shadow-sm transition-transform group-hover:scale-105">

                    <!-- Lucide Leaf -->
-                    <i data-lucide="leaf" class="h-5 w-5"></i>
+                    <img src="https://adiwiyata.dinaslhdki.id/assets/logo-dinas.ico" alt="">

                </span>

                <span class="flex flex-col leading-tight">
                    <span class="font-serif text-base font-semibold text-foreground">
-                        Kehati Jakarta
+                        Keanekaragaman Hayati
                    </span>

                    <span class="text-[10px] uppercase tracking-widest text-muted-foreground">
-                        Dinas Lingkungan Hidup
+                        Dinas Lingkungan Hidup Provinsi DKI Jakarta
                    </span>
                </span>
            </a>
@ -61,19 +62,25 @@
                    Beranda
                </a>

-                <a asp-controller="Lokasi"
+                <a asp-controller="lokasi"
                asp-action="Index"
                class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath != null && currentPath.StartsWith("/lokasi") ? "bg-secondary text-foreground" : "text-muted-foreground")">
                    Lokasi
                </a>

-                <a asp-controller="Katalog"
+                <a asp-controller="katalog"
                asp-action="Index"
                class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath != null && currentPath.StartsWith("/katalog") ? "bg-secondary text-foreground" : "text-muted-foreground")">
                    Katalog
                </a>

-                <a asp-controller="Tentang"
+                <a asp-controller="map"
+                asp-action="Index"
+                class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath != null && currentPath.StartsWith("/katalog") ? "bg-secondary text-foreground" : "text-muted-foreground")">
+                    Peta
+                </a>
+
+                <a asp-controller="tentang"
                asp-action="Index"
                class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath != null && currentPath.StartsWith("/tentang") ? "bg-secondary text-foreground" : "text-muted-foreground")">
                    Tentang
@ -135,14 +142,14 @@
                <div>
                    <div class="flex items-center gap-2.5">

-                        <span class="flex h-9 w-9 items-center justify-center rounded-lg bg-primary text-primary-foreground">
+                        <span class="flex h-9 w-9 items-center justify-center bg-white rounded-lg text-primary-foreground">

-                            <i data-lucide="leaf" class="h-5 w-5"></i>
+                            <img src="https://adiwiyata.dinaslhdki.id/assets/logo-dinas.ico" alt="">

                        </span>

                        <span class="font-serif text-lg font-semibold">
-                            Kehati Jakarta
+                            Keanekaragaman Hayati
                        </span>

                    </div>
@ -173,7 +180,7 @@
                        </li>

                        <li>
-                            <a asp-controller="Lokasi"
+                            <a asp-controller="lokasi"
                            asp-action="Index"
                            class="hover:text-foreground">
                                Lokasi
@ -181,7 +188,7 @@
                        </li>

                        <li>
-                            <a asp-controller="Katalog"
+                            <a asp-controller="katalog"
                            asp-action="Index"
                            class="hover:text-foreground">
                                Katalog
@ -225,7 +232,7 @@
            <div class="mt-10 border-t border-border/60 pt-6 text-xs text-muted-foreground">

                © @DateTime.Now.Year
-                Dinas Lingkungan Hidup DKI Jakarta.
+                Dinas Lingkungan Hidup Provinsi DKI Jakarta.
                Seluruh hak cipta dilindungi.

            </div>
--- a/Views/Tentang/Index.cshtml
+++ b/Views/Tentang/Index.cshtml
@ -0,0 +1,98 @@
+@{
+    ViewData["Title"] = "Tentang";
+}
+
+<div class="mx-auto max-w-5xl px-4 py-20 sm:px-6 lg:px-8">
+    <div class="max-w-2xl">
+        <div class="text-xs font-medium uppercase tracking-widest text-primary">
+            Tentang Kami
+        </div>
+        <h1 class="mt-3 font-serif text-5xl leading-tight text-foreground">
+            Dinas Lingkungan Hidup Provinsi DKI Jakarta
+        </h1>
+    </div>
+    <div class="mt-10 space-y-6 text-lg leading-relaxed text-muted-foreground">
+        <p>
+            Portal <em class="text-foreground">Kehati Jakarta</em> adalah inisiatif
+            Dinas Lingkungan Hidup Provinsi DKI Jakarta untuk mendokumentasikan
+            keanekaragaman hayati ibu kota — flora, fauna, dan kawasan konservasi yang
+            menjadi rumah bagi mereka.
+        </p>
+        <p>
+            Jakarta bukan hanya kota metropolitan. Di sela-sela gedung tinggi dan
+            padatnya lalu lintas, terdapat taman kota, hutan kota, dan hutan mangrove
+            yang menjadi habitat penting bagi ratusan spesies. Portal ini dirancang agar
+            warga dapat mengenal, mempelajari, dan ikut menjaga warisan alam Jakarta.
+        </p>
+    </div>
+    <!-- Pillars -->
+    <div class="mt-16 grid gap-5 sm:grid-cols-2">
+        <div class="rounded-2xl border border-border bg-card p-6">
+            <span class="flex h-11 w-11 items-center justify-center rounded-lg bg-primary/10 text-primary">
+                <i data-lucide="trees" class="h-5 w-5"></i>
+            </span>
+            <h3 class="mt-4 font-serif text-xl text-foreground">
+                Ruang Hijau
+            </h3>
+            <p class="mt-2 text-sm leading-relaxed text-muted-foreground">
+                Melestarikan taman kota dan hutan kota sebagai paru-paru Jakarta.
+            </p>
+        </div>
+        <div class="rounded-2xl border border-border bg-card p-6">
+            <span class="flex h-11 w-11 items-center justify-center rounded-lg bg-primary/10 text-primary">
+                <i data-lucide="fish" class="h-5 w-5"></i>
+            </span>
+            <h3 class="mt-4 font-serif text-xl text-foreground">
+                Mangrove &amp; Pesisir
+            </h3>
+            <p class="mt-2 text-sm leading-relaxed text-muted-foreground">
+                Menjaga kawasan mangrove sebagai benteng alami pesisir utara Jakarta.
+            </p>
+        </div>
+        <div class="rounded-2xl border border-border bg-card p-6">
+            <span class="flex h-11 w-11 items-center justify-center rounded-lg bg-primary/10 text-primary">
+                <i data-lucide="shield-check" class="h-5 w-5"></i>
+            </span>
+            <h3 class="mt-4 font-serif text-xl text-foreground">
+                Konservasi Spesies
+            </h3>
+            <p class="mt-2 text-sm leading-relaxed text-muted-foreground">
+                Mendokumentasikan dan melindungi flora dan fauna khas Jakarta.
+            </p>
+        </div>
+        <div class="rounded-2xl border border-border bg-card p-6">
+            <span class="flex h-11 w-11 items-center justify-center rounded-lg bg-primary/10 text-primary">
+                <i data-lucide="leaf" class="h-5 w-5"></i>
+            </span>
+            <h3 class="mt-4 font-serif text-xl text-foreground">
+                Edukasi Publik
+            </h3>
+            <p class="mt-2 text-sm leading-relaxed text-muted-foreground">
+                Membangun kesadaran warga akan pentingnya keanekaragaman hayati.
+            </p>
+        </div>
+    </div>
+    <!-- Contact -->
+    <div class="mt-16 rounded-2xl border border-primary/20 bg-primary/5 p-8 sm:p-10">
+        <h2 class="font-serif text-2xl text-foreground">
+            Hubungi Kami
+        </h2>
+        <div class="mt-4 space-y-2 text-sm text-muted-foreground">
+            <div>Dinas Lingkungan Hidup Provinsi DKI Jakarta</div>
+            <div>
+                Jl. Mandala V No.67, Cililitan, Jakarta Timur
+            </div>
+            <div>
+                Situs:
+                <a href="https://lingkunganhidup.jakarta.go.id"
+                   target="_blank"
+                   class="text-primary hover:underline">
+                    lingkunganhidup.jakarta.go.id
+                </a>
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
--- a/bin/Debug/net9.0/kehati.dll
+++ b/bin/Debug/net9.0/kehati.dll
--- a/bin/Debug/net9.0/kehati.pdb
+++ b/bin/Debug/net9.0/kehati.pdb
--- a/bin/Debug/net9.0/kehati.staticwebassets.endpoints.json
+++ b/bin/Debug/net9.0/kehati.staticwebassets.endpoints.json
--- a/bin/Debug/net9.0/kehati.staticwebassets.runtime.json
+++ b/bin/Debug/net9.0/kehati.staticwebassets.runtime.json
--- a/obj/Debug/net9.0/compressed/nskz5oaabv-io8bf1bpex.gz
+++ b/obj/Debug/net9.0/compressed/nskz5oaabv-io8bf1bpex.gz
--- a/obj/Debug/net9.0/compressed/nskz5oaabv-rpkmhdruhm.gz
+++ b/obj/Debug/net9.0/compressed/nskz5oaabv-rpkmhdruhm.gz
--- a/obj/Debug/net9.0/kehati.AssemblyInfo.cs
+++ b/obj/Debug/net9.0/kehati.AssemblyInfo.cs
@ -13,7 +13,7 @@ using System.Reflection;
 [assembly: System.Reflection.AssemblyCompanyAttribute("kehati")]
 [assembly: System.Reflection.AssemblyConfigurationAttribute("Debug")]
 [assembly: System.Reflection.AssemblyFileVersionAttribute("1.0.0.0")]
-[assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0")]
+[assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0+90e28904fae88ecb9ed4f0f1220d37650387567d")]
 [assembly: System.Reflection.AssemblyProductAttribute("kehati")]
 [assembly: System.Reflection.AssemblyTitleAttribute("kehati")]
 [assembly: System.Reflection.AssemblyVersionAttribute("1.0.0.0")]
--- a/obj/Debug/net9.0/kehati.AssemblyInfoInputs.cache
+++ b/obj/Debug/net9.0/kehati.AssemblyInfoInputs.cache
@ -1 +1 @@
-8c2ca9d0f4033134cebdb3c6e24dce4ae0701b7116b925b3e3b2d91b02031149
+9c01b1841f9a1c818d0dd43165fccf462e7f9dcfc3e798c4f8042450d4e2f399
--- a/obj/Debug/net9.0/kehati.GeneratedMSBuildEditorConfig.editorconfig
+++ b/obj/Debug/net9.0/kehati.GeneratedMSBuildEditorConfig.editorconfig
@ -20,6 +20,10 @@ build_property._RazorSourceGeneratorDebug =
 build_property.EffectiveAnalysisLevelStyle = 9.0
 build_property.EnableCodeStyleSeverity = 

+[/Applications/MAMP/htdocs/kehati/Views/Auth/Login.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvQXV0aC9Mb2dpbi5jc2h0bWw=
+build_metadata.AdditionalFiles.CssScope = 
+
 [/Applications/MAMP/htdocs/kehati/Views/Home/Index.cshtml]
 build_metadata.AdditionalFiles.TargetPath = Vmlld3MvSG9tZS9JbmRleC5jc2h0bWw=
 build_metadata.AdditionalFiles.CssScope = 
@ -28,14 +32,42 @@ build_metadata.AdditionalFiles.CssScope =
 build_metadata.AdditionalFiles.TargetPath = Vmlld3MvSG9tZS9Qcml2YWN5LmNzaHRtbA==
 build_metadata.AdditionalFiles.CssScope = 

+[/Applications/MAMP/htdocs/kehati/Views/Katalog/Detail.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvS2F0YWxvZy9EZXRhaWwuY3NodG1s
+build_metadata.AdditionalFiles.CssScope = 
+
+[/Applications/MAMP/htdocs/kehati/Views/Katalog/Index.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvS2F0YWxvZy9JbmRleC5jc2h0bWw=
+build_metadata.AdditionalFiles.CssScope = 
+
+[/Applications/MAMP/htdocs/kehati/Views/Lokasi/Detail.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvTG9rYXNpL0RldGFpbC5jc2h0bWw=
+build_metadata.AdditionalFiles.CssScope = 
+
+[/Applications/MAMP/htdocs/kehati/Views/Lokasi/Index.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvTG9rYXNpL0luZGV4LmNzaHRtbA==
+build_metadata.AdditionalFiles.CssScope = 
+
+[/Applications/MAMP/htdocs/kehati/Views/Map/Index.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvTWFwL0luZGV4LmNzaHRtbA==
+build_metadata.AdditionalFiles.CssScope = 
+
 [/Applications/MAMP/htdocs/kehati/Views/Shared/Error.cshtml]
 build_metadata.AdditionalFiles.TargetPath = Vmlld3MvU2hhcmVkL0Vycm9yLmNzaHRtbA==
 build_metadata.AdditionalFiles.CssScope = 

+[/Applications/MAMP/htdocs/kehati/Views/Shared/_AuthLayout.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvU2hhcmVkL19BdXRoTGF5b3V0LmNzaHRtbA==
+build_metadata.AdditionalFiles.CssScope = 
+
 [/Applications/MAMP/htdocs/kehati/Views/Shared/_ValidationScriptsPartial.cshtml]
 build_metadata.AdditionalFiles.TargetPath = Vmlld3MvU2hhcmVkL19WYWxpZGF0aW9uU2NyaXB0c1BhcnRpYWwuY3NodG1s
 build_metadata.AdditionalFiles.CssScope = 

+[/Applications/MAMP/htdocs/kehati/Views/Tentang/Index.cshtml]
+build_metadata.AdditionalFiles.TargetPath = Vmlld3MvVGVudGFuZy9JbmRleC5jc2h0bWw=
+build_metadata.AdditionalFiles.CssScope = 
+
 [/Applications/MAMP/htdocs/kehati/Views/_ViewImports.cshtml]
 build_metadata.AdditionalFiles.TargetPath = Vmlld3MvX1ZpZXdJbXBvcnRzLmNzaHRtbA==
 build_metadata.AdditionalFiles.CssScope = 
--- a/obj/Debug/net9.0/kehati.csproj.CoreCompileInputs.cache
+++ b/obj/Debug/net9.0/kehati.csproj.CoreCompileInputs.cache
@ -1 +1 @@
-a003b95dd1f3563a60ee91a40c0811b0d691a85a92edb5a20ab76b60b34d7d40
+7e88f4e788197c1f8780e9681e26deefd2761c562b98a36076d2f0ebb36b12ae
--- a/obj/Debug/net9.0/kehati.csproj.FileListAbsolute.txt
+++ b/obj/Debug/net9.0/kehati.csproj.FileListAbsolute.txt
@ -96,4 +96,4 @@
 /Applications/MAMP/htdocs/kehati/obj/Debug/net9.0/ref/kehati.dll
 /Applications/MAMP/htdocs/kehati/bin/Debug/net9.0/package-lock.json
 /Applications/MAMP/htdocs/kehati/bin/Debug/net9.0/package.json
-/Applications/MAMP/htdocs/kehati/obj/Debug/net9.0/compressed/nskz5oaabv-io8bf1bpex.gz
+/Applications/MAMP/htdocs/kehati/obj/Debug/net9.0/compressed/nskz5oaabv-rpkmhdruhm.gz
--- a/obj/Debug/net9.0/kehati.dll
+++ b/obj/Debug/net9.0/kehati.dll
--- a/obj/Debug/net9.0/kehati.pdb
+++ b/obj/Debug/net9.0/kehati.pdb
--- a/obj/Debug/net9.0/rbcswa.dswa.cache.json
+++ b/obj/Debug/net9.0/rbcswa.dswa.cache.json
--- a/obj/Debug/net9.0/ref/kehati.dll
+++ b/obj/Debug/net9.0/ref/kehati.dll
--- a/obj/Debug/net9.0/refint/kehati.dll
+++ b/obj/Debug/net9.0/refint/kehati.dll
--- a/obj/Debug/net9.0/rjimswa.dswa.cache.json
+++ b/obj/Debug/net9.0/rjimswa.dswa.cache.json
@ -1 +1 @@
-{"GlobalPropertiesHash":"hc8FL4d4SDyJq22ZKuiHZVVsIHQC48YE/mA5pBHYKc4=","FingerprintPatternsHash":"8ZRc1sGeVrPBx4lD717BgRaQekyh78QKV9SKsdt638U=","PropertyOverridesHash":"R7Rea/YQmcweqCbKffD9oUelggfpJQX85r65aYZsas0=","InputHashes":["w16VN9xOimoxck1LjBNXWd9fHMNU3UnlFI\u002B\u002ByZnoFg0=","VOxc8xcqWt6gAM\u002BRuyfRLL1iQY9qPYh4n8cvKjwI3NY=","Sncp4ww/tjimD30ejpDv5D5eCiY\u002BGNCBHG31XvywcgE=","RSbekUJC7incuVtr7C0tXRzZN4BZamYDVsEZmrfQMcY=","0dj\u002B7dC25IeuLKXvwnTzfQVy\u002BUdHnl40sHhE/lKWrRI=","KPTC6joZ0rLn0eml9/Lsh6v1w6OotgKIxbWPkQPSc2U=","oc5dZJn7YA7RsQ0gtAnGAh7rgEphv3dYfFRixIhMKuU=","IBx1Zpi0iRpuwQy5fUr\u002B0BIjRN/f7k\u002BLtsRCoyIqdKg=","x60hTcC5q95RUcHEJci6kZJX\u002BOP5ZncNTZnLKMrK9TQ=","NQukUql2iNTO4MQCyXa8T8bDU1wDElRnV\u002BBc2yCjEHg=","MgtQemV1N1h3/pFRW/IBNT4EgLJYsuxU0zbAcfbRCb4=","Goe41XQAQHCAcUIB4rTr07EWxMhW4VLC35VQ3i8zogk=","8bEfz8MdGCT\u002BUqVKCJhjT0KyMmRaMYgY/zLLZ1asfpE=","Ibz6Ix07csPbM7Pw2WcZZH0awAHeeZ0osg23I/UHwso=","icl4Xuqd3wVKdyQVGN6K0RJuiPUiZ1J3ZMQUAoAzfT0=","dweympdBNxv56b5xEWZUlkihih0FcF9WdEhWCjq2cXc=","fiFS/KvqSehFNqqcPmIkVbUMcMmBAjue0bCe3g32ZYs=","T3X1M\u002BUddK1SoFQOwNXuQKnudpv8ohop7rTlXDRkn4A=","QDGCJ/H0sJVm29CRqaE0VjtfDzWSx48qBmGqriGN89I=","WWNvV\u002BI7oSnu9ecmCS0Mck2eCGJvRs9a5UgkPxCOjRA=","Xc9BeHGukGDOMxRJ4DWKsD4Hl/eb6mEQZL6YmMBPRoY=","fOkK1386yU0SP0SXkMTynAZIbKu8kDOYliwg0q\u002BNskY=","oct6eD0w1zvUhMj0MXoNwhWFE2YjuoYqg3X96Ucuj4s=","67V7nn6u9b0acsh53M2HmglNpcktUtvOaw3gSRkwjx4=","ma1u/4RE/To974RJYUPGyGaqvCCeme6zJysx9w1ss3c=","o55JlXqf9P5uAQ2khL\u002B6zb9Tdmwm6I1og1gMy1YLpYY=","e0xtx5OOXKYFYOH5RifNbjh4spMMZ4OJe/5WIl23q7I=","5tm4FTjJTYh\u002BIfly7jRHNn4wSziZxSIN8wAEvIw\u002Bqjw=","BHdvCHnZlyS4zwSKcVy3ayvJezMLJXLcVN9R8deaH0g=","ntzaTVX8xBXsH995gvvXvmliXlCQotIsZXpZcglhOaE=","5kR/aL1DviNsyODfcczgmMzxSZCePCH9RPdTfI\u002BcgyA=","85jPWChWoCRZbXQRGb0iFqvZVPOqR7ev3FjdbkOn3N8=","Nbx2WCrP2GEddQzxS83sJa0zFj93vdmpK4GM2nty9uc=","QJPJj2QugL4XCdpHR\u002BUjqru7nIH7z/53/LJfz\u002B2u78E=","0OChFB9xM4RUbmHFnou7uAEh\u002BDlF54KM6B6j00g5Tmw=","ykyMr/QcfGzV063qPhl8tX3/1moBCOJG611QWUQ\u002BbHY=","/CLnWX/m7JPrsLGY\u002BXHRNWDTPsPKGvhpoUNMvUVySdk=","CkYBQvKkMzORePi8WPMM9aW2Lc3xVg5GJyDtKLXwYmY=","xwGlvpWqKnaz0RVaeRVxQ0PJMwOhvULJb3PN/FnF55I=","4xahvZCLorqqeX8Bk5JA9YF2zYf76VJFw\u002BFYV0Le/k0=","5SqPyjpm7H9Zc\u002BBbXBtZiOjmSi5f2cQeYLc7FuoB/ek=","0O4aVW29Vzt0B4Iet0T1oBGOM020UM\u002BLK2/yEbKH2dU=","HMwYA0Zexo0VNDlvtKgkk/e28ujKc1aNC91bm0MLMdk=","iNfcu84P3JCmFtqZp1chAvwyIZTOhH2RqhEneyvLrhs=","2hARyYn7NC4gbrlXbXtVzxaTHpcnwtUTyyjbnSGMmcs=","wHeoBQH8D12d4FpBCQgSAl7Y98J2wIbXVO87I4Oqnmo=","8cQHbaseDOOEdr82\u002B4L1dLbZfVOBGCzj7m1oStCM4RY=","8WGZEIW0hbJT1XkzSCtnaB50AHFRFH4MihnUs34mxhA=","3ZZyBE\u002BdA6aG7oGYzH8eisN1SphrAdQG8rxBn\u002BDzo/w=","BfFJRPyrADpgktkNNc2mfyFFZoBqauN9MCmAUWxe9Ug=","97Ja5zuGdMucJqedxH7CguZ\u002BiLSY4xYuyTXfJE/3mUs=","Gd2mz0U9mny2BKIeKQ\u002BRDt3csebXGOTHzvpBKmzTj9M=","ymiC674Nr\u002BpzpfZQAvz7VgMKWyqBem/OjSN8QeM3478=","tXqEhWxbNOqNYKJvB\u002B6TTsEx8KNlmzLfTndlyi8dcpg=","nYQ\u002BrXWj8wJ\u002BUt/T6U/wVc9UHvQjMUXDgcAtNNlnlcA=","qkZKbEyxkxbCDFtQ06Z9p3Fqpr6AUZHUiFlVpL00cJY=","mb/vdMDaE9L3J1vibUT8coaPWWPSUbGacfV5H5IP\u002BwU=","\u002BHDgqKS6Nqa5bRN/WtecsLITGr6T6whhbWPV0RjwQwM=","Gig3DQsXKloHGlDlRN26sGVUvT8\u002Bu50xYCWb/DK3fTE=","k5m16lGuQyO6e9aY4k1OYGzBolX0sixXAbsVhNDa7fQ=","MrFgmWKVAxban9XX2uqZQO23DWw0NGjsnWiIu9p11jo=","YQgUcWz2ue2oRWm0L9A\u002B\u002BDN/X2SNcdMG3yyz/5A0N4w=","XsOFFGStfZmGs4rkShh2uK3eN2ongLE0d9KBNjaXb6o=","7ITk8hLOO4uilCzXKB1iYKDtCVKMZ2vApR6K0z9qx0c=","RG4n1qULpz4qGNsyBiHJ1ebTfk9LKVz89pL0eSC8gPc=","4EfJtzv9kg3WWFzBqUt8CbF91bcAtW2ocJG4JUrULj8=","S2dH4yX4W/BjGC7Cp1Ov1rAVBSZJlC1sZbKwQRqMA4M=","krL8lBCCkIWVGoLQQThjIfoe6qs/xBAVnhPU3ywnuSs=","5Ad\u002Bef7REpth\u002B1aDMBr3B0HUtzchjmHZ69ipQ7F2ztQ=","0wADQAsURdwl9hsWFMFxN8u51iyhIefZ0\u002BfAdgRzQBM=","6omG1NdZNuYtZDubEy\u002BDST7\u002BfwfA5A3g2vDv80vluVI=","rRoeWHDFv91Dmdy9uNkQCarQ5nvPkifcZ5GBvZJDKDc=","4bsNytNaXkRk3ePwPIbWzq4IwszFAfZcWbCknkEszmA=","eLvoEvqRTPWrPYwFjRNV8D92N\u002BkvcZnoiJi9t9njyTo=","uoiinJcNOciOgqlO0GZQN2smtr6KoTAnah6dv5mVzek=","YoagLoMl49bUAbErIjNPzkNdCDgBDT514c90F9nGnfE=","uzjUeW\u002BKe/Mh7NhfiBvuinD0gzUKuynWF2VbhEIulVQ=","LdNXSSS5DEGYhs9mcjWxtU5uYD9N3kfGTAPRl6j6qWg=","g0y10m2DgfWcR\u002BBdcBNPC0hbivhMAc0z5cHhsqH1Tzc=","TgJ8XvI1vjoz8U9BMJ1maLQnqweAMT4a8ZSbLYUzoAE=","x8umpBTg0fvarcVhS22jEVXuAcL5hqCQF3JRc1qsxro=","s44dS6GzxTQjxM/Pb8o8DITAn8xEEod4rcdnoe\u002BHnjU=","CbdfxYSJtWv6vuUObWpFgFxBpZ8akVS0vYKUs\u002BQc7yc="],"CachedAssets":{},"CachedCopyCandidates":{}}
+{"GlobalPropertiesHash":"hc8FL4d4SDyJq22ZKuiHZVVsIHQC48YE/mA5pBHYKc4=","FingerprintPatternsHash":"8ZRc1sGeVrPBx4lD717BgRaQekyh78QKV9SKsdt638U=","PropertyOverridesHash":"R7Rea/YQmcweqCbKffD9oUelggfpJQX85r65aYZsas0=","InputHashes":["w16VN9xOimoxck1LjBNXWd9fHMNU3UnlFI\u002B\u002ByZnoFg0=","VOxc8xcqWt6gAM\u002BRuyfRLL1iQY9qPYh4n8cvKjwI3NY=","Sncp4ww/tjimD30ejpDv5D5eCiY\u002BGNCBHG31XvywcgE=","RSbekUJC7incuVtr7C0tXRzZN4BZamYDVsEZmrfQMcY=","0dj\u002B7dC25IeuLKXvwnTzfQVy\u002BUdHnl40sHhE/lKWrRI=","KPTC6joZ0rLn0eml9/Lsh6v1w6OotgKIxbWPkQPSc2U=","oc5dZJn7YA7RsQ0gtAnGAh7rgEphv3dYfFRixIhMKuU=","IBx1Zpi0iRpuwQy5fUr\u002B0BIjRN/f7k\u002BLtsRCoyIqdKg=","x60hTcC5q95RUcHEJci6kZJX\u002BOP5ZncNTZnLKMrK9TQ=","NQukUql2iNTO4MQCyXa8T8bDU1wDElRnV\u002BBc2yCjEHg=","MgtQemV1N1h3/pFRW/IBNT4EgLJYsuxU0zbAcfbRCb4=","Goe41XQAQHCAcUIB4rTr07EWxMhW4VLC35VQ3i8zogk=","8bEfz8MdGCT\u002BUqVKCJhjT0KyMmRaMYgY/zLLZ1asfpE=","Ibz6Ix07csPbM7Pw2WcZZH0awAHeeZ0osg23I/UHwso=","icl4Xuqd3wVKdyQVGN6K0RJuiPUiZ1J3ZMQUAoAzfT0=","dweympdBNxv56b5xEWZUlkihih0FcF9WdEhWCjq2cXc=","fiFS/KvqSehFNqqcPmIkVbUMcMmBAjue0bCe3g32ZYs=","T3X1M\u002BUddK1SoFQOwNXuQKnudpv8ohop7rTlXDRkn4A=","QDGCJ/H0sJVm29CRqaE0VjtfDzWSx48qBmGqriGN89I=","WWNvV\u002BI7oSnu9ecmCS0Mck2eCGJvRs9a5UgkPxCOjRA=","Xc9BeHGukGDOMxRJ4DWKsD4Hl/eb6mEQZL6YmMBPRoY=","fOkK1386yU0SP0SXkMTynAZIbKu8kDOYliwg0q\u002BNskY=","oct6eD0w1zvUhMj0MXoNwhWFE2YjuoYqg3X96Ucuj4s=","67V7nn6u9b0acsh53M2HmglNpcktUtvOaw3gSRkwjx4=","ma1u/4RE/To974RJYUPGyGaqvCCeme6zJysx9w1ss3c=","o55JlXqf9P5uAQ2khL\u002B6zb9Tdmwm6I1og1gMy1YLpYY=","e0xtx5OOXKYFYOH5RifNbjh4spMMZ4OJe/5WIl23q7I=","5tm4FTjJTYh\u002BIfly7jRHNn4wSziZxSIN8wAEvIw\u002Bqjw=","BHdvCHnZlyS4zwSKcVy3ayvJezMLJXLcVN9R8deaH0g=","ntzaTVX8xBXsH995gvvXvmliXlCQotIsZXpZcglhOaE=","5kR/aL1DviNsyODfcczgmMzxSZCePCH9RPdTfI\u002BcgyA=","85jPWChWoCRZbXQRGb0iFqvZVPOqR7ev3FjdbkOn3N8=","Nbx2WCrP2GEddQzxS83sJa0zFj93vdmpK4GM2nty9uc=","QJPJj2QugL4XCdpHR\u002BUjqru7nIH7z/53/LJfz\u002B2u78E=","0OChFB9xM4RUbmHFnou7uAEh\u002BDlF54KM6B6j00g5Tmw=","ykyMr/QcfGzV063qPhl8tX3/1moBCOJG611QWUQ\u002BbHY=","/CLnWX/m7JPrsLGY\u002BXHRNWDTPsPKGvhpoUNMvUVySdk=","CkYBQvKkMzORePi8WPMM9aW2Lc3xVg5GJyDtKLXwYmY=","xwGlvpWqKnaz0RVaeRVxQ0PJMwOhvULJb3PN/FnF55I=","4xahvZCLorqqeX8Bk5JA9YF2zYf76VJFw\u002BFYV0Le/k0=","5SqPyjpm7H9Zc\u002BBbXBtZiOjmSi5f2cQeYLc7FuoB/ek=","0O4aVW29Vzt0B4Iet0T1oBGOM020UM\u002BLK2/yEbKH2dU=","HMwYA0Zexo0VNDlvtKgkk/e28ujKc1aNC91bm0MLMdk=","iNfcu84P3JCmFtqZp1chAvwyIZTOhH2RqhEneyvLrhs=","2hARyYn7NC4gbrlXbXtVzxaTHpcnwtUTyyjbnSGMmcs=","wHeoBQH8D12d4FpBCQgSAl7Y98J2wIbXVO87I4Oqnmo=","8cQHbaseDOOEdr82\u002B4L1dLbZfVOBGCzj7m1oStCM4RY=","8WGZEIW0hbJT1XkzSCtnaB50AHFRFH4MihnUs34mxhA=","3ZZyBE\u002BdA6aG7oGYzH8eisN1SphrAdQG8rxBn\u002BDzo/w=","BfFJRPyrADpgktkNNc2mfyFFZoBqauN9MCmAUWxe9Ug=","97Ja5zuGdMucJqedxH7CguZ\u002BiLSY4xYuyTXfJE/3mUs=","Gd2mz0U9mny2BKIeKQ\u002BRDt3csebXGOTHzvpBKmzTj9M=","ymiC674Nr\u002BpzpfZQAvz7VgMKWyqBem/OjSN8QeM3478=","tXqEhWxbNOqNYKJvB\u002B6TTsEx8KNlmzLfTndlyi8dcpg=","nYQ\u002BrXWj8wJ\u002BUt/T6U/wVc9UHvQjMUXDgcAtNNlnlcA=","qkZKbEyxkxbCDFtQ06Z9p3Fqpr6AUZHUiFlVpL00cJY=","mb/vdMDaE9L3J1vibUT8coaPWWPSUbGacfV5H5IP\u002BwU=","\u002BHDgqKS6Nqa5bRN/WtecsLITGr6T6whhbWPV0RjwQwM=","Gig3DQsXKloHGlDlRN26sGVUvT8\u002Bu50xYCWb/DK3fTE=","k5m16lGuQyO6e9aY4k1OYGzBolX0sixXAbsVhNDa7fQ=","MrFgmWKVAxban9XX2uqZQO23DWw0NGjsnWiIu9p11jo=","YQgUcWz2ue2oRWm0L9A\u002B\u002BDN/X2SNcdMG3yyz/5A0N4w=","XsOFFGStfZmGs4rkShh2uK3eN2ongLE0d9KBNjaXb6o=","7ITk8hLOO4uilCzXKB1iYKDtCVKMZ2vApR6K0z9qx0c=","RG4n1qULpz4qGNsyBiHJ1ebTfk9LKVz89pL0eSC8gPc=","4EfJtzv9kg3WWFzBqUt8CbF91bcAtW2ocJG4JUrULj8=","S2dH4yX4W/BjGC7Cp1Ov1rAVBSZJlC1sZbKwQRqMA4M=","krL8lBCCkIWVGoLQQThjIfoe6qs/xBAVnhPU3ywnuSs=","5Ad\u002Bef7REpth\u002B1aDMBr3B0HUtzchjmHZ69ipQ7F2ztQ=","0wADQAsURdwl9hsWFMFxN8u51iyhIefZ0\u002BfAdgRzQBM=","6omG1NdZNuYtZDubEy\u002BDST7\u002BfwfA5A3g2vDv80vluVI=","rRoeWHDFv91Dmdy9uNkQCarQ5nvPkifcZ5GBvZJDKDc=","4bsNytNaXkRk3ePwPIbWzq4IwszFAfZcWbCknkEszmA=","eLvoEvqRTPWrPYwFjRNV8D92N\u002BkvcZnoiJi9t9njyTo=","uoiinJcNOciOgqlO0GZQN2smtr6KoTAnah6dv5mVzek=","YoagLoMl49bUAbErIjNPzkNdCDgBDT514c90F9nGnfE=","uzjUeW\u002BKe/Mh7NhfiBvuinD0gzUKuynWF2VbhEIulVQ=","LdNXSSS5DEGYhs9mcjWxtU5uYD9N3kfGTAPRl6j6qWg=","g0y10m2DgfWcR\u002BBdcBNPC0hbivhMAc0z5cHhsqH1Tzc=","TgJ8XvI1vjoz8U9BMJ1maLQnqweAMT4a8ZSbLYUzoAE=","x8umpBTg0fvarcVhS22jEVXuAcL5hqCQF3JRc1qsxro=","s44dS6GzxTQjxM/Pb8o8DITAn8xEEod4rcdnoe\u002BHnjU=","9IICJ536DO5SnYafRqGlL5Pf3mmi/qGFXYfX522YIl4="],"CachedAssets":{},"CachedCopyCandidates":{}}
--- a/obj/Debug/net9.0/rjsmcshtml.dswa.cache.json
+++ b/obj/Debug/net9.0/rjsmcshtml.dswa.cache.json
--- a/obj/Debug/net9.0/rjsmrazor.dswa.cache.json
+++ b/obj/Debug/net9.0/rjsmrazor.dswa.cache.json
--- a/obj/Debug/net9.0/rpswa.dswa.cache.json
+++ b/obj/Debug/net9.0/rpswa.dswa.cache.json
--- a/obj/Debug/net9.0/staticwebassets.build.endpoints.json
+++ b/obj/Debug/net9.0/staticwebassets.build.endpoints.json
--- a/obj/Debug/net9.0/staticwebassets.build.json
+++ b/obj/Debug/net9.0/staticwebassets.build.json
--- a/obj/Debug/net9.0/staticwebassets.build.json.cache
+++ b/obj/Debug/net9.0/staticwebassets.build.json.cache
@ -1 +1 @@
-gRdgsHu5kRkDysZ7wrECFkwopjJy/3IO3noa6lkuR1I=
+BxMG25HaC4cDx43ATP16A26Fd1LourrI+W15Xsp+loU=
--- a/obj/Debug/net9.0/staticwebassets.development.json
+++ b/obj/Debug/net9.0/staticwebassets.development.json
--- a/wwwroot/css/app.css
+++ b/wwwroot/css/app.css
@ -25,6 +25,7 @@
    --container-sm: 24rem;
    --container-xl: 36rem;
    --container-2xl: 42rem;
+    --container-5xl: 64rem;
    --container-7xl: 80rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
@ -36,6 +37,8 @@
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
+    --text-2xl: 1.5rem;
+    --text-2xl--line-height: calc(2 / 1.5);
    --text-4xl: 2.25rem;
    --text-4xl--line-height: calc(2.5 / 2.25);
    --text-5xl: 3rem;
@ -527,6 +530,9 @@
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
+  .mt-16 {
+    margin-top: calc(var(--spacing) * 16);
+  }
  .mt-24 {
    margin-top: calc(var(--spacing) * 24);
  }
@ -554,12 +560,6 @@
  .mb-auto {
    margin-bottom: auto;
  }
-  .line-clamp-2 {
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
-  }
  .\!hidden {
    display: none !important;
  }
@ -623,6 +623,9 @@
  .h-9 {
    height: calc(var(--spacing) * 9);
  }
+  .h-11 {
+    height: calc(var(--spacing) * 11);
+  }
  .h-16 {
    height: calc(var(--spacing) * 16);
  }
@ -638,6 +641,9 @@
  .h-100 {
    height: calc(var(--spacing) * 100);
  }
+  .h-\[600px\] {
+    height: 600px;
+  }
  .h-auto {
    height: auto;
  }
@ -659,6 +665,9 @@
  .w-9 {
    width: calc(var(--spacing) * 9);
  }
+  .w-11 {
+    width: calc(var(--spacing) * 11);
+  }
  .w-25 {
    width: calc(var(--spacing) * 25);
  }
@ -680,6 +689,9 @@
  .max-w-2xl {
    max-width: var(--container-2xl);
  }
+  .max-w-5xl {
+    max-width: var(--container-5xl);
+  }
  .max-w-7xl {
    max-width: var(--container-7xl);
  }
@ -811,6 +823,13 @@
      margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
+  .space-y-6 {
+    :where(& > :not(:last-child)) {
+      --tw-space-y-reverse: 0;
+      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
+      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
+    }
+  }
  .divide-x {
    :where(& > :not(:last-child)) {
      --tw-divide-x-reverse: 0;
@ -883,6 +902,9 @@
  .rounded-md {
    border-radius: calc(var(--radius) - 2px);
  }
+  .rounded-xl {
+    border-radius: calc(var(--radius) + 4px);
+  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
@ -923,6 +945,10 @@
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
+  .border-dashed {
+    --tw-border-style: dashed;
+    border-style: dashed;
+  }
  .border-amber-200 {
    border-color: var(--color-amber-200);
  }
@ -941,6 +967,9 @@
  .border-emerald-200 {
    border-color: var(--color-emerald-200);
  }
+  .border-input {
+    border-color: var(--input);
+  }
  .border-orange-200 {
    border-color: var(--color-orange-200);
  }
@ -1034,13 +1063,6 @@
  .bg-white {
    background-color: var(--color-white);
  }
-  .bg-linear-to-r {
-    --tw-gradient-position: to right;
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      --tw-gradient-position: to right in oklab;
-    }
-    background-image: linear-gradient(var(--tw-gradient-stops));
-  }
  .bg-gradient-to-r {
    --tw-gradient-position: to right in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
@ -1108,6 +1130,15 @@
  .p-5 {
    padding: calc(var(--spacing) * 5);
  }
+  .p-6 {
+    padding: calc(var(--spacing) * 6);
+  }
+  .p-8 {
+    padding: calc(var(--spacing) * 8);
+  }
+  .p-12 {
+    padding: calc(var(--spacing) * 12);
+  }
  .px-0 {
    padding-inline: 0;
  }
@ -1162,6 +1193,9 @@
  .py-12 {
    padding-block: calc(var(--spacing) * 12);
  }
+  .py-16 {
+    padding-block: calc(var(--spacing) * 16);
+  }
  .py-20 {
    padding-block: calc(var(--spacing) * 20);
  }
@ -1279,6 +1313,10 @@
  .font-serif {
    font-family: "Fraunces", ui-serif, Georgia, serif;
  }
+  .text-2xl {
+    font-size: var(--text-2xl);
+    line-height: var(--tw-leading, var(--text-2xl--line-height));
+  }
  .text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--tw-leading, var(--text-4xl--line-height));
@ -1515,6 +1553,39 @@
      }
    }
  }
+  .file\:border-0 {
+    &::file-selector-button {
+      border-style: var(--tw-border-style);
+      border-width: 0px;
+    }
+  }
+  .file\:bg-transparent {
+    &::file-selector-button {
+      background-color: transparent;
+    }
+  }
+  .file\:text-sm {
+    &::file-selector-button {
+      font-size: var(--text-sm);
+      line-height: var(--tw-leading, var(--text-sm--line-height));
+    }
+  }
+  .file\:font-medium {
+    &::file-selector-button {
+      --tw-font-weight: var(--font-weight-medium);
+      font-weight: var(--font-weight-medium);
+    }
+  }
+  .file\:text-foreground {
+    &::file-selector-button {
+      color: var(--foreground);
+    }
+  }
+  .placeholder\:text-muted-foreground {
+    &::placeholder {
+      color: var(--muted-foreground);
+    }
+  }
  .hover\:-translate-y-1 {
    &:hover {
      @media (hover: hover) {
@ -1570,6 +1641,33 @@
      }
    }
  }
+  .focus-visible\:ring-1 {
+    &:focus-visible {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
+  .focus-visible\:ring-ring {
+    &:focus-visible {
+      --tw-ring-color: var(--ring);
+    }
+  }
+  .focus-visible\:outline-none {
+    &:focus-visible {
+      --tw-outline-style: none;
+      outline-style: none;
+    }
+  }
+  .disabled\:cursor-not-allowed {
+    &:disabled {
+      cursor: not-allowed;
+    }
+  }
+  .disabled\:opacity-50 {
+    &:disabled {
+      opacity: 50%;
+    }
+  }
  .sm\:inline-flex {
    @media (width >= 40rem) {
      display: inline-flex;
@ -1580,6 +1678,16 @@
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
+  .sm\:p-5 {
+    @media (width >= 40rem) {
+      padding: calc(var(--spacing) * 5);
+    }
+  }
+  .sm\:p-10 {
+    @media (width >= 40rem) {
+      padding: calc(var(--spacing) * 10);
+    }
+  }
  .sm\:px-6 {
    @media (width >= 40rem) {
      padding-inline: calc(var(--spacing) * 6);
@ -1622,6 +1730,12 @@
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
+  .md\:text-sm {
+    @media (width >= 48rem) {
+      font-size: var(--text-sm);
+      line-height: var(--tw-leading, var(--text-sm--line-height));
+    }
+  }
  .lg\:col-span-2 {
    @media (width >= 64rem) {
      grid-column: span 2 / span 2;
@ -1668,6 +1782,11 @@
      line-height: var(--tw-leading, var(--text-7xl--line-height));
    }
  }
+  .xl\:grid-cols-4 {
+    @media (width >= 80rem) {
+      grid-template-columns: repeat(4, minmax(0, 1fr));
+    }
+  }
 }
@property --tw-animation-delay {
  syntax: "*";