Redesign on the Stitch reference, in Plus Jakarta Sans

Four passes, and the shape they landed on.

The type face is Plus Jakarta Sans (variable, wght 200-800), which brings a
fix with it: it carries the rupee glyph and Switzer does not, so prices stop
being set in Geist Mono to work around a missing character. Mono stays where
it is earned - references and phone numbers, read digit by digit.

Surfaces lift rather than outline. Cards carry two very soft shadow layers
instead of a hairline, because eight outlined boxes down a screen read as a
wireframe. The tab bar floats as a pill again for the same reason it was
right to: it is now the same kind of object as everything above it.

Screens:

* Home is the greeting, the address, the sphere and one card. The card lost
  its progress bar - a filling line says "wait", and a parcel two days into
  a journey is not something anyone is waiting through - and gained the size
  that buys.
* Orders cards are four bands: identity, destination, route, and whatever is
  happening right now. Plus a search field, because the list is the archive.
* Tracking leads with the state at display size, then TRIP MILESTONES with a
  step counter, then the courier.
* Review is a route thread over two particular cards.
* Account opens on the person: avatar, name, and two counted figures.

Three real bugs the redesign surfaced:

* Quick dispatch handed `loadCities()` straight to a FutureBuilder, so the
  catalogue was refetched on every rebuild and Home never settled.
* Order cards showed the whole visit's weight on one destination's row -
  somebody else's parcel. Per group now, and only once actually weighed.
* The pickup window was printed beside "In transit", where it reads as a
  delivery time nobody promised.

Nothing invented. The reference shows EXPRESS PRIORITY, CARBON OFFSET,
CONCIERGE ELITE and hub-to-hub routing; this backend sends none of them, so
they are absent rather than mocked up.

flutter analyze: clean. flutter test: 88 passing.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01EqVJPB9B4QuieZnBAAKgYQ

lib/ui/widgets/inputs.dart

@@ -259,6 +259,7 @@ class DmRow extends StatelessWidget {
     this.onTap,
     this.showChevron = false,
     this.icon,
+    this.note,
   });
 
   final String label;
@@ -277,6 +278,12 @@ class DmRow extends StatelessWidget {
   /// just as well.
   final IconData? icon;
 
+  /// The line under the label — "3 locations configured", "Real-time SMS &
+  /// Push". It is what turns a menu into a list of states the customer can
+  /// check without opening anything, which is most of what a settings screen
+  /// is for.
+  final String? note;
+
   @override
   Widget build(BuildContext context) {
     return Material(
@@ -286,38 +293,64 @@ class DmRow extends StatelessWidget {
         splashColor: DmColors.brandSoft,
         highlightColor: DmColors.brandSoft.withValues(alpha: 0.5),
         child: Container(
-          constraints: const BoxConstraints(minHeight: 56),
-          padding: const EdgeInsets.fromLTRB(16, 11, 16, 11),
+          constraints: const BoxConstraints(minHeight: 58),
+          padding: const EdgeInsets.fromLTRB(18, 13, 18, 13),
           child: Row(
             children: [
               if (icon != null) ...[
-                Icon(icon, size: 19, color: DmColors.ink3),
-                const SizedBox(width: 14),
+                // A glyph in a well, not a glyph. Six bare strokes down a
+                // settings list read as a column of marks; six wells read as
+                // six rows, and the well is what gives the label a left edge
+                // to sit against.
+                Container(
+                  width: 36,
+                  height: 36,
+                  alignment: Alignment.center,
+                  decoration: BoxDecoration(
+                    color: DmColors.surfaceAlt,
+                    borderRadius: DmRadius.all(DmRadius.xs),
+                  ),
+                  child: Icon(icon, size: 17, color: DmColors.ink2),
+                ),
+                const SizedBox(width: 13),
               ],
-              // The label takes the width it needs and the value takes what
-              // is left. A fixed 3:2 split gave the label room it was not
-              // using — "Saved addresses" is short — and rendered the value
-              // beside it as "38 Mettupal…", which is a truncation nobody can
-              // read anything out of. The label stays Flexible so a long one
-              // at large text sizes can still give way.
-              Flexible(
-                child: Text(
-                  label,
-                  style: DmText.cardTitle,
-                  maxLines: 1,
-                  overflow: TextOverflow.ellipsis,
+              // The label is what the row IS and it is never the thing that
+              // truncates. Two rounds of flex arithmetic here produced
+              // "Payment metho…" and "38 Mettupal…" in turn; the fix was not a
+              // third ratio, it was to stop passing values that cannot fit.
+              // A [value] is a word — "UPI", "SMS and push" — and anything
+              // longer belongs on the screen the row opens.
+              Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Text(
+                      label,
+                      style: DmText.cardTitle.copyWith(fontSize: 15.5),
+                      maxLines: 1,
+                      overflow: TextOverflow.ellipsis,
+                    ),
+                    if (note != null)
+                      Text(
+                        note!,
+                        style: DmText.small.copyWith(
+                          fontSize: 12.5,
+                          color: DmColors.ink3,
+                        ),
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
+                      ),
+                  ],
                 ),
               ),
               if (value != null) ...[
                 const SizedBox(width: 12),
-                Expanded(
-                  child: Text(
-                    value!,
-                    style: DmText.value,
-                    textAlign: TextAlign.right,
-                    maxLines: 1,
-                    overflow: TextOverflow.ellipsis,
-                  ),
+                Text(
+                  value!,
+                  style: DmText.value,
+                  textAlign: TextAlign.right,
+                  maxLines: 1,
                 ),
               ],
               ?trailing,
@@ -337,7 +370,18 @@ class DmRow extends StatelessWidget {
   }
 }
 
-/// Card that rules a group of [DmRow]s together.
+/// A run of [DmRow]s on one surface.
+///
+/// ── Card → rules → card ──
+///
+/// It was a bordered card, then bare ruled rows on the canvas. The bare rows
+/// were right about the border — three decorations were doing one job — and
+/// wrong about the surface: with nothing under them Account read as a text
+/// file, while every other list in the app had come back onto a card.
+///
+/// It is a [DmCard] again, which now separates by lift rather than by edge.
+/// The rules stay, because they belong to the card and are what let one
+/// [DmRow] work alone or in a stack of five.
 class DmRowGroup extends StatelessWidget {
   const DmRowGroup({super.key, required this.children});