feat(config): support *_MB env vars for upload size limits

- Add `applyMegabytesOrBytesEnv` to accept size settings in either bytes or MB
- Prefer `*_BYTES` when set, otherwise convert `*_MB` to bytes with overflow guard
- Add coverage for MB-based environment overrides
- Introduce `static/js/upload-popups.js` to lazy-load and cache popup templatesfeat(config): support *_MB env vars for upload size limits

- Add `applyMegabytesOrBytesEnv` to accept size settings in either bytes or MB
- Prefer `*_BYTES` when set, otherwise convert `*_MB` to bytes with overflow guard
- Add coverage for MB-based environment overrides
- Introduce `static/js/upload-popups.js` to lazy-load and cache popup templates

static/css/upload.css

@@ -17,6 +17,14 @@
     justify-content: center;
     gap: 18px;
     overflow: hidden;
+    zoom: var(--ui-scale);
+}
+
+body.fit-window .desktop-wrap {
+    width: min(100%, calc(100vw / var(--ui-scale) - 20px));
+    height: min(calc(100vh / var(--ui-scale) - 20px), 900px);
+    max-height: none;
+    grid-template-columns: minmax(0, 1fr) var(--side-width);
 }
 
 .upload-window {
@@ -233,6 +241,7 @@
     background-color: #000078;
     background-image: repeating-linear-gradient(to right, rgba(255,255,255,.12) 0 1px, transparent 1px 18px);
     transform-origin: left center;
+    position: relative;
 }
 
 .upload-quota-bar.is-over-quota {
@@ -433,6 +442,26 @@
 .upload-file-row.is-uploaded .upload-progress-bar { background-color: #008000; }
 .upload-file-row.is-failed .upload-progress-bar { width: 100%; background-color: #800000; }
 
+.upload-progress-bar.just-completed,
+.upload-overall-bar.just-completed {
+    animation: progress-impact-bar 520ms steps(5, end) 1;
+}
+
+.upload-progress-bar.just-completed::after,
+.upload-overall-bar.just-completed::after {
+    content: "";
+    position: absolute;
+    right: -7px;
+    top: 50%;
+    width: 12px;
+    height: 22px;
+    transform: translateY(-50%);
+    background: repeating-linear-gradient(45deg, rgba(255,255,255,.95) 0 2px, rgba(0,255,102,.85) 2px 4px, transparent 4px 6px);
+    box-shadow: 0 0 0 1px #ffffff, 0 0 8px #00ff66;
+    pointer-events: none;
+    animation: progress-impact-spark 520ms steps(5, end) 1;
+}
+
 .upload-result {
     display: grid;
     grid-template-columns: 72px minmax(0, 1fr) 72px;
@@ -828,6 +857,7 @@
     max-height: min(760px, calc(100vh - 24px));
     display: none;
     z-index: 80;
+    zoom: var(--ui-scale);
 }
 
 .popup-window.is-visible {
@@ -888,6 +918,7 @@
     font-size: 12px;
     line-height: 14px;
     box-shadow: 4px 4px 0 rgba(0,0,0,.45);
+    zoom: var(--ui-scale);
 }
 
 .toast.is-visible {
@@ -984,6 +1015,17 @@
     font-family: 'PixelOperatorMono', monospace;
 }
 
+.popup-body pre {
+    user-select: text;
+    cursor: text;
+    padding-bottom: 22px;
+}
+
+.popup-body pre::after {
+    content: "\A";
+    white-space: pre;
+}
+
 .kbd {
     display: inline-block;
     min-width: 18px;
@@ -1002,6 +1044,8 @@
 @keyframes share-ready-pulse { 50% { filter: brightness(1.08); box-shadow: 0 0 0 2px #000078; } }
 @keyframes start-ready-rainbow-breathe { 0%, 100% { transform: rotate(-.35deg) scale(1); } 50% { transform: rotate(.35deg) scale(1.016); } }
 @keyframes start-border-rainbow-slide { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
+@keyframes progress-impact-bar { 0% { filter: brightness(1); } 35% { filter: brightness(1.75); } 100% { filter: brightness(1); } }
+@keyframes progress-impact-spark { 0% { opacity: 0; transform: translateY(-50%) scale(.7); } 30% { opacity: 1; transform: translateY(-50%) scale(1.18); } 100% { opacity: 0; transform: translateY(-50%) scale(.7); } }
 @keyframes terminal-cursor { 50% { opacity: 0; } }
 @keyframes popup-open-v10 { from { transform: translate(-50%, -48%) scale(.97); opacity: .35; } to { transform: translate(-50%, -50%) scale(1); opacity: 1; } }
 @keyframes toast-in { from { transform: translateY(12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }