Stage 6 (part 1): new client mini-app look and order ratings

Plum hero with a club-card ticket, a 'Now' block with the live order timeline,
new order cards and order screen, QR club card screen, new nav
(Home / Orders / Chat / Card / Profile). Clients rate completed orders
(1-5 stars + comment); provider rating is recalculated.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

apps/miniapp-client/src/screens/Orders.tsx

@@ -1,8 +1,8 @@
 import { useQuery } from '@tanstack/react-query';
-import { Center, LinkButton, Segmented, Spinner } from '@barev/ui';
+import { Center, Icon, Segmented, Spinner } from '@barev/ui';
 import { useI18n, useTRPC } from '@barev/web';
 import { useState } from 'react';
-import { OrderRow, PageHead } from '../lib.tsx';
+import { OrderRow } from '../lib.tsx';
 
 export function Orders() {
   const { t } = useI18n();
@@ -18,7 +18,12 @@ export function Orders() {
   const list = orders.data[tab];
   return (
     <main className="app">
-      <PageHead title={t('client.orders.title')} />
+      <header className="screen-head">
+        <h1 className="screen-head__title">{t('client.orders.title')}</h1>
+        <a href="#/services" className="pill pill--dark" aria-label={t('client.orders.order')}>
+          <Icon name="plus" size={18} strokeWidth={2.6} />
+        </a>
+      </header>
       <Segmented
         value={tab}
         onChange={setTab}
@@ -28,12 +33,14 @@ export function Orders() {
         ]}
       />
       {list.length === 0 ? (
-        <div className="bc-stack" style={{ alignItems: 'center', padding: 24 }}>
-          <p className="bc-muted">{t(tab === 'active' ? 'client.home.noOrders' : 'client.orders.noHistory')}</p>
-          <LinkButton href="#/services">{t('client.orders.order')}</LinkButton>
+        <div className="empty-now">
+          <p>{t(tab === 'active' ? 'client.home.noOrders' : 'client.orders.noHistory')}</p>
+          <a href="#/services" className="pill pill--dark">
+            {t('client.orders.order')}
+          </a>
         </div>
       ) : (
-        <div className="bc-stack" style={{ gap: 8 }}>
+        <div className="order-list">
           {list.map((o) => (
             <OrderRow key={o.id} o={o} />
           ))}