feat(5.9): US-006 - fundatie responsive (viewport, nav, modal full-screen mobil)

- base.html: conventie breakpoint unic 767px documentata + bloc @media mobil extins
- modal full-screen pe mobil (100vw/100vh, fara backdrop lateral, x >=44px, scroll intern)
- header/nav colapsat sub 768px + tinte touch >=44px (.icon-btn/.tab-link/.cont-menu)
- tests/test_web_responsive.py NOU (3 teste) + prd.json/progress.txt US-006 passes

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

app/web/templates/base.html

@@ -34,6 +34,11 @@
     [data-theme="light"] { --bg:#f6f7f9; --card:#ffffff; --ink:#1a1d24; --muted:#5c6473; --line:#e2e5ea;
                            --ok:#15803d; --warn:#b45309; --err:#dc2626; --accent:#2563eb; }
     * { box-sizing:border-box; }
+    /* PRD 5.9 US-006 — CONVENTIE BREAKPOINT: un singur prag mobil la 768px.
+       CSS custom properties NU functioneaza in `@media`, deci pragul nu poate fi o
+       variabila; folosim consecvent `@media (max-width:767px)` peste tot (mobil) si
+       `@media (max-width:1024px)` doar pentru densitatea tabelului. >=1024px = layout
+       desktop neschimbat (fara regresie). Orice regula mobila noua reutilizeaza 767px. */
     body { margin:0; font:15px/1.5 ui-sans-serif,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
            background:var(--bg); color:var(--ink); -webkit-font-smoothing:antialiased; }
     header { padding:16px 24px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:12px; }
@@ -197,7 +202,8 @@
     }
     /* === Modal detaliu (PRD 5.9 US-003): fereastra modala globala, in afara zonei de
        poll (#submissions-wrap). Backdrop + dialog centrat pe desktop; focus-trap +
-       scroll-lock + inert pe <main> sunt in JS. Varianta full-screen mobil vine in US-006. === */
+       scroll-lock + inert pe <main> sunt in JS. Varianta full-screen mobil: vezi blocul
+       `@media (max-width:767px)` US-006 de mai jos. === */
     .modal-overlay { position:fixed; inset:0; z-index:1100; display:flex;
                      align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto; }
     .modal-overlay[hidden] { display:none; }
@@ -214,8 +220,12 @@
     body.modal-open { overflow:hidden; }
     .modal-eroare { padding:16px 4px; }
     .modal-eroare .actiuni { margin-top:12px; display:flex; gap:10px; flex-wrap:wrap; }
-    /* <768px: card per rand (eticheta:valoare stivuit), nu tabel -> fara scroll orizontal */
+    /* === PRD 5.9 US-006: fundatie responsive mobil (<768px) ===
+       Breakpoint unic 767px (vezi conventia de sus). Cuprinde: card per rand pe tabelul
+       de trimiteri (5.8, pastrat), modal full-screen, header/nav colapsat cu tinte touch
+       >=44px. Desktop (>=1024px) ramane neschimbat — regulile de baza nu se modifica. */
     @media (max-width:767px) {
+      /* Tabel trimiteri: card per rand (eticheta:valoare stivuit) -> fara scroll orizontal */
       .tabel-trimiteri table { table-layout:auto; }
       .tabel-trimiteri thead { display:none; }
       .tabel-trimiteri table, .tabel-trimiteri tbody, .tabel-trimiteri tr, .tabel-trimiteri td { display:block; width:auto; }
@@ -224,6 +234,25 @@
       .tabel-trimiteri td::before { content:attr(data-eticheta); color:var(--muted); font-size:12px;
                                     flex:0 0 auto; min-width:120px; }
       .tabel-trimiteri td.col-chk { display:none; }
+
+      /* Modal full-screen: ocupa tot ecranul, fara backdrop lateral (overlay fara
+         padding, dialog la latime/inaltime pline, fara colturi/umbra). Scroll intern
+         pe dialog; butonul `x` la >=44px (tinta touch). Desktop pastreaza varianta
+         centrata cu `max-width:680px` din regula de baza de mai sus. */
+      .modal-overlay { padding:0; align-items:stretch; justify-content:stretch; }
+      .modal-dialog { width:100vw; max-width:none; min-height:100vh; max-height:100vh;
+                      border:none; border-radius:0; box-shadow:none;
+                      padding:16px; padding-top:56px; overflow-y:auto; }
+      .modal-close { width:44px; height:44px; top:8px; right:8px; font-size:24px; }
+
+      /* Header + nav colapsate: header se rupe pe linii, fara scroll orizontal de pagina;
+         tintele touch (toggle tema/cont, taburi, itemi meniu cont) cresc la >=44px. */
+      header { padding:12px 16px; flex-wrap:wrap; gap:8px; }
+      header h1 { font-size:17px; }
+      main { padding:16px; }
+      .icon-btn { min-height:44px; min-width:44px; }
+      .tab-link { min-height:44px; padding:10px 14px; }
+      .cont-menu a, .cont-menu button { min-height:44px; }
     }
   </style>
 </head>