diff --git a/docs/DESIGN-SYSTEM.md b/docs/DESIGN-SYSTEM.md
index 416db8b..0bbe521 100644
--- a/docs/DESIGN-SYSTEM.md
+++ b/docs/DESIGN-SYSTEM.md
@@ -137,7 +137,7 @@ Lencana: 10 sampai 11px, 800, huruf kapital, radius 6, font mono untuk nilai tek
 ## 4. Tipografi, spasi, radius
 Body 15px/1.5. KPI 24px/800 tracking -0.02em. Angka sekunder 20px/800. Judul kartu 15px/700. Label 12.8px. Meta/chip 11 sampai 12px (chip 600).
 Label tab bawah 11px. Input/select **16px**. Skala spasi 4px: padding halaman 14 sampai 16px, antar kartu 12px, antar kontrol 8px.
-Radius: kartu 16, kontrol/tombol 12, lencana 6, chip/pill penuh. Skala kontrol (dikecilkan dari 44/48, mengikuti hadir S16): input/select/tombol default **40px**, `sm` 34px, `lg` 44px (satu aksi utama penuh-lebar), ikon 40px (`btn-icon`) dan 36px (`btn-icon-sm`), nav desktop 40px, segmen HP 38px. Teks input 16px di HP (iOS zoom), 14px di ≥700px. Chip 32px dengan jarak ≥6px.
+Radius: kartu 16, kontrol/tombol 12, lencana 6, chip/pill penuh. Skala kontrol (dikecilkan dari 44/48, mengikuti hadir S16): input/select/tombol default **40px**, `sm` 34px, `lg` 44px (satu aksi utama penuh-lebar), ikon 40px (`btn-icon`) dan 36px (`btn-icon-sm`), nav desktop 40px, segmen HP 38px. Teks input 16px di HP (iOS zoom), 14px di ≥700px. **Desktop ≥700px (kerapatan mengikuti Coolify)**: input/select/tombol 32px, teks tombol 13px, `sm` 28px, `lg` 36px, ikon 32/28px, segmen 26px, chip 28px, padding kartu 16px, nav 36px, body 14px. HP tetap 40px/16px. Chip 32px dengan jarak ≥6px.
 
 ## 5. Komponen (partial bersama, varian di partial bukan di pemakaian)
 | Kebutuhan | Partial / kelas | Catatan |
diff --git a/internal/http/static/app.css b/internal/http/static/app.css
index fce8191..2391cf5 100644
--- a/internal/http/static/app.css
+++ b/internal/http/static/app.css
@@ -902,3 +902,34 @@ hgroup .page-actions { margin-top: 4px; }
 /* Lencana di tabel/daftar lebih kecil dari lencana judul (umpan balik produksi 2026-10-15) */
 /* Konstruksi sama dengan lencana judul (line-height 1 + padding): di Android line-height tinggi membuat teks naik */
 .rows .badge, .group-head .badge { font-size: 8px; font-weight: 700; line-height: 1; padding: 4.5px 5px 3.5px; letter-spacing: 0.02em; } /* +0,5px: diukur dari foto HP, teks kapital mono duduk 0,25-0,6px terlalu tinggi di Android */
+
+/* Desktop density (>= 700px), sizes follow Coolify: controls 32px, buttons 13px, body 14px, cards p-4.
+   Phones keep 40px controls / 16px inputs (touch target, iOS zoom). DESIGN-SYSTEM §4. */
+@media (min-width: 700px) {
+  body { font-size: 14px; }
+  .btn { min-height: 32px; padding: 0 10px; border-radius: 8px; font-size: 13px; }
+  .btn-sm { min-height: 28px; padding: 0 8px; font-size: 12px; }
+  .btn-lg { min-height: 36px; padding: 0 14px; }
+  .btn-link, .btn-link:hover { min-height: 0; padding: 0; }
+  .btn-icon { width: 32px; padding: 0; }
+  .btn-icon-sm { width: 28px; min-height: 28px; padding: 0; }
+  .actgrid .btn .icon { width: 15px; height: 15px; }
+  input, select, textarea { min-height: 32px; padding: 0 10px; border-radius: 8px; }
+  textarea { min-height: 72px; padding: 6px 10px; }
+  .row-env textarea { min-height: 32px; }
+  .search input { padding-left: 36px; }
+  .search .icon { left: 10px; width: 16px; height: 16px; }
+  .select-wrap select { padding-right: 34px; }
+  .select-wrap .icon { right: 10px; width: 16px; height: 16px; }
+  .field, label, .check { font-size: 14px; }
+  .seg-btn, .seg-radio span { min-height: 26px; font-size: 12px; }
+  .chip { min-height: 28px; }
+  .card { padding: 16px; }
+  .row-domain { grid-template-columns: minmax(0, 1fr) 32px; }
+  .row-env { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) 28px 28px; }
+  .row-file { grid-template-columns: minmax(0, 1fr) auto 28px; }
+}
+@media (min-width: 900px) {
+  .main-nav { height: 36px; }
+  .main-nav a { font-size: 13px; }
+}