zmiany w ux

static/css/custom.css

@@ -303,4 +303,82 @@ select.form-select:focus {
 /* kursor */
 .CodeMirror-cursor {
     border-left: 1px solid #e0e0e0 !important;
+}
+
+.nav-pills .nav-link.active {
+    background: var(--accent);
+    color: #111;
+}
+
+.nav-pills .nav-link {
+    color: inherit;
+}
+
+/* sticky tylko od md wzwyż, by na mobile nie przyklejać */
+@media (min-width: 768px) {
+    .sticky-md {
+        position: sticky;
+    }
+}
+
+:root {
+    --sticky-offset: 1rem;
+}
+
+/* Rząd kopiowania: czytelny, łatwy klik w przycisk */
+.copy-row {
+    display: grid;
+    grid-template-columns: 1fr auto;
+    grid-template-rows: auto auto;
+    gap: .25rem .5rem;
+    align-items: center;
+    padding: .5rem .75rem;
+    border: 1px solid var(--border, rgba(255, 255, 255, .15));
+    border-radius: .75rem;
+    background: rgba(255, 255, 255, .02);
+}
+
+.copy-row+.copy-row {
+    margin-top: .5rem;
+}
+
+.copy-row__label {
+    grid-column: 1 / 2;
+    grid-row: 1 / 2;
+    font-weight: 600;
+    font-size: .9rem;
+    opacity: .85;
+}
+
+.copy-row__value {
+    grid-column: 1 / 2;
+    grid-row: 2 / 3;
+    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
+    letter-spacing: .02em;
+    user-select: text;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.copy-row__btn {
+    grid-column: 2 / 3;
+    grid-row: 1 / 3;
+    height: fit-content;
+    align-self: center;
+}
+
+@media (max-width: 575.98px) {
+
+    /* na XS przycisk pod spodem – łatwiej trafić kciukiem */
+    .copy-row {
+        grid-template-columns: 1fr;
+        grid-template-rows: auto auto auto;
+    }
+
+    .copy-row__btn {
+        grid-column: 1 / -1;
+        grid-row: 3 / 4;
+        width: 100%;
+    }
 }