From 5a5f7bdfcfdc08481f0480fac4004e14673e4a8e Mon Sep 17 00:00:00 2001
From: BigSimmo <87357024+BigSimmo@users.noreply.github.com>
Date: Tue, 11 Aug 2026 14:30:42 +0800
Subject: [PATCH 1/2] Refine phone search suggestion spacing

---
 src/app/globals.css                   | 13 ++++++-------
 src/components/mode-home-template.tsx |  2 +-
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/app/globals.css b/src/app/globals.css
index c5f31a636..240a090dc 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -1822,22 +1822,21 @@ summary::-webkit-details-marker {
 .smart-search-phone-ticker {
   display: grid;
   width: 100%;
-  --smart-search-phone-ticker-gap: 0.5rem;
-  --smart-search-phone-ticker-inline-padding: 0.625rem;
-  --smart-search-phone-ticker-vertical-padding: 0.5rem;
+  --smart-search-phone-ticker-gap: 0.75rem;
+  --smart-search-phone-ticker-inline-padding: 0.25rem;
+  --smart-search-phone-ticker-vertical-padding: 0.375rem;
   min-height: var(--spacing-tap);
   grid-template-columns: auto minmax(0, 1fr) auto;
   align-items: center;
   gap: var(--smart-search-phone-ticker-gap);
   overflow: hidden;
-  border: 1px solid color-mix(in srgb, var(--clinical-accent) 18%, var(--border));
-  border-radius: var(--radius-lg);
-  background: color-mix(in srgb, var(--clinical-accent-soft) 42%, var(--surface));
+  border: 0;
+  background: transparent;
   padding-block: var(--smart-search-phone-ticker-vertical-padding);
   padding-inline: var(--smart-search-phone-ticker-inline-padding);
   color: var(--text-heading);
   text-align: left;
-  box-shadow: var(--shadow-inset);
+  box-shadow: none;
 }
 
 .smart-search-phone-ticker-kicker {
diff --git a/src/components/mode-home-template.tsx b/src/components/mode-home-template.tsx
index 314240ac9..3ea06444d 100644
--- a/src/components/mode-home-template.tsx
+++ b/src/components/mode-home-template.tsx
@@ -84,7 +84,7 @@ export function ModeHomeHero({
       <span className="mode-home-icon grid h-tap w-tap place-items-center rounded-2xl border border-[color:var(--clinical-accent-border)] bg-[color:var(--clinical-accent-soft)] text-[color:var(--clinical-accent)] shadow-[var(--shadow-inset)] sm:h-12 sm:w-12 lg:h-14 lg:w-14 lg:rounded-2xl">
         <Icon className="h-5 w-5 sm:h-6 sm:w-6 lg:h-7 lg:w-7" aria-hidden="true" />
       </span>
-      <div className="grid gap-1 sm:gap-1.5">
+      <div className="grid gap-0 sm:gap-0.5">
         <Heading
           id={`${testId ?? "mode-home"}-title`}
           className={cn(

From 02eb8d3ae689a054ab72fc026d329fcedc779252 Mon Sep 17 00:00:00 2001
From: BigSimmo <87357024+BigSimmo@users.noreply.github.com>
Date: Tue, 11 Aug 2026 19:50:04 +0800
Subject: [PATCH 2/2] chore(1808): fix stylelint blank-line in phone ticker

---
 src/app/globals.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/app/globals.css b/src/app/globals.css
index 206870798..efded671e 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -1831,6 +1831,7 @@ summary::-webkit-details-marker {
   --smart-search-phone-ticker-gap: 0.75rem;
   --smart-search-phone-ticker-inline-padding: 0.25rem;
   --smart-search-phone-ticker-vertical-padding: 0.375rem;
+
   min-height: var(--spacing-tap);
   grid-template-columns: auto minmax(0, 1fr) auto;
   align-items: center;