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