@eveshipfit/ui-ingame 1.12.0 → 1.14.0

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 (5) hide show
  1. package/dist/index.d.mts +3 -1
  2. package/dist/index.mjs +2906 -1179
  3. package/dist/style.css +1433 -984
  4. package/dist/theme.css +1 -0
  5. package/package.json +4 -4
package/dist/style.css CHANGED
@@ -478,6 +478,18 @@
478
478
  position: absolute;
479
479
  }
480
480
 
481
+ .T6VD6G_mutated {
482
+ background: var(--esf-mutated);
483
+ border-radius: var(--wheel-unit);
484
+ box-shadow: 0 0 calc(5 * var(--wheel-unit)) var(--esf-mutated);
485
+ height: calc(3 * var(--wheel-unit));
486
+ left: 50%;
487
+ top: calc(3 * var(--wheel-unit));
488
+ width: calc(16 * var(--wheel-unit));
489
+ position: absolute;
490
+ translate: -50%;
491
+ }
492
+
481
493
  .T6VD6G_fill, .T6VD6G_frame {
482
494
  background: var(--colour);
483
495
  mask: var(--texture) center / 100% 100%;
@@ -947,6 +959,13 @@
947
959
  outline: none;
948
960
  }
949
961
 
962
+ .BL_QfG_menu > button:disabled {
963
+ color: var(--esf-text-muted);
964
+ cursor: default;
965
+ opacity: .6;
966
+ background: none;
967
+ }
968
+
950
969
  .BL_QfG_icon {
951
970
  height: calc(16 * var(--menu-unit));
952
971
  width: calc(16 * var(--menu-unit));
@@ -1398,1519 +1417,1949 @@
1398
1417
  height: calc(15.5 * var(--service-unit));
1399
1418
  width: calc(15.5 * var(--service-unit));
1400
1419
  }
1401
- .TufZMa_card {
1402
- --info-unit: calc(1px * var(--esf-scale, 1));
1403
- background: var(--esf-bg);
1404
- border: 1px solid var(--esf-border);
1405
- box-shadow: 0 calc(8 * var(--info-unit)) calc(30 * var(--info-unit)) #0009;
1406
- box-sizing: border-box;
1420
+ .xFSZwa_browser {
1421
+ --browser-unit: calc(1px * var(--esf-scale, 1));
1407
1422
  color: var(--esf-text);
1408
1423
  font-family: var(--esf-font);
1409
1424
  font-size: calc(var(--esf-font-size) * var(--esf-scale, 1));
1410
- max-height: min(calc(460 * var(--info-unit)), calc(100vh - 16px));
1411
- padding: calc(10 * var(--info-unit)) calc(12 * var(--info-unit)) calc(6 * var(--info-unit));
1412
- user-select: text;
1413
- width: calc(330 * var(--info-unit));
1425
+ user-select: none;
1426
+ height: 100%;
1427
+ width: calc(393 * var(--browser-unit));
1414
1428
  flex-direction: column;
1415
- margin: auto;
1416
- inset: 0;
1429
+ display: flex;
1417
1430
  }
1418
1431
 
1419
- .TufZMa_card:popover-open {
1432
+ .xFSZwa_tabs {
1433
+ --corner: calc(6 * var(--browser-unit));
1434
+ clip-path: polygon(0 0,
1435
+ 100% 0,
1436
+ 100% calc(100% - var(--corner)),
1437
+ calc(100% - var(--corner)) 100%,
1438
+ var(--corner) 100%,
1439
+ 0 calc(100% - var(--corner)));
1440
+ gap: calc(4 * var(--browser-unit));
1420
1441
  display: flex;
1421
1442
  }
1422
1443
 
1423
- .TufZMa_card[data-side] {
1424
- margin: 0 calc(8 * var(--info-unit));
1425
- position-anchor: var(--item-info-anchor);
1426
- position-try-fallbacks: flip-block,
1427
- flip-inline,
1428
- flip-block flip-inline;
1429
- inset: auto;
1444
+ .xFSZwa_tab {
1445
+ background: var(--esf-tab);
1446
+ color: inherit;
1447
+ cursor: default;
1448
+ font: inherit;
1449
+ height: calc(24 * var(--browser-unit));
1450
+ border: none;
1451
+ flex: 1;
1452
+ padding: 0;
1430
1453
  }
1431
1454
 
1432
- .TufZMa_card[data-side="left"] {
1433
- position-area: left span-bottom;
1455
+ .xFSZwa_tab[aria-selected="true"] {
1456
+ background: var(--esf-tab-active);
1434
1457
  }
1435
1458
 
1436
- .TufZMa_card[data-side="right"] {
1437
- position-area: right span-bottom;
1459
+ .xFSZwa_tab:focus-visible, .xFSZwa_collapse:focus-visible {
1460
+ outline: var(--browser-unit) solid var(--esf-text);
1438
1461
  }
1439
1462
 
1440
- .TufZMa_close {
1441
- cursor: pointer;
1442
- opacity: .6;
1443
- right: calc(8 * var(--info-unit));
1444
- top: calc(8 * var(--info-unit));
1445
- background: none;
1446
- border: none;
1447
- padding: 0;
1448
- display: flex;
1449
- position: absolute;
1463
+ .xFSZwa_tab:focus-visible {
1464
+ outline-offset: calc(-1 * var(--browser-unit));
1450
1465
  }
1451
1466
 
1452
- .TufZMa_close:hover, .TufZMa_close:focus-visible {
1453
- opacity: 1;
1467
+ .xFSZwa_panel {
1468
+ flex-direction: column;
1469
+ flex: 1;
1470
+ min-height: 0;
1471
+ display: flex;
1454
1472
  }
1455
1473
 
1456
- .TufZMa_close > img {
1457
- height: calc(14 * var(--info-unit));
1458
- width: calc(14 * var(--info-unit));
1474
+ .xFSZwa_panel[hidden] {
1475
+ display: none;
1459
1476
  }
1460
1477
 
1461
- .TufZMa_header {
1478
+ .xFSZwa_search {
1479
+ height: calc(32 * var(--browser-unit));
1480
+ margin-top: calc(8 * var(--browser-unit));
1462
1481
  align-items: center;
1463
- gap: calc(10 * var(--info-unit));
1464
- padding-right: calc(16 * var(--info-unit));
1465
1482
  display: flex;
1466
1483
  }
1467
1484
 
1468
- .TufZMa_typeIcon {
1469
- height: calc(64 * var(--info-unit));
1470
- width: calc(64 * var(--info-unit));
1471
- flex: none;
1472
- }
1473
-
1474
- .TufZMa_typeIcon > span {
1475
- width: 100%;
1476
- height: 100%;
1477
- display: block;
1485
+ .xFSZwa_collapse {
1486
+ cursor: pointer;
1487
+ opacity: .6;
1488
+ width: calc(28 * var(--browser-unit));
1489
+ background: none;
1490
+ border: none;
1491
+ justify-content: center;
1492
+ padding: 0;
1493
+ display: flex;
1478
1494
  }
1479
1495
 
1480
- .TufZMa_title {
1481
- gap: calc(2 * var(--info-unit));
1482
- flex-direction: column;
1483
- min-width: 0;
1484
- display: flex;
1496
+ .xFSZwa_collapse:hover, .xFSZwa_collapse:focus-visible {
1497
+ opacity: 1;
1485
1498
  }
1486
1499
 
1487
- .TufZMa_name {
1488
- font-size: inherit;
1489
- margin: 0;
1490
- font-weight: normal;
1500
+ .xFSZwa_collapse > img {
1501
+ height: calc(14 * var(--browser-unit));
1502
+ width: calc(14 * var(--browser-unit));
1491
1503
  }
1492
1504
 
1493
- .TufZMa_muted {
1494
- color: var(--esf-text-muted);
1505
+ .xFSZwa_field > img {
1506
+ height: calc(16 * var(--browser-unit));
1507
+ opacity: .5;
1508
+ width: calc(16 * var(--browser-unit));
1495
1509
  }
1496
1510
 
1497
- .TufZMa_tabs {
1498
- border-bottom: 1px solid var(--esf-input-border);
1499
- gap: calc(16 * var(--info-unit));
1500
- margin-top: calc(8 * var(--info-unit));
1511
+ .xFSZwa_field {
1512
+ background: var(--esf-input-bg);
1513
+ border: var(--browser-unit) solid var(--esf-input-border);
1514
+ align-self: stretch;
1515
+ align-items: center;
1516
+ gap: calc(5 * var(--browser-unit));
1517
+ padding-left: calc(12 * var(--browser-unit));
1518
+ flex: 1;
1501
1519
  display: flex;
1502
1520
  }
1503
1521
 
1504
- .TufZMa_tab {
1505
- color: var(--esf-text-muted);
1522
+ .xFSZwa_field > input {
1523
+ color: inherit;
1506
1524
  font: inherit;
1507
- padding: calc(4 * var(--info-unit)) 0 calc(6 * var(--info-unit));
1508
1525
  background: none;
1509
1526
  border: none;
1527
+ outline: none;
1528
+ flex: 1;
1529
+ min-width: 0;
1530
+ padding: 0;
1510
1531
  }
1511
1532
 
1512
- .TufZMa_tab[aria-selected="true"] {
1513
- box-shadow: inset 0 calc(-2 * var(--info-unit)) var(--esf-button-active-edge);
1514
- color: var(--esf-text);
1533
+ .xFSZwa_field > input::placeholder {
1534
+ color: var(--esf-text-muted);
1515
1535
  }
1516
1536
 
1517
- .TufZMa_panel {
1518
- flex-direction: column;
1519
- min-height: 0;
1537
+ .xFSZwa_field:focus-within {
1538
+ border-color: var(--esf-text-muted);
1539
+ }
1540
+
1541
+ .xFSZwa_filters {
1542
+ gap: calc(4 * var(--browser-unit));
1543
+ margin: calc(4 * var(--browser-unit)) 0 0;
1544
+ border: none;
1545
+ min-width: 0;
1546
+ padding: 0;
1520
1547
  display: flex;
1521
1548
  }
1522
1549
 
1523
- .TufZMa_list {
1524
- font-size: calc(11 * var(--info-unit));
1525
- margin: calc(4 * var(--info-unit)) calc(-12 * var(--info-unit)) 0;
1550
+ .xFSZwa_tree {
1551
+ margin-top: calc(8 * var(--browser-unit));
1552
+ flex: 1;
1526
1553
  min-height: 0;
1527
- padding: 0;
1528
- list-style: none;
1529
1554
  overflow-y: auto;
1530
1555
  }
1531
1556
 
1532
- .TufZMa_row {
1533
- align-items: center;
1534
- gap: calc(8 * var(--info-unit));
1535
- min-height: calc(26 * var(--info-unit));
1536
- padding: 0 calc(12 * var(--info-unit));
1537
- justify-content: space-between;
1538
- display: flex;
1557
+ .xFSZwa_empty {
1558
+ color: var(--esf-text-muted);
1559
+ font-size: calc(20 * var(--browser-unit));
1560
+ margin: calc(24 * var(--browser-unit)) 0 0;
1561
+ text-align: center;
1539
1562
  }
1540
1563
 
1541
- .TufZMa_row:hover {
1542
- background: var(--esf-tree-hover);
1564
+ .xFSZwa_hull {
1565
+ font-weight: 600;
1543
1566
  }
1544
1567
 
1545
- .TufZMa_row > dt {
1568
+ .xFSZwa_counts {
1569
+ display: flex;
1570
+ }
1571
+
1572
+ .xFSZwa_count {
1546
1573
  align-items: center;
1547
- gap: calc(6 * var(--info-unit));
1548
- min-width: 0;
1574
+ gap: calc(3 * var(--browser-unit));
1575
+ min-width: calc(39 * var(--browser-unit));
1549
1576
  display: flex;
1550
1577
  }
1551
1578
 
1552
- .TufZMa_row > dt > span:last-child {
1553
- text-overflow: ellipsis;
1579
+ .xFSZwa_count > img, .xFSZwa_kind > img {
1580
+ height: calc(12 * var(--browser-unit));
1581
+ width: calc(12 * var(--browser-unit));
1582
+ display: block;
1583
+ }
1584
+
1585
+ .xFSZwa_unseen {
1586
+ clip-path: inset(50%);
1554
1587
  white-space: nowrap;
1588
+ width: 1px;
1589
+ height: 1px;
1590
+ position: absolute;
1555
1591
  overflow: hidden;
1556
1592
  }
1557
1593
 
1558
- .TufZMa_row > dd {
1559
- font-variant-numeric: tabular-nums;
1560
- text-align: right;
1561
- white-space: nowrap;
1562
- margin: 0;
1594
+ .xFSZwa_kind {
1595
+ margin-right: calc(5 * var(--browser-unit));
1596
+ vertical-align: middle;
1597
+ display: inline-block;
1563
1598
  }
1564
1599
 
1565
- .TufZMa_icon {
1566
- height: calc(16 * var(--info-unit));
1567
- width: calc(16 * var(--info-unit));
1600
+ .xFSZwa_flyable {
1601
+ background: var(--esf-flyable);
1602
+ height: calc(12 * var(--browser-unit));
1603
+ mask: var(--texture) center / 100% 100%;
1604
+ width: calc(12 * var(--browser-unit));
1568
1605
  flex: none;
1569
1606
  }
1570
1607
 
1571
- .TufZMa_row > dd[data-change="better"] {
1572
- color: var(--esf-good);
1608
+ .xFSZwa_flyable[data-missing] {
1609
+ background: var(--esf-not-flyable);
1573
1610
  }
1574
1611
 
1575
- .TufZMa_row > dd[data-change="worse"] {
1576
- color: var(--esf-bad);
1612
+ .xFSZwa_simulate {
1613
+ cursor: pointer;
1614
+ opacity: .9;
1615
+ background: none;
1616
+ border: none;
1617
+ flex: none;
1618
+ padding: 0;
1619
+ display: flex;
1577
1620
  }
1578
1621
 
1579
- .TufZMa_metaGroup {
1580
- background: var(--esf-tree-header);
1581
- font-size: inherit;
1582
- margin: calc(4 * var(--info-unit)) 0 0;
1583
- padding: calc(5 * var(--info-unit)) calc(12 * var(--info-unit));
1584
- font-weight: normal;
1622
+ .xFSZwa_simulate:hover, .xFSZwa_simulate:focus-visible {
1623
+ opacity: 1;
1585
1624
  }
1586
1625
 
1587
- .TufZMa_variations {
1588
- margin: 0;
1589
- padding: 0;
1590
- list-style: none;
1626
+ .xFSZwa_simulate:focus-visible {
1627
+ outline: var(--browser-unit) solid var(--esf-text);
1591
1628
  }
1592
1629
 
1593
- .TufZMa_row[aria-current="true"] {
1594
- background: var(--esf-tab-active);
1630
+ .xFSZwa_simulate > img {
1631
+ height: calc(22 * var(--browser-unit));
1632
+ width: calc(22 * var(--browser-unit));
1595
1633
  }
1596
1634
 
1597
- .TufZMa_variation {
1598
- color: inherit;
1599
- cursor: default;
1600
- font: inherit;
1601
- align-items: center;
1602
- gap: calc(6 * var(--info-unit));
1603
- text-align: left;
1604
- user-select: none;
1635
+ .xFSZwa_info {
1636
+ opacity: .6;
1605
1637
  background: none;
1606
1638
  border: none;
1607
- outline: none;
1608
- flex: 1;
1609
- min-width: 0;
1639
+ flex: none;
1610
1640
  padding: 0;
1611
1641
  display: flex;
1612
1642
  }
1613
1643
 
1614
- .TufZMa_variation > span:last-child {
1615
- text-overflow: ellipsis;
1616
- white-space: nowrap;
1617
- overflow: hidden;
1644
+ .xFSZwa_info:hover, .xFSZwa_info:focus-visible {
1645
+ opacity: 1;
1618
1646
  }
1619
1647
 
1620
- .TufZMa_row:has(.TufZMa_variation:focus-visible) {
1621
- background: var(--esf-tree-hover);
1648
+ .xFSZwa_info:focus-visible {
1649
+ outline: var(--browser-unit) solid var(--esf-text);
1622
1650
  }
1623
1651
 
1624
- .TufZMa_variationIcon {
1625
- height: calc(24 * var(--info-unit));
1626
- width: calc(24 * var(--info-unit));
1627
- flex: none;
1652
+ .xFSZwa_info > img {
1653
+ height: calc(16 * var(--browser-unit));
1654
+ width: calc(16 * var(--browser-unit));
1628
1655
  }
1629
1656
 
1630
- .TufZMa_variationIcon > span {
1631
- width: 100%;
1632
- height: 100%;
1633
- display: block;
1657
+ .xFSZwa_dragImage {
1658
+ pointer-events: none;
1659
+ position: fixed;
1660
+ top: 0;
1661
+ left: -1000px;
1634
1662
  }
1635
1663
 
1636
- .TufZMa_info {
1637
- cursor: pointer;
1638
- opacity: .6;
1639
- background: none;
1640
- border: none;
1641
- flex: none;
1642
- padding: 0;
1664
+ .xFSZwa_actions {
1665
+ gap: calc(8 * var(--browser-unit));
1666
+ margin-top: calc(8 * var(--browser-unit));
1643
1667
  display: flex;
1644
1668
  }
1645
1669
 
1646
- .TufZMa_info:hover, .TufZMa_info:focus-visible {
1647
- opacity: 1;
1670
+ .xFSZwa_action {
1671
+ background: var(--esf-button);
1672
+ border: var(--browser-unit) solid var(--esf-button-edge);
1673
+ color: var(--esf-text);
1674
+ cursor: pointer;
1675
+ font: inherit;
1676
+ height: calc(32 * var(--browser-unit));
1677
+ min-width: calc(80 * var(--browser-unit));
1678
+ padding: 0 calc(16 * var(--browser-unit));
1648
1679
  }
1649
1680
 
1650
- .TufZMa_info > img {
1651
- height: calc(16 * var(--info-unit));
1652
- width: calc(16 * var(--info-unit));
1653
- }
1654
- .qMyuGa_bonuses {
1655
- --unit: var(--tooltip-unit, 1px);
1656
- color: var(--esf-text-muted);
1657
- align-items: baseline;
1658
- column-gap: calc(8 * var(--unit));
1659
- max-height: min(calc(500 * var(--unit)), 60vh);
1660
- row-gap: calc(4 * var(--unit));
1661
- scrollbar-color: var(--esf-border) transparent;
1662
- scrollbar-width: thin;
1663
- grid-template-columns: auto 1fr;
1664
- line-height: 1.3;
1665
- display: grid;
1666
- overflow-y: auto;
1681
+ .xFSZwa_action:hover:not(:disabled), .xFSZwa_action:focus-visible {
1682
+ background: var(--esf-button-active);
1683
+ border-color: var(--esf-button-active-edge);
1667
1684
  }
1668
1685
 
1669
- .qMyuGa_name {
1670
- color: var(--esf-text);
1671
- grid-column: 1 / -1;
1686
+ .xFSZwa_action:disabled {
1687
+ color: var(--esf-text-muted);
1688
+ cursor: default;
1672
1689
  }
1673
1690
 
1674
- .qMyuGa_header {
1675
- color: var(--esf-bonus-header);
1676
- margin-top: calc(6 * var(--unit));
1677
- grid-column: 1 / -1;
1678
- font-weight: 600;
1691
+ .xFSZwa_copyAnchor {
1692
+ anchor-name: --fit-copy;
1693
+ display: flex;
1679
1694
  }
1680
1695
 
1681
- .qMyuGa_value {
1682
- color: var(--esf-bonus-value);
1683
- text-align: right;
1684
- white-space: nowrap;
1685
- font-weight: 600;
1696
+ .xFSZwa_copy {
1697
+ min-width: 0;
1698
+ width: calc(32 * var(--browser-unit));
1699
+ justify-content: center;
1700
+ align-items: center;
1701
+ padding: 0;
1702
+ display: flex;
1686
1703
  }
1687
1704
 
1688
- .qMyuGa_bonuses [data-bold] {
1689
- color: var(--esf-text);
1690
- font-weight: 600;
1705
+ .xFSZwa_copy > img {
1706
+ height: calc(16 * var(--browser-unit));
1707
+ width: calc(16 * var(--browser-unit));
1691
1708
  }
1692
1709
 
1693
- .qMyuGa_bonuses [data-italic] {
1694
- font-style: italic;
1710
+ .xFSZwa_copy:disabled > img {
1711
+ opacity: .4;
1695
1712
  }
1696
1713
 
1697
- .qMyuGa_bonuses [data-underline] {
1698
- text-decoration: underline;
1699
- }
1700
- .gVdevq_panel {
1714
+ .xFSZwa_menu {
1701
1715
  background: var(--esf-menu-bg);
1702
- border: var(--window-unit) solid var(--esf-input-border);
1703
- box-sizing: border-box;
1716
+ border: var(--browser-unit) solid var(--esf-input-border);
1704
1717
  color: var(--esf-text);
1705
- gap: calc(10 * var(--window-unit));
1706
- margin: calc(4 * var(--window-unit)) 0;
1707
- padding: calc(12 * var(--window-unit)) calc(2 * var(--window-unit));
1708
- position-anchor: var(--bay-anchor);
1709
- position-area: bottom span-right;
1718
+ font-family: var(--esf-font);
1719
+ font-size: calc(var(--esf-font-size) * var(--esf-scale, 1));
1720
+ margin: calc(4 * var(--browser-unit)) 0;
1721
+ padding: calc(6 * var(--browser-unit)) 0;
1722
+ position-anchor: --fit-copy;
1723
+ position-area: top span-right;
1710
1724
  position-try-fallbacks: flip-block;
1711
- width: calc(370 * var(--window-unit));
1712
- justify-items: center;
1713
1725
  inset: auto;
1714
1726
  }
1715
1727
 
1716
- .gVdevq_panel:popover-open {
1717
- display: grid;
1718
- }
1719
-
1720
- .gVdevq_panel[data-empty] {
1721
- padding: calc(17 * var(--window-unit)) calc(20 * var(--window-unit));
1722
- width: auto;
1723
- }
1724
-
1725
- .gVdevq_list {
1726
- column-gap: calc(8 * var(--window-unit));
1727
- grid-template-columns: minmax(calc(62 * var(--window-unit)), max-content) auto 1fr auto;
1728
- max-height: calc(8 * 32 * var(--window-unit));
1728
+ .xFSZwa_menu > button {
1729
+ color: inherit;
1730
+ cursor: pointer;
1731
+ font: inherit;
1732
+ padding: calc(5 * var(--browser-unit)) calc(16 * var(--browser-unit));
1733
+ text-align: left;
1734
+ background: none;
1735
+ border: none;
1729
1736
  width: 100%;
1730
- margin: 0;
1731
- padding: 0;
1732
- list-style: none;
1733
- display: grid;
1734
- overflow-y: auto;
1737
+ display: block;
1735
1738
  }
1736
1739
 
1737
- .gVdevq_row {
1738
- grid-column: 1 / -1;
1739
- grid-template-columns: subgrid;
1740
- height: calc(32 * var(--window-unit));
1741
- padding: 0 calc(8 * var(--window-unit));
1742
- align-items: center;
1743
- display: grid;
1740
+ .xFSZwa_menu > button:hover, .xFSZwa_menu > button:focus-visible {
1741
+ background: var(--esf-menu-hover);
1742
+ outline: none;
1744
1743
  }
1745
1744
 
1746
- .gVdevq_row:hover {
1747
- background: var(--esf-bay-row-hover);
1745
+ .xFSZwa_form {
1746
+ gap: calc(8 * var(--browser-unit));
1747
+ width: min(calc(420 * var(--browser-unit)), 80vw);
1748
+ flex-direction: column;
1749
+ display: flex;
1748
1750
  }
1749
1751
 
1750
- .gVdevq_quantity {
1751
- border: var(--window-unit) solid transparent;
1752
- align-items: center;
1753
- column-gap: calc(8 * var(--window-unit));
1754
- padding: calc(5 * var(--window-unit)) calc(6 * var(--window-unit));
1755
- grid-template-columns: auto auto;
1756
- justify-self: end;
1757
- justify-items: center;
1758
- display: grid;
1752
+ .xFSZwa_form > label {
1753
+ color: var(--esf-text-muted);
1759
1754
  }
1760
1755
 
1761
- .gVdevq_count {
1762
- appearance: textfield;
1763
- color: inherit;
1756
+ .xFSZwa_form > input, .xFSZwa_form > textarea {
1757
+ background: var(--esf-input-bg);
1758
+ border: var(--browser-unit) solid var(--esf-input-border);
1759
+ color: var(--esf-text);
1764
1760
  font: inherit;
1765
- font-variant-numeric: tabular-nums;
1766
- text-align: right;
1767
- background: none;
1768
- border: none;
1769
- padding: 0;
1770
1761
  }
1771
1762
 
1772
- .gVdevq_count::-webkit-inner-spin-button {
1773
- appearance: none;
1763
+ .xFSZwa_form > textarea {
1764
+ resize: vertical;
1765
+ font-family: ui-monospace, monospace;
1774
1766
  }
1775
1767
 
1776
- .gVdevq_count:focus {
1777
- outline: none;
1768
+ .xFSZwa_importError {
1769
+ color: var(--esf-bad);
1770
+ margin: 0;
1778
1771
  }
1779
1772
 
1780
- .gVdevq_times, .gVdevq_steps {
1781
- grid-area: 1 / 2;
1773
+ .xFSZwa_confirm {
1774
+ max-width: min(calc(360 * var(--browser-unit)), 80vw);
1782
1775
  }
1783
1776
 
1784
- .gVdevq_steps {
1785
- visibility: hidden;
1777
+ .xFSZwa_confirm > p {
1778
+ margin: 0 0 calc(12 * var(--browser-unit));
1786
1779
  }
1787
1780
 
1788
- .gVdevq_steps > button {
1789
- cursor: default;
1790
- opacity: .6;
1791
- background: none;
1781
+ .xFSZwa_dialogButtons {
1782
+ gap: calc(8 * var(--browser-unit));
1783
+ justify-content: flex-end;
1784
+ display: flex;
1785
+ }
1786
+
1787
+ .xFSZwa_views {
1788
+ margin: 0 0 0 calc(4 * var(--browser-unit));
1792
1789
  border: none;
1790
+ align-self: stretch;
1791
+ min-width: 0;
1793
1792
  padding: 0;
1794
- display: block;
1793
+ display: flex;
1795
1794
  }
1796
1795
 
1797
- .gVdevq_steps > button:hover {
1798
- opacity: 1;
1796
+ .xFSZwa_views button {
1797
+ align-items: center;
1799
1798
  }
1800
1799
 
1801
- .gVdevq_steps img {
1802
- height: calc(8 * var(--window-unit));
1803
- width: calc(8 * var(--window-unit));
1804
- display: block;
1800
+ .xFSZwa_views [aria-pressed="true"] {
1801
+ background: var(--esf-tab-active);
1802
+ opacity: 1;
1803
+ }
1804
+ .TufZMa_card {
1805
+ --info-unit: calc(1px * var(--esf-scale, 1));
1806
+ background: var(--esf-bg);
1807
+ border: 1px solid var(--esf-border);
1808
+ box-shadow: 0 calc(8 * var(--info-unit)) calc(30 * var(--info-unit)) #0009;
1809
+ box-sizing: border-box;
1810
+ color: var(--esf-text);
1811
+ font-family: var(--esf-font);
1812
+ font-size: calc(var(--esf-font-size) * var(--esf-scale, 1));
1813
+ max-height: min(calc(460 * var(--info-unit)), calc(100vh - 16px));
1814
+ padding: calc(10 * var(--info-unit)) calc(12 * var(--info-unit)) calc(6 * var(--info-unit));
1815
+ user-select: text;
1816
+ width: calc(330 * var(--info-unit));
1817
+ flex-direction: column;
1818
+ margin: auto;
1819
+ inset: 0;
1805
1820
  }
1806
1821
 
1807
- .gVdevq_quantity:hover, .gVdevq_quantity:focus-within {
1808
- border-color: var(--esf-spinner-edge);
1822
+ .TufZMa_card:popover-open {
1823
+ display: flex;
1809
1824
  }
1810
1825
 
1811
- .gVdevq_quantity:hover .gVdevq_times, .gVdevq_quantity:focus-within .gVdevq_times {
1812
- visibility: hidden;
1826
+ .TufZMa_card[data-side] {
1827
+ margin: 0 calc(8 * var(--info-unit));
1828
+ position-anchor: var(--item-info-anchor);
1829
+ position-try-fallbacks: flip-block,
1830
+ flip-inline,
1831
+ flip-block flip-inline;
1832
+ inset: auto;
1813
1833
  }
1814
1834
 
1815
- .gVdevq_quantity:hover .gVdevq_steps, .gVdevq_quantity:focus-within .gVdevq_steps {
1816
- visibility: visible;
1835
+ .TufZMa_card[data-side="left"] {
1836
+ position-area: left span-bottom;
1817
1837
  }
1818
1838
 
1819
- .gVdevq_quantity:focus-within {
1820
- background: var(--esf-spinner-focus);
1821
- border-color: var(--esf-spinner-focus-edge);
1839
+ .TufZMa_card[data-side="right"] {
1840
+ position-area: right span-bottom;
1822
1841
  }
1823
1842
 
1824
- .gVdevq_icon {
1825
- height: calc(24 * var(--window-unit));
1826
- width: calc(24 * var(--window-unit));
1843
+ .TufZMa_close {
1844
+ cursor: pointer;
1845
+ opacity: .6;
1846
+ right: calc(8 * var(--info-unit));
1847
+ top: calc(8 * var(--info-unit));
1848
+ background: none;
1849
+ border: none;
1850
+ padding: 0;
1851
+ display: flex;
1852
+ position: absolute;
1827
1853
  }
1828
1854
 
1829
- .gVdevq_icon > span {
1830
- width: 100%;
1831
- height: 100%;
1832
- display: block;
1855
+ .TufZMa_close:hover, .TufZMa_close:focus-visible {
1856
+ opacity: 1;
1833
1857
  }
1834
1858
 
1835
- .gVdevq_middle {
1836
- gap: calc(6 * var(--window-unit));
1837
- min-width: 0;
1838
- display: grid;
1859
+ .TufZMa_close > img {
1860
+ height: calc(14 * var(--info-unit));
1861
+ width: calc(14 * var(--info-unit));
1839
1862
  }
1840
1863
 
1841
- .gVdevq_name {
1842
- text-align: center;
1843
- text-overflow: ellipsis;
1844
- white-space: nowrap;
1845
- overflow: hidden;
1864
+ .TufZMa_header {
1865
+ align-items: center;
1866
+ gap: calc(10 * var(--info-unit));
1867
+ padding-right: calc(16 * var(--info-unit));
1868
+ display: flex;
1846
1869
  }
1847
1870
 
1848
- .gVdevq_activeDrones {
1849
- padding-left: calc(8 * var(--window-unit));
1850
- justify-self: start;
1851
- font-weight: 600;
1871
+ .TufZMa_typeIcon {
1872
+ height: calc(64 * var(--info-unit));
1873
+ width: calc(64 * var(--info-unit));
1874
+ flex: none;
1852
1875
  }
1853
1876
 
1854
- .gVdevq_panel[data-drones] .gVdevq_list {
1855
- grid-template-columns: minmax(calc(52 * var(--window-unit)), max-content) auto 1fr auto;
1856
- max-height: calc(5 * 64 * var(--window-unit));
1877
+ .TufZMa_typeIcon > span {
1878
+ width: 100%;
1879
+ height: 100%;
1880
+ display: block;
1857
1881
  }
1858
1882
 
1859
- .gVdevq_panel[data-drones] .gVdevq_row {
1860
- height: calc(64 * var(--window-unit));
1883
+ .TufZMa_title {
1884
+ gap: calc(2 * var(--info-unit));
1885
+ flex-direction: column;
1886
+ min-width: 0;
1887
+ display: flex;
1861
1888
  }
1862
1889
 
1863
- .gVdevq_panel[data-drones] .gVdevq_icon {
1864
- height: calc(60 * var(--window-unit));
1865
- width: calc(60 * var(--window-unit));
1890
+ .TufZMa_name {
1891
+ font-size: inherit;
1892
+ margin: 0;
1893
+ font-weight: normal;
1866
1894
  }
1867
1895
 
1868
- .gVdevq_panel[data-drones] .gVdevq_name {
1869
- text-align: left;
1896
+ .TufZMa_muted {
1897
+ color: var(--esf-text-muted);
1870
1898
  }
1871
1899
 
1872
- .gVdevq_panel[data-fighters] {
1873
- padding: calc(12 * var(--window-unit));
1874
- width: auto;
1900
+ .TufZMa_tabs {
1901
+ border-bottom: 1px solid var(--esf-input-border);
1902
+ gap: calc(16 * var(--info-unit));
1903
+ margin-top: calc(8 * var(--info-unit));
1904
+ display: flex;
1875
1905
  }
1876
1906
 
1877
- .gVdevq_panel[data-fighters] .gVdevq_list {
1878
- width: calc(5 * 88 * var(--window-unit) - 2 * var(--window-unit));
1907
+ .TufZMa_tab {
1908
+ color: var(--esf-text-muted);
1909
+ font: inherit;
1910
+ padding: calc(4 * var(--info-unit)) 0 calc(6 * var(--info-unit));
1911
+ background: none;
1912
+ border: none;
1879
1913
  }
1880
1914
 
1881
- .gVdevq_kinds {
1882
- gap: calc(22 * var(--window-unit));
1883
- min-height: calc(16 * var(--window-unit));
1884
- padding-left: calc(4 * var(--window-unit));
1885
- justify-self: start;
1886
- display: flex;
1915
+ .TufZMa_tab[aria-selected="true"] {
1916
+ box-shadow: inset 0 calc(-2 * var(--info-unit)) var(--esf-button-active-edge);
1917
+ color: var(--esf-text);
1887
1918
  }
1888
1919
 
1889
- .gVdevq_kind {
1890
- align-items: baseline;
1891
- gap: calc(2 * var(--window-unit));
1920
+ .TufZMa_panel {
1921
+ flex-direction: column;
1922
+ min-height: 0;
1892
1923
  display: flex;
1893
1924
  }
1894
1925
 
1895
- .gVdevq_kind > img {
1896
- height: calc(16 * var(--window-unit));
1897
- translate: 0 calc(8 * var(--window-unit) - .5cap);
1898
- width: calc(16 * var(--window-unit));
1926
+ .TufZMa_list {
1927
+ font-size: calc(11 * var(--info-unit));
1928
+ margin: calc(4 * var(--info-unit)) calc(-12 * var(--info-unit)) 0;
1929
+ min-height: 0;
1930
+ padding: 0;
1931
+ list-style: none;
1932
+ overflow-y: auto;
1899
1933
  }
1900
1934
 
1901
- .gVdevq_tubes {
1902
- gap: calc(2 * var(--window-unit));
1935
+ .TufZMa_row {
1936
+ align-items: center;
1937
+ gap: calc(8 * var(--info-unit));
1938
+ min-height: calc(26 * var(--info-unit));
1939
+ padding: 0 calc(12 * var(--info-unit));
1940
+ justify-content: space-between;
1903
1941
  display: flex;
1904
1942
  }
1905
1943
 
1906
- .gVdevq_none {
1907
- padding: calc(6 * var(--window-unit)) calc(8 * var(--window-unit));
1908
- justify-self: stretch;
1909
- }
1910
-
1911
- .gVdevq_none:hover {
1912
- background: var(--esf-bay-row-hover);
1944
+ .TufZMa_row:hover {
1945
+ background: var(--esf-tree-hover);
1913
1946
  }
1914
1947
 
1915
- .gVdevq_selection {
1916
- color: var(--esf-text-muted);
1948
+ .TufZMa_row > dt {
1917
1949
  align-items: center;
1918
- gap: calc(3 * var(--window-unit));
1950
+ gap: calc(6 * var(--info-unit));
1951
+ min-width: 0;
1919
1952
  display: flex;
1920
1953
  }
1921
1954
 
1922
- .gVdevq_box {
1923
- background: var(--esf-drone-box);
1924
- border: var(--window-unit) solid var(--esf-button-edge);
1925
- color: var(--esf-text);
1926
- cursor: default;
1927
- font-size: calc(10 * var(--window-unit));
1928
- height: calc(13 * var(--window-unit));
1929
- width: calc(13 * var(--window-unit));
1930
- padding: 0;
1931
- line-height: 1;
1955
+ .TufZMa_row > dt > span:last-child {
1956
+ text-overflow: ellipsis;
1957
+ white-space: nowrap;
1958
+ overflow: hidden;
1932
1959
  }
1933
1960
 
1934
- .gVdevq_box:first-child {
1935
- margin-left: calc(2 * var(--window-unit));
1961
+ .TufZMa_row > dd {
1962
+ font-variant-numeric: tabular-nums;
1963
+ text-align: right;
1964
+ white-space: nowrap;
1965
+ margin: 0;
1936
1966
  }
1937
1967
 
1938
- .gVdevq_box[data-state="active"] {
1939
- background: var(--esf-button-active);
1968
+ .TufZMa_icon {
1969
+ height: calc(16 * var(--info-unit));
1970
+ width: calc(16 * var(--info-unit));
1971
+ flex: none;
1940
1972
  }
1941
1973
 
1942
- .gVdevq_box[data-state="open"] {
1943
- background: var(--esf-drone-box-open);
1974
+ .TufZMa_row > dd[data-change="better"] {
1975
+ color: var(--esf-good);
1944
1976
  }
1945
1977
 
1946
- .gVdevq_box:enabled:hover {
1947
- border-color: var(--esf-button-active-edge);
1978
+ .TufZMa_row > dd[data-change="worse"] {
1979
+ color: var(--esf-bad);
1948
1980
  }
1949
1981
 
1950
- .gVdevq_box[data-state="none"] {
1951
- background: var(--esf-drone-box-empty);
1952
- border-color: var(--esf-drone-box-empty);
1982
+ .TufZMa_metaGroup {
1983
+ background: var(--esf-tree-header);
1984
+ font-size: inherit;
1985
+ margin: calc(4 * var(--info-unit)) 0 0;
1986
+ padding: calc(5 * var(--info-unit)) calc(12 * var(--info-unit));
1987
+ font-weight: normal;
1953
1988
  }
1954
1989
 
1955
- .gVdevq_remove {
1956
- cursor: default;
1957
- opacity: .6;
1958
- background: none;
1959
- border: none;
1990
+ .TufZMa_variations {
1991
+ margin: 0;
1960
1992
  padding: 0;
1993
+ list-style: none;
1961
1994
  }
1962
1995
 
1963
- .gVdevq_remove:hover, .gVdevq_remove:focus-visible {
1964
- opacity: 1;
1965
- }
1966
-
1967
- .gVdevq_remove > img {
1968
- height: calc(16 * var(--window-unit));
1969
- width: calc(16 * var(--window-unit));
1970
- display: block;
1996
+ .TufZMa_row[aria-current="true"] {
1997
+ background: var(--esf-tab-active);
1971
1998
  }
1972
1999
 
1973
- .gVdevq_removeAll {
1974
- background: var(--esf-button);
1975
- border: var(--window-unit) solid var(--esf-button-edge);
2000
+ .TufZMa_variation {
1976
2001
  color: inherit;
1977
2002
  cursor: default;
1978
2003
  font: inherit;
1979
- height: calc(31 * var(--window-unit));
1980
- padding: 0 calc(14 * var(--window-unit));
1981
- }
1982
-
1983
- .gVdevq_removeAll:hover, .gVdevq_removeAll:focus-visible {
1984
- background: var(--esf-button-active);
1985
- border-color: var(--esf-button-active-edge);
1986
- }
1987
-
1988
- .gVdevq_remove:focus-visible, .gVdevq_removeAll:focus-visible, .gVdevq_box:focus-visible {
1989
- outline: var(--window-unit) solid var(--esf-text);
1990
- }
1991
- .Wlg6ma_tube {
1992
- --tube-unit: calc(1px * var(--esf-scale, 1));
1993
- border-image: var(--tube) 6 fill / calc(6 * var(--tube-unit));
1994
- box-sizing: border-box;
1995
- color: var(--esf-text-muted);
1996
- height: calc(116 * var(--tube-unit));
2004
+ align-items: center;
2005
+ gap: calc(6 * var(--info-unit));
2006
+ text-align: left;
1997
2007
  user-select: none;
1998
- width: calc(86 * var(--tube-unit));
1999
- position: relative;
2008
+ background: none;
2009
+ border: none;
2010
+ outline: none;
2011
+ flex: 1;
2012
+ min-width: 0;
2013
+ padding: 0;
2014
+ display: flex;
2000
2015
  }
2001
2016
 
2002
- .Wlg6ma_tube:not([data-state="unavailable"]):hover:before {
2003
- background: var(--esf-fighter-tube-hover);
2004
- content: "";
2005
- position: absolute;
2006
- inset: 0;
2017
+ .TufZMa_variation > span:last-child {
2018
+ text-overflow: ellipsis;
2019
+ white-space: nowrap;
2020
+ overflow: hidden;
2007
2021
  }
2008
2022
 
2009
- .Wlg6ma_tube[data-state="unavailable"] {
2010
- opacity: .4;
2023
+ .TufZMa_row:has(.TufZMa_variation:focus-visible) {
2024
+ background: var(--esf-tree-hover);
2011
2025
  }
2012
2026
 
2013
- .Wlg6ma_number {
2014
- color: var(--esf-text);
2015
- font-size: calc(11 * var(--tube-unit));
2016
- height: calc(14 * var(--tube-unit));
2017
- left: calc(2 * var(--tube-unit));
2018
- top: calc(2 * var(--tube-unit));
2019
- width: calc(14 * var(--tube-unit));
2020
- justify-content: center;
2021
- align-items: center;
2022
- line-height: 1;
2023
- display: flex;
2024
- position: absolute;
2027
+ .TufZMa_variationIcon {
2028
+ height: calc(24 * var(--info-unit));
2029
+ width: calc(24 * var(--info-unit));
2030
+ flex: none;
2025
2031
  }
2026
2032
 
2027
- .Wlg6ma_number:before {
2028
- background: var(--flag) center / 100% 100%;
2029
- content: "";
2030
- opacity: .35;
2031
- position: absolute;
2032
- inset: 0;
2033
+ .TufZMa_variationIcon > span {
2034
+ width: 100%;
2035
+ height: 100%;
2036
+ display: block;
2033
2037
  }
2034
2038
 
2035
- .Wlg6ma_empty, .Wlg6ma_squadron {
2036
- height: calc(86 * var(--tube-unit));
2037
- width: calc(86 * var(--tube-unit));
2038
- position: absolute;
2039
- top: 0;
2040
- left: 0;
2039
+ .TufZMa_info {
2040
+ cursor: pointer;
2041
+ opacity: .6;
2042
+ background: none;
2043
+ border: none;
2044
+ flex: none;
2045
+ padding: 0;
2046
+ display: flex;
2041
2047
  }
2042
2048
 
2043
- .Wlg6ma_empty {
2044
- background: var(--texture) center / 100% 100%;
2049
+ .TufZMa_info:hover, .TufZMa_info:focus-visible {
2050
+ opacity: 1;
2045
2051
  }
2046
2052
 
2047
- .Wlg6ma_squadron {
2048
- background: var(--underlay) center / 100% 100%;
2053
+ .TufZMa_info > img {
2054
+ height: calc(16 * var(--info-unit));
2055
+ width: calc(16 * var(--info-unit));
2056
+ }
2057
+ .yNZdnG_card {
2058
+ max-height: none;
2059
+ width: calc(460 * var(--info-unit));
2060
+ overflow: visible;
2049
2061
  }
2050
2062
 
2051
- .Wlg6ma_squadron:after {
2052
- background: var(--overlay) center / 100% 100%;
2053
- content: "";
2054
- position: absolute;
2055
- inset: 0;
2063
+ .yNZdnG_panel {
2064
+ gap: calc(10 * var(--info-unit));
2065
+ padding: calc(10 * var(--info-unit)) 0 calc(6 * var(--info-unit));
2066
+ flex-direction: column;
2067
+ display: flex;
2056
2068
  }
2057
2069
 
2058
- .Wlg6ma_picture {
2059
- height: calc(54 * var(--tube-unit));
2060
- left: calc(16 * var(--tube-unit));
2061
- top: calc(16 * var(--tube-unit));
2062
- width: calc(54 * var(--tube-unit));
2063
- border-radius: 50%;
2064
- position: absolute;
2065
- overflow: hidden;
2070
+ .yNZdnG_toolbar {
2071
+ gap: calc(6 * var(--info-unit));
2072
+ display: flex;
2073
+ position: relative;
2066
2074
  }
2067
2075
 
2068
- .Wlg6ma_picture > span {
2069
- width: 100%;
2076
+ .yNZdnG_picker {
2077
+ flex: 1;
2078
+ min-width: 0;
2079
+ }
2080
+
2081
+ .yNZdnG_select {
2082
+ background: var(--esf-input-bg);
2083
+ border: 1px solid var(--esf-input-border);
2084
+ color: var(--esf-text);
2085
+ cursor: pointer;
2086
+ font: inherit;
2087
+ align-items: center;
2088
+ gap: calc(8 * var(--info-unit));
2070
2089
  height: 100%;
2071
- display: block;
2090
+ padding: calc(5 * var(--info-unit)) calc(8 * var(--info-unit));
2091
+ width: 100%;
2092
+ display: flex;
2072
2093
  }
2073
2094
 
2074
- .Wlg6ma_tube[data-preview] .Wlg6ma_picture {
2075
- filter: sepia() hue-rotate(190deg) saturate(200%);
2095
+ .yNZdnG_select:hover, .yNZdnG_select:focus-visible, .yNZdnG_select[aria-expanded="true"] {
2096
+ border-color: var(--esf-text-muted);
2097
+ outline: none;
2076
2098
  }
2077
2099
 
2078
- .Wlg6ma_ring {
2079
- fill: none;
2080
- stroke: var(--esf-fighter-empty);
2081
- stroke-width: 4.5px;
2082
- position: absolute;
2083
- inset: 0;
2100
+ .yNZdnG_selected {
2101
+ text-align: left;
2102
+ flex: 1;
2084
2103
  }
2085
2104
 
2086
- .Wlg6ma_ring > [data-lit] {
2087
- stroke: var(--esf-fighter-full);
2105
+ .yNZdnG_caret {
2106
+ color: var(--esf-text-muted);
2088
2107
  }
2089
2108
 
2090
- .Wlg6ma_role {
2091
- bottom: calc(18 * var(--tube-unit));
2092
- z-index: 1;
2093
- position: absolute;
2094
- left: 50%;
2095
- translate: -50%;
2109
+ .yNZdnG_roll {
2110
+ flex: none;
2111
+ display: flex;
2096
2112
  }
2097
2113
 
2098
- .Wlg6ma_role > img {
2099
- height: calc(16 * var(--tube-unit));
2100
- width: calc(16 * var(--tube-unit));
2101
- display: block;
2114
+ .yNZdnG_more {
2115
+ background: var(--esf-button);
2116
+ border: 1px solid var(--esf-button-edge);
2117
+ color: var(--esf-text-muted);
2118
+ cursor: pointer;
2119
+ font: inherit;
2120
+ font-size: calc(10 * var(--info-unit));
2121
+ padding: 0 calc(5 * var(--info-unit));
2122
+ border-left: none;
2102
2123
  }
2103
2124
 
2104
- .Wlg6ma_label {
2105
- text-align: center;
2106
- left: 0;
2107
- right: 0;
2108
- top: calc(79 * var(--tube-unit));
2109
- position: absolute;
2125
+ .yNZdnG_more:hover, .yNZdnG_more:focus-visible {
2126
+ background: var(--esf-button-active);
2127
+ border-color: var(--esf-button-active-edge);
2128
+ color: var(--esf-text);
2129
+ outline: none;
2110
2130
  }
2111
2131
 
2112
- .Wlg6ma_resize {
2113
- gap: calc(8 * var(--tube-unit));
2114
- left: 0;
2115
- right: 0;
2116
- top: calc(96 * var(--tube-unit));
2132
+ .yNZdnG_dice {
2133
+ background: var(--esf-button);
2134
+ border: 1px solid var(--esf-button-edge);
2135
+ color: var(--esf-text);
2136
+ cursor: pointer;
2137
+ width: calc(30 * var(--info-unit));
2138
+ flex: none;
2117
2139
  justify-content: center;
2140
+ align-items: center;
2118
2141
  display: flex;
2142
+ }
2143
+
2144
+ .yNZdnG_dice:hover, .yNZdnG_dice:focus-visible {
2145
+ background: var(--esf-button-active);
2146
+ border-color: var(--esf-button-active-edge);
2147
+ outline: none;
2148
+ }
2149
+
2150
+ .yNZdnG_dice > svg {
2151
+ height: calc(16 * var(--info-unit));
2152
+ width: calc(16 * var(--info-unit));
2153
+ }
2154
+
2155
+ .yNZdnG_menu {
2156
+ background: var(--esf-menu-bg);
2157
+ border: 1px solid var(--esf-border);
2158
+ box-shadow: 0 calc(10 * var(--info-unit)) calc(30 * var(--info-unit)) #000c;
2159
+ grid-template-columns: minmax(0, max-content) minmax(calc(240 * var(--info-unit)), 1fr);
2160
+ z-index: 1;
2161
+ display: grid;
2119
2162
  position: absolute;
2163
+ top: calc(100% + 2px);
2164
+ left: 0;
2165
+ right: 0;
2120
2166
  }
2121
2167
 
2122
- .Wlg6ma_resize > button, .Wlg6ma_remove {
2168
+ .yNZdnG_options {
2169
+ border-right: 1px solid var(--esf-input-border);
2170
+ padding: calc(4 * var(--info-unit)) 0;
2171
+ outline: none;
2172
+ margin: 0;
2173
+ list-style: none;
2174
+ }
2175
+
2176
+ .yNZdnG_option {
2123
2177
  color: var(--esf-text);
2124
- cursor: default;
2178
+ cursor: pointer;
2125
2179
  font: inherit;
2126
- opacity: .8;
2180
+ text-align: left;
2181
+ width: 100%;
2182
+ padding: calc(5 * var(--info-unit)) calc(10 * var(--info-unit));
2127
2183
  background: none;
2128
2184
  border: none;
2129
- padding: 0;
2130
- line-height: 1;
2185
+ outline: none;
2186
+ display: block;
2131
2187
  }
2132
2188
 
2133
- .Wlg6ma_resize > button {
2134
- font-size: calc(15 * var(--tube-unit));
2135
- width: calc(12 * var(--tube-unit));
2136
- font-weight: 600;
2189
+ .yNZdnG_option[data-active] {
2190
+ background: var(--esf-menu-hover);
2137
2191
  }
2138
2192
 
2139
- .Wlg6ma_resize > button:disabled {
2140
- opacity: .3;
2193
+ .yNZdnG_option[aria-checked="true"] {
2194
+ box-shadow: inset calc(2 * var(--info-unit)) 0 var(--esf-button-active-edge);
2141
2195
  }
2142
2196
 
2143
- .Wlg6ma_remove {
2144
- right: calc(4 * var(--tube-unit));
2145
- top: calc(3 * var(--tube-unit));
2146
- position: absolute;
2197
+ .yNZdnG_option:focus-visible {
2198
+ outline: 1px solid var(--esf-button-active-edge);
2199
+ outline-offset: -1px;
2147
2200
  }
2148
2201
 
2149
- .Wlg6ma_remove > img {
2150
- height: calc(14 * var(--tube-unit));
2151
- width: calc(14 * var(--tube-unit));
2152
- display: block;
2202
+ .yNZdnG_chart {
2203
+ font-size: calc(10 * var(--info-unit));
2204
+ gap: calc(7 * var(--info-unit));
2205
+ padding: calc(8 * var(--info-unit)) calc(10 * var(--info-unit)) calc(6 * var(--info-unit));
2206
+ flex-direction: column;
2207
+ display: flex;
2153
2208
  }
2154
2209
 
2155
- .Wlg6ma_resize > button:enabled:hover, .Wlg6ma_remove:hover {
2156
- opacity: 1;
2210
+ .yNZdnG_chartTitle {
2211
+ font-size: calc(11 * var(--info-unit));
2157
2212
  }
2158
2213
 
2159
- .Wlg6ma_resize > button:focus-visible, .Wlg6ma_remove:focus-visible {
2160
- opacity: 1;
2161
- outline: var(--tube-unit) solid var(--esf-text);
2214
+ .yNZdnG_chartRow {
2215
+ gap: calc(2 * var(--info-unit));
2216
+ display: grid;
2162
2217
  }
2163
- .L9t91q_window {
2164
- --window-unit: calc(1px * var(--esf-scale, 1));
2165
- --browser-width: 0px;
2166
- --statistics-width: 0px;
2167
- color: var(--esf-text);
2168
- font-family: var(--esf-font);
2169
- font-size: calc(var(--esf-font-size) * var(--esf-scale, 1));
2170
- height: calc(694 * var(--window-unit));
2171
- user-select: none;
2172
- width: calc(708 * var(--window-unit) + var(--browser-width) + var(--statistics-width));
2173
- transition: width .2s;
2174
- position: relative;
2218
+
2219
+ .yNZdnG_chartName {
2220
+ color: var(--esf-text-muted);
2221
+ text-overflow: ellipsis;
2222
+ white-space: nowrap;
2223
+ overflow: hidden;
2175
2224
  }
2176
2225
 
2177
- .L9t91q_window[data-browser] {
2178
- --browser-width: calc(400 * var(--window-unit));
2226
+ .yNZdnG_chartBar {
2227
+ background: var(--esf-input-bg);
2228
+ height: calc(12 * var(--info-unit));
2229
+ position: relative;
2179
2230
  }
2180
2231
 
2181
- .L9t91q_window[data-statistics] {
2182
- --statistics-width: calc(272 * var(--window-unit));
2232
+ .yNZdnG_chartBehind {
2233
+ background: #ffffff14;
2234
+ position: absolute;
2235
+ inset-block: 0;
2183
2236
  }
2184
2237
 
2185
- .L9t91q_frame {
2186
- inset: calc(29 * var(--window-unit)) auto 0 var(--browser-width);
2187
- width: calc(700 * var(--window-unit));
2188
- transition: left .2s;
2238
+ .yNZdnG_chartRange {
2239
+ --low: var(--esf-bad);
2240
+ --high: var(--esf-good);
2241
+ background: linear-gradient(90deg,
2242
+ color-mix(in srgb, var(--low) 60%, transparent),
2243
+ var(--esf-resistance-bg) var(--neutral),
2244
+ color-mix(in srgb, var(--high) 60%, transparent));
2245
+ inset-block: calc(2 * var(--info-unit));
2189
2246
  position: absolute;
2190
2247
  }
2191
2248
 
2192
- .L9t91q_icon > img, .L9t91q_tool > img, .L9t91q_bay > img {
2193
- display: block;
2249
+ .yNZdnG_chartRange:not([data-up-is-good]) {
2250
+ --low: var(--esf-good);
2251
+ --high: var(--esf-bad);
2194
2252
  }
2195
2253
 
2196
- .L9t91q_wheel {
2197
- --esf-wheel-size: calc(572 * var(--window-unit));
2198
- left: calc(68 * var(--window-unit));
2254
+ .yNZdnG_chartBase {
2255
+ background: var(--esf-text);
2256
+ opacity: .8;
2257
+ width: 1px;
2199
2258
  position: absolute;
2200
- top: 0;
2259
+ inset-block: -1px;
2201
2260
  }
2202
2261
 
2203
- .L9t91q_placeholder {
2204
- color: var(--esf-text-muted);
2205
- justify-content: center;
2206
- align-items: center;
2207
- display: flex;
2262
+ .yNZdnG_chartRoll {
2263
+ background: var(--esf-text);
2264
+ border: 1px solid var(--esf-bg);
2265
+ height: calc(10 * var(--info-unit));
2266
+ margin-left: calc(-3 * var(--info-unit));
2267
+ top: calc(1 * var(--info-unit));
2268
+ width: calc(6 * var(--info-unit));
2208
2269
  position: absolute;
2209
- inset: 0;
2210
2270
  }
2211
2271
 
2212
- .L9t91q_placeholder > p {
2213
- text-align: center;
2214
- white-space: pre-line;
2215
- margin: 0;
2272
+ .yNZdnG_chartAxis {
2273
+ color: var(--esf-text-muted);
2274
+ font-size: calc(9 * var(--info-unit));
2275
+ justify-content: space-between;
2276
+ display: flex;
2216
2277
  }
2217
2278
 
2218
- .L9t91q_name, .L9t91q_violations, .L9t91q_tools, .L9t91q_panels, .L9t91q_bays, .L9t91q_history, .L9t91q_services, .L9t91q_resources {
2219
- position: absolute;
2279
+ .yNZdnG_chip:focus-visible {
2280
+ outline: 1px solid var(--esf-text);
2220
2281
  }
2221
2282
 
2222
- .L9t91q_name {
2223
- align-items: center;
2224
- gap: calc(2 * var(--window-unit));
2225
- left: calc(20 * var(--window-unit));
2226
- max-width: calc(150 * var(--window-unit));
2227
- top: calc(40 * var(--window-unit));
2228
- white-space: nowrap;
2229
- display: flex;
2283
+ .yNZdnG_chips {
2284
+ gap: calc(4 * var(--info-unit));
2285
+ grid-template-columns: repeat(auto-fit, minmax(calc(68 * var(--info-unit)), 1fr));
2286
+ max-height: calc(128 * var(--info-unit));
2287
+ display: grid;
2288
+ overflow-y: auto;
2230
2289
  }
2231
2290
 
2232
- .L9t91q_fitName {
2233
- color: inherit;
2234
- cursor: text;
2291
+ .yNZdnG_chip {
2292
+ background: var(--esf-button);
2293
+ border: 1px solid var(--esf-button-edge);
2294
+ color: var(--esf-text-muted);
2295
+ cursor: pointer;
2235
2296
  font: inherit;
2236
- text-overflow: ellipsis;
2237
- background: none;
2238
- border: none;
2239
- padding: 0;
2240
- overflow: hidden;
2297
+ font-size: calc(11 * var(--info-unit));
2298
+ gap: calc(2 * var(--info-unit));
2299
+ padding: calc(4 * var(--info-unit));
2300
+ justify-items: center;
2301
+ display: grid;
2241
2302
  }
2242
2303
 
2243
- .L9t91q_fitNameInput {
2244
- background: var(--esf-input-bg);
2245
- border: var(--window-unit) solid var(--esf-input-border);
2304
+ .yNZdnG_chip[data-launched] {
2246
2305
  color: var(--esf-text);
2247
- font: inherit;
2248
- min-width: 0;
2249
- padding: 0 calc(2 * var(--window-unit));
2250
2306
  }
2251
2307
 
2252
- .L9t91q_icon {
2253
- cursor: default;
2254
- background: none;
2255
- border: none;
2256
- padding: 0;
2308
+ .yNZdnG_chip[aria-pressed="true"] {
2309
+ border-color: var(--esf-button-active-edge);
2310
+ box-shadow: inset 0 0 0 1px var(--esf-button-active-edge);
2257
2311
  }
2258
2312
 
2259
- .L9t91q_icon > img {
2260
- height: calc(16 * var(--window-unit));
2261
- width: calc(16 * var(--window-unit));
2313
+ .yNZdnG_chipBar {
2314
+ background: var(--esf-input-bg);
2315
+ height: calc(3 * var(--info-unit));
2316
+ width: 100%;
2262
2317
  }
2263
2318
 
2264
- .L9t91q_icon > img[data-icon="link"] {
2265
- height: calc(12 * var(--window-unit));
2266
- margin: 0 calc(2 * var(--window-unit));
2267
- opacity: .6;
2268
- width: calc(12 * var(--window-unit));
2319
+ .yNZdnG_chipBar > span {
2320
+ background: var(--esf-button-active-edge);
2321
+ height: 100%;
2322
+ display: block;
2269
2323
  }
2270
2324
 
2271
- .L9t91q_icon:focus-visible, .L9t91q_tool:focus-visible {
2272
- outline: var(--window-unit) solid var(--esf-text);
2325
+ .yNZdnG_stats {
2326
+ font-size: calc(11 * var(--info-unit));
2327
+ gap: calc(4 * var(--info-unit)) calc(8 * var(--info-unit));
2328
+ grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) calc(84 * var(--info-unit)) calc(44 * var(--info-unit));
2329
+ display: grid;
2273
2330
  }
2274
2331
 
2275
- .L9t91q_violations {
2276
- gap: calc(14 * var(--window-unit));
2277
- left: calc(20 * var(--window-unit));
2278
- top: calc(62 * var(--window-unit));
2279
- display: flex;
2332
+ .yNZdnG_stat {
2333
+ align-items: center;
2334
+ display: contents;
2280
2335
  }
2281
2336
 
2282
- .L9t91q_violation {
2283
- height: calc(28 * var(--window-unit));
2284
- width: calc(28 * var(--window-unit));
2285
- position: relative;
2337
+ .yNZdnG_name {
2338
+ align-items: center;
2339
+ gap: calc(6 * var(--info-unit));
2340
+ min-width: 0;
2341
+ display: flex;
2286
2342
  }
2287
2343
 
2288
- .L9t91q_violation, .L9t91q_alert {
2289
- --colour: var(--esf-violation-notice);
2344
+ .yNZdnG_icon {
2345
+ height: calc(16 * var(--info-unit));
2346
+ width: calc(16 * var(--info-unit));
2347
+ flex: none;
2290
2348
  }
2291
2349
 
2292
- .L9t91q_violation:before {
2293
- background: var(--colour);
2294
- content: "";
2295
- mask: var(--texture) center / 100% 100%;
2296
- position: absolute;
2297
- inset: 0;
2350
+ .yNZdnG_label {
2351
+ text-overflow: ellipsis;
2352
+ white-space: nowrap;
2353
+ overflow: hidden;
2298
2354
  }
2299
2355
 
2300
- .L9t91q_violation[data-kind="error"], .L9t91q_alert[data-kind="error"] {
2301
- --colour: var(--esf-violation-error);
2356
+ .yNZdnG_slider {
2357
+ --worse: var(--esf-bad);
2358
+ --better: var(--esf-good);
2359
+ --low: var(--worse);
2360
+ --high: var(--better);
2361
+ align-self: center;
2362
+ display: flex;
2363
+ position: relative;
2302
2364
  }
2303
2365
 
2304
- .L9t91q_violation[data-kind="skill"], .L9t91q_alert[data-kind="skill"] {
2305
- --colour: var(--esf-violation-skill);
2366
+ .yNZdnG_slider:not([data-high-is-good]) {
2367
+ --low: var(--better);
2368
+ --high: var(--worse);
2306
2369
  }
2307
2370
 
2308
- .L9t91q_alert {
2309
- display: contents;
2371
+ .yNZdnG_slider:after {
2372
+ background: var(--esf-text);
2373
+ content: "";
2374
+ height: calc(14 * var(--info-unit));
2375
+ left: var(--base);
2376
+ pointer-events: none;
2377
+ width: 1px;
2378
+ position: absolute;
2379
+ top: 50%;
2380
+ translate: 0 -50%;
2310
2381
  }
2311
2382
 
2312
- .L9t91q_alertTitle {
2313
- color: var(--colour);
2314
- text-transform: uppercase;
2383
+ .yNZdnG_slider > input {
2384
+ appearance: none;
2385
+ background: linear-gradient(90deg,
2386
+ color-mix(in srgb, var(--low) 60%, transparent),
2387
+ var(--esf-resistance-bg) var(--base),
2388
+ color-mix(in srgb, var(--high) 60%, transparent));
2389
+ cursor: pointer;
2390
+ height: calc(4 * var(--info-unit));
2391
+ margin: calc(8 * var(--info-unit)) 0;
2392
+ width: 100%;
2315
2393
  }
2316
2394
 
2317
- .L9t91q_alertLine {
2318
- align-items: center;
2319
- gap: calc(8 * var(--window-unit));
2320
- display: flex;
2395
+ .yNZdnG_slider > input::-webkit-slider-thumb {
2396
+ appearance: none;
2397
+ background: var(--esf-text);
2398
+ border: 1px solid var(--esf-bg);
2399
+ height: calc(14 * var(--info-unit));
2400
+ width: calc(8 * var(--info-unit));
2321
2401
  }
2322
2402
 
2323
- .L9t91q_alertLine:before {
2324
- background: var(--colour);
2325
- content: "";
2326
- height: 1.4em;
2327
- mask: var(--texture) center / 100% 100%;
2328
- flex: none;
2329
- width: 1.4em;
2403
+ .yNZdnG_slider > input::-moz-range-thumb {
2404
+ background: var(--esf-text);
2405
+ border: 1px solid var(--esf-bg);
2406
+ height: calc(14 * var(--info-unit));
2407
+ width: calc(8 * var(--info-unit));
2408
+ border-radius: 0;
2330
2409
  }
2331
2410
 
2332
- .L9t91q_count {
2333
- left: calc(100% - 2 * var(--window-unit));
2334
- top: calc(-2 * var(--window-unit));
2335
- font-size: .85em;
2336
- line-height: 1;
2337
- position: absolute;
2411
+ .yNZdnG_slider > input:focus-visible {
2412
+ outline: 1px solid var(--esf-button-active-edge);
2413
+ outline-offset: calc(4 * var(--info-unit));
2338
2414
  }
2339
2415
 
2340
- .L9t91q_tools {
2341
- left: calc(16 * var(--window-unit));
2342
- top: calc(125 * var(--window-unit));
2416
+ .yNZdnG_value {
2417
+ font-variant-numeric: tabular-nums;
2418
+ text-align: right;
2419
+ white-space: nowrap;
2343
2420
  }
2344
2421
 
2345
- .L9t91q_panels {
2346
- right: calc(11 * var(--window-unit));
2347
- top: calc(167 * var(--window-unit));
2422
+ .yNZdnG_change {
2423
+ color: var(--esf-text-muted);
2424
+ font-variant-numeric: tabular-nums;
2425
+ text-align: right;
2348
2426
  }
2349
2427
 
2350
- .L9t91q_tool {
2351
- background: var(--esf-button);
2352
- border-radius: 0 calc(5 * var(--window-unit)) calc(5 * var(--window-unit)) 0;
2353
- box-shadow: inset calc(-1 * var(--window-unit)) 0 var(--esf-button-edge);
2354
- cursor: default;
2355
- height: calc(39 * var(--window-unit));
2356
- width: calc(45 * var(--window-unit));
2357
- border: none;
2358
- justify-content: center;
2359
- align-items: center;
2360
- padding: 0;
2361
- display: flex;
2428
+ .yNZdnG_change[data-change="better"] {
2429
+ color: var(--esf-good);
2362
2430
  }
2363
2431
 
2364
- .L9t91q_panels .L9t91q_tool {
2365
- border-radius: calc(5 * var(--window-unit)) 0 0 calc(5 * var(--window-unit));
2366
- box-shadow: inset var(--window-unit) 0 var(--esf-button-edge);
2367
- width: calc(42 * var(--window-unit));
2432
+ .yNZdnG_change[data-change="worse"] {
2433
+ color: var(--esf-bad);
2368
2434
  }
2369
2435
 
2370
- .L9t91q_tools .L9t91q_tool[aria-expanded="true"] {
2371
- background: var(--esf-button-active);
2372
- box-shadow: inset calc(-1 * var(--window-unit)) 0 var(--esf-button-active-edge);
2436
+ .yNZdnG_button {
2437
+ background: var(--esf-button);
2438
+ border: 1px solid var(--esf-button-edge);
2439
+ color: var(--esf-text);
2440
+ cursor: pointer;
2441
+ font: inherit;
2442
+ padding: calc(4 * var(--info-unit)) calc(12 * var(--info-unit));
2373
2443
  }
2374
2444
 
2375
- .L9t91q_panels .L9t91q_tool[aria-expanded="true"] {
2445
+ .yNZdnG_button:hover:not(:disabled), .yNZdnG_button:focus-visible {
2376
2446
  background: var(--esf-button-active);
2377
- box-shadow: inset var(--window-unit) 0 var(--esf-button-active-edge);
2447
+ border-color: var(--esf-button-active-edge);
2378
2448
  }
2379
2449
 
2380
- .L9t91q_tools .L9t91q_tool > img {
2381
- height: calc(40 * var(--window-unit));
2382
- width: calc(40 * var(--window-unit));
2450
+ .yNZdnG_button:disabled {
2451
+ cursor: default;
2452
+ opacity: .5;
2383
2453
  }
2384
2454
 
2385
- .L9t91q_panels .L9t91q_tool > img {
2386
- height: calc(20 * var(--window-unit));
2387
- width: calc(20 * var(--window-unit));
2455
+ .yNZdnG_import {
2456
+ gap: calc(8 * var(--info-unit));
2457
+ flex-direction: column;
2458
+ display: flex;
2388
2459
  }
2389
2460
 
2390
- .L9t91q_bays {
2391
- gap: calc(4 * var(--window-unit));
2392
- bottom: calc(17 * var(--window-unit));
2393
- left: calc(19 * var(--window-unit));
2394
- display: grid;
2461
+ .yNZdnG_panel > .yNZdnG_button, .yNZdnG_import > .yNZdnG_button {
2462
+ align-self: flex-start;
2395
2463
  }
2396
2464
 
2397
- .L9t91q_bay {
2398
- color: inherit;
2399
- align-items: center;
2400
- column-gap: calc(5 * var(--window-unit));
2401
- cursor: default;
2465
+ .yNZdnG_field {
2466
+ resize: vertical;
2467
+ background: var(--esf-input-bg);
2468
+ border: 1px solid var(--esf-input-border);
2469
+ color: var(--esf-text);
2402
2470
  font: inherit;
2403
- line-height: calc(13 * var(--window-unit));
2404
- background: none;
2405
- border: none;
2406
- grid-template-columns: repeat(4, auto);
2407
- justify-content: start;
2408
- padding: 0;
2409
- display: grid;
2471
+ padding: calc(6 * var(--info-unit)) calc(8 * var(--info-unit));
2410
2472
  }
2411
2473
 
2412
- .L9t91q_bayAnchor {
2413
- anchor-name: var(--bay-anchor);
2474
+ .yNZdnG_field:focus {
2475
+ border-color: var(--esf-text-muted);
2476
+ outline: none;
2414
2477
  }
2415
2478
 
2416
- .L9t91q_bay > * {
2417
- pointer-events: none;
2479
+ .yNZdnG_error {
2480
+ color: var(--esf-violation-error);
2481
+ margin: 0;
2418
2482
  }
2419
-
2420
- .L9t91q_bay:focus-visible {
2421
- outline: var(--window-unit) solid var(--esf-text);
2483
+ .qMyuGa_bonuses {
2484
+ --unit: var(--tooltip-unit, 1px);
2485
+ color: var(--esf-text-muted);
2486
+ align-items: baseline;
2487
+ column-gap: calc(8 * var(--unit));
2488
+ max-height: min(calc(500 * var(--unit)), 60vh);
2489
+ row-gap: calc(4 * var(--unit));
2490
+ scrollbar-color: var(--esf-border) transparent;
2491
+ scrollbar-width: thin;
2492
+ grid-template-columns: auto 1fr;
2493
+ line-height: 1.3;
2494
+ display: grid;
2495
+ overflow-y: auto;
2422
2496
  }
2423
2497
 
2424
- .L9t91q_bay > img {
2425
- height: calc(32 * var(--window-unit));
2426
- width: calc(32 * var(--window-unit));
2427
- grid-area: 1 / 1 / 3;
2498
+ .qMyuGa_name {
2499
+ color: var(--esf-text);
2500
+ grid-column: 1 / -1;
2428
2501
  }
2429
2502
 
2430
- .L9t91q_used, .L9t91q_total {
2431
- grid-column: 3;
2432
- justify-self: end;
2433
- }
2503
+ .qMyuGa_header {
2504
+ color: var(--esf-bonus-header);
2505
+ margin-top: calc(6 * var(--unit));
2506
+ grid-column: 1 / -1;
2507
+ font-weight: 600;
2508
+ }
2434
2509
 
2435
- .L9t91q_used {
2436
- grid-row: 1;
2510
+ .qMyuGa_value {
2511
+ color: var(--esf-bonus-value);
2512
+ text-align: right;
2513
+ white-space: nowrap;
2514
+ font-weight: 600;
2437
2515
  }
2438
2516
 
2439
- .L9t91q_slash, .L9t91q_total, .L9t91q_unit {
2440
- grid-row: 2;
2517
+ .qMyuGa_bonuses [data-bold] {
2518
+ color: var(--esf-text);
2519
+ font-weight: 600;
2441
2520
  }
2442
2521
 
2443
- .L9t91q_slash {
2444
- grid-column: 2;
2522
+ .qMyuGa_bonuses [data-italic] {
2523
+ font-style: italic;
2445
2524
  }
2446
2525
 
2447
- .L9t91q_history {
2448
- bottom: calc(17 * var(--window-unit));
2449
- left: calc(199 * var(--window-unit));
2526
+ .qMyuGa_bonuses [data-underline] {
2527
+ text-decoration: underline;
2528
+ }
2529
+ .gVdevq_panel {
2530
+ background: var(--esf-menu-bg);
2531
+ border: var(--window-unit) solid var(--esf-input-border);
2532
+ box-sizing: border-box;
2533
+ color: var(--esf-text);
2534
+ gap: calc(10 * var(--window-unit));
2535
+ margin: calc(4 * var(--window-unit)) 0;
2536
+ padding: calc(12 * var(--window-unit)) calc(2 * var(--window-unit));
2537
+ position-anchor: var(--bay-anchor);
2538
+ position-area: bottom span-right;
2539
+ position-try-fallbacks: flip-block;
2540
+ width: calc(370 * var(--window-unit));
2541
+ justify-items: center;
2542
+ inset: auto;
2450
2543
  }
2451
2544
 
2452
- .L9t91q_services {
2453
- gap: calc(4 * var(--window-unit));
2454
- bottom: calc(38 * var(--window-unit));
2455
- left: calc(164 * var(--window-unit));
2456
- display: flex;
2545
+ .gVdevq_panel:popover-open {
2546
+ display: grid;
2457
2547
  }
2458
2548
 
2459
- .L9t91q_resources {
2460
- gap: calc(10 * var(--window-unit));
2461
- line-height: calc(16 * var(--window-unit));
2462
- right: calc(13 * var(--window-unit));
2463
- bottom: calc(17 * var(--window-unit));
2464
- text-align: right;
2549
+ .gVdevq_panel[data-empty] {
2550
+ padding: calc(17 * var(--window-unit)) calc(20 * var(--window-unit));
2551
+ width: auto;
2552
+ }
2553
+
2554
+ .gVdevq_list {
2555
+ column-gap: calc(8 * var(--window-unit));
2556
+ grid-template-columns: minmax(calc(62 * var(--window-unit)), max-content) auto 1fr auto;
2557
+ max-height: calc(8 * 32 * var(--window-unit));
2558
+ width: 100%;
2559
+ margin: 0;
2560
+ padding: 0;
2561
+ list-style: none;
2465
2562
  display: grid;
2563
+ overflow-y: auto;
2466
2564
  }
2467
2565
 
2468
- .L9t91q_resource {
2469
- gap: calc(2 * var(--window-unit));
2566
+ .gVdevq_row {
2567
+ grid-column: 1 / -1;
2568
+ grid-template-columns: subgrid;
2569
+ height: calc(32 * var(--window-unit));
2570
+ padding: 0 calc(8 * var(--window-unit));
2571
+ align-items: center;
2470
2572
  display: grid;
2471
2573
  }
2472
2574
 
2473
- .L9t91q_title {
2575
+ .gVdevq_row:hover {
2576
+ background: var(--esf-bay-row-hover);
2577
+ }
2578
+
2579
+ .gVdevq_quantity {
2580
+ border: var(--window-unit) solid transparent;
2581
+ align-items: center;
2582
+ column-gap: calc(8 * var(--window-unit));
2583
+ padding: calc(5 * var(--window-unit)) calc(6 * var(--window-unit));
2584
+ grid-template-columns: auto auto;
2585
+ justify-self: end;
2586
+ justify-items: center;
2587
+ display: grid;
2588
+ }
2589
+
2590
+ .gVdevq_count {
2591
+ appearance: textfield;
2592
+ color: inherit;
2593
+ font: inherit;
2594
+ font-variant-numeric: tabular-nums;
2595
+ text-align: right;
2596
+ background: none;
2597
+ border: none;
2598
+ padding: 0;
2599
+ }
2600
+
2601
+ .gVdevq_count::-webkit-inner-spin-button {
2602
+ appearance: none;
2603
+ }
2604
+
2605
+ .gVdevq_count:focus {
2606
+ outline: none;
2607
+ }
2608
+
2609
+ .gVdevq_times, .gVdevq_steps {
2610
+ grid-area: 1 / 2;
2611
+ }
2612
+
2613
+ .gVdevq_steps {
2614
+ visibility: hidden;
2615
+ }
2616
+
2617
+ .gVdevq_steps > button {
2618
+ cursor: default;
2619
+ opacity: .6;
2620
+ background: none;
2621
+ border: none;
2622
+ padding: 0;
2623
+ display: block;
2624
+ }
2625
+
2626
+ .gVdevq_steps > button:hover {
2627
+ opacity: 1;
2628
+ }
2629
+
2630
+ .gVdevq_steps img {
2631
+ height: calc(8 * var(--window-unit));
2632
+ width: calc(8 * var(--window-unit));
2633
+ display: block;
2634
+ }
2635
+
2636
+ .gVdevq_quantity:hover, .gVdevq_quantity:focus-within {
2637
+ border-color: var(--esf-spinner-edge);
2638
+ }
2639
+
2640
+ .gVdevq_quantity:hover .gVdevq_times, .gVdevq_quantity:focus-within .gVdevq_times {
2641
+ visibility: hidden;
2642
+ }
2643
+
2644
+ .gVdevq_quantity:hover .gVdevq_steps, .gVdevq_quantity:focus-within .gVdevq_steps {
2645
+ visibility: visible;
2646
+ }
2647
+
2648
+ .gVdevq_quantity:focus-within {
2649
+ background: var(--esf-spinner-focus);
2650
+ border-color: var(--esf-spinner-focus-edge);
2651
+ }
2652
+
2653
+ .gVdevq_icon {
2654
+ height: calc(24 * var(--window-unit));
2655
+ width: calc(24 * var(--window-unit));
2656
+ }
2657
+
2658
+ .gVdevq_icon > span {
2659
+ width: 100%;
2660
+ height: 100%;
2661
+ display: block;
2662
+ }
2663
+
2664
+ .gVdevq_middle {
2665
+ gap: calc(6 * var(--window-unit));
2666
+ min-width: 0;
2667
+ display: grid;
2668
+ }
2669
+
2670
+ .gVdevq_name {
2671
+ text-align: center;
2672
+ text-overflow: ellipsis;
2673
+ white-space: nowrap;
2674
+ overflow: hidden;
2675
+ }
2676
+
2677
+ .gVdevq_name[data-mutated] {
2678
+ color: var(--esf-mutated);
2679
+ }
2680
+
2681
+ .gVdevq_activeDrones {
2682
+ padding-left: calc(8 * var(--window-unit));
2683
+ justify-self: start;
2474
2684
  font-weight: 600;
2475
2685
  }
2476
2686
 
2477
- .L9t91q_resource[data-change="better"] .L9t91q_free {
2478
- color: var(--esf-good);
2687
+ .gVdevq_panel[data-drones] .gVdevq_list {
2688
+ grid-template-columns: minmax(calc(52 * var(--window-unit)), max-content) auto 1fr auto;
2689
+ max-height: calc(5 * 64 * var(--window-unit));
2479
2690
  }
2480
2691
 
2481
- .L9t91q_resource[data-change="worse"] .L9t91q_free {
2482
- color: var(--esf-bad);
2692
+ .gVdevq_panel[data-drones] .gVdevq_row {
2693
+ height: calc(64 * var(--window-unit));
2483
2694
  }
2484
2695
 
2485
- .L9t91q_bay[data-over], .L9t91q_resource[data-over] > :last-child, .L9t91q_resource[data-over] .L9t91q_free {
2486
- color: var(--esf-violation-error);
2696
+ .gVdevq_panel[data-drones] .gVdevq_icon {
2697
+ height: calc(60 * var(--window-unit));
2698
+ width: calc(60 * var(--window-unit));
2487
2699
  }
2488
2700
 
2489
- .L9t91q_browser, .L9t91q_statistics {
2490
- bottom: calc(16 * var(--window-unit));
2491
- top: calc(64 * var(--window-unit));
2701
+ .gVdevq_panel[data-drones] .gVdevq_name {
2702
+ text-align: left;
2703
+ }
2704
+
2705
+ .gVdevq_panel[data-fighters] {
2706
+ padding: calc(12 * var(--window-unit));
2707
+ width: auto;
2708
+ }
2709
+
2710
+ .gVdevq_panel[data-fighters] .gVdevq_list {
2711
+ width: calc(5 * 88 * var(--window-unit) - 2 * var(--window-unit));
2712
+ }
2713
+
2714
+ .gVdevq_kinds {
2715
+ gap: calc(22 * var(--window-unit));
2716
+ min-height: calc(16 * var(--window-unit));
2717
+ padding-left: calc(4 * var(--window-unit));
2718
+ justify-self: start;
2719
+ display: flex;
2720
+ }
2721
+
2722
+ .gVdevq_kind {
2723
+ align-items: baseline;
2724
+ gap: calc(2 * var(--window-unit));
2725
+ display: flex;
2726
+ }
2727
+
2728
+ .gVdevq_kind > img {
2729
+ height: calc(16 * var(--window-unit));
2730
+ translate: 0 calc(8 * var(--window-unit) - .5cap);
2731
+ width: calc(16 * var(--window-unit));
2732
+ }
2733
+
2734
+ .gVdevq_tubes {
2735
+ gap: calc(2 * var(--window-unit));
2736
+ display: flex;
2737
+ }
2738
+
2739
+ .gVdevq_none {
2740
+ padding: calc(6 * var(--window-unit)) calc(8 * var(--window-unit));
2741
+ justify-self: stretch;
2742
+ }
2743
+
2744
+ .gVdevq_none:hover {
2745
+ background: var(--esf-bay-row-hover);
2746
+ }
2747
+
2748
+ .gVdevq_selection {
2749
+ color: var(--esf-text-muted);
2750
+ align-items: center;
2751
+ gap: calc(3 * var(--window-unit));
2752
+ display: flex;
2753
+ }
2754
+
2755
+ .gVdevq_box {
2756
+ background: var(--esf-drone-box);
2757
+ border: var(--window-unit) solid var(--esf-button-edge);
2758
+ color: var(--esf-text);
2759
+ cursor: default;
2760
+ font-size: calc(10 * var(--window-unit));
2761
+ height: calc(13 * var(--window-unit));
2762
+ width: calc(13 * var(--window-unit));
2763
+ padding: 0;
2764
+ line-height: 1;
2765
+ }
2766
+
2767
+ .gVdevq_box:first-child {
2768
+ margin-left: calc(2 * var(--window-unit));
2769
+ }
2770
+
2771
+ .gVdevq_box[data-state="active"] {
2772
+ background: var(--esf-button-active);
2773
+ }
2774
+
2775
+ .gVdevq_box[data-state="open"] {
2776
+ background: var(--esf-drone-box-open);
2777
+ }
2778
+
2779
+ .gVdevq_box:enabled:hover {
2780
+ border-color: var(--esf-button-active-edge);
2781
+ }
2782
+
2783
+ .gVdevq_box[data-state="none"] {
2784
+ background: var(--esf-drone-box-empty);
2785
+ border-color: var(--esf-drone-box-empty);
2786
+ }
2787
+
2788
+ .gVdevq_remove {
2789
+ cursor: default;
2790
+ opacity: .6;
2791
+ background: none;
2792
+ border: none;
2793
+ padding: 0;
2794
+ }
2795
+
2796
+ .gVdevq_remove:hover, .gVdevq_remove:focus-visible {
2797
+ opacity: 1;
2798
+ }
2799
+
2800
+ .gVdevq_remove > img {
2801
+ height: calc(16 * var(--window-unit));
2802
+ width: calc(16 * var(--window-unit));
2803
+ display: block;
2804
+ }
2805
+
2806
+ .gVdevq_removeAll {
2807
+ background: var(--esf-button);
2808
+ border: var(--window-unit) solid var(--esf-button-edge);
2809
+ color: inherit;
2810
+ cursor: default;
2811
+ font: inherit;
2812
+ height: calc(31 * var(--window-unit));
2813
+ padding: 0 calc(14 * var(--window-unit));
2814
+ }
2815
+
2816
+ .gVdevq_removeAll:hover, .gVdevq_removeAll:focus-visible {
2817
+ background: var(--esf-button-active);
2818
+ border-color: var(--esf-button-active-edge);
2819
+ }
2820
+
2821
+ .gVdevq_remove:focus-visible, .gVdevq_removeAll:focus-visible, .gVdevq_box:focus-visible {
2822
+ outline: var(--window-unit) solid var(--esf-text);
2823
+ }
2824
+ .Wlg6ma_tube {
2825
+ --tube-unit: calc(1px * var(--esf-scale, 1));
2826
+ border-image: var(--tube) 6 fill / calc(6 * var(--tube-unit));
2827
+ box-sizing: border-box;
2828
+ color: var(--esf-text-muted);
2829
+ height: calc(116 * var(--tube-unit));
2830
+ user-select: none;
2831
+ width: calc(86 * var(--tube-unit));
2832
+ position: relative;
2833
+ }
2834
+
2835
+ .Wlg6ma_tube:not([data-state="unavailable"]):hover:before {
2836
+ background: var(--esf-fighter-tube-hover);
2837
+ content: "";
2838
+ position: absolute;
2839
+ inset: 0;
2840
+ }
2841
+
2842
+ .Wlg6ma_tube[data-state="unavailable"] {
2843
+ opacity: .4;
2844
+ }
2845
+
2846
+ .Wlg6ma_number {
2847
+ color: var(--esf-text);
2848
+ font-size: calc(11 * var(--tube-unit));
2849
+ height: calc(14 * var(--tube-unit));
2850
+ left: calc(2 * var(--tube-unit));
2851
+ top: calc(2 * var(--tube-unit));
2852
+ width: calc(14 * var(--tube-unit));
2853
+ justify-content: center;
2854
+ align-items: center;
2855
+ line-height: 1;
2856
+ display: flex;
2857
+ position: absolute;
2858
+ }
2859
+
2860
+ .Wlg6ma_number:before {
2861
+ background: var(--flag) center / 100% 100%;
2862
+ content: "";
2863
+ opacity: .35;
2864
+ position: absolute;
2865
+ inset: 0;
2866
+ }
2867
+
2868
+ .Wlg6ma_empty, .Wlg6ma_squadron {
2869
+ height: calc(86 * var(--tube-unit));
2870
+ width: calc(86 * var(--tube-unit));
2871
+ position: absolute;
2872
+ top: 0;
2873
+ left: 0;
2874
+ }
2875
+
2876
+ .Wlg6ma_empty {
2877
+ background: var(--texture) center / 100% 100%;
2878
+ }
2879
+
2880
+ .Wlg6ma_squadron {
2881
+ background: var(--underlay) center / 100% 100%;
2882
+ }
2883
+
2884
+ .Wlg6ma_squadron:after {
2885
+ background: var(--overlay) center / 100% 100%;
2886
+ content: "";
2887
+ position: absolute;
2888
+ inset: 0;
2889
+ }
2890
+
2891
+ .Wlg6ma_picture {
2892
+ height: calc(54 * var(--tube-unit));
2893
+ left: calc(16 * var(--tube-unit));
2894
+ top: calc(16 * var(--tube-unit));
2895
+ width: calc(54 * var(--tube-unit));
2896
+ border-radius: 50%;
2492
2897
  position: absolute;
2493
2898
  overflow: hidden;
2494
2899
  }
2495
2900
 
2496
- .L9t91q_browser {
2497
- left: calc(15 * var(--window-unit));
2498
- width: calc(393 * var(--window-unit));
2901
+ .Wlg6ma_picture > span {
2902
+ width: 100%;
2903
+ height: 100%;
2904
+ display: block;
2499
2905
  }
2500
2906
 
2501
- .L9t91q_statistics {
2502
- left: calc(700 * var(--window-unit) + var(--browser-width));
2503
- transition: left .2s;
2907
+ .Wlg6ma_tube[data-preview] .Wlg6ma_picture {
2908
+ filter: sepia() hue-rotate(190deg) saturate(200%);
2909
+ }
2910
+
2911
+ .Wlg6ma_ring {
2912
+ fill: none;
2913
+ stroke: var(--esf-fighter-empty);
2914
+ stroke-width: 4.5px;
2915
+ position: absolute;
2916
+ inset: 0;
2917
+ }
2918
+
2919
+ .Wlg6ma_ring > [data-lit] {
2920
+ stroke: var(--esf-fighter-full);
2921
+ }
2922
+
2923
+ .Wlg6ma_role {
2924
+ bottom: calc(18 * var(--tube-unit));
2925
+ z-index: 1;
2926
+ position: absolute;
2927
+ left: 50%;
2928
+ translate: -50%;
2929
+ }
2930
+
2931
+ .Wlg6ma_role > img {
2932
+ height: calc(16 * var(--tube-unit));
2933
+ width: calc(16 * var(--tube-unit));
2934
+ display: block;
2935
+ }
2936
+
2937
+ .Wlg6ma_label {
2938
+ text-align: center;
2939
+ left: 0;
2504
2940
  right: 0;
2941
+ top: calc(79 * var(--tube-unit));
2942
+ position: absolute;
2505
2943
  }
2506
2944
 
2507
- .L9t91q_statistics > .L9t91q_slide {
2508
- width: calc(280 * var(--window-unit));
2945
+ .Wlg6ma_resize {
2946
+ gap: calc(8 * var(--tube-unit));
2947
+ left: 0;
2948
+ right: 0;
2949
+ top: calc(96 * var(--tube-unit));
2950
+ justify-content: center;
2951
+ display: flex;
2952
+ position: absolute;
2509
2953
  }
2510
2954
 
2511
- .L9t91q_slide {
2512
- visibility: hidden;
2513
- height: 100%;
2514
- transition: transform .2s, visibility .2s;
2955
+ .Wlg6ma_resize > button, .Wlg6ma_remove {
2956
+ color: var(--esf-text);
2957
+ cursor: default;
2958
+ font: inherit;
2959
+ opacity: .8;
2960
+ background: none;
2961
+ border: none;
2962
+ padding: 0;
2963
+ line-height: 1;
2964
+ }
2965
+
2966
+ .Wlg6ma_resize > button {
2967
+ font-size: calc(15 * var(--tube-unit));
2968
+ width: calc(12 * var(--tube-unit));
2969
+ font-weight: 600;
2970
+ }
2971
+
2972
+ .Wlg6ma_resize > button:disabled {
2973
+ opacity: .3;
2515
2974
  }
2516
2975
 
2517
- .L9t91q_browser > .L9t91q_slide, .L9t91q_statistics > .L9t91q_slide {
2518
- transform: translateX(-100%);
2976
+ .Wlg6ma_remove {
2977
+ right: calc(4 * var(--tube-unit));
2978
+ top: calc(3 * var(--tube-unit));
2979
+ position: absolute;
2519
2980
  }
2520
2981
 
2521
- .L9t91q_window[data-browser] > .L9t91q_browser > .L9t91q_slide, .L9t91q_window[data-statistics] > .L9t91q_statistics > .L9t91q_slide {
2522
- visibility: visible;
2523
- transform: none;
2982
+ .Wlg6ma_remove > img {
2983
+ height: calc(14 * var(--tube-unit));
2984
+ width: calc(14 * var(--tube-unit));
2985
+ display: block;
2524
2986
  }
2525
2987
 
2526
- @media (prefers-reduced-motion: reduce) {
2527
- .L9t91q_window, .L9t91q_frame, .L9t91q_statistics, .L9t91q_slide {
2528
- transition: none;
2529
- }
2988
+ .Wlg6ma_resize > button:enabled:hover, .Wlg6ma_remove:hover {
2989
+ opacity: 1;
2530
2990
  }
2531
- .xFSZwa_browser {
2532
- --browser-unit: calc(1px * var(--esf-scale, 1));
2991
+
2992
+ .Wlg6ma_resize > button:focus-visible, .Wlg6ma_remove:focus-visible {
2993
+ opacity: 1;
2994
+ outline: var(--tube-unit) solid var(--esf-text);
2995
+ }
2996
+ .L9t91q_window {
2997
+ --window-unit: calc(1px * var(--esf-scale, 1));
2998
+ --browser-width: 0px;
2999
+ --statistics-width: 0px;
2533
3000
  color: var(--esf-text);
2534
3001
  font-family: var(--esf-font);
2535
3002
  font-size: calc(var(--esf-font-size) * var(--esf-scale, 1));
3003
+ height: calc(694 * var(--window-unit));
2536
3004
  user-select: none;
2537
- height: 100%;
2538
- width: calc(393 * var(--browser-unit));
2539
- flex-direction: column;
2540
- display: flex;
3005
+ width: calc(708 * var(--window-unit) + var(--browser-width) + var(--statistics-width));
3006
+ transition: width .2s;
3007
+ position: relative;
2541
3008
  }
2542
3009
 
2543
- .xFSZwa_tabs {
2544
- --corner: calc(6 * var(--browser-unit));
2545
- clip-path: polygon(0 0,
2546
- 100% 0,
2547
- 100% calc(100% - var(--corner)),
2548
- calc(100% - var(--corner)) 100%,
2549
- var(--corner) 100%,
2550
- 0 calc(100% - var(--corner)));
2551
- gap: calc(4 * var(--browser-unit));
2552
- display: flex;
3010
+ .L9t91q_window[data-browser] {
3011
+ --browser-width: calc(400 * var(--window-unit));
2553
3012
  }
2554
3013
 
2555
- .xFSZwa_tab {
2556
- background: var(--esf-tab);
2557
- color: inherit;
2558
- cursor: default;
2559
- font: inherit;
2560
- height: calc(24 * var(--browser-unit));
2561
- border: none;
2562
- flex: 1;
2563
- padding: 0;
3014
+ .L9t91q_window[data-statistics] {
3015
+ --statistics-width: calc(272 * var(--window-unit));
2564
3016
  }
2565
3017
 
2566
- .xFSZwa_tab[aria-selected="true"] {
2567
- background: var(--esf-tab-active);
3018
+ .L9t91q_frame {
3019
+ inset: calc(29 * var(--window-unit)) auto 0 var(--browser-width);
3020
+ width: calc(700 * var(--window-unit));
3021
+ transition: left .2s;
3022
+ position: absolute;
2568
3023
  }
2569
3024
 
2570
- .xFSZwa_tab:focus-visible, .xFSZwa_collapse:focus-visible {
2571
- outline: var(--browser-unit) solid var(--esf-text);
3025
+ .L9t91q_icon > img, .L9t91q_tool > img, .L9t91q_bay > img {
3026
+ display: block;
2572
3027
  }
2573
3028
 
2574
- .xFSZwa_tab:focus-visible {
2575
- outline-offset: calc(-1 * var(--browser-unit));
3029
+ .L9t91q_wheel {
3030
+ --esf-wheel-size: calc(572 * var(--window-unit));
3031
+ left: calc(68 * var(--window-unit));
3032
+ position: absolute;
3033
+ top: 0;
2576
3034
  }
2577
3035
 
2578
- .xFSZwa_panel {
2579
- flex-direction: column;
2580
- flex: 1;
2581
- min-height: 0;
3036
+ .L9t91q_placeholder {
3037
+ color: var(--esf-text-muted);
3038
+ justify-content: center;
3039
+ align-items: center;
2582
3040
  display: flex;
3041
+ position: absolute;
3042
+ inset: 0;
2583
3043
  }
2584
3044
 
2585
- .xFSZwa_panel[hidden] {
2586
- display: none;
3045
+ .L9t91q_placeholder > p {
3046
+ text-align: center;
3047
+ white-space: pre-line;
3048
+ margin: 0;
2587
3049
  }
2588
3050
 
2589
- .xFSZwa_search {
2590
- height: calc(32 * var(--browser-unit));
2591
- margin-top: calc(8 * var(--browser-unit));
3051
+ .L9t91q_name, .L9t91q_violations, .L9t91q_tools, .L9t91q_panels, .L9t91q_bays, .L9t91q_history, .L9t91q_services, .L9t91q_resources {
3052
+ position: absolute;
3053
+ }
3054
+
3055
+ .L9t91q_name {
2592
3056
  align-items: center;
3057
+ gap: calc(2 * var(--window-unit));
3058
+ left: calc(20 * var(--window-unit));
3059
+ max-width: calc(150 * var(--window-unit));
3060
+ top: calc(40 * var(--window-unit));
3061
+ white-space: nowrap;
2593
3062
  display: flex;
2594
3063
  }
2595
3064
 
2596
- .xFSZwa_collapse {
2597
- cursor: pointer;
2598
- opacity: .6;
2599
- width: calc(28 * var(--browser-unit));
3065
+ .L9t91q_fitName {
3066
+ color: inherit;
3067
+ cursor: text;
3068
+ font: inherit;
3069
+ text-overflow: ellipsis;
2600
3070
  background: none;
2601
3071
  border: none;
2602
- justify-content: center;
2603
3072
  padding: 0;
2604
- display: flex;
2605
- }
2606
-
2607
- .xFSZwa_collapse:hover, .xFSZwa_collapse:focus-visible {
2608
- opacity: 1;
2609
- }
2610
-
2611
- .xFSZwa_collapse > img {
2612
- height: calc(14 * var(--browser-unit));
2613
- width: calc(14 * var(--browser-unit));
2614
- }
2615
-
2616
- .xFSZwa_field > img {
2617
- height: calc(16 * var(--browser-unit));
2618
- opacity: .5;
2619
- width: calc(16 * var(--browser-unit));
3073
+ overflow: hidden;
2620
3074
  }
2621
3075
 
2622
- .xFSZwa_field {
3076
+ .L9t91q_fitNameInput {
2623
3077
  background: var(--esf-input-bg);
2624
- border: var(--browser-unit) solid var(--esf-input-border);
2625
- align-self: stretch;
2626
- align-items: center;
2627
- gap: calc(5 * var(--browser-unit));
2628
- padding-left: calc(12 * var(--browser-unit));
2629
- flex: 1;
2630
- display: flex;
3078
+ border: var(--window-unit) solid var(--esf-input-border);
3079
+ color: var(--esf-text);
3080
+ font: inherit;
3081
+ min-width: 0;
3082
+ padding: 0 calc(2 * var(--window-unit));
2631
3083
  }
2632
3084
 
2633
- .xFSZwa_field > input {
2634
- color: inherit;
2635
- font: inherit;
3085
+ .L9t91q_icon {
3086
+ cursor: default;
2636
3087
  background: none;
2637
3088
  border: none;
2638
- outline: none;
2639
- flex: 1;
2640
- min-width: 0;
2641
3089
  padding: 0;
2642
3090
  }
2643
3091
 
2644
- .xFSZwa_field > input::placeholder {
2645
- color: var(--esf-text-muted);
3092
+ .L9t91q_icon > img {
3093
+ height: calc(16 * var(--window-unit));
3094
+ width: calc(16 * var(--window-unit));
2646
3095
  }
2647
3096
 
2648
- .xFSZwa_field:focus-within {
2649
- border-color: var(--esf-text-muted);
3097
+ .L9t91q_icon > img[data-icon="link"] {
3098
+ height: calc(12 * var(--window-unit));
3099
+ margin: 0 calc(2 * var(--window-unit));
3100
+ opacity: .6;
3101
+ width: calc(12 * var(--window-unit));
2650
3102
  }
2651
3103
 
2652
- .xFSZwa_filters {
2653
- gap: calc(4 * var(--browser-unit));
2654
- margin: calc(4 * var(--browser-unit)) 0 0;
2655
- border: none;
2656
- min-width: 0;
2657
- padding: 0;
3104
+ .L9t91q_icon:focus-visible, .L9t91q_tool:focus-visible {
3105
+ outline: var(--window-unit) solid var(--esf-text);
3106
+ }
3107
+
3108
+ .L9t91q_violations {
3109
+ gap: calc(14 * var(--window-unit));
3110
+ left: calc(20 * var(--window-unit));
3111
+ top: calc(62 * var(--window-unit));
2658
3112
  display: flex;
2659
3113
  }
2660
3114
 
2661
- .xFSZwa_tree {
2662
- margin-top: calc(8 * var(--browser-unit));
2663
- flex: 1;
2664
- min-height: 0;
2665
- overflow-y: auto;
3115
+ .L9t91q_violation {
3116
+ height: calc(28 * var(--window-unit));
3117
+ width: calc(28 * var(--window-unit));
3118
+ position: relative;
2666
3119
  }
2667
3120
 
2668
- .xFSZwa_empty {
2669
- color: var(--esf-text-muted);
2670
- font-size: calc(20 * var(--browser-unit));
2671
- margin: calc(24 * var(--browser-unit)) 0 0;
2672
- text-align: center;
3121
+ .L9t91q_violation, .L9t91q_alert {
3122
+ --colour: var(--esf-violation-notice);
2673
3123
  }
2674
3124
 
2675
- .xFSZwa_hull {
2676
- font-weight: 600;
3125
+ .L9t91q_violation:before {
3126
+ background: var(--colour);
3127
+ content: "";
3128
+ mask: var(--texture) center / 100% 100%;
3129
+ position: absolute;
3130
+ inset: 0;
2677
3131
  }
2678
3132
 
2679
- .xFSZwa_counts {
2680
- display: flex;
3133
+ .L9t91q_violation[data-kind="error"], .L9t91q_alert[data-kind="error"] {
3134
+ --colour: var(--esf-violation-error);
2681
3135
  }
2682
3136
 
2683
- .xFSZwa_count {
2684
- align-items: center;
2685
- gap: calc(3 * var(--browser-unit));
2686
- min-width: calc(39 * var(--browser-unit));
2687
- display: flex;
3137
+ .L9t91q_violation[data-kind="skill"], .L9t91q_alert[data-kind="skill"] {
3138
+ --colour: var(--esf-violation-skill);
2688
3139
  }
2689
3140
 
2690
- .xFSZwa_count > img, .xFSZwa_kind > img {
2691
- height: calc(12 * var(--browser-unit));
2692
- width: calc(12 * var(--browser-unit));
2693
- display: block;
3141
+ .L9t91q_alert {
3142
+ display: contents;
2694
3143
  }
2695
3144
 
2696
- .xFSZwa_unseen {
2697
- clip-path: inset(50%);
2698
- white-space: nowrap;
2699
- width: 1px;
2700
- height: 1px;
2701
- position: absolute;
2702
- overflow: hidden;
3145
+ .L9t91q_alertTitle {
3146
+ color: var(--colour);
3147
+ text-transform: uppercase;
2703
3148
  }
2704
3149
 
2705
- .xFSZwa_kind {
2706
- margin-right: calc(5 * var(--browser-unit));
2707
- vertical-align: middle;
2708
- display: inline-block;
3150
+ .L9t91q_alertLine {
3151
+ align-items: center;
3152
+ gap: calc(8 * var(--window-unit));
3153
+ display: flex;
2709
3154
  }
2710
3155
 
2711
- .xFSZwa_flyable {
2712
- background: var(--esf-flyable);
2713
- height: calc(12 * var(--browser-unit));
3156
+ .L9t91q_alertLine:before {
3157
+ background: var(--colour);
3158
+ content: "";
3159
+ height: 1.4em;
2714
3160
  mask: var(--texture) center / 100% 100%;
2715
- width: calc(12 * var(--browser-unit));
2716
3161
  flex: none;
3162
+ width: 1.4em;
3163
+ }
3164
+
3165
+ .L9t91q_count {
3166
+ left: calc(100% - 2 * var(--window-unit));
3167
+ top: calc(-2 * var(--window-unit));
3168
+ font-size: .85em;
3169
+ line-height: 1;
3170
+ position: absolute;
2717
3171
  }
2718
3172
 
2719
- .xFSZwa_flyable[data-missing] {
2720
- background: var(--esf-not-flyable);
3173
+ .L9t91q_tools {
3174
+ left: calc(16 * var(--window-unit));
3175
+ top: calc(125 * var(--window-unit));
2721
3176
  }
2722
3177
 
2723
- .xFSZwa_simulate {
2724
- cursor: pointer;
2725
- opacity: .9;
2726
- background: none;
3178
+ .L9t91q_panels {
3179
+ right: calc(11 * var(--window-unit));
3180
+ top: calc(167 * var(--window-unit));
3181
+ }
3182
+
3183
+ .L9t91q_tool {
3184
+ background: var(--esf-button);
3185
+ border-radius: 0 calc(5 * var(--window-unit)) calc(5 * var(--window-unit)) 0;
3186
+ box-shadow: inset calc(-1 * var(--window-unit)) 0 var(--esf-button-edge);
3187
+ cursor: default;
3188
+ height: calc(39 * var(--window-unit));
3189
+ width: calc(45 * var(--window-unit));
2727
3190
  border: none;
2728
- flex: none;
3191
+ justify-content: center;
3192
+ align-items: center;
2729
3193
  padding: 0;
2730
3194
  display: flex;
2731
3195
  }
2732
3196
 
2733
- .xFSZwa_simulate:hover, .xFSZwa_simulate:focus-visible {
2734
- opacity: 1;
3197
+ .L9t91q_panels .L9t91q_tool {
3198
+ border-radius: calc(5 * var(--window-unit)) 0 0 calc(5 * var(--window-unit));
3199
+ box-shadow: inset var(--window-unit) 0 var(--esf-button-edge);
3200
+ width: calc(42 * var(--window-unit));
2735
3201
  }
2736
3202
 
2737
- .xFSZwa_simulate:focus-visible {
2738
- outline: var(--browser-unit) solid var(--esf-text);
3203
+ .L9t91q_tools .L9t91q_tool[aria-expanded="true"] {
3204
+ background: var(--esf-button-active);
3205
+ box-shadow: inset calc(-1 * var(--window-unit)) 0 var(--esf-button-active-edge);
2739
3206
  }
2740
3207
 
2741
- .xFSZwa_simulate > img {
2742
- height: calc(22 * var(--browser-unit));
2743
- width: calc(22 * var(--browser-unit));
3208
+ .L9t91q_panels .L9t91q_tool[aria-expanded="true"] {
3209
+ background: var(--esf-button-active);
3210
+ box-shadow: inset var(--window-unit) 0 var(--esf-button-active-edge);
2744
3211
  }
2745
3212
 
2746
- .xFSZwa_info {
2747
- opacity: .6;
2748
- background: none;
2749
- border: none;
2750
- flex: none;
2751
- padding: 0;
2752
- display: flex;
3213
+ .L9t91q_tools .L9t91q_tool > img {
3214
+ height: calc(40 * var(--window-unit));
3215
+ width: calc(40 * var(--window-unit));
2753
3216
  }
2754
3217
 
2755
- .xFSZwa_info:hover, .xFSZwa_info:focus-visible {
2756
- opacity: 1;
3218
+ .L9t91q_panels .L9t91q_tool > img {
3219
+ height: calc(20 * var(--window-unit));
3220
+ width: calc(20 * var(--window-unit));
2757
3221
  }
2758
3222
 
2759
- .xFSZwa_info:focus-visible {
2760
- outline: var(--browser-unit) solid var(--esf-text);
3223
+ .L9t91q_bays {
3224
+ gap: calc(4 * var(--window-unit));
3225
+ bottom: calc(17 * var(--window-unit));
3226
+ left: calc(19 * var(--window-unit));
3227
+ display: grid;
2761
3228
  }
2762
3229
 
2763
- .xFSZwa_info > img {
2764
- height: calc(16 * var(--browser-unit));
2765
- width: calc(16 * var(--browser-unit));
3230
+ .L9t91q_bay {
3231
+ color: inherit;
3232
+ align-items: center;
3233
+ column-gap: calc(5 * var(--window-unit));
3234
+ cursor: default;
3235
+ font: inherit;
3236
+ line-height: calc(13 * var(--window-unit));
3237
+ background: none;
3238
+ border: none;
3239
+ grid-template-columns: repeat(4, auto);
3240
+ justify-content: start;
3241
+ padding: 0;
3242
+ display: grid;
2766
3243
  }
2767
3244
 
2768
- .xFSZwa_dragImage {
3245
+ .L9t91q_bayAnchor {
3246
+ anchor-name: var(--bay-anchor);
3247
+ }
3248
+
3249
+ .L9t91q_bay > * {
2769
3250
  pointer-events: none;
2770
- position: fixed;
2771
- top: 0;
2772
- left: -1000px;
2773
3251
  }
2774
3252
 
2775
- .xFSZwa_actions {
2776
- gap: calc(8 * var(--browser-unit));
2777
- margin-top: calc(8 * var(--browser-unit));
2778
- display: flex;
3253
+ .L9t91q_bay:focus-visible {
3254
+ outline: var(--window-unit) solid var(--esf-text);
2779
3255
  }
2780
3256
 
2781
- .xFSZwa_action {
2782
- background: var(--esf-button);
2783
- border: var(--browser-unit) solid var(--esf-button-edge);
2784
- color: var(--esf-text);
2785
- cursor: pointer;
2786
- font: inherit;
2787
- height: calc(32 * var(--browser-unit));
2788
- min-width: calc(80 * var(--browser-unit));
2789
- padding: 0 calc(16 * var(--browser-unit));
3257
+ .L9t91q_bay > img {
3258
+ height: calc(32 * var(--window-unit));
3259
+ width: calc(32 * var(--window-unit));
3260
+ grid-area: 1 / 1 / 3;
2790
3261
  }
2791
3262
 
2792
- .xFSZwa_action:hover:not(:disabled), .xFSZwa_action:focus-visible {
2793
- background: var(--esf-button-active);
2794
- border-color: var(--esf-button-active-edge);
3263
+ .L9t91q_used, .L9t91q_total {
3264
+ grid-column: 3;
3265
+ justify-self: end;
2795
3266
  }
2796
3267
 
2797
- .xFSZwa_action:disabled {
2798
- color: var(--esf-text-muted);
2799
- cursor: default;
3268
+ .L9t91q_used {
3269
+ grid-row: 1;
2800
3270
  }
2801
3271
 
2802
- .xFSZwa_copyAnchor {
2803
- anchor-name: --fit-copy;
2804
- display: flex;
3272
+ .L9t91q_slash, .L9t91q_total, .L9t91q_unit {
3273
+ grid-row: 2;
2805
3274
  }
2806
3275
 
2807
- .xFSZwa_copy {
2808
- min-width: 0;
2809
- width: calc(32 * var(--browser-unit));
2810
- justify-content: center;
2811
- align-items: center;
2812
- padding: 0;
2813
- display: flex;
3276
+ .L9t91q_slash {
3277
+ grid-column: 2;
2814
3278
  }
2815
3279
 
2816
- .xFSZwa_copy > img {
2817
- height: calc(16 * var(--browser-unit));
2818
- width: calc(16 * var(--browser-unit));
3280
+ .L9t91q_history {
3281
+ bottom: calc(17 * var(--window-unit));
3282
+ left: calc(199 * var(--window-unit));
2819
3283
  }
2820
3284
 
2821
- .xFSZwa_copy:disabled > img {
2822
- opacity: .4;
3285
+ .L9t91q_services {
3286
+ gap: calc(4 * var(--window-unit));
3287
+ bottom: calc(38 * var(--window-unit));
3288
+ left: calc(164 * var(--window-unit));
3289
+ display: flex;
2823
3290
  }
2824
3291
 
2825
- .xFSZwa_menu {
2826
- background: var(--esf-menu-bg);
2827
- border: var(--browser-unit) solid var(--esf-input-border);
2828
- color: var(--esf-text);
2829
- font-family: var(--esf-font);
2830
- font-size: calc(var(--esf-font-size) * var(--esf-scale, 1));
2831
- margin: calc(4 * var(--browser-unit)) 0;
2832
- padding: calc(6 * var(--browser-unit)) 0;
2833
- position-anchor: --fit-copy;
2834
- position-area: top span-right;
2835
- position-try-fallbacks: flip-block;
2836
- inset: auto;
3292
+ .L9t91q_resources {
3293
+ gap: calc(10 * var(--window-unit));
3294
+ line-height: calc(16 * var(--window-unit));
3295
+ right: calc(13 * var(--window-unit));
3296
+ bottom: calc(17 * var(--window-unit));
3297
+ text-align: right;
3298
+ display: grid;
2837
3299
  }
2838
3300
 
2839
- .xFSZwa_menu > button {
2840
- color: inherit;
2841
- cursor: pointer;
2842
- font: inherit;
2843
- padding: calc(5 * var(--browser-unit)) calc(16 * var(--browser-unit));
2844
- text-align: left;
2845
- background: none;
2846
- border: none;
2847
- width: 100%;
2848
- display: block;
3301
+ .L9t91q_resource {
3302
+ gap: calc(2 * var(--window-unit));
3303
+ display: grid;
2849
3304
  }
2850
3305
 
2851
- .xFSZwa_menu > button:hover, .xFSZwa_menu > button:focus-visible {
2852
- background: var(--esf-menu-hover);
2853
- outline: none;
3306
+ .L9t91q_title {
3307
+ font-weight: 600;
2854
3308
  }
2855
3309
 
2856
- .xFSZwa_form {
2857
- gap: calc(8 * var(--browser-unit));
2858
- width: min(calc(420 * var(--browser-unit)), 80vw);
2859
- flex-direction: column;
2860
- display: flex;
3310
+ .L9t91q_resource[data-change="better"] .L9t91q_free {
3311
+ color: var(--esf-good);
2861
3312
  }
2862
3313
 
2863
- .xFSZwa_form > label {
2864
- color: var(--esf-text-muted);
3314
+ .L9t91q_resource[data-change="worse"] .L9t91q_free {
3315
+ color: var(--esf-bad);
2865
3316
  }
2866
3317
 
2867
- .xFSZwa_form > input, .xFSZwa_form > textarea {
2868
- background: var(--esf-input-bg);
2869
- border: var(--browser-unit) solid var(--esf-input-border);
2870
- color: var(--esf-text);
2871
- font: inherit;
3318
+ .L9t91q_bay[data-over], .L9t91q_resource[data-over] > :last-child, .L9t91q_resource[data-over] .L9t91q_free {
3319
+ color: var(--esf-violation-error);
2872
3320
  }
2873
3321
 
2874
- .xFSZwa_form > textarea {
2875
- resize: vertical;
2876
- font-family: ui-monospace, monospace;
3322
+ .L9t91q_browser, .L9t91q_statistics {
3323
+ bottom: calc(16 * var(--window-unit));
3324
+ top: calc(64 * var(--window-unit));
3325
+ position: absolute;
3326
+ overflow: hidden;
2877
3327
  }
2878
3328
 
2879
- .xFSZwa_importError {
2880
- color: var(--esf-bad);
2881
- margin: 0;
3329
+ .L9t91q_browser {
3330
+ left: calc(15 * var(--window-unit));
3331
+ width: calc(393 * var(--window-unit));
2882
3332
  }
2883
3333
 
2884
- .xFSZwa_confirm {
2885
- max-width: min(calc(360 * var(--browser-unit)), 80vw);
3334
+ .L9t91q_statistics {
3335
+ left: calc(700 * var(--window-unit) + var(--browser-width));
3336
+ transition: left .2s;
3337
+ right: 0;
2886
3338
  }
2887
3339
 
2888
- .xFSZwa_confirm > p {
2889
- margin: 0 0 calc(12 * var(--browser-unit));
3340
+ .L9t91q_statistics > .L9t91q_slide {
3341
+ width: calc(280 * var(--window-unit));
2890
3342
  }
2891
3343
 
2892
- .xFSZwa_dialogButtons {
2893
- gap: calc(8 * var(--browser-unit));
2894
- justify-content: flex-end;
2895
- display: flex;
3344
+ .L9t91q_slide {
3345
+ visibility: hidden;
3346
+ height: 100%;
3347
+ transition: transform .2s, visibility .2s;
2896
3348
  }
2897
3349
 
2898
- .xFSZwa_views {
2899
- margin: 0 0 0 calc(4 * var(--browser-unit));
2900
- border: none;
2901
- align-self: stretch;
2902
- min-width: 0;
2903
- padding: 0;
2904
- display: flex;
3350
+ .L9t91q_browser > .L9t91q_slide, .L9t91q_statistics > .L9t91q_slide {
3351
+ transform: translateX(-100%);
2905
3352
  }
2906
3353
 
2907
- .xFSZwa_views button {
2908
- align-items: center;
3354
+ .L9t91q_window[data-browser] > .L9t91q_browser > .L9t91q_slide, .L9t91q_window[data-statistics] > .L9t91q_statistics > .L9t91q_slide {
3355
+ visibility: visible;
3356
+ transform: none;
2909
3357
  }
2910
3358
 
2911
- .xFSZwa_views [aria-pressed="true"] {
2912
- background: var(--esf-tab-active);
2913
- opacity: 1;
3359
+ @media (prefers-reduced-motion: reduce) {
3360
+ .L9t91q_window, .L9t91q_frame, .L9t91q_statistics, .L9t91q_slide {
3361
+ transition: none;
3362
+ }
2914
3363
  }
2915
3364
  .lebA7G_statistics {
2916
3365
  --statistics-unit: calc(1px * var(--esf-scale, 1));