☰

osrsworldheatmap.com - Dark Theme

Dark theme for OSRS World HeatMap

当前为 2025-01-14 提交的版本，查看 最新版本。

  1. /* ==UserStyle==
  2. @name           osrsworldheatmap.com - Dark Theme
  3. @namespace      typpi.online
  4. @version        1.0.2
  5. @description    Dark theme for OSRS World HeatMap
  6. @author         Nick2bad4u
  7. @license        UnLicense
  8. @homepageURL    https://github.com/Nick2bad4u/UserStyles
  9. ==/UserStyle== */
  10. @-moz-document domain("osrsworldheatmap.com") {
  11. 	/* Invert colors except images and videos */
  12. 	.leaflet-pane,
  13. 	.leaflet-tile,
  14. 	.leaflet-marker-icon,
  15. 	.leaflet-marker-shadow,
  16. 	.leaflet-tile-container,
  17. 	.leaflet-pane > svg,
  18. 	.leaflet-pane > canvas,
  19. 	.leaflet-zoom-box,
  20. 	.leaflet-image-layer,
  21. 	.leaflet-layer {
  22. 		position: absolute;
  23. 		top: 0;
  24. 		left: 0;
  25. 	}
  26.  
  27. 	.leaflet-container {
  28. 		overflow: hidden;
  29. 	}
  30.  
  31. 	.leaflet-tile,
  32. 	.leaflet-marker-icon,
  33. 	.leaflet-marker-shadow {
  34. 		-webkit-user-select: none;
  35. 		-moz-user-select: none;
  36. 		user-select: none;
  37. 		-webkit-user-drag: none;
  38. 	}
  39.  
  40. 	.leaflet-tile::selection {
  41. 		background: transparent;
  42. 	}
  43.  
  44. 	.leaflet-safari .leaflet-tile {
  45. 		image-rendering: -webkit-optimize-contrast;
  46. 	}
  47.  
  48. 	.leaflet-safari .leaflet-tile-container {
  49. 		-webkit-transform-origin: 0 0;
  50. 		width: 1600px;
  51. 		height: 1600px;
  52. 	}
  53.  
  54. 	.leaflet-marker-icon,
  55. 	.leaflet-marker-shadow {
  56. 		display: block;
  57. 	}
  58.  
  59. 	.leaflet-container .leaflet-overlay-pane svg {
  60. 		max-width: none !important;
  61. 		max-height: none !important;
  62. 	}
  63.  
  64. 	.leaflet-container .leaflet-marker-pane img,
  65. 	.leaflet-container .leaflet-shadow-pane img,
  66. 	.leaflet-container .leaflet-tile-pane img,
  67. 	.leaflet-container img.leaflet-image-layer,
  68. 	.leaflet-container .leaflet-tile {
  69. 		padding: 0;
  70. 		width: auto;
  71. 		max-width: none !important;
  72. 		max-height: none !important;
  73. 	}
  74.  
  75. 	.leaflet-container img.leaflet-tile {
  76. 		mix-blend-mode: plus-lighter;
  77. 	}
  78.  
  79. 	.leaflet-container.leaflet-touch-zoom {
  80. 		-ms-touch-action: pan-x pan-y;
  81. 		touch-action: pan-x pan-y;
  82. 	}
  83.  
  84. 	.leaflet-container.leaflet-touch-drag {
  85. 		-ms-touch-action: pinch-zoom;
  86. 		touch-action: none;
  87. 		touch-action: pinch-zoom;
  88. 	}
  89.  
  90. 	.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
  91. 		-ms-touch-action: none;
  92. 		touch-action: none;
  93. 	}
  94.  
  95. 	.leaflet-container {
  96. 		-webkit-tap-highlight-color: transparent;
  97. 	}
  98.  
  99. 	.leaflet-container a {
  100. 		-webkit-tap-highlight-color: rgb(
  101. 			51 181 229 / 40%
  102. 		);
  103. 	}
  104.  
  105. 	.leaflet-tile {
  106. 		visibility: hidden;
  107. 		filter: inherit;
  108. 	}
  109.  
  110. 	.leaflet-tile-loaded {
  111. 		visibility: inherit;
  112. 	}
  113.  
  114. 	.leaflet-zoom-box {
  115. 		z-index: 800;
  116. 		-moz-box-sizing: border-box;
  117. 		box-sizing: border-box;
  118. 		width: 0;
  119. 		height: 0;
  120. 	}
  121.  
  122. 	.leaflet-overlay-pane svg {
  123. 		-moz-user-select: none;
  124. 	}
  125.  
  126. 	.leaflet-pane {
  127. 		z-index: 400;
  128. 	}
  129.  
  130. 	.leaflet-tile-pane {
  131. 		z-index: 200;
  132. 	}
  133.  
  134. 	.leaflet-overlay-pane {
  135. 		z-index: 400;
  136. 	}
  137.  
  138. 	.leaflet-shadow-pane {
  139. 		z-index: 500;
  140. 	}
  141.  
  142. 	.leaflet-marker-pane {
  143. 		z-index: 600;
  144. 	}
  145.  
  146. 	.leaflet-tooltip-pane {
  147. 		z-index: 650;
  148. 	}
  149.  
  150. 	.leaflet-popup-pane {
  151. 		z-index: 700;
  152. 	}
  153.  
  154. 	.leaflet-map-pane canvas {
  155. 		z-index: 100;
  156. 	}
  157.  
  158. 	.leaflet-map-pane svg {
  159. 		z-index: 200;
  160. 	}
  161.  
  162. 	.leaflet-vml-shape {
  163. 		width: 1px;
  164. 		height: 1px;
  165. 	}
  166.  
  167. 	.lvml {
  168. 		behavior: url('#default#VML');
  169. 		display: inline-block;
  170. 		position: absolute;
  171. 	}
  172.  
  173. 	.leaflet-control {
  174. 		position: relative;
  175. 		z-index: 800;
  176. 		pointer-events: visiblepainted;
  177. 		pointer-events: auto;
  178. 	}
  179.  
  180. 	.leaflet-top,
  181. 	.leaflet-bottom {
  182. 		position: absolute;
  183. 		z-index: 1000;
  184. 		pointer-events: none;
  185. 	}
  186.  
  187. 	.leaflet-top {
  188. 		top: 0;
  189. 	}
  190.  
  191. 	.leaflet-right {
  192. 		right: 0;
  193. 	}
  194.  
  195. 	.leaflet-bottom {
  196. 		bottom: 0;
  197. 	}
  198.  
  199. 	.leaflet-left {
  200. 		left: 0;
  201. 	}
  202.  
  203. 	.leaflet-control {
  204. 		float: left;
  205. 		clear: both;
  206. 	}
  207.  
  208. 	.leaflet-right .leaflet-control {
  209. 		float: right;
  210. 	}
  211.  
  212. 	.leaflet-top .leaflet-control {
  213. 		margin-top: 10px;
  214. 	}
  215.  
  216. 	.leaflet-bottom .leaflet-control {
  217. 		margin-bottom: 10px;
  218. 	}
  219.  
  220. 	.leaflet-left .leaflet-control {
  221. 		margin-left: 10px;
  222. 	}
  223.  
  224. 	.leaflet-right .leaflet-control {
  225. 		margin-right: 10px;
  226. 	}
  227.  
  228. 	.leaflet-fade-anim .leaflet-popup {
  229. 		opacity: 0%;
  230. 		-webkit-transition: opacity 0.2s linear;
  231. 		-moz-transition: opacity 0.2s linear;
  232. 		transition: opacity 0.2s linear;
  233. 	}
  234.  
  235. 	.leaflet-fade-anim
  236. 		.leaflet-map-pane
  237. 		.leaflet-popup {
  238. 		opacity: 100%;
  239. 	}
  240.  
  241. 	.leaflet-zoom-animated {
  242. 		-webkit-transform-origin: 0 0;
  243. 		-ms-transform-origin: 0 0;
  244. 		transform-origin: 0 0;
  245. 	}
  246.  
  247. 	svg.leaflet-zoom-animated {
  248. 		will-change: transform;
  249. 	}
  250.  
  251. 	.leaflet-zoom-anim .leaflet-zoom-animated {
  252. 		-webkit-transition: -webkit-transform 0.25s
  253. 			cubic-bezier(0, 0, 0.25, 1);
  254. 		-moz-transition: -moz-transform 0.25s
  255. 			cubic-bezier(0, 0, 0.25, 1);
  256. 		transition: transform 0.25s
  257. 			cubic-bezier(0, 0, 0.25, 1);
  258. 	}
  259.  
  260. 	.leaflet-zoom-anim .leaflet-tile,
  261. 	.leaflet-pan-anim .leaflet-tile {
  262. 		-webkit-transition: none;
  263. 		-moz-transition: none;
  264. 		transition: none;
  265. 	}
  266.  
  267. 	.leaflet-zoom-anim .leaflet-zoom-hide {
  268. 		visibility: hidden;
  269. 	}
  270.  
  271. 	.leaflet-interactive {
  272. 		cursor: pointer;
  273. 	}
  274.  
  275. 	.leaflet-grab {
  276. 		cursor: grab;
  277. 		cursor: grab;
  278. 		cursor: grab;
  279. 	}
  280.  
  281. 	.leaflet-crosshair,
  282. 	.leaflet-crosshair .leaflet-interactive {
  283. 		cursor: crosshair;
  284. 	}
  285.  
  286. 	.leaflet-popup-pane,
  287. 	.leaflet-control {
  288. 		cursor: auto;
  289. 	}
  290.  
  291. 	.leaflet-dragging .leaflet-grab,
  292. 	.leaflet-dragging
  293. 		.leaflet-grab
  294. 		.leaflet-interactive,
  295. 	.leaflet-dragging .leaflet-marker-draggable {
  296. 		cursor: move;
  297. 		cursor: grabbing;
  298. 		cursor: grabbing;
  299. 		cursor: grabbing;
  300. 	}
  301.  
  302. 	.leaflet-marker-icon,
  303. 	.leaflet-marker-shadow,
  304. 	.leaflet-image-layer,
  305. 	.leaflet-pane > svg path,
  306. 	.leaflet-tile-container {
  307. 		pointer-events: none;
  308. 	}
  309.  
  310. 	.leaflet-marker-icon.leaflet-interactive,
  311. 	.leaflet-image-layer.leaflet-interactive,
  312. 	.leaflet-pane > svg path.leaflet-interactive,
  313. 	svg.leaflet-image-layer.leaflet-interactive
  314. 		path {
  315. 		pointer-events: visiblepainted;
  316. 		pointer-events: auto;
  317. 	}
  318.  
  319. 	.leaflet-container {
  320. 		outline-offset: 1px;
  321. 		background: #ddd;
  322. 	}
  323.  
  324. 	.leaflet-container a {
  325. 		color: #0078a8;
  326. 	}
  327.  
  328. 	.leaflet-zoom-box {
  329. 		border: 2px dotted #38f;
  330. 		background: #ffffff80;
  331. 	}
  332.  
  333. 	.leaflet-container {
  334. 		font-size: 12px;
  335. 		font-size: 0.75rem;
  336. 		line-height: 1.5;
  337. 		font-family:
  338. 			Helvetica Neue,
  339. 			Arial,
  340. 			Helvetica,
  341. 			sans-serif;
  342. 	}
  343.  
  344. 	.leaflet-bar {
  345. 		box-shadow: 0 1px 5px #000000a6;
  346. 		border-radius: 4px;
  347. 	}
  348.  
  349. 	.leaflet-bar a {
  350. 		display: block;
  351. 		border-bottom: 1px solid #ccc;
  352. 		background-color: #aa0c0c;
  353. 		width: 26px;
  354. 		height: 26px;
  355. 		color: #000;
  356. 		line-height: 26px;
  357. 		text-align: center;
  358. 		text-decoration: none;
  359. 	}
  360.  
  361. 	.leaflet-bar a,
  362. 	.leaflet-control-layers-toggle {
  363. 		display: block;
  364. 		background-position: 50% 50%;
  365. 		background-repeat: no-repeat;
  366. 	}
  367.  
  368. 	.leaflet-bar a:hover,
  369. 	.leaflet-bar a:focus {
  370. 		background-color: #9856de;
  371. 	}
  372.  
  373. 	.leaflet-bar a:first-child {
  374. 		border-top-right-radius: 4px;
  375. 		border-top-left-radius: 4px;
  376. 	}
  377.  
  378. 	.leaflet-bar a:last-child {
  379. 		border-bottom: none;
  380. 		border-bottom-right-radius: 4px;
  381. 		border-bottom-left-radius: 4px;
  382. 	}
  383.  
  384. 	.leaflet-bar a.leaflet-disabled {
  385. 		cursor: default;
  386. 		background-color: #f4f4f4;
  387. 		color: #bbb;
  388. 	}
  389.  
  390. 	.leaflet-touch .leaflet-bar a {
  391. 		width: 30px;
  392. 		height: 30px;
  393. 		line-height: 30px;
  394. 	}
  395.  
  396. 	.leaflet-touch .leaflet-bar a:first-child {
  397. 		border-top-right-radius: 2px;
  398. 		border-top-left-radius: 2px;
  399. 	}
  400.  
  401. 	.leaflet-touch .leaflet-bar a:last-child {
  402. 		border-bottom-right-radius: 2px;
  403. 		border-bottom-left-radius: 2px;
  404. 	}
  405.  
  406. 	.leaflet-control-zoom-in,
  407. 	.leaflet-control-zoom-out {
  408. 		font:
  409. 			700 18px Lucida Console,
  410. 			Monaco,
  411. 			monospace;
  412. 		text-indent: 1px;
  413. 	}
  414.  
  415. 	.leaflet-touch .leaflet-control-zoom-in,
  416. 	.leaflet-touch .leaflet-control-zoom-out {
  417. 		font-size: 22px;
  418. 	}
  419.  
  420. 	.leaflet-control-layers {
  421. 		box-shadow: 0 1px 5px #0006;
  422. 		border-radius: 5px;
  423. 		background: #fff;
  424. 	}
  425.  
  426. 	.leaflet-control-layers-toggle {
  427. 		background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAACf0lEQVR4AY1UM3gkARTePdvdoTxXKc+qTl3aU5U6b2Kbkz3Gtq3Zw6ziLGNPzrYx7946Tr6/ee/XeCQ4D3ykPtL5tHno4n0d/h3+xfuWHGLX81cn7r0iTNzjr7LrlxCqPtkbTQEHeqOrTy4Yyt3VCi/IOB0v7rVC7q45Q3Gr5K6jt+3Gl5nCoDD4MtO+j96Wu8atmhGqcNGHObuf8OM/x3AMx38+4Z2sPqzCxRFK2aF2e5Jol56XTLyggAMTL56XOMoS1W4pOyjUcGGQdZxU6qRh7B9Zp+PfpOFlqt0zyDZckPi1ttmIp03jX8gyJ8a/PG2yutpS/Vol7peZIbZcKBAEEheEIAgFbDkz5H6Zrkm2hVWGiXKiF4Ycw0RWKdtC16Q7qe3X4iOMxruonzegJzWaXFrU9utOSsLUmrc0YjeWYjCW4PDMADElpJSSQ0vQvA1Tm6/JlKnqFs1EGyZiFCqnRZTEJJJiKRYzVYzJck2Rm6P4iH+cmSY0YzimYa8l0EtTODFWhcMIMVqdsI2uiTvKmTisIDHJ3od5GILVhBCarCfVRmo4uTjkhrhzkiBV7SsaqS+TzrzM1qpGGUFt28pIySQHR6h7F6KSwGWm97ay+Z+ZqMcEjEWebE7wxCSQwpkhJqoZA5ivCdZDjJepuJ9IQjGGUmuXJdBFUygxVqVsxFsLMbDe8ZbDYVCGKxs+W080max1hFCarCfV+C1KATwcnvE9gRRuMP2prdbWGowm1KB1y+zwMMENkM755cJ2yPDtqhTI6ED1M/82yIDtC/4j4BijjeObflpO9I9MwXTCsSX8jWAFeHr05WoLTJ5G8IQVS/7vwR6ohirYM7f6HzYpogfS3R2OAAAAAElFTkSuQmCC');
  428. 		width: 36px;
  429. 		height: 36px;
  430. 	}
  431.  
  432. 	.leaflet-retina .leaflet-control-layers-toggle {
  433. 		background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAA0CAQAAABvcdNgAAAEsklEQVR4AWL4TydIhpZK1kpWOlg0w3ZXP6D2soBtG42jeI6ZmQTHzAxiTbSJsYLjO9HhP+WOmcuhciVnmHVQcJnp7DFvScowZorad/+V/fVzMdMT2g9Cv9guXGv/7pYOrXh2U+RRR3dSd9JRx6bIFc/ekqHI29JC6pJ5ZEh1yWkhkbcFeSjxgx3L2m1cb1C7bceyxA+CNjT/Ifff+/kDk2u/w/33/IeCMOSaWZ4glosqT3DNnNZQ7Cs58/3Ce5HL78iZH/vKVIaYlqzfdLu8Vi7dnvUbEza5Idt36tquZFldl6N5Z/POLof0XLK61mZCmJSWjVF9tEjUluu74IUXvgttuVIHE7YxSkaYhJZam7yiM9Pv82JYfl9nptxZaxMJE4YSPty+vF0+Y2up9d3wwijfjZbabqm/3bZ9ecKHsiGmRflnn1MW4pjHf9oLufyn2z3y1D6n8g8TZhxyzipLNPnAUpsOiuWimg52psrTZYnOWYNDTMuWBWa0tJb4rgq1UvmutpaYEbZlwU3CLJm/ayYjHW5/h7xWLn9Hh1vepDkyf7dE7MtT5LR4e7yYpHrkhOUpEfssBLq2pPhAqoSWKUkk7EDqkmK6RrCEzqDjhNDWNE+XSMvkJRDWlZTmCW0l0PHQGRZY5t1L83kT0Y3l2SItk5JAWHl2dCOBm+fPu3fo5/3v61RMCO9Jx2EEYYhb0rmNQMX/vm7gqOEJLcXTGw3CAuRNeyaPWwjR8PRqKQ1PDA/dpv+on9Shox52WFnx0KY8onHayrJzm87i5h9xGw/tfkev0jGsQizqezUKjk12hBMKJ4kbCqGPVNXudyyrShovGw5CgxsRICxF6aRmSjlBnHRzg7Gx8fKqEubI2rahQYdR1YgDIRQO7JvQyD52hoIQx0mxa0ODtW2Iozn1le2iIRdzwWewedyZzewidueOGqlsn1MvcnQpuVwLGG3/IR1hIKxCjelIDZ8ldqWz25jWAsnldEnK0Zxro19TGVb2ffIZEsIO89EIEDvKMPrzmBOQcKQ+rroye6NgRRxqR4U8EAkz0CL6uSGOm6KQCdWjvjRiSP1BPalCRS5iQYiEIvxuBMJEWgzSoHADcVMuN7IuqqTeyUPq22qFimFtxDyBBJEwNyt6TM88blFHao/6tWWhuuOM4SAK4EI4QmFHA+SEyWlp4EQoJ13cYGzMu7yszEIBOm2rVmHUNqwAIQabISNMRstmdhNWcFLsSm+0tjJH1MdRxO5Nx0WDMhCtgD6OKgZeljJqJKc9po8juskR9XN0Y1lZ3mWjLR9JCO1jRDMd0fpYC2VnvjBSEFg7wBENc0R9HFlb0xvF1+TBEpF68d+DHR6IOWVv2BECtxo46hOFUBd/APU57WIoEwJhIi2CdpyZX0m93BZicktMj1AS9dClteUFAUNUIEygRZCtik5zSxI9MubTBH1GOiHsiLJ3OCoSZkILa9PxiN0EbvhsAo8tdAf9Seepd36lGWHmtNANTv5Jd0z4QYyeo/UEJqxKRpg5LZx6btLPsOaEmdMyxYdlc8LMaJnikDlhclqmPiQnTEpLUIZEwkRagjYkEibQErwhkTAKCLQEbUgkzJQWc/0PstHHcfEdQ+UAAAAASUVORK5CYII=');
  434. 		background-size: 26px 26px;
  435. 	}
  436.  
  437. 	.leaflet-touch .leaflet-control-layers-toggle {
  438. 		width: 44px;
  439. 		height: 44px;
  440. 	}
  441.  
  442. 	.leaflet-control-layers
  443. 		.leaflet-control-layers-list,
  444. 	.leaflet-control-layers-expanded
  445. 		.leaflet-control-layers-toggle {
  446. 		display: none;
  447. 	}
  448.  
  449. 	.leaflet-control-layers-expanded
  450. 		.leaflet-control-layers-list {
  451. 		display: block;
  452. 		position: relative;
  453. 	}
  454.  
  455. 	.leaflet-control-layers-expanded {
  456. 		background: #fff;
  457. 		padding: 6px 10px 6px 6px;
  458. 		color: #333;
  459. 	}
  460.  
  461. 	.leaflet-control-layers-scrollbar {
  462. 		padding-right: 5px;
  463. 		overflow: hidden scroll;
  464. 	}
  465.  
  466. 	.leaflet-control-layers-selector {
  467. 		position: relative;
  468. 		top: 1px;
  469. 		margin-top: 2px;
  470. 	}
  471.  
  472. 	.leaflet-control-layers label {
  473. 		display: block;
  474. 		font-size: 13px;
  475. 		font-size: 1.08333em;
  476. 	}
  477.  
  478. 	.leaflet-control-layers-separator {
  479. 		margin: 5px -10px 5px -6px;
  480. 		border-top: 1px solid #ddd;
  481. 		height: 0;
  482. 	}
  483.  
  484. 	.leaflet-default-icon-path {
  485. 		background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAFgUlEQVR4Aa1XA5BjWRTN2oW17d3YaZtr2962HUzbDNpjszW24mRt28p47v7zq/bXZtrp/lWnXr337j3nPCe85NcypgSFdugCpW5YoDAMRaIMqRi6aKq5E3YqDQO3qAwjVWrD8Ncq/RBpykd8oZUb/kaJutow8r1aP9II0WmLKLIsJyv1w/kqw9Ch2MYdB++12Onxee/QMwvf4/Dk/Lfp/i4nxTXtOoQ4pW5Aj7wpici1A9erdAN2OH64x8OSP9j3Ft3b7aWkTg/Fm91siTra0f9on5sQr9INejH6CUUUpavjFNq1B+Oadhxmnfa8RfEmN8VNAsQhPqF55xHkMzz3jSmChWU6f7/XZKNH+9+hBLOHYozuKQPxyMPUKkrX/K0uWnfFaJGS1QPRtZsOPtr3NsW0uyh6NNCOkU3Yz+bXbT3I8G3xE5EXLXtCXbbqwCO9zPQYPRTZ5vIDXD7U+w7rFDEoUUf7ibHIR4y6bLVPXrz8JVZEql13trxwue/uDivd3fkWRbS6/IA2bID4uk0UpF1N8qLlbBlXs4Ee7HLTfV1j54APvODnSfOWBqtKVvjgLKzF5YdEk5ewRkGlK0i33Eofffc7HT56jD7/6U+qH3Cx7SBLNntH5YIPvODnyfIXZYRVDPqgHtLs5ABHD3YzLuespb7t79FY34DjMwrVrcTuwlT55YMPvOBnRrJ4VXTdNnYug5ucHLBjEpt30701A3Ts+HEa73u6dT3FNWwflY86eMHPk+Yu+i6pzUpRrW7SNDg5JHR4KapmM5Wv2E8Tfcb1HoqqHMHU+uWDD7zg54mz5/2BSnizi9T1Dg4QQXLToGNCkb6tb1NU+QAlGr1++eADrzhn/u8Q2YZhQVlZ5+CAOtqfbhmaUCS1ezNFVm2imDbPmPng5wmz+gwh+oHDce0eUtQ6OGDIyR0uUhUsoO3vfDmmgOezH0mZN59x7MBi++WDL1g/eEiU3avlidO671bkLfwbw5XV2P8Pzo0ydy4t2/0eu33xYSOMOD8hTf4CrBtGMSoXfPLchX+J0ruSePw3LZeK0juPJbYzrhkH0io7B3k164hiGvawhOKMLkrQLyVpZg8rHFW7E2uHOL888IBPlNZ1FPzstSJM694fWr6RwpvcJK60+0HCILTBzZLFNdtAzJaohze60T8qBzyh5ZuOg5e7uwQppofEmf2++DYvmySqGBuKaicF1blQjhuHdvCIMvp8whTTfZzI7RldpwtSzL+F1+wkdZ2TBOW2gIF88PBTzD/gpeREAMEbxnJcaJHNHrpzji0gQCS6hdkEeYt9DF/2qPcEC8RM28Hwmr3sdNyht00byAut2k3gufWNtgtOEOFGUwcXWNDbdNbpgBGxEvKkOQsxivJx33iow0Vw5S6SVTrpVq11ysA2Rp7gTfPfktc6zhtXBBC+adRLshf6sG2RfHPZ5EAc4sVZ83yCN00Fk/4kggu40ZTvIEm5g24qtU4KjBrx/BTTH8ifVASAG7gKrnWxJDcU7x8X6Ecczhm3o6YicvsLXWfh3Ch1W0k8x0nXF+0fFxgt4phz8QvypiwCCFKMqXCnqXExjq10beH+UUA7+nG6mdG/Pu0f3LgFcGrl2s0kNNjpmoJ9o4B29CMO8dMT4Q5ox8uitF6fqsrJOr8qnwNbRzv6hSnG5wP+64C7h9lp30hKNtKdWjtdkbuPA19nJ7Tz3zR/ibgARbhb4AlhavcBebmTHcFl2fvYEnW0ox9xMxKBS8btJ+KiEbq9zA4RthQXDhPa0T9TEe69gWupwc6uBUphquXgf+/FrIjweHQS4/pduMe5ERUMHUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=');
  486. 	}
  487.  
  488. 	.leaflet-container
  489. 		.leaflet-control-attribution {
  490. 		margin: 0;
  491. 		background: #fff;
  492. 		background: #fffc;
  493. 	}
  494.  
  495. 	.leaflet-control-attribution,
  496. 	.leaflet-control-scale-line {
  497. 		padding: 0 5px;
  498. 		color: #333;
  499. 		line-height: 1.4;
  500. 	}
  501.  
  502. 	.leaflet-control-attribution a {
  503. 		text-decoration: none;
  504. 	}
  505.  
  506. 	.leaflet-control-attribution a:hover,
  507. 	.leaflet-control-attribution a:focus {
  508. 		text-decoration: underline;
  509. 	}
  510.  
  511. 	.leaflet-attribution-flag {
  512. 		display: inline !important;
  513. 		vertical-align: baseline !important;
  514. 		width: 1em;
  515. 		height: 0.6669em;
  516. 	}
  517.  
  518. 	.leaflet-left .leaflet-control-scale {
  519. 		margin-left: 5px;
  520. 	}
  521.  
  522. 	.leaflet-bottom .leaflet-control-scale {
  523. 		margin-bottom: 5px;
  524. 	}
  525.  
  526. 	.leaflet-control-scale-line {
  527. 		-moz-box-sizing: border-box;
  528. 		box-sizing: border-box;
  529. 		border: 2px solid #777;
  530. 		border-top: none;
  531. 		background: #fffc;
  532. 		padding: 2px 5px 1px;
  533. 		line-height: 1.1;
  534. 		text-shadow: 1px 1px #fff;
  535. 		white-space: nowrap;
  536. 	}
  537.  
  538. 	.leaflet-control-scale-line:not(:first-child) {
  539. 		margin-top: -2px;
  540. 		border-top: 2px solid #777;
  541. 		border-bottom: none;
  542. 	}
  543.  
  544. 	.leaflet-control-scale-line:not(
  545. 			:first-child,
  546. 			:last-child
  547. 		) {
  548. 		border-bottom: 2px solid #777;
  549. 	}
  550.  
  551. 	.leaflet-touch .leaflet-control-attribution,
  552. 	.leaflet-touch .leaflet-control-layers,
  553. 	.leaflet-touch .leaflet-bar {
  554. 		box-shadow: none;
  555. 	}
  556.  
  557. 	.leaflet-touch .leaflet-control-layers,
  558. 	.leaflet-touch .leaflet-bar {
  559. 		border: 2px solid rgb(0 0 0 / 20%);
  560. 		background-clip: padding-box;
  561. 	}
  562.  
  563. 	.leaflet-popup {
  564. 		position: absolute;
  565. 		margin-bottom: 20px;
  566. 		text-align: center;
  567. 	}
  568.  
  569. 	.leaflet-popup-content-wrapper {
  570. 		border-radius: 12px;
  571. 		padding: 1px;
  572. 		text-align: left;
  573. 	}
  574.  
  575. 	.leaflet-popup-content {
  576. 		margin: 13px 24px 13px 20px;
  577. 		min-height: 1px;
  578. 		font-size: 13px;
  579. 		font-size: 1.08333em;
  580. 		line-height: 1.3;
  581. 	}
  582.  
  583. 	.leaflet-popup-content p {
  584. 		margin: 1.3em 0;
  585. 	}
  586.  
  587. 	.leaflet-popup-tip-container {
  588. 		position: absolute;
  589. 		left: 50%;
  590. 		margin-top: -1px;
  591. 		margin-left: -20px;
  592. 		width: 40px;
  593. 		height: 20px;
  594. 		overflow: hidden;
  595. 		pointer-events: none;
  596. 	}
  597.  
  598. 	.leaflet-popup-tip {
  599. 		-webkit-transform: rotate(45deg);
  600. 		-moz-transform: rotate(45deg);
  601. 		-ms-transform: rotate(45deg);
  602. 		transform: rotate(45deg);
  603. 		margin: -10px auto 0;
  604. 		padding: 1px;
  605. 		width: 17px;
  606. 		height: 17px;
  607. 		pointer-events: auto;
  608. 	}
  609.  
  610. 	.leaflet-popup-content-wrapper,
  611. 	.leaflet-popup-tip {
  612. 		box-shadow: 0 3px 14px #0006;
  613. 		background: #fff;
  614. 		color: #333;
  615. 	}
  616.  
  617. 	.leaflet-container
  618. 		a.leaflet-popup-close-button {
  619. 		position: absolute;
  620. 		top: 0;
  621. 		right: 0;
  622. 		border: none;
  623. 		background: transparent;
  624. 		width: 24px;
  625. 		height: 24px;
  626. 		color: #757575;
  627. 		font:
  628. 			16px/24px Tahoma,
  629. 			Verdana,
  630. 			sans-serif;
  631. 		text-align: center;
  632. 		text-decoration: none;
  633. 	}
  634.  
  635. 	.leaflet-container
  636. 		a.leaflet-popup-close-button:hover,
  637. 	.leaflet-container
  638. 		a.leaflet-popup-close-button:focus {
  639. 		color: #585858;
  640. 	}
  641.  
  642. 	.leaflet-popup-scrolled {
  643. 		overflow: auto;
  644. 	}
  645.  
  646. 	.leaflet-oldie .leaflet-popup-content-wrapper {
  647. 		-ms-zoom: 1;
  648. 	}
  649.  
  650. 	.leaflet-oldie .leaflet-popup-tip {
  651. 		-ms-filter: 'progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)';
  652. 		filter: progid:DXImageTransform.Microsoft.Matrix(M11 = .70710678, M12 = .70710678, M21 = -.70710678, M22 = .70710678);
  653. 		margin: 0 auto;
  654. 		width: 24px;
  655. 	}
  656.  
  657. 	.leaflet-oldie .leaflet-control-zoom,
  658. 	.leaflet-oldie .leaflet-control-layers,
  659. 	.leaflet-oldie .leaflet-popup-content-wrapper,
  660. 	.leaflet-oldie .leaflet-popup-tip {
  661. 		border: 1px solid #999;
  662. 	}
  663.  
  664. 	.leaflet-div-icon {
  665. 		border: 1px solid #666;
  666. 		background: #fff;
  667. 	}
  668.  
  669. 	.leaflet-tooltip {
  670. 		position: absolute;
  671. 		box-shadow: 0 1px 3px #0006;
  672. 		border: 1px solid #fff;
  673. 		border-radius: 3px;
  674. 		background-color: #000;
  675. 		padding: 6px;
  676. 		pointer-events: none;
  677. 		color: #222;
  678. 		-webkit-user-select: none;
  679. 		-moz-user-select: none;
  680. 		-ms-user-select: none;
  681. 		user-select: none;
  682. 		white-space: nowrap;
  683. 	}
  684.  
  685. 	.leaflet-tooltip.leaflet-interactive {
  686. 		cursor: pointer;
  687. 		pointer-events: auto;
  688. 	}
  689.  
  690. 	.leaflet-tooltip-top::before,
  691. 	.leaflet-tooltip-bottom::before,
  692. 	.leaflet-tooltip-left::before,
  693. 	.leaflet-tooltip-right::before {
  694. 		position: absolute;
  695. 		border: 6px solid transparent;
  696. 		background: transparent;
  697. 		pointer-events: none;
  698. 		content: '';
  699. 	}
  700.  
  701. 	.leaflet-tooltip-bottom {
  702. 		margin-top: 6px;
  703. 	}
  704.  
  705. 	.leaflet-tooltip-top {
  706. 		margin-top: -6px;
  707. 	}
  708.  
  709. 	.leaflet-tooltip-bottom::before,
  710. 	.leaflet-tooltip-top::before {
  711. 		left: 50%;
  712. 		margin-left: -6px;
  713. 	}
  714.  
  715. 	.leaflet-tooltip-top::before {
  716. 		bottom: 0;
  717. 		margin-bottom: -12px;
  718. 		border-top-color: #fff;
  719. 	}
  720.  
  721. 	.leaflet-tooltip-bottom::before {
  722. 		top: 0;
  723. 		margin-top: -12px;
  724. 		margin-left: -6px;
  725. 		border-bottom-color: #fff;
  726. 	}
  727.  
  728. 	.leaflet-tooltip-left {
  729. 		margin-left: -6px;
  730. 	}
  731.  
  732. 	.leaflet-tooltip-right {
  733. 		margin-left: 6px;
  734. 	}
  735.  
  736. 	.leaflet-tooltip-left::before,
  737. 	.leaflet-tooltip-right::before {
  738. 		top: 50%;
  739. 		margin-top: -6px;
  740. 	}
  741.  
  742. 	.leaflet-tooltip-left::before {
  743. 		right: 0;
  744. 		margin-right: -12px;
  745. 		border-left-color: #fff;
  746. 	}
  747.  
  748. 	.leaflet-tooltip-right::before {
  749. 		left: 0;
  750. 		margin-left: -12px;
  751. 		border-right-color: #fff;
  752. 	}
  753.  
  754. 	@media print {
  755. 		.leaflet-control {
  756. 			-webkit-print-color-adjust: exact;
  757. 			print-color-adjust: exact;
  758. 		}
  759. 	}
  760.  
  761. 	.leaflet-container
  762. 		.leaflet-control-mouseposition {
  763. 		margin: 0;
  764. 		box-shadow: 0 0 5px #bbb;
  765. 		background-color: #ffffffb3;
  766. 		padding: 0 5px;
  767. 		color: #333;
  768. 		font:
  769. 			11px/1.5 Helvetica Neue,
  770. 			Arial,
  771. 			Helvetica,
  772. 			sans-serif;
  773. 	}
  774.  
  775. 	:root {
  776. 		background-color: #242424;
  777. 		color: #ffffffde;
  778. 		color-scheme: light dark;
  779. 		font-weight: 400;
  780. 		line-height: 1.5;
  781. 		font-family: Inter, system-ui, Avenir,
  782. 			Helvetica, Arial, sans-serif;
  783. 		font-synthesis: none;
  784. 		text-rendering: optimizelegibility;
  785. 		-webkit-font-smoothing: antialiased;
  786. 		-moz-osx-font-smoothing: grayscale;
  787. 	}
  788.  
  789. 	a {
  790. 		color: #646cff;
  791. 		font-weight: 500;
  792. 		text-decoration: inherit;
  793. 	}
  794.  
  795. 	a:hover {
  796. 		color: #535bf2;
  797. 	}
  798.  
  799. 	body {
  800. 		display: flex;
  801. 		place-items: center;
  802. 		margin: 0;
  803. 		min-width: 320px;
  804. 		min-height: 100vh;
  805. 	}
  806.  
  807. 	h1 {
  808. 		font-size: 3.2em;
  809. 		line-height: 1.1;
  810. 	}
  811.  
  812. 	#app {
  813. 		margin: 0 auto;
  814. 		padding: 2rem;
  815. 		max-width: 1280px;
  816. 		text-align: center;
  817. 	}
  818.  
  819. 	.logo {
  820. 		transition: filter 0.3s;
  821. 		will-change: filter;
  822. 		padding: 1.5em;
  823. 		height: 6em;
  824. 	}
  825.  
  826. 	.logo:hover {
  827. 		filter: drop-shadow(0 0 2em #646cffaa);
  828. 	}
  829.  
  830. 	.logo.vanilla:hover {
  831. 		filter: drop-shadow(0 0 2em #3178c6aa);
  832. 	}
  833.  
  834. 	.card {
  835. 		padding: 2em;
  836. 	}
  837.  
  838. 	.read-the-docs {
  839. 		color: #888;
  840. 	}
  841.  
  842. 	button {
  843. 		transition: border-color 0.25s;
  844. 		cursor: pointer;
  845. 		border: 1px solid transparent;
  846. 		border-radius: 8px;
  847. 		background-color: #1a1a1a;
  848. 		padding: 0.6em 1.2em;
  849. 		font-weight: 500;
  850. 		font-size: 1em;
  851. 		font-family: inherit;
  852. 	}
  853.  
  854. 	button:hover {
  855. 		border-color: #646cff;
  856. 	}
  857.  
  858. 	button:focus,
  859. 	button:focus-visible {
  860. 		outline: 4px auto -webkit-focus-ring-color;
  861. 	}
  862.  
  863. 	@media (prefers-color-scheme: light) {
  864. 		:root {
  865. 			background-color: #fff;
  866. 			color: #213547;
  867. 		}
  868.  
  869. 		a:hover {
  870. 			color: #747bff;
  871. 		}
  872.  
  873. 		button {
  874. 			background-color: #f9f9f9;
  875. 		}
  876. 	}
  877.  
  878. 	#map {
  879. 		background-color: #000;
  880. 		width: 100%;
  881. 		height: 100vh;
  882. 	}
  883.  
  884. 	.leaflet-control {
  885. 		position: relative;
  886. 		right: -100%;
  887. 		transition: right 0.3s ease-in-out;
  888. 		box-shadow: 0 2px 8px #00000026;
  889. 		border-radius: 5px;
  890. 		background-color: #000 !important;
  891. 		padding: 1em;
  892. 		width: 15em;
  893. 		color: #9856de !important;
  894. 	}
  895.  
  896. 	.leaflet-container.controls-active
  897. 		.leaflet-control {
  898. 		right: 0;
  899. 	}
  900.  
  901. 	@media (width >= 769px) {
  902. 		.leaflet-container .leaflet-control {
  903. 			right: 0;
  904. 		}
  905.  
  906. 		.leaflet-container.controls-active
  907. 			.leaflet-control {
  908. 			right: -100%;
  909. 		}
  910. 	}
  911.  
  912. 	.leaflet-control label {
  913. 		display: block;
  914. 		margin-bottom: 5px;
  915. 		color: #9856de !important;
  916. 		font-weight: 700;
  917. 	}
  918.  
  919. 	.leaflet-control select,
  920. 	.leaflet-control input[type='range'] {
  921. 		margin-bottom: 10px;
  922. 		border: 1px solid #9856de;
  923. 		border-radius: 5px;
  924. 		background-color: #000000e3;
  925. 		padding: 5px;
  926. 		color: #fff;
  927. 	}
  928.  
  929. 	.leaflet-control-effects {
  930. 		display: flex;
  931. 		justify-content: space-between;
  932. 		gap: 5px;
  933. 	}
  934.  
  935. 	.leaflet-control .leaflet-bar-part {
  936. 		display: flex;
  937. 		flex: 1;
  938. 		justify-content: center;
  939. 		align-items: center;
  940. 		box-sizing: border-box;
  941. 		border: 1px solid #9856de !important;
  942. 		border-radius: 4px;
  943. 		background-color: #000;
  944. 		color: #fff;
  945. 		font-size: 14px;
  946. 		text-decoration: none;
  947. 		white-space: nowrap;
  948. 	}
  949.  
  950. 	.leaflet-control .leaflet-bar-part:hover {
  951. 		background-color: #9856de;
  952. 	}
  953.  
  954. 	.leaflet-control .leaflet-bar-part:last-child {
  955. 		border-bottom: 1px solid #ccc;
  956. 	}
  957.  
  958. 	.custom-layer-account-control {
  959. 		border-radius: 5px;
  960. 		background-color: #000;
  961. 		padding: 10px;
  962. 	}
  963.  
  964. 	.report-modal {
  965. 		display: flex;
  966. 		flex-direction: column;
  967. 		gap: 1em;
  968. 		padding: 1em;
  969. 		width: 20em;
  970. 	}
  971.  
  972. 	.leaflet-control-attribution {
  973. 		margin: 0;
  974. 		background: none;
  975. 		width: auto;
  976. 		color: #333;
  977. 		font-size: 11px;
  978. 		line-height: 1.5;
  979. 	}
  980.  
  981. 	.leaflet-control-attribution a {
  982. 		color: #0078a8;
  983. 		text-decoration: none;
  984. 	}
  985.  
  986. 	.leaflet-control-attribution a:hover {
  987. 		text-decoration: underline;
  988. 	}
  989.  
  990. 	.hamburger {
  991. 		display: flex;
  992. 		position: fixed;
  993. 		top: 15px;
  994. 		right: 15px;
  995. 		justify-content: center;
  996. 		align-items: center;
  997. 		z-index: 1000;
  998. 		cursor: pointer;
  999. 		border: none;
  1000. 		border-radius: 5px;
  1001. 		background-color: #333;
  1002. 		width: 30px;
  1003. 		height: 30px;
  1004. 		color: #9856de;
  1005. 	}
  1006. }