第二次迭代优化

src/styles/main.css

@@ -39,13 +39,16 @@
 html,
 body,
 #app {
+  width: 100%;
+  max-width: 100%;
   min-height: 100%;
   margin: 0;
   background: var(--app-bg);
+  overflow-x: hidden;
 }
 
 body {
-  min-width: 320px;
+  min-width: 0;
 }
 
 button,
@@ -58,6 +61,12 @@ button {
   color: inherit;
 }
 
+img,
+video,
+canvas {
+  max-width: 100%;
+}
+
 .app-shell {
   min-height: 100vh;
   padding: 0 14px 78px;
@@ -76,6 +85,7 @@ button {
 
 .page {
   width: min(100%, 560px);
+  min-width: 0;
   margin: 0 auto;
   padding: 14px 0 18px;
 }
@@ -162,6 +172,7 @@ button {
 
 .panel {
   overflow: hidden;
+  min-width: 0;
   border: 1px solid rgba(226, 232, 228, 0.9);
   border-radius: var(--radius);
   background: var(--surface);
@@ -292,7 +303,7 @@ button {
 
 .order-card__main {
   display: grid;
-  grid-template-columns: 76px 1fr;
+  grid-template-columns: 76px minmax(0, 1fr);
   gap: 10px;
 }
 
@@ -334,14 +345,29 @@ button {
   line-height: 1.5;
 }
 
+.meta-row > *,
+.detail-row > * {
+  min-width: 0;
+  overflow-wrap: anywhere;
+}
+
+.meta-row span,
+.detail-row span {
+  flex: 1 1 auto;
+}
+
 .meta-row strong,
 .detail-row strong {
+  flex: 0 1 auto;
   color: var(--text-main);
   font-weight: 650;
+  text-align: right;
+  overflow-wrap: anywhere;
 }
 
 .stack {
   display: flex;
+  min-width: 0;
   flex-direction: column;
   gap: 8px;
 }