Skip to main content

max / goingson

Platinum wave 4: the literal sweep, widened to the last offset shadows Wave 4 as specified was the 49 border and radius literals that bypass the token block. Widened to also finish the shadow conversion the earlier waves left behind, since the five waves only enumerated a third of the app's surface. Shadows: 13 panels that still carried the neobrutalist offset take --bevel-raised (event and calendar grids, filter bar, day-plan panes, bulk-actions bar, saved views, milestone cards, task overview, month detail, problem rows, and the two touch-hover resets). Four more floats compose the bevel with their drop shadow: the key hint, the autocomplete dropdown, the mobile slide menu, the command palette. A dragged timeline item keeps its shadow, and loses a token fallback that silently bypassed the theme. Literals: 70 chrome borders move onto --border-width and 18 radii onto the radius scale. Nothing carries a blur radius now except the float shadows, which is one of the spec's done conditions. Left alone deliberately: the @media print block authors fixed hex and fixed widths because themed colour does not print, and accent stripes (a single-side border in a status or category colour) are signal rather than chrome, so 1px would erase them.
Co-Authored-By
Claude Opus 5 (1M context) <noreply@anthropic.com>
Author: Max Johnson <me@maxj.phd> · 2026-07-26 23:46 UTC
Signed with PGP, not checked
Commit: ef4464e199af0c7a162569cfdc30e8ee3abc995a
Parent: 3b4f9f9
1 file changed, +67 insertions, -64 deletions
@@ -837,14 +837,14 @@
837 837 .markdown-content p { margin: 0 0 0.5em 0; }
838 838 .markdown-content p:last-child { margin-bottom: 0; }
839 839 .markdown-content ul, .markdown-content ol { margin: 0 0 0.5em 1.5em; padding: 0; }
840 - .markdown-content code { background: var(--surface-sunken); padding: 0.1em 0.3em; border-radius: 3px; font-size: 0.85em; }
841 - .markdown-content pre { background: var(--surface-sunken); padding: 0.5em; border-radius: 4px; overflow-x: auto; margin: 0 0 0.5em 0; }
840 + .markdown-content code { background: var(--surface-sunken); padding: 0.1em 0.3em; border-radius: var(--radius-xs); font-size: 0.85em; }
841 + .markdown-content pre { background: var(--surface-sunken); padding: 0.5em; border-radius: var(--radius-sm); overflow-x: auto; margin: 0 0 0.5em 0; }
842 842 .markdown-content pre code { background: none; padding: 0; }
843 843 .markdown-content a { color: var(--action); }
844 844 .markdown-content blockquote { border-left: 3px solid var(--border); margin: 0 0 0.5em 0; padding-left: 0.75em; color: var(--content-secondary); }
845 845 .markdown-content h1, .markdown-content h2, .markdown-content h3 { margin: 0.5em 0 0.25em 0; font-size: 1em; font-weight: 600; color: var(--content); }
846 846 .markdown-content table { border-collapse: collapse; margin: 0.5em 0; }
847 - .markdown-content th, .markdown-content td { border: 1px solid var(--border); padding: 0.25em 0.5em; }
847 + .markdown-content th, .markdown-content td { border: var(--border-width) solid var(--border); padding: 0.25em 0.5em; }
848 848 .markdown-content img { max-width: 100%; }
849 849
850 850 .card-meta {
@@ -923,8 +923,8 @@
923 923 font-weight: 600;
924 924 padding: 0.1rem 0.35rem;
925 925 margin-left: 0.35rem;
926 - border: 1px solid currentColor;
927 - border-radius: 3px;
926 + border: var(--border-width) solid currentColor;
927 + border-radius: var(--radius-xs);
928 928 opacity: 0.6;
929 929 vertical-align: middle;
930 930 line-height: 1;
@@ -1218,7 +1218,7 @@
1218 1218 border-radius: var(--radius-xs);
1219 1219 font-size: 0.75rem;
1220 1220 font-weight: 600;
1221 - border: 1px solid var(--border);
1221 + border: var(--border-width) solid var(--border);
1222 1222 }
1223 1223
1224 1224 .recurrence-icon {
@@ -1298,7 +1298,7 @@
1298 1298 flex-direction: column;
1299 1299 flex: 1;
1300 1300 min-height: 0;
1301 - box-shadow: var(--shadow-offset) var(--shadow-offset) 0 var(--border);
1301 + box-shadow: var(--bevel-raised);
1302 1302 }
1303 1303
1304 1304 /* Event Grid Column Widths */
@@ -1313,7 +1313,7 @@
1313 1313 /* Event Header Row */
1314 1314 .event-header-row {
1315 1315 background-color: var(--surface-overlay);
1316 - border-bottom: 2px solid var(--border);
1316 + border-bottom: var(--border-width) solid var(--border);
1317 1317 flex-shrink: 0;
1318 1318 }
1319 1319
@@ -1337,7 +1337,7 @@
1337 1337 /* Event Row */
1338 1338 .event-row-virtual {
1339 1339 padding: 0.75rem 1.25rem;
1340 - border-bottom: 1px solid var(--border);
1340 + border-bottom: var(--border-width) solid var(--border);
1341 1341 transition: background-color 0.15s ease;
1342 1342 cursor: pointer;
1343 1343 }
@@ -1606,7 +1606,7 @@
1606 1606 display: flex;
1607 1607 gap: 1rem;
1608 1608 padding: 1rem;
1609 - border-bottom: 2px solid var(--border);
1609 + border-bottom: var(--border-width) solid var(--border);
1610 1610 transition: background-color 0.15s ease;
1611 1611 cursor: pointer;
1612 1612 }
@@ -1751,7 +1751,7 @@
1751 1751
1752 1752 .toast-action {
1753 1753 background: none;
1754 - border: 1px solid currentColor;
1754 + border: var(--border-width) solid currentColor;
1755 1755 border-radius: var(--radius-sm);
1756 1756 color: inherit;
1757 1757 cursor: pointer;
@@ -2187,7 +2187,7 @@
2187 2187 }
2188 2188 .sync-banner--warning {
2189 2189 background: var(--surface-overlay);
2190 - border: 1px solid var(--border);
2190 + border: var(--border-width) solid var(--border);
2191 2191 padding: var(--space-4);
2192 2192 }
2193 2193 .sync-empty {
@@ -2526,7 +2526,7 @@
2526 2526 align-items: center;
2527 2527 justify-content: space-between;
2528 2528 padding: var(--space-3);
2529 - border: 1px solid var(--border);
2529 + border: var(--border-width) solid var(--border);
2530 2530 border-radius: var(--radius-md);
2531 2531 margin-bottom: var(--space-2);
2532 2532 }
@@ -2561,7 +2561,7 @@
2561 2561 display: none;
2562 2562 margin-top: var(--space-2);
2563 2563 padding: var(--space-2);
2564 - border: 1px solid var(--border);
2564 + border: var(--border-width) solid var(--border);
2565 2565 border-radius: var(--radius-sm);
2566 2566 }
2567 2567 .recurrence-config:not(.hidden) {
@@ -2646,7 +2646,7 @@
2646 2646 color: var(--content);
2647 2647 border: var(--border-width) solid var(--border);
2648 2648 border-radius: var(--radius-md);
2649 - box-shadow: var(--shadow-brutal-md);
2649 + box-shadow: var(--bevel-raised), var(--shadow-brutal-md);
2650 2650 z-index: 10000;
2651 2651 font-size: var(--font-size-sm);
2652 2652 white-space: nowrap;
@@ -2655,7 +2655,7 @@
2655 2655 .pending-key-hint-label { opacity: 0.7; }
2656 2656 .pending-key-hint kbd {
2657 2657 background: var(--surface-overlay);
2658 - border: 1px solid var(--border);
2658 + border: var(--border-width) solid var(--border);
2659 2659 border-radius: var(--radius-xs);
2660 2660 padding: 0.125rem 0.4rem;
2661 2661 font-family: inherit;
@@ -2683,7 +2683,7 @@
2683 2683 .shortcuts-title {
2684 2684 margin-top: 0;
2685 2685 margin-bottom: var(--space-4);
2686 - border-bottom: 1px solid var(--border);
2686 + border-bottom: var(--border-width) solid var(--border);
2687 2687 padding-bottom: var(--space-2);
2688 2688 }
2689 2689 .shortcuts-grid {
@@ -2717,7 +2717,7 @@
2717 2717 }
2718 2718 .shortcut-row kbd {
2719 2719 background: var(--surface-overlay);
2720 - border: 1px solid var(--border);
2720 + border: var(--border-width) solid var(--border);
2721 2721 border-radius: var(--radius-xs);
2722 2722 padding: 0.25rem 0.5rem;
2723 2723 font-family: inherit;
@@ -2741,7 +2741,7 @@
2741 2741 .quick-add-syntax kbd {
2742 2742 font-size: 0.7rem;
2743 2743 padding: 0.1rem 0.3rem;
2744 - border: 1px solid var(--border);
2744 + border: var(--border-width) solid var(--border);
2745 2745 border-radius: var(--radius-xs);
2746 2746 background: var(--surface-overlay);
2747 2747 }
@@ -2778,7 +2778,7 @@
2778 2778 gap: var(--space-2);
2779 2779 margin-top: var(--space-4);
2780 2780 padding-top: var(--space-3);
2781 - border-top: 1px solid var(--border);
2781 + border-top: var(--border-width) solid var(--border);
2782 2782 }
2783 2783 .error-state--padded {
2784 2784 padding: var(--space-4);
@@ -2793,7 +2793,7 @@
2793 2793
2794 2794 .hr-soft {
2795 2795 border: none;
2796 - border-top: 1px solid var(--border);
2796 + border-top: var(--border-width) solid var(--border);
2797 2797 margin: var(--space-2) 0;
2798 2798 }
2799 2799
@@ -2820,7 +2820,7 @@
2820 2820 .review-history-block {
2821 2821 margin-top: var(--space-5);
2822 2822 padding-top: var(--space-4);
2823 - border-top: 1px dashed var(--border);
2823 + border-top: var(--border-width) dashed var(--border);
2824 2824 }
2825 2825 .review-history-heading {
2826 2826 font-size: var(--font-size-sm);
@@ -2845,7 +2845,7 @@
2845 2845 padding: var(--space-2) var(--space-3);
2846 2846 background: var(--surface-overlay);
2847 2847 border-radius: var(--radius-sm);
2848 - border: 1px solid var(--border);
2848 + border: var(--border-width) solid var(--border);
2849 2849 }
2850 2850 .email-attachments-heading {
2851 2851 font-size: var(--font-size-sm);
@@ -2868,7 +2868,7 @@
2868 2868 }
2869 2869 .email-snoozed-tag { color: var(--warning); }
2870 2870 .email-actions-bar {
2871 - border-top: 1px solid var(--border);
2871 + border-top: var(--border-width) solid var(--border);
2872 2872 padding-top: var(--space-4);
2873 2873 margin-top: auto;
2874 2874 }
@@ -2914,7 +2914,7 @@
2914 2914 display: flex;
2915 2915 align-items: center;
2916 2916 padding: 0.75rem 1rem;
2917 - border-bottom: 1px solid var(--border);
2917 + border-bottom: var(--border-width) solid var(--border);
2918 2918 gap: 0.5rem;
2919 2919 }
2920 2920 .header-row--tight {
@@ -2968,7 +2968,7 @@
2968 2968 /* Attachment list, rendered into #attachments-bar by composeForm. */
2969 2969 .compose-attachments {
2970 2970 padding: 0.5rem 1rem;
2971 - border-top: 1px solid var(--border);
2971 + border-top: var(--border-width) solid var(--border);
2972 2972 background: var(--surface-overlay);
2973 2973 font-size: 0.8125rem;
2974 2974 }
@@ -3002,7 +3002,7 @@
3002 3002 margin-top: var(--space-1);
3003 3003 font-size: var(--font-size-sm);
3004 3004 color: var(--content-muted);
3005 - border-top: 1px dashed var(--border);
3005 + border-top: var(--border-width) dashed var(--border);
3006 3006 }
3007 3007 .compose-attachment-total.over-warn { color: var(--warning); }
3008 3008 .compose-attachment-total.over-cap { color: var(--danger); }
@@ -3096,7 +3096,7 @@
3096 3096 align-items: center;
3097 3097 gap: var(--space-3);
3098 3098 padding: var(--space-2) 0;
3099 - border-bottom: 1px solid var(--border);
3099 + border-bottom: var(--border-width) solid var(--border);
3100 3100 }
3101 3101 .attachment-icon { font-size: 1.2rem; }
3102 3102 .attachment-meta {
@@ -3419,7 +3419,7 @@
3419 3419 background-color: var(--surface-raised);
3420 3420 border: var(--border-width) solid var(--border);
3421 3421 border-radius: var(--radius-md);
3422 - box-shadow: var(--shadow-offset) var(--shadow-offset) 0 var(--border);
3422 + box-shadow: var(--bevel-raised);
3423 3423 }
3424 3424
3425 3425 .filter-group {
@@ -3778,7 +3778,7 @@
3778 3778 /* Horizontal rule separators */
3779 3779 .email-reader-body hr {
3780 3780 border: none;
3781 - border-top: 2px solid var(--border);
3781 + border-top: var(--border-width) solid var(--border);
3782 3782 margin: 1rem 0;
3783 3783 }
3784 3784
@@ -3821,9 +3821,9 @@
3821 3821 with max-height), kept separate intentionally. */
3822 3822 .autocomplete-dropdown {
3823 3823 background: var(--surface-raised);
3824 - border: 1px solid var(--border);
3824 + border: var(--border-width) solid var(--border);
3825 3825 border-radius: var(--radius-sm);
3826 - box-shadow: var(--shadow-brutal-md);
3826 + box-shadow: var(--bevel-raised), var(--shadow-brutal-md);
3827 3827 z-index: 100;
3828 3828 max-height: 200px;
3829 3829 overflow-y: auto;
@@ -3860,7 +3860,7 @@
3860 3860 .email-reader-header {
3861 3861 margin-bottom: 1rem;
3862 3862 padding-bottom: 0.75rem;
3863 - border-bottom: 1px solid var(--border);
3863 + border-bottom: var(--border-width) solid var(--border);
3864 3864 }
3865 3865
3866 3866 /* Email sender contact card. Compose with `row-flex row-flex-2` for the row. */
@@ -3868,7 +3868,7 @@
3868 3868 margin-top: 0.5rem;
3869 3869 padding: 0.4rem 0.5rem;
3870 3870 background: var(--surface-sunken);
3871 - border-radius: 4px;
3871 + border-radius: var(--radius-sm);
3872 3872 }
3873 3873
3874 3874 .email-sender-info {
@@ -4042,7 +4042,7 @@
4042 4042 padding: 0.35rem 1rem;
4043 4043 font-size: 0.7rem;
4044 4044 color: var(--content-muted);
4045 - border-top: 1px solid var(--border);
4045 + border-top: var(--border-width) solid var(--border);
4046 4046 margin-top: 0.25rem;
4047 4047 }
4048 4048
@@ -4203,7 +4203,7 @@
4203 4203 align-items: center;
4204 4204 margin-bottom: 1rem;
4205 4205 padding-bottom: 0.5rem;
4206 - border-bottom: 2px solid var(--border);
4206 + border-bottom: var(--border-width) solid var(--border);
4207 4207 }
4208 4208
4209 4209 .dashboard-column-header h3 {
@@ -4267,7 +4267,7 @@
4267 4267 height: 0.6rem;
4268 4268 padding: 0;
4269 4269 line-height: 0;
4270 - border-radius: 50%;
4270 + border-radius: var(--radius-full);
4271 4271 border: var(--border-width-sm) solid var(--border);
4272 4272 background: var(--content-muted);
4273 4273 cursor: pointer;
@@ -4415,7 +4415,7 @@
4415 4415 border: var(--border-width) solid var(--border);
4416 4416 border-radius: var(--radius-md);
4417 4417 overflow: hidden;
4418 - box-shadow: var(--shadow-offset) var(--shadow-offset) 0 var(--border);
4418 + box-shadow: var(--bevel-raised);
4419 4419 }
4420 4420
4421 4421 .day-plan-sidebar {
@@ -4427,12 +4427,12 @@
4427 4427 border: var(--border-width) solid var(--border);
4428 4428 border-radius: var(--radius-md);
4429 4429 overflow: hidden;
4430 - box-shadow: var(--shadow-offset) var(--shadow-offset) 0 var(--border);
4430 + box-shadow: var(--bevel-raised);
4431 4431 }
4432 4432
4433 4433 .sidebar-header {
4434 4434 padding: 1rem;
4435 - border-bottom: 2px solid var(--border);
4435 + border-bottom: var(--border-width) solid var(--border);
4436 4436 flex-shrink: 0;
4437 4437 }
4438 4438
@@ -4491,7 +4491,7 @@
4491 4491 }
4492 4492
4493 4493 .timeline-slot.hour-start .timeline-slot-area {
4494 - border-top: 1px dashed color-mix(in srgb, var(--border) 50%, transparent);
4494 + border-top: var(--border-width) dashed color-mix(in srgb, var(--border) 50%, transparent);
4495 4495 }
4496 4496
4497 4497 .timeline-time {
@@ -4627,11 +4627,14 @@
4627 4627 pointer-events: none;
4628 4628 }
4629 4629
4630 + /* A dragged item is genuinely off the page, so it keeps a drop shadow on
4631 + top of its bevel. The token fallback is gone: it silently bypassed the
4632 + theme on any surface that redefined the shadow. */
4630 4633 .timeline-item.dragging {
4631 4634 cursor: grabbing;
4632 4635 opacity: 0.8;
4633 4636 z-index: 100;
4634 - box-shadow: var(--shadow-brutal-md, 4px 4px 0 var(--border));
4637 + box-shadow: var(--bevel-raised), var(--shadow-brutal-md);
4635 4638 }
4636 4639
4637 4640 .timeline-container.is-painting {
@@ -4736,7 +4739,7 @@
4736 4739 .settings-overlay-card {
4737 4740 position: relative;
4738 4741 background: var(--surface-page);
4739 - border: 1px solid var(--border);
4742 + border: var(--border-width) solid var(--border);
4740 4743 border-radius: var(--radius-lg, 8px);
4741 4744 box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
4742 4745 width: min(960px, 100%);
@@ -4769,7 +4772,7 @@
4769 4772 .settings-sidebar {
4770 4773 width: 200px;
4771 4774 flex-shrink: 0;
4772 - border-right: 1px solid var(--border);
4775 + border-right: var(--border-width) solid var(--border);
4773 4776 padding: 1.5rem 0;
4774 4777 display: flex;
4775 4778 flex-direction: column;
@@ -4997,7 +5000,7 @@
4997 5000 .snooze-custom {
4998 5001 margin-top: 0.5rem;
4999 5002 padding-top: 0.5rem;
5000 - border-top: 2px solid var(--border);
5003 + border-top: var(--border-width) solid var(--border);
5001 5004 }
5002 5005
5003 5006 .snooze-badge {
@@ -5084,7 +5087,7 @@
5084 5087 background: var(--action);
5085 5088 color: var(--content-on-action);
5086 5089 border: var(--border-width) solid var(--border);
5087 - box-shadow: var(--shadow-offset) var(--shadow-offset) 0 var(--border);
5090 + box-shadow: var(--bevel-raised);
5088 5091 margin-bottom: 1rem;
5089 5092 }
5090 5093
@@ -5326,7 +5329,7 @@
5326 5329 text-transform: uppercase;
5327 5330 letter-spacing: 0.05em;
5328 5331 color: var(--content-secondary);
5329 - border-bottom: 2px solid var(--border);
5332 + border-bottom: var(--border-width) solid var(--border);
5330 5333 background: var(--surface-overlay);
5331 5334 }
5332 5335
@@ -5371,7 +5374,7 @@
5371 5374 font-size: 0.85rem;
5372 5375 font-weight: 600;
5373 5376 color: var(--content);
5374 - box-shadow: var(--shadow-offset) var(--shadow-offset) 0 var(--border);
5377 + box-shadow: var(--bevel-raised);
5375 5378 transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
5376 5379 }
5377 5380
@@ -5420,7 +5423,7 @@
5420 5423 width: 40px;
5421 5424 height: 40px;
5422 5425 min-width: 40px;
5423 - border-radius: 50%;
5426 + border-radius: var(--radius-full);
5424 5427 background-color: var(--action);
5425 5428 color: var(--content-on-action);
5426 5429 display: flex;
@@ -5467,7 +5470,7 @@
5467 5470 .contact-detail .contact-info-section {
5468 5471 margin-bottom: 1rem;
5469 5472 padding-bottom: 1rem;
5470 - border-bottom: 1px solid var(--surface-sunken);
5473 + border-bottom: var(--border-width) solid var(--surface-sunken);
5471 5474 }
5472 5475
5473 5476 .contact-detail .contact-notes {
@@ -5502,7 +5505,7 @@
5502 5505 justify-content: space-between;
5503 5506 align-items: center;
5504 5507 padding: 0.4rem 0;
5505 - border-bottom: 1px solid var(--surface-sunken);
5508 + border-bottom: var(--border-width) solid var(--surface-sunken);
5506 5509 font-size: 0.9rem;
5507 5510 }
5508 5511
@@ -5519,7 +5522,7 @@
5519 5522
5520 5523 /* Edit form sub-collection summaries */
5521 5524 .edit-sub-collections {
5522 - border-top: 1px solid var(--border);
5525 + border-top: var(--border-width) solid var(--border);
5523 5526 padding-top: 1rem;
5524 5527 margin-bottom: 0.5rem;
5525 5528 }
@@ -5575,7 +5578,7 @@
5575 5578 bottom: 0;
5576 5579 width: min(480px, 100vw);
5577 5580 background: var(--surface-page);
5578 - border-left: 1px solid var(--border);
5581 + border-left: var(--border-width) solid var(--border);
5579 5582 box-shadow: -4px 0 18px rgba(0, 0, 0, 0.18);
5580 5583 transform: translateX(100%);
5581 5584 transition: transform 180ms ease-out;
@@ -5592,7 +5595,7 @@
5592 5595 align-items: center;
5593 5596 gap: var(--space-3);
5594 5597 padding: var(--space-3) var(--space-4);
5595 - border-bottom: 1px solid var(--border);
5598 + border-bottom: var(--border-width) solid var(--border);
5596 5599 background: var(--surface-overlay);
5597 5600 flex-shrink: 0;
5598 5601 }
@@ -5950,7 +5953,7 @@
5950 5953 .tab-status-dot {
5951 5954 width: 8px;
5952 5955 height: 8px;
5953 - border-radius: 50%;
5956 + border-radius: var(--radius-full);
5954 5957 display: inline-block;
5955 5958 margin-left: 0.5rem;
5956 5959 vertical-align: middle;
@@ -6019,7 +6022,7 @@
6019 6022 padding: 0.75rem 0.5rem;
6020 6023 background: var(--surface-overlay);
6021 6024 border-radius: var(--radius-md);
6022 - border: 1px solid var(--border);
6025 + border: var(--border-width) solid var(--border);
6023 6026 position: relative;
6024 6027 }
6025 6028
@@ -6073,7 +6076,7 @@
6073 6076 opacity: 0.5;
6074 6077 width: 12px;
6075 6078 height: 4px;
6076 - border-radius: 2px;
6079 + border-radius: var(--radius-xs);
6077 6080 }
6078 6081
6079 6082 /* Day Events (inline on timeline strip) */
@@ -6137,7 +6140,7 @@
6137 6140 .vacation-toggles-section {
6138 6141 margin-top: 1rem;
6139 6142 padding-top: 1rem;
6140 - border-top: 2px solid var(--border);
6143 + border-top: var(--border-width) solid var(--border);
6141 6144 }
6142 6145
6143 6146 .vacation-toggles-section h3 {
@@ -6268,7 +6271,7 @@
6268 6271 .task-checkbox {
6269 6272 width: 20px;
6270 6273 height: 20px;
6271 - border: 2px solid var(--border);
6274 + border: var(--border-width) solid var(--border);
6272 6275 border-radius: var(--radius-xs);
6273 6276 display: flex;
6274 6277 align-items: center;
@@ -6321,7 +6324,7 @@
6321 6324 .scope-slot {
6322 6325 padding: 1.25rem;
6323 6326 background: var(--surface-overlay);
6324 - border: 2px dashed var(--border);
6327 + border: var(--border-width) dashed var(--border);
6325 6328 border-radius: var(--radius-md);
6326 6329 min-height: 100px;
6327 6330 display: flex;
@@ -6496,7 +6499,7 @@
6496 6499 /* Accomplishment celebration */
6497 6500 .accomplishment-highlight {
6498 6501 background: linear-gradient(135deg, color-mix(in srgb, var(--success) 10%, var(--surface-raised)) 0%, color-mix(in srgb, var(--success) 5%, var(--surface-raised)) 100%);
6499 - border: 2px solid var(--success);
6502 + border: var(--border-width) solid var(--success);
6500 6503 padding: 1rem;
6501 6504 border-radius: var(--radius-md);
6502 6505 margin-bottom: 1rem;
@@ -7087,7 +7090,7 @@
7087 7090 .import-preview-table-wrapper {
7088 7091 max-height: 300px;
7089 7092 overflow: auto;
7090 - border: 1px solid var(--border);
7093 + border: var(--border-width) solid var(--border);
7091 7094 border-radius: var(--radius-sm);
7092 7095 }
7093 7096
@@ -7137,7 +7140,7 @@
7137 7140 margin-top: 1rem;
7138 7141 padding: 0.75rem;
7139 7142 background: color-mix(in srgb, var(--warning) 10%, var(--surface-raised));
7140 - border: 1px solid var(--warning);
7143 + border: var(--border-width) solid var(--warning);
7141 7144 border-radius: var(--radius-sm);
7142 7145 font-size: var(--font-size-sm);
7143 7146 }
@@ -7165,7 +7168,7 @@
7165 7168 gap: 0.5rem;
7166 7169 padding: 1.5rem 1rem;
7167 7170 background: var(--surface-raised);
7168 - border: 2px solid var(--border);
7171 + border: var(--border-width) solid var(--border);
7169 7172 border-radius: var(--radius-md);
7170 7173 cursor: pointer;
7171 7174 transition: border-color 0.15s, background 0.15s;
@@ -7258,7 +7261,7 @@
7258 7261 right: 0;
Lines truncated