Upload folder using huggingface_hub

app.py

@@ -1168,19 +1168,61 @@ button.action:active {{
 }}
 
 @media (max-width: 900px) {{
-    .masthead, .sheet, .colophon {{ padding-left: 24px; padding-right: 24px; }}
+    .masthead, .sheet, .colophon {{ padding-left: 20px; padding-right: 20px; }}
+    .masthead-row {{
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 16px;
+        padding: 14px 0 18px;
+    }}
+    .wordmark {{ font-size: clamp(40px, 11vw, 64px); line-height: 0.95; }}
+    .dek-text {{ max-width: 100%; font-size: 14px; }}
+    .dek-meta {{ text-align: left; white-space: normal; line-height: 1.5; }}
+    .masthead-top {{ flex-wrap: wrap; gap: 8px; font-size: 9px; }}
+    .masthead-top .vol {{ gap: 14px; }}
+    .masthead-top .vol span:not(:last-child)::after {{ margin-left: 14px; }}
+
+    .control-strip {{ grid-template-columns: 1fr; gap: 14px; align-items: start; }}
+    .section-title {{ font-size: 16px; }}
+    select {{ width: 100%; min-width: 0; }}
+    button.action {{ width: 100%; padding: 14px; }}
+
+    .figure-head {{ flex-direction: column; align-items: flex-start; gap: 6px; }}
+    .figure-title {{ font-size: 20px; }}
+    .figure-title::before {{ display: none; }}
+    .figure-frame {{ height: clamp(340px, 60vh, 460px); padding: 14px; }}
+
     .findings {{ grid-template-columns: 1fr 1fr; }}
-    .finding {{ border-right: none; border-bottom: 1px solid var(--rule); }}
-    .finding:nth-child(2n) {{ border-right: none; }}
-    .finding:nth-child(odd) {{ border-right: 1px solid var(--rule); }}
-    .dossier-stats {{ grid-template-columns: 1fr 1fr; gap: 20px; }}
+    .finding {{ border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 14px 16px; }}
+    .finding:nth-child(even) {{ border-right: none; }}
+    .finding:nth-last-child(-n+2) {{ border-bottom: none; }}
+    .finding .value {{ font-size: 30px; }}
+
+    .dossier {{ padding: 24px 18px; }}
+    .dossier-label {{ left: 18px; }}
+    .dossier-stats {{ grid-template-columns: 1fr 1fr; gap: 16px; }}
+    .dossier-stat .v {{ font-size: 26px; }}
+    .rate-strip {{ flex-direction: column; gap: 10px; }}
+
     .split.active {{ grid-template-columns: 1fr; }}
-    .panel {{ border-right: none; border-bottom: 1px solid var(--rule); }}
-    .control-strip {{ grid-template-columns: 1fr; gap: 16px; }}
-    .section-num {{ display: none; }}
-    .dek {{ flex-direction: column; align-items: flex-start; }}
-    .wordmark {{ font-size: 72px; }}
-    .colophon-top {{ grid-template-columns: 1fr; }}
+    .panel {{ border-right: none; border-bottom: 1px solid var(--rule); padding: 22px 18px; }}
+    .panel:last-child {{ border-bottom: none; }}
+    .policy {{ grid-template-columns: 52px 1fr; gap: 12px; }}
+    .policy-metric {{ grid-column: 2; color: var(--ink-fade); }}
+
+    .colophon {{ padding: 32px 20px 48px; }}
+    .colophon-top {{ grid-template-columns: 1fr; gap: 24px; }}
+    .colophon-imprint {{ font-size: 44px; }}
+    .colophon-mark {{ flex-direction: column; gap: 8px; align-items: flex-start; }}
+}}
+
+@media (max-width: 520px) {{
+    .wordmark {{ font-size: 40px; letter-spacing: -0.015em; }}
+    .findings {{ grid-template-columns: 1fr; }}
+    .finding {{ border-right: none !important; }}
+    .finding:last-child {{ border-bottom: none; }}
+    .dossier-stats {{ grid-template-columns: 1fr; gap: 14px; }}
+    .figure-caption {{ font-size: 12px; }}
 }}
 </style>
 </head>