repo-wrapped 0.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/README.md +94 -0
  2. package/dist/cli.js +24 -0
  3. package/dist/commands/generate.js +95 -0
  4. package/dist/commands/index.js +24 -0
  5. package/dist/constants/chronotypes.js +23 -0
  6. package/dist/constants/colors.js +18 -0
  7. package/dist/constants/index.js +18 -0
  8. package/dist/formatters/index.js +17 -0
  9. package/dist/formatters/timeFormatter.js +29 -0
  10. package/dist/generators/html/scripts/export.js +125 -0
  11. package/dist/generators/html/scripts/knowledge.js +120 -0
  12. package/dist/generators/html/scripts/modal.js +68 -0
  13. package/dist/generators/html/scripts/navigation.js +156 -0
  14. package/dist/generators/html/scripts/tabs.js +18 -0
  15. package/dist/generators/html/scripts/tooltip.js +21 -0
  16. package/dist/generators/html/styles/achievements.css +387 -0
  17. package/dist/generators/html/styles/base.css +818 -0
  18. package/dist/generators/html/styles/components.css +1391 -0
  19. package/dist/generators/html/styles/knowledge.css +221 -0
  20. package/dist/generators/html/templates/achievementsSection.js +156 -0
  21. package/dist/generators/html/templates/commitQualitySection.js +89 -0
  22. package/dist/generators/html/templates/contributionGraph.js +73 -0
  23. package/dist/generators/html/templates/impactSection.js +117 -0
  24. package/dist/generators/html/templates/knowledgeSection.js +226 -0
  25. package/dist/generators/html/templates/streakSection.js +42 -0
  26. package/dist/generators/html/templates/timePatternsSection.js +110 -0
  27. package/dist/generators/html/utils/colorUtils.js +21 -0
  28. package/dist/generators/html/utils/commitMapBuilder.js +24 -0
  29. package/dist/generators/html/utils/dateRangeCalculator.js +57 -0
  30. package/dist/generators/html/utils/developerStatsCalculator.js +29 -0
  31. package/dist/generators/html/utils/scriptLoader.js +16 -0
  32. package/dist/generators/html/utils/styleLoader.js +18 -0
  33. package/dist/generators/html/utils/weekGrouper.js +28 -0
  34. package/dist/index.js +77 -0
  35. package/dist/types/index.js +2 -0
  36. package/dist/utils/achievementDefinitions.js +433 -0
  37. package/dist/utils/achievementEngine.js +170 -0
  38. package/dist/utils/commitQualityAnalyzer.js +368 -0
  39. package/dist/utils/fileHotspotAnalyzer.js +270 -0
  40. package/dist/utils/gitParser.js +125 -0
  41. package/dist/utils/htmlGenerator.js +449 -0
  42. package/dist/utils/impactAnalyzer.js +248 -0
  43. package/dist/utils/knowledgeDistributionAnalyzer.js +374 -0
  44. package/dist/utils/matrixGenerator.js +350 -0
  45. package/dist/utils/slideGenerator.js +313 -0
  46. package/dist/utils/streakCalculator.js +135 -0
  47. package/dist/utils/timePatternAnalyzer.js +305 -0
  48. package/dist/utils/wrappedDisplay.js +115 -0
  49. package/dist/utils/wrappedGenerator.js +377 -0
  50. package/dist/utils/wrappedHtmlGenerator.js +552 -0
  51. package/package.json +55 -0
@@ -0,0 +1,1391 @@
1
+ /* === Contribution Graph === */
2
+ .graph-container {
3
+ position: relative;
4
+ max-width: 80svw;
5
+ overflow-x: auto;
6
+ }
7
+
8
+ .months {
9
+ display: flex;
10
+ gap: 2px;
11
+ margin-bottom: var(--spacing-xs);
12
+ font-size: var(--font-size-sm);
13
+ color: var(--text-secondary);
14
+ margin-left: 45px;
15
+ }
16
+
17
+ .month-label {
18
+ font-weight: var(--font-weight-medium);
19
+ width: 22px;
20
+ }
21
+
22
+ .graph {
23
+ display: flex;
24
+ gap: 2px;
25
+ }
26
+
27
+ .graph-column {
28
+ display: flex;
29
+ flex-direction: column;
30
+ gap: 2px;
31
+ }
32
+
33
+ .day-label {
34
+ font-size: var(--font-size-xs);
35
+ color: var(--text-secondary);
36
+ display: flex;
37
+ align-items: center;
38
+ padding-right: var(--spacing-xs);
39
+ width: 40px;
40
+ height: 22px;
41
+ }
42
+
43
+ .day-labels {
44
+ display: flex;
45
+ flex-direction: column;
46
+ gap: 2px;
47
+ margin-right: 2px;
48
+ }
49
+
50
+ .day {
51
+ width: 20px;
52
+ height: 20px;
53
+ border-radius: var(--radius-sm);
54
+ cursor: pointer;
55
+ transition: outline var(--transition-fast);
56
+ }
57
+
58
+ .day.clickable {
59
+ cursor: pointer;
60
+ }
61
+
62
+ .day.clickable:hover {
63
+ outline: 2px solid var(--accent-blue);
64
+ outline-offset: 1px;
65
+ }
66
+
67
+ .day.empty {
68
+ border: 1px solid var(--border-subtle);
69
+ box-sizing: border-box;
70
+ }
71
+
72
+ .day:hover {
73
+ outline: 2px solid var(--accent-blue);
74
+ outline-offset: 1px;
75
+ }
76
+
77
+ .legend {
78
+ margin-top: var(--spacing-md);
79
+ display: flex;
80
+ align-items: center;
81
+ gap: var(--spacing-xs);
82
+ font-size: var(--font-size-sm);
83
+ color: var(--text-secondary);
84
+ justify-content: flex-end;
85
+ }
86
+
87
+ .legend-box {
88
+ width: 12px;
89
+ height: 12px;
90
+ border-radius: var(--radius-sm);
91
+ display: inline-block;
92
+ }
93
+
94
+ /* === Tooltip === */
95
+ .tooltip {
96
+ position: fixed;
97
+ background: var(--bg-tertiary);
98
+ border: 1px solid var(--border-default);
99
+ border-radius: var(--radius-md);
100
+ padding: var(--spacing-sm) var(--spacing-md);
101
+ font-size: var(--font-size-sm);
102
+ pointer-events: none;
103
+ display: none;
104
+ z-index: 1000;
105
+ box-shadow: var(--shadow-lg);
106
+ }
107
+
108
+ /* === Modal === */
109
+ .modal {
110
+ position: fixed;
111
+ top: 0;
112
+ left: 0;
113
+ width: 100%;
114
+ height: 100%;
115
+ background: rgba(0, 0, 0, 0.8);
116
+ display: none;
117
+ justify-content: center;
118
+ align-items: center;
119
+ z-index: 2000;
120
+ }
121
+
122
+ .modal.active {
123
+ display: flex;
124
+ }
125
+
126
+ .modal-content {
127
+ background: var(--bg-secondary);
128
+ border: 1px solid var(--border-default);
129
+ border-radius: var(--radius-lg);
130
+ padding: var(--spacing-lg);
131
+ max-width: 700px;
132
+ max-height: 80vh;
133
+ overflow-y: auto;
134
+ width: 90%;
135
+ box-shadow: var(--shadow-lg);
136
+ }
137
+
138
+ .modal-header {
139
+ display: flex;
140
+ justify-content: space-between;
141
+ align-items: center;
142
+ margin-bottom: var(--spacing-md);
143
+ padding-bottom: var(--spacing-md);
144
+ border-bottom: 1px solid var(--border-default);
145
+ }
146
+
147
+ .modal-title {
148
+ font-size: var(--font-size-xl);
149
+ font-weight: var(--font-weight-semibold);
150
+ color: var(--text-primary);
151
+ }
152
+
153
+ .modal-close {
154
+ background: none;
155
+ border: none;
156
+ color: var(--text-secondary);
157
+ font-size: 24px;
158
+ cursor: pointer;
159
+ padding: 0;
160
+ width: 32px;
161
+ height: 32px;
162
+ display: flex;
163
+ align-items: center;
164
+ justify-content: center;
165
+ border-radius: var(--radius-md);
166
+ transition: background-color var(--transition-fast), color var(--transition-fast);
167
+ }
168
+
169
+ .modal-close:hover {
170
+ background: var(--bg-elevated);
171
+ color: var(--text-primary);
172
+ }
173
+
174
+ .modal-close:focus-visible {
175
+ outline: 2px solid var(--accent-blue);
176
+ outline-offset: 2px;
177
+ }
178
+
179
+ .commit-list {
180
+ display: flex;
181
+ flex-direction: column;
182
+ gap: var(--spacing-md);
183
+ }
184
+
185
+ .commit-item {
186
+ background: var(--bg-primary);
187
+ border: 1px solid var(--border-default);
188
+ border-radius: var(--radius-md);
189
+ padding: var(--spacing-md);
190
+ transition: border-color var(--transition-fast);
191
+ }
192
+
193
+ .commit-item:hover {
194
+ border-color: var(--border-emphasis);
195
+ }
196
+
197
+ .commit-message {
198
+ font-size: var(--font-size-md);
199
+ color: var(--text-primary);
200
+ margin-bottom: var(--spacing-sm);
201
+ font-weight: var(--font-weight-medium);
202
+ }
203
+
204
+ .commit-meta {
205
+ display: flex;
206
+ gap: var(--spacing-md);
207
+ flex-wrap: wrap;
208
+ font-size: var(--font-size-sm);
209
+ color: var(--text-secondary);
210
+ }
211
+
212
+ .commit-meta-item {
213
+ display: flex;
214
+ align-items: center;
215
+ gap: var(--spacing-xs);
216
+ }
217
+
218
+ .commit-sha {
219
+ font-family: var(--font-mono);
220
+ background: var(--bg-elevated);
221
+ padding: 2px 6px;
222
+ border-radius: var(--radius-sm);
223
+ color: var(--text-link);
224
+ }
225
+
226
+ /* === Streak Section === */
227
+ .streak-section {
228
+ margin-top: var(--spacing-xl);
229
+ padding-top: var(--spacing-lg);
230
+ border-top: 1px solid var(--border-default);
231
+ }
232
+
233
+ .streak-section h2 {
234
+ font-size: var(--font-size-xl);
235
+ margin-bottom: var(--spacing-md);
236
+ color: var(--text-primary);
237
+ }
238
+
239
+ .streak-cards {
240
+ display: grid;
241
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
242
+ gap: var(--spacing-md);
243
+ }
244
+
245
+ .streak-card {
246
+ display: flex;
247
+ flex-direction: column;
248
+ align-items: center;
249
+ justify-content: center;
250
+ text-align: center;
251
+ gap: var(--spacing-sm);
252
+ padding: var(--spacing-md);
253
+ background: var(--bg-primary);
254
+ border: 1px solid var(--border-default);
255
+ border-radius: var(--radius-md);
256
+ transition: border-color var(--transition-fast);
257
+ }
258
+
259
+ .streak-card:hover {
260
+ border-color: var(--border-emphasis);
261
+ }
262
+
263
+ .streak-icon {
264
+ font-size: 32px;
265
+ line-height: 1;
266
+ }
267
+
268
+ .streak-info {
269
+ display: flex;
270
+ flex-direction: column;
271
+ align-items: center;
272
+ }
273
+
274
+ .streak-label {
275
+ font-size: var(--font-size-sm);
276
+ color: var(--text-secondary);
277
+ margin-bottom: var(--spacing-xs);
278
+ text-transform: uppercase;
279
+ letter-spacing: 0.5px;
280
+ font-weight: var(--font-weight-medium);
281
+ }
282
+
283
+ .streak-value {
284
+ font-size: 24px;
285
+ font-weight: var(--font-weight-semibold);
286
+ color: var(--text-primary);
287
+ margin-bottom: var(--spacing-xs);
288
+ }
289
+
290
+ .streak-motivation {
291
+ font-size: var(--font-size-sm);
292
+ color: var(--accent-blue);
293
+ }
294
+
295
+ .streak-date-range {
296
+ font-size: var(--font-size-sm);
297
+ color: var(--text-secondary);
298
+ }
299
+
300
+ .active-days-bar {
301
+ margin-top: var(--spacing-sm);
302
+ margin-bottom: var(--spacing-xs);
303
+ height: 6px;
304
+ background: var(--border-subtle);
305
+ border-radius: var(--radius-sm);
306
+ overflow: hidden;
307
+ }
308
+
309
+ .active-days-progress {
310
+ height: 100%;
311
+ background: var(--accent-green);
312
+ border-radius: var(--radius-sm);
313
+ transition: width 0.3s ease;
314
+ }
315
+
316
+ .active-days-percentage {
317
+ font-size: var(--font-size-sm);
318
+ color: var(--text-secondary);
319
+ }
320
+
321
+ /* === Time Patterns Section === */
322
+ .time-patterns-section {
323
+ margin-top: var(--spacing-xl);
324
+ padding-top: var(--spacing-lg);
325
+ border-top: 1px solid var(--border-default);
326
+ }
327
+
328
+ .time-patterns-section h2 {
329
+ font-size: var(--font-size-xl);
330
+ margin-bottom: var(--spacing-md);
331
+ color: var(--text-primary);
332
+ }
333
+
334
+ .patterns-grid {
335
+ display: grid;
336
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
337
+ gap: var(--spacing-md);
338
+ margin-bottom: var(--spacing-md);
339
+ }
340
+
341
+ .pattern-card {
342
+ padding: var(--spacing-md);
343
+ background: var(--bg-primary);
344
+ border: 1px solid var(--border-default);
345
+ border-radius: var(--radius-md);
346
+ transition: border-color var(--transition-fast);
347
+ }
348
+
349
+ .pattern-card:hover {
350
+ border-color: var(--border-emphasis);
351
+ }
352
+
353
+ .pattern-header {
354
+ display: flex;
355
+ align-items: center;
356
+ gap: var(--spacing-sm);
357
+ margin-bottom: var(--spacing-sm);
358
+ }
359
+
360
+ .pattern-icon {
361
+ font-size: 20px;
362
+ }
363
+
364
+ .pattern-title {
365
+ font-size: var(--font-size-sm);
366
+ color: var(--text-secondary);
367
+ text-transform: uppercase;
368
+ letter-spacing: 0.5px;
369
+ font-weight: var(--font-weight-medium);
370
+ }
371
+
372
+ .pattern-value {
373
+ font-size: var(--font-size-2xl);
374
+ font-weight: var(--font-weight-semibold);
375
+ color: var(--text-primary);
376
+ margin-bottom: var(--spacing-xs);
377
+ }
378
+
379
+ .pattern-detail {
380
+ font-size: var(--font-size-sm);
381
+ color: var(--text-secondary);
382
+ }
383
+
384
+ /* === Burnout Warning (Wellbeing Note) === */
385
+ .burnout-warning,
386
+ .wellbeing-note {
387
+ margin: var(--spacing-md) 0;
388
+ padding: var(--spacing-md);
389
+ background: rgba(158, 106, 3, 0.1);
390
+ border: 1px solid var(--status-warning);
391
+ border-radius: var(--radius-md);
392
+ }
393
+
394
+ .burnout-header,
395
+ .wellbeing-header {
396
+ display: flex;
397
+ align-items: center;
398
+ gap: var(--spacing-sm);
399
+ margin-bottom: var(--spacing-sm);
400
+ }
401
+
402
+ .warning-icon,
403
+ .wellbeing-icon {
404
+ font-size: 20px;
405
+ }
406
+
407
+ .warning-title,
408
+ .wellbeing-title {
409
+ font-size: var(--font-size-md);
410
+ font-weight: var(--font-weight-semibold);
411
+ color: #f0883e;
412
+ }
413
+
414
+ .burnout-indicators,
415
+ .wellbeing-indicators {
416
+ margin: var(--spacing-sm) 0 var(--spacing-sm) var(--spacing-lg);
417
+ color: var(--text-secondary);
418
+ font-size: var(--font-size-sm);
419
+ list-style-type: disc;
420
+ }
421
+
422
+ .burnout-indicators li,
423
+ .wellbeing-indicators li {
424
+ margin-bottom: var(--spacing-xs);
425
+ }
426
+
427
+ .burnout-message,
428
+ .wellbeing-message {
429
+ margin-top: var(--spacing-sm);
430
+ padding: var(--spacing-sm);
431
+ background: rgba(35, 134, 54, 0.1);
432
+ border-left: 3px solid var(--status-success);
433
+ color: var(--text-secondary);
434
+ font-size: var(--font-size-sm);
435
+ }
436
+
437
+ /* Chronotype dual display */
438
+ .chronotype-display {
439
+ display: flex;
440
+ flex-direction: column;
441
+ gap: 2px;
442
+ }
443
+
444
+ .chronotype-display .chronotype-label {
445
+ font-size: var(--font-size-lg);
446
+ font-weight: var(--font-weight-medium);
447
+ color: var(--text-primary);
448
+ }
449
+
450
+ .chronotype-display .chronotype-detail {
451
+ font-size: var(--font-size-xs);
452
+ color: var(--text-muted);
453
+ }
454
+
455
+ .chronotype-insight {
456
+ padding: var(--spacing-md);
457
+ background: var(--bg-primary);
458
+ border: 1px solid var(--border-default);
459
+ border-radius: var(--radius-md);
460
+ color: var(--text-secondary);
461
+ font-size: var(--font-size-sm);
462
+ }
463
+
464
+ /* === Commit Quality Section === */
465
+ .commit-quality-section {
466
+ margin-top: var(--spacing-xl);
467
+ padding-top: var(--spacing-lg);
468
+ border-top: 1px solid var(--border-default);
469
+ }
470
+
471
+ .commit-quality-section h2 {
472
+ font-size: var(--font-size-xl);
473
+ margin-bottom: var(--spacing-md);
474
+ color: var(--text-primary);
475
+ }
476
+
477
+ .commit-quality-section h3 {
478
+ font-size: var(--font-size-lg);
479
+ margin: var(--spacing-md) 0 var(--spacing-md) 0;
480
+ color: var(--text-primary);
481
+ }
482
+
483
+ .quality-summary {
484
+ display: flex;
485
+ gap: var(--spacing-xl);
486
+ align-items: center;
487
+ margin-bottom: var(--spacing-lg);
488
+ }
489
+
490
+ .quality-score-circle {
491
+ text-align: center;
492
+ }
493
+
494
+ /* New professional score display */
495
+ .quality-score-display {
496
+ text-align: center;
497
+ padding: var(--spacing-md);
498
+ background: var(--bg-primary);
499
+ border: 1px solid var(--border-default);
500
+ border-radius: var(--radius-md);
501
+ min-width: 120px;
502
+ }
503
+
504
+ .quality-score-display .score-value {
505
+ font-size: 36px;
506
+ font-weight: var(--font-weight-semibold);
507
+ color: var(--text-primary);
508
+ line-height: 1;
509
+ }
510
+
511
+ .quality-score-display .score-max {
512
+ font-size: var(--font-size-md);
513
+ color: var(--text-muted);
514
+ margin-left: 2px;
515
+ }
516
+
517
+ .quality-score-display .score-label {
518
+ font-size: var(--font-size-sm);
519
+ color: var(--accent-green);
520
+ font-weight: var(--font-weight-medium);
521
+ margin-top: var(--spacing-xs);
522
+ }
523
+
524
+ .quality-rating {
525
+ font-size: var(--font-size-2xl);
526
+ margin-top: var(--spacing-sm);
527
+ }
528
+
529
+ .big-number {
530
+ font-size: 48px;
531
+ font-weight: var(--font-weight-semibold);
532
+ color: var(--text-primary);
533
+ margin: var(--spacing-sm) 0;
534
+ }
535
+
536
+ .quality-level {
537
+ font-size: var(--font-size-md);
538
+ color: var(--text-secondary);
539
+ margin-top: var(--spacing-xs);
540
+ }
541
+
542
+ .quality-breakdown {
543
+ flex: 1;
544
+ display: flex;
545
+ flex-direction: column;
546
+ gap: var(--spacing-md);
547
+ }
548
+
549
+ .quality-metric {
550
+ display: grid;
551
+ grid-template-columns: 150px 1fr 80px;
552
+ align-items: center;
553
+ gap: var(--spacing-md);
554
+ }
555
+
556
+ .metric-label {
557
+ font-size: var(--font-size-sm);
558
+ color: var(--text-secondary);
559
+ }
560
+
561
+ .metric-bar-container {
562
+ height: 8px;
563
+ background: var(--border-subtle);
564
+ border-radius: var(--radius-md);
565
+ overflow: hidden;
566
+ }
567
+
568
+ .metric-bar {
569
+ height: 100%;
570
+ background: var(--accent-green);
571
+ border-radius: var(--radius-md);
572
+ transition: width 0.3s ease;
573
+ }
574
+
575
+ .metric-value {
576
+ font-size: var(--font-size-sm);
577
+ color: var(--text-primary);
578
+ text-align: right;
579
+ }
580
+
581
+ .commit-types-chart {
582
+ margin: var(--spacing-lg) 0;
583
+ padding: var(--spacing-md);
584
+ background: var(--bg-primary);
585
+ border: 1px solid var(--border-default);
586
+ border-radius: var(--radius-md);
587
+ }
588
+
589
+ .commit-types-chart h3 {
590
+ font-size: var(--font-size-md);
591
+ color: var(--text-primary);
592
+ margin-bottom: var(--spacing-md);
593
+ }
594
+
595
+ .commit-types-list {
596
+ display: flex;
597
+ flex-wrap: wrap;
598
+ gap: var(--spacing-sm);
599
+ }
600
+
601
+ .commit-type-row {
602
+ display: inline-flex;
603
+ align-items: center;
604
+ gap: var(--spacing-xs);
605
+ padding: var(--spacing-xs) var(--spacing-sm);
606
+ background: var(--bg-secondary);
607
+ border-radius: var(--radius-md);
608
+ transition: background-color var(--transition-fast);
609
+ }
610
+
611
+ .commit-type-row:hover {
612
+ background: var(--bg-tertiary);
613
+ }
614
+
615
+ .commit-type {
616
+ font-size: var(--font-size-sm);
617
+ color: var(--text-link);
618
+ font-weight: var(--font-weight-semibold);
619
+ }
620
+
621
+ .commit-type-count {
622
+ font-size: var(--font-size-sm);
623
+ color: var(--text-primary);
624
+ font-weight: var(--font-weight-semibold);
625
+ background: var(--border-subtle);
626
+ padding: var(--spacing-xs) var(--spacing-sm);
627
+ border-radius: 12px;
628
+ }
629
+
630
+ .types-grid {
631
+ display: flex;
632
+ flex-direction: column;
633
+ gap: var(--spacing-sm);
634
+ }
635
+
636
+ .type-item {
637
+ display: grid;
638
+ grid-template-columns: 100px 1fr 120px;
639
+ align-items: center;
640
+ gap: var(--spacing-md);
641
+ }
642
+
643
+ .type-label {
644
+ font-size: var(--font-size-sm);
645
+ color: var(--text-link);
646
+ font-weight: var(--font-weight-semibold);
647
+ }
648
+
649
+ .type-bar-container {
650
+ height: 6px;
651
+ background: var(--border-subtle);
652
+ border-radius: var(--radius-sm);
653
+ overflow: hidden;
654
+ }
655
+
656
+ .type-bar {
657
+ height: 100%;
658
+ background: var(--accent-blue);
659
+ border-radius: var(--radius-sm);
660
+ transition: width 0.3s ease;
661
+ }
662
+
663
+ .type-count {
664
+ font-size: var(--font-size-sm);
665
+ color: var(--text-secondary);
666
+ text-align: right;
667
+ }
668
+
669
+ /* === Quality Improvements === */
670
+ .quality-improvements {
671
+ padding: var(--spacing-md);
672
+ background: rgba(88, 166, 255, 0.1);
673
+ border: 1px solid var(--accent-blue);
674
+ border-radius: var(--radius-md);
675
+ margin: var(--spacing-md) 0;
676
+ }
677
+
678
+ .improvements-list {
679
+ margin: var(--spacing-sm) 0 0 var(--spacing-md);
680
+ color: var(--text-secondary);
681
+ font-size: var(--font-size-sm);
682
+ }
683
+
684
+ .improvements-list li {
685
+ margin-bottom: var(--spacing-sm);
686
+ }
687
+
688
+ .improvement-tips {
689
+ margin-top: var(--spacing-md);
690
+ padding: var(--spacing-md);
691
+ background: var(--bg-secondary);
692
+ border: 1px solid var(--border-default);
693
+ border-radius: var(--radius-md);
694
+ border-left: 3px solid var(--accent-blue);
695
+ }
696
+
697
+ .improvement-tips h3 {
698
+ font-size: var(--font-size-md);
699
+ color: var(--accent-blue);
700
+ margin-bottom: var(--spacing-sm);
701
+ }
702
+
703
+ .improvement-tips ul {
704
+ margin: 0;
705
+ padding-left: var(--spacing-md);
706
+ }
707
+
708
+ .improvement-tips li {
709
+ color: var(--text-primary);
710
+ font-size: var(--font-size-sm);
711
+ line-height: 1.6;
712
+ margin-bottom: var(--spacing-sm);
713
+ }
714
+
715
+ /* === Code Hygiene (formerly Shame Metrics) === */
716
+ .shame-metrics,
717
+ .code-hygiene {
718
+ margin: var(--spacing-md) 0;
719
+ padding: var(--spacing-md);
720
+ background: rgba(158, 106, 3, 0.05);
721
+ border: 1px solid var(--border-default);
722
+ border-radius: var(--radius-md);
723
+ cursor: pointer;
724
+ }
725
+
726
+ .shame-metrics summary,
727
+ .code-hygiene summary {
728
+ font-size: var(--font-size-md);
729
+ color: var(--text-primary);
730
+ user-select: none;
731
+ list-style: none;
732
+ display: flex;
733
+ align-items: center;
734
+ gap: var(--spacing-sm);
735
+ }
736
+
737
+ .shame-metrics summary::-webkit-details-marker,
738
+ .code-hygiene summary::-webkit-details-marker {
739
+ display: none;
740
+ }
741
+
742
+ .shame-content,
743
+ .code-hygiene-content {
744
+ margin-top: var(--spacing-md);
745
+ padding-top: var(--spacing-md);
746
+ border-top: 1px solid var(--border-default);
747
+ }
748
+
749
+ .shame-item,
750
+ .hygiene-item {
751
+ padding: var(--spacing-sm);
752
+ margin-bottom: var(--spacing-sm);
753
+ color: var(--text-secondary);
754
+ font-size: var(--font-size-sm);
755
+ }
756
+
757
+ /* === File Hotspots Section === */
758
+ .file-hotspots-section {
759
+ margin-top: var(--spacing-xl);
760
+ padding-top: var(--spacing-lg);
761
+ border-top: 1px solid var(--border-default);
762
+ }
763
+
764
+ .file-hotspots-section h2 {
765
+ font-size: var(--font-size-xl);
766
+ margin-bottom: var(--spacing-md);
767
+ color: var(--text-primary);
768
+ }
769
+
770
+ .file-hotspots-section h3 {
771
+ font-size: var(--font-size-md);
772
+ margin-bottom: var(--spacing-md);
773
+ color: var(--text-secondary);
774
+ text-transform: uppercase;
775
+ letter-spacing: 0.5px;
776
+ font-weight: var(--font-weight-medium);
777
+ }
778
+
779
+ .hotspots-grid {
780
+ display: grid;
781
+ grid-template-columns: 1fr 1fr;
782
+ gap: var(--spacing-md);
783
+ margin-bottom: var(--spacing-md);
784
+ }
785
+
786
+ .top-files-panel, .technical-debt-panel {
787
+ background: var(--bg-primary);
788
+ border: 1px solid var(--border-default);
789
+ border-radius: var(--radius-md);
790
+ padding: var(--spacing-md);
791
+ }
792
+
793
+ .file-list, .debt-list {
794
+ display: flex;
795
+ flex-direction: column;
796
+ gap: var(--spacing-sm);
797
+ }
798
+
799
+ .file-item {
800
+ padding: var(--spacing-sm);
801
+ background: var(--bg-secondary);
802
+ border-radius: var(--radius-md);
803
+ border: 1px solid var(--border-default);
804
+ }
805
+
806
+ .file-path {
807
+ font-family: var(--font-mono);
808
+ font-size: var(--font-size-sm);
809
+ color: var(--text-link);
810
+ margin-bottom: var(--spacing-xs);
811
+ overflow: hidden;
812
+ text-overflow: ellipsis;
813
+ white-space: nowrap;
814
+ }
815
+
816
+ .file-stats {
817
+ display: flex;
818
+ gap: var(--spacing-sm);
819
+ margin-bottom: var(--spacing-sm);
820
+ font-size: var(--font-size-xs);
821
+ color: var(--text-secondary);
822
+ }
823
+
824
+ .change-count, .author-count {
825
+ padding: 2px 6px;
826
+ background: var(--border-subtle);
827
+ border-radius: var(--radius-sm);
828
+ }
829
+
830
+ .complexity-badge {
831
+ padding: 2px 6px;
832
+ border-radius: var(--radius-sm);
833
+ font-weight: var(--font-weight-semibold);
834
+ }
835
+
836
+ .complexity-critical { background: var(--status-danger); color: white; }
837
+ .complexity-high { background: #f0883e; color: white; }
838
+ .complexity-medium { background: var(--status-warning); color: white; }
839
+ .complexity-low { background: var(--status-success); color: white; }
840
+
841
+ .file-bar {
842
+ height: 4px;
843
+ background: var(--border-subtle);
844
+ border-radius: var(--radius-sm);
845
+ overflow: hidden;
846
+ }
847
+
848
+ .file-bar-fill {
849
+ height: 100%;
850
+ background: var(--status-danger);
851
+ transition: width 0.3s;
852
+ }
853
+
854
+ .debt-item {
855
+ padding: var(--spacing-sm);
856
+ background: var(--bg-secondary);
857
+ border-radius: var(--radius-md);
858
+ border-left: 3px solid var(--border-default);
859
+ }
860
+
861
+ .debt-item.debt-critical { border-left-color: var(--status-danger); }
862
+ .debt-item.debt-high { border-left-color: #f0883e; }
863
+ .debt-item.debt-medium { border-left-color: var(--status-warning); }
864
+
865
+ .debt-header {
866
+ display: flex;
867
+ align-items: center;
868
+ gap: var(--spacing-sm);
869
+ margin-bottom: var(--spacing-xs);
870
+ }
871
+
872
+ .debt-icon {
873
+ font-size: var(--font-size-md);
874
+ }
875
+
876
+ .debt-file {
877
+ font-family: var(--font-mono);
878
+ font-size: var(--font-size-xs);
879
+ color: var(--text-link);
880
+ overflow: hidden;
881
+ text-overflow: ellipsis;
882
+ white-space: nowrap;
883
+ }
884
+
885
+ .debt-details {
886
+ display: flex;
887
+ gap: var(--spacing-sm);
888
+ margin-bottom: var(--spacing-xs);
889
+ font-size: 10px;
890
+ }
891
+
892
+ .debt-risk {
893
+ padding: 2px 6px;
894
+ background: var(--border-subtle);
895
+ border-radius: var(--radius-sm);
896
+ color: var(--status-danger);
897
+ font-weight: var(--font-weight-semibold);
898
+ }
899
+
900
+ .debt-score {
901
+ padding: 2px 6px;
902
+ background: var(--border-subtle);
903
+ border-radius: var(--radius-sm);
904
+ color: var(--text-secondary);
905
+ }
906
+
907
+ .debt-recommendation {
908
+ font-size: var(--font-size-xs);
909
+ color: var(--text-secondary);
910
+ padding-top: var(--spacing-xs);
911
+ border-top: 1px solid var(--border-subtle);
912
+ }
913
+
914
+ /* === Ownership Risks === */
915
+ .ownership-risks-panel {
916
+ margin-top: var(--spacing-md);
917
+ background: var(--bg-primary);
918
+ border: 1px solid var(--border-default);
919
+ border-radius: var(--radius-md);
920
+ padding: var(--spacing-md);
921
+ }
922
+
923
+ .ownership-list {
924
+ display: grid;
925
+ grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
926
+ gap: var(--spacing-sm);
927
+ }
928
+
929
+ .ownership-item {
930
+ padding: var(--spacing-sm);
931
+ background: var(--bg-secondary);
932
+ border-radius: var(--radius-md);
933
+ border-left: 3px solid var(--status-warning);
934
+ }
935
+
936
+ .ownership-item.risk-critical {
937
+ border-left-color: var(--status-danger);
938
+ }
939
+
940
+ .ownership-header {
941
+ display: flex;
942
+ align-items: center;
943
+ gap: var(--spacing-sm);
944
+ margin-bottom: var(--spacing-sm);
945
+ }
946
+
947
+ .ownership-icon {
948
+ font-size: var(--font-size-md);
949
+ }
950
+
951
+ .ownership-file {
952
+ font-family: var(--font-mono);
953
+ font-size: var(--font-size-xs);
954
+ color: var(--text-link);
955
+ overflow: hidden;
956
+ text-overflow: ellipsis;
957
+ white-space: nowrap;
958
+ flex: 1;
959
+ }
960
+
961
+ .ownership-owner {
962
+ font-size: var(--font-size-sm);
963
+ color: var(--text-primary);
964
+ margin-bottom: var(--spacing-xs);
965
+ }
966
+
967
+ .ownership-others {
968
+ font-size: 10px;
969
+ color: var(--text-secondary);
970
+ }
971
+
972
+ /* === Developer Analysis === */
973
+ .developer-analysis {
974
+ margin-top: var(--spacing-xl);
975
+ padding-top: var(--spacing-lg);
976
+ border-top: 1px solid var(--border-default);
977
+ }
978
+
979
+ .developer-analysis h2 {
980
+ font-size: var(--font-size-xl);
981
+ margin-bottom: var(--spacing-md);
982
+ color: var(--text-primary);
983
+ }
984
+
985
+ .developer-row {
986
+ margin-bottom: var(--spacing-md);
987
+ padding: var(--spacing-md);
988
+ background: var(--bg-primary);
989
+ border: 1px solid var(--border-default);
990
+ border-radius: var(--radius-md);
991
+ transition: border-color var(--transition-fast);
992
+ }
993
+
994
+ .developer-row:hover {
995
+ border-color: var(--border-emphasis);
996
+ }
997
+
998
+ .developer-info {
999
+ margin-bottom: var(--spacing-sm);
1000
+ }
1001
+
1002
+ .developer-name {
1003
+ font-size: var(--font-size-lg);
1004
+ font-weight: var(--font-weight-semibold);
1005
+ color: var(--text-link);
1006
+ margin-bottom: var(--spacing-xs);
1007
+ }
1008
+
1009
+ .developer-date-range {
1010
+ font-size: var(--font-size-sm);
1011
+ color: var(--text-secondary);
1012
+ }
1013
+
1014
+ .developer-stats {
1015
+ display: flex;
1016
+ align-items: center;
1017
+ gap: var(--spacing-md);
1018
+ }
1019
+
1020
+ .developer-bar-container {
1021
+ flex: 1;
1022
+ height: 8px;
1023
+ background: var(--border-subtle);
1024
+ border-radius: var(--radius-md);
1025
+ overflow: hidden;
1026
+ }
1027
+
1028
+ .developer-bar {
1029
+ height: 100%;
1030
+ background: var(--accent-green);
1031
+ border-radius: var(--radius-md);
1032
+ transition: width 0.3s ease;
1033
+ }
1034
+
1035
+ .developer-count {
1036
+ font-size: var(--font-size-md);
1037
+ color: var(--text-secondary);
1038
+ white-space: nowrap;
1039
+ min-width: 140px;
1040
+ text-align: right;
1041
+ }
1042
+
1043
+ /* === Enterprise Insights: Impact Analysis === */
1044
+ .impact-section,
1045
+ .knowledge-section {
1046
+ margin-top: var(--spacing-xl);
1047
+ padding-top: var(--spacing-lg);
1048
+ border-top: 1px solid var(--border-default);
1049
+ }
1050
+
1051
+ .impact-section h2,
1052
+ .knowledge-section h2 {
1053
+ font-size: var(--font-size-xl);
1054
+ margin-bottom: var(--spacing-md);
1055
+ color: var(--text-primary);
1056
+ }
1057
+
1058
+ .impact-section h3,
1059
+ .knowledge-section h3 {
1060
+ font-size: var(--font-size-lg);
1061
+ margin: var(--spacing-lg) 0 var(--spacing-md) 0;
1062
+ color: var(--text-primary);
1063
+ }
1064
+
1065
+ .impact-overview {
1066
+ display: flex;
1067
+ gap: var(--spacing-xl);
1068
+ align-items: flex-start;
1069
+ flex-wrap: wrap;
1070
+ }
1071
+
1072
+ .impact-score-display {
1073
+ display: flex;
1074
+ flex-direction: column;
1075
+ align-items: center;
1076
+ padding: var(--spacing-lg);
1077
+ background: var(--bg-primary);
1078
+ border: 1px solid var(--border-default);
1079
+ border-radius: var(--radius-md);
1080
+ min-width: 140px;
1081
+ }
1082
+
1083
+ .impact-score-display .score-circle {
1084
+ display: flex;
1085
+ align-items: baseline;
1086
+ margin-bottom: var(--spacing-sm);
1087
+ }
1088
+
1089
+ .impact-score-display .score-value {
1090
+ font-size: 48px;
1091
+ font-weight: var(--font-weight-semibold);
1092
+ color: var(--accent-blue);
1093
+ }
1094
+
1095
+ .impact-score-display .score-max {
1096
+ font-size: var(--font-size-lg);
1097
+ color: var(--text-muted);
1098
+ margin-left: 2px;
1099
+ }
1100
+
1101
+ .impact-score-display .score-meta {
1102
+ display: flex;
1103
+ flex-direction: column;
1104
+ align-items: center;
1105
+ gap: var(--spacing-xs);
1106
+ }
1107
+
1108
+ .impact-score-display .score-label {
1109
+ font-size: var(--font-size-sm);
1110
+ color: var(--text-secondary);
1111
+ text-transform: uppercase;
1112
+ letter-spacing: 0.5px;
1113
+ }
1114
+
1115
+ .impact-score-display .score-trend {
1116
+ font-size: var(--font-size-sm);
1117
+ font-weight: var(--font-weight-medium);
1118
+ }
1119
+
1120
+ .score-trend.trend-up { color: var(--accent-green); }
1121
+ .score-trend.trend-down { color: var(--status-danger); }
1122
+ .score-trend.trend-stable { color: var(--text-muted); }
1123
+
1124
+ .impact-breakdown {
1125
+ flex: 1;
1126
+ min-width: 250px;
1127
+ }
1128
+
1129
+ .breakdown-items {
1130
+ display: flex;
1131
+ flex-direction: column;
1132
+ gap: var(--spacing-md);
1133
+ }
1134
+
1135
+ .breakdown-item {
1136
+ display: flex;
1137
+ flex-direction: column;
1138
+ gap: var(--spacing-xs);
1139
+ }
1140
+
1141
+ .breakdown-header {
1142
+ display: flex;
1143
+ justify-content: space-between;
1144
+ font-size: var(--font-size-sm);
1145
+ }
1146
+
1147
+ .breakdown-label { color: var(--text-secondary); }
1148
+ .breakdown-value { color: var(--text-primary); font-weight: var(--font-weight-medium); }
1149
+
1150
+ .breakdown-bar {
1151
+ height: 8px;
1152
+ background: var(--border-subtle);
1153
+ border-radius: var(--radius-md);
1154
+ overflow: hidden;
1155
+ }
1156
+
1157
+ .breakdown-fill {
1158
+ height: 100%;
1159
+ border-radius: var(--radius-md);
1160
+ transition: width 0.3s ease;
1161
+ }
1162
+
1163
+ .breakdown-fill.core { background: var(--accent-purple); }
1164
+ .breakdown-fill.feature { background: var(--accent-blue); }
1165
+ .breakdown-fill.maintenance { background: var(--accent-green); }
1166
+ .breakdown-fill.docs { background: var(--tier-gold); }
1167
+
1168
+ /* Data Tables */
1169
+ .data-table {
1170
+ width: 100%;
1171
+ border-collapse: collapse;
1172
+ font-size: var(--font-size-sm);
1173
+ margin-top: var(--spacing-md);
1174
+ }
1175
+
1176
+ .data-table th {
1177
+ text-align: left;
1178
+ padding: var(--spacing-sm);
1179
+ border-bottom: 1px solid var(--border-default);
1180
+ color: var(--text-secondary);
1181
+ font-weight: var(--font-weight-medium);
1182
+ text-transform: uppercase;
1183
+ font-size: var(--font-size-xs);
1184
+ letter-spacing: 0.5px;
1185
+ }
1186
+
1187
+ .data-table td {
1188
+ padding: var(--spacing-sm);
1189
+ border-bottom: 1px solid var(--border-subtle);
1190
+ color: var(--text-primary);
1191
+ }
1192
+
1193
+ .data-table tbody tr:hover {
1194
+ background: var(--bg-tertiary);
1195
+ }
1196
+
1197
+ .file-path,
1198
+ .dir-path {
1199
+ font-family: var(--font-mono);
1200
+ font-size: var(--font-size-xs);
1201
+ color: var(--text-secondary);
1202
+ }
1203
+
1204
+ .category-badge {
1205
+ display: inline-block;
1206
+ padding: 2px 6px;
1207
+ border-radius: var(--radius-sm);
1208
+ font-size: 10px;
1209
+ font-weight: var(--font-weight-medium);
1210
+ text-transform: uppercase;
1211
+ }
1212
+
1213
+ .category-badge.core { background: rgba(139, 92, 246, 0.2); color: var(--accent-purple); }
1214
+ .category-badge.feature { background: rgba(88, 166, 255, 0.2); color: var(--accent-blue); }
1215
+ .category-badge.test { background: rgba(63, 185, 80, 0.2); color: var(--accent-green); }
1216
+ .category-badge.config { background: rgba(212, 167, 44, 0.2); color: var(--tier-gold); }
1217
+ .category-badge.docs { background: rgba(139, 148, 158, 0.2); color: var(--text-secondary); }
1218
+
1219
+ .impact-badge {
1220
+ display: inline-block;
1221
+ padding: 2px 8px;
1222
+ background: var(--bg-tertiary);
1223
+ border-radius: var(--radius-sm);
1224
+ font-weight: var(--font-weight-medium);
1225
+ color: var(--accent-blue);
1226
+ }
1227
+
1228
+ .insights-list,
1229
+ .recommendations {
1230
+ margin-top: var(--spacing-lg);
1231
+ padding: var(--spacing-md);
1232
+ background: var(--bg-primary);
1233
+ border: 1px solid var(--border-default);
1234
+ border-radius: var(--radius-md);
1235
+ }
1236
+
1237
+ .insights-list ul,
1238
+ .recommendations ul {
1239
+ margin: 0;
1240
+ padding-left: var(--spacing-lg);
1241
+ color: var(--text-secondary);
1242
+ }
1243
+
1244
+ .insights-list li,
1245
+ .recommendations li {
1246
+ margin-bottom: var(--spacing-sm);
1247
+ line-height: 1.5;
1248
+ }
1249
+
1250
+ /* === Enterprise Insights: Knowledge Distribution === */
1251
+ .bus-factor-summary {
1252
+ display: flex;
1253
+ align-items: center;
1254
+ gap: var(--spacing-lg);
1255
+ padding: var(--spacing-md);
1256
+ background: var(--bg-primary);
1257
+ border: 1px solid var(--border-default);
1258
+ border-radius: var(--radius-md);
1259
+ margin-bottom: var(--spacing-lg);
1260
+ }
1261
+
1262
+ .risk-indicator {
1263
+ display: flex;
1264
+ align-items: baseline;
1265
+ padding: var(--spacing-md);
1266
+ border-radius: var(--radius-md);
1267
+ min-width: 80px;
1268
+ justify-content: center;
1269
+ }
1270
+
1271
+ .risk-indicator .risk-value {
1272
+ font-size: 32px;
1273
+ font-weight: var(--font-weight-semibold);
1274
+ }
1275
+
1276
+ .risk-indicator .risk-scale {
1277
+ font-size: var(--font-size-md);
1278
+ opacity: 0.7;
1279
+ }
1280
+
1281
+ .risk-indicator.risk-critical { background: rgba(218, 54, 51, 0.2); color: var(--status-danger); }
1282
+ .risk-indicator.risk-high { background: rgba(240, 136, 62, 0.2); color: #f0883e; }
1283
+ .risk-indicator.risk-medium { background: rgba(158, 106, 3, 0.2); color: var(--tier-gold); }
1284
+ .risk-indicator.risk-low { background: rgba(35, 134, 54, 0.2); color: var(--accent-green); }
1285
+
1286
+ .risk-meta {
1287
+ display: flex;
1288
+ flex-direction: column;
1289
+ gap: var(--spacing-xs);
1290
+ }
1291
+
1292
+ .risk-label {
1293
+ font-size: var(--font-size-sm);
1294
+ color: var(--text-secondary);
1295
+ text-transform: uppercase;
1296
+ letter-spacing: 0.5px;
1297
+ }
1298
+
1299
+ .risk-level {
1300
+ font-size: var(--font-size-md);
1301
+ font-weight: var(--font-weight-semibold);
1302
+ color: var(--text-primary);
1303
+ }
1304
+
1305
+ .ownership-bar-mini {
1306
+ display: inline-block;
1307
+ width: 60px;
1308
+ height: 6px;
1309
+ background: var(--border-subtle);
1310
+ border-radius: var(--radius-sm);
1311
+ overflow: hidden;
1312
+ vertical-align: middle;
1313
+ margin-right: var(--spacing-xs);
1314
+ }
1315
+
1316
+ .ownership-fill {
1317
+ height: 100%;
1318
+ background: var(--accent-blue);
1319
+ border-radius: var(--radius-sm);
1320
+ }
1321
+
1322
+ .ownership-percent {
1323
+ font-size: var(--font-size-xs);
1324
+ color: var(--text-muted);
1325
+ }
1326
+
1327
+ .ownership-type {
1328
+ display: inline-block;
1329
+ padding: 2px 6px;
1330
+ border-radius: var(--radius-sm);
1331
+ font-size: 10px;
1332
+ font-weight: var(--font-weight-medium);
1333
+ text-transform: uppercase;
1334
+ }
1335
+
1336
+ .ownership-type.type-solo { background: rgba(218, 54, 51, 0.2); color: var(--status-danger); }
1337
+ .ownership-type.type-primary { background: rgba(240, 136, 62, 0.2); color: #f0883e; }
1338
+ .ownership-type.type-shared { background: rgba(158, 106, 3, 0.2); color: var(--tier-gold); }
1339
+ .ownership-type.type-collaborative { background: rgba(35, 134, 54, 0.2); color: var(--accent-green); }
1340
+
1341
+ .risk-badge {
1342
+ display: inline-block;
1343
+ padding: 2px 8px;
1344
+ border-radius: var(--radius-sm);
1345
+ font-size: var(--font-size-xs);
1346
+ font-weight: var(--font-weight-semibold);
1347
+ }
1348
+
1349
+ .risk-badge.risk-critical { background: rgba(218, 54, 51, 0.2); color: var(--status-danger); }
1350
+ .risk-badge.risk-high { background: rgba(240, 136, 62, 0.2); color: #f0883e; }
1351
+ .risk-badge.risk-medium { background: rgba(158, 106, 3, 0.2); color: var(--tier-gold); }
1352
+ .risk-badge.risk-low { background: rgba(35, 134, 54, 0.2); color: var(--accent-green); }
1353
+
1354
+ .knowledge-warnings,
1355
+ .shared-knowledge {
1356
+ margin-top: var(--spacing-lg);
1357
+ padding: var(--spacing-md);
1358
+ border-radius: var(--radius-md);
1359
+ }
1360
+
1361
+ .knowledge-warnings {
1362
+ background: rgba(218, 54, 51, 0.05);
1363
+ border: 1px solid rgba(218, 54, 51, 0.3);
1364
+ }
1365
+
1366
+ .shared-knowledge {
1367
+ background: rgba(35, 134, 54, 0.05);
1368
+ border: 1px solid rgba(35, 134, 54, 0.3);
1369
+ }
1370
+
1371
+ .warning-intro,
1372
+ .success-intro {
1373
+ font-size: var(--font-size-sm);
1374
+ color: var(--text-secondary);
1375
+ margin-bottom: var(--spacing-sm);
1376
+ }
1377
+
1378
+ .silo-list,
1379
+ .shared-list {
1380
+ margin: 0;
1381
+ padding-left: var(--spacing-lg);
1382
+ font-size: var(--font-size-sm);
1383
+ color: var(--text-primary);
1384
+ }
1385
+
1386
+ .silo-list li,
1387
+ .shared-list li {
1388
+ margin-bottom: var(--spacing-xs);
1389
+ font-family: var(--font-mono);
1390
+ }
1391
+